@font-face {
    font-family: 'Oswald';
    src: url('fonts/subset-Oswald-Bold.woff2') format('woff2'),
        url('fonts/subset-Oswald-Bold.woff') format('woff');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}



/*body {
  min-height: 100vh;
  min-height: -webkit-fill-available;
}

html {
  min-height: -webkit-fill-available;
}*/

.wrapper {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}

.marker {
  visibility: hidden;
}

.marker-visible {
  visibility: visible;
}

body.map-page {
  overflow: hidden;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase;
}

.header {
	background: transparent !important;
	position: absolute;
	top: 40px;
	right: 40px;
	z-index: 1;
	width: 100px;
	height: 80px;
}

.header p {
	color: #222;
}

.filter-hidden {
  display: none;
}

.filter-content a,
.ajax-content a,
em {
  color: #106B3B !important;
}

.toggle-active {
  font-weight: bold;
}

.switchlist {
  list-style-type: none;
  padding-left: 0 !important;
  font-size: .75rem !important;
  text-transform: uppercase;
}

.switchlist li a {
  color: #222 !important;
}

.switchlist li.uk-active a {
  color: #106B3B !important;
}

.lang-items {
  padding-top: 10px;
}

@media screen and (max-width: 640px) {
  .nav svg {
    width: 30px !important;
    height: 30px !important;
  }

  .nav .navbar-icon {
    padding: 0 5px !important;
  }
}

dd {
  display: none;
}

.uk-tooltip {
    padding: 11px 6px !important;
    background: #106B3B !important;
    border-radius: 0 !important;
}

.uk-subnav-pill>.uk-active>a {
background-color: transparent !important;
color: #106B3B !important;
border-bottom: 2px solid #106B3B;
}

.uk-subnav-pill>*>a:active {
background-color: transparent !important;
color: #106B3B !important;
border-bottom: 2px solid transparent;
}

.uk-subnav {
  margin-left: 0 !important;
}

.uk-subnav>* {
  padding-left: 0 !important;
  margin-right: 10px;
}

.uk-subnav-pill>*>:first-child {
  padding: 0 !important;
  font-size: .75rem !important;
}

.uk-list {
  text-transform: uppercase;
  font-size: .75rem !important;
}

.uk-list>li:nth-child(n+2), .uk-list>li>ul {
  margin-top: 0px !important; 
}

.uk-list li a {
  text-decoration: none !important;
  color: #222 !important;
}

.uk-list li.uk-active a {
  text-decoration: none !important;
  color: #106B3B !important;
}
/*#map {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}*/

#map {
/*  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;*/
  width: 100%;
  height: 100%;
/*  min-height: -webkit-fill-available;*/
}

.uk-offcanvas-bar .uk-accordion-title,
.uk-offcanvas-bar a {
  color: #222 !important;
}

.uk-offcanvas-bar hr {
  border-top-color: #222 !important;
}

.uk-offcanvas-bar {
  background: #f2f2f2 !important;
  color: #222 !important;
}

.uk-open>.uk-offcanvas-bar {
    left: 0 !important;
  }

/*@media screen and (min-width: 640px) {
  #map {
    min-height: 100%;
    top: 0;
  }
}*/


.mapbox-improve-map {
  display: none !important;
}


.mapboxgl-ctrl-top-right {
top: inherit !important;
left: 10px;
bottom: 10px;
right: inherit !important;
}

.main-nav {
  width: 100%;
  position:fixed;
  z-index: 1002;
  pointer-events: none;
}




ul.nav {
    margin:0 auto;
    height:60px;
    list-style-type: none;
    padding-left: 10px !important;
    background: #fff;
}

body.map-page ul.nav {
  background: transparent !important;
}


ul.nav > li {
    margin-right:5px;
    margin-left:5px;
    float:left;
    height:100%;
    font-family: Oswald, sans-serif;
}

ul.nav > li a {
    pointer-events: auto;
}

