.map-container {
  position: relative;
  height: 400px;
  min-height: 400px; }
  .map-container #map {
    position: fixed;
    width: 100%;
    height: 400px;
    min-height: 400px; }
  .map-container [role="menu"] {
    left: 0 !important; }
  .map-container iframe {
    width: 100%;
    height: 565px; }
  .map-container .search-bar {
    position: absolute;
    top: 0;
    left: 0px;
    z-index: 2;
    border: none;
    height: 2rem;
    width: 12.5rem;
    cursor: pointer;
    padding: 0 0.55rem 0 0.65rem;
    box-shadow: none; }
  .map-container .search-button {
    position: absolute;
    top: 0;
    right: 0px;
    z-index: 2;
    border: none;
    height: 2rem;
    width: 2.3rem;
    cursor: pointer;
    box-shadow: none; }
  .map-container #address-search {
    display: none;
    opacity: 0;
    width: 0;
    max-width: 21.5rem;
    height: 2.5rem;
    padding: 0;
    margin: 10px 10px 10px -5px;
    text-overflow: ellipsis;
    font-size: 1.2em;
    border: none;
    border-radius: .1rem;
    color: #000;
    background: #fff;
    -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 4px -1px;
    -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 4px -1px;
    box-shadow: rgba(0, 0, 0, 0.3) 0 1px 4px -1px;
    -webkit-transition: "all" 0.5s "ease-in-out";
    -moz-transition: "all" 0.5s "ease-in-out";
    -ms-transition: "all" 0.5s "ease-in-out";
    -o-transition: "all" 0.5s "ease-in-out";
    transition: "all" 0.5s "ease-in-out"; }
    .map-container #address-search.mobile {
      left: 15px !important;
      top: 50px !important; }
  .map-container #clear-search-marker {
    background: url(https://aeptransmission.com/dist/images/icon-clear-marker.svg) no-repeat center, #fff;
    cursor: pointer;
    margin: 10px;
    width: 40px;
    height: 40px;
    border: 2px solid #fff;
    border-radius: 3px;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.3);
    position: absolute;
    display: none;
    top: 0px;
    left: 665px;
    z-index: 3;
    -webkit-transition: "left" 0.5s "ease-in-out";
    -moz-transition: "left" 0.5s "ease-in-out";
    -ms-transition: "left" 0.5s "ease-in-out";
    -o-transition: "left" 0.5s "ease-in-out";
    transition: "left" 0.5s "ease-in-out"; }
  .map-container .btn {
    position: absolute;
    left: 25px;
    bottom: 25px;
    font-family: "Roboto", sans-serif;
    font-size: 1.1rem;
    text-transform: uppercase; }

@media (max-width: 740px) {
  #address-search {
    width: 18.8rem !important; }
  #clear-search-marker {
    left: 306px !important;
    top: 50px !important; } }

