/*Grund-Style - orte-test.css -2023*/ 
body{background:#FFFFFF;font-size:100%;font-family:Helvetica;margin:0.0em;max-width:100%}
 h1   {  font-size:100%;  margin-bottom:2px; color:#000000; margin-top:1px;}
 h2  {  font-size:100%;  margin-bottom:2px; color:#000000; margin-top:1px;}
.listengrafik {list-style-image: url(https://handwerkernet.de/orte/images/list.gif);}
#ueber-an  {text-align:center; font-size:0.8em; padding:0.0em 0.0em 0.0em 2.5em;}
label {}
/* Header */ 
#banner{background:url(https://handwerkernet.de/handwerk-2018.jpg);background-repeat:no-repeat;background-position:center top;background-size:contain;width:100%;height:168px}
#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{display:block;height:auto;background:#a2b7ca;text-align:center;margin-bottom:1em;box-shadow:0 0 2px 1px #4c4948;border-radius:5px} 
.inhalt ul li{display:inline; margin:0 .4em 0 .01em;white-space:nowrap}
.inhalt ul{display:block;margin:0;padding:0}
.inhalt ul li a{color:#000; font-weight:700;font-size:18px;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}
#branchenbeschreibung-zurueck {display:none}
#menubar{display:block;text-align:center;background:#ffffff;}
#menubar img{max-width:40px;padding-left:40px}

#ueber-branchen{text-align:left;width:100%;color:#000000;margin-top:1px;}
#ueber { text-align:center; width:100%;   color:#000000; margin-top:1px;}
.suche{ color:#C04040;}  
h2 { text-align:left; } .aktuelle_seitennummer{ color:#777777;}  
img { width:90%; height:auto; max-width:100%} /*für Responsive funktion*/
#button-solo-mo  {width:100%; height:auto; margin-bottom:0.0em; margin-top:0.0em; 
 background:#A2B7CA; display:-webkit-flex; display:flex;}
#media 
{width:100%; margin: 0.4em 1.0em 1.0em 0em;
height:auto;
background:#A2B7CA; display:-webkit-flex;
display:flex; flex-direction:row; float:left; box-shadow:0px 0px 2px 1px #4c4948; border-radius:5px;}
#media1, #media2, #media3, #media4, #media5, #media6, #media7
{ width:25px;  float:left; background:#A2B7CA; vertical-align:top; margin:0.4em 0.5em 0.4em 0.0em}
#media1{ padding-left:5%;} 
#media img { max-width:25px;}
  #buchstaben-a-bis-z {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;  padding:0.0em 1.0em 1.0em 1.0em; 
 width:98%; line-height:1.6em; clear:both; height:auto; background:#CFCFCF; margin:0.0em 1.0em 0.2em 1.0em; box-shadow:0px 0px 1px 1px #4c4948;border-radius:5px;} 
#buchstaben-a-bis-z a {color:black; margin:1.4em 0.4em 0.6em 0.4em; line-height:1.8em; font-size:20px;}
#buchstaben_seitenliks{margin:0.0em 0.0em 1.0em 1.0em;}
#buchstaben_seitenliks a {font-size:20px; margin:0.0em 1.4em 0.0em 1.4em; }

#orte-ueb {box-sizing:border-box; 
 -webkit-box-sizing:border-box;
 -moz-box-sizing:border-box; width:100%; clear:both; height:auto;  margin:0.0em 0.5em 1.0em 0.0em; background:#A2B7CA; box-shadow:0px 0px 2px 1px #4c4948; border-radius:5px; padding:0.0em 1.0em 0.0em 1.0em; }
#umkreissuche-a-bis-z
{ box-sizing:border-box; clear:both; width:100%; clear:both; height:auto; background:#FFFFFF;}
#container-inhalt
{width:100%;  clear:both;  height:auto; 
display:-webkit-flex; 
display:flex; 
display:-ms-flexbox;
flex-direction:row; 
justify-content:space-between; 
 -ms-flex-pack: justify;  
box-sizing: border-box; 
-ms-box-sizing: border-box; 
 -webkit-box-sizing:border-box;
 -moz-box-sizing:border-box;
 padding:1.0em 1.0em 0.0em 1.0em;}
 
#branchen-spalte, #mitte-spalte
{vertical-align:top;  float:left;}
#branchen-spalte 
{width:25%; vertical-align:top; text-align:left; background:#FFFFFF}
#action-container
{display:-webkit-flex; display:flex; display:-ms-flexbox; float:left; width:100%;  height:auto; background:#FFFFFF;}
#form-action {height:auto; background:#FFFFFF; }
#branchen-spalte img {max-width:100px; box-shadow:0px 0px 5px -5px #4c4948; border-radius:5px}
#mitte-spalte {width:33%; vertical-align:top; text-align:left; background:#FFFFFF;}

#orte_liste ul li { margin:0.0em 0.0em 1.0em 0.0em;}
#mitte-spalte img {max-width:300px; box-shadow:0px 0px 5px -5px #4c4948; border-radius:5px}
.artikel-ein a {font-weight: bold;}

#rechte-spalte {vertical-align:top; width:35%; float:right; background:#FFFFFF; margin-left:3.0em;}
#rechte-spalte img {max-width:220px; box-shadow:5px 5px 1px 2px #A2B7CA; border-radius:5px; margin-bottom:2.0em}

#parent-element-id{ /*margin-top:-10px;*/ margin-left:10px; box-shadow:5px 5px 5px 5px #A2B7CA;  
border-radius:5px; word-wrap:break-word;} 
#parent-element-id img {max-width:130px; padding-left:20px; }
.anz-ama {margin-left:10px; padding-top:20px }
.anz-ama  u {background-color:#A2B7CA; box-shadow:2px 2px 2px 1px #A2B7CA;  border-radius:3px; text-decoration: none; }
.ama-txt{font-size:1.2em; margin: 20px 10px 0 10px}
.autor{ font-size:1.0em; margin: 20px 10px 0 10px}
.anzeigen-ama {font-size:12px; /*margin-right:20px;*/ margin-bottom:4px; margin-top:10px; text-decoration: underline black; }
.ama-abs {margin-left:20px; margin-right:20px}
#eigen-werb {max-width:100%;} 
#vor-zurueck {text-align: center; clear: both;}
#footer {width:100%;  clear:both; text-align:center; }
#footer img  { max-width:120px;}
#solomo{width:100%; height:60px; max-height:300px; margin-bottom:1.0em; margin-top:0.4em; 
 background:#A2B7CA; display:-webkit-flex; display:flex; box-shadow:0px 0px 1px 1px #4c4948; border-radius:5px;}
#solomo8 { width:100%;  text-align:left;margin: 20px 0 0 20px}


/* Mobile Style */ 
@media screen and (max-width: 800px)  
{ body { font-size:96%;}
#menubar, #umkreissuche-a-bis-z, #action-container, #container-seiten, #buchstaben-seitenlinks, #weiter-zurueck, #container-inhalt, #mitte-spalte, #rechte-spalte
{width:96%; display:block; margin:0.625em 0em 0.625em 0.0em;}
 #buchstaben-a-bis-z {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;  padding:0.0em 1.0em 1.0em 1.0em; 
 width:98%; line-height:1.6em; clear:both; height:auto; background:#CFCFCF; margin:0.0em 1.0em 0.2em 1.0em; box-shadow:0px 0px 1px 1px #4c4948;border-radius:5px;} 
#buchstaben-a-bis-z a {color:black; margin:1.4em 2.4em 0.6em 0.4em; line-height:1.8em; font-size:20px; }
#umkreissuche-a-bis-z { margin:0.0em 0.0em 0.0em 0.0em; float:left; line-height:1.800em; width:100%; }
#action-container  {clear:both;  width:100%; margin:1.0em 0.0em 0.0em 0.0em; background:#A2B7CA; box-shadow:0px 0px 1px 1px #4c4948;border-radius:5px;}
#form-action { width:99%; clear:both; margin:0.5em 0.0em 0.0em 1.0%;  height:auto; background:#A2B7CA;}
#input {width:99%;  height:auto; margin:1.0em 0.0em 0.5em 1.0%;}
#branchen-spalte { clear:both; margin:0.0em 0.0em 0.0em 0.00em;  width:100%;}
#ueber-branchen  { width:100%; margin:1.0em 0.0em 1.0em 0.0em;}
#branchen-spalte  ul li { margin:1.5em 0.0em 0.0em 0.00em;  width:100%;}
 .hide,.show img{width:40px;height:11px}
.hide, .show{display:block;margin:-1.8em 0 1.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:18px;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:96%; width:96%} 
h1 {font-size:90%; width:96%}
.hide,.show img{width:40px;height:11px}
 .show,  .hide{display:block;margin:-2.4em 0  1.5em 1em}
#menubar {display:none}
#orte_liste {line-height:1.6em;}
#footer {margin-bottom:0em; }
#solomo{width:100%; margin-bottom:3.0em;}
#buchstaben_seitenliks {line-height:1.8em; margin:0.0em 1.4em 0.0em 1.01em; width:100%;}
#buchstaben_seitenliks a {font-size:1.2em; margin:0.0em 0.4em 0.0em 0.4em;}
.aktuelle_seitennummer {font-size:1.6em; margin:0.0em 0.4em 0.0em 0.4em;}
.listengrafik {line-height:2.0em;}
#umkreissuche-a-bis-z {margin:0.0em 0.0em 0.0em 0.0em; float:left; line-height:1.6em; width:100%;}
#action-container  {clear:both;  margin:0.5em 0.0em 1.0em 0.0em; background:#A2B7CA;}
#branchen-spalte {clear:both; margin:0.0em 0.0em 0.0em 0.00em; width:100%;}
#ueber-branchen  {width:100%; margin:1.0em 0.0em 1.0em 0.0em;}
#branchen-spalte  ul li {margin:1.5em 0.0em 0.0em 0.00em;  width:100%;}
#buchstaben-a-bis-z  a  {line-height:1.8em; margin:2.1em 1.4em 2.1em 0.01em; width:100%;}
#media1, #media2, #media3, #media4, #media5, 
#media6, #media7, #media8, #media9
{margin:0.4em 0.6em 0.4em 0.2em;  line-height:2.600em;}
 }