@media screen and (max-width: 1300px) {
  .app-content {
    width: auto;
  }
  .header {
    position: relative;
  }
  .header__angels {
    width: calc(100% - (-120px));
  }
  .main {
    width: 100%;
    min-width: auto;
  }
  .main-content {
    min-width: 0;
    width: auto;
  }
  .footer__crystals {
    width: calc(100% - (-31px));
  }
  .footer::before {
    width: calc(100% - (-30px));
  }
  .footer__crystals::before,
  .footer__crystals::after {
    width: 257px;
    position: relative;
  }
}

@media screen and (max-width: 1200px) {
  .header__nav{
    gap: 12px;
  }
  .server-status__total::after,
  .server-status__total::before {
    height: 55px;
  }

  .language-switcher-locale-session {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row;
    margin: 15px auto;
    text-align: center;
  }
  .language-switcher-locale-session li {
    flex: 0 0 calc(33.333% - 10px);
    margin-bottom: 10px;
    list-style: none;
  }

  .footer::before,
  .footer__crystals {
    display: none;
  }

  .main {
    flex-direction: column;
    align-items: stretch;
  }
  .sidebar:first-of-type {
    order: 3;
  }
  .main-content {
    order: 2;
  }
  .sidebar:last-of-type {
    order: 1;
  }

  .server-status__item {
    flex: 0 0 calc(25% - 10px);
  }

  .download_button {
    display: block;
    margin: 0 auto !important;
  }

  .footer__content {
    display: grid;
    grid-template-columns: 1fr auto;
    grid-template-rows: auto auto;
    grid-template-areas:
      "logo buttons"
      "text text";
    align-items: start;
    gap: 15px;
    width: 100%;
    max-width: 1110px;
    margin: 0 auto;
  }
  .footer__logo {
    grid-area: logo;
  }
  .footer__text {
    grid-area: text;
    font-size: 12px;
    text-align: center;
  }
  .footer__buttons {
    grid-area: buttons;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 10px;
  }
  .footer__borders {
    display: flex;
  }
  .footer__buttons-top{
    margin-top: 15px;
  }
  .main-content{
    position: relative;
  }
  .main-content__borders {
    display: flex;
    z-index: -9999;
  }
  .region-left-sidebar .frame{
    margin-top: 20px;
  }
  .region-right-sidebar  .server-status {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 5px;
      max-width: 625px;
      margin: 0 auto;
    }
    
  .region-right-sidebar  .server-status__item-name::before {
      content: "";
      display: inline-block;
      height: 25px;
      width: 25px;
      background-size: 25px;
    }
  .region-right-sidebar .servers-list__item-time{
    justify-content: center;
  }
  .region-right-sidebar .servers-list__item::before, .servers-list__item::after{
    height: 36px;
  }
  .region-right-sidebar .frame{
    margin-top: 20px;
  }
  .servers-list__item::before, .servers-list__item::after{
    height: 36px;
  }
  .servers-list__item-time {
    justify-content: center;
    font-size: 14px;
  }
  .servers-list__item-counter {
    justify-content: center;
    font-size: 14px
  }
  .bag_date{
    font-size: 14px;
  }
  .sidebar__time{
    padding: 20px 90px;
  }
  .sidebar__info-server{
    justify-content: center;
  }
  .server-status{
    max-width: 425px;
    margin: 0 auto;
  }
  .server-status__item-name::before{
    width: 25px;
    height: 25px;
    background-size: 25px;
  }
}

