@media (max-width: 1012px) {
    #main {
        margin: 0 5%;
    }

    .gallery {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
        gap: 10px;
        padding: 10px;
        max-width: 1200px;
        margin: auto;
    }

    .gallery img {
        width: 150px;
        height: auto;
        display: block;
        border-radius: 10px;
        box-shadow: 0 4px 8px rgba(62, 60, 60, 0.1);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        margin: auto;
    }

    .map {
        width: 85%;
    }
}

@media (max-width: 700px) {
    #logo-text {
        height: 40px;
    }

    .gallery {
        display: grid;
        grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
        gap: 10px;
        padding: 8px;
        max-width: 1200px;
        margin: auto;
    }

    .gallery img {
        width: 100px;
        height: auto;
        display: block;
        border-radius: 10px;
        box-shadow: 0 4px 8px rgba(62, 60, 60, 0.1);
        transition: transform 0.3s ease, box-shadow 0.3s ease;
        margin: auto;
    }
}

@media (max-width: 565px) {
    #title {
        display: none;
        padding-top: 10px;
        max-width: 75%;
        padding-left: 5%;
    }

    #logo-text {
        max-width: 100%;
    }

    header {
        height: auto;
    }

    #main-header {
        min-height: fit-content;
        display: flow-root;
        flex-direction: row;
    }

    #logo {
        width: 100%;
        height: auto;
        max-height: min-content;

        border-top-left-radius: 0;
        border-top-right-radius: 0;
        margin-right: 0;
        border-bottom-right-radius: 20px;
    }
}