@media screen and (max-width: 1260px) and (min-width: 768px) {
  .mobile-friendly {
    margin: 96px 0;
  }
  .mobile-friendly .button-switcher-container {
    margin: 48px auto 64px;
  }
  .mobile-friendly .device-switcher {
    display: flex;
    width: 216px;
  }
  .mobile-friendly .device-switcher span {
    width: 108px;
    font-size: 14px;
    line-height: 20px;
    padding: 14px 0;
  }
  .mobile-friendly .device-switcher:after {
    width: 108px;
  }
  .mobile-friendly .device-container {
    transition: width 0.2s;
    -webkit-transition: width 0.2s;
  }
  .mobile-friendly .device-container img {
    position: absolute;
    height: auto;
  }
  .mobile-friendly .device-container img.desktop {
    width: 728px;
  }
  .mobile-friendly .device-container img.mobile {
    width: 372px;
  }
  .mobile-friendly .device-container[data-device=mobile] {
    width: 372px;
  }
  .mobile-friendly .device-container[data-device=desktop] {
    width: 728px;
  }
  .mobile-friendly .device-container .device-container_header {
    padding: 9px 20px;
    font-size: 14px;
    line-height: 20px;
  }
  .mobile-friendly .device-container .device-container_header > div {
    gap: 8px;
  }
  .mobile-friendly .device-container .device-container_body {
    height: 320px;
  }
}
