/*
 * Override CSS for the leaflet map zoom controls
 */
 .leaflet-touch .leaflet-control-layers, .leaflet-touch .leaflet-bar {
    border: 2px solid rgba(0,0,0,0.2);
    background-clip: padding-box;
    border: none;
  }
  .leaflet-touch .leaflet-bar a:first-child {
    border-top-left-radius: 2px;
    border-top-right-radius: 2px;
    border: 3px solid rgba(0,0,0,0);  
    background-color: rgba(20, 20, 40, 0.85);
    border-radius: 8px;
    color: #DADDDF;
    margin-bottom: 3px;
    font-weight: normal;
    transition-duration: 0.25s;
    line-height: 28px;
  }
  .leaflet-touch .leaflet-bar a:first-child:hover {
    color: rgba(20, 20, 40, 0.85);
    background-color: #D5D8D9;
    border: 3px solid rgba(20, 20, 40, 0.85);
  }
  
  .leaflet-touch .leaflet-bar a:last-child {
    border-bottom-left-radius: 2px;
    border-bottom-right-radius: 2px;
    border: 3px solid rgba(0,0,0,0);
    background-color: rgba(20, 20, 40, 0.85);
    color: #DADDDF;
    border-radius: 8px;
    font-weight: normal;
    transition-duration: 0.25s;
    line-height: 28px;
  }
  .leaflet-touch .leaflet-bar a:last-child:hover {
    color: rgba(20, 20, 40, 0.85);
    background-color: #D5D8D9;
    border: 3px solid rgba(20, 20, 40, 0.85);
  }