/* body{
    background-color: #f1ece3;
} */
.universal-slider{
    position: absolute;
    top: -60px;
    left:-30px;
}
.universal-slider .slider-circuit{
    position: relative;
    left: 8px;
    top: 8px;
    z-index: 20;
}
.universal-slider .slider .slider_R,.range-slider{
    position: absolute;
    left: 557px;
    top: 115px;
    z-index: 499;
    -webkit-appearance: none;
    appearance: none;
    transform: rotate(-90deg);
    width: 80px;
    height: 30px;
    height: 10px;
    border-radius: 5px;
    /* background: #d3d3d3; */
    background: transparent;
    outline: none;
    opacity: 0.9;
    -webkit-transition: .2s;
    transition: opacity .2s;
}
.universal-slider .slider .slider_R::-webkit-slider-thumb,.range-slider::-webkit-slider-thumb{
    -webkit-appearance: none;
    appearance: none;
    height: 30px;
    width: 30px;
    border: 0;
    transform: rotate(90deg);
    background: url('../src/images/sliders/slider_tip.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    cursor: pointer;

}
/* .universal-slider .slider .slider_R::-moz-range-thumb,.range-slider::-moz-range-thumb{
    -webkit-appearance: none;
    appearance: none;
    height: 30px;
    width: 30px;
    border: 0;
    transform: rotate(90deg);
    background: url('./img/slider_tip.png');
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    cursor: pointer;

} */
.universal-slider .slider .slider_R:hover,.range-slider:hover{
    /* background-color: black; */
    opacity: 1;
}

.universal-slider .slider .slider_R+img{
    position: absolute;
    left: 569px;
    top: 120px;
    z-index: 498;
}
.universal-slider .slider .value-box{
    background-color: white;
    text-align: black;
    border: 1px solid black;
    width: fit-content;
    display: flex;
    padding: 0 3px;
}
.universal-slider .slider .value-box input{
    border: none;
    outline: none;
    width: 30px;
    font-weight: bold;
}




/* ! Fix positions of all slider input value */
.universal-slider .slider .r .value-box{
    position: absolute;
    left: 588px;
    top: 54px;
    z-index: 500;
}
/* slider d */
.universal-slider .slider .slider_D{
    transform: rotate(0deg);
    left: 281px;
    top: 143.8px;
    width: 80px;
    background-color: transparent;
}

.universal-slider .slider .d .value-box{
    position: absolute;
    left: 299px;
    top: 97px;
    z-index: 500;
}
.universal-slider .slider .slider_D+img{
    position: absolute;
    left: 218px;
    top: 141px;
    width: 80px;
    z-index: 10;
}

/* slider v */
.universal-slider .slider .v .meter{
    width: 113px;
    position: absolute;
    top: 12px;
    left: 70px;
}

.universal-slider .slider .v .slider-V-arrow{
    width: 35px;
    cursor: pointer;
    position: absolute;
    z-index: 200;
}

.slider-v-r1{
    transform: rotate(0deg);
    top: 65px;
    left: 100px;
}
.slider-v-r2{
    transform: rotate(50deg);
    top: 62px;
    left: 110px;
}
.slider-v-r3{
    transform: rotate(110deg);
    top: 67px;
    left: 119px;
}
.universal-slider .slider .v .value-box{
    position: absolute;
    top: 103px;
    left: 116px;
    z-index: 200;
}
