body .p-slider {
    background-color: #dedce5;
    border: none;
    border-radius: 4px;
    margin: 8px 0px 8px 0px;

    .p-slider-range {
        background: #248bca;
        border-radius: 4px;
        box-sizing: content-box;
        height: 100%;
    }

    &-handle {
        background: #fff;
        border: 2px solid #428bca;
        border-radius: 50%;
        height: 22px;
        outline: none;
        width: 22px;

        transition: background 0.3s;
    }

    &-handle:not(.p-disabled) {
        &:hover {
            background: #e5eaea !important;
        }

        &:active {
            box-shadow: 0px 0px 0px 4px #428bca33;
        }
    }

    &.p-disabled {
        opacity: 0.5;
    }

    &.p-slider-horizontal {
        height: 6px;

        .p-slider-handle {
            margin-left: -11px;
            margin-top: -11px;
        }
    }

    &.p-slider-vertical {
        width: 6px;

        .p-slider-handle {
            margin-bottom: -11px;
            margin-left: -11px;
        }
    }

    &.p-slider-animate {
        .p-slider-handle {
            transition:
                background-color 0.3s,
                left 0.3s;
        }
    }
}