@media screen and (max-width: 998px) {
    #banner_card {
        position: relative;
        width: 100%;
        left: 0;
        margin-bottom: 80px;
        height: 187px;
    }
    
    .slider-indicators {
        position: absolute;
        bottom: -25px;
        left: 0;
        top: auto;
        width: auto;
        text-align: left;
        padding-left: 10px;
        z-index: 5;
    }
    
    .header__nav {
        gap: 7px;
    }
    
    .header__angels {
        width: calc(100% - (-80px));
    }
    
    .app-content {
        background: url(../assets/web_hedder.jpg) center top -37px, url(../assets/web_footer.jpg) center bottom -10px;
        padding: 0px 50px !important;
        background-repeat: no-repeat;
    }
    
    .banner-slide img {
        max-width: 100% !important;
        max-height: 100% !important;
    }
    
    .main {
        flex-direction: column;
    }
    
    .main-content {
        order: 1;
    }
    
    .sidebar {
        order: 2;
    }
}

@media screen and (max-width: 763px) {
  .header__nav {
    gap: 7px;
  }
  .app-content {
    background: url(../assets/web_hedder.jpg) center top -51px;
    margin: 0 auto;
    background-repeat: no-repeat;
    padding: unset !important;
  }
  .footer__borders,
  .header__angels,
  .sidebar__borders,
  .main-content__borders {
    display: none;
  }
  .header {
    margin: unset;
  }
  #banner_card {
    width: calc(100% - 40px);
    max-width: 550px;
    margin: 0px auto;
    aspect-ratio: 650 / 196;
    position: relative;
    box-shadow: none;
    border-radius: 0;
    margin-bottom: 70px;
  }
  #banner_card .banner-slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transition: opacity 1s ease;
  }
  #banner_card .banner-slide.active {
    opacity: 1;
  }
  .slider-indicators {
    display: flex;
    justify-content: center;
    margin-top: 10px;
  }
  .slider-indicators .slider-indicator {
    width: 40px;
    height: 5px;
    background: #ccc;
    margin: 0 5px;
    cursor: pointer;
    transition: background 0.3s ease;
  }
  .slider-indicators .slider-indicator.active {
    background: #ffb106;
  }
  .slider-indicators {
    position: absolute;
    bottom: -5px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0;
    z-index: 5;
  }
}

@media screen and (max-width: 768px) {
  .header__nav {
    display: none;
  }
  .mobile-menu-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    background: none;
    border: none;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    padding: 14px 0;
  }
  .mobile-menu-toggle .header__nav-divider {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url('/sites/all/themes/godswar/assets/menu-icon.svg') center no-repeat;
    background-size: contain;
    margin-right: 8px;
  }
  .mobile-menu-overlay {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    background: #12395d;
    z-index: 9999;
  }
  .mobile-menu-link {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: #fff;
    border-bottom: 1px solid #fff;
  }
  .mobile-menu-link:last-child {
    border-bottom: none;
  }
  .main {
    flex-direction: column;
  }
  
  .main-content {
    order: 1;
  }
  
  .sidebar:last-of-type {
    order: 2;
  }
  
  .sidebar:first-of-type {
    order: 3;
  }
}

@media screen and (max-width: 550px) {
  .region-right-sidebar .server-status {
    display: grid;
    grid-template-columns: repeat(1, 1fr);
    gap: 5px;
    max-width: 425px;
    margin: 0 auto;
    justify-items: center;
    align-items: center;
  }
  .language-switcher-locale-session li{
    margin-bottom: unset;
  }
  #banner_card{
    height: auto;
    margin-bottom: 70px;
  }
  .region-right-sidebar .servers-list__item-time{
    text-align: center;
  }
  .footer__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 15px;
  }
  .footer__logo {
    order: 1;
  }
  .footer__text {
    order: 2;
  }
  .footer__buttons {
    order: 3;
  }
  .p_class img{
    max-width: 100%;
  }
  .field-item.even table {
    display: block;
    overflow-x: auto;
    white-space: nowrap;
    max-width: 100%;
  }
  .slider-indicators {
    position: absolute;
    bottom: -20px;
    left: 0;
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 0;
    z-index: 5;
  }
}

@media screen and (max-width: 425px) {
  .main-content__article-title{
    margin: 20px 0 20px;
  }
  .language-block a{
    white-space: normal !important;
    word-break: break-word !important;
  }
}