/* * {

    box-sizing: border-box;

}  */



.digages-container {

    display: grid;

    grid-template-columns: repeat(4, 1fr); /* Default for desktop */

    gap: 10px; /* Space between grid items */

    /* padding: 10px; */ 

} 

.digages-top-pad

{

    padding: 16px;

}



.digages-body-pad

{

    padding: 32px;

    padding-top: 20px;

    padding-bottom: 20px;

}



.digages-btm-pad

{

    padding: 16px;

    padding-top: 12px;

    padding-bottom: 12px;

}





.digages-text-start

{ 

    text-align: start;

}

.digages-text-center

{ 

    text-align: center;

}

.digages-text-end

{ 

    text-align: end;

}

/* Mobile-first approach */

@media (max-width: 599px) { /* Mobile */

    .digages-container {

        grid-template-columns: repeat(12, 1fr); /* 1 column */

    }

    .digages-mobile-span-1 {

        grid-column: span 1;

    }

    .digages-mobile-span-2 {

        grid-column: span 2;

    }

    .digages-mobile-span-3 {

        grid-column: span 3;

    }

    .digages-mobile-span-4 {

        grid-column: span 4;

    }

    .digages-mobile-span-5 {

        grid-column: span 5;

    }

    .digages-mobile-span-6 {

        grid-column: span 6;

    }

    .digages-mobile-span-7 {

        grid-column: span 7;

    }

    .digages-mobile-span-8 {

        grid-column: span 8;

    }

    .digages-mobile-span-9 {

        grid-column: span 9;

    }

    .digages-mobile-span-10 {

        grid-column: span 10;

    }

    .digages-mobile-span-11 {

        grid-column: span 11;

    }

    .digages-mobile-span-12 {

        grid-column: span 12;

    }

    

}



/* Tablet */

@media (min-width: 600px) and (max-width: 899px) {

    .digages-container {

        grid-template-columns: repeat(12, 1fr); /* 2 columns */

    }

    .digages-tab-span-1 {

        grid-column: span 1;

    }

    .digages-tab-span-2 {

        grid-column: span 2;

    }

    .digages-tab-span-3 {

        grid-column: span 3;

    }

    .digages-tab-span-4 {

        grid-column: span 4;

    }

    .digages-tab-span-5 {

        grid-column: span 5;

    }

    .digages-tab-span-6 {

        grid-column: span 6;

    }

    .digages-tab-span-7 {

        grid-column: span 7;

    }

    .digages-tab-span-8 {

        grid-column: span 8;

    }

    .digages-tab-span-9 {

        grid-column: span 9;

    }

    .digages-tab-span-10 {

        grid-column: span 10;

    }

    .digages-tab-span-11 {

        grid-column: span 11;

    }

    .digages-tab-span-12 {

        grid-column: span 12;

    }

}



/* Desktop */

@media (min-width: 900px) {

    .digages-container {

        grid-template-columns: repeat(12, 1fr); /* 4 columns */

    }

    .digages-desktop-span-1 {

        grid-column: span 1;

    }

    .digages-desktop-span-2 {

        grid-column: span 2;

    }

    .digages-desktop-span-3 {

        grid-column: span 3;

    }

    .digages-desktop-span-4 {

        grid-column: span 4;

    }

    .digages-desktop-span-5 {

        grid-column: span 5;

    }

    .digages-desktop-span-6 {

        grid-column: span 6;

    }

    .digages-desktop-span-7 {

        grid-column: span 7;

    }

    .digages-desktop-span-8 {

        grid-column: span 8;

    }

    .digages-desktop-span-9 {

        grid-column: span 9;

    }

    .digages-desktop-span-10 {

        grid-column: span 10;

    }

    .digages-desktop-span-11 {

        grid-column: span 11;

    }

    .digages-desktop-span-12 {

        grid-column: span 12;

    }

}