body,div,h1,h2,h3,h4,h5,h6,p,blockquote,pre,code,ol,ul,li,dl,dt,dd,figure,table,th,td,form,fieldset,legend,input,textarea{margin:0;padding:0}table{border-spacing:0;border-collapse:collapse}caption,th,td{text-align:left;text-align:start;vertical-align:top}abbr,acronym{font-variant:normal;border-bottom:1px dotted #666;cursor:help}blockquote,q{quotes:none}fieldset,img{border:0}ul{list-style-type:none}sup{vertical-align:text-top}sub{vertical-align:text-bottom}del{text-decoration:line-through}ins{text-decoration:none}header,footer,nav,section,aside,article,figure,figcaption{display:block}body{font:12px/1 "Lucida Grande","Lucida Sans Unicode",Verdana,sans-serif;color:#000}input,button,textarea,select{font-family:inherit;font-size:99%;font-weight:inherit}pre,code{font-family:Monaco,monospace}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}h1{font-size:1.8333em}h2{font-size:1.6667em}h3{font-size:1.5em}h4{font-size:1.3333em}table{font-size:inherit}caption,th{font-weight:700}a{color:#00f}h1,h2,h3,h4,h5,h6{margin-top:1em}h1,h2,h3,h4,h5,h6,p,pre,blockquote,table,ol,ul,form{margin-bottom:12px}
body{font-size:92%;width:100%;line-height:150%;
font-family: 'PT Sans', sans-serif;margin:0 auto 0;padding:0;




}
img{border:0;}
*{margin:0;padding:0;}


#main{width:80%;margin:0 auto 0;overflow:hidden;margin-top:3em;}



ul.angebot {display:block;width:14em;
font-family: 'Roboto Slab', serif;}

ul.angebot li{height:auto;}
ul.angebot li a{display:block;color:white;list-style-type:none;text-decoration:none;
background:black;padding-left:1em;padding-top:0.1em;
padding-bottom:0.3em;margin-bottom:1em;}
ul.angebot li a:hover{background:white;color:black;}
ul.angebot li a.current{background:white;color:black;border:1px solid black;}








#footer{overflow:hidden;width:100%;padding-bottom:2em;margin-top:3em;
}
#footer .inside{width:80%;margin:0 auto 0;border-top:1px solid black;margin-top:3em;}

.icon{float:left;margin-top:1em;width:7%;height:auto;}

.navicon {display:none;}
.navicon li {display:none;}
.fa-phone:before,.fa-at:before,.fa-home:before,.fa-briefcase:before,.fa-user:before
{color:white;background:black;padding:0.5em;font-size:1.5em;float:left;}
.mail, .tele{width:26.33333%;float:left;margin-top:1em;}
#footer .impressum{width:100%;}


#footer .inside .ce_text{margin-top:3em;}
#footer a{text-decoration:none;color:black;}






@media all and (min-width: 1300px){
#main {width:80%;}
}
@media all and (max-width: 800px){



}



@media all and (max-width: 600px){

#main,#header{width:90%;margin:0 auto 0;}
.acht{margin:0;padding:0;}
ul.angebot {margin:0 auto 0;width:100%;}
.mail, .tele{width:100%;}
.icon{margin-top:2em;}
.navicon {display:block;padding-top:2em;width:100%;height:auto;overflow:hidden;}
.navicon li{display:block;width:24%;list-style-type:none;margin-left:1%;
float:left;}

.fa-phone:before,.fa-at:before,.fa-home:before,.fa-briefcase:before,.fa-user:before
{font-size:2em;}
#footer .zwoelf{border-top:1px solid black;margin-top:2em;}
#footer .inside{width:80%;margin:0 auto 0;border-top:1px solid black;padding-top:2em;}




}





.eins{width:6.33333333333%;}
.zwei{width:14.66666666666667%;}
.drei{width:23%;}
.vier{width:31.333333%;}
.fuenf{width:40.66666666666667%;}
.sechs{width:48%;}
.sieben{width:57.3333333%;}
.acht{width:64.6666666%;}
.neun{width:74%;}
.zehn{width:83.333333333%;}
.elf{width:91.66666666666667%;}
.zwoelf{width:98%;}

