/* =========================================
   LARGE DESKTOP
========================================= */

@media (max-width: 1400px) {

}



/* =========================================
   DESKTOP
========================================= */

@media (max-width: 1200px) {

    .page-layout {
        grid-template-columns: 1fr 260px;
        gap: 30px;
    }

}



/* =========================================
   TABLET LANDSCAPE
========================================= */

@media (max-width: 1024px) {

    .page-layout {
        grid-template-columns: 1fr;
    }

}



/* =========================================
   TABLET
========================================= */

@media (max-width: 768px) {

    body {
        font-size: 16px;
    }

    section {
        margin-top: 40px;
    }

}



/* =========================================
   MOBILE LARGE
========================================= */

@media (max-width: 640px) {

    h1 {
        font-size: 32px;
    }

    h2 {
        font-size: 24px;
    }

}



/* =========================================
   MOBILE
========================================= */

@media (max-width: 480px) {

    body {
        font-size: 15px;
    }

    h1 {
        font-size: 28px;
    }

    h2 {
        font-size: 22px;
    }

}



/* =========================================
   MOBILE SMALL
========================================= */

@media (max-width: 360px) {

    body {
        font-size: 14px;
    }

}