/*-- 
Name:          Beatrice von Singen, Hessisch Oldendorf
Url:           https://beatrice-von-singen.de
Description:   Beatrice von Singen, Hessisch Oldendorf | Symbolik, Magie und Kreativität Weserbergland
Version:       1.0 (elf42 Responsive)
______________ Webdesign by elf42 - Hameln Emmerthal */

/*-- 
_________________________ HTML > CSS; [© by elf42] -- */



@media print { 

@page { size:21cm 29.7cm; margin: 1.5cm 2cm 1cm 2.5cm; }

body { width: 16cm; margin: 0 auto; color: rgb(82,82,82); font-size: 11pt; line-height: 16pt; font-family: Arial; }


/*-- display:none --*/
#quick, #kopf #menue, #kopf img, #nav, 
#breadcrumb, .slogan, #nav-2, #bc, 
/* --- */
code, pre, 
button, 
a.btn, 
a.btn2, 
a.btn.zurueck, a.btn.weiter, a.btn.uebersicht, a.btn.uebersicht, 
.zwue2 a.btn.zurueck, .zwue2 a.btn.weiter, .zwue2 a.btn.uebersicht, 
ol.pagin, 
div.dschutz, 
/* --- */
video, iframe, 
/* --- */
.txbu, 
.acco, 
figure.biga a.biga-li, 
figure.biga a.biga-re, 
body[id*="blog-"] .c-mire:nth-child(2), 
/* --- */
footer, 
#abschluss, 
#abschluss [class*="elem-"], 
#abschluss img, 
#elf42, 
div.breakpoint, 
/* --- */
body#fehler404 main, 
body#fehler404 h1, 
body#sitemap main, 
body#webdesign main { display: none; }

#bg { background: none; }



/*-- content --*/


/* -- vermeidet seitenumbrueche nach ... -- */
h1, h2, h3, h4, h5 {     page-break-after: avoid; } 

/* -- kein seitenumbruch innerhalb von ... -- */
table, figure, .c-mire { page-break-inside: avoid; } 


#logo img { height: 3cm; margin-top: 30pt; margin-left: auto; margin-bottom: 20pt;  }
#logo a {   text-decoration: none; border: none; background: none; }

#kopf-2:after  { margin-left: 200pt;  content: "https://beatrice-von-singen.de"; color: rgb(182,182,182);}


/* ------------ */
/* ------------ */

main {        margin-top: 30pt; }
main:after  { color: rgb(142,142,142); height: 2cm; margin-top: 2cm;margin-bottom: 2cm; display: table;
              content: "Beatrice von Singen - info@beatrice-von-singen.de"; }


.box:nth-last-of-type(1), .flex:nth-last-of-type(1), [class*="col-"]:nth-last-of-type(1),
.box section:nth-last-of-type(1), .flex.flx, 
#bg, footer, [class*="col-"], section 
{                                       margin:0; }



header, #kopf-2, .c-flow, .c-full, .c-mi, #abschluss, #bc-r, #elf42 { 
                                        margin: 0; }
#abschluss, #elf42, 
.c-full {                               margin-top: 20pt; }

.c-flow, .c-full, .c-mi, 
.c-flow:nth-last-of-type(1), .c-full:nth-last-of-type(1), .c-mi:nth-last-of-type(1), 
.box, .flex, figure, 
.lsm, .offer, .bibu, .txbu, 
.flex.bi2, .flex.bi3, .flex.bi4 { 
                                        margin: 0 0 20pt 0; }


/* --- */

.c-flow {              display: flex; justify-content: space-between; align-items: stretch; 
                                       flex-direction: column;}
.c-mire {              display: flex; justify-content: space-between; align-items: flex-start; align-content: flex-start;
                                      flex-wrap : wrap; }
.c-mire:nth-child(2) { display: flex; justify-content: flex-start; 
                                      flex-direction: column; 
                                      width: 100%; }

.flex {                display: flex; justify-content: space-between; align-items: flex-start;  
                                      flex-wrap: wrap; }

.c-flow, .c-mire, .c-full, .c-mi,
.c-mire:nth-child(1), 
.c-mire:nth-child(2), 
.box, .flex, figure, 
.lsm, .bibu, .txbu, .offer, .biga, 
.flex.bi2, .flex.bi3, .flex.bi4, figcaption
.c-mire:nth-child(1) h1, .flex h1, .bibu h1, .txbu h1, .offer h1, 
.c-mire:nth-child(1) h2, .flex h2, .bibu h2, .txbu h2, .offer h2, 
.c-mire:nth-child(1) h3, .flex h3, .bibu h3, .txbu h3, .offer h3, 
{                                            width: 100%;  }

.flex.bi2 figure, 
.c-mire:nth-child(2) .flex.bi2 figure, 
figure.bi2 figure:nth-child(1), 
figure.bi2 figure:nth-child(2) {             width: 49%; }
.flex.bi3 figure, 
.c-mire:nth-child(2) .flex.bi3 figure {      width: 32%; }
.flex.bi4 figure, 
.c-mire:nth-child(2) .flex.bi4 figure {      width: 24%;}

