.slider-container{
    box-sizing: border-box;
    width: 100%;
    display: flex;
    flex-direction: row;
    padding: 10px 0;
    /*Colors*/
    --primary-color: #eee;
    --secondary-color: #333;
    --tertiary-color: #555;
    --quaternary-color: rgb(50,170,255);
    /* outline: 1px solid green; */
    /* background-color: orange; */
}

.slider-container .slider-label-wrapper{
    width: 35%;
    display: flex;  
    /* background-color: aqua; */
    overflow: hidden;
    white-space: nowrap;
    padding-left: 10px;
    margin-right: 10px;
}

.slider-container .slider-input-wrapper{
    width: 15%;
    /* background-color: brown; */
}

.slider-container .slider {
    width: 50%;
    /* margin: 0 5%; */
    /* background-color: green; */
    margin: 0 10px;
}

.slider-container .slider-label-wrapper .slider-label p {
    color: var(--secondary-color);
}


.slider-container .slider-input-wrapper .number {
    -webkit-appearance: none;
    outline: none;
    border:  1px solid #333;
    text-align: left;
    width: 100%;
    /* width: 25%; */
    /* margin-left: 10px; */
}

.slider-container .number:focus {
    outline: none;
    background-color: var(--quaternary-color);
}



.slider-container .number::-webkit-outer-spin-button,
.slider-container .number::-webkit-inner-spin-button{
    -webkit-appearance: none;
    margin: 0;
}