@charset "utf-8";

/** * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/) * http://cssreset.com */html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td,article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary,time, mark, audio, video {	margin: 0;	padding: 0;	border: 0;	font-size: 100%;	font: inherit;	vertical-align: baseline;}/* HTML5 display-role reset for older browsers */article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {	display: block;}ol, ul {	list-style: none;}blockquote, q {	quotes: none;}blockquote:before, blockquote:after,q:before, q:after {	content: '';	content: none;}table {	border-collapse: collapse;	border-spacing: 0;}

html { width:100%; height:100%; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% }

body {
    font-family: 'Open Sans', sans-serif;
    font-size: 14px;
    color: #333333;
    word-wrap: break-word;
    line-height: 1.4;
    letter-spacing: 1px;
    font-weight: 300;
    text-rendering: optimizeLegibility;
}
  
#data { position:relative; width:100%; }
      
#header{ position: relative; z-index: 100; overflow:hidden; height: 140px; width: 100%; background: rgba(255,255,255,1);-moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4) } 

#head_warp { position:relative; z-index:90; width:100%; height:100% }
.menu { position:absolute; z-index:100; top:100px; width:540px; height:auto; right:0px; margin-left:auto; margin-right:0;} 
.menupos { position:relative; z-index:80; width:700px; height:auto; right:0px; margin-left:auto; margin-right:0;} 

 
logo { position:absolute; z-index:100; width:600px; height:auto; left:20px; top:20px }
h-t1 { position:absolute; z-index:100; width:600px; height:auto; left:450px; top:15px; letter-spacing: 0px; font-family:'Open Sans', sans-serif; font-size:18px; font-weight:normal; color:#333  }
h-t2 { position:absolute; z-index:100; width:600px; height:auto; left:450px; top:40px; letter-spacing: -0.5px; font-family:'Open Sans', sans-serif; font-size:15px; font-weight:normal; color:#666  }

adresse { position:absolute; z-index:100; top:15px; right:40px; text-align:right; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
headinfo { position:absolute; z-index:100; top:15px; right:300px; text-align:left; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
.ihead { position:relative; top:4px; width:18px; height:auto }
.ikont1 { position:relative; top:6px; padding-right:6px; width:25px; height:auto }

.skizze { position:relative; top:0px; left:0px; width:1000px; height:auto;}

.ifoot1 { position:absolute; top:7px; left:-6px; width:30px; height:auto;}
.ifoot2 { position:absolute; top:145px; left:-10px; width:250px; height:auto }
.zabs1 { padding:0 40px 0 0px}

#main_up { position:relative; z-index:1; width:100%; background: rgba(255,255,255,1); margin:0px auto; -moz-box-shadow: 1px 1px 12px #222; -webkit-box-shadow: 1px 1px 12px #222; box-shadow: 1px 1px 12px #222} 
#main_dw { position:relative; z-index:1; width:100%; margin:0px auto; 
           background: url(../layout/bg/2338377.jpg) no-repeat center center fixed; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover; background-size: cover; background-attachment: fixed;} 

#content1{ position:relative; z-index:10; text-align:center; width:1200px; padding:50px 0px 0px 0px; margin:0px auto } 
#content2{ position:relative; z-index:10; text-align:left; width:1200px; padding:50px 0px 0px 0px; margin:0px auto } 

.cont_bg1{ position:absolute; z-index:1; width:80%; bottom:-4px; right:0px; height:auto; filter: alpha(opacity=60); opacity:0.6 } 
.cont_bg2{ position:absolute; z-index:1; width:60%; bottom:-4px; right:0px; height:auto; filter: alpha(opacity=50); opacity:0.5 } 
.cont_bg3{ position:absolute; z-index:1; width:50%; bottom:-4px; right:0px; height:auto; filter: alpha(opacity=50); opacity:0.5 }
.cont_bg7{ position:absolute; z-index:1; width:100%; bottom:-4px; right:0px; height:auto; filter: alpha(opacity=60); opacity:0.6 } 

#foot{ position:relative; z-index:10; width:100%; height:240px; background:#444444; border-top:1px solid #fff; -moz-box-shadow:1px 1px 12px #222; /* Firefox */ -webkit-box-shadow:1px 1px 12px #222; /* Chr, Saf */ box-shadow:1px 1px 12px #222; /* CSS3 */ margin:0 auto }

#foot_cont{ position:relative; top:0px; text-align:left; width:1200px; height:220px; margin:0px auto; }
#foot_end{ position:relative; z-index:10; width:100%; height:30px; background:#333; margin:0 auto; overflow:hidden;   }
.publisher { position:relative; top:5px; left:0px; text-align:left; width:1200px; margin:0px auto}

.flexbox1 { 
position:relative; 
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex;
gap: 0px 2px;
-webkit-flex-flow: row wrap;
justify-content: flex-start }

.flexbox2 { 
position:relative; 
display: -webkit-box;
display: -moz-box;
display: -ms-flexbox;
display: -webkit-flex;
display: flex; 
-webkit-flex-flow: row wrap;
justify-content:flex-start }

/* Content Box ---------------------------------------------------------------------- */	
.cont_box1 { position:relative; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around}
.cont_box2 { position:relative; padding:50px; }
.infobox1 { position:relative; width:300px; height:400px; margin:20px; border:1px solid #aaa; padding:10px; }
.infobox2 { position:relative; width:400px; height:400px; margin:20px; border:1px solid #aaa; padding:10px; }
.infobox3 { position:relative; width:80%; height:auto; margin:0px auto; text-align:center; background:rgba(123,81,83,0.5); padding:40px; border-radius:20px; -moz-border-radius:20px; -webkit-border-radius: 20px;}

.box_icon1 { position:relative; width:150px; height:auto; }
.box_icon2 { position:relative; width:500px; height:auto; }
.box_icon3 { position:relative; width:100%; height:auto; }
.box_txt1 { position:relative; font-size:16px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:justify}

.icons1 { position:relative; top:6px; padding-right:2px; width:30px; height:auto }

.punkt1 { margin-bottom:-5px; padding-right:10px; width:25px; height:25px }
.punkt2 { margin-bottom:-2px; padding-right:5px; width:18px; height:18px }

.abstand1 { line-height:100px }


/* intro ---------------------------------------------------------------------- */	
#intro {
 position:relative; 
 left:0px;
 width:100%;
 padding: 0px; margin:0px;
 border:0 none; 
 font-family: 'Open Sans', sans-serif;  }
#noscriptfeld { position:absolute; top:45%; text-align:center; font-family: Arial, Helvetica, sans-serif; font-size:38pt; font-weight:bold; width:100%; color:#cccccc }

/* Effekts -------------------------------------------------------------------------- */	
.beff1 { transition: transform 2.5s; opacity:0.80; filter:alpha(opacity=80); transition-timing-function:cubic-bezier(0.1,0.1,0.1,0.1);  transition-duration:0.4s }
.beff1:hover { transition: transform .3s; transform: scale(0.95); opacity:1; filter: alpha(opacity=100) }
.beff2 { transition: transform 2.5s; opacity:0.60; filter:alpha(opacity=60); transition-timing-function:cubic-bezier(0.1,0.1,0.1,0.1);  transition-duration:0.4s }
.beff2:hover { transition: transform .3s; transform: scale(0.95); opacity:1; filter: alpha(opacity=100) }


/* Tablet Querformat (Landscape) - PC mit geringer Auflösung */
@media only screen
  and (min-width: 1401px)
  and (max-width: 1600px) {      

logo { position:absolute; z-index:100; width:550px; height:auto; left:20px; top:20px }
h-t1 { position:absolute; z-index:100; width:600px; height:auto; left:400px; top:15px; letter-spacing: 0px; font-family:'Open Sans', sans-serif; font-size:16px; font-weight:normal; color:#333  }
h-t2 { position:absolute; z-index:100; width:600px; height:auto; left:400px; top:40px; letter-spacing: -0.6px; font-family:'Open Sans', sans-serif; font-size:14px; font-weight:normal; color:#666  }
adresse { position:absolute; z-index:100; top:15px; right:20px; text-align:right; letter-spacing: -0.2px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
headinfo { position:absolute; z-index:100; top:15px; right:220px; text-align:left; letter-spacing: -0.2px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 } 
      
.menu { position:absolute; z-index:100; top:100px; width:520px; height:auto; right:0px; margin-left:auto; margin-right:0;} 
      
}

/* Tablet Querformat (Landscape) - PC mit geringer Auflösung */
@media only screen
  and (min-width: 1221px)
  and (max-width: 1400px) {

logo { position:absolute; z-index:100; width:540px; height:auto; left:20px; top:20px }
h-t1 { position:absolute; z-index:100; width:600px; height:auto; left:400px; top:15px; letter-spacing: 0px; font-family:'Open Sans', sans-serif; font-size:16px; font-weight:normal; color:#333  }
h-t2 { position:absolute; z-index:100; width:600px; height:auto; left:400px; top:40px; letter-spacing: -0.6px; font-family:'Open Sans', sans-serif; font-size:14px; font-weight:normal; color:#666  }
adresse { position:absolute; z-index:100; top:15px; right:20px; text-align:right; letter-spacing: -0.2px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
headinfo { display:none} 
      
.menu { position:absolute; z-index:100; top:100px; width:520px; height:auto; right:0px; margin-left:auto; margin-right:0;}  
      
}


/* Tablet Querformat (Landscape) - PC mit geringer Auflösung */
@media only screen
  and (min-width: 991px)
  and (max-width: 1220px) {
      
#head_warp { position:relative; z-index:80; margin:0px auto; width:100%; height:100%; overflow:hidden; }
#content1{ position:relative; z-index:10; text-align:center; width:98%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden } 
#content2{ position:relative; z-index:10; text-align:left; width:98%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden }  

logo { position:absolute; z-index:100; width:450px; height:auto; left:20px; top:20px }
h-t1 { position:absolute; z-index:100; width:600px; height:auto; left:350px; top:14px; letter-spacing: 0px; font-family:'Open Sans', sans-serif; font-size:15px; font-weight:normal; color:#333  }
h-t2 { position:absolute; z-index:100; width:600px; height:auto; left:350px; top:37px; letter-spacing: -0.6px; font-family:'Open Sans', sans-serif; font-size:13px; font-weight:normal; color:#666  }
adresse { position:absolute; z-index:100; top:15px; right:20px; text-align:right; letter-spacing: -0.2px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
headinfo { display:none} 
      
.menu { position:absolute; z-index:100; top:100px; width:520px; height:auto; right:0px; margin-left:auto; margin-right:0;}   
      
.flexbox1 { position:relative; display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; gap: 0px 10px;-webkit-flex-flow: row wrap;justify-content: flex-start }
      
.skizze { position:relative; top:0px; left:0px; width:100%; height:auto;}
      
#foot_cont { position:relative; top:0px; text-align:left; width:100%; height:220px; margin:0px auto; overflow:hidden; }
.publisher { position:relative; top:5px; left:20px; text-align:left; width:100%; margin:0px auto; overflow:hidden;}  
}

/* Tablet Hochformat (Portrait) */
@media only screen
  and (min-width: 768px)
  and (max-width: 990px) {
      
#head_warp { position:relative; z-index:80; margin:0px auto; width:100%; height:100%; overflow:hidden; }
      
#content1{ position:relative; z-index:10; text-align:center; width:98%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden } 
#content2{ position:relative; z-index:10; text-align:left; width:98%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden }  
      
logo { position:absolute; z-index:100; width:400px; height:auto; left:20px; top:0px }
h-t1 { display:none}
h-t2 { display:none }
adresse { position:absolute; z-index:100; top:15px; right:20px; text-align:right; letter-spacing: -0.2px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
headinfo { position:absolute; z-index:100; top:14px; right:200px; text-align:left; letter-spacing: -0.2px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444} 
.ihead { position:relative; top:4px; width:16px; height:auto }
      
.menu { position:absolute; z-index:100; top:100px; width:450px; height:auto; right:0px; margin-left:auto; margin-right:0;}  
      
.flexbox1 { position:relative; display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; gap: 0px 10px;-webkit-flex-flow: row wrap;justify-content: flex-start }
.skizze { position:relative; top:0px; left:0px; width:100%; height:auto;}
      
#foot_cont { position:relative; top:0px; text-align:left; width:100%; height:220px; margin:0px auto; overflow:hidden; }
.publisher { position:relative; top:5px; left:20px; text-align:left; width:100%; margin:0px auto}   
      
}
/* Smartphone Querformat (Landscape) */
@media only screen
  and (min-width: 480px)
  and (max-width: 767px) {
      
#header{ position: relative; z-index:100; overflow:hidden; height:125px; width: 100%; background: rgba(255,255,255,1);-moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4) }          
#head_warp { position:relative; z-index:80; margin:0px auto; width:100%; height:100%; ; overflow:hidden; }
      
#content1{ position:relative; z-index:10; text-align:center; width:97%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden } 
#content2{ position:relative; z-index:10; text-align:left; width:97%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden }  

logo { position:absolute; z-index:100; width:400px; height:auto; left:10px; top:0px }
h-t1 { display:none}
h-t2 { display:none }
adresse { position:absolute; z-index:100; top:15px; right:20px; text-align:right; letter-spacing: -0.2px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
headinfo { display:none} 
      
.menu { position:absolute; z-index:100; top:90px; width:100%; height:auto; margin:0px auto }   
 
.flexbox1 { position:relative; display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; gap: 0px 10px;-webkit-flex-flow: row wrap;justify-content: flex-start }
      
.skizze { position:relative; top:0px; left:0px; width:100%; height:auto;}
      
.abstand1 { line-height:50px }

#foot{ position:relative; z-index:10; width:100%; height:440px; background:#444444; border-top:1px solid #fff; -moz-box-shadow:1px 1px 12px #222; /* Firefox */ -webkit-box-shadow:1px 1px 12px #222; /* Chr, Saf */ box-shadow:1px 1px 12px #222; /* CSS3 */ margin:0 auto }  
#foot_cont { position:relative; top:0px; text-align:left; width:100%; height:420px; margin:0px auto; overflow:hidden; }
.publisher { position:relative; top:5px; left:20px; text-align:left; width:100%; margin:0px auto}   
      
/* Content Box ---------------------------------------------------------------------- */	
.cont_box1 { position:relative; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around}
.cont_box2 { position:relative; padding:20px; }
.infobox1 { position:relative; width:250px; height:400px; margin:10px; border:1px solid #aaa; padding:10px; }
.infobox2 { position:relative; width:250px; height:450px; margin:10px; border:1px solid #aaa; padding:10px; }
.infobox3 { position:relative; width:85%; height:auto; margin:0px auto; text-align:center; background:rgba(123,81,83,0.5); padding:30px; border-radius:20px; -moz-border-radius:20px; -webkit-border-radius: 20px;}

.box_icon1 { position:relative; width:120px; height:auto; }
.box_icon2 { position:relative; width:100%; height:auto; }
.box_icon3 { position:relative; width:100%; height:auto; }
.box_txt1 { position:relative; font-size:14px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:justify}

.icons1 { position:relative; top:6px; padding-right:2px; width:24px; height:auto }
.ikont1 { position:relative; top:5px; padding-right:6px; width:22px; height:auto }
      
.punkt1 { margin-bottom:-5px; padding-right:10px; width:18px; height:18px }
.punkt2 { margin-bottom:-2px; padding-right:5px; width:12px; height:12px }

.abstand1 { line-height:100px }
}

/* Smartphone Hochformat (Portrait) */
@media only screen
  and (min-width: 280px)
  and (max-width: 479px) {
  
#header{ position: relative; z-index:100; overflow:hidden; height:105px; width: 100%; background: rgba(255,255,255,1);-moz-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4); -webkit-box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4); box-shadow: 0 3px 5px rgba(0, 0, 0, 0.4) }   
#head_warp { position:relative; z-index:80; margin:0px auto; width:100%; height:100%; overflow:hidden; }
      
#content1{ position:relative; z-index:10; text-align:center; width:96%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden} 
#content2{ position:relative; z-index:10; text-align:left; width:96%; padding:50px 0px 0px 0px; margin:0px auto; overflow:hidden }  

logo { position:absolute; z-index:100; width:280px; height:auto; left:10px; top:10px }
h-t1 { display:none}
h-t2 { display:none }
adresse { position:absolute; z-index:100; top:10px; right:20px; text-align:right; letter-spacing: -0.2px; font-size:12px; font-family:'Open Sans', sans-serif; font-weight:normal; color:#444 }
headinfo { display:none} 
  
.menu { position:absolute; z-index:100; top:70px; width:100%; height:auto; margin:0px auto } 
      
.flexbox1 { position:relative; display: -webkit-box;display: -moz-box;display: -ms-flexbox;display: -webkit-flex;display: flex; gap: 0px 10px;-webkit-flex-flow: row wrap;justify-content: flex-start }
.skizze { position:relative; top:0px; left:0px; width:100%; height:auto;}
      
#foot{ position:relative; z-index:10; width:100%; height:440px; background:#444444; border-top:1px solid #fff; -moz-box-shadow:1px 1px 12px #222; /* Firefox */ -webkit-box-shadow:1px 1px 12px #222; /* Chr, Saf */ box-shadow:1px 1px 12px #222; /* CSS3 */ margin:0 auto }  
#foot_cont { position:relative; top:0px; text-align:left; width:100%; height:420px; margin:0px auto; overflow:hidden; }
.publisher { position:relative; top:5px; left:20px; text-align:left; width:100%; margin:0px auto} 
  
/* Content Box ---------------------------------------------------------------------- */	
.cont_box1 { position:relative; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; justify-content: space-around}
.cont_box2 { position:relative; padding:15px; }
.infobox1 { position:relative; width:100%; height:250px; margin:20px; border:1px solid #aaa; padding:10px; }
.infobox2 { position:relative; width:100%; height:420px; margin:20px; border:1px solid #aaa; padding:10px; }
.infobox3 { position:relative; width:80%; height:auto; margin:0px auto; text-align:center; background:rgba(123,81,83,0.5); padding:20px; border-radius:20px; -moz-border-radius:20px; -webkit-border-radius: 20px;}

.box_icon1 { position:relative; width:100px; height:auto; }
.box_icon2 { position:relative; width:100%; height:auto; }
.box_icon3 { position:relative; width:100%; height:auto; }
.box_txt1 { position:relative; font-size:13px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:justify}

.icons1 { position:relative; top:4px; padding-right:2px; width:20px; height:auto }
.ikont1 { position:relative; top:4px; padding-right:6px; width:18px; height:auto }

.punkt1 { margin-bottom:-5px; padding-right:10px; width:18px; height:18px }
.punkt2 { margin-bottom:-2px; padding-right:5px; width:12px; height:12px }

.abstand1 { line-height:100px }
      
}