.flex.bi2 figure img, 
.flex.bi3 figure img, 
.flex.bi4 figure img, 
.c-mire:nth-child(2) .flex.bi2 figure img, 
figure.bi2 figure:nth-child(1) img, 
figure.bi2 figure:nth-child(2) img 
{                                            width: 100%; }

figure.bi2, 
figure.bi3, 
figure.bi4 {             display: flex; justify-content: space-between; align-items: stretch; }
figure.bi3 figure {      width: 49%; height:auto; padding: 0 0.1cm; }
figure.bi3 figure {      width: 32%; height:auto; padding: 0 0.1cm; }
figure.bi4 figure {      width: 23%; height:auto; padding: 0 0.1cm; }

.flex.bi7 {              align-items: flex-start; align-content: space-between; }
.flex.bi7 figure {       width: 20%; height:auto; padding: 0 0.1cm; }

.col-1 {          width: 7.5%;}
.col-2 {          width: 18%;}
.col-3 {          width: 25%;} 
.col-4 {          width: 32.5%;}
.col-5 {          width: 41%;}
.col-6 {          width: 50%;} 
.col-7 {          width: 58%;}
.col-8 {          width: 65%;}
.col-9 {          width: 74.5%;} 
.col-10 {         width: 82%;}
.col-11 {         width: 92%;}
.col-12 {         width: 100%;}

figure.bi2 figure:nth-child(1), 
figure.bi2 figure:nth-child(2) { flex-direction: column; }

/* --- flx --- */
.flex.flx div[class*="col-"] {    order: 2; display:table; }
.flex.flx figure[class*="col-"] { order: 1; display:table; }





/*-- font --*/

h1, h2, h3, h4, h5, h6, .h1, .h2, .h3 { 
                            margin-bottom: 5pt; text-align:left; color: rgb(0,0,0); }
h1, .h1 {                   font-size: 14pt; } 
h2, .h2 {                   font-size: 12pt; }
h3, .h3, h5, h6 {           font-size: 11pt; }
h1, h2, h3, h5, h6, .h1, .h2, .h3 { 
                            font-weight: 500; }
h4, figcaption, .xs, time, cite { 
                            font-weight: 400; 
                            font-size: 10pt; color: rgb(112,112,112); }
p, span, main ul, main ol, main li, a, mark, blockquote, q, input, select, button, textarea { 
                            font-size: 11pt; font-weight: 400; }
.txt, strong {              font-weight: 600; color: rgb(52,52,52); } 
section.teaser, section.slogan { 
                            font-style:italic; } 
ol, ul, li {                text-align: left; }

mark {     color: rgb(82,82,82); background: rgb(200,200,200); }
sub, sup { line-height: 0; }



/*-- links --*/

a {               color: rgb(0,0,150); background: none; border-bottom: 1pt solid rgb(182,182,182); 
                  text-decoration: none; letter-spacing: 0.025cm; }

main a:after, 
button:after, a.btn:after, a.btn2:after { /*content: " (" attr(href) ") "; color: gray; font-size: smaller;*/ }

a.lio:any-link{          background:none; text-decoration:none; border:none; }
a.lio:any-link:after{    content: " "; }


body#impressum a:after { content: "  "; }
body#impressum a {       color: rgb(82,82,82); text-decoration:none; }
body#impressum h4 a.webdesign { font-weight: 400; letter-spacing: 0; 
                                font-size: 10pt; color: rgb(112,112,112);  text-decoration: none; border-bottom: none; }


button[type="submit"], button, a.btn { 
                                 width: 100%; height: 1.5cm; margin-bottom: 0.5cm;
                                 text-align:center; text-decoration:none; 
                                 color: rgb(82,82,82); 
                                 background: rgb(242,242,242); border: 8pt solid rgb(242,242,242); }

/*-- listen --*/
ul {       margin: 20pt 5pt; }
ol {       margin: 20pt 0; margin-block-start: 0; padding-inline-start: 0; }
ul li, ol li { margin: 0 0 8pt 0; font-size: 11pt; font-weight:400; }
ul li { list-style: disc; }
ol li { list-style: none; border-bottom: 2pt solid rgb(242,242,242); }




/*-- impressum/kontakt --*/

.addi {        margin:0 auto 0 auto; padding: 0 0 1cm 0;  }

.addi .ad {    width: 100%; display: flex; flex-direction: column; } 
.addi table {  margin:0; padding:0; width:100%; }
.addi td {     line-height: 2rem; }
.addi h2 {     padding: 0; }

.addi [class*="ad-"] { width: auto; margin:0; padding:0 1cm 0.5cm 0;  }

.addi [class*="ad-"] td:nth-child(1) { padding:0 0.5cm 0 0; width:10%; color: rgb(140,140,140); }
.addi .ad-2 td:nth-child(1), .addi .ad-3 td:nth-child(1), .addi .ad-4 td:nth-child(1) { min-width: 60px; }

.addi table td:nth-child(1) { font-weight:300; padding:0; color: rgb(140,140,140); }


/*-- formular --*/

form, 
.f-row, .f-row-1 {  display: flex; justify-content: flex-start;
                    flex-direction: column; }

.f-row, .f-row-1 {  flex-direction: row; }

