@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 400;
  src: url(https://fonts.gstatic.com/s/roboto/v30/KFOmCnqEu92Fr1Mu4mxP.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url(https://fonts.gstatic.com/s/roboto/v30/KFOlCnqEu92Fr1MmEU9fBBc9.ttf) format('truetype');
}
@font-face {
  font-family: 'Roboto Slab';
  font-style: normal;
  font-weight: 700;
  src: url(https://fonts.gstatic.com/s/robotoslab/v23/BngbUXZYTXPIvIBgJJSb6s3BzlRRfKOFbvjoa4Omb2Rm.ttf) format('truetype');
}
html,
body {
  width: 100vw;
  height: 100vh;
  margin: 0;
  padding: 0;
  font-family: 'Roboto', sans-serif;
}
@media (min-width: 1200px) {
  html .mobile,
  body .mobile {
    display: none !important;
  }
}
@media (max-width: 1199px) {
  html .non-mobile,
  body .non-mobile {
    display: none !important;
  }
}
@media (min-width: 1200px) {
  body {
    font-size: 0.875rem;
  }
}
@media (max-width: 1199px) {
  body {
    font-size: 1rem;
  }
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Roboto Slab', serif;
}
h1.hidden,
h2.hidden,
h3.hidden,
h4.hidden,
h5.hidden,
h6.hidden {
  display: none;
}
.help-opener[data-help] {
  cursor: help;
}
.help-opener[data-help]:after {
  content: "[?]";
  font-size: 0.5em;
  vertical-align: super;
  padding-left: 0.25em;
}
.s1 {
  background-color: #1A9641;
  color: white;
}
.s2 {
  background-color: #F7CA18;
}
.s3 {
  background-color: #E87E04;
  color: white;
}
.s4 {
  background-color: #D91E18;
  color: white;
}
.s5 {
  background-color: #663399;
  color: white;
}
.ssnow {
  background-color: #4E95DB;
  color: white;
}
/* Fuel model classes - Scott & Burgan fuel classification */
.fuel103 {
  background-color: #00FF7F;
}
.fuel142 {
  background-color: #00CED1;
}
.fuel143 {
  background-color: #6A5ACD;
  color: white;
}
.fuel144 {
  background-color: #ADFF2F;
}
.fuel146 {
  background-color: #8A2BE2;
  color: white;
}
.fuel148 {
  background-color: #FF1493;
  color: white;
}
.fuel161 {
  background-color: #0000FF;
  color: white;
}
.fuel162 {
  background-color: #9370DB;
  color: white;
}
.fuel181 {
  background-color: #FF4500;
  color: white;
}
.fuel183 {
  background-color: #1E90FF;
  color: white;
}
.fuel184 {
  background-color: #FFD700;
}
.fuel185 {
  background-color: #8B4513;
  color: white;
}
.fuel186 {
  background-color: #FFA500;
}
/*
 *  Navigation
 */
nav {
  width: 100vw;
  height: 4rem;
  position: absolute;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.8);
  border-bottom: 1px solid #eee;
  box-sizing: border-box;
  z-index: 2000;
  background-image: url(../img/waldbrand.svg);
  background-repeat: no-repeat;
  background-size: auto 2rem;
}
@media (min-width: 1200px) {
  nav {
    background-position: 2rem center;
  }
}
@media (max-width: 1199px) {
  nav {
    background-position: center;
  }
}
nav span.nav-icon {
  display: block;
  width: 2rem;
  height: 2rem;
  background-repeat: no-repeat;
  background-size: cover;
  box-sizing: border-box;
  border: 1px solid #22A7F0;
  border-radius: 22%;
  position: absolute;
  top: 1rem;
  margin: 0;
}
nav span.nav-icon.nav-links {
  background-image: url("../img/nav_links.svg");
  left: 1rem;
}
nav span.nav-icon.nav-sidebar {
  background-image: url("../img/nav_sidebar.svg");
  right: 1rem;
}
nav div.nav-container {
  width: 100vw;
  height: calc(100vh - 4rem);
  background-color: white;
  background-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  top: 4rem;
}
nav div.nav-container.invisible {
  display: none;
}
nav div.nav-container a,
nav div.nav-container span {
  display: block;
  margin-left: 1rem !important;
  width: calc(100% - 2rem - 1em);
  height: 3rem;
  line-height: 3rem;
}
nav.user a:nth-child(2),
nav span:not(.nav-icon):nth-child(2) {
  margin-left: calc(2rem + 84 / 11 * 2rem);
}
nav.user a:not(:nth-child(2)),
nav span:not(.nav-icon):not(:nth-child(2)) {
  margin-left: 1rem;
}
nav a,
nav span:not(.nav-icon),
nav a:visited,
nav span:not(.nav-icon):visited {
  color: #22A7F0;
  cursor: pointer;
  text-decoration: none;
  font-size: 1.25rem;
  font-family: "Roboto Slab", serif;
  line-height: 4rem;
  text-shadow: 1px 1px 0px white;
}
nav a:nth-child(3),
nav span:not(.nav-icon):nth-child(3) {
  margin-left: calc(2rem + 84 / 11 * 2rem);
}
nav a:not(:nth-child(3)),
nav span:not(.nav-icon):not(:nth-child(3)) {
  margin-left: 1rem;
}
nav a:hover,
nav span:not(.nav-icon):hover {
  text-decoration: underline;
}
nav a.area,
nav span:not(.nav-icon).area {
  color: white;
  background: #F22613;
  text-shadow: none;
  padding: 0.25em 0.5em;
  border-radius: 1rem;
}
nav span {
  margin-left: 1rem;
}
/*
 *  Spinner Modal
 */
