
.page h2{ margin-bottom: 20px; padding-top: 20px; margin-top: 30px;}

.page ._col-first h2:before{ content: ""; display: block; height: 3px; background: #e6cdc3; width: 150px; position: absolute; top: 0; left: 0; }

.page .margin-10{ margin-top: -30px}

.article-content p a{ color: #087983 !important;}
.article img{width: 100% !important; height:auto !important; max-width:100%; box-sizing: border-box;  box-shadow: 0px 40px 15px -30px rgba(0, 0, 0, 0.2);
    display: block; border-radius: 15px;     border: 1px solid #a4b6b7; margin: 0 0 30px 0}
.article .__section-item{ padding: 0;}
.article .__section-item:first-child{ padding-top: 30px;}
.article-content h2{ margin: 15px 0 10px; padding: 0}
.article-content h3{    font-size: 1.2em;font-weight: 500;margin: 5px 0;}
.article-content { margin-bottom: 30px;}
.article-content table{ border-collapse: collapse; font-size: .9em; line-height: 1.3 }
.article-content table th{font-weight: bold; text-align: center}
.article-content table th, .article-content table td{ padding: 5px; border: 1px solid #adadad ; }
.article-content table th p:last-child, .article-content table td p:last-child{ padding-bottom: 0}

.article-footer{margin: 20px 0; padding-top: 15px; border-top: 1px solid #eee; display: flex; justify-content: space-between;}
.article-footer > div{ flex-basis: 50%}
.back-link{ }
.article-avtor{ text-align: right; font-size: 13px; opacity: .7; font-style: italic; line-height: 1.3em}

.article .image{ margin: 10px 0;}
.article .images-wrap{ margin-bottom: 15px;}
.article .images-wrap p{ font-style: italic; font-size: 13px; text-align: center; opacity: .8}

.article .images{ display: flex; flex-direction: column; margin-top:10px; margin-bottom: 10px; }
.article .images.row{flex-direction: row; overflow: auto}
.article .images.row img{ max-width: 240px; margin: 0}
.article .images.row-3{ margin-right: -15px; }

.article .images.row-1 img{  width: 100% !important;}

.article-content .notice:after{ content:""; display: block; clear: both}
.article-content .notice img{ max-width: 220px; margin: auto}

.article-content .notice{ margin: 10px 0; border: 1px solid #bda292; padding: 15px;     background: #FAF5F2;
    border-radius: 10px;}
.article-content .notice h4{ font-weight: 700; font-size: 1.2rem; margin-bottom: 10px;}


.article figure{margin-bottom: 30px}
.article figure img{margin: 0}
.article figure figcaption{ font-style: italic; font-size: .9em; text-align: center; padding: 10px 20px 0; opacity: .7; line-height: 1.2}


@media only screen and (min-width: 480px) {

    .article .images.row-3{ margin-left:-5px; margin-right: -5px;  overflow: hidden}
    .article .images.row-3 img{ width: calc(33.33% - 10px) !important; margin: 5px}

}

@media only screen and (min-width: 768px) {

    .article  .__section-item {max-width: 600px;}
    .page.article .__grids ._col-last ._grid-item {padding-left: 0px;}

    .article img{max-height: 460px;  object-fit: cover;}

    .article .image img{  width: auto !important; margin: auto;  object-fit: unset;}
    .article .images.row img{ max-width:none; margin: 0}

    .article .images.row-1 img{max-height: unset;    object-fit: unset; margin: auto;  max-width: 600px; }

    .article .images.row-3{ margin-left:-10px; margin-right: -10px;}
    .article .images.row-3 img{ width: calc(33.33% - 10px) !important; margin: 10px}

    .article-content{ max-width: 900px; margin: auto; margin-bottom: 30px; }

    .article-content table{  font-size: 1em;  line-height: inherit}

    .article-content .notice{  padding: 25px;}
    .article-content .notice img{ float: right; margin-left: 20px;  }

}

@media only screen and (min-width: 1024px) {

    .article  .__section-item {max-width: 1170px}
    .article-anons{    display: flex;flex-direction: column;align-items: center;height: 100%;justify-content: center;}

    .title-anons{ font-size: 1.1em; line-height: 1.6em}
    .page.article .__grids ._col-last ._grid-item {padding-left: 20px;}

    .article .images{ flex-direction: row;justify-content: space-between;    }
    .article .images > img{ width: calc(50% - 15px) !important;}

    .article .images figure img{width: 100%; margin: 0}
    .article .images figure{width: calc(50% - 15px)}

    .article .images.row-3{ gap:unset; }
    .article .images.row-3 img{ width: calc(33.33% - 10px) !important; margin: 10px}

    .article-content .notice{ margin: 15px -25px;}

}
