/* Display the supplied artwork in its original proportions. The viewport only
   exposes the banner (x=0, y=267, width=589, height=337) from each reference;
   browser chrome and the photographed form remain outside this clipped area. */
@media (max-width: 768px) {
  html body .usbahis-auth .auth-mobile-hero {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 589 / 337 !important;
    overflow: hidden !important;
    background-color: #05080f !important;
    background-repeat: no-repeat !important;
    background-size: 100% auto !important;
    background-position: center -45.33106961vw !important;
  }
  html body .usbahis-auth .login .auth-mobile-hero {
    background-image: url('/assets/usbahis/mobile-reference/login-reference.jpg?v=2') !important;
  }
  html body .usbahis-auth .register .auth-mobile-hero {
    background-image: url('/assets/usbahis/mobile-reference/register-reference.jpg?v=2') !important;
  }
  html body .usbahis-auth .auth-mobile-hero > img,
  html body .usbahis-auth .auth-mobile-hero .mr-auth-caption,
  html body .usbahis-auth .auth-mobile-hero:before,
  html body .usbahis-auth .auth-mobile-hero:after {
    display: none !important;
  }
}

/* Mobile sign-in uses the reference grey in both empty and filled states. */
@media (max-width:768px) {
  html body .usbahis-auth .auth-card.login .auth-submit {
    background: #2a3143 !important;
    border-color: #303748 !important;
    color: #fff !important;
    box-shadow: none !important;
  }
  html body .usbahis-auth .auth-card.login .auth-submit.mr-empty {
    background: #1c1e2d !important;
    border-color: #252737 !important;
    color: #91939c !important;
  }
}