.slider {
    -webkit-appearance: none;
    width: 100%;
    height: 1vh;
    border-radius: 5px;  
    background: rgb(255 255 255 / 25%);
    outline: none;
    opacity: 0.7;
    -webkit-transition: .2s;
    transition: opacity .2s;
}
.slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 3vh;
    height: 3vh;
    border-radius: 50%; 
    background: #ffffff;
    cursor: pointer;
}
.slider::-moz-range-thumb {
    width: 4vh;
    height: 4vh;
    border-radius: 50%;
    background: #ffffff;
    cursor: pointer;
}
* {
	scrollbar-width: thin;
	scrollbar-color: #B5B5B5 #707070;
}
*::-webkit-scrollbar {
	width: 0.5vh;
	
	height: 0.5vh;
}
*::-webkit-scrollbar-track {
	background-color: rgba(0, 0, 0, 0.2);
}
*::-webkit-scrollbar-thumb {
	border-radius: 5px;
	background-color: rgba(196, 196, 196, 0.5);
}
*::-webkit-scrollbar-thumb:active {
	background-color: rgba(255, 255, 255, 0.75);
}
.color-input {
	border-radius: 50%;
    height: 4vh;
    width: 4vh;
    border: none;
    outline: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
    appearance: none;
}
*::-webkit-color-swatch-wrapper {
    padding: 0; 
}
*::-webkit-color-swatch {
    border: none;
    border-radius: 50%;
}