.articles {
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.articles__upper {
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 40px;
}

.articles__title {
    margin: 0;
}

.article {
    width: 100%;
    border: 1px solid var(--light-border-color);
    background: var(--light-color);
    border-radius: var(--small-border-radius);
    padding: 15px;
    display: flex;
    flex-direction: column;
    gap: 20px;
    transition: all .3s ease;
}

.article:hover {
    border: 1px solid var(--primary-color);
}

.article__image {
    border-radius: var(--small-border-radius);
}

.article__title {
    font-size: 20px;
    font-weight: 600;
    line-height: 130%;
}

.article__button {
    width: 100%;
}

.content__container {
    padding:60px;
    border:1px solid #eee;
    background:#fff;
}

.content__container h2 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom:15px;
}

.content__container p {
    font-size: 16px;
    line-height:140%;
    color:#555;
}

.content__container h3 {
    font-size: 20px;
    font-weight: 600;
    margin-bottom:15px;
}

.content__container h4 {
    font-size: 18px;
    font-weight: 600;
    margin-bottom:15px;
}

.content__container ul,ol {
    display:flex;
    flex-direction:column;
    gap:10px;
}

.content__container li {
    font-size:16px;
    line-height:140%;
}

.content__container li strong {
    font-weight:600;
    color:var(--primary-color);
}

.content__container ul li {
    list-style:disc;
}

.content__container table {

	width: 100%;

	margin-bottom: 20px;

	border: 15px solid #eef9ff;

	border-top: 5px solid #eef9ff;

	border-collapse: collapse; 
	border-radius:5px;

}

.content__container table th {

	font-weight: bold;

	padding: 5px;

	background: #eef9ff;

	border: none;

	border-bottom: 5px solid #eef9ff;

}

.content__container table td {

	padding: 12px;

	border: none;

	border-bottom: 5px solid #eef9ff;

}


@media (max-width:500px) {
    .content-container {
        padding:20px;
    }
    .articles__upper {
        flex-direction: column;
        gap: 20px;
        align-items: flex-start;
    }
}