/*@media screen and (orientation:landscape) and (min-device-width: 481px) and (max-device-width: 1024px){}*/


@media (max-width: 600px) {

  #title-assessment {
    font-size: 14px !important;
  }
  .pretest-back {
    width: fit-content;
  }
  .assessment-navbar {
    flex-direction: row-reverse;
    display: flex;
  }
  .timeOut {
    font-size: 12px;
  }

  .timer img {
    width: 16px;
  }

  #btn-submit-assessment {
    width: 100%;
    text-transform: uppercase;
  }

  .footer-navigation {
    padding: 0 16px;
  }

  .pretest-card {
    width: 100%;
  }
  #list-pretest {
    width: 100%;
    padding: 16px;
    margin-bottom: 48px;
  }
  .pretest-question p {
    margin-left: 16px;
  }
  .btn-assessment-modal a,
  .btn-assessment-modal button {
    text-transform: uppercase;
  }
  #pretest-content .text-instruction {
    height: auto;
    padding: 12px;
  }

  .timer-right {
    right: 8px;
    top: unset;
  }
  .posttest-back{
    /*position: absolute;*/
    /*top: unset !important;*/
    /*left: 8px !important;*/
  }
  .modal-score {
    padding: 0 16px;
  }
  .modal-score-top {
    background-size: contain;
  }
  .star-rank-wrap img {
    align-self: end;
  }

  .modal-topic-opening .warning-modal .left-text {
    gap: 8px;
    padding: 8px 16px;
  }
  .default-modal-card strong {
    font-size: inherit;
  }

  /*#page-arrange-sentence {*/
  /*  display: none;*/
  /*}*/
  #section-arrange-sentence .main-content-wrap {
    height: calc(100dvh - 128px) !important;
    position: relative;
    z-index: 0;
  }
  #section-complete-sentence .main-content-wrap {
    height: calc(100dvh - 128px) !important;
    position: relative;
    z-index: 0;
  }
  .arrange-sentence {
    max-width: 100vw;
    height: 100%;
  }
  .arrange-sentence .spelling-black-screen {
    min-width: 100vw;
  }

  .arrange-sentence .spelling-black-screen,
  .arrange-sentence .spelling-yellow-screen {
    height: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .arrange-sentence .spelling-line {
    gap: 2vw;
    min-height: 40px;
    flex-wrap: wrap;
  }
  .main-content-wrap {
    padding: 0;
  }
  .drag-arrange-sentence-box, .arrange-sentence .drag-spelling-box,
  .drop-arrange-sentence-box, .arrange-sentence .drop-spelling-box {
    min-height: 40px;
    min-width: 50px;
    border-radius: 8px;
    aspect-ratio: unset !important;
  }
  .drop-arrange-sentence-box, .arrange-sentence .drop-spelling-box {
    border: 3px #C2C2C2 dashed;
  }
  .drag-arrange-sentence-text, .arrange-sentence .drag-spelling-text {
    font-size: 16px;
    border-radius: inherit;
  }
  .glossaries-modal-wrap {
    padding: 0 !important;
    overflow: hidden;
  }
  .glossaries-modal-wrap h2 {
    background: #5898B8;
    color: #fff;
  }
  .glossaries-modal-wrap h2,
  .glossaries-modal-wrap p {
    font-size: 14px;
    padding: 8px 16px;
  }
  .glossaries-modal-wrap button {
    /*top: 0 !important;*/
    width: 32px !important;
    height: 32px !important;
  }

  .practice-question {
    padding: .5rem 40px !important;
  }

  .practice-question {
    font-size: 14px !important;
  }

  .quiz-practice .chat-text,
  .practice-options span {
    font-size: 14px !important;
    text-align: start !important;
  }

  .practice-options span {
    width: 80%;
  }
  .quiz-practice .select-option {
    min-width: 108px !important;
    padding: 4px !important; ;
  }
  .select-option:after {
    width: 16px !important;
    height: 16px !important;
  }
  .quiz-practice .select-option {
    padding-right: 21px !important;
  }
  .quiz-practice .image-question img {
    width: 100% !important;
  }
  .practice-options .text-chat-box {
    margin-bottom: 16px !important;
  }
  .phonics-topic-logo {
    width:  50px !important;
  }

  .audio-conversation-wrap {
    flex-direction: column;
    align-items: center;
    width: 90% !important;
    /*height: 80% !important;*/
    gap: 16px;
    font-size: 14px;
  }
  .audio-conversation-player {
    flex: 1;
    display: flex;
    flex-direction: column;
  }
  .conversation-text {
    flex: 1;
    font-size: 14px !important;
  }
  .conversation-text .scrollbar-dynamic {
    height: 30vh;
  }

  #section-flip-card .flipcard {
    align-items: baseline;
    /*align-items: center;*/
    justify-content: center;
  }
  .flip-card-wrap {
    flex-direction: column;
    /*max-height: 70vh;*/
    gap: 10px;
  }

  .flip-card-wrap,
  .flip-card-wrap .flip-card {
    max-width: 90vw;
  }

  .flip-card-front .image-name,
  .flip-listen-audio {
    font-size: 12px;
  }
  .flip-click {
    font-size: 14px;
  }
  .flip-click img {
    width: 20px;
  }

  .flip-card-front .audio-image-name {
    width: 24px;
    height: 24px;
  }

  .flip-card-front .audio-image-name {
    width: 12px;
    max-width:12px;
    height: auto;
  }

  .flip-card-image img {
    width: 20dvh;
  }

  .flip-card-image {
    min-height: unset;
    max-height: unset;
    /*padding: 16px;*/
    flex-direction: unset;
  }
  .flipcard .container {
    padding: 16px 0;
    height: unset !important;
  }
  .flip-text {
    max-height: 15dvh;
  }

  .sentence-text {
    font-size: 16px;
  }

  .story-title h2 {
    font-size: 14px !important;
    border-radius: unset !important;
    overflow: hidden;
  }
  .dialogue-wrap .story-title {
    border-radius: unset;
  }
  .quiz-complete-story .dialogue-drag,
  .quiz-complete-story .dialogue-wrap {
    width: 100%;
    height: 38dvh;
  }
  .quiz-complete-story .dialogue-wrap {
    height: calc(38dvh - 40px);
  }
  .quiz-complete-story p,
  .quiz-complete-story ul,
  .complete-story-text .drop-text-dialog:before,
  .complete-story .dragList:before {
    font-size: 12px;
  }
  .complete-story-text .drop-text-dialog {
    min-width: 60px;
    min-height: 30px;
    top: 10px;
  }
  .complete-story-text .drop-text-dialog:before {
    top: 20%;
    left: 40%;
  }
  .complete-story-text .scrollbar {
    max-height: calc(25dvh - 40px) !important;
  }
  .complete-story {
    max-height: 32dvh !important;
  }
  .quiz-complete-story .center-dialogue {
    gap: 24px;
    height: 100%;
    align-items: center;
    justify-content: center;
    margin: 0 auto;
  }

  .phonics-page-title {
    font-size: 14px;
  }

  .icon-glossaries {
    height: 24px !important;
  }

  .bg-leaderboard {
    height: 100dvh !important;
  }

  #list-glosaries-mobile .list-glossaries {
    width: 100%;
  }

  #section-complete-sentence .middle-wrap {
    height: 100%;
  }

  .practice-modal button {
    font-size: 16px;
    margin-top: 16px;
  }

  .badge-score img {
    width: unset;
  }

  .badge-score p {
    font-size: 18px;
  }

  .practice-modal .title-text,
  .practice-modal .desc-text {
    font-size: 14px;
  }

  .login-streak-container {
    width: calc(100% - 16px);
    max-height: 95dvh;
  }
  .login-streak-container.reward {
    padding: 16px;
  }

  .vocab-grammar-tabs {
    width: 100%;
  }
  .tab-content {
    border-radius: 0 0 24px 24px;
  }
}