/* Welcome to Compass.
 * In this file you should write your main styles. (or centralize your imports)
 * Import this file using the following HTML or equivalent:
 * <link href="/stylesheets/screen.css" media="screen, projection" rel="stylesheet" type="text/css" /> */
@import url("https://fonts.googleapis.com/css2?family=Roboto&display=swap");
:root {
  --range-slider: hsl(180, 3.9%, 84.9%);
  --range-handle-inactive: #764cff;
  --range-handle: #764cff;
  --range-handle-focus: #764cff;
  --range-handle-border: hsl(234, 67.6%, 71%);
  --range-range-inactive: #764cff;
  --range-range: #764cff;
  --range-float-inactive: #764cff;
  --range-float: #764cff;
  --range-float-text: hsl(0, 0%, 100%);
}

:root {
  --range-pip: lightgray;
  --range-pip-text: lightgray;
  --range-pip-active: #764cff;
  --range-pip-active-text: #764cff;
  --range-pip-hover: #764cff;
  --range-pip-hover-text: #764cff;
  --range-pip-in-range: #764cff;
  --range-pip-in-range-text: #764cff;
}

@font-face {
  font-family: "dust-regional";
  src: url("../fonts/dust-regional.eot?6i78o5");
  src: url("../fonts/dust-regional.eot?6i78o5#iefix") format("embedded-opentype"), url("../fonts/dust-regional.ttf?6i78o5") format("truetype"), url("../fonts/dust-regional.woff?6i78o5") format("woff"), url("../fonts/dust-regional.svg?6i78o5#dust-regional") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^=w-icon-], [class*=" w-icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "dust-regional" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 20px;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

[class^=w-icon-16], [class*=" w-icon-16"] {
  font-size: 16px;
}

.w-icon-thermometer:before {
  content: "\e90c";
}

.w-icon-16-pin:before {
  content: "\e909";
}

.w-icon-magnifier:before {
  content: "\e90a";
}

.w-icon-minus:before {
  content: "\e904";
}

.w-icon-plus:before {
  content: "\e905";
}

.w-icon-restore-screen:before {
  content: "\e906";
}

.w-icon-full-screen:before {
  content: "\e907";
}

.w-icon-play:before {
  content: "\e908";
}

.w-icon-wind:before {
  content: "\e900";
}

.w-icon-dust:before {
  content: "\e901";
}

.w-icon-eye:before {
  content: "\e902";
}

.w-icon-particles:before {
  content: "\e903";
}

.w-icon-home:before {
  content: "\e90d";
}

.w-icon-stop2:before {
  content: "\ea1e";
}

.w-icon-droplet:before {
  content: "\e90b";
}

.w-icon-stack:before {
  content: "\e92e";
}

.w-icon-folder-download:before {
  content: "\e933";
}

.w-icon-location:before {
  content: "\e947";
}

.w-icon-location2:before {
  content: "\e948";
}

.w-icon-compass2:before {
  content: "\e94a";
}

.w-icon-download:before {
  content: "\e960";
}

.w-icon-floppy-disk:before {
  content: "\e962";
}

.w-icon-spinner11:before {
  content: "\e984";
}

.w-icon-stats-dots:before {
  content: "\e99b";
}

.w-icon-meter:before {
  content: "\e9a6";
}

.w-icon-warning:before {
  content: "\ea07";
}

.w-icon-cancel-circle:before {
  content: "\ea0d";
}

.w-icon-onedrive:before {
  content: "\eaaf";
}

@font-face {
  font-family: "Critter-outline";
  src: url("../fonts/critter-outline.eot?6i78o5");
  src: url("../fonts/critter-outline.eot?6i78o5#iefix") format("embedded-opentype"), url("../fonts/critter-outline.ttf?6i78o5") format("truetype"), url("../fonts/critter-outline.woff?6i78o5") format("woff"), url("../fonts/critter-outline.svg?6i78o5#dust-regional") format("svg");
  font-weight: normal;
  font-style: normal;
  font-display: block;
}
[class^=c-icon-], [class*=" c-icon-"] {
  /* use !important to prevent issues with browser extensions that change fonts */
  font-family: "Critter-outline" !important;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  font-size: 26px;
  /* Better Font Rendering =========== */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.c-icon-pause-26:before {
  content: "\e98d";
}
.c-icon-wind-26:before {
  content: "\e98c";
}
.c-icon-layers-26:before {
  content: "\e989";
}
.c-icon-recenter-26:before {
  content: "\e98a";
}
.c-icon-minus-26:before {
  content: "\e98b";
}
.c-icon-menu-26:before {
  content: "\e988";
}
.c-icon-home-26:before {
  content: "\e987";
}
.c-icon-man-check-26:before {
  content: "\e986";
}
.c-icon-route-26:before {
  content: "\e985";
}
.c-icon-antenna-26:before {
  content: "\e983";
}
.c-icon-heart-26:before {
  content: "\e984";
}
.c-icon-copy-26:before {
  content: "\e981";
}
.c-icon-speedometer-26:before {
  content: "\e982";
}
.c-icon-cash-26:before {
  content: "\e97d";
}
.c-icon-upload-26:before {
  content: "\e97e";
}
.c-icon-man-lock-26:before {
  content: "\e97f";
}
.c-icon-import-26:before {
  content: "\e980";
}
.c-icon-download-26:before {
  content: "\e97c";
}
.c-icon-rejected-26:before {
  content: "\e97b";
}
.c-icon-handful-26:before {
  content: "\e97a";
}
.c-icon-gift-box-26:before {
  content: "\e979";
}
.c-icon-send-26:before {
  content: "\e978";
}
.c-icon-clipboard-26:before {
  content: "\e976";
}
.c-icon-open-externally-26:before {
  content: "\e977";
}
.c-icon-message-26:before {
  content: "\e973";
}
.c-icon-briefcase-26:before {
  content: "\e974";
}
.c-icon-pin-26:before {
  content: "\e975";
}
.c-icon-robot-26:before {
  content: "\e972";
}
.c-icon-flow-26:before {
  content: "\e971";
}
.c-icon-man-26:before {
  content: "\e970";
}
.c-icon-credit-card-26:before {
  content: "\e96f";
}
.c-icon-wallet-26:before {
  content: "\e96e";
}
.c-icon-shopping-basket-26:before {
  content: "\e96d";
}
.c-icon-calendar-graph-columns-26:before {
  content: "\e96c";
}
.c-icon-folder-plus-26:before {
  content: "\e96b";
}
.c-icon-mobile-26:before {
  content: "\e96a";
}
.c-icon-plug-26:before {
  content: "\e969";
}
.c-icon-digital-lock-26:before {
  content: "\e968";
}
.c-icon-check-26:before {
  content: "\e967";
}
.c-icon-shield-check-26:before {
  content: "\e965";
}
.c-icon-monitor-26:before {
  content: "\e966";
}
.c-icon-envelope-share-26:before {
  content: "\e964";
}
.c-icon-checkbox-checked-26:before {
  content: "\e963";
}
.c-icon-target-plus-26:before {
  content: "\e962";
}
.c-icon-man-mustache-26:before {
  content: "\e961";
}
.c-icon-folder-26:before {
  content: "\e92e";
}
.c-icon-tasklist-26:before {
  content: "\e92f";
}
.c-icon-office-worker-female-26:before {
  content: "\e930";
}
.c-icon-man-plus-26:before {
  content: "\e95f";
}
.c-icon-building-plus-26:before {
  content: "\e960";
}
.c-icon-share-26:before {
  content: "\e927";
}
.c-icon-layout-26:before {
  content: "\e928";
}
.c-icon-chain-26:before {
  content: "\e929";
}
.c-icon-doctor-26:before {
  content: "\e92a";
}
.c-icon-bell-26:before {
  content: "\e92b";
}
.c-icon-man-magnifier-26:before {
  content: "\e92c";
}
.c-icon-batch-26:before {
  content: "\e92d";
}
.c-icon-wrench-26:before {
  content: "\e931";
}
.c-icon-ruler-26:before {
  content: "\e932";
}
.c-icon-variable-26:before {
  content: "\e933";
}
.c-icon-square-root-26:before {
  content: "\e934";
}
.c-icon-calculator-26:before {
  content: "\e935";
}
.c-icon-language-26:before {
  content: "\e936";
}
.c-icon-video-26:before {
  content: "\e937";
}
.c-icon-group-26:before {
  content: "\e938";
}
.c-icon-button-26:before {
  content: "\e939";
}
.c-icon-axis-26:before {
  content: "\e93a";
}
.c-icon-public-building-26:before {
  content: "\e93b";
}
.c-icon-moon-26:before {
  content: "\e93c";
}
.c-icon-id-26:before {
  content: "\e93d";
}
.c-icon-devices-26:before {
  content: "\e93e";
}
.c-icon-document-speedwatch-26:before {
  content: "\e93f";
}
.c-icon-qr-code-26:before {
  content: "\e940";
}
.c-icon-indicator-26:before {
  content: "\e941";
}
.c-icon-calendar-man-26:before {
  content: "\e942";
}
.c-icon-calendar-scheadule-26:before {
  content: "\e943";
}
.c-icon-graph-columns-26:before {
  content: "\e944";
}
.c-icon-calendar-point-26:before {
  content: "\e945";
}
.c-icon-calendar-26:before {
  content: "\e946";
}
.c-icon-compare-26:before {
  content: "\e947";
}
.c-icon-hourglass-26:before {
  content: "\e948";
}
.c-icon-flag-26:before {
  content: "\e949";
}
.c-icon-sheet-26:before {
  content: "\e94a";
}
.c-icon-calendar-suitcase-26:before {
  content: "\e94b";
}
.c-icon-target-26:before {
  content: "\e94c";
}
.c-icon-book-26:before {
  content: "\e94d";
}
.c-icon-mortarboard-hat-26:before {
  content: "\e94e";
}
.c-icon-server-26:before {
  content: "\e94f";
}
.c-icon-city-26:before {
  content: "\e950";
}
.c-icon-user-26:before {
  content: "\e951";
}
.c-icon-clipboard-cursor-26:before {
  content: "\e952";
}
.c-icon-dashboard-26:before {
  content: "\e953";
}
.c-icon-scale-26:before {
  content: "\e954";
}
.c-icon-document-man-26:before {
  content: "\e955";
}
.c-icon-web-page-26:before {
  content: "\e956";
}
.c-icon-office-chair-26:before {
  content: "\e957";
}
.c-icon-sheet-check-26:before {
  content: "\e958";
}
.c-icon-graph-columns-office-worker-26:before {
  content: "\e959";
}
.c-icon-database-man-26:before {
  content: "\e95a";
}
.c-icon-folder-man-26:before {
  content: "\e95b";
}
.c-icon-play-26:before {
  content: "\e95c";
}
.c-icon-star-26:before {
  content: "\e95d";
}
.c-icon-headphones-26:before {
  content: "\e95e";
}
.c-icon-stroke-arrow-left-26:before {
  content: "\e922";
}
.c-icon-stroke-arrow-right-26:before {
  content: "\e923";
}
.c-icon-stroke-arrow-down-26:before {
  content: "\e924";
}
.c-icon-stroke-arrow-up-26:before {
  content: "\e925";
}
.c-icon-lock-26:before {
  content: "\e920";
}
.c-icon-magnifier-26:before {
  content: "\e921";
}
.c-icon-x-26:before {
  content: "\e900";
}
.c-icon-warning-26:before {
  content: "\e901";
}
.c-icon-trash-26:before {
  content: "\e902";
}
.c-icon-clipboard-speech-26:before {
  content: "\e903";
}
.c-icon-paperclip-26:before {
  content: "\e904";
}
.c-icon-note-26:before {
  content: "\e905";
}
.c-icon-full-screen-26:before {
  content: "\e906";
}
.c-icon-restore-screen-26:before {
  content: "\e907";
}
.c-icon-edit-26:before {
  content: "\e908";
}
.c-icon-clock-26:before {
  content: "\e909";
}
.c-icon-undo-26:before {
  content: "\e90a";
}
.c-icon-redo-26:before {
  content: "\e90b";
}
.c-icon-refresh-26:before {
  content: "\e90c";
}
.c-icon-administrator-26:before {
  content: "\e90d";
}
.c-icon-database-26:before {
  content: "\e90e";
}
.c-icon-filter-26:before {
  content: "\e90f";
}
.c-icon-plus-26:before {
  content: "\e910";
}
.c-icon-eye-26:before {
  content: "\e911";
}
.c-icon-gear-26:before {
  content: "\e912";
}
.c-icon-supplier-26:before {
  content: "\e913";
}
.c-icon-worker-26:before {
  content: "\e914";
}
.c-icon-calendar-check-26:before {
  content: "\e915";
}
.c-icon-box-26:before {
  content: "\e916";
}
.c-icon-proccess-26:before {
  content: "\e917";
}
.c-icon-office-worker-male-26:before {
  content: "\e918";
}
.c-icon-certificate-26:before {
  content: "\e919";
}
.c-icon-building-26:before {
  content: "\e91a";
}
.c-icon-tree-chart-26:before {
  content: "\e91b";
}
.c-icon-envelope-26:before {
  content: "\e91c";
}
.c-icon-phone-26:before {
  content: "\e91d";
}
.c-icon-actions-26:before {
  content: "\e91e";
}
.c-icon-arrow-left-26:before {
  content: "\e91f";
}
.c-icon-lock-16:before {
  content: "\e926";
}
.tooltip.top {
  margin-top: 3px;
}
.tooltip.top::before {
  border-width: 5px;
}

html, body {
  overflow-x: hidden;
  height: 100%;
}

body {
  font-family: "Roboto", sans-serif;
}

input:checked ~ .switch-paddle::after {
  left: 3.4rem;
  background: #fff;
}

.switch-paddle {
  border-radius: 300px;
  width: 3.5rem !important;
}
.switch.tiny input:checked ~ .switch-paddle::after {
    left: 2.2rem;
}
.switch-paddle:after {
  border-radius: 50%;
  background: #764cff;
}

::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: #404040;
}
::-moz-placeholder { /* Firefox 19+ */
  color: #404040;
}
:-ms-input-placeholder { /* IE 10+ */
  color: #404040;
}
:-moz-placeholder { /* Firefox 18- */
  color: #404040;
}

input:checked ~ .switch-paddle {
  background: #764cff;
}

.c-switch-label {
  cursor: pointer;
  color: #fff;
  font-size: 16px;
}

.c-main-options-container {
  width: auto;
  padding-left: 20px;
  padding-right: 0;
  background-color: rgba(253, 250, 244, 0.85);
}
.c-main-options-container.off-canvas.is-transition-overlap.is-open {
  box-shadow: 0 0 10px rgba(10, 10, 10, 0.3);
}
.c-main-options-container .c-main-options {
  text-align: right;
}
.c-main-options-container .c-main-options a {
  display: inline-flex;
  padding-top: 0;
  padding-bottom: 0;
  transition: background-color 0.2s ease;
  height: 40px;
  align-items: center;
  gap: 20px;
  color: #764cff;
  background-color: rgba(118, 76, 255, 0.15);
  border-radius: 300px;
  margin-bottom: 10px;
  margin-right: 20px;
  padding-right: 0;
}
.c-main-options-container .c-main-options .c-active a {
  background-color: rgba(118, 76, 255, 0.50);
  color: #fff;
  font-weight: 600;
}
.c-main-options-container .c-main-options a [class^=w-icon-], .c-main-options-container .c-main-options a [class*=" w-icon-"] {
  width: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 50%;
  background-color: #764cff;
  color: #fff;
  outline: 4px solid rgba(255, 255, 255, 0);
  transition: outline-color 0.2s ease;
}
.c-main-options-container .c-main-options li:not(.c-active) a:hover {
  background-color: rgba(42, 42, 42, 0.5);
}
.c-main-options-container .c-main-options li:not(.c-active) a:hover [class^=c-icon-], .c-main-options-container .c-main-options li:not(.c-active) a:hover [class*=" c-icon-"] {
  outline-color: rgba(255, 255, 255, 0.5);
}
.c-main-options-container .c-active a [class^=c-icon-], .c-main-options-container .c-active a [class*=" c-icon-"] {
  outline-color: #764cff;
}
.c-main-options-container .c-altitude-indication {
  display: inline-block;
  font-size: 11px;
  color: #fff;
  padding: 20px 15px 15px;
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.8);
  margin: 10px 20px 0 0;
  position: relative;
}
.c-main-options-container .c-altitude-indication::before {
  content: "";
  display: inline-block;
  position: absolute;
  top: 8px;
  right: 15px;
  border-style: solid;
  border-width: 0 4px 6px 4px;
  border-color: transparent transparent #fff;
}

