/*-- 
Name:          Pferdewelt Waldgut Höhnscheid, Bad Arolsen
Url:           http://www.http://www.pferd-aquatrainer.de
Description:   Pferdewelt Waldgut Höhnscheid, Bad Arolsen | Aquatrainer Pferd
Version:       2.0 (Relaunch Responsive)
______________ Webdesign by elf42 - Hameln Emmerthal */

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

body { min-height:100%; color: rgb(var(--mc82)); text-align:justify; }
html { height:100%;  -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100%; } 

* {                 -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }
*:before, *:after { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; }

img {            border:none; text-decoration:none; }
table, td, div { border:0; }


/*-- body, kopf + logo 
_________________________ HTML > CSS; [© by elf42] */

body {       margin:0; padding:0; background-color: var(--bg01); }
#bg {        margin:0; padding:0 0 20px 0; 
             background: url(img/00--hg-body-top.jpg) no-repeat center top, 
                         url(img/00--hg-body-bottom.jpg) no-repeat center bottom; }
body#aquatrainer-pferd-kassel-paderborn-eisenach-marburg #bg, 
body#aquatrainer-pferd-kassel-therapiekonzept #bg {
             background: url(img/00--hg-body-top-aquatrainer.jpg) no-repeat center top, 
                         url(img/00--hg-body-bottom-aquatrainer.jpg) no-repeat center bottom; }

header {      margin:0; padding:0;                            background: none; }
#kopf-2 {     margin:0; padding:0; width: 100%; height: auto; background: none; 
              display: flex; display: -ms-flexbox; justify-content : center; -ms-flex-pack : center; align-items : center; -ms-flex-align : center; }
#logo {       position: relative; /*z-index:20;*/}

#kopf {       position: relative; background: none; }
label.menue { position: absolute; z-index:30; top: 0; left: var(--a03); }
ul.nav {      } 

main {        margin-bottom: 0; }

  @media only screen and (max-width: 425px) {
body#aquatrainer-pferd-kassel-paderborn-eisenach-marburg #bg, 
body#aquatrainer-pferd-kassel-therapiekonzept #bg, 
#bg {         background-size: 100% auto, auto 5%; }
#logo {       margin: 20px 0; }
img.logo {    width: 16vh; }
#kopf {       min-height: 30px;}
ul.nav {      margin-top: 40px; } 
} @media only screen and (min-width: 426px) {
body#aquatrainer-pferd-kassel-paderborn-eisenach-marburg #bg, 
body#aquatrainer-pferd-kassel-therapiekonzept #bg, 
#bg {         background-size: 100% auto, auto 8%; }
#logo {       margin: 5vw 0 7vw 0; }
img.logo {    width: 19vh; }
#kopf {       min-height: 30px;}
ul.nav {      margin-top: 40px; } 
} @media only screen and (min-width: 600px ) {
body#aquatrainer-pferd-kassel-paderborn-eisenach-marburg #bg, 
body#aquatrainer-pferd-kassel-therapiekonzept #bg, 
#bg {         background-size: 100% auto, auto 10%; }
#logo {       margin: 5vw 0 9vw 0; }
img.logo {    width: 24vh; }
#kopf {       min-height: 30px;}
ul.nav {      margin-top: 40px; } 
} @media only screen and (min-width: 768px) {
#logo {       margin: 5vw 0 9vw 0; }
img.logo {    width: 32vh; }
#kopf {       min-height: 30px;}
ul.nav {      margin-top: 40px; } 
} @media only screen and (min-width: 980px ) {
body#aquatrainer-pferd-kassel-paderborn-eisenach-marburg #bg, 
body#aquatrainer-pferd-kassel-therapiekonzept #bg, 
#bg {         background-size: 100% auto, auto 15%; }
#logo {       margin: 5vw 0 9vw 0; }
img.logo {    width: 36vh; }
#kopf {       min-height: 30px;}
ul.nav {      margin-top: 40px; } 
} @media only screen and (min-width: 1024px ) {
body#aquatrainer-pferd-kassel-paderborn-eisenach-marburg #bg, 
body#aquatrainer-pferd-kassel-therapiekonzept #bg, 
#bg {         background-size: 100% auto, 100% auto; }
#logo {       margin: 5vw 0 12vw 0; }
img.logo {    width: 38vh; }
#kopf {       min-height: 30px;}
} @media only screen and (orientation: landscape) {}

#logo a:link, #logo a:visited, #logo a:hover, #logo a:focus, #logo a:active { 
background: none; text-decoration:none; border:none; margin:0; padding:0; }

:root { 
--a-mob: 15px;   /* mobil (re li) */
--a-cont: 60px;  /* container (re li) */
--a-box: 30px;   /* box (oben unten) */
--a01: 15px; 
--a02: 30px; 
--a03: 60px; 
}

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

#breadcrumb {    background: none; margin: 10px 0; padding:0; }

ol.breadcrumb {  margin:0 auto 0 auto; list-style: none; background-color: var(--bc01); 
                 display: flex; display: -ms-flexbox; align-items: center; -ms-flex-align: center; flex-wrap: wrap; -ms-flex-wrap: wrap; }

ol.breadcrumb > li { font-size: 0.9em; line-height: 1.8; text-transform: none; padding: 0; 
                     display: flex; display: -ms-flexbox; align-items: center; -ms-flex-align: center;
                     background-color: transparent; color: var(--bc02); }

