#closeGalleryBtn {
    position: absolute;
    right: 0;
    cursor: pointer;
    top:-3%;
    padding: 11px;
    margin: -11px;
}

.gallery-section {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.gallery-container {
    display: flex;
    align-items: center;
    justify-content: center;
    padding-top: var(--section-inner-gap);
    width: min(calc(100% - var(--layout-gutter) - var(--layout-gutter)), var(--layout-max));
    margin-left: auto;
    margin-right: auto;
}

.gallery-modal {
    border: none !important;
    background-color: var(--main-bg-color-2);
    width: min(var(--layout-max), calc(100vw - var(--layout-gutter) - var(--layout-gutter)));
    max-height: 100dvh;
    padding-left: 80px;
    padding-right: 80px;
    padding-top: 120px;
    padding-bottom: 120px;
    outline: none;
    margin: 0 auto;
    overflow-y: auto;
}

.gallery-modal .modal-content {
    width: 100%;
}

.grid-container {
    display:grid;
    grid-template-columns: 2fr 1fr 1fr 2fr;
    grid-auto-rows: clamp(202px, 14.1vw, 270px) clamp(280px, 19.5vw, 374px) clamp(300px, 20.8vw, 400px);
    grid-gap:10px;
    grid-auto-flow: dense;
    width: 100%;
}

.gallery-item {
    width:100%;
    height:100%;
    position:relative;
}

.gallery-item .image {
    width:100%;
    height:100%;
    overflow:hidden;
}

.gallery-item .image img{
    max-width:100%;
    height:100%;
    object-fit: cover;
    object-position:50% 50%;
}

.gal-container:nth-child(7n+1) {
    grid-column: span 1;
    grid-row: span 2;
}

.gal-container:nth-child(7n+2) {
    grid-column: span 2;
    grid-row: span 1;
}

.gal-container:nth-child(7n+3) {
    grid-column: span 1;
    grid-row: span 2;
}

.gal-container:nth-child(7n+4) {
    grid-column: span 1;
    grid-row: span 1;
}

.gal-container:nth-child(7n+5) {
    grid-column: span 1;
    grid-row: span 1;
}

.gal-container:nth-child(7n+6) {
    grid-column: span 2;
    grid-row: span 1;
}

.gal-container:nth-child(7n+7) {
    grid-column: span 2;
    grid-row: span 1;
}

@media screen and (max-width:1200px){
    .gallery-modal {
        padding-left: 15px;
        padding-right: 15px;

        padding-top: 40px;
    }

    #closeGalleryBtn {
        right: 0;
        top: -33px;
    }

    .grid-container {
        display:grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: clamp(310px, 49vw, 410px) clamp(280px, 44vw, 370px);
        grid-gap:10px;
        grid-auto-flow: dense;
    }

    .gal-container:nth-child(7n+1) {
        grid-column: span 1;
        grid-row: span 1;
    }
    
    .gal-container:nth-child(7n+2) {
        grid-column: span 1;
        grid-row: span 1;
    }
    
    .gal-container:nth-child(7n+3) {
        grid-column: span 2;
        grid-row: span 1;
    }
}

@media screen and (max-width:670px){
    #closeGalleryBtn {
        right: 0;
        top: -25px;
    }
    
    .gallery-modal {
        padding: 30px;
    }

    .grid-container {
        display:grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        grid-auto-rows: 363px 221px;
        grid-gap:10px;
        grid-auto-flow: dense;
    }

    .gal-container:nth-child(7n+1) {
        grid-column: span 2;
        grid-row: span 1;
    }
    
    .gal-container:nth-child(7n+2) {
        grid-column: span 1;
        grid-row: span 1;
    }
    
    .gal-container:nth-child(7n+3) {
        grid-column: span 1;
        grid-row: span 1;
    }
}

.section-btn {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: 67px;
}

.gallery__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 20px;
}

/* #lightbox {
    position: fixed;
    z-index: 9000;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
  }
  
  #lightbox.active {
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 9000;
  }
  
  #lightbox img {
    max-width: 90%;
    max-height: 80%;
    padding: 4px;
    background-color: white;
    border: 2px solid white;
    z-index: 9000;
} */