:root {
    --cube_size: 20em;
    --button_size: 6em;
    
}




    .crsl_t1 {
        
        
        display: grid;
        grid-auto-flow: column;
        justify-content:left; 
        gap: var(--spacing);
        padding: var(--outer_spacing);

        background-color: var(--red_default);
        
        overflow-x: scroll;
        scroll-snap-align: var(--red_default);
        scroll-behavior: smooth;
        -webkit-overflow-scrolling: touch;
        
        
        z-index: 4;
        
        
    }

    .cube_crsl_t1 {
        position: relative;
        height: var(--cube_size);
        width: var(--cube_size);    
        scroll-snap-align: start;
        background-color: black;
        text-decoration: none;
    }
    .cube_crsl_t1 img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .cube_crsl_t1 > div {
        position: absolute;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 1.5em;
        color: white;
        margin: auto;
        top: 60%;
        left: 0;
        padding: var(--spacing);
        border-radius: var(--border_radius);
        background-color: var(--red_default);
        
    }

    

    @media (max-width: 1200px){
        
        :root {
            --cube_size: 30em;
            
        }
      }

      @media (max-width: 600px){
        .crsl_t1 {
            padding-bottom: 2em;
            padding-top: 2em;
            
        }
        
        :root {
            --cube_size: 32em; 
            
        }
        
           
        
      }