/* = = = = = = = = = = = = = = = = = datei format.css = = = = = = = = = = = = = = = = = = = = = = = = = */







/* ############################################################ */

/* allgemein */

/* ############################################################ */

@charset "UTF-8";



*, *:before, *:after {



-moz-box-sizing: border-box;

-webkit-box-sizing: border-box;

box-sizing: border-box;

-moz-transition: width .75s ease-out;

-webkit-transition: width .75s ease-out;

transition: width .75s ease-out;

}



.clearfix:before,

.clearfix:after {

content: " ";

display: table;

}





.clearfix:after { clear:both; }

.clearfix { *zoom: 1; }



.section { clear: both;

margin: 0rem;

background:transparent;

}



html {

font-family: "comic sans ms","trebuchet ms", tahoma,georgia, "Open Sans",helvetica, arial,roboto, serif;

font-size:62.5%;

line-height:1.5;

font-weight: 400;

}



h1, h2 {

text-rendering: optimizeLegibility;

-webkit-font-smoothing: antialiased;

}





body {

font-size:1.9rem;

margin: 0 auto;

background-color:#e0d0b0;

color:#51321d;

margin:0rem;

}



.container_haupt {

margin:0rem;

background-color:#e0d0b0;

width: 100%;

}



/* überschriften */

h1, h2, h3, h4, h5 {

font-weight:normal;

}



h1 {

font-size:2.9rem;

line-height: 3.2rem;

margin-top: 0rem;

margin-bottom: 3.5rem;

}



h2 {

font-size:2.4rem;

line-height: 2.8rem;

margin-top: 0rem;

margin-bottom: 3rem;

}



h3 {

font-size:2rem;

line-height: 2.3rem;

margin-top: 1.5rem;

margin-bottom:1rem;

}







img {

	max-width: 100%;

	height: auto;

	padding:0rem;

	margin:0rem;

	color: #D6D6D6;

}



pre {

margin-bottom:2rem;

}



/* ############################################################ */

/* allgemein - speziell*/

/* ############################################################ */



.rund {

border-radius:36rem;

}





.bild-im-text {

display:block;

max-width:100%;

margin:4rem auto;

border:solid  0.8rem;

border-color: #51321d;

}



.bild-im-text-re {

display:block;

max-width:100%;

margin:4rem auto;

border:solid  0.8rem;

border-color: #51321d;

}



/*Bildergalerie*/



	/*GROW*/

.grow img { 

  height: 200px;

  width: 200px;

  margin: 4rem auto;

  border: solid  0.4rem;

  border-color: #51321d;

  

  -webkit-transition: all 1s ease;

     -moz-transition: all 1s ease;

       -o-transition: all 1s ease;

      -ms-transition: all 1s ease;

          transition: all 1s ease;

}

 

.grow img:hover {

  width: 500px;

  height: 500px;

}





/* ############################################################ */

/* bereich TOP */

/* ############################################################ */



.bereich-top {background::#e0d0b0;color:#51321d;}



.bereich-top .zelle {display:table-cell;

width:100%;

order-collapse:separate;

}



.bereich-top .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 0rem 0rem;

}



.zelle-top {display: table-cell;vertical-align:top;

text-align:center;

width:100%;

height:0rem;

padding:0rem;

}





.hpname1 {display:block;

font-weight:bold;

font-size: 3.5rem;

line-height:4rem;

padding-top:0rem;

padding-bottom:0rem;

color:#51321d

}



.bereich-top .text {padding:6rem 0rem 2rem 0rem;

}





/* ############################################################ */

/* bereich logo */

/* ############################################################ */



.bereich-logo {

color:#51321d;

background-image:url(images/logo0.jpg);

background-repeat:repeat;

background-position:50% 50%;

background-color:#e0d0af;

background-size:cover;

border-top: solid 0.5rem #51321d;

border-bottom: solid 0.5rem #51321d;



}





.bereich-logo .zelle {display:table-cell;

width:100%;

vertical-align:top;

border-collapse:separate;

}



.bereich-logo .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 0rem 0rem;

}