body#home ol.breadcrumb > li, 
body#sitemap ol.breadcrumb > li, 
body#webdesign ol.breadcrumb > li {  } 

ol.breadcrumb li > strong { padding-left:10px; }

#breadcrumb a:any-link {      font-size: 1em; line-height: 1.8; text-decoration: none; text-transform: none; }

#breadcrumb a:link, #breadcrumb a:visited { 
                              color: var(--bc03);  font-size: 1em; text-decoration: none; border: none; background: none; }
#breadcrumb a:hover, #breadcrumb a:focus, #breadcrumb a:active { 
                              color: var(--bc04); font-size: 1em; text-decoration: none; border: none; background: none; }

ol.breadcrumb a::after {     padding:0 20px; font-size: 1.3em; 
                             font-family: 'FontAwesome'; content: "\f105"; 
                             color: var(--bc05);}

  @media only screen and (max-width: 1259px) {
#breadcrumb {      width: 100%; padding: 0; }
ol.breadcrumb {    width: 100%; padding: 8px var(--a-cont); }
} @media only screen and (min-width: 1260px ) {
ol.breadcrumb {    width: 80%; padding: 8px var(--a-cont); }
} 


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

#nav-2 {      background: var(--nav2-01); }

ol.nav2 {     margin:0 auto 0 auto; padding:0; list-style: none; background-color: transparent; 
              display: flex; display: -ms-flexbox; justify-content : flex-start; -ms-flex-pack : start; flex-wrap : wrap; -ms-flex-wrap : wrap; }

ol.nav2 > li {           display: flex; display: -ms-flexbox; align-items : stretch; }
ol.nav2 > li {           color: var(--nav2-02); font: 1em/1.8; text-align:left; text-transform: none; }
ol.nav2 li::before, 
ol.nav2 li::after {       }

#nav-2 a:any-link {      font: 1em/1.8; text-decoration: none; text-transform: none; }
#nav-2 a:link, #nav-2 a:visited {
                         color: var(--nav2-03); background: var(--nav2-04); padding: 20px; }
#nav-2 a:hover, #nav-2 a:focus, #nav-2 a:active {
                         color: var(--nav2-05); background-color: var(--nav2-06); }


  @media only screen and (max-width: 1259px ) {
ol.nav2 {       width: 100%; padding:0 var(--a-cont); }
} @media only screen and (min-width: 1260px ) {
#nav-2 {        width: 80%; margin:0 auto 0 auto; }
ol.nav2 {       width: 100%; padding:0 var(--a-cont); }
}


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

#bc {         background: var(--bc06); margin:0 auto 10px auto; }

ol.bc {       margin:0 auto 0 auto; list-style: none; background-color: transparent; 
              display: flex; display: -ms-flexbox; justify-content : start; -ms-flex-pack : justify; flex-wrap : wrap; -ms-flex-wrap : wrap; }

ol.bc > li {         font-size: 1em; line-height: 1.8; text-align:left; text-transform: none; 
                     display: flex; display: -ms-flexbox; align-items : stretch; align-items: center; -ms-flex-align: center;
                     color: var(--bc07); background-color: var(--bc08); }


#bc a:any-link {      font-size: 1em; line-height: 1.8; padding: 15px; text-decoration: none; text-transform: none; }

#bc a::before, #bc a::after { padding:0 5px; content: ":"; } /* content: '\2026\0020'; */

#bc a:link, #bc a:visited { 
                              color: var(--bc09);  font-size: 1em; text-decoration: none; border: none; background: none; }
#bc a:hover, #bc a:focus, #bc a:active { 
                              color: var(--bc10); font-size: 1em; text-decoration: none; border: none; background: var(--bc11); }


  @media only screen and (max-width: 1259px) {
ol.bc {            width: 100%; padding:0 var(--a-cont); }
} @media only screen and (min-width: 1260px ) {
#bc {              width: 80%; }
ol.bc {            width: 100%; padding:0 var(--a-cont); }
} 


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

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


.c-mi {       margin:0 auto 0 auto; padding: 0 var(--a-cont); overflow:auto; background-color: var(--cont01); }
.c-full {     margin:0 auto 0 auto; padding: 0;               overflow:auto; background-color: var(--cont02); }
.c-flow {     margin:0 auto 0 auto; padding: 0 0 10px 0;                     background-color: var(--cont03); }

 @media only screen and (min-width: 1259px ) {
.c-mi {       width: 100%; }
.c-full {     width: 100%; }
.c-flow {     width: auto; }
.rev { display: flex; flex-direction: column-reverse; } 
} @media only screen and (min-width: 1260px ) {
.c-mi {       width: 80%; }
.c-full {     width: 100%; }
.c-flow {     width: 80%; }
} 




.cflow-mire {              background: var(--cont04); padding: var(--a02) 0 0 0; }
.cflow-mire:nth-child(2) { margin:0; }

