/* Responsive fixes for the legacy JA Purity layout. */
html,
body {
  max-width: 100%;
  overflow-x: hidden;
}

img,
video,
iframe,
object,
embed {
  max-width: 100%;
  height: auto;
}

.article-content,
.contentheading,
#ja-content {
  overflow-wrap: anywhere;
  word-break: normal;
}

@media (max-width: 800px) {
  html {
    -webkit-text-size-adjust: 100%;
  }

  body {
    margin: 0;
    font-size: 16px;
    line-height: 1.55;
  }

  #ja-wrapper,
  #ja-header,
  #ja-mainnav,
  #ja-container,
  #ja-botsl,
  #ja-footer {
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }

  #ja-container2 {
    padding: 14px 0;
  }

  #ja-mainbody,
  #ja-mainbody-fl,
  #ja-mainbody-fr,
  #ja-contentwrap,
  #ja-mainbody #ja-contentwrap,
  #ja-mainbody-fl #ja-contentwrap,
  #ja-mainbody-fr #ja-contentwrap,
  #ja-col1,
  #ja-col2,
  #ja-mainbody-fr #ja-col1 {
    box-sizing: border-box;
    float: none !important;
    width: 100% !important;
    max-width: 100% !important;
  }

  #ja-content,
  #ja-mainbody-fl #ja-content,
  #ja-mainbody-f #ja-content {
    box-sizing: border-box;
    padding: 0 16px !important;
  }

  #ja-col1,
  #ja-col2 {
    padding: 16px;
  }

  #ja-headerwrap,
  #ja-header {
    height: 80px;
  }

  h1.logo-text {
    font-size: 115%;
  }

  h1.logo-text a {
    left: 12px;
    right: 86px;
    bottom: 38px;
    white-space: normal;
  }

  p.site-slogan {
    left: 8px;
    bottom: 14px;
  }

  .ja-usertools-font {
    right: 8px !important;
  }

  #ja-mainnavwrap {
    max-width: 100%;
    overflow: hidden;
  }

  #ja-mainnav {
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }

  #ja-mainnav > ul,
  #ja-mainnav ul.menu {
    display: flex;
    float: none;
    width: max-content;
    min-width: 100%;
    padding-left: 0;
    border: 0;
  }

  #ja-mainnav > ul > li,
  #ja-mainnav ul.menu li {
    float: none;
    flex: 0 0 auto;
  }

  #ja-mainnav a {
    padding: 10px 12px;
    white-space: nowrap;
  }

  #ja-mainnav > div[id^="yandex_rtb"] {
    clear: both;
    max-width: 100%;
    overflow: hidden;
  }

  h1 {
    font-size: 1.65rem;
  }

  h2,
  .contentheading {
    font-size: 1.35rem;
    line-height: 1.3;
  }

  h3 {
    font-size: 1.15rem;
  }

  table {
    max-width: 100% !important;
  }

  .article-content table:not(.contentpaneopen),
  .contenttoc {
    display: block;
    width: 100% !important;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  input,
  select,
  textarea {
    box-sizing: border-box;
    max-width: 100%;
  }

  .site-global-footer__inner {
    width: calc(100% - 24px) !important;
  }
}

@media (max-width: 420px) {
  #ja-content {
    padding: 0 12px !important;
  }

  .ja-usertools-font {
    display: none;
  }

  h1.logo-text a {
    right: 12px;
  }
}