body {
  margin: 0px;
  font-family: Arial, Helvetica, sans-serif;
  background-color:#454545;

  
}


.container {
width:850px;
  margin: auto;
  background-color: #afafaf; 
 margin-top:10px;
  }


.row:after {
    content: "";
    display: table;
    clear: both;

}
.containerin {
  width: 400px;
  background-color: #c5c5c5;
  float:left;
 margin-bottom:-10px;
 margin:10px;
 padding-left:4px;
height:280px;
  }

.bor {
    border-bottom: 2px solid white;
}

.topnav {
  overflow: hidden;
  margin-top:0px;
  background-color: #afafaf;
  font-family: 'PT Sans Narrow', sans-serif;


}

.topnav a {
  float: right;
  color: #454545;
  text-align: center;
  padding: 5px 6px 5px 6px;
  text-decoration: none;
  font-size: 17px;
border-right: 1px solid #555;
  
}

.topnav a:hover {
  background-color: #3f3f3f;
  color: black;
}

.topnav a.active {
  background-color: #959595;
  color: white;
}
.linesepbright {
   
    background-color: white;
    height: 2px;
    clear: both;
width:100%;
}
.linesep {
    
    background-color: gray;
    height: 2px;
    clear: both;
width:100%;
}
#box{box-shadow: 5px 10px;}

.header{
	height:110px;
	width:100%;
background-color:#818181;
background-image: url('header.png');
 background-position:right;
 background-repeat: no-repeat;
	
	
} 

											/* imageslider  inaktiv*/


												/* hierfaengt das hoverimg an */

  ul.enlarge{
    list-style-type:none; /*bulletpoint weg*/
    margin-left:-55px;
    }
    ul.enlarge li{
    display:inline-block; /*in ne reihe*/
    position: relative;
    z-index: 0; /*stack zuruecksetzten*/
    margin:0px 0px 0px 15px;
text-align:center;
font-weight:bold;
    }
    ul.enlarge img{
    background-color:#afafaf;
    padding: 6px;
    -webkit-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
    -moz-box-shadow: 0 0 6px rgba(132, 132, 132, .75);
    box-shadow: 0 0 6px rgba(132, 132, 132, .75);
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;

    }
    ul.enlarge span{
    position:absolute;
    left: -9999px;

    background-color:#eae9d4;
    padding: 5px;
    font-family: 'Droid Sans', sans-serif;
    font-size:.9em;
    text-align: center;
    color: #495a62;
    -webkit-box-shadow: 0 0 20px rgba(0,0,0, .75));
    -moz-box-shadow: 0 0 20px rgba(0,0,0, .75);
    box-shadow: 0 0 20px rgba(0,0,0, .75);
    -webkit-border-radius: 8px;
    -moz-border-radius: 8px;
    border-radius:8px;
    }
    ul.enlarge li:hover{
    z-index: 50;
    cursor:pointer;
    }
    ul.enlarge span img{
    padding:2px;
    background:#ccc;
    }
    ul.enlarge li:hover span{
	position:absolute;
   bottom: 148px; /*abstand unterm thumb ueber popup*/
    left:-80px; /*abstand links vom thumb zum popup*/
    }

#mapdiv {
          width: 60%;
          height: 268px;
          margin: 0;
	  float:left;}
.anf{
height:268px;
float:left;
width:40%;
}


}

}.as li {display: inline;
    list-style: none;

    min-height: 175px;
    float: left;
    margin: 0 0px 0px 0;
    text-align: center;}
@media only screen and (max-width:850px) {
  /* unter 850 */
  .container, .containerin, .linesep {width:100%;padding:0px; margin:0px; text-align:center;}
 .topnav a, .active { width:100%; overflow:hidden;float:left; border-bottom:1px solid lightgray;}
 .header{background-image:url(header.png)background-image:no-repeat;height:110px;width:100%;float:center}
     ul.enlarge li:hover span{	position:fixed;  top:0px; left:0px;padding:0px; height:270px;width:100%;}
 ul.enlarge span img{padding:0px;}
#mapdiv {width: 100%;height:268px;margin: 0px;}
.anf{width:100%;text-align:center;}
.header {background-position:center;}
}
@media only screen and (max-height:380px) {    ul.enlarge li:hover span{	position:fixed;  top:0px;left:25%;padding:0px; height:220px;width:325px;}    ul.enlarge span img{padding:0px; height:200px;width:auto;}   }