/*Place your CSS code here*/
/* ============================================================
   Mobile SCORM viewer – responsive portrait (target 550 × 750)
   Scoped to SCORM/Tin Can content units only
   ============================================================ */
@media (max-width: 767px) {
  .ef-content-area-scorm #ef-scorm-content.ef-scorm-embed,
  .ef-content-area-scorm .ef-scorm-embed {
    /* Kill Bootstrap 4:3 box */
    height: auto !important;
    padding-bottom: 0 !important;

    /* Fit phone width; cap at the design width */
    width: 100%;
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;

    /* Portrait ratio 550:750 — scales down on narrower phones
       e.g. 375px wide → ~511px tall; 550px wide → 750px tall */
    aspect-ratio: 550 / 750;

    /* Prefer up to 750px, but don't overflow short viewports */
    max-height: min(750px, calc(100dvh - 140px));

    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }

  /* If max-height clips the aspect-ratio box, keep iframe filling the box */
  .ef-content-area-scorm #ef-scorm-content.ef-scorm-embed > iframe.embed-responsive-item,
  .ef-content-area-scorm .ef-scorm-embed > iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
  }
}

/* Optional: slightly larger phones / small tablets in portrait */
@media (min-width: 768px) and (max-width: 991px) {
  .ef-content-area-scorm #ef-scorm-content.ef-scorm-embed,
  .ef-content-area-scorm .ef-scorm-embed {
    height: auto !important;
    padding-bottom: 0 !important;
    width: 100%;
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
    aspect-ratio: 550 / 750;
    max-height: min(750px, calc(100dvh - 160px));
    overflow: auto;
    -webkit-overflow-scrolling: touch;
  }
}

/* DO NOT ADD/EDIT AFTER THIS LINE */
#ef-navbar, #ef-navbar li a.dropdown-toggle[aria-expanded="true"]{background-color:#812DC5;border-color:#812DC5;}
html.new-ui-html:root{--c-brand-primary:#812dc5;--c-brand-primary-darken-5:#7c28c0;--c-brand-primary-darken-7:#7a26be;--c-brand-primary-darken-10:#7723bb;--c-brand-primary-darken-15:#721eb6;--c-brand-primary-darken-17:#701cb4;--c-brand-primary-darken-20:#6d19b1;--c-brand-primary-darken-25:#6814ac;--c-brand-primary-lighten-7:#8834cc;--c-brand-primary-lighten-40:#a955ed;}