.eins,
.zwei,
.drei,
.vier,
.fuenf,
.sieben,
.acht,
.neun,
.zehn,
.elf,
.zwoelf,
.sechs {float:left;margin-left:1%;margin-right:1%;}

.eins .ce_text,
.zwei .ce_text,
.drei .ce_text,
.vier .ce_text,
.fuenf .ce_text,
.sechs .ce_text,
.sieben .ce_text,
.acht .ce_text,
.neun .ce_text,
.zehn .ce_text,
.elf .ce_text,
.zwoelf .ce_text
{width:100%;/*background:#b3e1dd;*/}



.eins img,
.zwei img,
.drei img,
.vier img,
.fuenf img,
.sechs img,
.sieben img,
.acht img,
.neun img,
.zehn img,
.elf img,
.zwoelf img{width:100%;height:auto;}

.v img{width:25%;}
.s img{width:33.3333333%;}
.vf img{width:50%;}
.vf img,.v img,.s img{height:auto;float:left;padding-right:0;padding-bottom:0;}

@media all and (max-width: 768px){
.vier,.fuenf,.sechs,.sieben,
.acht,.neun,.zehn,.elf {width:100%;}
.drei{width:48%;}
.zwei{width:23%;}
.v img{width:50%;}
.s img{width:50%;}
}

@media all and (max-width: 600px){
.drei{width:100%;}
.v img{width:100%;}
.s img{width:100%;}
.vf img{width:100%;}
}






















#header{height:auto;overflow:hidden;}
#header img{width:15%;height:auto;margin-top:0;float:left;}
.sloganunterseite{display:block;margin-bottom:3em;margin-left:1%;}
.slogan{display:none;margin-bottom:2em;margin-top:2em;}
.slogandesktop{margin-bottom:3em;}





.mod_navigation{width:40%;float:right;}

.mod_navigation ul{float:right;list-style-type: none;padding-top:0.5em;}

.mod_navigation  li{font-family: 'Roboto Slab',serif;font-weight:300;
float:left;border:1px solid black;padding:0.3em;margin-right:0.5em;background:black;}

.mod_navigation a,.mod_navigation span{color:white;
line-height:20px;text-decoration:none;}
.mod_navigation .active{color:black;background:white;}



@media all and (max-width: 600px){

#header img{width:100%;}
#header h1,#header h2{display:none;}

.mod_navigation{display:none;}
.slogandesktop{display:none;}
.sloganunterseite{display:none}
.slogan{display:block;}








}	
	
	




#main .kontakt{width:80%;}
.kontakt .ce_text{width:100%}

.formbody{width:100%;
			
			clear:both;
			padding-top:2em;}
label {cursor:pointer;
		display:block;
		text-align:left;
		font-size:90%;
		padding:1em 0 0.5em 0;}


.checkbox_container{text-align:center;}
.textarea{width:100%;}
input[type="submit"]{background-color:black;color:white;width:4em;height:4em;
					font-size:85%;border:none;margin-top:1em;margin-bottom:4em;}
input[type="submit"]:hover{background-color:black;color:white;}

.impressum .ce_text{width:60%;margin:0 auto 0;}

@media all and (max-width: 50em){
.kontakt{width:98%;height:auto;}
}


h1{font-family: 'Roboto Slab', serif;font-weight:300;
font-size:1.3em;}
 h2{font-family: 'Roboto Slab', serif;font-weight:300;
font-size:1em;}
 h3{font-family: 'Roboto Slab', serif;font-weight:300;
font-size:0.8em;}



h1,h2,h3,p{line-height:150%;}

@media all and (max-width: 600px){
h1{font-size:1.7em;}
h2{font-size:1.2em;}
h3{font-size:1.2em;}
p{font-size:1.1em;}

}