.c-mire, [class*="c-mire-"] { border-bottom: 2px solid var(--ci01); }
.c-mire:nth-last-child(1) {   border: none; }


  @media only screen and (max-width: 767px ) {

.c-flow {             display: flex; display: -ms-flexbox; flex-direction: column; } 
.cflow-mire {         display: flex; display: -ms-flexbox; flex-direction: column; }

.cflow-mire:nth-child(1) { margin:0; }
.cflow-mire:nth-child(2) { margin:0; background: var(--cont04); }

body#bildergalerie-aquatrainer-pferd-eisenach .cflow-mire:nth-child(1) { order: 2; }
body#bildergalerie-aquatrainer-pferd-eisenach .cflow-mire:nth-child(2) { order: 1; }

.cflow-mire:nth-child(1) .c-mire, 
.cflow-mire:nth-child(1) [class*="c-mire-"], 
.cflow-mire:nth-child(2) .c-mire {              padding: var(--a-box) var(--a-mob); }

.cflow-mire:nth-child(1) [class*="c-mire-bi"] { padding: 0; }

.c-mire:nth-last-child(1) { border-bottom: 2px solid var(--ci01); }


}  @media only screen and (min-width: 768px ) {

.c-flow {                  display: flex; display: -ms-flexbox; justify-content: space-between; -ms-flex-pack: justify; 
                           flex-direction: column; }
.cflow-mire {              display: flex; display: -ms-flexbox; justify-content: space-between; -ms-flex-pack: justify;
                           align-items: flex-start; -ms-flex-align: start; flex-wrap : wrap; -ms-flex-wrap : wrap;
                           flex-direction: row; }

body[id*="biga-"] .cflow-mire:nth-child(1) { justify-content: flex-start; -ms-flex-pack: flex-start; flex-direction: column; }

.cflow-mire:nth-child(1) { margin:0; }
.cflow-mire:nth-child(2) { margin:0; background: var(--cont04);
                           align-items : stretch; -ms-flex-align : stretch; }

body#bildergalerie-aquatrainer-pferd-eisenach .cflow-mire:nth-child(1) { order: 2; }
body#bildergalerie-aquatrainer-pferd-eisenach .cflow-mire:nth-child(2) { order: 1; }
body[id*="biga-"] .cflow-mire:nth-child(1) { order: 2; }
body[id*="biga-"] .cflow-mire:nth-child(2) { order: 1; }

.cflow-mire:nth-child(1) .c-mire, 
.cflow-mire:nth-child(1) [class*="c-mire-"] {   padding: var(--a-box) var(--a-cont); }
.cflow-mire:nth-child(2) .c-mire {              padding: var(--a-box) var(--a02); }
body[id*="biga-"] .cflow-mire:nth-child(2) {    padding-top: 110px; }

.cflow-mire:nth-child(1) [class*="c-mire-bi"] {     padding: 0; }
.cflow-mire:nth-child(1) [class*="c-mire-txt"] {    padding-bottom: 0; }
.cflow-mire:nth-child(1) [class*="c-mire-txt"] ol { padding: 0; }

.c-mire:nth-last-child(1) { border-bottom: 2px solid var(--ci01); }

.c-mire-txt-1, .c-mire-bi-5 { border: none; } 

.c-mire {          width: 100%; }
.c-mire-bi-0 {     width: 100%; }
.c-mire-bi-1 {     width: 33.33333333%; }
.c-mire-bi-2 {     width: 66.66666667%; }
.c-mire-bi-3 {     width: 66.66666667%; }
.c-mire-bi-4 {     width: 33.33333333%; }
.c-mire-txt-1 {    width: 66.66666667%; }
.c-mire-bi-5 {     width: 33.33333333%; } /* index + service */
.c-mire-bi-6 {     width: 33.33333333%; } /* service */


body#home .c-full, 
body#service-pferde-pension-eisenach .c-full {     display: flex; display: -ms-flexbox; justify-content: space-between; -ms-flex-pack: justify;
                        border-bottom: 2px solid var(--ci01); }

body#home .c-mire-bi-5 { background: url(../images/bi-willkommen-pferde-pension-kassel-marburg-003.jpg) no-repeat top; background-size: cover; } 
body#service-pferde-pension-eisenach .c-mire-bi-5 { background: url(../images/bi-service-pferde-pension-kassel-marburg-002.jpg) no-repeat top; background-size: cover; } 
/*body#service-pferde-pension-eisenach .c-mire-bi-6 { background: url(../images/bi-service-pferde-pension-kassel-marburg-003.jpg) no-repeat top; background-size: cover; } */
body#service-pferde-pension-eisenach .c-mire-bi-6 { border-bottom: none; } 


.cflow-mire:nth-child(2) .c-mire {                   width: 50%; }
body[id*="bildergalerie-"] .cflow-mire:nth-child(2) .c-mire, 
body[id*="biga-"] .cflow-mire:nth-child(2) .c-mire { width: 100%; }

} @media only screen and (min-width: 980px ) {

.c-flow {                    flex-direction: row; }
.cflow-mire:nth-child(2) {   flex-direction: column; justify-content: flex-start; -ms-flex-pack: start; }

.cflow-mire:nth-child(1) {              width: 74%; margin:0 10px 0 0; }
.cflow-mire:nth-child(2) {              width: 26%; background: url(img/00--hg-c-re.svg) no-repeat var(--cont04); 
                                                    background-position:bottom; background-size: contain; }
body[id*="aquatrainer-pferd-kassel-"] .cflow-mire:nth-child(2) { background: url(img/00--hg-c-re-aquatrainer.svg) no-repeat var(--cont04); 
                                                    background-position:bottom; background-size: contain; }

body#bildergalerie-aquatrainer-pferd-eisenach .cflow-mire:nth-child(1) { order: 1; }
body#bildergalerie-aquatrainer-pferd-eisenach .cflow-mire:nth-child(2) { order: 2; }
body[id*="biga-"] .cflow-mire:nth-child(1) { order: 1; }
body[id*="biga-"] .cflow-mire:nth-child(2) { order: 2; }



.cflow-mire:nth-child(2) {                      padding-bottom:600px; }
.cflow-mire:nth-child(2) .c-mire { width: 100%; padding: var(--a-box); }


} @media only screen and (min-width: 1260px ) {
.cflow-mire:nth-child(2) .c-mire {             padding: var(--a-box) var(--a02); }

}

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