#map_canvas .leaflet-attribution-flag {
  display: none !important;
}

.c-offcanvas-header {
  display: flex;
  justify-content: space-between;
  padding: 0.7rem 20px;
}
.c-offcanvas-header .close-button {
  position: static;
}

.c-map-container {
	position: relative;
  display: flex;
  flex-wrap: nowrap;
  flex-direction: column;
  width: 100%;
  min-height: 100%;
  margin-right: 0 !important;
  overflow: hidden;
  /* Large and up */
}

@media screen and (min-width: 64em) {
  .c-map-container {
    height: 100%;
  }
}

.c-top-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  /* Medium and up */
  /*@media screen and (min-width: 40em) {
  	display: none;
  }*/
}

.c-branding {
  display: flex;
  gap: 0 20px;
  align-items: center;
}

.c-site-title {
	color:#764cff;
	font-weight:600;
	line-height: 1.2em;
}

.c-home-button {
	display: inline-flex;
	flex-shrink: 0;
    color: #fff;
    background-color: #764cff;
    font-size: 16px;
    width: 40px;
    height: 70px;
    justify-content: center;
    align-items: center;
}
.c-home-button:hover,
.c-home-button:focus {
	color: #fff;
}
.c-top-bar-right {
  display: flex;
  align-items: center;
}

