.mapboxgl-ctrl-precip {
    background-image: url('data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMiAzMiI+PHRpdGxlPnJhZGFyMTwvdGl0bGU+PHBhdGggZD0iTTMxLDFWMzFIMVYxSDMxbTEtMUgwVjMySDMyVjBaIiBmaWxsPSIjZmZmIi8+PHBhdGggZD0iTTEzLjM1LDEzLjI5bC0uMTgtLjU5YTUsNSwwLDAsMSw0LjcyLDEuMDdBNS4wOSw1LjA5LDAsMCwxLDE5LjUzLDE5bC0uMzEsMC0uMzEtLjFhNC41NSw0LjU1LDAsMCwwLTUuNTYtNS41NloiLz48cGF0aCBkPSJNMTMuNjcsMTQuNTJsLS4xNS0uNThhMy44NywzLjg3LDAsMCwxLDQuNzUsNC43M2wtLjYtLjEzQTMuMjksMy4yOSwwLDAsMCwxMy42NywxNC41MloiLz48cGF0aCBkPSJNMTcsMTguMzZsLS41Ni0uMTdjMC0xLjgyLS44OC0yLjY3LTIuNDYtMi40MmwtLjE0LS42QTIuNTgsMi41OCwwLDAsMSwxNywxOC4zNloiLz48cGF0aCBkPSJNNy4yOSwxNi43OWMtLjI0LTEuMjIuMTItNy4zOCw1LjI2LTkuMTEsNi43LTIuMjcsMTAuNDUsMy43OCwxMC41Niw1LjM5LDEuMiwwLDYuMzkuNjQsNS45Miw2Ljg3YTUuNzcsNS43NywwLDAsMS01LDQuODhINi44OHMtMy40Ny4yMy00LTMuNzdDMi41MiwxNy41NCw2LjI4LDE2LjU0LDcuMjksMTYuNzlaIiBmaWxsPSJub25lIiBzdHJva2U9IiMwMDAiIHN0cm9rZS1taXRlcmxpbWl0PSIxMCIvPjxwYXRoIGQ9Ik0xMS40MSwxNC40OGEzLjY0LDMuNjQsMCwwLDAtLjE4LDIuNzZBMTIuNzEsMTIuNzEsMCwwLDAsMTMsMTkuNjFMMTIuMjUsMjJoMmwtLjQ5LTEuNjdhNS4xOCw1LjE4LDAsMCwwLDIuMjQuOSwxLjY5LDEuNjksMCwwLDAsMS4xLS41OFoiLz48ZWxsaXBzZSBjeD0iMTQuNzQiIGN5PSIxNy4xIiByeD0iMC4zNCIgcnk9IjAuMzciLz48cG9seWdvbiBwb2ludHM9IjE0LjE1IDE3LjQzIDE0LjQ0IDE3LjI4IDE0LjYyIDE3LjQ1IDE0LjUgMTcuOCAxNC4xNSAxNy40MyIvPjwvc3ZnPg==');
  }
  
  .mapboxgl-ctrl-traffic {
    background-image: url('data:image/svg+xml;base64,PHN2ZyBpZD0iTGF5ZXJfMSIgZGF0YS1uYW1lPSJMYXllciAxIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAzMCAzMCI+PHRpdGxlPnZlaC1jYXI8L3RpdGxlPjxwYXRoIGQ9Ik0yOSwxVjI5SDFWMUgyOW0xLTFIMFYzMEgzMFYwWiIgZmlsbD0iI2ZmZiIvPjxnIGlkPSJfNDRweC1HbHlwaCIgZGF0YS1uYW1lPSI0NHB4LUdseXBoIj48ZyBpZD0idmVoLWNhciI+PHBhdGggaWQ9IkZpbGwtMjIxIiBkPSJNMjIuMiw2LjhBMi40NiwyLjQ2LDAsMCwwLDIwLDUuNEgxMEEyLjM5LDIuMzksMCwwLDAsNy44LDYuOUw2LjIsMTFIMjMuN1oiLz48cG9seWdvbiBpZD0iRmlsbC0yMjIiIHBvaW50cz0iMTEuNyAxNS41IDE4LjMgMTUuNSAxOC4zIDE0LjMgMTEuNyAxNC4zIDExLjcgMTUuNSIvPjxwYXRoIGlkPSJGaWxsLTIyMyIgZD0iTTIyLjMsMTYuNkExLjcsMS43LDAsMSwxLDI0LDE0LjlhMS44MywxLjgzLDAsMCwxLTEuNywxLjdaTTE5LjUsMTZhLjU4LjU4LDAsMCwxLS42LjZIMTEuMWEuNjUuNjUsMCwwLDEtLjYtLjZWMTMuOGEuNTguNTgsMCwwLDEsLjYtLjZoNy44YS42NS42NSwwLDAsMSwuNi42Wm0tMTEuOC42YTEuNywxLjcsMCwxLDEsMC0zLjQsMS43NSwxLjc1LDAsMCwxLDEuNywxLjcsMS42OSwxLjY5LDAsMCwxLTEuNywxLjdabTE1LjctNC41SDYuNmEyLjg2LDIuODYsMCwwLDAtMi44LDIuOHYyLjhIMjYuMVYxNC45YTIuNzEsMi43MSwwLDAsMC0yLjctMi44WiIvPjxwYXRoIGlkPSJGaWxsLTIyNCIgZD0iTTI2LjcsMTguOEgzLjNhLjY1LjY1LDAsMCwwLS42LjZ2MS4xYS41Ni41NiwwLDAsMCwuNi41SDV2Mi4yYTEuMTEsMS4xMSwwLDAsMCwxLjEsMS4xSDguM2ExLjExLDEuMTEsMCwwLDAsMS4xLTEuMVYyMUgyMC42djIuMmExLjExLDEuMTEsMCwwLDAsMS4xLDEuMWgyLjJBMS4xMSwxLjExLDAsMCwwLDI1LDIzLjJWMjFoMS43YS42NS42NSwwLDAsMCwuNi0uNlYxOS4zYS42NS42NSwwLDAsMC0uNi0uNSIvPjwvZz48L2c+PC9zdmc+');
  }
  
  .mapboxgl-ctrl-precip.active,
  .mapboxgl-ctrl-traffic.active,
  .mapboxgl-ctrl-precip.active:hover,
  .mapboxgl-ctrl-traffic.active:hover {
      background-color: lightblue;
  }
  
  .mapboxgl-ctrl-top-right {
      left: 0;
      right: auto;
  }
  
  .mapboxgl-ctrl-satellite.active {
      background-image: url('atis-static.iteriscdn.com/WebApps/GA/SafeTravel4/v1.4/images/map_icons/SatUSOff.png');
      width:30px;
      height:30px
  }
  
  .mapboxgl-ctrl-satellite {
      background-image: url('atis-static.iteriscdn.com/WebApps/GA/SafeTravel4/v1.4/images/map_icons/SatUS.png');
      width:30px;
      height:30px
  }