.box, .flex, .row, .ref, .biga, .colum { 
         margin:0 auto 0 auto; padding: 0 0 var(--a-box) 0; }

section, .box { 
         width: auto; background: var(--cont05); }


.flex {  display: flex; display: -ms-flexbox; justify-content : space-between; -ms-flex-pack : justify; 
         align-items : flex-start; -ms-flex-align : start; flex-wrap: wrap; -ms-flex-wrap : wrap; 
         background: var(--cont05); }

.row {   display: table; width: 100%; border-spacing:0; cell-spacing:0;
         background: var(--cont05); }

.row [class*="col"] { 
         display: table-cell; vertical-align: top;
         /*cell-spacing: 15px;*/ padding: 15px; 
         background: var(--cont05); /*width: 33.33%;*/ }



.colum {      column-fill: auto; column-rule: 3px double rgb(var(--mc255)); } /* automatisch X spalte, angepasst an fenstergroesse */
.colum h2 {   column-span: all; }
  @media only screen and (max-width: 599px) {
.colum {     column-count: 1; column-gap: 0; }
} @media only screen and (min-width: 600px ) {
.colum {     column-count: 2; column-gap: 20px; }
} @media only screen and (min-width: 1024px ) {
.colum {     column-count: 3; column-gap: 30px; }
}

[class*="col-"] {  min-height: 1px; margin:0; padding:0; background: none; }

.col-1 {    width: 8.33333333%;}
.col-2 {    width: 16.66666667%;}
.col-3 {    width: 25%;}
.col-4 {    width: 33.33333333%;}
.col-5 {    width: 41.66666667%;}
.col-6 {    width: 50%;}
.col-7 {    width: 58.33333333%;}
.col-8 {    width: 66.66666667%;}
.col-9 {    width: 75%;}
.col-10 {   width: 83.33333333%;}
.col-11 {   width: 91.66666667%;}
.col-12 {   width: 100%;}

/*
  @media only screen and (max-width: 599px) {
.col-1.s {  width: 8.33%;}
.col-2.s {  width: 16.66%;}
.col-3.s {  width: 25%;}
.col-4.s {  width: 33.33%;}
.col-5.s {  width: 41.66%;}
.col-6.s {  width: 50%;}
.col-7.s {  width: 58.33%;}
.col-8.s {  width: 66.66%;}
.col-9.s {  width: 75%;}
.col-10.s { width: 83.33%;}
.col-11.s { width: 91.66%;}
.col-12.s { width: 100%;}
} @media only screen and (min-width: 600px ) {
.col-1.m {  width: 8.33%;}
.col-2.m {  width: 16.66%;}
.col-3.m {  width: 25%;}
.col-4.m {  width: 33.33%;}
.col-5.m {  width: 41.66%;}
.col-6.m {  width: 50%;}
.col-7.m {  width: 58.33%;}
.col-8.m {  width: 66.66%;}
.col-9.m {  width: 75%;}
.col-10.m { width: 83.33%;}
.col-11.m { width: 91.66%;}
.col-12.m { width: 100%;}
} @media only screen and (max-width: 767px ) {
} @media only screen and (max-width: 980px ) {
} @media only screen and (min-width: 980px ) {
.col-1 {    width: 8.33333333%;}
.col-2 {    width: 16.66666667%;}
.col-3 {    width: 25%;}
.col-4 {    width: 33.33333333%;}
.col-5 {    width: 41.66666667%;}
.col-6 {    width: 50%;}
.col-7 {    width: 58.33333333%;}
.col-8 {    width: 66.66666667%;}
.col-9 {    width: 75%;}
.col-10 {   width: 83.33333333%;}
.col-11 {   width: 91.66666667%;}
.col-12 {   width: 100%;}
} @media only screen and (min-width: 1260px ) {}
*/


/*-- img, biga, ref
_________________________ HTML > CSS; [© by elf42] */

video { width: 100%; }

figure { margin:0; padding:0;
         margin-block-start:0; margin-block-end:0; margin-inline-start:0; margin-inline-end:0; }

.cflow-mire:nth-child(1) img,
.cflow-mire:nth-child(1) figure { margin:0; padding:0; float:left; }

.c-full figure {              float:left; }
.c-full figure:nth-child(1) { width: 33.33%; margin:0; padding:0; display: inline-block; }
.c-full figure:nth-child(2) { width: 66.66%; margin:0; padding:0; display: inline-block; }




/* biga - uebersicht */