.c-search-container {
  position: relative;
  margin-left: 20px;
}
.c-search-container::before {
  content: "\e921";
  font-family: "Critter-outline" !important;
  position: absolute;
  display: block;
  font-size: 26px;
  color: #764cff;
  left: 15px;
}
.c-search-container input {
  border-radius: 3px;
  border-color: #764cff;
  height: 40px;
  padding-left: 45px;
  padding-right: 20px;
  color: #404040;
  margin: 0;
}
.c-search-container input:focus {
  /*background-color: rgba(0, 0, 0, 0.8) !important;*/
  border-color: #007bff;
  outline: 1px solid #007bff;
}

.c-map-ui {
  flex-grow: 1;
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
}

.c-branding-search-flex {
  position: absolute;
  top: 20px;
  left: 20px;
  width: 300px;
  max-width: calc(100% - 40px);
  z-index: 2;
}
.c-branding-search-flex .c-branding {
  border-radius: 10px;
  padding: 15px 20px;
  background-color: #fff;
  margin-bottom: 20px;
  display: flex;
  justify-content: center;
  /* Small only */
}
.c-branding-search-flex .c-search-container {
  position: relative;
}
.c-branding-search-flex .c-search-container::before {
  content: "\e90a";
  font-family: "dust-regional" !important;
  position: absolute;
  display: block;
  font-size: 20px;
  opacity: 0.7;
  color: #fff;
  top: 15px;
  left: 20px;
}
.c-branding-search-flex .c-search-container input {
  border-radius: 10px;
  background-color: rgba(0, 0, 0, 0.8);
  border-color: rgba(0, 0, 0, 0.8);
  height: 50px;
  padding-left: 50px;
  padding-right: 20px;
  color: #fff;
}