.uk-navbar-item, .uk-navbar-nav>li>a, .navbar-icon {

min-height: 80px !important;

}
.navbar-icon {
display: flex;
justify-content: center;
align-items: center;
box-sizing: border-box;
padding: 0 15px;
font-size: .875rem;
font-family: -apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji";
text-decoration: none;
}


ul.nav li.icon-logo {

  float:right;
}


ul.nav li a {
    color:#02324e;
}


  .bar-logo {
    background: transparent;
    text-indent: -9999px;
    transform: initial;
    -webkit-transform: initial;
    -moz-transform: initial;
  }

  .bar-logo {
    background: transparent url(images/logo_text_02.svg);
    width: 232px !important;
    height: 90px !important;
    background-repeat: no-repeat;
    background-size: 232px 90px !important;
    display: block;
    background-position: center;
  }



.info-buttons, .project-buttons {
  display: none;
}

.info-buttons-visible, .project-buttons-visible {
  display: block;
}
  /* MAX-WIDTH ANFANG */
@media screen and (max-width: 640px) {

  .bar-logo {
    background: transparent url(images/logo_text_02.svg);
    width: 155px !important;
    height: 80px !important;
    background-repeat: no-repeat;
    background-size: 155px 60px !important;
    display: block;
    background-position: center;
  }


  :not(.uk-offcanvas-flip).uk-offcanvas-container-animation {
    left: 100vw !important;
  }


  .uk-offcanvas-bar {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -100vw !important;
  box-sizing: border-box;
  width: 100vw !important;
  }


  .panel, .info-panel {
    height: 100% !important;
    width: 100vw !important;
    position: absolute !important;
    top: 0 !important;
    left: -100% !important;
    -webkit-box-shadow: none !important;
    -moz-box-shadow: none !important;
    box-shadow: none !important;
    -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;
z-index: 1003;
  }

  .panel.shown, .info-panel.shown {
    height: 100% !important;
    /*height: 205px !important;*/
    width: 100vw !important;
    position: absolute !important;
    top: 0 !important;
    left: calc(-100% + 40px) !important;
    -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;
  }

  .panel.shown.panel-visible, .info-panel.shown.panel-visible {
    height: 100% !important;
    left: 0 !important;
    top: 0 !important;
    -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;
  }

  .project-content,
  .info-content {
    padding: 40px 40px 80px 40px !important;
    color: #222;

  }


  .controls, .info-controls {
  /*width: 100% !important;*/
  height: 40px!important;
  position: absolute!important;
  /*top: inherit !important;*/
  /*bottom: -80px!important;*/
  /*left: 0!important;*/
  z-index: 1004;
  background: #106B3B;
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;

top: -40px;
right: 0px;
}

.controls.controls-visible.shown,
.info-controls.controls-visible.shown  {
  /*left: 0!important;
  bottom: 0!important;*/
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;

top: 0px;
right: 0px;
}

.controls.shown,
.info-controls.shown {
  /*left: 0!important;
  bottom: 0px!important;*/
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;

top: 0px;
right: 0px;

}

  .toggle-button {

/*  position: initial !important;*/
  width: 40px;
  height: 40px;
  background: #106B3B;
  color: #fff;
  cursor: pointer;
/*  border-right: 1px solid #fff;*/
  box-sizing: border-box;
  float: right;
}


.close-button {
/*  left: 40px;*/
  /*border-left: 1px solid #fff;*/
}

.hide-button {
/*  left: 82px;*/
}

.show-button {
/*  left: 123px;*/
}

.zoom-button {
/*  left: 164px;*/
}

.unzoom-button {
/*  left: 205px;*/
}
}