.zelle-logo {display: table-cell;

width: 100%;

height:88vh;

text-align:center;

vertical-align:top;

}





.seitentitel {display:block;

background:#e0d0b0(255,255,255,0.8);

font-weight:normal;

font-size: 3rem;

line-height:3rem;

padding-top:1rem;

padding-bottom:1rem;

color:#51321d;

}



/* ############################################################ */

/* bereich info 1 */

/* ############################################################ */



.bereich-info1  {background-color:#e0d0b0;

color:#51321d;font-style:normal;

padding:4rem 0rem 4rem 0rem;

}



.bereich-info1 h2 {color:#51321d;text-align:right;

font-size:3.2rem;

line-height: 3.8rem;

}





.bereich-info1 hr {margin:0 auto;margin-top:2rem;margin-bottom:2rem;

background:transparent;

border:none;width:100%;

border-bottom: dashed 0.1rem #51321d;

height:0.1rem; }



.bereich-info1 .zelle {display:table-cell;

width:100%;

vertical-align:top;

border-collapse:separate;

}



.bereich-info1 .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 2rem 1rem;

margin:0 auto;

}



.zelle-info1a {display: block;

width: 100%;

margin-bottom:2rem;

vertical-align:middle;

text-align:right;

padding:0rem 0rem 0rem 8rem;

}



.zelle-info1b {display: block;

width: 100%;

margin-bottom:2rem;

vertical-align:middle;

text-align:left;

padding:0rem 0rem 0rem 2rem;

}





.bereich-info1 .text {

}



.bereich-info1 .foto {

width:100%;

}



.bereich-info1 .fa {

padding:1rem;

}





.bereich-info1 img {max-width: 70%;

border-radius:36rem;

height: auto;

padding:0rem;

margin:0rem;

border:solid 0.6rem #51321d;

}





/* ========== links bereich-info1 ========== */



.bereich-info1 a:link, .bereich-info1 a:visited, .bereich-info1 a:active{

color:#51321d;display:inline-block;background-color:#e0d0b0;

text-shadow:none;

text-decoration: none;

padding-right:1rem;

padding-left:1rem;

}



.bereich-info1 a:hover  {

color:#51321d;

text-decoration: underline;

}





/* ############################################################ */

/* bereich info 2 */

/* ############################################################ */



.bereich-info2  {background-color:#e0d0b0;

color:#51321d;

font-style:normal;

padding:4rem 0rem 4rem 0rem;

}



.bereich-info2 h2 {color:#51321d;margin-bottom:0;text-align:left;

font-size:3.2rem;

line-height: 3.8rem;

}



.bereich-info2 hr {margin:0 auto;margin-top:2rem;margin-bottom:2rem;

background:transparent;

border:none;width:100%;

border-bottom: dashed 0.1rem #51321d;

height:0.1rem; }







.bereich-info2 .zelle {display:table-cell;

width:100%;

vertical-align:top;

border-collapse:separate;

}



.bereich-info2 .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 2rem 1rem;

margin:0 auto;

}

.zelle-info2a {display: block;

width: 100%;

text-align:center;

margin-bottom:2rem;

vertical-align:middle;

border-radius:2rem;

text-align:right;

padding:0rem 2rem 0rem 0rem;

}



.zelle-info2b {display: block;

width: 100%;

text-align:left;

margin-bottom:2rem;

vertical-align:middle;

border-radius:2rem;

text-align:left;

padding:0rem 8rem 0rem 0rem;

}





.bereich-info2 .text {

	font-weight: bold;

}



.bereich-info2 .foto {

margin:0;

padding:0rem 0rem 0rem 0rem;

}



.bereich-info2 .fa {

color:#51321d;

padding:1rem;

}



.bereich-info2 img {max-width: 70%;border-radius:36rem;

height: auto;

padding:0rem;

margin:0rem;

border:solid 0.6rem #51321d;

}





/* ========== links bereich-info2 ========== */

.bereich-info2 a:link, .bereich-info2 a:visited, .bereich-info2 a:active{

color:#51321d;display:inline-block;

background-color:#e0d0b0;

text-shadow:none;

text-decoration: none;

padding-right:1rem;

padding-left:1rem;

}