.c-bottom-controls {
	background-color: rgba(255, 255, 255, 0.7);
  position: absolute;
  width: 100%;
  bottom: 0;
  display: flex;
  flex-wrap: wrap;
  color: #fff;
  pointer-events: none;
  z-index: 2;
  align-items: center;
  /*gap: 20px;*/
  /*&.c-icon-stack:hover{

  	.dropdown-content{
  		display: block;
  	}
  }*/
  /* Medium and down */
  /* Small only */
  /* Small HEIGHT */
}
.c-bottom-controls > * > * {
  pointer-events: initial;
  cursor: pointer;
}
.c-bottom-controls .c-bottom-controls-left {
	background-color: #fff;
	align-self: stretch;
  flex-grow: 1;
  padding: 0 20px;
  /*display: flex;
  flex-direction: column;
  gap: 5px;
  flex-wrap: nowrap;*/
}
.c-bottom-controls .c-bottom-controls-left .c-play-controls {
  display: flex;
  align-items: center;
  gap: 20px;
  min-width: 300px;
  pointer-events: initial;
}
.c-bottom-controls .c-bottom-controls-left .c-play-controls .slider {
  margin: 0;
  flex-grow: 1;
}
.c-bottom-controls .c-bottom-controls-left .c-play-controls .c-timeline {
  flex-grow: 1;
  width: 100%;
}
.c-bottom-controls .c-bottom-controls-left .c-play-controls .c-timeline .rangeFloat {
  opacity: 1 !important;
  top: -0.2em !important;
  transform: translate(-80%, -100%) !important;
  text-shadow: 0 0 6px #000;
  left: 4em;
}
:dir(ltr) .c-bottom-controls .c-bottom-controls-left .c-play-controls .c-timeline .rangeFloat {
  left: 6em !important;
}
.c-bottom-controls .c-bottom-controls-buttons {
  display: flex;
  gap: 5px;
}
.c-bottom-controls .c-bottom-controls-buttons .c-button {
	width: 36px;
    height: 36px;
    border-radius: 50%;
    background-color: #764cff;
	color: #fff;
    cursor: pointer;
}
.c-colorcodes-container {
	margin: 0 20px;
	width: 270px;
	max-width: calc(100% - 40px);
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: #fff;
  transform: translate(0, -50%);
}
/* Small only */
@media screen and (max-width: 39.9375em) {
  .c-colorcodes-container {
    flex-direction: column;
  }
}
.c-bottom-controls .c-bottom-controls-right {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 0 20px;
  justify-content: space-between;
  padding: 10px 0;
}
.c-bottom-controls .c-bottom-controls-right .c-layers-group {
  display: flex;
  align-items: flex-end;
  gap: 5px;
}
.c-bottom-controls .c-bottom-controls-right .c-layers-group .switch {
  margin-bottom: 0;
}
.c-bottom-controls .c-bottom-controls-right .menu {
  flex-wrap: nowrap;
  font-size: 14px;
  max-width: 100%;
}

