libarea/resources/views/default/scss/components/media.scss

/*
 * @media styles
 *
 * Медиа-запросы
 */


main { width: calc(100% - 390px); }
.col-two { width: calc(100% - 160px); }
.article { width: calc(100% - 320px); }
.menuno main { width: calc(100% - 230px); }
.menuno .col-two { width: 100%; }

@media (max-width: 1050px) {
  .home-img,
  img.thumb {
    width: 160px;
    height: auto;
  }

  iframe {
    max-width: 270px;
    max-height: 170px;
  }

  aside { width: 250px; }
}

@media (max-width: 890px) {
  aside { display: none; }
  main { width: 100%; }
  .menuno main { width: 100%; }
}

@media (max-width: 780px) {

  .menu__button { transition: 0.3s ease; }

  .menu__left {
    opacity: 0;
    visibility: hidden;
    transition-property: opacity, visibility;
    z-index: 98;
    left: 0;
    top: 0;
    bottom: 0;
    min-width: 180px;
    background-color: #eaecf0;
    box-shadow: 5px 0 5px -5px rgba(0, 0, 0, 0.25);
    overflow-x: hidden;
    position: absolute;
  }
  
  .menu__left.menu__active,
  .menu__left.menu-none.menu__active  {
    opacity: 1;
    visibility: visible;
    transition: 0.25s;
    position: fixed;
    display: block;
    margin-left: 10px;
  }
  
  .menu__left.menu__active ul.top-sm { top: 0; }
  .menu__left.menu__active .menu li { background-color: #fff; }  

  .mb-w100 { width: 100px; }
  .mb-ml10 { margin-left: 10px; }
  .mb-ml20 { margin-left: 20px; }
  .mb-mr5 { margin-right: 5px; }
  .mb-ml5 { margin-left: 5px; }
  .mb-mt5 { margin-top: 5px; }
  .mb-ml0 { margin-left: 0; }
  .mb-pl0 { padding-left: 0; }
  .mb-pr0 { padding-right: 0; }
  .mb-p10 { padding: 10px; }
  .mb-text-xl { font-size: 1.25rem; }
  .mb-inline { display: inline; }
  .mb-block { display: block; }
  .logo { font-size: 18px; }

  .wrap {
    padding-left: 0.25rem;
    padding-right: 0.25rem;
  }

  .mb-w-100,
  main.col-two { width: 100%; }

  .mb-none { display: none; }
  ul.setting > li > a > i { display: none; }
  .home-img { width: 100%; }

  .flex-auto {
    flex-wrap: wrap;
    flex: 1 1 auto;
  }
}