@supports(scroll-snap-type: x mandatory) {
    
    @media all and (max-width: 1280px) {
        
        .scroll-snap-container-1280 {
            
            /*variables*/
            --gap-between-elements: 90px;
            --element-width: max(220px, 30vw);
            
            overflow-x: scroll;
            scroll-snap-type: x mandatory;
        }
        
        .elementor-widget-loop-grid.scroll-snap-grid-1280 .elementor-grid,
        .e-grid.scroll-snap-grid-1280,
        .custom-grid.scroll-snap-grid-1280 {
            display: grid;
            grid-template-columns: repeat(20, var(--element-width)) !important;
            grid-template-rows: 1fr !important;
            column-gap: var(--gap-between-elements) !important;
            row-gap: 0 !important;
            
            position: relative;
        }
        
        .elementor-widget-loop-grid.scroll-snap-grid-1280 .elementor-grid > *,
        .e-grid.scroll-snap-grid-1280 > *,
        .custom-scroll-snap-grid-1280 > * {
            
            /*reset*/
            margin: 0 !important;
            
            scroll-snap-align: center;
            scroll-snap-stop: normal;
            box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
        }
        
        
        /*Hack to insert padding left and right*/
        /*Source: https://stackoverflow.com/a/57704302*/
        /*.elementor-widget-loop-grid.scroll-snap-grid-1280 .elementor-grid:before,
        .e-grid.scroll-snap-grid-1280:before,
        .custom-grid.scroll-snap-grid-1280:before,*/
        .elementor-widget-loop-grid.scroll-snap-grid-1280 .elementor-grid:after,
        .e-grid.scroll-snap-grid-1280:after,
        .custom-grid.scroll-snap-grid-1280:after{
            content: '';
            position: relative;
            width: 1px;
        }
    }
    
    
    @media all and (max-width: 768px) {
        
        .scroll-snap-container-768 {
            
            /*variables*/
            --gap-between-elements: 30px;
            --element-width: max(220px, 66vw);
            
            overflow-x: scroll;
            scroll-snap-type: x mandatory;
        }
        
        .elementor-widget-loop-grid.scroll-snap-grid-768 .elementor-grid,
        .e-grid.scroll-snap-grid-768,
        .custom-grid.scroll-snap-grid-768 {
            display: grid;
            grid-template-columns: repeat(20, var(--element-width)) !important;
            grid-template-rows: 1fr !important;
            column-gap: var(--gap-between-elements) !important;
            row-gap: 0 !important;
            
            position: relative;
        }
        
        .elementor-widget-loop-grid.scroll-snap-grid-768 .elementor-grid > *,
        .e-grid.scroll-snap-grid-768 > *,
        .custom-grid.scroll-snap-grid-768 > * {
            
            /*reset*/
            margin: 0 !important;
            
            scroll-snap-align: center;
            scroll-snap-stop: normal;
            box-shadow: 0 0 2px rgba(0, 0, 0, 0.5);
        }
        
        
        /*Hack to insert padding left and right*/
        /*Source: https://stackoverflow.com/a/57704302*/
        /*.elementor-widget-loop-grid.scroll-snap-grid-768 .elementor-grid:before,
        .e-grid.scroll-snap-grid-768:before,
        .custom-grid.scroll-snap-grid-768:before,*/
        .elementor-widget-loop-grid.scroll-snap-grid-768 .elementor-grid:after,
        .e-grid.scroll-snap-grid-768:after,
        .custom-grid.scroll-snap-grid-768:after {
            content: '';
            position: relative;
            width: 1px;
        }
    }
}