.c-tabs-container {
	border-radius: 300px;
  background-color: #fff;
  padding: 5px;
}
.c-bottom-controls .c-bottom-controls-right .menu li.has-tip {
  border-bottom: none;
}
.c-bottom-controls .c-bottom-controls-right .menu li a {
  padding: 0 15px;
  line-height: 26px;
  white-space: nowrap;
  border-radius: 300px;
  color: #764cff;
  background-color: rgba(118,76, 255, 0.15);
}

.c-multy-group {
	display: flex;
	align-items: center;
}

.c-multy-group .switch {
	margin-bottom:0;
}

.c-menu-multi {
	color: #764cff;
	gap: 5px;
	padding-right: 15px !important;
}

.c-menu-multi li {
	font-size: 10px;
	line-height: 1em;
	display: flex;
    align-items: center;
    gap: 4px;
}

.c-bottom-controls .c-bottom-controls-right .menu li a span {
  font-size: 0.8em;
}
.c-bottom-controls .c-bottom-controls-right .menu li:hover {
  border-radius: 300px;
}
.c-bottom-controls .c-bottom-controls-right .menu li.is-active > a {
  color: #fff;
  background: #764cff;
}
.c-bottom-controls .c-bottom-controls-right .menu.c-menu-multi li:not(:last-child) {
  margin-right: 4px;
}
.c-bottom-controls .c-bottom-controls-right .menu.c-menu-layers {
  display: flex;
  flex-direction: column;
}
.c-bottom-controls .c-bottom-controls-right .menu.c-menu-layers a {
  padding: 0 10px;
}
.c-bottom-controls .c-bottom-controls-right .menu.c-menu-duration {
  margin-bottom: 5px;
}
.c-bottom-controls .c-bottom-controls-right .menu.c-menu-duration li {
  width: 33%;
  text-align: center;
  cursor: pointer;
}

.c-bottom-controls .c-bottom-controls-right .menu.c-menu-multi a {
	padding: 0 8px;
	display: inline-block;
    float: left;
	background-color: rgba(118,76, 255, 0.15);
}
@media screen and (max-width: 1370px) {
  /*.c-bottom-controls {
    flex-direction: column;
	gap: 0;
    align-items: initial;
  }*/
  
  .c-bottom-controls-right {
	  width: 100%;
	  order: -1;
        padding-bottom: 15px !important;
  }
}
@media screen and (max-height: 700px) {
  .c-bottom-controls {
    background-color: rgba(255, 255, 255, 0.8);
    padding: 20px;
    left: 0;
    bottom: 0;
    width: 100%;
  }
}

.c-fullscreen-button {
	width: 40px;
    height: 70px;
    background-color: #764cff;
    color: #fff;
}

.c-play-button {
  width: 30px;
  height: 30px;
  border-radius: 50%;
  background-color: #764cff;
  color: #fff;
  font-size: 20px;
  flex-shrink: 0;
}
.c-play-button:hover {
  background-color: rgb(255, 255, 255);
}

.dropdown-content {
  flex-direction: column;
  position: absolute;
  font-family: "Roboto", sans-serif;
  display: none;
  border-radius: 6px;
  padding: 5px 0px;
  background-color: rgba(42, 42, 42, 0.8);
  box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
  white-space: nowrap;
}
.dropdown-content label {
  color: #fff;
}
.dropdown-content div {
  width: 100%;
}
.dropdown-content div:hover {
  background-color: #2a2a2a;
}
.dropdown-content div:has(input:checked) {
  background-color: #764cff;
  text-shadow: 0 0 6px #000;
}
.dropdown-content:hover {
  display: flex !important;
}
.dropdown-content [type=file], .dropdown-content [type=checkbox], .dropdown-content [type=radio] {
  margin: 0;
}
.dropdown-content a:hover {
  background-color: #ddd;
}

.c-map-button {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  color: #764cff;
  cursor: pointer;
  background-color: rgba(255, 255, 255, 0.8);
}
.c-map-button:hover {
  background-color: rgba(255, 255, 255, 1);
}
.c-map-button:hover .dropdown-content,
.c-map-button:hover + .dropdown-content {
  display: flex;
}
.c-map-button:focus .dropdown-content,
.c-map-button:focus + .dropdown-content {
  display: flex;
}
.c-map-button .dropdown-content {
  text-align: center;
}
.c-map-button + .dropdown-content {
  margin-top: -130px;
  z-index: 10;
}
.c-map-button + .dropdown-content [type=radio] {
  visibility: hidden;
}
.c-map-button + .c-download {
  margin-top: -113px;
  margin-left: -35px;
  z-index: 10;
}
.c-map-button + .c-download > ul {
  flex-direction: column;
  border-radius: 0 !important;
  background-color: transparent !important;
  padding: 5px 0 !important;
}
.c-map-button + .c-download > ul li {
  border-radius: 0 !important;
}
.c-map-button + .c-download > ul lihover {
  background-color: #2a2a2a;
}
.c-map-button + .c-download > ul li a:hover {
  background-color: #2a2a2a;
}

