h3 {
    font-family: "Gilroy";
    font-size: 4rem;
    line-height: 1;
    margin-top: 1rem;
    color: #1b1b1b;
}

.carre-bleue {
    height: 350px;
    width: 350px;
    background-color: #FFC700;
    transform: rotate(45deg);
}

.carre-bleue {
    left: -15%;
    top: -5%;
}

.clement-descri, .adrien-descri {
    height: 100vh;
}

.descri-respon {
    background-color: #F6F9FC;
}

.adrien-descri, .clement, .adrien {
    background-size: 100vh;
    background-repeat: no-repeat;
    background-position: center;
}

.adrien-descri {
    background-image: url("images/Background.jpg");
    background-size: 105vh;
}

.adrien-descri h3, .adrien-descri p {
    color: white;
}

.clement {
    background-image: url("images/fondateur.jpg");
}

footer nav {
    margin-top: 0;
}

@media screen and (max-width: 770px) {

    main {
        width: 76%;
    }

    .carre-bleue {
        z-index: 1;
    }

    section>.w-75 {
        z-index: 2;
    }

    .descri-respon {
        flex-direction: column;
    }

    .descri-respon .clement-descri, .descri-respon .adrien-descri{
        width: 100% !important;
    }

    .clement, .adrien {
        width: 100% !important;
    }
}

@media screen and (max-width: 470px) {

    section {
        flex-direction: column;
    }

    h3 {
        font-size: 3rem;
    }

    .w-50, .w-75 {
        width: 100% !important;
    }

    .carre-bleue {
        display: none;
    }

    .clement-descri, .adrien-descri {
        height: 100%;
        padding: 2rem 0;
    }

    .clement-descri>div, .adrien-descri>div {
        width: 76% !important;
    }

    .sec-respon {
        padding: 0 !important;
    }

    .sec-respon h3 {
        margin: 0rem !important;
    }
}