div.biga, 
div.biga-ue { display: flex; display: -ms-flexbox; justify-content : space-between; -ms-flex-pack : justify; 
              align-items : flex-start; -ms-flex-align : start; 
              flex-wrap: wrap; -ms-flex-wrap : wrap;}

.cflow-mire:nth-child(1) div.biga-ue figure { position: relative; margin-bottom: 20px; padding:0; }

div.biga-ue figure a {            position: absolute; z-index: 2; bottom: 0; right:0; width: 100%; height: 100%; 
                                  background: none; }
div.biga-ue figure a:hover {      background: var(--biga01); }

div.biga-ue figure figcaption a { position: absolute; z-index: 3; bottom: 0; right:0; margin:0; padding: 0.3em 0; 
                                  width: 100%; height: 20%; text-align: center; text-decoration: none; 
                                  color: var(--biga02); background: var(--biga03); border: none; }
div.biga-ue figure figcaption a:hover, 
div.biga-ue figure figcaption a:focus, div.biga-ue figure figcaption a:active
                                { color: var(--biga04); background: var(--biga05);  }

  @media only screen and (max-width: 599px) {
div.biga-ue figure {    width: 100%; }
div.biga-ue figure figcaption { padding: 0.5em 0 0.8em 0; font-size: 1em; }
} @media only screen and (min-width: 600px ) {
div.biga-ue figure {    width: 48%; }
div.biga-ue figure figcaption { padding: 0.5em 0 0.8em 0; font-size: 1.2em; }
} @media only screen and (min-width: 768px) {
div.biga-ue figure figcaption { padding: 0.5em 0 0.8em 0; font-size: 1.2em; }
} @media only screen and (min-width: 980px ) { 
div.biga-ue figure {    width: 48%; }
div.biga-ue figure figcaption { padding: 0.5em 0 0.8em 0; font-size: 1.5em; }
}

/* biga - vor/zurueck */

.c-full figure.biga { position: relative; width: 100%; margin:0; padding:0; display: inline-block; }

figure.biga a.biga-li {         left:0; }
figure.biga a.biga-re {         right:0; text-align:right; }
figure.biga a.biga-li::before { position: absolute; top: 40%; left: 0.5em;  content: "\f104"; }
figure.biga a.biga-re::after {  position: absolute; top: 40%; right: 0.5em; content: "\f105"; }

figure.biga a {       position: absolute; z-index:3; width: 49%; height: 90%; margin:0; padding:0; 
                      font-size: 6em; font-family: 'FontAwesome'; font-weight:bold; text-decoration:none; 
                      color: var(--biga06); }
figure.biga a:hover { color: var(--biga07); }


.c-full figure.biga figcaption { line-height: 2em; font-size: 1em; text-align: center; }

/* biga - kl */

div.biga figure {   position: relative; margin-bottom: 0.9em; padding:0; }
div.biga figure a { position: absolute; z-index:3; width: 100%; height: 98%; margin:0; padding:0; }
div.biga figure a:hover, div.biga figure a:focus, div.biga figure a:active
                  { background: var(--biga08); border-bottom: 5px solid var(--biga09); }

body[id$="001"] a[href$="001.htm#biga"], body[id$="002"] a[href$="002.htm#biga"], body[id$="003"] a[href$="003.htm#biga"], body[id$="004"] a[href$="004.htm#biga"], 
body[id$="005"] a[href$="005.htm#biga"], body[id$="006"] a[href$="006.htm#biga"], body[id$="007"] a[href$="007.htm#biga"], body[id$="008"] a[href$="008.htm#biga"], 
body[id$="009"] a[href$="009.htm#biga"], body[id$="010"] a[href$="010.htm#biga"], body[id$="011"] a[href$="011.htm#biga"], body[id$="012"] a[href$="012.htm#biga"] 
                  { background: var(--biga10); border-bottom: 5px solid var(--biga11); }

@media only screen and (max-width: 599px) {
div.biga figure {    width: 48%; }
} @media only screen and (min-width: 600px) {
div.biga figure {    width: 32%; }
} @media only screen and (min-width: 768px) {
/*.cflow-mire:nth-child(2) .c-mire div.biga { width: 100%; }*/
} @media only screen and (min-width: 980px) {
div.biga figure {    width: 100%; }
}




/*-- inhalt
_________________________  Webdesign by elf42 - Hameln Emmerthal    */

html, a, h4, h5, div, p, span, ol, ul, li, input, button { font-family: "Roboto", sans-serif; line-height: 1.3em; }
h1, h2, h3, h6 {                                           font-family: "Oswald"; }

:is(h1, .h1, h2, .h2, h3, .h3 ,h4, .h4, h5, h6, .h6 ) { margin:0; text-align:left; }

h1 {               padding-bottom: 30px; color: var(--in01);       font-weight: 700; }
h2 {               padding-bottom: 30px; color: var(--in02);       font-weight: 700; }
h2.h2 {  }
h3 {               padding-bottom: 20px; color: var(--in03);       font-weight: 500; }
h3.h3 {  }
h4, figcaption {   padding-bottom: 20px; color: rgb(var(--mc112)); font-weight: 300; }
h5 {               padding: 30px 0;      color: var(--in04);       font-weight: 500; }
h6 {               padding-bottom: 20px; color: var(--in05);       font-weight: 300; }

