.articles-section{
  padding:40px 0 37px;
  background-color:#FFFFFF; }
@media screen and (min-width: 768px){
    .articles-section{
      padding:60px 0 80px; } }
.articles-wrap{
  display:-webkit-box;
  display:flex;
  flex-wrap:wrap;
  margin:0 -10px 10px; }
@media screen and (min-width: 1024px){
    .articles-wrap{
      margin:0 -18px 10px; } }
.articles-wrap .article{
    width:100%;
    padding:0 10px;
    margin-bottom:20px; }
@media screen and (min-width: 768px){
      .articles-wrap .article{
        width:50%;
        margin-bottom:35px; } }
@media screen and (min-width: 1024px){
      .articles-wrap .article{
        width:33.33%;
        padding:0 18px; } }
@media screen and (min-width: 768px){
  .article{
    min-height:356px; } }
.article.not-img .article__name{
  margin-top:auto;
  line-height:1.1; }
@media screen and (min-width: 1024px){
    .article.not-img .article__name{
      font-size:32px !important; } }
.article:hover .article__wrap{
  box-shadow:0px 2px 15px #cccccc; }
.article__wrap{
  background:#F5F5F5;
  display:-webkit-box;
  display:flex;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
  flex-direction:column;
  height:100%;
  border-radius:10px;
  overflow:hidden;
  -webkit-transition:all 0.3s ease;
  transition:all 0.3s ease; }
.article__img{
  -webkit-box-flex:0;
  flex:none;
  height:160px;
  background-repeat:no-repeat;
  background-size:cover;
  background-position:center; }
@media screen and (min-width: 768px){
    .article__img{
      height:210px; } }
@media screen and (min-width: 1024px){
    .article__img{
      height:250px; } }
.article__img img{
    width:100%;
    height:100%;
    display:block; }
.article__info{
  padding:20px;
  height:100%;
  position:relative;
  display:-webkit-box;
  display:flex;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
  flex-direction:column; }
@media screen and (min-width: 768px){
    .article__info{
      padding:20px 30px; } }
.article__name{
  font-weight:700;
  font-size:18px !important;
  line-height:1.2;
  color:#332F2F;
  margin-bottom:30px;
  overflow:hidden;
  text-overflow:ellipsis;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical; }
@media screen and (min-width: 768px){
    .article__name{
      font-size:20px !important; } }
.article__descr{
  font-weight:300;
  font-size:16px;
  line-height:1.5;
  color:#332F2F; }
.article__date{
  font-weight:500;
  font-size:12px;
  color:#979797;
  padding-left:20px;
  position:relative;
  margin-top:auto;
  margin-left:auto; }
.article__date:before{
    content:"";
    position:absolute;
    width:14px;
    height:14px;
    background-image:url("../img/clock.svg");
    background-repeat:no-repeat;
    background-size:contain;
    background-position:center;
    top:50%;
    left:0;
    -webkit-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    transform:translateY(-50%); }





.article-section{
  padding:40px 0 0; }
@media screen and (min-width: 768px){
    .article-section{
      padding:80px 0 0; } }
.article-item{
  font-size:14px;
  line-height:1.6;
  color:#000000; }
@media screen and (min-width: 768px){
    .article-item{
      font-size:16px;
      line-height:1.5;
      font-weight:300; } }
.article-item .article{
    border-bottom:none; }
.article-item h1,
  .article-item h2{
    font-weight:700;
    font-size:24px;
    line-height:1.2;
    color:#332F2F;
    margin-bottom:30px; }
@media screen and (min-width: 768px){
      .article-item h1,
      .article-item h2{
        font-size:33px;
        margin-top: 50px;
        margin-bottom:25px; } }
@media screen and (min-width: 1024px){
      .article-item h1,
      .article-item h2{
        font-size:39px; } }
@media screen and (min-width: 1201px){
      .article-item h1,
      .article-item h2{
        font-size:45px;
        line-height:1.2em;
        margin-top: 60px;
        margin-bottom:30px; } }
.article-item__img{
  margin:0 -15px 40px;
  position: relative;
  height: 26vw;
  min-height: 250px;
  max-height: 400px;
  border-radius: 10px;
  overflow: hidden;
}
@media screen and (min-width: 1024px){
      .article-item__img{
        margin:0 -60px 80px; } }
@media screen and (min-width: 1024px){
      .article-item__img{
        margin-bottom:80px; } }
.article-item__img img{
  width:100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
}
@media screen and (min-width: 1024px){
    .article-item__content{
      display:-webkit-box;
      display:flex;
      -webkit-box-align:start;
      align-items:flex-start;
      -webkit-box-pack:justify;
      justify-content:space-between; } }
.article-item__content .article{
    display:none; }
@media screen and (min-width: 1024px){
      .article-item__content .article{
        display:block;
        -webkit-box-flex:0;
        flex:none;
        max-width:393px; } }
.article-item__wrap{
    width:100%; }
@media screen and (min-width: 1024px){
      .article-item__wrap{
        max-width:calc(100% - 460px); } }
.article-item__wrap .article{
      margin:0 auto 40px;
      display:block;
      max-width:400px;
      width:100%; }
@media screen and (min-width: 1024px){
        .article-item__wrap .article{
          display:none; } }
.article-item__text,
  .article-item p{
    font-size:14px;
    line-height:1.6;
    color:#000000;
    margin-bottom:25px; }
@media screen and (min-width: 768px){
      .article-item__text,
      .article-item p{
        font-size:16px;
        line-height:1.5;
        font-weight:300; } }
.article-item__title,
  .article-item h4{
    font-weight:700;
    font-size:18px;
    line-height:1.2;
    color:#332F2F;
    margin-top:20px;
    margin-bottom:20px; }
@media screen and (min-width: 768px){
      .article-item__title,
      .article-item h4{
        font-size:24px;
        line-height:1.25;
        margin-top:55px;
        margin-bottom:30px; } }
.article-item h3{
    font-weight:700;
    font-size:16px;
    line-height:1.2;
    color:#332F2F;
    margin-bottom:20px; }
@media screen and (min-width: 768px){
      .article-item h3{
        font-size:20px;
        line-height:1.25;
        margin-bottom:30px; } }
.article-item ul{
    margin-bottom:30px;
    padding-left:20px; }
.article-item ul li{
      font-size:14px;
      line-height:1.6;
      color:#000000;
      position:relative; }
.article-item ul li:before{
        content:'';
        position:absolute;
        top:8px;
        left:-14px;
        width:6px;
        height:6px;
        border-radius:50%;
        background-color:#000000; }
@media screen and (min-width: 768px){
          .article-item ul li:before{
            top:9px; } }
@media screen and (min-width: 768px){
        .article-item ul li{
          font-size:16px;
          line-height:1.5;
          font-weight:300; } }
.article-item ol{
    margin-bottom:30px;
    padding-left:20px;
    counter-reset:my-awesome-counter; }
.article-item ol li{
      font-size:14px;
      line-height:1.6;
      color:#000000;
      position:relative;
      counter-increment:my-awesome-counter; }
.article-item ol li:before{
        content:counter(my-awesome-counter) ". ";
        position:absolute;
        top:0;
        left:-18px;
        color:#000000;
        font-size:14px;
        line-height:1.6; }
@media screen and (min-width: 768px){
          .article-item ol li:before{
            font-size:16px;
            line-height:1.5;
            font-weight:300; } }
@media screen and (min-width: 768px){
        .article-item ol li{
          font-size:16px;
          line-height:1.5;
          font-weight:300; } }
.article-item a{
    font-size:14px;
    line-height:1.6;
    color:#93B6B7;
    margin-right:5px;
    border-bottom:1px solid #93B6B7;
    font-weight:400; }
@media screen and (min-width: 768px){
      .article-item a{
        font-size:16px;
        line-height:1.5; } }
.article-item a:hover{
      border-bottom:1px solid transparent; }
.list-section{
  padding:40px 0 58px; }
@media screen and (min-width: 768px){
    .list-section{
      padding:80px 0 89px;
    }
}

.list-section .articles-container{

}
@media screen and (min-width: 768px){
      .list-section .articles-container {

      }
}
.list-section .article {
    width:100%;
    padding:0 10px;
    margin-bottom:20px;
}
@media screen and (min-width: 768px){
      .list-section .article {

      }
}
@media screen and (min-width: 1024px){
      .list-section .article {

        height:400px;
      }
}
@media screen and (min-width: 1024px){
      .list-section .article .article__name{
        font-size:24px;
      }
}
@media screen and (min-width: 1024px){

}

        

/*блока промокода*/
.promo-action-block {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 44px 20px 18px;
}
@media screen and (max-width: 768px) {
    .promo-action-block {
        text-align: center;
    }
}
.promo-action-block .action__body,
.promo-action-block .action__discleimer {
    width: 100%;
    max-width: 805px;
}
.promo-action-block .action__body {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 20px;    
}
@media screen and (max-width: 1024px) {
    .promo-action-block .action__body {
        flex-direction: column;
        align-items: flex-start;
    }
}
@media screen and (max-width: 768px) {
    .promo-action-block .action__body {
        align-items: center;
    }
}
.promo-action-block .action__body > div {
    display: flex;
    align-items: center;
}
@media screen and (max-width: 1024px) {
    .promo-action-block .action__body > div {
        margin-bottom: 10px;
    }
}
@media screen and (max-width: 768px) {
    .promo-action-block .action__body > div {
        flex-direction: column;
    }
}
.promo-action-block .action__percent {
    font-weight: 700;
    font-size: 100px;
}
@media screen and (max-width: 1024px) {
    .promo-action-block .action__percent {
        font-size: 70px;
    }
}
.promo-action-block .action__info-block {
    margin-left: 47px;
}
@media screen and (max-width: 1024px) {
    .promo-action-block .action__info-block {
        margin-left: 25px;
    }
}
.promo-action-block .action__p {
    font-weight: 500;
    font-size: 18px;
    opacity: 0.6;
}
.promo-action-block .action__promocode {
    margin: 5px 0;
    font-size: 26px;
    font-weight: 700;
}
@media screen and (max-width: 1024px) {
    .promo-action-block .action__promocode {
        margin: 2px 0;
        font-size: 24px;
    }
}
.promo-action-block .action__discleimer {
    font-size: 14px;
    opacity: 0.5;
}
@media screen and (max-width: 768px) {
    .promo-action-block .action__discleimer {
        font-size: 12px;
    }
}
/*блока промокода*/

/*блока промокода на странице статей*/
.articles__header {    
    margin-bottom: 20px;
}
@media screen and (min-width: 769px) {
    .articles__header {
        display: flex;
        justify-content: space-between;
        align-items: center;
        margin-top: -80px;
    }
}
@media screen and (min-width: 769px) {
    .articles__header .main-title {
        margin-bottom: 0;
    }
}
.promo-action-block-articles {
    max-width: 1085px;
    background-color: #008289;
    color: white;
}
@media screen and (min-width: 769px) {
    .promo-action-block-articles {
        width: calc( 100% - 205px);
    }
}
/*блока промокода на странице статей*/