.bereich-info2 a:hover  {

color:#51321d;

text-decoration: underline;

}





/* ############################################################ */

/* bereich info 3 */

/* ############################################################ */



.bereich-info3  {background-color:#e0d0b0;

color:#51321d;

padding:4rem 0rem 4rem 0rem;

}



.bereich-info3 h2 {color:#51321d;margin-bottom:0;text-align:right;

font-size:3.2rem;

line-height: 3.8rem;

}



.bereich-info3 hr {margin:0 auto;margin-top:2rem;margin-bottom:2rem;

background:transparent;

border:none;width:100%;

border-bottom: dashed 0.1rem #51321d;

height:0.1rem; }





.bereich-info3 .zelle {display:table-cell;

width:100%;

vertical-align:top;

border-collapse:separate;

}



.bereich-info3 .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 2rem 1rem;

margin:0 auto;

}



.zelle-info3a {display: block;

width: 100%;

margin-bottom:2rem;

vertical-align:middle;

border-radius:2rem;

text-align:right;

padding:0rem 0rem 0rem 8rem;

}



.zelle-info3b {display: block;

width: 100%;

margin-bottom:2rem;

vertical-align:middle;

border-radius:2rem;

text-align:left;

padding:0rem 0rem 0rem 2rem;

}



.bereich-info3 .text {

}



.bereich-info3 .foto {

margin:0;

padding:0rem 0rem 0rem 0rem;

}







.bereich-info3 .fa {

padding:1rem;

}





.bereich-info3 img {max-width: 70%;border-radius:36rem;

height: auto;

padding:0rem;

margin:0rem;

border:solid 0.6rem #51321d;

}





/* ========== links bereich-info3 ========== */



.bereich-info3 a:link, .bereich-info3 a:visited, .bereich-info3 a:active{

display:inline-block;

background-color:#e0d0b0;

color:#51321d;

text-shadow:none;

text-decoration: none;

padding-right:1rem;

padding-left:1rem;

}



.bereich-info3 a:hover  {

color:#51321d;

text-decoration: underline;

}





/* ############################################################ */

/* bereich info 4 */

/* ############################################################ */



.bereich-info4  {background-color:#e0d0b0;

color:#51321d;

font-style:normal;

padding:4rem 0rem 4rem 0rem;

}



.bereich-info4 h2 {

	color:#51321d;

	margin-bottom:0;

	text-align:right;

	font-size:3.2rem;

	line-height: 3.8rem;

}



.bereich-info4 hr {margin:0 auto;margin-top:2rem;margin-bottom:2rem;

background:transparent;

border:none;width:100%;

border-bottom: dashed 0.1rem #51321d;

height:0.1rem; }







.bereich-info4 .zelle {display:table-cell;

width:100%;

vertical-align:top;

border-collapse:separate;

}



.bereich-info4 .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 2rem 1rem;

margin:0 auto;

}

.zelle-info4a {display: block;

width: 100%;

text-align:center;

margin-bottom:2rem;

vertical-align:middle;

border-radius:2rem;

text-align:right;

padding:0rem 2rem 0rem 0rem;

}



.zelle-info4b {display: block;

width: 100%;

text-align:left;

margin-bottom:2rem;

vertical-align:middle;

border-radius:2rem;

text-align:left;

padding:0rem 8rem 0rem 0rem;

}





.bereich-info4 .text {

}



.bereich-info4 .foto {

margin:0;

padding:0rem 0rem 0rem 0rem;

}



.bereich-info4 .fa {

padding:1rem;

background:transparent;

}





.bereich-info4 img {max-width: 70%;border-radius:36rem;

height: auto;

padding:0rem;

margin:0rem;

border:solid 0.6rem #51321d;

}





/* ========== links/menü - bereich-info4 ========== */



.bereich-info4 ul {

margin:0;

padding:0;

}



.bereich-info4 li {

	display:block;

	list-style-type: none;

	margin:0;

	padding:0;

	text-align: left;

}



