/*Mise en page de la page d'information*/

.ruban{
    color: rgb(255, 253, 253);
    background: linear-gradient(to right, #000428, #004e92);
    padding-left: 40px;
    padding-top: 80px;
    padding-bottom: 80px;
}

.presentation{
    color: #000428;
    font-style: italic;
    padding-right: 200px;
    text-align: justify;
}
.objectives{
    display: flex;
    flex-direction: row;
    align-items:center;
    margin: auto;
}

.objectives div{
    margin-right: 80px;
    text-align: justify;
}

/* Adaptation aux écrans laptop  */

@media only screen and (min-width:996px) and (max-width: 1599px) {
    .presentation{
        color: #000428;
        font-style: italic;
        padding-right: 150px;
        text-align: justify;
    }
    .ruban h2{
        font-size:1.5em
    }
    .objectives div{
        margin-right: 40px;
        text-align: justify;
    }
}

/* Adaptation aux écrans mobiles  */

@media only screen and (max-width:996px) {
    .ruban{
        padding-left: 10px;
        padding-top: 30px;
        padding-bottom: 30px;
    }
    .ruban h2{
        font-size:1em;
    }
    .presentation{
        padding-right: 20px;
    }

    .objectives{
        display: flex;
        flex-direction: column;
        align-items:center;
        margin: auto;
    }

    .objectives div{
        margin-right: 5px;
        text-align: justify;
    }
    .legend{
        font-size:0.6em;
        text-align:center;
    }

}