.slider-container{
    background-color: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 200px;
    height: 250px;
    padding: auto;
    color: #fff;
    background-color: rgba(0,0,0,.3);
    border: 1px solid #fff;
    border-radius: .5rem;
}

fieldset {

    border: none;
}

form{
    padding-top: 40%;
    padding-bottom: 40%;
    
}

legend{
    text-align: center;
    padding-top: 1.5rem;
    font-size: 1.5rem;
}

label[for="r"],
output[for="r"]{
    background-color: rgba(255,0,0,.8);
    padding: .2rem;
    border: 1px solid #fff;
 }
label[for="g"],
output[for="g"]{
    background-color: rgba(0,255,0,.8);
    padding: .2rem;
    border: 1px solid #fff;
 }
label[for="b"],
output[for="b"]{
    background-color: rgba(0,0,255,.8);
    padding: .2rem;
    border: 1px solid #fff;
 }
 .hex-container{
text-align: center;
padding-bottom: 1.5rem;
font-size: 1.5rem;
 }