/*
 Theme Name:   SomethingElseMusic.net GeneratePress Child Theme
 Theme URI:    https://zonew3.com
 Description:  GeneratePress child theme for somethingelsemusic.net (based on DWF starter 1.7.0)
 Author:       Stéphane Bergeron
 Author URI:   https://zonew3.com
 Template:     generatepress
 Version:      1.0.0
 Tags: two-columns, three-columns, one-column, right-sidebar, left-sidebar, fluid-layout, responsive-layout, custom-header, custom-background, custom-menu, custom-colors, sticky-post, threaded-comments, translation-ready, featured-images, theme-options, light, white, dark, black, blue, brown, gray, green, orange, pink, purple, red, silver, tan, yellow
*/

/* GENERAL / GLOBAL / UTILITY CLASSES
***********************************************************************************************************************/

/* Site Wrapper */
/*.site-wrapper {
    width: 100%;
    max-width: 2560px;
    margin-inline: auto;
}*/

/* Aspect Ratios */
.ar-16-9 {
    aspect-ratio: 16/9;
}
.ar-9-16 {
    aspect-ratio: 9/16;
}
.ar-4-3 {
    aspect-ratio: 4/3;
}
.ar-3-4 {
    aspect-ratio: 3/4;
}
.ar-1-1 {
    aspect-ratio: 1/1;
}

/* Visually Hidden (accessibility) */
.visually-hidden:not(:focus):not(:active) {
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute;
    white-space: nowrap;
    width: 1px;
}

/* No Underline */
.no-ul,
.no-ul a {
    text-decoration: none;
}

/* Control bottom margins of last elements in containers */
body .gb-container p:last-child,
body .gb-container ul:last-child,
body .gb-container ol:last-child {
    margin-bottom: 0;
}

/* Scroll Grid Utility: Make GPP Query Loops and other grids scrollable instead of
   going to 2 columns in Tablet view or stacking in Mobile view
   https://developer.mozilla.org/en-US/docs/Web/CSS/scroll-snap-type */

@media (max-width: 1024px) {

    .scroll-grid {
        grid-template-columns: none;
        grid-auto-flow: column;
        grid-auto-columns: 320px; /* Change to what makes sense */
        overflow-x: scroll;
        scroll-snap-type: x mandatory;
    }
    .scroll-grid > div {
        scroll-snap-align: start;
    }

}