body{background:#fff;font-size:100%;margin:0;padding:0;max-width:100%;font-family:Helvetica}
#header{background:url(https://handwerkernet.de/handwerk-2018.jpg);background-repeat:no-repeat;margin-top:0.5em;background-position:center top;background-size:contain;width:100%;height:168px}
#header img{max-width:800px;max-height:100px;text-align:center;box-shadow:0 0 5px -5px #4c4948;border-radius:5px}
img{width:90%;height:auto;max-width:800px}
#banner img{max-width:800px;max-height:100px;text-align:center;box-shadow:0px 0px 5px -5px #4c4948;border-radius:5px;}
img{width:90%;height:auto;max-width:800px} 

.hide,.show{display:none}
.hide,.show{display:none;border-top:1em double #a2b7ca;border-bottom:.4em solid #a2b7ca;width:10%}
.inhalt ul li{display:inline; margin:0 .4em 0 .01em;white-space:nowrap}

.inhalt{display:block;height:auto;background:#a2b7ca;text-align:center;margin-bottom:1em;box-shadow:0 0 2px 1px #4c4948;border-radius:5px}
.inhalt ul{display:block;margin:0;padding:0}
.inhalt ul li a{color:#000;
font-weight:700;font-size:1.0em;line-height:1.8em;
padding:.263em .238em .275em .238em;
transition:background .2s;-webkit-transition:background .2s}
.inhalt ul li a:hover{background:#678198; border-bottom:.188em solid #6e8ba5;
box-shadow:0 0 1px 1px #4c4948;border-radius:5px}
.inhalt ul li a.active{border-bottom:.188em solid #6e8ba5}
#menubar{display:block;text-align:center;background:#fff}
#media{width:100%;margin-bottom:1em;
margin-top:.2em;height:auto;background:#a2b7ca;display:-webkit-flex;display:flex;flex-direction:row;float:left;box-shadow:0 0 1px 1px #4c4948;border-radius:5px}
#content{width:100%;clear:both;margin-top:.4em;height:auto;display:-webkit-flex;
display:flex;flex-direction:row;justify-content:space-between}

#inhalt {margin-top:-50px; vertical-align:top; display:inline-block; width:35%; font-size:1.0em; padding-left:10px;}
#ueber {margin-bottom:0.2em;  text-align:center; width:95%; } 
.kostenlose-werbeanzeigen {line-height:16px; margin-top:-30px;/*muss drin bleiben*/}

a{color:#0000FF;}a:hover{color:#bb800f;}a:visited{color:#0000BF;}
h1, h2{font-size:1.0em; color:#000000;}
h3{font-size:1.0em ;margin-bottom:2px;}
.p3{margin-left:20px; font-size:1.0em; line-height:1.4em; padding:0.0em;margin-bottom:0.00em;text-align:left;}
.b1{color:#000000;background:#9AB4CB;box-shadow:0px 0px 1px 1px #4c4948;border-radius:5px}
.url{font-size:1.0em; margin-bottom:2px;color:#000000; margin-top:0px;}
.beschreibung{font-size:1.0em; margin-bottom:2px;color:#000000;margin-top:1px;}
.adresse{font-size:1.0em;margin-bottom:2px;color:#000000;margin-top:1px;}
.suche{color:#C04040;}

#media{width:100%;margin-bottom:0.4em;height:auto;background:#A2B7CA;
display:-webkit-flex;display:flex;flex-direction:row;float:left;box-shadow:0px 0px 2px 1px #4c4948;border-radius:5px;}
#suchfeld{margin:0.0em 0.0em 3.025em 6.0em; float:right;width:250px;height:20px;}
#Branche{margin-bottom:0.2em;  text-align:center; width:95%; } 

#PLZ-Be {clear:both; padding-left:5%; line-height:2.2em;  text-align:left; width:95%; background:#A2B7CA; box-shadow:0px 0px 2px 1px #4c4948; border-radius:5px;} 
#PLZ-Be a {color:#242424}
#plz-bereich{clear:both;position:relative;top:5px;background:#A0B6CD;
display:inline-block;width:100%;vertical-align:top;box-shadow:0px 0px 2px 1px #4c4948;border-radius:5px}
#Seiten-Anzahl{clear:both; width:80%;font-size:1.0em;margin:1.0em 0.5em 1.4em 2.0em}


#anfang-seite{clear:both;position:relative;top:5px;background:#FFFFFF;display:inline-block;width:95%;vertical-align:top;margin:0em;padding:0em;text-align:left;}
#seitennnummer{box-sizing:border-box;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;clear:both;width:100%;clear:both;height:auto;background:#FFFFFF;}
#inhalt{margin-top:-10px; vertical-align:top; display:inline-block; width:35%; font-size:1.0em; padding-left:10px;}

#zweite-spalte 
{vertical-align:top;display:inline-block;padding-left:10px; width:10%;font-size:1.0em; 
margin:0em; background-color:red}

#rechte-spalte{vertical-align:top; width:45%;height:auto;float:right} 
#rechte-spalte img {max-width:240px; box-shadow:5px 5px 1px 2px #A2B7CA; border-radius:5px; margin-bottom:0.5em}

#vor-zurueck{text-align:center;clear:both;margin:1.8em 0.0em 0.0em 0.0em}
#vor-zurueck a{padding-left:0.5em;padding-right:0.5em}
#unten{clear:both;width:100%;background:#ffffff;vertical-align:top;margin:0em;text-align:center}
#handwerk-cg{width:100%;text-align:center} 
#handwerk-cg img{max-width:468px;}
#unten img{max-width:468px;}
#footer{width:100%;clear:both;}
#footer img{max-width:100px}
#partner{width:100%;clear:both;text-align:left;}

@media screen and (max-width: 800px) {
 #zweite-spalte {display:none;height:auto;}
#inhalt   {width:96%; margin:0.225em 0.2em 0.625em 0.1em;}
 #rechte-spalte{width:96%; margin:0.225em 0.2em 0.625em 0.0em;}  }
@media screen and (max-width:600px)
{ 

#inhalt{margin-top:0px; vertical-align:top; display:inline-block; font-size:1.0em; padding-left:10px;}

.hide,.show img{width:40px;height:11px}
.hide{display:block;margin:-1.4em 0 1.5em 1em}
.show{display:block;margin:-1.4em 0 .5em 1em}
#akkordeon:not(:target) .inhalt{display:none}
#akkordeon:not(:target) .hide{display:none}
#akkordeon:target .inhalt{display:block;word-wrap:break-word}
#akkordeon:target 
.show{display:none}
.inhalt ul li a{color:#000;font-weight:700;font-size:1.0em;white-space:normal;
line-height:1.8em;padding:.263em .238em .275em .238em;
transition:background .2s;-webkit-transition:background .2s} }


@media screen and (max-width:550px)
{body {font-size:1.0em;}
h1{font-size:1.0em;}
#header{display:none;height:auto;}
menubar {display:inline-block; font-size:1.0em; margin-top:-30px}
#menubar ul li a.menubutton{display:block}
.beschreibung{display:none;height:auto}
#partner{display:none;height:auto}
  }