.txt {                                   color: var(--in06); }
.xs, time {                              color: rgb(var(--mc112)); font-weight: 300; }

p {      margin:0; padding-bottom: 15px;                           font-weight: 300; }

p~h2, p~h2.h2, p~h3, p~h3.h3, p~h4 { padding-top: 20px; }

section.slogan { font-size: 1em; font-style:italic; font-weight: normal; color: var(--in07); } /* h5 */

main p, main h5, main h6, main ul li, main ol li, #abschluss .elem-4 { 
       word-wrap: break-word; 
       hyphens: auto; -webkit-hyphens: auto; -ms-hyphens: auto; 
       hyphenate-limit-chars: auto 5; hyphenate-limit-lines: 2; 
       -webkit-hyphenate-limit-chars: auto 3; -webkit-hyphenate-limit-lines: 4; 
       -ms-hyphenate-limit-chars: auto 3; -ms-hyphenate-limit-lines: 4; }

ol, ul, li { text-align: left; }
input, select, textarea, button { font-size: inherit; font-family: inherit; }

ul.nav a, ul.nav li, li.drop span, li.drop label, 
ul.navsub a {    font-size: 1em; }


  @media only screen and (max-width: 767px) {
h1 {             font-size: 1.6em; line-height: 1.4em; }
h2 {             font-size: 1.6em; line-height: 1.4em; }
h2.h2 {  }
h3 {             font-size: 1.1em; line-height: 1.4em; }
h3.h3 {  }
h4, figcaption { font-size: 0.9em; }
h5 {             font-size: 1em; }
h6 {             font-size: 1em; }
p {              font-size: 1em; }
.xs, time {      font-size: 0.9em; }
span, ol, ul, li, input, button {  font-size: 0.9em; }
main ul li, 
main ol li {     font-size: 1.1em; }
} @media only screen and (min-width: 768px) {
h1 {             font-size: 1.4em; line-height: 1.4em; }
h2 {             font-size: 1.3em; line-height: 1.4em; }
h2.h2 {  }
h3 {             font-size: 1.2em; line-height: 1.4em; }
h3.h3 {  }
h4, figcaption { font-size: 1em; }
h5 {             font-size: 1.1em; }
h6 {             font-size: 1.1em; }
p {              font-size: 1.1em; }
.xs, time {      font-size: 1em; }
span, ol, ul, li, input, button {  font-size: 1em; }
main ul li, 
main ol li {     font-size: 1.1em; }
} @media only screen and (min-width: 1260px ) {
h1 {             font-size: 1.5em; }
h2 {             font-size: 1.4em; }
h2.h2 {  }
h3 {             font-size: 1.3em; }
h3.h3 {  }
} @media only screen and (orientation: landscape) {}

::selection {            color: var(--in08); background: var(--in09); }
::-moz-selection {       color: var(--in08); background: var(--in09); }

mark { padding: 1px 2px; color: var(--in08); background: var(--in09); }

sub, sup { line-height: 0; }

code {  }
pre { font-size: 1em; white-space: pre-wrap; word-wrap: break-word; }


blockquote {             text-align:left; font-style: italic; color: var(--in10); }

blockquote span.xs{      font-style: normal; color: rgb(var(--mc128)); }
blockquote[cite]::after{ content: "« [" attr(cite) "]"; }

blockquote p::before, 
blockquote p::after {    padding: 0 0.5rem; font: 4em/1.5 Georgia, serif; color: var(--in11); }
blockquote p::before {   content: open-quote; }
blockquote p::after {    content: close-quote; }


/*-- iconfont
_________________________ elf42 */

main [class*="fa-"]:before, main [class*="icon-"]:before {
                               color: var(--in13); text-shadow: 1px 1px 1px var(--in14); 
                               vertical-align: -10%; font-size: 1.8rem; }
/* FontAwesome */
main [class*="fa-"]:before {   margin:0 0.5em 0 0.5em; }

/* social media */
#nav-2 .fa-facebook-official:before, 
#nav-2 .fa-instagram:before { font-size: 1.6rem; }

  @media only screen and (max-width: 599px) {
#nav-2 .fa-facebook-official:before { margin-left: 0; }
} @media only screen and (min-width: 600px ) {
#nav-2 .fa-facebook-official:before { margin-left: 20vw; }
} @media only screen and (min-width: 768px) {
#nav-2 .fa-facebook-official:before { margin-left: 30vw; }
} @media only screen and (min-width: 980px ) {
#nav-2 .fa-facebook-official:before { margin-left: 30vw; }
}

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

hr {           width:100%; clear:both; margin:0; padding:0; border: 1px solid var(--in12); }

[class^="a"] { width:100%; clear:both; }
  .a5 {   height:5px;}  .a10 {  height:10px;}  .a20 {  height:20px;}  .a30 {  height:30px;}  .a40 {  height:40px;} 
 .a50 {  height:50px;}  .a60 {  height:60px;}  .a70 {  height:70px;}  .a80 {  height:80px;}  .a90 {  height:90px;} 
.a100 { height:100px;} .a200 { height:200px;} .a300 { height:300px;} .a400 { height:400px;} .a500 { height:500px;}


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

