[type=range] {
    -webkit-appearance: none;
    background: transparent;
    margin: 13px 0;
    width: 100%
}

    [type=range].invalid {
        border: 0 !important
    }

    [type=range]::-moz-focus-outer {
        border: 0
    }

    [type=range]:focus {
        outline: 0
    }

        [type=range]:focus::-webkit-slider-runnable-track {
            background: #fff;
        }

        [type=range]:focus::-ms-fill-lower {
            background: #fff;
        }

        [type=range]:focus::-ms-fill-upper {
            background: #fff;
        }

    [type=range]::-webkit-slider-runnable-track {
        background: #fff;
        border: 2px solid #fff;
        border-radius: 5px;
        box-shadow: 1px 1px 1px rgba(0,0,0,.2),0 0 1px hsla(0,0%,5%,.2);
        cursor: default;
        height: 8px;
        -webkit-transition: all .2s ease;
        transition: all .2s ease;
        width: 100%
    }

    [type=range]::-webkit-slider-thumb {
        -webkit-appearance: none;
        background: #512884;
        border: 2px solid #00a8b4;
        border-radius: 13px;
        box-shadow: 4px 4px 4px rgba(0,0,0,.2),0 0 4px hsla(0,0%,5%,.2);
        box-sizing: border-box;
        cursor: default;
        height: 26px;
        margin-top: -11px;          
        width: 26px
    }

    [type=range]::-moz-range-track {
        background: #fff;
        border: 2px solid #fff;
        border-radius: 5px;
        box-shadow: 1px 1px 1px rgba(0,0,0,.2),0 0 1px hsla(0,0%,5%,.2);
        cursor: default;
        height: 8px;
        -moz-transition: all .2s ease;
        transition: all .2s ease;
        width: 100%
    }

    [type=range]::-moz-range-thumb {
        background: #512884;
        border: 2px solid #00a8b4;
        border-radius: 13px;
        box-shadow: 4px 4px 4px rgba(0,0,0,.2),0 0 4px hsla(0,0%,5%,.2);
        box-sizing: border-box;
        cursor: default;
        height: 26px;
        width: 26px
    }

    [type=range]::-ms-track {
        background: transparent;
        border-color: transparent;
        border-width: 13px 0;
        color: transparent;
        cursor: default;
        height: 8px;
        -ms-transition: all .2s ease;
        transition: all .2s ease;
        width: 100%
    }

    [type=range]::-ms-fill-lower {
        background: #00909b
    }

    [type=range]::-ms-fill-lower, [type=range]::-ms-fill-upper {
        border: 2px solid #00a8b4;
        border-radius: 10px;
        box-shadow: 1px 1px 1px rgba(0,0,0,.2),0 0 1px hsla(0,0%,5%,.2)
    }

    [type=range]::-ms-fill-upper {
        background: #00a8b4
    }

    [type=range]::-ms-thumb {
        background: #512884;
        border: 2px solid #00a8b4;
        border-radius: 13px;
        box-shadow: 4px 4px 4px rgba(0,0,0,.2),0 0 4px hsla(0,0%,5%,.2);
        box-sizing: border-box;
        cursor: default;
        height: 26px;
        margin-top: 2px;
        width: 26px
    }

    [type=range]:disabled::-moz-range-thumb, [type=range]:disabled::-ms-fill-lower, [type=range]:disabled::-ms-fill-upper, [type=range]:disabled::-ms-thumb, [type=range]:disabled::-webkit-slider-runnable-track, [type=range]:disabled::-webkit-slider-thumb {
        cursor: not-allowed
    }