/* = = = = = = = = = = = = = = = = = 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;
}

.cf:before,
.cf:after {
content: " ";
display: table;
}

.cf:after { clear: both; }
.cf { *zoom: 1; }

.section { clear: both;
margin: 0px;
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;
}


body {
font-size:1.9rem;
margin: 0 auto;
background-color:#000;
color:#00172F;
}


.main {
margin-bottom:0px;
width: 100%;
}


h1, h2, h3, h4, h5 {
font-weight: 600;
margin: 0;
color:#000;
}

h1 {
font-family:Tangerine; Georgia; serif;
font-size:4rem;
line-height: 4rem;
margin-top: 0rem;
margin-bottom: 3.5rem;
}

h2 {
font-family:Tangerine; Georgia; serif;
font-size:3rem;
line-height: 3rem;
margin-top: 0rem;
margin-bottom: 3rem;
}

h3 {
font-family:Tangerine; Georgia; serif;
font-size:2.5rem;
line-height: 2.5rem;
margin: 0rem;
}


img {max-width: 100%;
height: auto;
 padding: 10px;
 background-color: #F5F5F5;
 border: 1px solid black;
 border-radius: 8px;
 box-shadow: 10px 20px 30px 0px #888;
 -webkit-box-shadow: 10px 20px 30px 0px #888;
 -moz-box-shadow: 10px 20px 30px 0px #888;
 display: inline-block;
}

.img1 {max-width: 100%;
height: auto;
 padding: 0px;
 background: transparent;
 border: none;
 box-shadow:none;
 }

.btt {text-align:center;
font-family:Tangerine; Georgia; serif;
font-size: 3rem;
font-weight: 500;
text-decoration:none;
white-space: pre;
color:#696969;
text-shadow: 0.5rem 0.5rem 0.5rem
}

.arrow {
  position: relative;	
  border: 15px solid #2F4F4F;
  padding: 1rem 1rem 1rem 1rem;
  display: inline-block;
  font-size:0;line-height:0;height:0;padding:0;margin:0;
}

.arrow.up {
  width: 0; 
  height: 0; 
  border-top-color:    transparent;
  border-right-color:  transparent;
  border-left-color:   transparent;
  -moz-transform: scale(0.9999);
}


.bg1 {background: #FFFAFA; border: 0px;
background: -moz-linear-gradient(top, #FFFAFA, #DCDCDC);    
background: -webkit-linear-gradient(top, #FFFAFA, #DCDCDC);
background: -ms-linear-gradient(top, #FFFAFA, #DCDCDC);
background: -o-linear-gradient(top, #FFFAFA, #DCDCDC);
box-shadow: 1px 2px 4px rgba(0,0,0, .2);
}


.bg2 {background: #C0C0C0; border: 0px;
background: -moz-linear-gradient(top, #000, #C0C0C0);    
background: -webkit-linear-gradient(top, #000, #C0C0C0);
background: -ms-linear-gradient(top, #000, #C0C0C0);
background: -o-linear-gradient(top, #000, #C0C0C0);
box-shadow: 1px 2px 4px rgba(0,0,0, .2);}



.text1  {color:#000;}
.text2  {color:white;font-family:Tangerine;}
.text3  {color:black;text-shadow: 1px 1px 1px white}
.text4  {color:white;font-family:Tangerine;font-size: 6rem}


.title {
font-family:Tangerine;
font-size: 4rem;
color:#696969;
text-shadow: 0.5rem 0.5rem 0.5rem
}

.seitentitel {
font-family:Tangerine; Georgia; serif;
font-size:5rem;
color:#D3D3D3;
line-height: 3rem;
margin-top: 1rem;
margin-bottom: 3rem;
margin-left: 3rem;
}

.rund {
-moz-border-radius:360px;
-webkit-border-radius:360px;
border-radius:360px;
}

.box-shad {
-webkit-box-shadow:  0rem 0rem 1.2rem #000;
-moz-box-shadow:  0rem 0rem 1.2rem #000;
box-shadow:  0rem 0rem 1.2rem #000;
}

.col {
margin: 0 auto;
padding: 1.5rem;}

.col.flow-opposite { text-align:left;
}

.abs {padding-left:1rem;padding-right:1rem;padding-top:5rem;padding-bottom:5rem;}

.headback {
background-image:url(images/head.jpg);
background-repeat:no-repeat;
background-position:50% 50%;
height:40rem;
}

br.next {
    clear: both
  }

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

.col {
float: left;
}

.abs {padding-left:3rem;padding-right:3rem;padding-top:5rem;padding-bottom:5rem;}


.col.span_1_of_1 { width: 100%;}
.col.span_1_of_2 { width: 100%;}
.col.span_1_of_3 { width: 100%;}
.col.span_1_of_4 { width: 100%;}

}

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


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


.col.flow-opposite { text-align:right;
}


.abs {padding-left:3rem;padding-right:3rem;padding-top:5rem;padding-bottom:5rem;}

.col.span_1_of_1 { width: 100%;}
.col.span_1_of_2 { width: 50%;}
.col.span_1_of_3 { width: 100%;}
.col.span_1_of_4 { width: 50%;}

}

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

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


.col.flow-opposite { text-align:right;
}
.col.flow-opposite2 { text-align:right;
}

.abs {padding-left:4rem;padding-right:4rem;padding-top:5rem;padding-bottom:5rem;}


.col.span_1_of_1 { width: 100%;}
.col.span_1_of_2 { width: 50%;}
.col.span_1_of_3 { width: 33.33%;}
.col.span_1_of_4 { width: 50%;}

}

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

@media (min-width: 1024px) {


.col.flow-opposite { text-align:right;
}
.col.flow-opposite2 { text-align:right;
}
.abs {padding-left:4rem;padding-right:4rem;padding-top:5rem;padding-bottom:5rem;}

.col.span_1_of_1 { width: 100%;}
.col.span_1_of_2 { width: 50%;}
.col.span_1_of_3 { width: 33.33%;}
.col.span_1_of_4 { width: 25%; padding-left: 5px;}

}

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

@media (min-width: 1280px) {

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


.col.flow-opposite { text-align:right;
}
.col.flow-opposite2 { text-align:right;
}
.abs {padding-left:6rem;padding-right:6rem;padding-top:6rem;padding-bottom:6rem;}

}

/* ===================================== ab 1500 pixel ================================= */