/* MAX WIDTH ENDE */
@media screen and (min-width: 640px) {

:not(.uk-offcanvas-flip).uk-offcanvas-container-animation {
left: 620px !important;
}
   .uk-offcanvas-bar {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -620px !important;
  box-sizing: border-box;
  width: 620px !important;
  }



.header {
	background: transparent !important;
  position: absolute;
  top: 40px;
  right: 40px;
  z-index: 1;
  width: 100px;
  height: 80px;
}

.header p {
	color: #222;
}

.bar-logo {
  text-indent: -9999px;
}


}

#project-view {
  position: relative;
}

.controls,
.info-controls {
  width: 40px;
  height: 204px;
  position: absolute;
/*  top: calc(50vh - 102px);
  left: -40px;*/
  z-index: 1004;
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;
}

.controls.controls-visible.shown,
.info-controls.controls-visible.shown {
  /*left: 620px;*/
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;

}

.controls.shown,
.info-controls.shown {
/*  left: 0px;*/
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;

}

.stick-me {
  position: sticky;
  position: -webkit-sticky;
  overflow: auto;
  top: 0px;
  width: 40px;
  float: right;
}
.toggle-button {

  right: 0;
  width: 40px;
  height: 40px;
  background: #106B3B;
  color: #fff;
  cursor: pointer;
}


.close-button {
  top: 0px;
  float: right;
}

.hide-button {
  top: 41px;
}

.show-button {
  top: 82px;
}

.zoom-button {
  top: 123px;
}

.unzoom-button {
  top: 164px;
}

.scroll-overlay {
	background: #222;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	z-index: 1;
	opacity: 0;
	pointer-events: none;
}

.scroll-overlay.scrolling {
	opacity: .75;
}

.marker-strasse {
  color: #106B3B;
  cursor: pointer;
}

.marker-museum {
  color: #cc6600;
  cursor: pointer;
}

.marker-zeit {
  color: #5b85d0;
  cursor: pointer;
}

.active-marker {
  color: #106B3B;
}

.panel,
.info-panel {
  height: 100%;
  width: 620px;
  position: absolute;
  top: 0;
  left: -620px;
  z-index: 1003;
  box-sizing: border-box;
  overflow-y: auto;
  background: #f2f2f2;
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;

}

.panel.shown,
.info-panel.shown {
  height: 100%;
  width: 620px;
  position: absolute;
  top: 0;
  left: -580px;
  z-index: 1003;
  box-sizing: border-box;
  overflow-y: auto;
  background: #f2f2f2;
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}

.panel.shown.panel-visible,
.info-panel.shown.panel-visible {
  left: 0;
  -webkit-transition: all .5s 0s ease-in-out;
-moz-transition: all .5s 0s ease-in-out;
-o-transition: all .5s 0s ease-in-out;
transition: all .5s 0s ease-in-out;
-webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
-moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}





.project-content,
.info-content  {
  padding: 40px 40px 40px 120px;
  color: #222;
}

@media screen and (min-width: 640px) {
  .project-content,
  .info-content {
    padding: 40px !important;
    color: #222;
  }
}


.panel, .info-panel {
  overflow-y: scroll;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.panel::-webkit-scrollbar,
.info-panel::-webkit-scrollbar {
  width: 0;
  height: 0;
}






/**
 * WireFatalError is a class that ProcessWire will use to output
 * fatal errors in the design, but only if debug mode is on, or if
 * you are logged in as a superuser.
 *
 */
.WireFatalError {
	background: #a30000;
	color: #fff;
	padding: 1em;
	position: relative;
	z-index: 9999;
}

/*********************************************************************
 * 6. Accessibility helpers
 *
 */

/* Hide visually, but remain approachable for screenreader */

.visually-hidden {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	white-space: nowrap;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
	border: 0;
}

/* Show bypass link on hover */

.element-focusable:focus {
	clip: auto;
	overflow: visible;
	height: auto;
}

/* Sample styling for bypass link */

.bypass-to-main:focus {
	top: 0;
	left: 0;
	z-index: 10;
	width: 100%;
	height: 40px;
	line-height: 40px;
	text-align: center;
	background: #333;
	color: #fff;
}


