/* -------------  MOBILE / SMALL-SCREEN TWEAKS ------------- */
@media (max-width: 600px) {

  /* Tabs stack vertically and fill the width */
  .login-tab-container           { flex-direction: column; margin-top: 16px; }
  .login-tab,
  .psu-tab,
  .active-tab                    { width: 100%; margin: 0 0 6px 0; text-align: center; }

  /* Email button: full-width, centered – override inline margin-left */
  .login-email-btn               {
    margin: 24px auto 0 !important;   /* !important beats inline style */
    width: calc(100% - 40px);
    max-width: 320px;                 /* keeps it from getting too wide on tablets */
  }

  /* “or log in with” divider: narrower margins */
  .login-divider                 { margin-top: 32px; }
  .login-divider::before,
  .login-divider::after          { border-bottom-color: #bbb; }

  /* Help link: center it, ditch huge fixed left margin */
  .support_url.help_dialog_trigger {
    margin: 24px auto 0 !important;
    text-align: center;
  }
}

/* Mobile Browser update main image on login page */
.mobileLogin-Header {
    background-image: url(https://instructure-uploads.s3.amazonaws.com/account_279870000000000001/attachments/2945/psu-avatar-no_containing_shape.png) !important; 
    background-position: center; 
    background-repeat: no-repeat;
    background-size: contain;
    margin: 10px;
}