@media (min-width: 1500px) {

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


.abs {padding-left:10rem;padding-right:10rem;padding-top:9rem;padding-bottom:9rem;}

}

a:link, a:visited, a:active{
color:#2F4F4F;
text-decoration:underline;
}

a:hover{ 
color:#000;
text-decoration:none;
}



#menu a {font-size:1.9rem;}


#menu {width:100%;
margin:0 auto;
padding-bottom: 0rem;
}

#menu ul {display: inline-block;
margin:0rem;
padding: 0rem;
}



#menu li {display:block;
list-style-type: none;
margin:0rem;
padding: 0rem;
}

#menu li a:link, #menu li a:visited, #menu li a:active {display:inline-block;
width:25rem;
background-image:url(images/weiss_50.png);
background-repeat:repeat;
background-position:50% 50%;
color:#22310F;
margin-bottom:0.6rem;
padding-top:0.6rem;
padding-bottom:0.6rem;
padding-left:1rem;
padding-right:1rem;
border:solid 1px #002851;
vertical-align:middle;
text-decoration:none ;
-moz-border-radius:0.6rem;
-webkit-border-radius:0.6rem;
border-radius:0.6rem;
text-shadow: 0.1rem 0.1rem 0.1rem #fff;
-webkit-box-shadow: 0rem 0rem 0.6rem #000;
-moz-box-shadow: 0rem 0rem 0.6rem #000;
box-shadow:  0rem 0rem 0.6rem #000;
}


#menu li a:hover {
background-image:url(images/weiss_20.png);
background-repeat:repeat;
background-position:50% 50%;
color:#000;
text-shadow: 0.1rem 0.1rem 0.1rem #fff;
text-decoration:none ;

}



/* = = = = = = = = = = = = = = = = = = = = = = ab 360 PX= = = = = = = = = = = = = = = = = = = = */

@media (min-width: 360px) {


#menu li a:link, #menu li a:visited, #menu li a:active {
width:26rem;
}

}

/* = = = = = = = = = = = = = = = = = = = = = = ab 1200 PX= = = = = = = = = = = = = = = = = = = = */

@media (min-width: 1200px) {


#menu ul {
padding-right: 5rem;
}

}

/* = = = = = = = = = = = = = = = = = = = = = = ab 1500 PX= = = = = = = = = = = = = = = = = = = = */

@media (min-width: 1500px) {


#menu ul {
padding-right: 9rem;
}

}



#menu2 a {font-size:1.9rem;}

#menu2 h3 {text-align:left;color:#000;
margin-top: 0rem;
margin-bottom: 2rem;
padding-left:0.6rem;
padding-right:0.6rem;}

div#menu2 {width:100%;
margin:0rem;
padding: 0rem;
}

#menu2 ul {
margin:0rem;
padding: 0rem;
}


#menu2 li {
list-style-type: none;
margin:0rem;
padding-left: 1rem;
}

#menu2 li a:link, #menu2 li a:visited, #menu2 li a:active {
color:#fff;
text-shadow: 0.1rem 0.1rem 0.1rem #000;
text-decoration:none ;
margin-bottom:0.6rem;
padding-top:0.6rem;
padding-bottom:0.6rem;
padding-left:1rem;
padding-right:1rem;
vertical-align:middle;
text-decoration:none;

}


#menu2 li a:hover {
color:#000;
text-shadow: 0.1rem 0.1rem 0.1rem  #fff;
text-decoration:none ;
background-color:#E6E6E6;
}



/* = = = = = = = = = = = = = = = = = = = = = = ab640 PX= = = = = = = = = = = = = = = = = = = = */

@media (min-width: 640px) {

#menu2 a {font-size:2.7rem;}

}

/* = = = = = = = = = = = = = = = = = = = = = ab1024 PX = = = = = = = = = = = = = = = = = = = = = */


@media (min-width: 1024px) {

#menu2 a {font-size:2.4rem;}

}

/* = = = = = = = = = = = = = = = = = = = = = ab1280 PX = = = = = = = = = = = = = = = = = = = = = */


@media (min-width: 1280px) {

#menu2 a {font-size:2.2rem;
letter-spacing:0.1rem;}

}