.bereich-info4 a:link, .bereich-info4 a:visited, .bereich-info4 a:active{

color:#51321d;display:inline-block;

padding-right:1rem;

padding-left:1rem;



background-color:#e0d0b0;

text-shadow:none;

text-decoration: none;

}



.bereich-info4 a:hover  {

color:#51321d;

text-decoration: underline;

}







/* ############################################################ */

/* bereich fuss */

/* ############################################################ */



.bereich-fuss {background-color:#e0d0b0;

color:#51321d;border-top: solid 0.5rem #51321d;

padding-top:3.5rem;

padding-bottom:3.5rem;

}



.bereich-fuss .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 0rem 0rem;

}



.zelle-fuss {display:block;

width: 100%;

text-align:center;

padding:0rem;

}



.bereich-fuss .fa {

color:#e0d0b0;

}



.fussname {

color:#51321d;

font-size:1.6rem;

padding:1rem 0rem 1rem 0rem;

text-transform:uppercase;

}



.totop {

display:inline-block;vertical-align:middle;text-align:center;

padding:1rem;

}



.totop .fa {color:#51321d;

}





/* ========== links/menü - bereich-fuss ========== */

.fussmenu  {width:100%;

margin:0;

}



.bereich-fuss ul {

padding: 0rem;

margin:0;

}



.bereich-fuss li { display: inline}



.bereich-fuss a:link, .bereich-fuss a:visited, .bereich-fuss a:active{

display:inline-block;

background:transparent;

color:#51321d;

margin:0.5rem 0.5rem 0.5rem 0.5rem;

text-decoration:underline;

}



.bereich-fuss a:hover{ text-decoration:none;

color:#51321d;background:transparent;

}









/* ############################################################ */

/* bereich fuss - auf den unterseiten */

/* ############################################################ */

.bereich-fuss.unterseiten {border-top: solid 0.5rem #51321d;

}





/* ############################################################ */

/* bereich inhalt - auf den unterseiten */

/* ############################################################ */



.bereich-inhalt {

width: 100%;

background-color:#e0d0b0;

color:#51321d;

padding:0rem;

}



.bereich-inhalt h1, .bereich-inhalt h2,  .bereich-inhalt h3  {color:#51321d;}



.bereich-inhalt .tabelle {display: table;

width:100%;

table-layout:fixed;

border-spacing: 0rem 0rem;

}

.g2g-respo-table {display: block;}

.g2g-respo-table * {
box-sizing:border-box;
}
.g2g-respo-table table {
width:100%;
}

.g2g-respo-table table,
.g2g-respo-table td,
.g2g-respo-table tr,
.g2g-respo-table th {
border:2px solid black;
border-collapse: collapse;
text-align: left;
}

.g2g-respo-table td,
.g2g-respo-table tr,
.g2g-respo-table th {
	padding: 1em;
	font-size: 18px;
}

.g2g-respo-table th {
background:#eee;
font-weight: bold;
}

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

.g2g-respo-table tr {
border-bottom: none;
}

.g2g-respo-table td {
padding:0;
border:1px solid black;
}

.g2g-respo-table table {
border:none;
}

.g2g-respo-table thead {
display:none;
}

.g2g-respo-table tr {
float: left;
width: 100%;
margin-bottom: 2em;
}

.g2g-respo-table td {
float: left;
width: 100%;
padding:1em !important;
border-left: 1px;
border-right: 1px;
}

.g2g-respo-table td::before {
content:attr(data-label);
word-wrap: break-word;
background: #eee;
border-right: 1px solid black;
width: 20%;
float:left;
padding:1em;
font-weight: bold;
margin:-1em 1em -1em -1em;
}
}

.zelle-inhalt{display:block;

width: 100%;

padding:5rem 2rem 5rem 2rem;

min-height:20rem;

}



/* ========== links - bereich-inhalt ========== */



.bereich-inhalt a:link, .bereich-inhalt a:visited, .bereich-inhalt a:active{

color:#51321d;display:inline-block;background-color:#e0d0b0;

text-shadow:none;

text-decoration: none;

}



