@font-face {
  font-family: 'questrialregular';
  src: url('../fonts/questrial-regular-webfont.eot');
  src: url('../fonts/questrial-regular-webfont.eot?#iefix') format('embedded-opentype'),
  url('../fonts/questrial-regular-webfont.woff2') format('woff2'),
  url('../fonts/questrial-regular-webfont.woff') format('woff'),
  url('../fonts/questrial-regular-webfont.ttf') format('truetype');
  font-weight: normal;
  font-style: normal;
}

svg {
  text {
    font-family: 'questrialregular'!important;
    tspan {
      font-family: 'questrialregular'!important;
    }
  }
}

html, body {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 20px;
  background-color: #ccc;
  box-sizing: border-box;
}

#container {
  position: relative;
  float: left;
  /*height: 100%;
  width: 100%;
  max-height: 100%;
  max-width: calc(100% - 440px);*/
  height: calc(100vh - 80px);
  width: calc(100vh - 80px);
  border: 1px solid white;
  overflow: hidden;
  &.zoomed {
    svg g#map-regions g:not(.country-on) {
      //display: none!important;
      opacity: 0.25!important;
    }
  }
  svg {
    user-select: none!important;
    -webkit-tap-highlight-color: transparent;
    * {
      user-select: none!important;
      -webkit-tap-highlight-color: transparent;
    }
    g.country-on path {
      //fill: #66442e!important;
    }
    g {
      pointer-events: none;
      &#map-regions {
        pointer-events: all!important;
        z-index: 999;
        g {
          pointer-events: all!important;
          z-index: 999;
          cursor: pointer;
          &:not(.country-on):hover path {
            //fill: #333!important;
          }
        }
      }
    }
  }
}

/* UI */
#search-container {
  float: left;
  margin-left: 20px;
  input {
    float: left;
    width: 300px;
    padding: 5px 10px;
  }
  .btn {
    float: left;
    background-color: #333;
    color: white;
    text-align: center;
    padding: 5px 10px;
    user-select: none;
    cursor: pointer;
    &#track-btn {
      margin-top: 20px;
    }
  }
  #logs {
    clear: both;
    max-width: 400px;
    margin-top: 50px;
  }
}