:root{--zoomist-wrapper-bg-color: #efefef;--zoomist-slider-bg-color: rgba(255, 255, 255, .8);--zoomist-slider-border-radius: 0 0 4px 0;--zoomist-slider-padding-x: 20px;--zoomist-slider-padding-y: 20px;--zoomist-slider-track-color: #ddd;--zoomist-slider-track-color-hover: #ccc;--zoomist-slider-bar-size: 120px;--zoomist-slider-bar-side: 2px;--zoomist-slider-bar-border-radius: 2px;--zoomist-slider-bar-color: #666;--zoomist-slider-bar-color-hover: #444;--zoomist-slider-button-size: 12px;--zoomist-slider-button-color: #e0202c;--zoomist-zoomer-button-size: 48px;--zoomist-zoomer-button-color: rgba(255, 255, 255, .8);--zoomist-zoomer-button-color-hover: rgba(255, 255, 255, .9);--zoomist-zoomer-button-color-disabled: rgba(255, 255, 255, .8);--zoomist-zoomer-button-opacity-disabled: .7;--zoomist-zoomer-icon-size: 14px;--zoomist-zoomer-icon-color: #333;--zoomist-zoomer-icon-color-hover: #111;--zoomist-zoomer-icon-color-disabled: #999;--zoomist-modules-tranistion-duration: .3s}.zoomist-container{position:relative;padding:0!important;touch-action:none;user-select:none;cursor:pointer}.zoomist-wrapper{position:relative;z-index:1;width:100%;height:100%;padding:0!important;overflow:hidden;background-color:var(--zoomist-wrapper-bg-color)}.zoomist-image{position:relative;max-width:none!important;max-height:none!important;pointer-events:none}.zoomist-slider{position:absolute;z-index:2;bottom:0;left:0;padding:var(--zoomist-slider-padding-y) var(--zoomist-slider-padding-x);background-color:var(--zoomist-slider-bg-color);border-radius:var(--zoomist-slider-border-radius)}.zoomist-slider:hover .zoomist-slider-wrapper{background-color:var(--zoomist-slider-track-color-hover)}.zoomist-slider:hover .zoomist-slider-bar{background-color:var(--zoomist-slider-bar-color-hover)}.zoomist-slider:hover .zoomist-slider-button:before{box-shadow:0 0 8px #0009}.zoomist-slider-horizontal .zoomist-slider-wrapper{align-items:center;justify-content:flex-start;width:var(--zoomist-slider-bar-size);height:var(--zoomist-slider-bar-side)}.zoomist-slider-horizontal .zoomist-slider-bar{top:0;width:calc(var(--value) * 1%);height:100%}.zoomist-slider-horizontal .zoomist-slider-button{left:calc(var(--value) * 1%)}.zoomist-slider-vertical .zoomist-slider-wrapper{align-items:flex-end;justify-content:center;width:var(--zoomist-slider-bar-side);height:var(--zoomist-slider-bar-size)}.zoomist-slider-vertical .zoomist-slider-bar{bottom:0;width:100%;height:calc(var(--value) * 1%)}.zoomist-slider-vertical .zoomist-slider-button{bottom:calc(var(--value) * 1%)}.zoomist-slider-wrapper{position:relative;display:flex;background-color:var(--zoomist-slider-track-color);transition:background-color var(--zoomist-modules-tranistion-duration)}.zoomist-slider-bar{position:absolute;z-index:0;left:0;display:block;border-radius:var(--zoomist-slider-bar-border-radius);background-color:var(--zoomist-slider-bar-color);transition:background-color var(--zoomist-modules-tranistion-duration)}.zoomist-slider-button{position:relative;z-index:1;display:block;width:0!important;height:0!important}.zoomist-slider-button:before{content:"";position:absolute;left:calc(var(--zoomist-slider-button-size) * -.5);top:calc(var(--zoomist-slider-button-size) * -.5);width:var(--zoomist-slider-button-size);height:var(--zoomist-slider-button-size);display:block;background-color:var(--zoomist-slider-button-color, #fff);border-radius:50%;box-shadow:0 0 4px #0006;transition:box-shadow var(--zoomist-modules-tranistion-duration)}.zoomist-zoomer{position:absolute;z-index:2;top:0;left:0;border-radius:0 0 0 4px;overflow:hidden}.zoomist-zoomer-button{position:relative;display:flex;justify-content:center;align-items:center;width:var(--zoomist-zoomer-button-size);height:var(--zoomist-zoomer-button-size);background:none;background-color:var(--zoomist-zoomer-button-color);border:0;transition:background-color var(--zoomist-modules-tranistion-duration);cursor:pointer}.zoomist-zoomer-button:hover{background-color:var(--zoomist-zoomer-button-color-hover)}.zoomist-zoomer-button:hover .zoomist-zoomer-icon{fill:var(--zoomist-zoomer-icon-color-hover)}.zoomist-zoomer-button.zoomist-zoomer-disabled{pointer-events:none;background-color:var(--zoomist-zoomer-button-color-disabled);opacity:var(--zoomist-zoomer-button-opacity-disabled)}.zoomist-zoomer-button.zoomist-zoomer-disabled .zoomist-zoomer-icon{fill:var(--zoomist-zoomer-icon-color-disabled)}.zoomist-zoomer-icon{width:var(--zoomist-zoomer-icon-size);height:var(--zoomist-zoomer-icon-size);fill:var(--zoomist-zoomer-icon-color);transition:fill var(--zoomist-modules-tranistion-duration)}
.zoomist-wrapper {
    height:calc(100vw * 640.0 / 1280.0);
    max-height:640px;
    min-height:640px;
}

#zoomist_menu,
#zoomist_menu1 {
  position: relative;overflow: hidden;}
 
 
