@import url('https://fonts.googleapis.com/css?family=Roboto');

body{margin:0px;overflow-y:scroll;}
body,td,input,textarea{font-family:'Roboto',arial;font-size:14px;color:#333;}

.c{clear:both;}
.tl{text-align:left;}
.tr{text-align:right;}
.l{float:left;}
.r{float:right;}

a{text-decoration:none;}

#navi{background-color:#008DD2;text-align:center;padding:10px;color:#fff;font-weight:bold;font-size:16px;}
#navi a{text-transform:uppercase;color:#fff;font-weight:bold;font-size:16px;}
#navi a.aktiv,#navi a:active,#navi a:hover{color:FCF000}

#footer{background-color:#008DD2;padding:10px;color:#fff;font-weight:bold;margin-top:20px;}
#footer_navi{float:right;}
#footer a{color:#fff;}

h1,.sortiment_klein a{color:#008DD2;font-size:16px;line-height:16px;text-decoration:none;font-weight:bold;}
h1{font-size:20px;line-height:30px;}
h2{font-size:16px;}
h3{font-size:16px;color:#008DD2;}

.bild{width:100%;}
#logo{position:absolute;left:10;top:4%;width:40%;max-width:400px;}

.text{padding:10px;}
.center{text-align:center;}

a{color:#008DD2;}
a.button,input[type=submit],input[type=button]{display:inline-block;cursor:pointer;white-space:nowrap;background-color:#008DD2;color:#fff;text-align:center;padding:10px;font-weight:bold;font-size:16px;user-select:none;}

.leistungen{float:left;width:24%;min-width:250px;margin:0 10 10 0;}

.sortiment_klein{background-color:#E7E7E8;float:left;width:220px;margin:0 10 10 0;cursor:pointer;}
.sortiment_klein img{width:100%;}

.sortiment_klein_inner{padding:10px;text-align:center;}

.detailsbild{float:left;margin:0 20 20 0;width:100%;max-width:370px;}
.detailstext{float:left;width:10%;min-width:300px;}
.details_farbquadrat{float:left;width:70px;}

input[type=text],input[type=tel],select,textarea{background-color:#E7E7E8;color:#333333;padding:10px;border:0px;margin:10 0 0 0;width:80%;max-width:300px;}

#kontakt_oben
{
  width:190px;position:absolute;padding:3px;right:0;top:4%;background-color:rgba(255,255,255,0.5);
  font-size:15px;
}
#kontakt_oben a{color:#333;}