form {         width: 70%; overflow:auto; margin:0 auto 0 auto; background: none; }

/* adresse */
.f-row {            width: 100%; align-items: flex-end; } 
.f-row label {      width: 48%; }
.f-row label:nth-child(1) { margin-right: 4%; }
.f-row label span { display: block; }

/* checkbox, radio */
.f-row-1 {          width: 100%;  margin: 0 0 20pt 0;
                    align-items: flex-start; flex-wrap: wrap; 
                    border-bottom: 1px solid var(--m212); }
.f-row-1 label {    display: flex; flex-direction: row; }
.f-row-1 label {    width: 48%; }


label {              width: 100%; margin: 8pt 0; 
                     background: rgb(255,255,255); text-align:left; cursor: pointer; }
label {              color: rgb(112,112,112); }


::placeholder {      display: none; color: rgb(255,255,255); }

label span {         color: rgb(112,112,112); }

input, textarea, 
input[type="checkbox"], input[type="radio"], input[name="dsgvo"] { 
                      appearance: none; -webkit-appearance: none; -moz-appearance: none; }

input, textarea { 
                      width: 100%; padding: 6px; 
                      box-sizing: border-box; outline: none; 
                      background: none; border: 1px solid rgb(182,182,182); border-bottom: 2px solid rgb(182,182,182); border-radius: var(--abora); }

textarea {            min-height: 100px; overflow: auto; }

input:invalid {                  background: var(--m255); }

input[type="checkbox"], 
input[type="radio"], 
input[name="dsgvo"] {     width: 20pt; height: 20pt; margin: 0 8pt 0 0; padding: 10px;
                          display: inline-block; vertical-align: middle; cursor: pointer;
                          background: rgb(255,255,255); border: 1px solid rgb(182,182,182); border-radius: 3pt; } 
input[type="radio"] {                                                                       border-radius: 18pt; } 

input[type=checkbox]:checked {  background: url(../others/img/hg-form-checkbox.svg) center no-repeat; background-size: 70%; background-color: var(--ci01); }
input[type=radio]:checked {     background: url(../others/img/hg-form-radio.svg) center no-repeat;    background-size: 70%; background-color: var(--ci01); }

input[type="file"] {            background: rgb(255,255,255); margin:5pt 0; border: none; }

/* hanni */
label[for=fax], input[type=fax] { display: none; }

.nv { display: none; }




/*-- profil --*/
.profil {              display: flex; justify-content: space-between; 
                       align-items: stretch; flex-wrap: wrap; 
                       width: 100%; }

.profil div:nth-child(odd) {  width: 10%; margin: 10pt 0 20pt 10pt; 
                              text-align:center; font-weight:700; border-right: 1pt solid rgb(212,212,212); }
.profil div:nth-child(even) { width: 85%; margin: 10pt 0 20pt 10pt; }



/*-- lsm --*/
.lsm {     width: 100%; margin:0; 
             display: flex; justify-content: space-between; flex-wrap : wrap; }
.lsm figure {              width: 100%; margin-bottom: 1cm; padding: 0;  }
.lsm figure img {          width: 40%; float: left; }
.lsm figure figcaption {   width: 56%; float: right; }



/*-- cards --*/
.c-offer {        width: 100%; margin:0;
                  display: flex; justify-content: space-between; align-items : stretch; 
                  flex-wrap : wrap; }

.offer {          width: 49%; margin: 0 0 20pt 0; 
                  display: flex; justify-content: space-between; flex-direction: column; 
                  background: none; }

.offer figure, 
.offer figure img, 
.offer div {       width: 100%; }
.offer a.btn {     display:none;}
.offer div.tt {    font-size: 11pt; font-weight: 700; }

/*-- bibu --*/
.bibu {          margin: 30pt 0;
                 display: flex; flex-wrap: wrap; 
                 justify-content: space-between; align-content: stretch;}

.c-full .bibu {          width:100%; margin: 0; }
.box .bibu {             width:100%; margin: 0; }
.bibu figure {           width:33%;  margin-bottom: 1cm; display: flex; flex-direction: column;  }
.bibu figure:last-child {            margin-bottom: 0; }

.bibu a:link {       background:none; text-decoration:none; border:none; }
.bibu a:link:after { content: ""; }

.bibu figure img {           width:100%; }

.bibu figure figurecaption { width:100%; margin: 0; 
                             color: rgb(112,112,112); background: rgb(255,255,255); border:none;
                             text-align:center; font-size: 10pt; }



/*-- biga --*/

/* biga - vor/zurueck */
figure.biga {            display: flex; flex-wrap: nowrap; 
                         justify-content : space-between; align-items : flex-start; 
                         margin:0;  width: 100%; display: inline-block; }

figure.biga a, .biga-kl figure a {             background:none; text-decoration:none; border:none; }
figure.biga a:after, .biga-kl figure a:after { content: ""; }

span#biga { display:block; }

div.biga-kl {          display: flex; justify-content : space-between; align-items : flex-start; flex-wrap: wrap;  }

div.biga-kl figure {   width: 16%; margin: 10pt 0; padding:0; }














} /* / print.css */