#menubuttons,
#menubuttons1 {
  position: absolute;
  top: 0em;
  right: 0;
  z-index: 2; 
}
#menubuttons li button,
#menubuttons1 li button {
  border: 0px solid #fff;
  background: transparent;
  cursor: pointer;
}

#menubuttons li,
#menubuttons1 li {
  margin-left: 0em;
  list-style-type: none;
  line-height: 1em !important;
  padding: 0 !important;
  margin:0 !important;
  font-size: .7em;  
}


#menubuttons li button,
#menupunkt span,
#menubuttons1 li button,
#menupunkt1 span  {
line-height: 160%;
margin: .2em 0;
}
#menubuttons li button::before,
#menupunkt span::before,
#menubuttons1 li button::before,
#menupunkt1 span::before  {
background-image: url("../../img/db/icon_quartiere.svg");
background-repeat: no-repeat;
background-size: 100% 100%;
content: "";
display: inline-block;
vertical-align: middle;
width: 45px;
height: 45px;
margin-right:8px;margin-bottom:6px;
transition: all 0.4s ease-in-out;
-webkit-transition: all 0.4s ease-in-out;
-moz-transition: all 0.4s ease-in-out;
}
 
  
#menubuttons li button#button0::before,
#menupunkt span.menupunkt0::before {background-image: url("../../img/db/icon_ueberblick.svg")}

#menubuttons li button#button1::before,
#menupunkt span.menupunkt1::before  {background-image: url("../../img/db/icon_quartiere.svg")}

#menubuttons li button#button2::before,
#menupunkt span.menupunkt2::before  {background-image: url("../../img/db/icon_strassen.svg")}

#menubuttons li button#button3::before,
#menupunkt span.menupunkt3::before  {background-image: url("../../img/db/icon_stadtbahn.svg")}

#menubuttons li button#button4::before,
#menupunkt span.menupunkt4::before  {background-image: url("../../img/db/icon_radnetz.svg")}

#menubuttons li button#button5::before,
#menupunkt span.menupunkt5::before  {background-image: url("../../img/db/icon_gruenflaeche.svg")}

#menubuttons li button#button6::before,
#menupunkt span.menupunkt6::before, 
#menubuttons1 li button#button10::before,
#menupunkt1 span.menupunkt10::before  {background-image: url("../../img/db/icon_kita.svg")}

#menubuttons li button#button7::before,
#menubuttons1 li button#button11::before,
#menupunkt span.menupunkt7::before,
#menupunkt1 span.menupunkt11::before {background-image: url("../../img/db/icon_gewerbe.svg")}


