.leaflet-sbs-range { -webkit-appearance: none; display: inline-block !important; vertical-align: middle; height: 0; padding: 0; margin: 0; border: 0; right: 0; background: rgba(0, 0, 0, 0.25); min-width: 100px; cursor: pointer; pointer-events: none; z-index: 999; } .leaflet-sbs-range::-ms-fill-upper { background: transparent; } .leaflet-sbs-range::-ms-fill-lower { background: rgba(255, 255, 255, 0.25); } /* Browser thingies */ .leaflet-sbs-range::-moz-range-track { opacity: 0; } .leaflet-sbs-range::-ms-track { opacity: 0; } .leaflet-sbs-range::-ms-tooltip { display: none; } /* For whatever reason, these need to be defined * on their own so dont group them */ .leaflet-sbs-range::-webkit-slider-thumb { -webkit-appearance: none; margin: 0; padding: 0; background: #fff; height: 30px; width: 30px; border-radius: 50%; cursor: ew-resize; pointer-events: auto; border: 2px solid #2c405a; color: #2c405a; background-image: url("data:image/svg+xml,<svg width='6' height='14' xmlns='http://www.w3.org/2000/svg'><path d='M.5.333v13.333h1.667V.333H.5zm5 13.333V.333H3.833v13.333H5.5z' fill='%232C405A'/></svg>"); background-position: 50% 50%; background-repeat: no-repeat; background-size: 6px 14px; } .leaflet-sbs-range::-ms-thumb { margin: 0; padding: 0; background: #fff; height: 30px; width: 30px; border-radius: 50%; cursor: ew-resize; pointer-events: auto; border: 2px solid #2c405a; color: #2c405a; background-image: url("data:image/svg+xml,<svg width='6' height='14' xmlns='http://www.w3.org/2000/svg'><path d='M.5.333v13.333h1.667V.333H.5zm5 13.333V.333H3.833v13.333H5.5z' fill='%232C405A'/></svg>"); background-position: 50% 50%; background-repeat: no-repeat; background-size: 6px 14px; } .leaflet-sbs-range::-moz-range-thumb { padding: 0; right: 0; left:0; background: #fff; height: 30px; width: 30px; border-radius: 50%; cursor: ew-resize; pointer-events: auto; border: 2px solid #2c405a; color: #2c405a; background-image: url("data:image/svg+xml,<svg width='6' height='14' xmlns='http://www.w3.org/2000/svg'><path d='M.5.333v13.333h1.667V.333H.5zm5 13.333V.333H3.833v13.333H5.5z' fill='%232C405A'/></svg>"); background-position: 50% 50%; background-repeat: no-repeat; background-size: 6px 14px; } .leaflet-sbs-range:disabled::-moz-range-thumb { cursor: default; } .leaflet-sbs-range:disabled::-ms-thumb { cursor: default; } .leaflet-sbs-range:disabled::-webkit-slider-thumb { cursor: default; } .leaflet-sbs-range:disabled { cursor: default; } .leaflet-sbs-range:focus { outline: none !important; } .leaflet-sbs-range::-moz-focus-outer { border: 0; }