.c-maps-divisions {
  display: flex;
  flex-wrap: wrap;
  background-color: #ccc;
  flex-grow: 1;
  /* Small only */
  /* Large and up */
  /*@media screen and (min-width: 64em) {
  	height: 100%;

  	> * {
  		flex-grow: 1;
  	}

  	&.c-tiles-2 {
  		> * {
  			width: 50%;
  		}
  	}

  	&.c-tiles-3-4 {
  		> * {
  			width: 50%;
  			height: 50%;
  		}
  	}
  }*/
}
.c-maps-divisions > * {
  border: 1px solid rgba(42, 42, 42, 0.8);
  position: relative;
  width: 100%;
}
.c-maps-divisions > * h3 {
  position: absolute;
  top: 10px;
  left: 10px;
  width: 10em;
  z-index: 2;
  font-size: 1em;
  font-weight: 600;
  background-color: #fff;
  padding: 3px 10px;
  border-radius: 50px;
  text-align: center;
}
.c-maps-divisions > * .c-tile-controls {
  position: absolute;
  top: 40px;
  left: 20px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 5px;
}
.c-maps-divisions.c-tiles-1 > * h3 {
  display: none;
}
.c-maps-divisions.c-tiles-2 > * {
  max-width: 50%;
}
.c-maps-divisions.c-tiles-3 > * {
  max-width: 50%;
}
.c-maps-divisions.c-tiles-4 > * {
  max-width: 50%;
}
@media screen and (max-width: 39.9375em) {
  .c-maps-divisions {
    flex-direction: column;
    align-items: center;
    background-color: #fff;
  }
  .c-maps-divisions.c-tiles-1 > * {
    height: calc(100vh - 70px);
  }
  .c-maps-divisions.c-tiles-2 > *, .c-maps-divisions.c-tiles-3 > *, .c-maps-divisions.c-tiles-4 > * {
    max-width: unset;
    width: calc(100% - 20px);
    flex-grow: 1;
    height: 60vh;
  }
}

.c-map {
  z-index: 1;
  width: auto;
  height: 100%;
  flex-wrap: nowrap;
}

.c-toggle-off-canvas {
  /*position: absolute;
  top: -45px;
  right: 20px;*/
  /* Medium and up */
  /*@media screen and (min-width: 40em) {
  	display: none;
  }*/
  margin-left: 20px;
  width: 40px;
  height: 70px;
  background-color: #764cff;
  color: #fff;
  flex-shrink: 0;
}
.c-toggle-off-canvas:after,
.c-toggle-off-canvas:hover:after {
	background: initial;
	-webkit-box-shadow: initial;
	box-shadow: initial;
	position: initial;
	display:initial;
  font-family: "Critter-outline";
  content: "\e988";
  font-size: 26px;
}

.slider-handle {
  background-color: #764cff !important;
  border-radius: 100%;
}

/*Leaflet pop up*/
.leaflet-popup-content {
  width: 260px;
  display: table;
}
.leaflet-popup-content div {
  display: table-cell;
  vertical-align: middle;
  padding-left: 5px;
}

.leaflet-popup-content-wrapper {
  background: #505050 !important;
  color: #eee;
  font-size: 12px;
  padding: 3px 10px;
  border-radius: 300px;
}

.leaflet-popup-close-button {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.6);
  display: inline-block;
  width: 20px;
  line-height: 20px;
  text-align: center;
  border-radius: 50%;
}

.leaflet-popup-tip-container {
  left: 40% !important;
  margin-left: 0 !important;
}

.leaflet-popup-tip {
  left: 0 !important;
}

.leaflet-tooltip .labels {
  color: white;
  text-shadow: 2px 2px 5px #312C2C;
  font-size: 13px;
  font-weight: bold;
  text-align: center;
  width: auto;
  padding: 3px;
  border: none;
  box-shadow: none;
  background-color: transparent;
}

.leaflet-tooltip-bottom.labels::before {
  border-bottom-color: transparent;
}

.my-tooltip {
  box-shadow: none;
  border: none;
  background: #2b3133;
  border-radius: 0;
  color: #fff;
  font-family: "Open Sans", "Segoe UI", Arial, sans-serif;
  font-size: 14px;
}

.my-tooltip:before {
  content: "";
  border-width: 4px;
  border-style: solid;
  border-color: transparent;
  border-bottom-color: #2b3133;
  position: absolute;
  top: -8px;
}

.c-graph-container {
  width: 95%;
  height: 90%;
  margin: 0 auto;
  padding: 0;
}

.tabs-title {
  width: 50%;
  text-align: center;
}
.tabs-title a {
  padding: 1rem 5rem !important;
}

.reveal {
  width: 800px;
  height: 30.5em;
  border-radius: 30px;
}

.tabs {
  height: auto;
}

.c-gauge-container {
  display: flex;
  width: 75%;
  height: 100px;
  margin: 0 auto;
  justify-content: center;
  align-items: center;
}

.c-right-controls {
  width: 4em;
  height: 10em;
  position: relative;
  z-index: 2;
  display: flex;
  align-items: flex-end;
  right: 0px;
}

.c-bottom-levels {
  position: absolute;
  width: 60%;
  height: 100%;
  right: 20px;
  display: flex;
  align-items: flex-end;
  color: #fff;
  gap: 10px;
  cursor: pointer;
  z-index: 2;
  flex-grow: 1;
  flex-direction: column;
  gap: 5px;
  flex-wrap: nowrap;
  border-radius: 300px;
  background-color: rgba(42, 42, 42, 0.8);
}
.c-bottom-levels .floating-label {
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  padding: 5px;
  background-color: #fff;
  border: 1px solid #ccc;
  border-radius: 3px;
  pointer-events: none;
}

#vertical-slider {
  margin: 0 auto;
}
#vertical-slider .rangeSlider.vertical {
  height: 8em;
  min-height: 0;
}
#vertical-slider .rangeFloat {
  opacity: 1 !important;
  text-shadow: 0 0 6px #000;
  box-shadow: 0 0 6px #000;
  transform: translate(-130%, 5%) !important;
}
#vertical-slider .rangeFloat :before {
  border: solid transparent;
  border-top-width: medium;
  border-top-color: transparent;
  border-right-width: medium;
  border-bottom-width: medium;
  border-left-width: medium;
  border-left-color: transparent;
  content: "";
  height: 0;
  width: 0;
  position: absolute;
}

.leaflet-container a.leaflet-popup-close-button {
  padding: unset !important;
}

.leaflet-marker-icon [class^=c-icon-], .leaflet-marker-icon [class*=" c-icon-"] {
  font-size: 30px;
}