a:link, a:visited {          color: var(--in15); padding: 1px 2px; background: var(--in16); font-size: inherit; text-decoration: underline; border:none; }
a:hover, a:focus, a:active { color: var(--in17); padding: 1px 2px; background: var(--in18); font-size: inherit; text-decoration: none; border:none; }
a::before, a::after {   }

a.lio:any-link{              color: rgb(var(--mc82)); cursor:default; background:none; text-decoration:none; border:none; }


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

button, a.btn {              margin:0; padding: 7px 20px; 
                             font-family: Roboto, sans-serif; font-weight: 400; font-size: 1em; 
                             display: inline-block; cursor: pointer; 
                             text-align:center; text-decoration:none; 
                             color: var(--btn01);
                             border: 1px solid var(--btn02); border-radius: 14px; 
                             background: var(--btn03); }
button:hover, a.btn:hover {  color: var(--btn04);
                             border: 1px solid var(--btn05); 
                             background-color: var(--btn06); }

button, a.btn {      width: 100%; margin-bottom: 15px; }
a.btn.zurueck {      width: 33%; }
a.btn.weiter {       width: 33%; }
a.btn.uebersicht {   width: 33%; }

a.btn::before, a.btn::after { padding: 0 20px 0 10px; vertical-align: -1%; font-size: 1.2em; line-height: 2em; 
                              font-family: 'FontAwesome'; font-weight:normal; color: var(--btn07); }
a.info::after {        content: "\f101\f101"; padding: 0 10px 0 20px; }
a.download::before {   content: "\f019"; }
a.maps::before {       content: "\f041"; font-size: 1.5em; }
a.anker::after {       content: "\f078"; }
a.tel::before {        content: "\f095"; }
a.mail::before {       content: "\f0e0"; }
a.zurueck::before {    content: "\f104"; }
a.weiter::after {      content: "\f105"; }
a.uebersicht::before { content: "\00A0";}


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

main ul {             padding: 10px 0 var(--a01) 0; margin: 0 10px 0 var(--a01); }
main ul li {          padding: 4px; position: relative; list-style: none; 
                      color: var(--ul-01); font-weight:300; }
main ul li:before {   position:absolute; left: -1em; padding: 0 15px 0 0; vertical-align: -15%; 
                      font-family: 'FontAwesome'; font-size: 1.2rem; font-weight:400; 
                      color: var(--ul-02); content: "\f101"; }

main ol {             padding: 0 0 var(--a02) 0; margin: 0; }
main ol li {          padding: var(--a01); margin: 8px; list-style: none; 
                      position: relative; left: -0.5em; font-weight:300; line-height: 1.5;
                      color: var(--ul-03); background: var(--ul-04); }
main ol li:before {   color: var(--ul-05); content: " "; }


/*-- sitemap
_________________________ elf42 */

ul.sitemap {                   margin: 0 10vh; } 
ul.sitemap li.sitemap {        padding: 15px 0 15px 6px; color: var(--ulsm-01); background: var(--ulsm-02); }
ul.sitemap li.sitemap ul {     padding: 10px 0 0 10px; color: var(--ulsm-01); background: var(--ulsm-02); }
ul.sitemap li.sitemap:before { position:absolute; left: -1em; padding:0; vertical-align: -15%; 
                               font-family: 'FontAwesome'; font-size: 1.2rem; font-weight:400; 
                               color: var(--ulsm-03); content: ""; }
ul.sitemap a:link, ul.sitemap a:visited {                       color: var(--ulsm-04); background: var(--ulsm-05); }
ul.sitemap a:hover, ul.sitemap a:focus, ul.sitemap a:active {   color: var(--ulsm-06); background: var(--ulsm-07); }



/*-- impressum, kontakt
_________________________ elf42 */


.addi {     margin:0 auto 0 auto; padding: 0 0 20px 0; 
            display: flex; display: -ms-flexbox; flex-wrap: wrap; 
            justify-content: flex-start; -ms-flex-pack : start; align-items : flex-start; -ms-flex-align : start; }

.addi .ad {    width: 100%; display: flex; display: -ms-flexbox; flex-direction: column; } 
.addi table {  margin:0; padding:0; }
.addi h2 {     padding: 0; }

.addi [class*="ad-"] { width: auto; margin:0 0 20px 0; padding:0 50px 0 0; }
.addi .ad-2 { padding:0 90px 0 0; }
.addi .ad-4 { padding:0 200px 0 0; }

.addi [class*="ad-"] { background: var(--addi01); } /* nur fuers layout ..*/

.addi [class*="ad-"] td:nth-child(1) { padding:0 15px 0 0; color: var(--addi02); }
.addi .ad-2 td:nth-child(1), .addi .ad-3 td:nth-child(1), .addi .ad-4 td:nth-child(1) { min-width: 70px; }

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

.addi a:link { padding-left: 0; }

  @media only screen and (max-width: 440px) {
.addi table tr td:nth-child(2) { overflow: hidden; white-space: nowrap; text-overflow:ellipsis; max-width: 180px; }
} @media only screen and (max-width: 1023px) {
.addi { flex-direction: column; }
} 


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

footer {      margin:0; padding:0; position:relative; background: var(--f01); }
footer hr {   width: 80%; margin:10px auto; border: 1px solid var(--ci04); }
 @media only screen and (max-width: 767px) {
footer hr {   width: 100%; }
}


