@media only screen and (min-width: 320px) and (max-width: 400px) {
  html,
  body {
    height: 40rem !important;
  }
  .title {
    margin-top: 0.8rem !important;
    left: unset !important;
    height: 7rem !important;
  }
  .code_input_icon {
    margin-left: -20rem !important;
  }
  .code_box {
    margin-right: 3rem !important;
  }
  .markdown {
    width: 87% !important;
  }
  .content {
    width: 93% !important;
    left: 0.5rem !important;
    height: 91% !important;
  }
}
@media only screen and (max-width: 320px) {
  html {
    font-size: 10px !important;
  }
}
@media only screen and (min-width: 320px) {
  html {
    font-size: 12px !important;
  }
}
@media only screen and (min-width: 401px) and (max-width: 640px) {
  html {
    font-size: 15px !important;
  }
  .content {
    width: 93%;
  }
  .title {
    height: 6.8rem;
  }
  .code_box {
    margin-right: 2rem;
  }
  .markdown {
    width: 91%;
  }
}
@media only screen and (min-width: 640px) {
  html {
    font-size: 16px !important;
  }
}