#menubuttons1 li button#button8::before,
#menupunkt1 span.menupunkt0::before  {background-image: url("../../img/db/icon_ba1.svg")}

#menubuttons1 li button#button9::before,
#menupunkt1 span.menupunkt9::before  {background-image: url("../../img/db/icon_gebaeude.svg")}
 
 

#zoomist_menu .collapse .kartennav,
#zoomist_menu1 .collapse .kartennav  {
  right: .25em;
  top: -1999px;
  bottom: auto;
  height: auto;
  left: auto;
  position: relative; 
  background: rgba(255,255,255,.9);
  padding: 25px 5px 5px 5px;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  box-shadow: rgba(0, 0, 0, .2) 0px 0px 15px 5px;
 
}

#zoomist_menu .collapse.in .kartennav,
#zoomist_menu1 .collapse.in .kartennav {
  right: .25em;
  top:.25em;
  transition: all .1s ease-in-out;
  z-index: 2;
}

#zoomist_menu .collapse #menupunkt,
#zoomist_menu1 .collapse #menupunkt1 {
	display: block;
	margin: .5em .5em 0 0;
	text-decoration: none;
	background: rgba(255, 255, 255, 0.9) none repeat scroll 0 0;
	border: medium none;
	padding: .2em .5em 0 .5em;
	min-width: 275px;
	/*width: 100%;*/ 
	font-size: .75em;
	font-weight: bold;
	line-height: 30px;
	box-shadow: rgba(0, 0, 0, .2) 0px 0px 15px 5px;
  }

#zoomist_menu .collapse.in #menupunkt,
#zoomist_menu1 .collapse.in #menupunkt1 {display: none !important}

#zoomist_menu .collapse .btn-toggle-nav,
#zoomist_menu1 .collapse .btn-toggle-nav {
  display: block;
  position: absolute;
  right: .25em;
  left: auto;
  top: 1em;
  bottom: auto;
  transition: all 0.4s ease-in-out;
  -webkit-transition: all 0.4s ease-in-out;
  -moz-transition: all 0.4s ease-in-out;
  position: absolute;
  z-index: 20;
  background: transparent; /*rgba(255,255,255,.8);*/
  line-height: 100%;
}


.collapse.in .btn-toggle-nav {
  left: auto;
  top: .5em;
  right: .25em;
  bottom: auto;
  background: transparent
}

 .btn-toggle-nav .menu-btn {
 
  cursor: pointer;
  height: 30px;
  margin: 1px 5px 0;
  outline: 0 none;
  text-decoration: none;
  background: rgba(255, 255, 255, 0) none repeat scroll 0 0;
  border: medium none;
  padding: 0;
}


.btn-toggle-nav .icon-bar {
  transition: all 0.2s linear 0s;
  display: block;
  height: 2px;
  width: 30px;
}
.btn-toggle-nav .icon-bar {
  background: #444 none repeat scroll 0 0;
  border-radius: 5px;
  border: 0px solid #444;
  display: block;
  height: 2px;
  margin-bottom: 5px;
  width: 30px;
}

 


.collapse.in .btn-toggle-nav .icon-bar {
  background: #444 none repeat scroll 0 0;
  width: 20px;
}


.collapse.in .btn-toggle-nav .icon-bar:nth-child(1) {
  transform: translate(0px, 0px) rotate(-45deg) scaleX(1.3);
}

.collapse.in .btn-toggle-nav .icon-bar  {    background: #444 none repeat scroll 0 0;}

.collapse .icon-bar:nth-child(1) {
    transform: none;
}
.collapse .icon-bar:nth-child(2) {
    transform: none;
    
}


.collapse.in .btn-toggle-nav .icon-bar:nth-child(1) {
    transform: translate(0px, 0px) rotate(-45deg) scaleX(1.3);
}
 
.collapse.in .btn-toggle-nav .icon-bar:nth-child(2) {
    height: 0 !important;
    transition: all 0.05s linear 0s;
}
.collapse.in .btn-toggle-nav .icon-bar:nth-child(3) {
    transform: translate(0px, -7px) rotate(45deg) scaleX(1.3);
}

.menuaktiv {font-weight: bold !important }