#abschluss {       margin:0 auto 60px auto; background: var(--abs01); 
                   display: flex; display: -ms-flexbox; flex-wrap: wrap; justify-content: space-between; -ms-flex-pack : justify; 
                   align-items : flex-start; -ms-flex-align : start; }


#abschluss .elem { width: 100%; display: flex; flex-direction: column; } 


[class*="elem-"] { margin:0 0 20px 0; padding:0 70px 0 0; }
.elem-4 {                             padding:0; } 

#abschluss table { margin:0; padding:0; }

#abschluss p, 
#abschluss td {    color: var(--abs02); vertical-align:top; padding-bottom: 15px; } 
#abschluss a {     color: var(--abs03); text-decoration: none; background: var(--abs04); }

[class*="elem-"] td:nth-child(1) { padding:0 15px 0 0; color: var(--abs05); } /* wird hier ueberschrieben von td */
.elem-2 td:nth-child(1) { display: none; }
.elem-3 td:nth-child(1) { min-width: 65px; }
.elem-4 td:nth-child(1) { padding:0; font-size:1em; font-style:italic; font-weight: 300; line-height: 1.5em; color: var(--ci05) !important;} 


 @media only screen and (max-width: 599px) {
#abschluss { flex-direction: column; width: 100%; padding: 2em 15px 0 15px; }
.elem-3 td:nth-child(2) { overflow: hidden; white-space: wrap; }
.elem-4 td:nth-child(1) { width: 100%; }
} @media only screen and (min-width: 600px) {
#abschluss {   width: 100%; padding: 2em 30px 0 20px; 
               justify-content: flex-start; -ms-flex-pack : start; }
.elem-4 td:nth-child(1) { width: 100%; }
} @media only screen and (min-width: 768px) {
} @media only screen and (min-width: 980px ) {
#abschluss {   width: 80%; padding: 2em 0 0 0; 
               justify-content: flex-start; -ms-flex-pack : start; }
} @media only screen and (min-width: 1260px ) {
#abschluss {   width: 80%; padding: 2em 0 0 0; 
               justify-content: flex-start; -ms-flex-pack : start; }
.elem-4 td:nth-child(1) { width: 30vw;  }
} @media only screen and (min-width: 1440px ) {
#abschluss {   width: 80%; padding: 2em 0 0 0; 
               justify-content: space-between; -ms-flex-pack : justify; }
.elem-4 td:nth-child(1) { width: 34vw;  }
}

/* hoch */

#hoch {   margin:0 auto 0 auto; padding: 0; text-align:right; scroll-behavior: smooth; 
          position: absolute; right: 5vw; bottom: 100px; z-index:1; }

#hoch a{          margin:0; padding: 10px 17px; border-radius: 0; text-align: center;
                            color: var(--up01); font-size: 2rem; background: var(--up02); }
#hoch a:hover, #hoch a:focus, #hoch a:active {
                            color: var(--up03); font-size: 2rem; background: var(--up04); }

#hoch span.fa.fa-angle-up { margin: 0; padding:0; text-shadow:none; border-radius: 4px; 
                            background: none; }

  @media only screen and (max-width: 599px) {
#hoch {   right: 5vw; } 
} @media only screen and (min-width: 980px ) { 
#hoch {   right: 3vw; } 
}


/*-- webdesign
_________________________ elf42 */

body#impressum a.webdesign:any-link { background:none; text-decoration:none; border:none; color: inherit; font-weight:inherit; font-size: inherit; cursor:text; }
body#webdesign main a:any-link {      background:none; text-decoration:none; border:none; color: inherit; font-weight:inherit; font-size: inherit; cursor:text; }


/*-- related links
_________________________ elf42 */

#elf42 {               margin:0 auto 0 auto; min-height: 50px; background-color: var(--e01); overflow:auto; 
                       display: flex; display: -ms-flexbox; justify-content : space-between; -ms-flex-pack : justify; align-items : center; -ms-flex-align : center; }

#elf42 .logoelf42 {    margin: 0.7rem 1rem 0.5rem 0; padding: 0; width: 9vh; opacity: 0.7; }

#elf42 .related {      margin: 0; padding: 1.3em 0 0 0; color: var(--e02); font-size:0.7rem; text-align:right; }
#elf42 .related span { margin: 0; padding:0 0.5rem; color: var(--e02); font-size:0.8rem;}

#elf42 a, #elf42 a:link, #elf42 a:active, #elf42 a:hover, #elf42 a:focus, #elf42 a:visited { 
                       color: var(--e02); font-size:0.7rem; text-decoration:none; background:none; border:none; }

  @media screen and (max-width: 479px) {
} @media only screen and (max-width: 599px) {
} @media only screen and (min-width: 600px ) {
} @media only screen and (max-width: 767px) {
#elf42 {          flex-direction:column; }
#elf42 {          width: 100%; padding: 0 var(--a01); }
#elf42 .related { text-align:center; padding:0 0 0.7rem 0; }
} @media only screen and (min-width: 768px) {
#elf42 {          width: 100%; padding: 0 var(--a01); }
} @media only screen and (min-width: 980px ) {
#elf42 {          width: 80%; padding: 0 var(--a01); }
} @media only screen and (min-width: 1260px ) {}
@media only screen and (orientation: landscape) {}