div.spinner-modal {
  width: 100vw;
  height: calc(100vh - 4rem);
  background: black;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 4rem;
  z-index: 2000;
}
div.spinner-modal div.spinner {
  width: 38vh;
  height: 38vh;
  box-sizing: border-box;
  position: absolute;
  top: calc(50% - 19vh);
  left: calc(50vw - 19vh);
  transform: translateY(-50%);
  border-top: 2rem solid #22A7F0;
  border-left: 2rem solid #ccc;
  border-right: 2rem solid #ccc;
  border-bottom: 2rem solid #ccc;
  border-radius: 50%;
  animation: spin 0.75s linear infinite;
}
/*
 *  Message Modal
 */
div.message-modal {
  width: 100vw;
  height: calc(100vh - 4rem);
  background: black;
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  top: 4rem;
  z-index: 2000;
}
div.message-modal div.message {
  width: 33vw;
  background-color: white;
  background-color: rgba(255, 255, 255, 0.8);
  box-sizing: border-box;
  padding: 1rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
div.message-modal div.message section.borderbox {
  width: 100%;
  box-sizing: border-box;
  padding: 1rem;
  padding-bottom: 0.75rem;
  margin-top: 2rem;
  border: 1px solid #87D37C;
  border-top-color: transparent;
  border-radius: 1rem;
  position: relative;
}
div.message-modal div.message section.borderbox:first-of-type {
  margin-top: 0.5rem;
}
div.message-modal div.message section.borderbox header {
  color: #87D37C;
  position: absolute;
  top: -1rem;
  display: table;
}
@media (min-width: 1200px) {
  div.message-modal div.message section.borderbox header {
    width: calc(33vw - 3rem);
  }
}
@media (max-width: 1199px) {
  div.message-modal div.message section.borderbox header {
    width: calc(100vw - 3rem);
  }
}
div.message-modal div.message section.borderbox header:after {
  content: "";
  display: table-cell;
  width: 100%;
  height: 1rem;
  border-color: #87D37C transparent transparent transparent;
  border-top-right-radius: 1rem;
  border-style: solid;
  border-width: 1px;
  position: relative;
  top: 1rem;
}
div.message-modal div.message section.borderbox header h3 {
  display: table-cell;
  padding: 0;
  margin: 0;
  padding-right: 0.5rem;
  font-size: 1.25rem;
  text-shadow: 1px 1px 0px white;
  white-space: nowrap;
}
div.message-modal div.message section.borderbox button {
  width: 100%;
  min-height: 1.5rem;
  box-sizing: border-box;
  outline: none;
  background: #87D37C;
  border: none;
  border-radius: 0.25rem;
  color: #fff;
  margin-top: 0.25rem;
  font-size: 0.875rem;
  cursor: pointer;
}
div.message-modal div.message section.borderbox button:active {
  background: #6CB762;
}
div.message-modal div.message section.borderbox button:disabled {
  border-color: #eee;
  background: #eee;
  color: #fff;
}
/*
 *  Main
 */
main {
  position: relative;
  width: 100vw;
  overflow: hidden;
  /*
   *  Map
   */
  /*
   *  Aside Button
   */
  /*
   *  Aside
   */
}
main div.separator:not(:last-child) {
  padding-bottom: 0.25rem;
  border-bottom: 1px solid #87D37C;
}
main div#map {
  width: 100vw;
  height: 100vh;
  font-family: "Roboto", sans-serif !important;
}
main div#map.identifying {
  cursor: crosshair;
}
main div#map.idle {
  background-image: url(../img/wb_saubersdorf2013_2400px.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position-y: bottom;
}
main div#map.idle span.copyright {
  font-size: 0.75em;
  position: absolute;
  right: 1rem;
  bottom: 1rem;
}
@media (min-width: 1200px) {
  main div#map.idle span.copyright {
    color: white;
  }
}
@media (max-width: 1199px) {
  main div#map.idle span.copyright {
    color: black;
    z-index: 2000;
  }
}
@media (max-width: 1199px) {
  main div#map div.leaflet-control-zoom.leaflet-bar.leaflet-control {
    margin: 1rem 0 0 1rem;
  }
}
main div#map div.leaflet-top {
  top: 4rem;
}
@media (min-width: 1200px) {
  main div#map div.leaflet-right {
    right: calc(33vw + 1rem);
  }
}
@media (max-width: 1199px) {
  main div#map div.leaflet-right {
    right: 0;
  }
}
@media (min-width: 1200px) {
  main div#map div.leaflet-right.invisible {
    right: 1rem;
  }
}
main div#map div.leaflet-right.othersVisible {
  right: calc(66vw + 1rem);
}
main div#map div.leaflet-right.othersVisible.invisible {
  right: calc(33vw + 1rem);
}
main div#map div.leaflet-bottom.leaflet-left {
  bottom: 2rem;
}
@media (min-width: 1200px) {
  main div#map div.identifier {
    margin: 10px 10px 0 0;
  }
}
@media (max-width: 1199px) {
  main div#map div.identifier {
    margin: 1rem 1rem 0 0;
  }
}
main div#map div.identifier a {
  cursor: pointer;
  background-image: url(../img/identifier.svg);
  background-repeat: no-repeat;
  background-size: cover;
}
main div#map div.identifier a.active {
  background-image: url(../img/identifier_white.svg);
  background-color: #22A7F0;
}
main div#map div.legend {
  background-color: white;
  border-radius: 4px;
  padding: 0.5rem;
  padding-top: 0.25rem;
}
main div#map div.legend h3 {
  margin-top: 0;
  margin-bottom: 0.5rem;
  color: #6CB762;
}
main div#map div.legend div.scale-item {
  width: 100%;
  height: 1rem;
}
main div#map div.legend div.scale-item span.scale {
  display: inline-block;
  width: 2rem;
  height: 100%;
}
main div#map div.legend div.scale-item span.scale-label {
  vertical-align: top;
  margin-left: 0.25rem;
}
main div#map div.leaflet-popup-tip {
  background: white;
  background: rgba(255, 255, 255, 0.8);
}
main div#map a.leaflet-popup-close-button {
  padding: 0.75rem 0.75rem 0 0;
  color: #2ECC71;
}
main div#map div.leaflet-popup-content-wrapper {
  background: white;
  background: rgba(255, 255, 255, 0.8);
  border-radius: 1.5rem;
  padding: 0.5rem;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content {
  border: 1px solid #87D37C;
  border-radius: 1rem;
  margin: 0;
  padding: 1rem;
  min-width: 5rem;
  width: 20rem;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results {
  width: 100%;
  display: table;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-heading {
  font-weight: bold;
  font-family: "Roboto Slab", serif;
  color: #87D37C;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-heading,
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-row {
  width: 100%;
  min-height: 1rem;
  display: grid;
  grid-template-columns: 50% 25%;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-heading span,
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-row span {
  text-align: center;
  align-self: center;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-heading span:first-child,
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-row span:first-child {
  grid-column-start: 1;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-heading span:last-child,
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-row span:last-child {
  grid-column-end: 4;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-heading span:nth-child(2),
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-row span:nth-child(2) {
  grid-column-start: 2;
}
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-heading span:nth-child(3),
main div#map div.leaflet-popup-content-wrapper div.leaflet-popup-content div.identifier-results div.identifier-row span:nth-child(3) {
  grid-column-start: 3;
}
main span.layer-label {
  position: absolute;
  top: 5rem;
  right: calc(33vw + 2.5rem);
  max-width: 50vw;
  font-size: 1.5rem;
  font-family: "Roboto Slab";
  z-index: 700;
  text-align: right;
  color: #fff;
  text-shadow: 0 0.5px 1px #000;
}
main button.main {
  width: 1rem;
  height: calc(100vh - 4rem);
  position: absolute;
  top: 4rem;
  right: 33vw;
  z-index: 1000;
  border: none;
  background-color: #87D37C;
  background-color: rgba(135, 211, 124, 0.8);
  color: #fff;
  outline: none;
  box-sizing: border-box;
  padding: 0;
}
main button.main.othersVisible {
  right: 66vw;
}
main button.main.invisible {
  right: 0;
}
main button.main.invisible.othersVisible {
  right: 33vw;
}
main button.main.invisible:after {
  content: "\25C0";
}
main button.main:after {
  content: "\25B6";
  display: inline;
}
main button.main:hover {
  cursor: pointer;
}
main button.main:active {
  background-color: #6CB762;
  background-color: rgba(108, 183, 98, 0.8);
}
main > section {
  height: calc(100vh - 4rem);
  background-color: white;
  background-color: rgba(255, 255, 255, 0.8);
  position: absolute;
  right: 0;
  top: 4rem;
  z-index: 1000;
  box-sizing: border-box;
  padding: 1rem;
  overflow-y: scroll;
  /*
     *  Borderbox
     */
}
@media (min-width: 1200px) {
  main > section {
    width: 33vw;
  }
}
@media (max-width: 1199px) {
  main > section {
    width: 100vw;
  }
}
main > section a:link,
main > section a:visited {
  color: #22A7F0;
  text-decoration: none;
}
main > section a:hover {
  text-decoration: underline;
}
main > section > header {
  position: fixed;
  top: 4rem;
  background-color: #22A7F0;
  z-index: 5;
  box-sizing: border-box;
  padding: 1rem;
  border-radius: 0 0 1rem 1rem;
}
@media (min-width: 1200px) {
  main > section > header {
    width: calc(33vw - 2.5rem);
  }
}
@media (max-width: 1199px) {
  main > section > header {
    width: calc(100vw - 2rem);
  }
}
main > section > header span.close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  cursor: pointer;
  color: white;
}
main > section > header h2 {
  margin: 0;
  padding: 0;
  color: white;
}
@media (min-width: 1200px) {
  main > section.help,
  main > section.custom {
    right: -33vw;
  }
}
@media (max-width: 1199px) {
  main > section.help,
  main > section.custom {
    right: -100vw;
  }
}
main > section.help.visible,
main > section.custom.visible {
  right: 0;
}
main > section.help div.scroll,
main > section.custom div.scroll {
  margin-top: 4rem;
  z-index: 0;
}
main > section div.logo-bar {
  width: 100%;
  min-height: 2rem;
  display: flex;
}
main > section div.logo-bar img {
  height: 2rem;
  flex: auto 1 1;
}
main > section .borderbox-content img {
  max-width: 200px;
  display: block;
  margin-bottom: 1rem;
}
main > section.main.static {
  left: 0;
  right: 33vw !important;
}
main > section.main.static section.borderbox header h3 {
  color: #6CB762;
}
@media (min-width: 1200px) {
  main > section.main.invisible {
    right: -33vw !important;
  }
}
@media (max-width: 1199px) {
  main > section.main.invisible {
    right: -100vw !important;
  }
}
@media (min-width: 1200px) {
  main > section.main.othersVisible {
    right: 33vw;
  }
}
@media (max-width: 1199px) {
  main > section.main.othersVisible {
    right: -100vw !important;
  }
}
@media (min-width: 1200px) {
  main > section::-webkit-scrollbar {
    width: 0.5rem;
  }
  main > section::-webkit-scrollbar-track {
    background: #eee;
  }
  main > section::-webkit-scrollbar-thumb {
    background: #2ECC71;
    border-radius: 0;
  }
  main > section::-webkit-scrollbar-thumb:hover {
    background: #6CB762;
  }
}
main > section a:link,
main > section a:visited {
  color: #22A7F0;
  text-decoration: none;
}
main > section a:hover {
  text-decoration: underline;
}
main > section div.checkbox-container {
  display: block;
  user-select: none;
  clear: both;
  position: relative;
}
main > section div.checkbox-container label {
  cursor: pointer;
  position: relative;
  float: left;
}
main > section div.checkbox-container label input[type=checkbox],
main > section div.checkbox-container label input[type=radio] {
  position: absolute;
  opacity: 0;
  cursor: pointer;
}
main > section div.checkbox-container label input[type=checkbox]:disabled,
main > section div.checkbox-container label input[type=radio]:disabled {
  cursor: not-allowed;
}
main > section div.checkbox-container label input[type=checkbox]:checked + span.checkmark,
main > section div.checkbox-container label input[type=radio]:checked + span.checkmark,
main > section div.checkbox-container label input[type=checkbox]:not(:disabled):not(:checked):hover + span.checkmark,
main > section div.checkbox-container label input[type=radio]:not(:disabled):not(:checked):hover + span.checkmark {
  background-color: #22A7F0;
  border-color: #008BD2;
  background-size: cover;
  background-image: url(../img/cb_checkmark.svg);
}
main > section div.checkbox-container label input[type=checkbox]:checked + span.eye,
main > section div.checkbox-container label input[type=radio]:checked + span.eye,
main > section div.checkbox-container label input[type=checkbox]:not(:disabled):not(:checked):hover + span.eye,
main > section div.checkbox-container label input[type=radio]:not(:disabled):not(:checked):hover + span.eye {
  background-color: #22A7F0;
  border-color: #008BD2;
  background-image: url(../img/cb_eye.svg);
  background-size: cover;
}
main > section div.checkbox-container label input[type=checkbox]:not(:disabled):not(:checked):hover + span,
main > section div.checkbox-container label input[type=radio]:not(:disabled):not(:checked):hover + span {
  background-color: #82cdf6 !important;
  border-color: #22A7F0 !important;
}
main > section div.checkbox-container label span.checkmark,
main > section div.checkbox-container label span.eye {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  background-color: white;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  margin-right: 0.25rem;
}
main > section div.checkbox-container label span.checkmark.change {
  background-color: #FFFFCC;
  border-color: #E2E2B0;
}
main > section div.checkbox-container input[type=text] {
  box-sizing: border-box;
  margin: 0;
  height: calc(1rem + 2px);
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  outline: none;
  padding: 0.125rem;
  vertical-align: top;
  text-align: center;
  margin-right: 0.25rem;
  float: left;
}
main > section div.checkbox-container input[type=text].change {
  background-color: #FFFFCC;
  border-color: #E2E2B0;
}
main > section div.checkbox-container input[type=text]:not(:disabled).error {
  border-color: #D91E18;
}
main > section div.checkbox-container input[type=text]:disabled {
  background-color: #ccc;
}
main > section div.checkbox-container input[type=text] + span:before {
  content: "% \2716  ";
  display: inline;
}
main > section div.checkbox-container a.icon,
main > section div.checkbox-container span.icon {
  width: calc(1rem + 2px);
  height: calc(1rem + 2px);
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  background-repeat: no-repeat;
  background-size: cover;
}
main > section div.checkbox-container a.icon:hover,
main > section div.checkbox-container span.icon:hover {
  cursor: pointer;
}
main > section div.checkbox-container a.icon.gif,
main > section div.checkbox-container span.icon.gif {
  background-image: url(../img/gif.svg);
}
main > section div.checkbox-container a.icon.delete,
main > section div.checkbox-container span.icon.delete {
  background-image: url(../img/delete.svg);
}
main > section section.borderbox {
  width: 100%;
  box-sizing: border-box;
  padding: 1rem;
  padding-bottom: 0.75rem;
  margin-top: 2rem;
  border: 1px solid #87D37C;
  border-top-color: transparent;
  border-radius: 1rem;
  position: relative;
  /*
         * Formulas
         */
  /*
       *  Location search
       */
  /*
       *  Calendar
       */
}
main > section section.borderbox:first-of-type {
  margin-top: 1rem;
}
main > section section.borderbox header {
  color: #87D37C;
  position: absolute;
  top: -1rem;
  display: table;
}
@media (min-width: 1200px) {
  main > section section.borderbox header {
    width: calc(33vw - 3.5rem);
  }
}
@media (max-width: 1199px) {
  main > section section.borderbox header {
    width: calc(100vw - 3rem);
  }
}
main > section section.borderbox header:after {
  content: "";
  display: table-cell;
  width: 100%;
  height: 1rem;
  border-color: #87D37C transparent transparent transparent;
  border-top-right-radius: 1rem;
  border-style: solid;
  border-width: 1px;
  position: relative;
  top: 1rem;
}
main > section section.borderbox header h3 {
  display: table-cell;
  padding: 0;
  margin: 0;
  padding-right: 0.5rem;
  font-size: 1.25rem;
  text-shadow: 1px 1px 0px white;
  white-space: nowrap;
}
main > section section.borderbox button {
  width: 100%;
  min-height: 1.5rem;
  box-sizing: border-box;
  outline: none;
  background: #87D37C;
  border: none;
  border-radius: 0.25rem;
  color: #fff;
  margin-top: 0.25rem;
  font-size: 0.875rem;
  cursor: pointer;
}
main > section section.borderbox button:active {
  background: #6CB762;
}
main > section section.borderbox button:disabled {
  border-color: #eee;
  background: #eee;
  color: #fff;
}
main > section section.borderbox div.borderbox-content {
  width: 100%;
  position: relative;
  /*
         *  Area controls
         */
  /*
         *  Layers
         */
  /*
         *  Key
         */
  /*
         *  Forest Fires
         */
}
main > section section.borderbox div.borderbox-content :first-child h4 {
  margin-top: 0;
}
main > section section.borderbox div.borderbox-content section[data-help].highlight {
  background: #eee;
  background: rgba(238, 238, 238, 0.8);
  padding: 0.5rem;
  border-radius: 0.5rem;
}
main > section section.borderbox div.borderbox-content section[data-help] > p:first-child {
  margin-top: 0;
}
main > section section.borderbox div.borderbox-content section[data-help] > p:last-child {
  margin-bottom: 0;
}
main > section section.borderbox div.borderbox-content div.area-controls {
  height: 2rem;
  display: flex;
  flex-flow: column wrap;
  align-content: space-between;
  margin-bottom: 0.5rem;
  color: #82cdf6;
}
main > section section.borderbox div.borderbox-content div.area-controls span.area-back,
main > section section.borderbox div.borderbox-content div.area-controls span.area-forward {
  font-size: 1.5rem;
  width: 1rem;
  height: 2rem;
  display: inline-block;
  color: #eee;
  text-align: center;
}
main > section section.borderbox div.borderbox-content div.area-controls span.area-back.active,
main > section section.borderbox div.borderbox-content div.area-controls span.area-forward.active {
  color: #82cdf6;
}
main > section section.borderbox div.borderbox-content div.area-controls span.area-back.active:hover,
main > section section.borderbox div.borderbox-content div.area-controls span.area-forward.active:hover {
  cursor: pointer;
  border-bottom: 1px solid #82cdf6;
}
main > section section.borderbox div.borderbox-content div.area-controls div.dots {
  display: flex;
  justify-content: space-around;
  width: calc(100% - 4rem);
  height: 1rem;
}
main > section section.borderbox div.borderbox-content div.area-controls div.dots span.dot {
  display: inline-block;
  box-sizing: border-box;
  width: 0.75em;
  height: 0.75em;
  border-radius: 50%;
  border: 1px solid #82cdf6;
}
main > section section.borderbox div.borderbox-content div.area-controls div.dots span.dot:hover {
  cursor: pointer;
  background: #22A7F0;
}
main > section section.borderbox div.borderbox-content div.area-controls div.dots span.dot.active {
  background: #82cdf6;
}
main > section section.borderbox div.borderbox-content div.area-controls span.area-name {
  display: inline-block;
  height: 1rem;
  font-size: 0.9em;
  text-align: center;
}
main > section section.borderbox div.borderbox-content div.layer-container:not(:first-of-type) {
  position: relative;
  margin-top: 0.25rem;
}
main > section section.borderbox div.borderbox-content div.layer-container > div.layer-container {
  margin-left: calc(1.25rem + 2px);
}
main > section section.borderbox div.borderbox-content div.layer-container span {
  vertical-align: middle;
}
main > section section.borderbox div.borderbox-content div.scale-item {
  width: 100%;
  height: 1rem;
}
main > section section.borderbox div.borderbox-content div.scale-item span.scale {
  display: inline-block;
  width: 2rem;
  height: 100%;
}
main > section section.borderbox div.borderbox-content div.scale-item span.scale-label {
  vertical-align: top;
  margin-left: 0.25rem;
}
main > section section.borderbox div.borderbox-content div.key-item {
  width: 100%;
  display: flex;
}
main > section section.borderbox div.borderbox-content div.key-item:not(:first-child) {
  margin-top: 0.25rem;
}
main > section section.borderbox div.borderbox-content div.key-item span.symbol {
  flex: 1rem 0 0;
  background-position: center;
  background-repeat: no-repeat;
}
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-icon-s,
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-icon-l {
  background-image: url(../img/cross.svg);
}
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-blue-icon-l {
  background-image: url(../img/cross_yellow.svg);
}
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-red-icon-l {
  background-image: url(../img/cross_red.svg);
}
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-icon-s {
  background-size: 0.5rem auto;
}
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-icon-l,
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-blue-icon-l,
main > section section.borderbox div.borderbox-content div.key-item span.symbol.cross-red-icon-l {
  background-size: 1rem auto;
}
main > section section.borderbox div.borderbox-content div.key-item span.symbol-label {
  flex: 1rem 1 0;
  vertical-align: top;
  margin-left: 0.25rem;
}
main > section section.borderbox select {
  width: 100%;
}
main > section section.borderbox textarea {
  width: 100%;
  height: 5rem;
  box-sizing: border-box;
  font-size: 0.875rem;
  margin: 0;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  outline: none;
  padding: 0.125rem;
  vertical-align: top;
  margin-top: 0.25rem;
  margin-right: 0.25rem;
}
main > section section.borderbox textarea.error {
  border-color: #D91E18;
}
main > section section.borderbox div#formulas-ffi-controls input[type=text],
main > section section.borderbox form.form input[type=text],
main > section section.borderbox div#formulas-ffi-controls input[type=password],
main > section section.borderbox form.form input[type=password],
main > section section.borderbox div#formulas-ffi-controls input[type=email],
main > section section.borderbox form.form input[type=email] {
  width: 100%;
  height: 1.5rem;
  box-sizing: border-box;
  font-size: 0.875rem;
  margin: 0;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
  outline: none;
  padding: 0.125rem;
  vertical-align: top;
  margin-top: 0.25rem;
  margin-right: 0.25rem;
}
div#formulas-ffi-controls main > section section.borderbox div#formulas-ffi-controls input[type=text],
div#formulas-ffi-controls main > section section.borderbox form.form input[type=text],
div#formulas-ffi-controls main > section section.borderbox div#formulas-ffi-controls input[type=password],
div#formulas-ffi-controls main > section section.borderbox form.form input[type=password],
div#formulas-ffi-controls main > section section.borderbox div#formulas-ffi-controls input[type=email],
div#formulas-ffi-controls main > section section.borderbox form.form input[type=email] {
  text-align: center;
}
main > section section.borderbox div#formulas-ffi-controls input[type=text].error,
main > section section.borderbox form.form input[type=text].error,
main > section section.borderbox div#formulas-ffi-controls input[type=password].error,
main > section section.borderbox form.form input[type=password].error,
main > section section.borderbox div#formulas-ffi-controls input[type=email].error,
main > section section.borderbox form.form input[type=email].error {
  border-color: #D91E18;
}
main > section section.borderbox div#formulas-ffi-controls span.warning,
main > section section.borderbox form.form span.warning {
  display: block;
  min-height: 1.5rem;
  color: white;
  font-size: 0.75rem;
  min-height: 1rem;
  line-height: 1rem;
  padding: 0.25rem;
  background-color: red;
  box-sizing: border-box;
  margin-top: 0.25rem;
  border-radius: 0.25rem;
}
main > section section.borderbox div#formulas-ffi-controls span.success,
main > section section.borderbox form.form span.success {
  display: block;
  min-height: 1.5rem;
  color: white;
  font-size: 0.75rem;
  min-height: 1rem;
  line-height: 1rem;
  padding: 0.25rem;
  background-color: #87D37C;
  box-sizing: border-box;
  margin-top: 0.25rem;
  border-radius: 0.25rem;
}
main > section section.borderbox.legend div.borderbox-content,
main > section section.borderbox.fires div.borderbox-content {
  position: relative;
  display: flex;
}
main > section section.borderbox.legend div.borderbox-content > div,
main > section section.borderbox.fires div.borderbox-content > div {
  flex: 50% 0 0;
}
main > section section.borderbox.legend div.borderbox-content > div:last-child,
main > section section.borderbox.fires div.borderbox-content > div:last-child {
  border-left: 1px solid #87D37C;
  padding-left: 1rem;
}
main > section section.borderbox.search input[type=text] {
  width: 100%;
  height: 2rem;
  box-sizing: border-box;
  outline: 0;
  margin: 0;
  padding: 0.5rem;
  font-size: 1.25rem;
  border: 1px solid #ccc;
  border-radius: 0.25rem;
}
main > section section.borderbox.search input[type=text]::placeholder {
  color: #ccc;
}
main > section section.borderbox.search div.loader {
  width: 2rem;
  height: 2rem;
  border-top: 0.5rem solid #22A7F0;
  border-left: 0.5rem solid #ccc;
  border-right: 0.5rem solid #ccc;
  border-bottom: 0.5rem solid #ccc;
  border-radius: 50%;
  margin: 1rem auto 0 auto;
  animation: spin 0.75s linear infinite;
}
main > section section.borderbox.search ul {
  width: 100%;
  height: auto;
  margin: 0;
  padding: 0;
  list-style: none;
}
main > section section.borderbox.search ul li {
  margin-top: 0.5rem;
  padding-bottom: 0.5rem;
  cursor: pointer;
  border-bottom: 1px solid #87D37C;
}
main > section section.borderbox.search ul li:last-child {
  border-bottom: none;
  padding-bottom: 0;
}
main > section section.borderbox.calendar div.calendar-container {
  width: 100%;
  border: 1px solid #22A7F0;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-controls {
  display: flex;
  justify-content: space-between;
  padding: 0 0.5rem;
  height: 1.5rem;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-controls.calendar-year {
  background-color: #22A7F0;
  color: white;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-controls.calendar-month {
  border-bottom: 1px solid #22A7F0;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-controls span {
  font-size: 1rem;
  flex: auto 0 0;
  line-height: 1.5rem;
  user-select: none;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-controls span:not(.disabled):not(:nth-child(2)) {
  cursor: pointer;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-controls span:not(.disabled):not(:nth-child(2)):hover {
  text-decoration: underline;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-controls span.disabled {
  visibility: hidden;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week {
  display: flex;
  justify-content: space-between;
  padding: 0 0.5rem;
  height: 1.5rem;
  box-sizing: border-box;
  padding: 0.25rem 0.5rem;
  height: 2rem;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week:nth-of-type(even) {
  background-color: rgba(238, 238, 238, 0.8);
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week.invisible {
  display: none;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week span.calendar-day {
  display: block;
  flex: 1.5rem 0 0;
  height: 1.5rem;
  line-height: 1.5rem;
  text-align: center;
  box-sizing: border-box;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week span.calendar-day.avl {
  border-radius: 0.75rem;
  border: 1px solid #87D37C;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week span.calendar-day.avl.archived {
  background-image: url(../img/archived.svg);
  background-repeat: no-repeat;
  background-size: cover;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week span.calendar-day.avl.forecast {
  border-style: dashed;
}
main > section section.borderbox.calendar div.calendar-container div.calendar-week span.calendar-day.avl.active,
main > section section.borderbox.calendar div.calendar-container div.calendar-week span.calendar-day.avl:hover {
  border: none;
  background-color: #87D37C;
  color: white;
  cursor: pointer;
}
main > section div.button-group {
  display: flex;
  margin-top: 1rem;
}
main > section div.button-group button {
  flex: 33.333% 0 0;
  min-height: 1.5rem;
  box-sizing: border-box;
  outline: none;
  background: transparent;
  border: 1px solid #87D37C;
  color: #87D37C;
  margin: 0.25rem 0 0 0;
  font-size: 0.875rem;
  cursor: pointer;
}
main > section div.button-group button:first-child {
  border-top-left-radius: 0.25rem;
  border-bottom-left-radius: 0.25rem;
  border-right: none;
}
main > section div.button-group button:last-child {
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
  border-left: none;
}
main > section div.button-group button.active {
  background: #87D37C;
  color: #fff;
}
main > section div.button-group button:disabled {
  color: #eee;
  border-color: #eee;
}
main > section div.button-group button:disabled.active {
  background: #eee;
  color: #fff;
}
main > section div.button-group + section.borderbox {
  margin-top: 1rem;
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
/*# sourceMappingURL=waldbrand.css.map */