.mainArticle {
    width: 1200px;
    margin: 30px auto;
}

.headerArticle h1 {
    width: fit-content;
    font-size: 2em;
    font-weight: 500;
    padding-bottom: 5px;
    border-bottom: 2px solid #E51C49;
    color: #2862AC;
}

.headerArticle div {
    display: flex;
    gap: 20px;
}

.headerArticle p {
    font-size: 1.4em;
}

.figureArticle {
    width: 600px;
    margin-top: 20px;
    margin-bottom: 20px;
}

.figureArticle img {
    width: 600px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
}

.figureArticle figcaption {
    font-size: 1.2em;
    border-bottom: 1px solid lightgray;
    padding: 2px;
    font-style: italic;
}

.sectionArticleIntro {
    background-color: rgba(234, 243, 254, .6);
    padding: 15px;
    -webkit-border-radius: 10px;
    border-radius: 10px;
    margin-top: 25px;
}

.sectionArticle {
    margin-top: 25px;
}
.sectionArticle h2 {
    font-size: 1.8em;
    margin-bottom: 5px;
}
.sectionArticle p, .sectionArticleIntro p {
    font-size: 1.7em;
}
.sectionArticle ul {
    font-size: 1.7em;
    list-style-position: inside;
    list-style-type: square;
}
.sectionArticle ul li {
    padding-left: 20px;
}
.sectionArticle p a, .sectionArticleIntro p a {
    color: #2862AC;
    text-decoration: none;
    border-bottom: 1px dashed #2862AC;
}
.sectionArticle p a:hover {
    border-bottom: 1px solid #2862AC;
}

@media screen and (max-width: 600px) {
    .mainArticle { width: 100%; padding: 0 20px; }
    .headerArticle div { justify-content: space-between; }
    .figureArticle { width: 100%; }
    .figureArticle img { width: 100%; }
}