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



/* ====== allgemein mobile-first ======  */

*, *: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: 62.5%/1.5  georgia,"trebuchet ms","Open Sans",helvetica, arial, serif;
font-weight: 400;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
}


/*  die wesentlichen HINTERGRUND UND TEXTFARBEN- hier ändern sie oder fügen sie hinzu.  */

.tabellefarbe1 { background-color:#314343;}

.tabellefarbe2 {background-color:white;}

.tabellefarbe3 {background-color:#282828;}

.tabellefarbe4 { background-color:#3B3B3B;}

.text1  {color:#EEA07B;}
.text2  {color:#fff;} /*  weiss  */
.text3  {color:#000;} /*  schwarz  */
.text4  {color:#E3C277;}

/*  die wesentlichen Farben ...Ende   */



body {
font-size:1.9rem;
margin: 0 auto;
background-color:#fff;
color:#000;background-image:url(images/back0.jpg);
background-repeat:repeat;
background-position:0% 0%;
margin-top:0rem;
margin-bottom:2rem;
}

.container_haupt {
margin-bottom:0rem;
width: 100%;

}


h1, h2, h3, h4, h5 {
font-weight: normal;
margin: 0;

color:#FF8D10;
}


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;
color:#FDA622
}



img {max-width: 100%;
height: auto;
padding:0rem;
margin:0rem;
}


.lft {
text-align: left;
}

.rgt {
text-align: right;
}

.cntr {
text-align: center;
}


.bild-im-text {
display:block;
 max-width:100%;
margin-top:1rem;
margin-right:1.5rem;
margin-bottom:1rem;
}

.bild-im-text-re {
display:block;
max-width:100%;
margin-top:1rem;
margin-right:1.5rem;
margin-bottom:1rem;
}


.logo_container {
display: table;
width:100%;
table-layout:fixed;
padding:2rem;
text-align:left;
}

.logo {display: table-cell;
width: 100%;
padding:2rem;
height:29rem;
background-color:#000;
vertical-align:top;
background-image:url(images/logo.jpg);
background-repeat:no-repeat;
background-position:50% 50%;
background-color:#600001;
background-size:cover
}

.inhalt_container {
display: table;
width:100%;
table-layout:fixed;
padding:2rem;
text-align:left;
}

.inhalt {display: table-cell;
width: 100%;
padding:2rem;
height:30rem;
vertical-align:top;
background-color:#0B0302;
background-image:url(images/back.png);
background-repeat:repeat-y;
background-position:50% 50%;
}


.tabelle {
display: block;
width:100%;
table-layout:fixed;
padding:0rem;
text-align:left;border-collapse: separate;
border-spacing: 1rem;
}

.zelle {display: block;
width: 100%;
vertical-align:top;
padding-top:2rem;
padding-bottom:2rem;
}


.hpname1 {color:#DD7809;
font-size: 3rem;
padding-left:0.2rem;
padding-right:0.2rem;
text-shadow:0px 0px 3px #000;
font-weight:bold;

}

.slogan {background-image:url(images/weiss_60.png);
background-repeat:repeat;
background-position:0% 0%;
font-size: 2.2rem;
color:#2B0000;padding-left:1rem;
padding-right:1rem;

}




.fussname {padding:0.5rem;
text-align:left;
color:#DD7809;
text-shadow:0px 0px 0.3rem #000;
}

.bild-rahmen {-moz-border-radius:2rem;
-webkit-border-radius:2rem;
border-radius: 2rem;
border:solid #000 0.1rem;
-webkit-box-shadow:0rem 0rem 1rem #000;
-moz-box-shadow:0rem 0rem 1rem #000;
box-shadow:0rem 0rem 1rem #000;
}

.rahmen {-moz-border-radius:2rem;
-webkit-border-radius:2rem;
border-radius: 2rem;
border:solid #000 0.1rem;
-webkit-box-shadow:0rem 0rem 2rem #000,inset 0rem 0rem 0.4rem #000;
-moz-box-shadow:0rem 0rem 2rem #000,inset 0rem 0rem 0.4rem #000;
box-shadow:0rem 0rem 2rem #000,inset 0rem 0rem 0.4rem #000;
}

#blatt {
width:100%;
height:10rem;
background-image:url(images/blatt2.png);
background-repeat:no-repeat;
background-position:50% 0%;
}


/* ==================================== ab 360 pixel ================================== */
@media (min-width: 360px) {
.logo {
height:36rem;
}
.fussname {
font-weight:bold;}
}

/* ==================================== ab 480 pixel ================================== */
@media (min-width: 480px) {

.logo {
height:22rem;
}

.bild-im-text { max-width:33%;
float:left;margin-top:1rem;margin-right:1.5rem;margin-bottom:0rem;
margin-left:0rem;
}

.bild-im-text-re {max-width:33%;
float:right;margin-top:1rem;margin-left:1.5rem;margin-bottom:0rem;
margin-right:0rem;
}

}

/* ==================================== ab 640 pixel ================================== */
@media (min-width: 640px) {


.logo_container {
padding:2rem 3rem 2rem 3rem;
}

.logo {
height:19rem;padding:3rem ;
}


.inhalt_container {
padding:2rem 3rem 2rem 3rem;
}

.inhalt {
padding:3rem ;
}



.hpname1 {
font-size: 3.6rem;
}

.slogan {
border:solid #000 0.1rem;

-moz-border-radius-topleft:0px;
-moz-border-radius-topright:20px;
-moz-border-radius-bottomleft:0px;
-moz-border-radius-bottomright:20px;

-webkit-border-top-left-radius:0px;
-webkit-border-top-right-radius:20px;
-webkit-border-bottom-left-radius:0px;
-webkit-border-bottom-right-radius:20px;

border-top-left-radius:0px;
border-top-right-radius:20px;
border-bottom-left-radius:0px;
border-bottom-right-radius:20px;
}

}


/* ==================================== ab 680 pixel ================================== */
@media (min-width: 680px) {

html {
font: 64%/1.5 georgia,"trebuchet ms","Open Sans",helvetica, arial, serif;
}

}

/* ==================================== ab 768 pixel ================================== */
@media (min-width: 768px) {

html {
font: 66.5%/1.5 georgia,"trebuchet ms","Open Sans",helvetica, arial, serif;
}

body {
color:#000;background-image:url(images/back.jpg);}

.hpname1 {color:#591400;text-shadow:0px 0px 3px #fff;}

.fussname {color:#591400;text-shadow:0px 0px 0.3rem #fff;
}


.logo {
height:30rem;
}

.slogan {
padding:0.5rem 1.5rem 0.5rem 1.5rem;
}

.absatz-stil {text-align:justify;}

}

/* ===================================== ab 940 pixel ================================= */

@media (min-width: 940px) {

body {
background-image:url(images/back3.jpg);
}

.logo {
height:25rem;
}

.tabelle {
display: table;
width:100%;
table-layout:fixed;
padding:0rem;
text-align:left;border-collapse: separate;
border-spacing: 2rem 0rem;
}

.zelle {display: table-cell;
width: 100%;
vertical-align:top;
padding-top:2rem;
padding-bottom:2rem;
}
.hpname1 {
font-size: 4.6rem;
}

#blatt {
background-image:url(images/blatt.png);
background-repeat:no-repeat;
background-position:50% 0%;
}
}

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

@media (min-width: 1024px) {


html {
font: 68%/1.5 georgia,"trebuchet ms","Open Sans",helvetica, arial, serif;
}


.slogan {color:#2B0000;
background-color:#0B0302;
background-image:none;
padding:0.8rem 1.3rem0.8rem 1.3rem;
}




}

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

@media (min-width: 1280px) {

html {
font: 72%/1.5 georgia,"trebuchet ms","Open Sans",helvetica, arial, serif;
}

.logo_container {
padding:2rem 5rem 2rem 5rem;
}

.logo {
height:28rem;
}

.slogan {
padding:1rem 1.5rem 1rem 1.5rem;
}
.inhalt_container {
padding:2rem 5rem 2rem 5rem;
}
.inhalt {
padding:6rem 5rem  7rem  5rem ;
}

.tabelle {
padding:0rem;
border-spacing: 3rem 0rem;
}

.hpname1 {
font-size: 5rem;
}

#blatt {
background-image:url(images/blatt3.png);
background-repeat:no-repeat;
background-position:50% 0%;
}
}

/* ===================================== ab 1400 pixel ================================= */

@media (min-width: 1400px) {

html {
font: 82%/1.5 georgia,"trebuchet ms","Open Sans",helvetica, arial, serif ;
}

body {
background-image:url(images/back3.jpg);
}

#blatt {
background-image:url(images/blatt4.png);
background-repeat:no-repeat;
background-position:50% 0%;
}
.logo_container {
padding:2rem 6rem 2rem 6rem;
}

.logo {
height:30rem;
}

.inhalt_container {
padding:2rem 6rem 2rem 6rem;
}

.inhalt {
padding:8rem 5rem  9rem  5rem ;
}

.hpname1 {
font-size: 5.5rem;
}

}

/* ============================ C O D E ENDE ========================================== */