@media screen and (max-width: 1080px) {
    nav {padding: 2rem;}

        nav #closeMenu {
            top: 2rem;
            right: 2rem;
        }

    #frontpage .hero #next {grid-column: 2 / span 3;}

    #frontpage #news {padding: 2rem;}

        #frontpage #news #news-grid {
            gap: 2rem;
            margin-top: 2rem;
        }

    #gallery .hero {flex-direction: column-reverse;}

        #gallery .left {
            padding: 2rem;
            width: 100%;
        }

        #gallery .right {width: 100%;}

    #gallery #images,
    #gallery .images {padding: 2rem;}

    #gallery #inquire {padding: 2rem;}

    #events #content {padding: 7rem 2rem 2rem 2rem;}

    #news-n-statements #content {padding: 7rem 2rem 2rem 2rem;}

        #news-statements .flex {margin-top: 1rem;}

    #about #content {flex-direction: column-reverse;}

        #about #content .left,
        #about #content .right {
            padding: 2rem;
            width: 100%;
        }

    #contact #content {padding: 7rem 2rem 2rem 2rem;}

    #prices #content {padding: 7rem 2rem 2rem 2rem;}
}

@media screen and (max-width: 720px) {
    #frontpage #galleries .gallery-list {grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));}

    #about #content {flex-direction: column-reverse;}

    #about #content .text,
    #about #content .portrait {width: 100%;}

    #contact #content {flex-direction: column;}

        #contact #form,
        #contact #FAQ {width: 100%;}

    #news-n-statements .flex {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
}

@media screen and (max-width: 540px) {
    nav {
        padding: 1rem;
        width: 80%;
    }

        nav #closeMenu {
            top: 1rem;
            right: 1rem;
        }

    header {padding: 1rem;}

    footer {
        flex-direction: column;
        gap: 0.25rem;
    }

    #frontpage .hero {background-attachment: initial;}

        #frontpage .hero .text {padding: 0 1rem;}

        #frontpage .hero #next {display: none;}

    #frontpage #galleries a .label {display: none;}

    #gallery #images,
    #gallery .images {
        gap: 0.5rem;
        padding: 1rem;
    }

        #gallery #images,
        #gallery .images {
            grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
        }

    #gallery .left {padding: 2rem 1rem;}

    #gallery #inquire {padding: 2rem 1rem;}

    #events #content {padding: 5rem 1rem;}

    #news-n-statements #content {padding: 5rem 1rem 1rem 1rem;}

    #about #content .text,
    #about #content .portrait {padding: 0 1rem;}

    #contact #content {padding: 5rem 1rem;}

    #prices #content {padding: 5rem 1rem 1rem 1rem;}
}