.bereich-inhalt a:hover  {

color:#51321d;

text-decoration: underline;

}





/* ############################################################ */

/* R  E  S  P  O  N  S  I  V  E */

/* ############################################################ */



/* ==================================== ab 360 pixel ================================== */

@media (min-width: 360px) {



.zelle-logo {

height:60vh;

}



}





/* ==================================== ab 480 pixel ================================== */

@media (min-width: 480px) {



.zelle-logo {

height:90vh;

}



.bild-im-text {

max-width:80%;

}



.bild-im-text-re {

max-width:80%;

}



}



/* ==================================== ab 600 pixel ================================== */

@media (min-width: 600px) {







.zelle-info1a {display: table-cell;

padding:0rem 0rem 0rem 2rem;

}



.zelle-info1b {display: table-cell;

padding:0rem 0rem 0rem 0rem;

}





.zelle-info2a {display: table-cell;

padding:0rem 0rem 0rem 0rem;

}



.zelle-info2b {display: table-cell;

padding:0rem 2rem 0rem 0rem;

}



.zelle-info3a {display: table-cell;

padding:0rem 0rem 0rem 2rem;

}



.zelle-info3b {display: table-cell;

padding:0rem 0rem 0rem 0rem;

}



.zelle-info4a {display: table-cell;

padding:0rem 0rem 0rem 0rem;

}



.zelle-info4b {display: table-cell;

padding:0rem 2rem 0rem 0rem;

}



zelle-fuss {display:table-cell;

}



.bild-im-text {

max-width:80%;

}



.bild-im-text-re {

max-width:80%;

}



}



/* ==================================== ab 640 pixel ================================== */

@media (min-width: 640px) {











.zelle-inhalt {

padding:5rem 5rem 5rem 5rem;

}



}





/* ==================================== ab 680 pixel ================================== */

@media (min-width: 680px) {



html {

font-size:64%;

}





}



/* ==================================== ab 768 pixel ================================== */

@media (min-width: 768px) {



html {

font-size:66.5%;}



.zelle-logo {

height:50vh;

}



.zelle-inhalt {text-align:justify;}



.bereich-top .text {padding:3rem 0rem 2rem 0rem;

}



.seitentitel {display:none;

}







}



/* ===================================== ab 800 pixel ================================= */



@media (min-width: 800px) {





.bild-im-text {float:left;max-width:30%;

margin-top:1rem;margin-right:1.5rem;margin-bottom:0rem;

margin-left:0rem;

}



.bild-im-text-re {float:right;max-width:30%;

margin-top:1rem;margin-left:1.5rem;margin-bottom:0rem;

margin-right:0rem;

}



}



/* ===================================== ab 1024 pixel ================================= */



@media (min-width: 1024px) {



html {

font-size:69%;}



.zelle-logo {

height:75vh;

}





.bild-im-text {

margin-top:1rem;margin-right:2rem;margin-bottom:0.5rem;

margin-left:0rem;

}



.bild-im-text-re {

margin-top:1rem;margin-left:2rem;margin-bottom:0.5rem;

margin-right:0rem;

}







}



/* ===================================== ab 1280 pixel ================================= */



@media (min-width: 1280px) {



html {

font-size:72%;}



x.hpname1 {

font-size: 5rem;

line-height:6rem;

}





.zelle-info1a {

padding:0rem 0rem 0rem 8rem;

}



.zelle-info1b {

padding:0rem 0rem 0rem 2rem;

}





.zelle-info2a {

padding:0rem 2rem 0rem 0rem;

}



.zelle-info2b {

padding:0rem 8rem 0rem 0rem;

}



.zelle-info3a {

padding:0rem 0rem 0rem 8rem;

}



.zelle-info3b {

padding:0rem 0rem 0rem 2rem;

}



.zelle-inhalt {

padding:5rem 8rem 5rem 8rem;

}



}



/* ===================================== ab 1420 pixel ================================= */



@media (min-width: 1420px) {



html {

font-size:82%;

}







}











/* +  +  +  +  + +  +  +  +  +  C O D E ENDE  +  +  +  +  +  +  +  +  +  + */
