@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%; scroll-behavior: smooth;}
body { font-family: 'Open Sans', sans-serif; font-size: 12px; -webkit-text-size-adjust:100%; color:#000000; width:100%; height:100%; background:#aaa; border:0 none;scroll-behavior: smooth;}	

/* Works on Firefox */
* {
  scrollbar-width: thin ;
  scrollbar-color: #666666 #ffffff }

/* Works on Chrome, Edge, and Safari */
*::-webkit-scrollbar {width: 15px !important }
*::-webkit-scrollbar-track {background-color: transparent !important }
*::-webkit-scrollbar-thumb {background-color: #666 !important; border-radius: 20px !important; border: 1px solid #fff !important }

#site { position:relative; z-index:1; width:100%;}
#section_bg { position:fixed; left:0px;width:100%; padding:0px; margin:0px;}

#main { position:relative; overflow:hidden; width:100%; top:140px }   
#header { position:relative; z-index:90; font-family: 'Open Sans', sans-serif; background: url("../layout/head_dach3c.png") bottom center no-repeat; background-size:100%; height:600px; width:100%; margin:0px auto; }
#menu { position:absolute; top:560px; padding-left:50px; z-index:100; background:rgba(120, 120, 120, 0.95); margin:0px auto; width:100%; height:auto; border-top: 1px solid #B8B891; border-bottom: 1px solid #fff;
        -moz-border-image: -moz-linear-gradient(left, #999999 0%, #ffffff 20% 80%, #999999 100%);
        -webkit-border-image: -webkit-linear-gradient(left, #999999 0%, #ffffff 20% 80%, #999999 100%); 
        -o-border-image: linear-gradient(left, #999999 0%, #ffffff 20% 80%, #999999 100%);
        border-image: linear-gradient(to right, #999999 0%, #ffffff 20% 80%, #999999 100%); border-image-slice: 1; 
        -moz-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.6); -webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.6); box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.6) }    
    
logo { position:absolute; z-index:100; width:250px; height:auto; left:30px; top:20px; }
adr1 { position:absolute; top:62px; left:320px; text-align:left; font-size:16px; font-family: 'Open Sans', sans-serif; font-weight:700; letter-spacing:0px; line-height:22px;  color:#fff }
adr2 { position:absolute; top:62px; left:580px; text-align:left; font-size:16px; font-family: 'Open Sans', sans-serif; font-weight:normal; letter-spacing:0px; line-height:22px;  color:#fff }

#data1 { position:relative; z-index:2; width:100%; margin:0px auto; background:rgba(255,255,255,1); 
         -moz-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8); box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.8) }
#data2 { position:relative; z-index:1; width:100%; margin:0px auto; }
#content1 { position:relative; z-index:20; text-align:center; width:1200px; padding:80px 0px 0 0px; margin:0px auto } 
#content2 { position:relative; z-index:20; text-align:left; width:1200px; padding:80px 0px 0 0px; margin:0px auto } 

.flexbox1 { 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 }
.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}
.flexbox3 { position:relative; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display:flex; -webkit-flex-flow:row wrap; margin:0px -10px -10px 0px }

.infobox1 { position:relative; width:100%; height:280px; margin:20px; border:1px solid #ccc; padding:0px; background-color:#f5f5f5; flex-basis:28%;
            -moz-box-shadow: 0px 2px 6px #bbb; /* Firefox */ -webkit-box-shadow: 0px 2px 6px #bbb; /* Chr, Saf */ box-shadow: 0px 2px 6px #bbb;
            border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.box_pic1 { position:relative; width:100%; height:auto; border-bottom-left-radius:10px; border-bottom-right-radius:10px; border-top:1px solid #aaa; }
.box_txt1 { position:relative; top:10px; font-size:16px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:center}
.box_pic2 { position:relative; width:200px; margin:20px; flex-basis:20%  }

.infobox2a { position:relative; top:3px; width:30%; padding: 0 10px 0px 0; font-family:'Open Sans', sans-serif; font-size:20px; color:#333; }
.infobox2b { position:relative; width:50%; padding: 0 10px 0px 0; font-family:'Open Sans', sans-serif; font-size:20px; color:#045096; }

.navbox1{ position:relative; top:0px; width:100%;}
.navtxt1{ position:relative; top:0px; left:100px; width:100%;}
.navtxt2{ position:relative; top:10px; left:120px; width:100%;}
.pfeil1{ position:absolute; top:-3px; left:0px; width:80px; height:43px; background:url(../layout/info_pfeil1.png); background-repeat: no-repeat; background-size:80px; opacity:0.8; filter: alpha(opacity=80) }

.thempic1 { position:relative; width:100%; height:auto; -moz-box-shadow: 0px 2px 8px #666; -webkit-box-shadow: 0px 2px 8px #666; box-shadow: 0px 2px 8px #666 }
.thempic2 { position:relative; width:100%; height:auto }
.thempic3 { position:relative; width:100%; height:auto; -moz-box-shadow: 0px 2px 8px #666; -webkit-box-shadow: 0px 2px 8px #666; box-shadow: 0px 2px 8px #666;
            border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }

/* Foot ---------------------------------------------------------------------- */
#foot{ position:relative; z-index:90; width:100%; height:220px; margin:0 auto; background: rgba(70, 70, 70, 1); border-top: 2px solid;
       -moz-border-image: -moz-linear-gradient(left, #999999 0%, #ffffff 20% 80%, #999999 100%);
       -webkit-border-image: -webkit-linear-gradient(left, #999999 0%, #ffffff 20% 80%, #999999 100%); 
       -o-border-image: linear-gradient(left, #999999 0%, #ffffff 20% 80%, #999999 100%);
       border-image: linear-gradient(to right, #999999 0%, #ffffff 20% 80%, #999999 100%); border-image-slice: 1; 
       -moz-box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.8); -webkit-box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.8); box-shadow: 0px -2px 6px rgba(0, 0, 0, 0.8) }
#fcont { position:relative; top:0px; text-align:left; width:100%; height:220px; margin:0px auto; }
.fani1 { position:absolute; bottom:0px; right:50px; width:640px; height:200px; background: url(../layout/ani_haeuser.gif) no-repeat 0 0; background-size:640px;}
.f-t1 { position:absolute; z-index:100; bottom:10px; left:20px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:400; letter-spacing:0px; color:#aaa }

.web-by { position:relative } 
.publisher{ position:relative; z-index:100; width:100%; height:30px; background: rgba(50, 50, 50, 1)}
.publisher_cont{ position:relative; top:8px; left:20px; text-align:left; width:1200px; height:20px;  }

/* Layouts, icons ------------------------------------------------------------------ */
.ihead1 { position:relative; top:4px; width:18px; height:auto }
.ifoot1 { position:relative; top:0px; width:180px; height:auto; opacity:0.8; filter:alpha(opacity=80) }
.letter1 { position:relative; width:auto; height:35px }
.letter2 { position:relative; width:80px; height:auto }
.letter3 { position:relative; width:64px; height:auto }
.infoschild1 { position:relative; width:auto; height:60px }
.mitglied{ position:relative; width:340px; height:auto }

.punkt1{ position:relative; width:20px; height:auto; padding: 0px 8px 0 0}
.punkt2{ position:relative; top:3px; width:20px; height:auto; padding: 0px 8px 0 0}

.cont_bg1{ position:absolute; z-index:5; width:100%; height:auto; right:0px; bottom:-4px; opacity:0.5; filter: alpha(opacity=50) } 
.cont_bg2{ position:absolute; z-index:5; width:80%; height:auto; right:0px; bottom:-4px; opacity:0.4; filter: alpha(opacity=40) } 

.abstand1{ line-height:100px}
.abstand2{ line-height:200px}
.abstand3{ line-height:300px}
.abstand4{ line-height:400px}
.abstand5{ line-height:500px}

/* Tabellen ------------------------------------------------------------------------ */
.tabelle1 { position:relative; width:100%; vertical-align:top; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.tabelle2 { position:relative; width:1000px; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.box_zeiten1 { position:relative; margin:0 auto; width:600px; text-align:left; font-family: 'Open Sans', sans-serif;  font-size:22px; color:#333;}
.td1a{ display: table-cell; vertical-align:top; width:3%; padding:3px 0 0 0}
.td1b{ display: table-cell; vertical-align:top; width:97%; padding-left:10px; vertical-align: top; font-family: 'Open Sans', sans-serif; font-size: 18px; color:#0064AB;}
.zeiten1{ position:relative; top:10px; width:35px; height:35px } 

.video-container { position:relative; padding-bottom:56.25%; padding-top:0px; height:0; overflow:hidden; border:none; background:#ffffff;
    -webkit-box-shadow:0px 12px 5px -8px rgba(0,0,0,0.75); -moz-box-shadow:0px 12px 5px -8px rgba(0,0,0,0.75); box-shadow: 0px 12px 5px -8px rgba(0,0,0,0.75); }

.video-container iframe,
.video-container object,
.video-container embed { position:absolute; top:0; left:0; width:100%; height:100% }
.video-container-wrapper { max-width:100%; left:0; right:0; margin:auto }

/* Effekts ---------------------------------------------------------------------- */	
.btneff1 { opacity: 0.80; filter: alpha(opacity=80); transition-timing-function: cubic-bezier(0.1,0.1,0.1,0.1); transition-property: margin-top; transition-duration: 0.3s}
.btneff2 { transition-duration: 1.3s; -webkit-filter: contrast(1); filter: contrast(1) }
.btneff3 { transition-duration: 0.5s;  transform: scale(1.0);}
.btneff1:hover { margin-top:-20px; opacity:1; filter: alpha(opacity=100)}
.btneff2:hover { transition-duration: 0.3s; -webkit-filter: contrast(2.0); filter: contrast(2.0);}
.btneff3:hover { transition-duration: 0.3s;  transform: scale(1.04);}

.shine { background: linear-gradient(to bottom right, #888 40%, #fff 50%, #888 60%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: animate 5s linear infinite }
@keyframes  animate { 0% { background-position:0px} 50% { background-position:100px} 100% { background-position:190px} }

.anime1 { animation: turner 10s infinite linear }
@keyframes turner{ from{  transform: rotateY(0deg) } to  { transform: rotateY(360deg) } }

.container { max-width:100%; margin:0 auto; padding:0; width:100% }
.acc h3 { position: relative; background-color:#999; color:#eee; padding:10px; margin:0; cursor:pointer; font-family: 'Open Sans', sans-serif; font-size:20px; font-weight:700; letter-spacing:2px;
          -moz-box-shadow: 0px 1px 5px #666; -webkit-box-shadow: 0px 1px 5px #666; box-shadow: 0px 1px 5px #666; border:1px solid #eee;
          border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.acc h3:hover {color:#fff; background-color:#888;  }
.acc h3:after { content: '+'; position:absolute; right:20px; font-size:20px; top:50%; transform: translateY(-50%) }
.acc.active h3:after { content: '-'; right:22px; background-color:#888; }
.acc.active h3 {background-color:#888; color:#A1F4FF }
.content { background-color:rgba(250,250,250,0.4); border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px; display:none }
.content-inner { padding:10px }
.content * { margin-top:0; line-height:1 }
.acc { border:none; padding:0 0 1px 0 }

/* GFX ---------------------------------------------------------------------- */
img { image-rendering: -webkit-optimize-contrast}
linie1 { display:block; top:0px; width:100%; height:1px; background:#666666}
linie2 { display:block; top:0px; width:100%; height:1px; background:#8B4C4C}
hr.style-1 { border: none; border-top: 1px solid #aaa }
.shade1 { box-shadow:0 8px 10px -4px #333333 }
.border1 { position:relative; width:400px; height:auto }
.linie1 { position:relative; width:90%; height:auto } 
.linie2 { position:relative; width:100%; height:auto } 

/* intro ---------------------------------------------------------------------- */	
#intro { position:relative; background:#fff; z-index:10; left:0px; width:100%; height:100%; padding: 0px; margin:0px; font-family: 'Open Sans', sans-serif }
.intro-txt1 { top:150px !important ; font-size:60px !important }  
.intro-txt2 { top:260px !important ; font-size:60px !important } 

.introshade { position:absolute; Bottom:-22px}
#noscriptfeld { position:absolute; top:20px; text-align:center; font-family: 'Open Sans', sans-serif; font-size:30pt; font-weight:bold; width:100%; color:#0064AB }

/* Tablet Querformat (Landscape) - PC mit geringer Auflösung */
@media only screen and (min-width: 1501px) and (max-width: 1700px)
{
#main { position:relative; width:100%; top:150px }   
#header { position:relative; z-index:90; font-family: 'Open Sans', sans-serif; background: url("../layout/head_dach3c.png") bottom center no-repeat; background-size:contain; height:500px; width:100%; margin:0px auto; }
#menu { position:absolute; top:460px; z-index:100; background:rgba(120, 120, 120, 0.95); margin:0px auto; width:100%; height:auto; border-top: 1px solid #B8B891; border-bottom: 1px solid #fff } 
.intro-txt1 { top:200px !important ; font-size:58px !important }  
.intro-txt2 { top:280px !important ; font-size:58px !important }      
}

/* Tablet Querformat (Landscape) - PC mit geringer Auflösung */
@media only screen and (min-width: 1201px) and (max-width: 1500px)
{
#main { position:relative; width:100%; top:100px }   
#header { position:relative; z-index:90; font-family: 'Open Sans', sans-serif; background: url("../layout/head_dach3c.png") bottom center no-repeat; background-size:contain; height:500px; width:100%; margin:0px auto; }
#menu { position:absolute; top:460px; z-index:100; background:rgba(120, 120, 120, 0.95); margin:0px auto; width:100%; height:auto; border-top: 1px solid #B8B891; border-bottom: 1px solid #fff } 
.intro-txt1 { top:260px !important ; font-size:54px !important }  
.intro-txt2 { top:340px !important ; font-size:54px !important }   
    
/* Foot ---------------------------------------------------------------------- */
#foot{ position:relative; z-index:90; width:100%; height:300px }
#fcont { position:relative; top:0px; text-align:left; width:100%; height:300px; margin:0px auto; }
.fani1 { position:absolute; bottom:0px; right:50px; width:800px; height:250px; background: url(../layout/ani_haeuser.gif) no-repeat 0 0; background-size:800px;}
.f-t1 { position:absolute; z-index:100; bottom:50px; left:20px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:400; letter-spacing:0px; color:#aaa }
    
}



/* Tablet Querformat (Landscape) - PC mit geringer Auflösung */
@media only screen and (min-width: 991px) and (max-width: 1200px)
{  
#main { position:relative; width:100%; top:120px }   
#header { position:relative; z-index:90; font-family: 'Open Sans', sans-serif; background: url("../layout/head_dach3c.png") bottom left no-repeat; background-size:contain; height:400px; width:120%; margin:0px auto; }
#menu { position:absolute; top:362px;  z-index:100; background:rgba(120, 120, 120, 0.95); margin:0px auto; width:100%; height:auto; border-top: 1px solid #B8B891; border-bottom: 1px solid #fff } 
.intro-txt1 { top:290px !important ; font-size:50px !important }  
.intro-txt2 { top:370px !important ; font-size:50px !important }  
logo { position:absolute; z-index:100; width:190px; height:auto; left:30px; top:20px; }
adr1 { position:absolute; top:54px; left:260px; text-align:left; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:700; letter-spacing:0px; line-height:20px;  color:#fff }
adr2 { position:absolute; top:54px; left:520px; text-align:left; font-size:15px; font-family: 'Open Sans', sans-serif; font-weight:normal; letter-spacing:0px; line-height:20px;  color:#fff } 
    
#content1 { position:relative; z-index:20; text-align:center; width:96%; padding:60px 10px 0 0px; margin:0px auto } 
#content2 { position:relative; z-index:20; text-align:left; width:96%; padding:60px 0px 0 0px; margin:0px auto } 
    
.infobox1 { position:relative; width:100%; height:auto; margin:15px; border:1px solid #ccc; padding:0px; background-color:#f5f5f5; flex-basis:30%;
            -moz-box-shadow: 0px 2px 6px #bbb; /* Firefox */ -webkit-box-shadow: 0px 2px 6px #bbb; /* Chr, Saf */ box-shadow: 0px 2px 6px #bbb;
            border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.box_pic1 { position:relative; width:100%; bottom:-5px; height:auto; border-bottom-left-radius:10px; border-bottom-right-radius:10px; border-top:1px solid #aaa; }
.box_txt1 { position:relative; top:10px; padding:0px 4px; font-size:15px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:center}
.box_pic2 { position:relative; width:200px; margin:20px; flex-basis:20%  }
    
.navtxt1{ position:relative; top:0px; left:70px; width:100%;}
.navtxt2{ position:relative; top:10px; left:120px; width:100%;}
.pfeil1{ position:absolute; top:-3px; left:-30px; width:80px; height:43px; background:url(../layout/info_pfeil1.png); background-repeat:no-repeat; background-size:80px; opacity:0.8; filter: alpha(opacity=80) }
    
/* Foot ---------------------------------------------------------------------- */
#foot{ position:relative; z-index:90; width:100%; height:250px }
#fcont { position:relative; top:0px; text-align:left; width:100%; height:250px; margin:0px auto; }
.fani1 { position:absolute; bottom:0px; right:50px; width:800px; height:250px; background: url(../layout/ani_haeuser.gif) no-repeat 0 0; background-size:800px;}
.f-t1 { position:absolute; z-index:100; bottom:10px; left:20px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:400; letter-spacing:0px; color:#aaa } 
    
/* Layouts, icons ------------------------------------------------------------------ */
.ihead1 { position:relative; top:3px; width:17px; height:auto }  
.letter1 { position:relative; width:auto; height:32px } 
    
/* Tabellen ------------------------------------------------------------------------ */
.tabelle1 { position:relative; width:100%; vertical-align:top; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.tabelle2 { position:relative; width:100%; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.box_zeiten1 { position:relative; margin:0 auto; width:600px; text-align:left; font-family: 'Open Sans', sans-serif;  font-size:20px; color:#333;}
.td1a{ display: table-cell; vertical-align:top; width:3%; padding:3px 0 0 0}
.td1b{ display: table-cell; vertical-align:top; width:97%; padding-left:10px; vertical-align: top; font-family: 'Open Sans', sans-serif; font-size: 18px; color:#0064AB;}
.zeiten1{ position:relative; top:6px; padding: 0px 10px 0 0; width:30px; height:auto } 
    
}

/* Tablet Hochformat (Portrait) */
@media only screen and (min-width: 768px) and (max-width: 990px) 
{  
#main { position:relative; width:100%; top:80px }   
#header { position:relative; z-index:90; font-family: 'Open Sans', sans-serif; background: url("../layout/head_dach3c.png") bottom left no-repeat; background-size:contain; height:300px; width:130%; margin:0px auto; }
#menu { position:absolute; top:270px; padding-left:0px; z-index:100; background:rgba(120, 120, 120, 0.95); margin:0px auto; width:100%; height:auto; border-top:1px solid #B8B891; border-bottom:1px solid #fff } 
.intro-txt1 { display:none !important }  
.intro-txt2 { display:none !important }  
logo { position:absolute; z-index:100; width:160px; height:auto; left:20px; top:20px; }
adr1 { position:absolute; top:40px; left:220px; text-align:left; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:700; letter-spacing:0px; line-height:20px; color:#fff }
adr2 { position:absolute; top:40px; left:460px; text-align:left; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:normal; letter-spacing:0px; line-height:20px; color:#fff } 
    
#content1 { position:relative; z-index:20; text-align:center; width:97%; padding:60px 10px 0 0px; margin:0px auto } 
#content2 { position:relative; z-index:20; text-align:left; width:97%; padding:60px 0px 0 0px; margin:0px auto } 
    
.infobox1 { position:relative; width:100%; height:auto; margin:10px; border:1px solid #ccc; padding:0px; background-color:#f5f5f5; flex-basis:30%;
            -moz-box-shadow: 0px 2px 6px #bbb; /* Firefox */ -webkit-box-shadow: 0px 2px 6px #bbb; /* Chr, Saf */ box-shadow: 0px 2px 6px #bbb;
            border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.box_pic1 { position:relative; width:100%; bottom:-5px; height:auto; border-bottom-left-radius:10px; border-bottom-right-radius:10px; border-top:1px solid #aaa; }
.box_txt1 { position:relative; top:10px; padding:0px 4px; font-size:14px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:center}
.box_pic2 { position:relative; width:100%; margin:10px; flex-basis:30%  }
    
#noscriptfeld { position:absolute; top:20px; text-align:center; font-family: 'Open Sans', sans-serif; font-size:20pt; font-weight:bold; width:100%; color:#0064AB }
    
.infobox2a { position:relative; top:3px; width:30%; padding: 0 10px 0px 0; font-family:'Open Sans', sans-serif; font-size:17px; color:#333; letter-spacing:0px;}
.infobox2b { position:relative; width:60%; padding: 0 10px 0px 0; font-family:'Open Sans', sans-serif; font-size:17px; color:#045096; letter-spacing:0px;}
    
.acc h3 { position: relative; background-color:#999; color:#eee; padding:10px; margin:0; cursor:pointer; font-family: 'Open Sans', sans-serif; font-size:18px; font-weight:700; letter-spacing:1px;
          -moz-box-shadow: 0px 1px 5px #666; -webkit-box-shadow: 0px 1px 5px #666; box-shadow: 0px 1px 5px #666; border:1px solid #eee;
          border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.acc h3:after { content: '+'; position:absolute; right:20px; font-size:20px; top:50%; transform: translateY(-50%) }
.content-inner { padding:10px } 
    
.navtxt1{ position:relative; top:0px; left:50px; width:90%;}
.navtxt2{ position:relative; top:10px; left:120px; width:100%;}
.pfeil1{ position:absolute; top:-7px; left:-30px; width:70px; height:37px; background:url(../layout/info_pfeil1.png); background-repeat:no-repeat; background-size:70px; opacity:0.8; filter: alpha(opacity=80) }
    
/* Foot ---------------------------------------------------------------------- */
#foot{ position:relative; z-index:90; width:100%; height:330px }
#fcont { position:relative; top:0px; text-align:left; width:100%; height:330px; margin:0px auto; }
.fani1 { position:absolute; bottom:0px; right:10px; width:640px; height:200px; background: url(../layout/ani_haeuser.gif) no-repeat 0 0; background-size:640px;}
.f-t1 { position:absolute; z-index:100; bottom:10px; left:20px; font-size:14px; font-family:'Open Sans', sans-serif; font-weight:400; letter-spacing:0px; color:#aaa } 
    
/* Layouts, icons ------------------------------------------------------------------ */
.ihead1 { position:relative; top:2px; width:16px; height:auto }
.ifoot1 { position:relative; top:0px; width:140px; height:auto; opacity:0.5; filter:alpha(opacity=50) } 
.letter1 { position:relative; width:auto; height:30px } 
.infoschild1 { position:relative; width:auto; height:55px }
    
.punkt1{ position:relative; width:18px; height:auto; padding: 0px 4px 0 0}
    
/* Tabellen ------------------------------------------------------------------------ */
.tabelle1 { position:relative; width:100%; vertical-align:top; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.tabelle2 { position:relative; width:100%; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.box_zeiten1 { position:relative; margin:0 auto; width:600px; text-align:left; font-family: 'Open Sans', sans-serif;  font-size:18px; color:#333;}
.td1a{ display: table-cell; vertical-align:top; width:3%; padding:3px 0 0 0}
.td1b{ display: table-cell; vertical-align:top; width:97%; padding-left:10px; vertical-align:top; font-family: 'Open Sans', sans-serif; font-size:16px; color:#0064AB;}
.zeiten1{ position:relative; top:6px; padding: 0px 10px 0 0; width:25px; height:auto }   
} 

/* Smartphone Querformat (Landscape) */
@media only screen and (min-width: 481px) and (max-width: 767px) 
{ 
#main { position:relative; width:100%; top:60px }   
#header { position:relative; z-index:90; font-family: 'Open Sans', sans-serif; background: url("../layout/head_dach3c.png") bottom left no-repeat; background-size:contain; height:240px; width:140%; margin:0px auto; }
#menu { position:absolute; top:210px; padding-left:0px; z-index:100; background:rgba(120, 120, 120, 0.95); margin:0px auto; width:100%; height:auto; border-top:1px solid #B8B891; border-bottom:1px solid #fff } 
.intro-txt1 { display:none !important }  
.intro-txt2 { display:none !important } 
logo { position:absolute; z-index:100; width:150px; height:auto; left:20px; top:20px; }
adr1 { position:absolute; top:36px; left:200px; text-align:left; font-size:13px; font-family: 'Open Sans', sans-serif; font-weight:700; letter-spacing:0px; line-height:20px; color:#fff }
adr2 { display:none} 
    
#content1 { position:relative; z-index:20; text-align:center; width:96%; padding:60px 10px 0 0px; margin:0px auto } 
#content2 { position:relative; z-index:20; text-align:left; width:96%; padding:60px 0px 0 0px; margin:0px auto } 
    
.abstand1{ line-height:80px}
.abstand2{ line-height:130px}
.abstand3{ line-height:180px}
.abstand4{ line-height:230px}
.abstand5{ line-height:280px}
    
#noscriptfeld { position:absolute; top:20px; text-align:center; font-family: 'Open Sans', sans-serif; font-size:14pt; font-weight:bold; width:100%; color:#0064AB }
    
.infobox1 { position:relative; width:100%; height:auto; margin:10px; border:1px solid #ccc; padding:0px; background-color:#f5f5f5; flex-basis:42%;
            -moz-box-shadow: 0px 2px 6px #bbb; /* Firefox */ -webkit-box-shadow: 0px 2px 6px #bbb; /* Chr, Saf */ box-shadow: 0px 2px 6px #bbb;
            border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.box_pic1 { position:relative; width:100%; bottom:-5px; height:auto; border-bottom-left-radius:10px; border-bottom-right-radius:10px; border-top:1px solid #aaa; }
.box_txt1 { position:relative; top:10px; padding:0px 4px; font-size:13px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:center}
.box_pic2 { position:relative; width:100%; margin:10px; flex-basis:30%  }
    
.infobox2a { position:relative; top:3px; width:100%; padding: 0 10px 0px 0; font-family:'Open Sans', sans-serif; font-size:16px; color:#333; letter-spacing:0px;}
.infobox2b { position:relative; width:100%; padding: 10px 0px 0px 0; font-family:'Open Sans', sans-serif; font-size:16px; color:#045096; letter-spacing:0px;}
  
.acc h3 { position: relative; background-color:#999; color:#eee; padding:10px; margin:0; cursor:pointer; font-family: 'Open Sans', sans-serif; font-size:17px; font-weight:700; letter-spacing:1px;
          -moz-box-shadow: 0px 1px 5px #666; -webkit-box-shadow: 0px 1px 5px #666; box-shadow: 0px 1px 5px #666; border:1px solid #eee;
          border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.acc h3:after { content: '+'; position:absolute; right:20px; font-size:20px; top:50%; transform: translateY(-50%) }
.content-inner { padding:10px } 
    
.navtxt1{ position:relative; top:0px; left:50px; width:90%;}
.navtxt2{ position:relative; top:10px; left:120px; width:100%;}
.pfeil1{ position:absolute; top:-6px; left:-20px; width:60px; height:32px; background:url(../layout/info_pfeil1.png); background-repeat:no-repeat; background-size:60px; opacity:0.8; filter: alpha(opacity=80) }
    
/* Foot ---------------------------------------------------------------------- */
#foot{ position:relative; z-index:90; width:100%; height:350px }
#fcont { position:relative; top:0px; text-align:left; width:100%; height:350px; margin:0px auto; }
.fani1 { position:absolute; bottom:0px; right:10px; width:640px; height:200px; background: url(../layout/ani_haeuser.gif) no-repeat 0 0; background-size:640px;}
.f-t1 { position:absolute; z-index:100; bottom:6px; left:20px; font-size:13px; font-family:'Open Sans', sans-serif; font-weight:400; letter-spacing:0px; color:#aaa } 
    
/* Layouts, icons ------------------------------------------------------------------ */
.ihead1 { position:relative; top:2px; width:16px; height:auto }
.ifoot1 { position:relative; top:0px; width:140px; height:auto; opacity:0.5; filter:alpha(opacity=50) } 
.letter1 { position:relative; width:auto; height:26px }
.infoschild1 { position:relative; width:auto; height:50px }
.mitglied{ position:relative; width:280px; height:auto } 
    
.punkt1{ position:relative; width:16px; height:auto; padding: 0px 4px 0 0}
    
/* Tabellen ------------------------------------------------------------------------ */
.tabelle1 { position:relative; width:100%; vertical-align:top; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.tabelle2 { position:relative; width:100%; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.box_zeiten1 { position:relative; margin:0 auto; width:96%; text-align:left; font-family: 'Open Sans', sans-serif;  font-size:18px; color:#333;}
.td1a{ display: table-cell; vertical-align:top; width:5%; padding:3px 0 0 0}
.td1b{ display: table-cell; vertical-align:top; width:97%; padding-left:10px; vertical-align: top; font-family: 'Open Sans', sans-serif; font-size:15px; color:#0064AB;}
.zeiten1{ position:relative; top:6px; padding: 0px 10px 0 0; width:25px; height:auto }   
    
/* Effekts ---------------------------------------------------------------------- */	
.btneff1 { opacity: 1; filter: alpha(opacity=100); transition-timing-function: cubic-bezier(0.1,0.1,0.1,0.1); transition-property: margin-top; transition-duration: 0.3s}
.btneff2 { transition-duration: 1.3s; -webkit-filter: contrast(1); filter: contrast(1) }
.btneff3 { transition-duration: 0.5s;  transform: scale(1.0);}
.btneff1:hover { margin-top:0px; opacity:1; filter: alpha(opacity=100)}
.btneff2:hover { transition-duration: 0.3s; -webkit-filter: contrast(1.0); filter: contrast(1.0);}
.btneff3:hover { transition-duration: 0.3s;  transform: scale(1.0);}
    
.shine { background: linear-gradient(to bottom right, #888 40%, #fff 50%, #888 60%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: animate 5s linear infinite }
@keyframes  animate { 0% { background-position:0px} 50% { background-position:100px} 100% { background-position:175px} } 
} 
    
/* Smartphone Hochformat (Portrait) */
@media only screen and (min-width: 280px) and (max-width: 480px)
{   
#main { position:relative; width:100%; top:50px }   
#header { position:relative; z-index:90; font-family: 'Open Sans', sans-serif; background: url("../layout/head_dach3c.png") bottom left no-repeat; background-size:contain; height:200px; width:140%; margin:0px auto; }
#menu { position:absolute; top:200px; padding-left:0px; z-index:100; background:rgba(120, 120, 120, 1); margin:0px auto; width:100%; height:auto; border-top:1px solid #B8B891; border-bottom:1px solid #fff } 
.intro-txt1 { display:none !important }  
.intro-txt2 { display:none !important } 
logo { position:absolute; z-index:100; width:120px; height:auto; left:10px; top:10px; }
adr1 { position:absolute; top:25px; left:150px; text-align:left; font-size:12px; font-family: 'Open Sans', sans-serif; font-weight:700; letter-spacing:-0.5px; line-height:15px; color:#fff }
adr2 { display:none } 
    
#content1 { position:relative; z-index:20; text-align:center; width:96%; padding:60px 10px 0 0px; margin:0px auto } 
#content2 { position:relative; z-index:20; text-align:left; width:96%; padding:60px 0px 0 0px; margin:0px auto } 
    
.abstand1{ line-height:50px}
.abstand2{ line-height:100px}
.abstand3{ line-height:150px}
.abstand4{ line-height:200px}
.abstand5{ line-height:250px}
    
#noscriptfeld { position:absolute; top:20px; text-align:center; font-family: 'Open Sans', sans-serif; font-size:12pt; font-weight:bold; width:100%; color:#0064AB }
 
.infobox1 { position:relative; width:100%; height:auto; margin:8px; border:1px solid #ccc; padding:0px; background-color:#f5f5f5; flex-basis:42%;
            -moz-box-shadow: 0px 2px 6px #bbb; /* Firefox */ -webkit-box-shadow: 0px 2px 6px #bbb; /* Chr, Saf */ box-shadow: 0px 2px 6px #bbb;
            border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.box_pic1 { position:relative; width:100%; bottom:-5px; height:auto; border-bottom-left-radius:10px; border-bottom-right-radius:10px; border-top:1px solid #aaa; }
.box_txt1 { position:relative; top:10px; font-size:12px; padding:0px 3px; font-weight:normal; font-family: 'Open Sans', sans-serif; color:#666666; hyphens:auto; text-align:center}
.box_pic2 { position:relative; width:80%; margin:10px; flex-basis:40%  }
    
.infobox2a { position:relative; top:3px; width:100%; padding: 0 10px 0px 0; font-family:'Open Sans', sans-serif; font-size:15px; color:#333; letter-spacing:0px;}
.infobox2b { position:relative; width:100%; padding: 10px 0px 0px 0; font-family:'Open Sans', sans-serif; font-size:15px; color:#045096; letter-spacing:-0.5px;}
  
.acc h3 { position: relative; background-color:#999; color:#eee; padding:10px; margin:0; cursor:pointer; font-family: 'Open Sans', sans-serif; font-size:16px; font-weight:700; letter-spacing:1px;
          -moz-box-shadow: 0px 1px 5px #666; -webkit-box-shadow: 0px 1px 5px #666; box-shadow: 0px 1px 5px #666; border:1px solid #eee;
          border-bottom-right-radius:10px; border-bottom-left-radius:10px; border-top-left-radius:10px; border-top-right-radius:10px }
.acc h3:after { content: '+'; position:absolute; right:20px; font-size:20px; top:50%; transform: translateY(-50%) }
.content-inner { padding:10px }  
    
.navtxt1{ position:relative; top:0px; left:40px; width:90%;}
.navtxt2{ position:relative; top:10px; left:120px; width:100%;}
.pfeil1{ position:absolute; top:-3px; left:-20px; width:50px; height:27px; background:url(../layout/info_pfeil1.png); background-repeat:no-repeat; background-size:50px; opacity:0.8; filter: alpha(opacity=80) }
    
/* Foot ---------------------------------------------------------------------- */
#foot{ position:relative; z-index:90; width:100%; height:400px }
#fcont { position:relative; top:0px; text-align:left; width:100%; height:350px; margin:0px auto; }
.fani1 { position:absolute; bottom:0px; right:10px; width:640px; height:200px; background: url(../layout/ani_haeuser.gif) no-repeat 200px 0; background-size:640px;}
.f-t1 { position:absolute; z-index:100; bottom:6px; left:20px; font-size:13px; font-family:'Open Sans', sans-serif; font-weight:400; letter-spacing:0px; color:#aaa } 
    
/* Layouts, icons ------------------------------------------------------------------ */
.ihead1 { position:relative; top:2px; width:16px; height:auto }
.ifoot1 { position:relative; top:0px; width:140px; height:auto; opacity:0.5; filter:alpha(opacity=50) } 
.letter1 { position:relative; width:auto; height:22px }
.infoschild1 { position:relative; width:auto; height:45px }
.mitglied{ position:relative; width:250px; height:auto }
    
.punkt1{ position:relative; width:15px; height:auto; padding: 0px 4px 0 0} 
.punkt2{ position:relative; top:3px; width:18px; height:auto; padding: 0px 8px 0 0}
    
/* Tabellen ------------------------------------------------------------------------ */
.tabelle1 { position:relative; width:100%; vertical-align:top; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.tabelle2 { position:relative; width:100%; border:0; border-spacing:0px 0px; border-collapse:collapse; text-align:left;}
.box_zeiten1 { position:relative; margin:0 auto; width:96%; text-align:left; font-family: 'Open Sans', sans-serif;  font-size:16px; color:#333;}
.td1a{ display: table-cell; vertical-align:top; width:3%; padding:3px 0 0 0}
.td1b{ display: table-cell; vertical-align:top; width:97%; padding-left:10px; vertical-align: top; font-family: 'Open Sans', sans-serif; font-size: 14px; color:#0064AB;}
.zeiten1{ position:relative; top:6px; padding: 0px 10px 0 0; width:25px; height:auto } 
    
/* Effekts ---------------------------------------------------------------------- */	
.btneff1 { opacity: 1; filter: alpha(opacity=100); transition-timing-function: cubic-bezier(0.1,0.1,0.1,0.1); transition-property: margin-top; transition-duration: 0.3s}
.btneff2 { transition-duration: 1.3s; -webkit-filter: contrast(1); filter: contrast(1) }
.btneff3 { transition-duration: 0.5s;  transform: scale(1.0);}
.btneff1:hover { margin-top:0px; opacity:1; filter: alpha(opacity=100)}
.btneff2:hover { transition-duration: 0.3s; -webkit-filter: contrast(1.0); filter: contrast(1.0);}
.btneff3:hover { transition-duration: 0.3s;  transform: scale(1.0);}
    
.shine { background: linear-gradient(to bottom right, #888 40%, #fff 50%, #888 60%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; animation: animate 5s linear infinite }
@keyframes  animate { 0% { background-position:0px} 50% { background-position:100px} 100% { background-position:175px} } 

}