.os-slider {
    width: 100%;
    height: 48px;
    display: block;
    position: relative;

    input[type="range"] {
        width: 100%;
        appearance: none;
        background: transparent;
        margin-left: 0px;
        margin-right: 0px;

        &:focus {
            outline: none;
        }

        &::-webkit-slider-thumb {
            width: 11px;
            height: 21px;
            appearance: none;
            background: url("/assets/themes/win98/icons/slider.png");
            background-position: 0px 0px;
            transform: translateY(-8px);
        }

        &::-moz-range-thumb {
            width: 11px;
            height: 21px;
            border: 0;
            border-radius: 0;
            background: url("/assets/themes/win98/icons/slider.png");
            background-position: 0px 0px;
            transform: translateY(2px);
        }

        &::-webkit-slider-runnable-track {
            width: 100%;
            height: 2px;
            box-sizing: border-box;
            background: black;
            border-right: 1px solid grey;
            border-bottom: 1px solid grey;
            box-shadow: 1px 0 0 white, 1px 1px 0 white, 0 1px 0 white, -1px 0 0 darkgrey, -1px -1px 0 darkgrey,
                0 -1px 0 darkgrey, -1px 1px 0 white, 1px -1px darkgrey;
        }

        &::-moz-range-track {
            width: 100%;
            height: 2px;
            box-sizing: border-box;
            background: black;
            border-right: 1px solid grey;
            border-bottom: 1px solid grey;
            box-shadow: 1px 0 0 white, 1px 1px 0 white, 0 1px 0 white, -1px 0 0 darkgrey, -1px -1px 0 darkgrey,
                0 -1px 0 darkgrey, -1px 1px 0 white, 1px -1px darkgrey;
        }
    }

    &.os-disabled input[type="range"] {
        &::-webkit-slider-thumb {
            background-position: 0px -21px;
        }

        &::-moz-range-thumb {
            background-position: 0px -21px;
        }
    }

    .os-label {
        display: block;
    }

    .os-min-val-label {
        position: absolute;
        left: 0;
        bottom: 0;
        color: grey;
    }

    .os-max-val-label {
        position: absolute;
        right: 0;
        bottom: 0;
        color: grey;
    }
}