#legend {
  position: absolute;
  right: 15px;
  bottom: 15px;
  width: 285px;
  background: #ffffff;
  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 4px -1px;
  -moz-box-shadow: rgba(0, 0, 0, 0.3) 0 1px 4px -1px;
  box-shadow: rgba(0, 0, 0, 0.3) 0 1px 4px -1px;
  border-radius: 0 0 2px 2px; }
  #legend #legend-toggle {
    width: 285px;
    position: absolute;
    top: -40px;
    right: 0;
    border-radius: 2px 2px 0 0;
    background-color: rgba(74, 74, 74, 0.87);
    padding: 0 10px;
    color: #ffffff;
    font-weight: 600;
    line-height: 40px;
    height: 40px;
    font-size: 1.1rem;
    letter-spacing: .075rem;
    cursor: pointer;
    -webkit-transition: all .5s ease-in-out;
    -moz-transition: all .5s ease-in-out;
    -ms-transition: all .5s ease-in-out;
    -o-transition: all .5s ease-in-out;
    transition: all .5s ease-in-out; }
    #legend #legend-toggle.open + #min-max {
      max-height: 600px;
      -webkit-transition: max-height 1s ease-in-out;
      -moz-transition: max-height 1s ease-in-out;
      -ms-transition: max-height 1s ease-in-out;
      -o-transition: max-height 1s ease-in-out;
      transition: max-height 1s ease-in-out; }
    #legend #legend-toggle svg {
      position: absolute;
      top: 5px;
      max-width: 30px;
      right: 5px;
      -webkit-transition: "all" 0.5s "ease-in-out";
      -moz-transition: "all" 0.5s "ease-in-out";
      -ms-transition: "all" 0.5s "ease-in-out";
      -o-transition: "all" 0.5s "ease-in-out";
      transition: "all" 0.5s "ease-in-out";
      transform: rotate(180deg);
      -ms-transform: rotate(180deg); }
      #legend #legend-toggle svg .st2 {
        fill: #ffffff; }
    #legend #legend-toggle.open svg {
      transform: rotate(0deg);
      -ms-transform: rotate(0deg); }
    #legend #legend-toggle:hover {
      background-color: #4a4a4a; }
  #legend #min-max {
    position: relative;
    height: auto;
    max-height: 0;
    overflow: hidden;
    border: none;
    -webkit-transition: max-height 0.8s cubic-bezier(0, 1, 0, 1);
    -moz-transition: max-height 0.8s cubic-bezier(0, 1, 0, 1);
    -ms-transition: max-height 0.8s cubic-bezier(0, 1, 0, 1);
    -o-transition: max-height 0.8s cubic-bezier(0, 1, 0, 1);
    transition: max-height 0.8s cubic-bezier(0, 1, 0, 1); }
  #legend ul {
    margin-bottom: 0;
    padding: 10px 5px 5px 10px; }
    #legend ul li {
      list-style-type: none;
      font-size: 12px;
      padding: 5px 75px 5px 5px;
      margin-bottom: 5px;
      line-height: 1em;
      position: relative; }
      #legend ul li .switch {
        position: absolute;
        right: 10px;
        top: 50%;
        margin-top: -10px;
        display: inline-block;
        vertical-align: top;
        width: 56px;
        height: 20px;
        background: rgba(255, 255, 255, 0.8);
        border-radius: 18px;
        cursor: pointer;
        -webkit-box-sizing: content-box;
        -moz-box-sizing: content-box;
        box-sizing: content-box;
        padding: 0;
        -webkit-transition: "background-color" 0.25s "ease-in-out";
        -moz-transition: "background-color" 0.25s "ease-in-out";
        -ms-transition: "background-color" 0.25s "ease-in-out";
        -o-transition: "background-color" 0.25s "ease-in-out";
        transition: "background-color" 0.25s "ease-in-out"; }
        #legend ul li .switch .switch-input {
          position: absolute;
          top: 0;
          left: 0;
          opacity: 0; }
          #legend ul li .switch .switch-input:checked ~ .switch-label:before {
            opacity: 1; }
          #legend ul li .switch .switch-input:checked ~ .switch-label:after {
            opacity: 0; }
          #legend ul li .switch .switch-input:checked ~ .switch-handle {
            left: 37px;
            box-shadow: -1px 1px 5px rgba(0, 0, 0, 0.2); }
        #legend ul li .switch .switch-label {
          position: relative;
          display: block;
          height: inherit;
          font-size: 10px;
          text-transform: uppercase;
          border-radius: inherit; }
          #legend ul li .switch .switch-label:before {
            content: attr(data-on);
            left: 11px;
            color: #fff;
            opacity: 0; }
          #legend ul li .switch .switch-label:after {
            content: attr(data-off);
            right: 11px;
            color: #000; }
          #legend ul li .switch .switch-label:before, #legend ul li .switch .switch-label:after {
            position: absolute;
            top: 0;
            line-height: 20px;
            -webkit-transition: inherit;
            -moz-transition: inherit;
            -o-transition: inherit;
            transition: inherit; }
        #legend ul li .switch .switch-handle {
          position: absolute;
          top: 1px;
          left: 2px;
          width: 18px;
          height: 18px;
          background: #FFF;
          border-radius: 10px;
          -webkit-transition: "left" 0.15s "ease-out";
          -moz-transition: "left" 0.15s "ease-out";
          -ms-transition: "left" 0.15s "ease-out";
          -o-transition: "left" 0.15s "ease-out";
          transition: "left" 0.15s "ease-out"; }
          #legend ul li .switch .switch-handle:before {
            content: '';
            position: absolute;
            top: 50%;
            left: 50%;
            width: 12px;
            height: 12px;
            background: #ffffff;
            border-radius: 6px;
            margin: -6px 0 0 -6px; }
        #legend ul li .switch.unchecked {
          background: rgba(155, 155, 155, 0.5) !important; }

.segment-label-black, .marker-label-black {
  color: #fff;
  text-align: center;
  position: absolute;
  top: 50%;
  left: 50%;
  opacity: 1;
  text-shadow: black 2px 0px 0px, black 1.75517px 0.95885px 0px, black 1.0806px 1.68294px 0px, black 0.14147px 1.99499px 0px, black -0.83229px 1.81859px 0px, black -1.60229px 1.19694px 0px, black -1.97998px 0.28224px 0px, black -1.87291px -0.70157px 0px, black -1.30729px -1.5136px 0px, black -0.42159px -1.95506px 0px, black 0.56732px -1.91785px 0px, black 1.41734px -1.41108px 0px, black 1.92034px -0.55883px 0px; }

.segment-label-black {
  transform: translate(-50%, -50%);
  font-size: 1em; }

.marker-label-black {
  transform: translate(-50%, -225%);
  width: 500px;
  font-size: 1.2em;
  text-transform: capitalize; }

.infowindow-header {
  margin-top: 10px;
  font-weight: 400;
  text-transform: none; }

.custom-infowindow-button {
  margin-top: 10px;
  -webkit-transition: "opacity" 0.35s "ease-in-out";
  -moz-transition: "opacity" 0.35s "ease-in-out";
  -ms-transition: "opacity" 0.35s "ease-in-out";
  -o-transition: "opacity" 0.35s "ease-in-out";
  transition: "opacity" 0.35s "ease-in-out"; }
  .custom-infowindow-button:first-child {
    margin-top: 0; }
  .custom-infowindow-button a {
    color: white;
    padding: 15px;
    text-transform: uppercase;
    text-align: center;
    font-weight: 400;
    display: block; }
  .custom-infowindow-button.yellow {
    background: #e09600; }
  .custom-infowindow-button.green {
    background: #7ba800; }
  .custom-infowindow-button.blue {
    background: #4277b3; }
  .custom-infowindow-button.secondary-gray {
    background: #4a4a4a; }
  .custom-infowindow-button:hover {
    opacity: 0.75; }
