.shades-grid:hover{scale:.9;transition:all .5s;cursor:pointer}.shade-x{padding-top:10rem;background:url(https://tailwindui.com/img/beams-home@95.jpg);background-size:cover;background-repeat:no-repeat}.shades-boxes{grid-template-columns:repeat(5,0fr);display:grid;gap:10px;margin-top:1.5rem}.select-color,.shades-boxes{justify-content:center;align-items:center}.select-color{flex-direction:column}.input-color,.select-color{display:flex;margin-top:1rem}.input-color{padding:1.5vmax 5vmax;gap:.5rem;border-radius:5px;box-shadow:0 54px 55px rgba(0,0,0,.25),0 -12px 30px rgba(0,0,0,.12),0 4px 6px rgba(0,0,0,.12),0 12px 13px rgba(0,0,0,.17),0 -3px 5px rgba(0,0,0,.09);background-color:#000}@media only screen and (max-width:500px){.shades-boxes{grid-template-columns:repeat(3,0fr)}}