@media only screen and (max-width: 900px) {
    .header {
        font-size:14px;
      /*padding-left: 3px;*/
      /*padding-right: 3px;*/
    }
    .tags-wrapper {
      width: 95vw;
      padding-left: 20px;
    }
    .card-content {
        flex-direction: column;
    }
    .breadcrumbs-wrap {
        display: block;
      width: 86vw;
    }
    .swiper {
        width: calc(100vw - 45px);
    }
    .card-content .card-aside__empty {
        display: none;
    }
    .card-main .card-image {
        width: calc(100vw - 40px);
    }
    .card-main .card-image img {
        height: 100%;
        width: auto;
    }
    .card-aside {
        width: calc(100vw - 20px);
        margin-top: 24px;
        padding: 0 0px 0 20px;
        margin-right:0;
    }
    .card-aside .card-list {
        flex-direction: row;
        flex-wrap: wrap;

    }
    .card-aside .card-list li {
        width: calc(50% - 8px);
    }

    .card-header .link {
        display: none;
    }
    .card-footer.is-mobile {
        display: flex;
    }
}

@media only screen and (max-width: 728px) {

    .footer-row__feedback {
        flex-direction: column;
    }
    .footer-row__feedback > div {
        width: 100%;
        padding-left: 0;
        padding-right: 0;
    }
    .footer-row__feedback .footer-center {
      border-left: none;
      border-right: none;
    }
    .main-nav {
        display: none !important;
    }
    .article-table .article-item {
        width: 100%;
    }
    .article-table {
        flex-direction: column;
    }
    .card-shared svg {
        width: 16px; height: 16px;
    }
    .card-shared {
        flex-direction: column;
    }

    .card-main .card-image {
        height: 200px;
      min-height: 227px;
    }
    .card-aside {
        overflow:hidden;
    }
    .card-aside .card-list {
        width: calc(100vw - 40px);
        flex-wrap: nowrap;
        overflow-x: scroll;
    }
    .card-aside .card-list li {
        width: 250px;
        flex-direction: column;
    }
    .card-aside .card-image img {
        width: 250px;
        max-width: 250px;
    }
    .card-aside .card-image {
        width: 250px;
    }
}

@media only screen and (max-width: 420px) {
  .card-main .card-image {
    min-height: 200px;
  }

  .card-main__common {
    flex-direction: column;
    gap: 8px;
  }

  .card-main .card-description {
    margin-top: 25px;
  }
}

/**  iPad **/
@media only screen and (max-width: 840px) {
    .navigation-wrapper .navigation-list,
    .navigation-wrapper .navigation-list li,
    .navigation-wrapper .navigation-list ul {
        width: 270px;
    }
    .navigation-wrapper a {
        font-size: 14px;
        line-height: 20px;
        padding: 10px 26px;
    }
}

@media only screen and (max-width: 600px) {
  /*.article-aside__tags a {*/
  /*  margin-right: -30px;*/
  /*}*/
  .select-options {
    max-width: 450px;
  }
  .select-options ul {
    columns: 2;
  }
  .section-filter {
      margin: 0 10px;
  }
  .section-common {
        margin: 0 10px;
    padding: 10px;
  }
    .tags-list {
        overflow: hidden;
        overflow-x: auto;
        flex-wrap: nowrap;
    }
    .swiper {
        height:100%;
    }
    .swiper-button-prev,
    .swiper-button-next {
        display: none !important;
    }
    .card-aside .card-image {
        width: calc(100vw - 80px);
    }
    .navigation-wrapper {
        width: 290px;
        height: calc(100vh - 64px);
        overflow:hidden;
        overflow-y: auto;
    }
    .navigation-wrapper .container {
        padding: 20px 0;
    }
    .navigation-wrapper a.active{
        position: sticky;
        top:0;
    }
    .navigation-wrapper .navigation-list,
    .navigation-wrapper .navigation-list li,
    .navigation-wrapper .navigation-list ul {
        width: 100%;
    }
    .navigation-wrapper .navigation-list ul {
        position: relative;
        left:0;
        top:0;
    }

    .header .navigation-list a.active {
        z-index: 9999;
    }
    .header .navigation-list a {
        padding: 16px 20px;
    }
    .header .navigation-list ul a {
        padding: 16px 40px;
    }
    .header .navigation-list ul ul a {
        padding: 16px 60px;
    }
    .main-form {
        position: fixed;
        top: 64px;
        left: 0;
        background: var(--primary);
        z-index: 9999;
    }
    .search-input {
        height: 40px;
    }
    .header-main .col:first-child {
        flex-direction: row-reverse;
    }
    .main-nav {
        display: none !important;
    }
    .header-nav .nav li .toggle {
        display: none;
    }
    .header-nav .nav li a {
        white-space: nowrap;
    }
    .header-nav.show .nav,
    .header-nav .nav {
        display: flex;
        flex-wrap: nowrap;
        overflow: auto;
    }
    /** ARTICLE LIST **/
    .article-aside,
    .article-item {
        flex-direction: column;
        align-items: flex-start;
    }
    .article-aside {
        gap:8px;
    }
    .article-item {
        padding: 32px 0;
    }
    .card-content ul.article-list {
      padding: 0px !important;
    }

    .article-list .article-image img {
        min-width: 100%;
        min-height: 100%;
    }
    .article-list .article-image {
        width: 100%;
        min-height: 200px;
    }
    .article-annotation .annotation {
        -webkit-line-clamp: 6;
        max-height: calc(18px * 6);
    }
    .login {
        display: none;
    }
    .header .login.is-mobile {
        display: flex;
    }
    /** FOOTER **/
    .footer .container {
        padding:0 20px;
    }
    .footer .navigation-list {
        columns: 1;
    }
    .footer .row.share .column:nth-child(2) {
        padding:20px 0;
        border:none;
        border-top: 1px solid rgba(255,255,255,.2);
        border-bottom: 1px solid rgba(255,255,255,.2);
    }
    .footer .row.share .column:nth-child(3) {
        padding: 20px 0;
    }
    .filter-box {
      display: block;
      width: 100%;

    }
    .filter-box .select-wrap {
      margin-bottom: 10px;
      width: 100%;
    }

  .select-val {
    text-align: center;
    width: 100%;
  }

  .filter-box .select-wrap .select-label {
    min-width: 225px;
  }

  .svg-icon-image {
    bottom: 15px;
  }
}

@media (max-width: 640px) {
  [class*="hide-640px"] {
    display: none !important;
  }
}

@media (max-width: 768px) {
  .main .container.wrap {
    padding: 0px;
  }
}
