﻿canvas {
  border:0 solid #9C9898
}
.html-map area, .html-map-2 area{
  cursor:pointer;
}
#map_container {
  text-align:left;
  height:auto;
  width:100%;
  max-width:730px;
  position:relative;
}

#map_container img{
  width:100%;
  position:absolute;
}

#Buttons {
    position: absolute;
    z-index: 99;
  margin-top:10px;
  margin-left:15px;
}

#zoomInButton {
  padding:3px;
  margin:0;
  cursor:pointer;
  line-height:10px;
}
#zoomOutButton {
  margin:0;
  cursor:pointer;
  padding:3px;
  line-height:10px;
}
#zoomInButton img, #zoomOutButton img{
  width:auto;
  height:auto;
  position:relative;
    -moz-box-shadow:  1px 0px 4px -1px #333333;
  -webkit-box-shadow:  1px 0px 4px -1px #333333;
  box-shadow:  1px 0px 4px -1px #333333;
  border-radius:2px;
  margin-bottom:0px;
}

#map-scale{
  width:5px;
  margin: 2px 8px;
  border:1px solid #666666;
  list-style:none;
  border-radius:6px;
  height:54px;
  -moz-box-shadow:  1px 0px 4px -1px #333333;
  -webkit-box-shadow:  1px 0px 4px -1px #333333;
  box-shadow:  1px 0px 4px -1px #333333;
  background:#fff;
}
#map-scale ul{
  margin-top: 9px;
  margin-left:-3px;
}
#map-scale li{
  width:11px;
  height:2px;
  background-color: #666;
  list-style:none;
  margin-bottom:9px;
}
#map-scale .active{
  border: 2px solid #f1bf00;
  border-radius: 2px;
  margin-top:-2px;
  margin-bottom: 7px;
  margin-left:-2px;
}

#Kompass {
    position: absolute;
    z-index: 100;
  bottom:5px;
  right:15px;
  display:block;
}
#Kompass img{
  width:auto;
  height:auto;
  position:relative;
    -moz-box-shadow:  1px 0px 4px -1px #333333;
  -webkit-box-shadow:  1px 0px 4px -1px #333333;
  box-shadow:  1px 0px 4px -1px #333333;
  border-radius:15px;
}

#tooltip_hover_Container{
  max-width: 220px;
  position: absolute;
  opacity: 1;
  z-index: 120;
  left:10000px;
}

#tooltip_hover_Container a{
  text-decoration:none;
}
#tooltip_arrow{
  width:30px;
  height:30px;
  position:absolute;
  top:2px;
  z-index:-1;
  border:none;
}

#tooltip_closeButton{
  width:24px;
  height:26px;
  position:absolute;
  top:3px;
  z-index:1;
  border:none;
  right:-1px;
  cursor:pointer;
}

#tooltip_closeButton img{
  width:21px;
  height:20px;
}

#tooltip_hover_Header {
    background-color: #fff;
    padding: 3px 5px 3px 5px;
  margin-bottom:10px;
  -moz-box-shadow:  0 0px 3px 0px #333333;
  -webkit-box-shadow:  0 0px 3px 0px #333333;
  box-shadow:  0 0px 3px 0px #333333;
  display:none;
}


#tooltip_hover_Header img {
  margin-right:5px
}


#tooltip_hover_Content {
    background-color: #FFFFFF;
    min-height: 10px;
  padding-bottom:5px;
  -moz-box-shadow:  0 0px 3px 0px #333333;
  -webkit-box-shadow:  0 0px 3px 0px #333333;
  box-shadow:  0 0px 3px 0px #333333;
  width: 220px;
  float:left;
}

#tooltip_hover_Content p{
  margin:0 2px 10px;
  padding: 3px 3px 3px 5px;
  width:auto;
  float:none;
}
#tooltip_hover_Content img{
  position:relative;
  max-width: 220px;
  height: auto;
}
#tooltip_hover_Content h4{
  padding-left:7px;
}
#tooltip_hover_Content h4 a{
  color:#fff;
  cursor:pointer;
}

/* Zu Vermieten */
#tooltip_arrow.mieten{
   background-image: url(../images/Pfeile_Mietobjekte.png) !important;
}
.mieten{
  border:1px solid #ffc000;
}
.zuVermieten{
  background:#ffc000;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Verkaufsobjekte */
#tooltip_arrow.verkaufen{
   background-image: url(../images/Pfeile_Verkaufsobjekte.png) !important;
}
.verkaufen{
  border:1px solid #ff0000;
}
.zuVerkaufen{
  background:#ff0000;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Gemeindeliegenschaften */
#tooltip_arrow.gemeindeliegenschaft{
   background-image: url(../images/Pfeile_Gemeindeliegenschaften.png) !important;
}
.gemeindeliegenschaften{
  border:1px solid #0070c0;
}
.titelgemeindeliegenschaften{
  background:#0070c0;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Klinik */
#tooltip_arrow.klinik{
   background-image: url(../images/Pfeile_klinik.png) !important;
}
.klinik{
  border:1px solid #00b0f0;
}
.titelklinik{
  background:#00b0f0;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Tierpark */
#tooltip_arrow.tierpark{
   background-image: url(../images/Pfeile_tierpark.png) !important;
}
.tierpark{
  border:1px solid #953735;
}
.titeltierpark{
  background:#953735;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Swingolf */
#tooltip_arrow.swingolf{
   background-image: url(../images/Pfeile_swingolf.png) !important;
}
.swingolf{
  border:1px solid #009900;
}
.titelswingolf{
  background:#009900;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Wald */
#tooltip_arrow.wald{
   background-image: url(../images/Pfeile_Wald.png) !important;
}
.wald{
  border:1px solid #748b68;
}
.titelwald{
  background:#748b68;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Reben */
#tooltip_arrow.reben{
   background-image: url(../images/Pfeile_Reben.png) !important;
}
.reben{
  border:1px solid #d5e89a;
}
.titelreben{
  background:#d5e89a;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Wohngebiete */
#tooltip_arrow.wohngebiete{
   background-image: url(../images/Pfeile_Wohngebiete.png) !important;
}
.wohngebiete{
  border:1px solid #e46d0a;
}
.titelwohngebiete{
  background:#e46d0a;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Landwirtschaft */
#tooltip_arrow.landwirtschaft{
   background-image: url(../images/Pfeile_Landwirtschaft.png) !important;
}
.landwirtschaft{
  border:1px solid #996600;
}
.titellandwirtschaft{
  background:#996600;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

/* Grünzone */
#tooltip_arrow.gruenzone{
   background-image: url(../images/Pfeile_gruenzone.png) !important;
}
.gruenzone{
  border:1px solid #94ce72;
}
.titelgruenzone{
  background:#94ce72;
  color:#fff;
  font-weight:bold;
  padding: 3px 3px 3px 5px;
}

.available{
  border: 5px solid yellow;
}
.map-viewport{ position:relative; width:auto;  height:510px; border:1px solid black; overflow:hidden; margin:0 0 20px 0;}
#map img{ width:auto;}
.level{ position:absolute; left:0; top:0; z-index:10;}
.current-level{ z-index:20; }

#map{ width:730px; height:510px; position:absolute; left:0; top:0;}
img{ border:0; }

.block{    
  float: left;
    margin-left: -5px;
    margin-right: 2%;
    margin-top: -5px;
    padding: 5px;
}


/* medium smartphones ----------- */
@media (max-width: 540px) {
  .map-viewport{ position:relative;  height:310px; border:1px solid black; overflow:hidden; margin:0 0 20px 0;}

}