@media screen and (min-height: 1080px) {
  #borders-dashed {
    min-height: 1080px;
  }
}
@media screen and (max-height: 870px) {
  body main section.index {
    padding-top: 5vh;
  }
}
@media screen and (max-height: 800px) {
  body main section.index {
    padding: 0;
  }
}
@media screen and (max-height: 600px) {
  body main section.page_error {
    padding-top: 10vh;
  }
}
@media screen and (max-height: 470px) {
  body main section.page_error {
    padding-top: 0;
  }
}
@media screen and (max-height: 900px) {
  body main section.feedback {
    padding-top: 5vh;
  }
}
@media screen and (max-height: 800px) {
  body main section.feedback {
    padding: 20px 0;
  }
}
@media screen and (max-height: 600px) {
  body main section.page_error {
    padding-bottom: 30px;
  }
  body main section.page_error .wrapper {
    margin: auto 0;
  }
  body main section.page_error .wrapper .page_error_message {
    position: unset;
    transform: unset;
  }
}
@media screen and (max-width: 900px) {
  body header {
    height: unset;
  }
  body header .wrapper {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: 'pos1 pos2' 'pos3 pos3';
  }
  body header .wrapper .logo {
    grid-area: pos1;
  }
  body header .wrapper .links {
    grid-area: pos2;
  }
  body header .wrapper .switcher {
    grid-area: pos3;
    padding-bottom: 15px;
  }
  body .agreements .wrapper .inline_grid {
    display: grid;
    grid-template-columns: auto;
  }
  body .agreements .wrapper .inline_grid .text p {
    text-align: justify;
  }
  body .agreements .wrapper .inline_grid .btn {
    margin: auto;
  }
  body .agreements .wrapper .inline_grid .btn input[type=button] {
    width: unset;
  }
}
@media screen and (max-width: 770px) {
  body main section.index .wrapper h1.h1-page-title {
    font-size: 50px;
  }
  body main section.index .wrapper h2.h2-method-desc {
    font-size: 26px;
  }
}
@media screen and (max-width: 700px) {
  body main section.index .wrapper h1.h1-page-title {
    font-size: 45px;
  }
  body main section.index .wrapper h2.h2-method-desc {
    font-size: 24px;
  }
}
@media screen and (max-width: 600px) {
  body #ascii-share-dialog {
    width: 350px;
  }
  body #ascii-share-dialog h3 {
    max-width: 220px;
  }
}
@media screen and (max-width: 550px) {
  body main section.index .wrapper .ascii-image-output .options_container .options_grid {
    grid-column-gap: unset;
  }
  body main section.about .wrapper,
  body main section.policy_cookie .wrapper,
  body main section.policy_privacy .wrapper {
    background-color: white;
    border: 2px dashed #242424;
    border-right: 0;
    border-left: 0;
  }
  body main section.about .wrapper .text-window,
  body main section.policy_cookie .wrapper .text-window,
  body main section.policy_privacy .wrapper .text-window {
    padding: 20px 0;
    border-radius: 0;
    border: 0;
  }
  body main section.feedback {
    padding: 20px 0;
  }
  body main section.feedback .wrapper {
    background-color: white;
    border: 2px dashed #242424;
    border-right: 0;
    border-left: 0;
  }
  body main section.feedback .wrapper form.feedback-form {
    padding: 20px 0;
    border-radius: 0;
    border: 0;
  }
}
@media screen and (max-width: 550px) {
  body #borders-dashed .header_and_main_together header .mobile-menu-btn {
    display: unset;
  }
  body #borders-dashed .header_and_main_together header .mobile-menu {
    display: flex;
  }
  body #borders-dashed .header_and_main_together header .wrapper {
    grid-template-columns: unset;
    grid-template-areas: 'a' 'b';
    grid-template-rows: repeat(2, auto);
  }
  body #borders-dashed .header_and_main_together header .wrapper .logo {
    grid-area: a;
    margin: 9px auto;
  }
  body #borders-dashed .header_and_main_together header .wrapper .logo a {
    display: block;
    font-size: 8vw;
  }
  body #borders-dashed .header_and_main_together header .wrapper .links {
    display: none;
  }
  body #borders-dashed .header_and_main_together header .wrapper .switcher {
    width: 100%;
    grid-area: b;
    padding: 10px 0;
  }
  body #borders-dashed .header_and_main_together main section.index .wrapper h1.h1-page-title {
    display: none;
  }
  body #borders-dashed .header_and_main_together main section.index .wrapper h2.h2-method-desc {
    font-size: 22px;
    padding-top: 15px;
  }
  body #borders-dashed .header_and_main_together main section.index .wrapper .ascii-image-output .options_container .options_grid {
    grid-template-columns: repeat(3, auto);
    grid-column-gap: 15px;
  }
  body #borders-dashed .header_and_main_together main section.feedback .wrapper form.feedback-form {
    min-width: unset;
  }
  body #borders-dashed .header_and_main_together main section.feedback .wrapper form.feedback-form textarea,
  body #borders-dashed .header_and_main_together main section.feedback .wrapper form.feedback-form input[type=email] {
    width: 100%;
    max-width: unset;
    text-align: left;
  }
  body #borders-dashed .header_and_main_together main section.feedback .wrapper form.feedback-form .feedback-agreement #id_agreement {
    left: 0;
    transform: translateX(29px);
  }
  body #borders-dashed .header_and_main_together main section.feedback .wrapper form.feedback-form .feedback-agreement #id_agreement + label {
    max-width: unset;
  }
  body #borders-dashed footer {
    height: unset;
    padding-bottom: 21px;
  }
  body #borders-dashed footer .wrapper {
    grid-template-columns: repeat(2, 1fr);
    grid-template-areas: 'a b';
  }
  body #borders-dashed footer .wrapper .policy {
    display: none;
  }
  body #borders-dashed footer .wrapper .GitHub {
    text-align: left;
    grid-area: a;
    margin: auto 0;
  }
  body #borders-dashed footer .wrapper .language-switcher {
    grid-area: b;
  }
}
@media screen and (max-width: 450px) {
  body #ascii-share-dialog {
    width: 300px;
  }
  body #ascii-share-dialog h3 {
    max-width: 170px;
  }
}
@media screen and (max-width: 400px) {
  body .wrapper .switcher {
    display: inline-flex;
    justify-content: space-between;
    grid-column-gap: 10px;
  }
}