.page-title {
color:#003341;
font-weight: bold;
}

.article-title {
    font-size: 2em;
    font-weight: bold;
}

.article-one-image {
    display: flex;
    justify-content: end;
    gap: 2em;
    align-items: center;
    background-color: #003341;
    color: white;
    margin-top: 2em;
    
}

.title-and-text {
    max-width: 50%;
padding-left: 2em;
padding-right: 2em;
}

.article-title {}

.article-paragraph {
    margin-top: 2em;
    font-size: 1.3em;
    line-height: 150%;
    margin-bottom: 1em;
}

.single-img-article {
    height: 90vh;
}

.link-button {
    font-size: 1.3em;
    color: white;
    border: #057d9e solid;
    background-color: #057d9e;
    border-radius: 1em;
    padding-top: 0.1em;
    padding-bottom: 0.3em;
    padding-left: 0.3em;
    padding-right: 0.3em;
}

.button-three-img {
display: flex;
justify-content: center;
margin-left: 2em;
margin-right: 2em;
margin-top: 1em;
}

.link-button:hover {
    color: #057d9e;
    background-color: white;
}

.trois-img-box {
    display: flex;
    gap: 2em;
    justify-content: center;
    margin-top: 2em;
}

.trois-img-img {
  height: 40vh;
   width: auto;
}

.article-trois-image {
    margin-top: 4em;
    
}

.article-one-image-title {
    text-align: center;
    color: #003341;
}

.article-trois-img-ul {
    line-height: 150%;
    font-size: 1.3em;
    margin-left: 2em;
    margin-right: 2em;
    margin-top: 1em;
}

.article-trois-img-li {
    margin-top: 0.5em;
}

strong {
    font-weight: bold;
    color: #003341;
}

.article-deux-image {
    margin-top: 4em;

}

.deux-img-img {
    width: 30em;
}

.deux-img-box {
    display: flex;
    gap: 2em;
    justify-content: center;
    margin-top: 2em;
}

.article-deux-img-paragraph {
    line-height: 150%;
    font-size: 1.3em;
    margin-left: 2em;
    margin-right: 2em;
    margin-top: 1em;
}

.nsp-img-box {
    display: flex;
    flex-wrap: wrap;
    gap: 1em;
    margin-top: 3em;
    justify-content: center;

}

.nsp-img {
    max-height: 20em;
}

@media screen and (max-width: 767px) {
    .article-one-image {
        display: flex;
        flex-direction: column;
        padding-top: 2em;
    }

    img {
        margin: auto;
    }

    .title-and-text {
        max-width: 100%;
    padding-left: 2em;
    padding-right: 2em;
    }

    .single-img-article {
        max-width: 100vw;
        height: auto;
    }

    .trois-img-box {
        display: flex;
        flex-direction: column;
        gap: 0;
    }
    .trois-img-img {
        max-width: 100vw;
        height: auto;
    }

    .deux-img-img {
        max-width: 100vw;
        height: auto;
    }

    .deux-img-box {
        display: flex;
        flex-direction: column;
        gap: 0; 
    }

    .nsp-img {
        max-width: 100vw;
        height: auto;  
    }
}