/*----VERTICAL COLOR CODES----*/
.c-colorcodes-spacer {
  /* Medium and up - center colorcodes bar vertically */
  flex-grow: 1;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding-right: 30px;
}

.c-colorcodes-aligner {
  /* Medium and up - center colorcodes bar vertically */
}
@media screen and (min-width: 40em) {
  .c-colorcodes-aligner {
    display: flex;
  }
}
.c-colorcodes-aligner .c-timeline {
  flex-grow: 1;
  width: 100%;
}

.c-colorcodes-v {
  margin-left: 5px;
  display: none;
  flex-direction: column;
  align-items: flex-end;
}
.c-colorcodes-v.c-active-bar {
  display: flex;
}
.c-colorcodes-v .c-colorcodes-bar-container {
  border-radius: 10px;
  background-color: rgba(42, 42, 42, 0.5);
  padding: 20px 10px 20px 60px;
}
.c-colorcodes-v .c-colorcodes-bar {
  width: 20px;
  height: 200px;
  border-radius: 300px;
  border: 2px solid #000;
  /*box-shadow: 0 0 3px rgba(0,0,0,0.6);*/
  position: relative;
}
.c-colorcodes-v .c-colorcodes-bar.c-colorcodes-visibility {
  background: linear-gradient(to top, rgb(255, 0, 0) 0%, rgb(255, 127, 0) 20%, rgb(255, 255, 0) 40%, rgb(0, 255, 0) 60%, rgb(102, 102, 242) 80%, rgb(153, 153, 153) 100%);
}
.c-colorcodes-v .c-colorcodes-bar.c-colorcodes-concentration {
  background: linear-gradient(to top, rgb(255, 245, 204) 0%, rgb(255, 230, 112) 12.5%, rgb(255, 204, 51) 25%, rgb(255, 175, 51) 37.5%, rgb(255, 153, 51) 50%, rgb(255, 111, 51) 62.5%, rgb(255, 85, 0) 75%, rgb(230, 40, 30) 87.5%);
}
.c-colorcodes-v .c-colorcodes-bar.c-colorcodes-aerosol {
  background: linear-gradient(to top, rgb(210, 214, 234) 0%, rgb(242, 230, 10) 50%, rgb(252, 31, 0) 100%);
}
.c-colorcodes-v .c-colorcodes-bar.c-colorcodes-density {
  background: linear-gradient(to top, rgb(255, 238, 162) 0%, rgb(252, 126, 55) 50%, rgb(139, 0, 38) 100%);
}
.c-colorcodes-v .c-colorcodes-bar.c-colorcodes-wind {
  background: linear-gradient(to top, rgb(36, 104, 180) 0%, rgb(60, 157, 194) 7%, rgb(128, 205, 193) 14%, rgb(151, 218, 168) 21%, rgb(198, 231, 181) 28%, rgb(238, 247, 217) 35%, rgb(255, 238, 159) 42%, rgb(252, 217, 125) 49%, rgb(255, 182, 100) 56%, rgb(252, 150, 75) 63%, rgb(250, 112, 52) 70%, rgb(245, 64, 32) 77%, rgb(237, 45, 28) 84%, rgb(220, 24, 32) 91%, rgb(180, 0, 35) 100%);
}
.c-colorcodes-v .c-colorcodes-bar.c-colorcodes-temp {
  background: linear-gradient(to top, #313695 0%, #004cff 7%, #007fff 14%, #00aaff 21%, #66e5e0 28%, #7fffd3 35%, #3fe58c 42%, #26b272 49%, #99cc00 56%, #cbe500 63%, #ffff00 70%, #ffcc00 77%, #ff9900 84%, #ff6600 91%, #ff0000 100%);
}
.c-colorcodes-v .c-colorcodes-bar span {
  position: absolute;
  right: 25px;
  color: #fff;
  font-size: 11px;
  line-height: 11px;
}
.c-colorcodes-v .c-colorcodes-units {
  margin-top: 10px;
  color: #fff;
  font-size: 12px;
  background-color: rgba(42, 42, 42, 0.5);
  border-radius: 300px;
  padding: 4px 8px;
}

.c-colorcodes-h {
  display: none;
  align-items: flex-end;
}
.c-colorcodes-h.c-active-bar {
  display: flex;
  flex-grow: 1;
}
.c-colorcodes-h .c-colorcodes-bar-hor {
  width: 100%;
  height: 20px;
  border-radius: 300px;
  border: 2px solid #fff;
  /*box-shadow: 0 0 3px rgba(0,0,0,0.6);*/
  position: relative;
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-visibility {
  background: linear-gradient(to right, rgb(255, 0, 0) 0%, rgb(255, 127, 0) 20%, rgb(255, 255, 0) 40%, rgb(0, 255, 0) 60%, rgb(102, 102, 242) 80%, rgb(153, 153, 153) 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-bsc {
  background: linear-gradient(to right, rgb(255, 255, 255) 0%, rgb(161, 237, 227) 5%, rgb(92, 227, 186) 15%, rgb(252, 215, 117) 25%, rgb(218, 114, 48) 35%, rgb(158, 98, 38) 45%, rgb(113, 73, 33) 60%, rgb(57, 37, 17) 75%, rgb(29, 19, 9) 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-concentration {
  background: linear-gradient(to right, rgb(255, 245, 204) 0%, rgb(255, 230, 112) 12.5%, rgb(255, 204, 51) 25%, rgb(255, 175, 51) 37.5%, rgb(255, 153, 51) 50%, rgb(255, 111, 51) 62.5%, rgb(255, 85, 0) 75%, rgb(230, 40, 30) 87.5%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-aerosol {
  background: linear-gradient(to right, rgb(210, 214, 234) 0%, rgb(242, 230, 10) 50%, rgb(252, 31, 0) 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-density {
  background: linear-gradient(to right, rgb(255, 238, 162) 0%, rgb(252, 126, 55) 50%, rgb(139, 0, 38) 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-temp {
  background: linear-gradient(to right, #313695 0%, #004cff 7%, #007fff 14%, #00aaff 21%, #66e5e0 28%, #7fffd3 35%, #3fe58c 42%, #26b272 49%, #99cc00 56%, #cbe500 63%, #ffff00 70%, #ffcc00 77%, #ff9900 84%, #ff6600 91%, #ff0000 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-rh {
  background: linear-gradient(to right, #ffffff 0%, #b2ffff 10%, #7fffe5 20%, #4ce5cc 30%, #19ccb2 40%, #00cc99 50%, #00b27f 60%, #009966 70%, #007f4c 80%, #00664c 90%, #004c4c 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-wind {
  background: linear-gradient(to right, #006bfe 0%, #00aaff 10%, #99f4ff 20%, #3fe58c 30%, #7ebf33 40%, #cce500 50%, #ffe500 60%, #ff9900 70%, #ff3f00 80%, #e50000 90%, #b30000 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor.c-colorcodes-warn {
  background: linear-gradient(to right, #00D302 0%, #00D302 35%, #FFE200 35%, #FFE200 70%, #FF5C00 70%, #FF5C00 100%);
}
.c-colorcodes-h .c-colorcodes-bar-hor span {
  position: absolute;
  right: 25px;
  font-size: 12px;
  text-shadow: 0 0 6px #000;
}

.c-metar-popup .leaflet-popup-content-wrapper {
  height: auto !important;
  color: whitesmoke;
}
.c-metar-popup #bubble {
  padding-top: 15px;
  padding-bottom: 10px;
}

.c-station-marker {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  border: 2px solid #fff;
  background: #764cff;
  color: #fff;
  font-size: 13px;
  font-weight: bold;
  box-shadow: 0 0 6px rgba(0, 0, 0, 0.5);
}
.c-station-marker.c-station-stale {
  background: gray;
  opacity: 0.8;
}

.c-metar-popup .leaflet-popup-content {
  min-width: 240px;
}

.c-station-chart {
  margin-top: 8px;
  min-height: 20px;
  font-size: 11px;
  font-style: italic;
}

.c-language-switch a {
  color: #2a2a2a;
}
.c-language-switch .c-active a {
  color: #764cff;
}

/*---HELPERS---*/
.c-invisible {
  display: none !important;
}

.c-disabled {
  pointer-events: none;
}
.c-disabled a {
  background: gray;
}

.filter-warning {
  filter: invert(72%) sepia(99%) saturate(611%) hue-rotate(359deg) brightness(106%) contrast(104%);
}

.filter-red {
  filter: invert(51%) sepia(100%) saturate(6807%) hue-rotate(3deg) brightness(102%) contrast(108%);
}

.filter-green {
  filter: invert(41%) sepia(78%) saturate(1812%) hue-rotate(89deg) brightness(110%) contrast(109%);
}/*# sourceMappingURL=screen.css.map */
.c-menu-sections {
  display: flex;
  flex-direction: column;
  gap: 14px;
  padding-top: 6px;
  padding-bottom: 12px;
}

.c-menu-section {
  border-radius: 18px;
  background-color: rgba(255,255,255,0.05);
  padding: 10px 0 6px;
  backdrop-filter: blur(2px);
}

.c-menu-section-title {
  font-size: 0.9rem;
  font-weight: 1000;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: #764cff;;
  padding: 0 20px 10px;
  /* text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45); */
  text-align: center;
}

.c-main-options-container .c-main-options a [class^="w-icon-"],
.c-main-options-container .c-main-options a [class*=" w-icon-"] {
  width: 40px;
  height: 40px;
  line-height: 40px;
  text-align: center;
  border-radius: 50%;
  background-color: #2a2a2a;
  outline: 4px solid rgba(255, 255, 255, 0);
  transition: outline-color 0.2s ease;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.c-right-controls {
  width: 100%;
  position: relative;
  z-index: 2;
  display: flex;
  justify-content: flex-end;
}

.c-bottom-levels {
  position: relative;
  width: 100%;
  height: auto;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  color: #fff;
  gap: 10px;
  z-index: 2;
  border-radius: 24px;
  background-color: rgba(42, 42, 42, 0.8);
  padding: 16px 12px;
}

#vertical-slider-container {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  gap: 14px;
  min-height: 220px;
}

.c-vertical-slider {
  -webkit-appearance: slider-vertical;
  appearance: slider-vertical;
  width: 28px;
  height: 200px;
  cursor: pointer;
  accent-color: #ffc458;
}

.c-slider-labels {
  display: flex;
  flex-direction: column-reverse;
  justify-content: space-between;
  height: 200px;
  min-width: 58px;
}

.c-slider-labels div {
  font-size: 12px;
  line-height: 1;
  color: rgba(255, 255, 255, 0.75);
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
  transition: all 0.2s ease;
}

.c-slider-labels div.c-active-level-label {
  color: #fff;
  font-weight: 700;
  transform: translateX(2px);
}
.c-levels-horizontal {
  padding: 0 20px 14px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.c-horizontal-slider {
  width: 100%;
  accent-color: #ffc458;
  cursor: pointer;
}

.c-slider-labels-horizontal {
  display: flex;
  justify-content: space-between;
  gap: 8px;
}

.c-slider-labels-horizontal div {
  font-size: 12px;
  line-height: 1;
  color: rgba(255, 255, 255, 0.75);
  text-shadow: 0 1px 2px rgba(0,0,0,0.5);
  transition: all 0.2s ease;
}

.c-slider-labels-horizontal div.c-active-level-label {
  color: #fff;
  font-weight: 700;
}