/**
Style du portfolio
*/


.containerPortfolio {
    max-width: 1000px;
    padding: 5px;
    width: 100%;
    margin: 2rem auto;
}

.gallery {
    display: grid;
    grid-gap: 1.5rem;
}

.gallery__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius:10px;
}

.gallery__item--1 {
    grid-column-start: 1;
    grid-column-end: 3;
    grid-row-start: 1;
    grid-row-end: 3;
}

.gallery__item--2 {
    grid-column-start: 3;
    grid-column-end: 5;
    grid-row-start: 1;
    grid-row-end: 3;
}

.gallery__item--3 {
    grid-column-start: 5;
    grid-column-end: 9;
    grid-row-start: 1;
    grid-row-end: 8;
}

.gallery__item--4 {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 3;
    grid-row-end: 6;
}

.gallery__item--5 {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 6;
    grid-row-end: 9;
}

.gallery__item--6 {
    grid-column-start: 5;
    grid-column-end: 9;
    grid-row-start: 8;
    grid-row-end: 12;
}

.gallery__item--7 {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 9;
    grid-row-end: 12;
}

.gallery__item--8 {
    grid-column-start: 1;
    grid-column-end: 4;
    grid-row-start: 12;
    grid-row-end: 12;
}

.gallery__item--9 {
    grid-column-start: 4;
    grid-column-end: 6;
    grid-row-start: 12;
    grid-row-end: 12;
}

.gallery__item--10 {
    grid-column-start: 6;
    grid-column-end: 9;
    grid-row-start: 12;
    grid-row-end: 12;
}

.gallery__item--11 {
    grid-column-start: 1;
    grid-column-end: 5;
    grid-row-start: 13;
    grid-row-end: 13;
}

.gallery__item--12 {
    grid-column-start: 5;
    grid-column-end: 9;
    grid-row-start: 13;
    grid-row-end: 13;
}

.gallery__item--13 {
    grid-column-start: 1;
    grid-column-end: 9;
    grid-row-start: 14;
    grid-row-end: 14;
}

.gallery__item--14 {
    grid-column-start: 1;
    grid-column-end: 9;
    grid-row-start: 15;
    grid-row-end: 15;
}

@media (min-width: 550px) {
    .navbar {
        all: unset;
        display: block;
    }
    .navbar ul {
        flex-direction: row;
        gap: 80px;

    }
    .navbar ul a {
        font-size: inherit;
    }
    .close-nav,
    .menu-bar {
        display: none;
    }

    .main-banner {
        top : 1em;
        min-height: 30px;
        border-radius: 23px;
    }

    .main-banner h6 {
        font-size: 20px; /* Ajustez la taille de la police */
        margin-bottom: 15px;
    }
    .main-banner h4 {
        font-size: 30px; /* Ajustez la taille de la police */
        margin-bottom: 15px;
    }
    .main-banner h4 em {
        font-size: 18px; /* Ajustez la taille de la police */
    }
    .container3 {
        display: -webkit-box;
        align-items: center;
    }
}

@media (max-width: 550px) {
    .main-banner {
        padding: 0 ;
    }
    .main-banner .p {
        position: center;
        left: 15px;
    }

    .presentation{
        margin-left: 18px;
        word-wrap: break-word; /* Permet au texte de continuer à la ligne s'il est trop long */

    }
    .header-text {
        text-align: justify-all;
    }
    .heading-section h4{
        font-size: 20px;
        word-wrap: break-word; /* Permet au texte de continuer à la ligne s'il est trop long */

    }
    .item h4{
        font-size: 10px;
    }

    .main-button a {
        padding: 12px 21px;
        font-size: 8px;
    }
    .container3 {
        display: -webkit-box;
        align-items: center;
        object-fit: cover;
        margin-left: -22px;

    }
    .containerPortfolio {
        max-width: 1000px;
        padding: 5px;
        width: 100%;
        margin: 2rem auto;
    }
}

@media (max-height: 700px) {

    .text {
        margin-left: 20px; /* Espace entre l'image et le texte */
    }

}
