body {
  margin: 0;
  padding: 0;
  min-height: 100vh;

  background: url(bg2.png) center/cover no-repeat fixed;
  position: relative;
  animation: bgPulse 8s infinite alternate;

}

@media (max-width: 600px) {
  body {
    background: url(mobile-bg.png) center/cover no-repeat fixed;
  }
}

/* ADD THIS RIGHT HERE */
html {
  overflow-y: scroll;
}

.registerbtn { 
text-align: center; 
padding-top: 12vh;
}

.login { 
padding-top: 3vh; 
padding-bottom: 15vh;
text-align: center; 
}

.registerbtn .btn,
.login .btn {
  width: 250px;
}

.alert-danger {
    text-align: center;
    font-size: 20px;
    padding: 10px;
}


.site-logo {
  display: block;
  margin: 75px auto 0;
  width: 1200px;
  max-width: 90vw;
  height: auto;
}

#result {
  font-size: 30px !important;
}

/* Main button */
.btn-danger {
    background-color: #1ab3d0 !important;
    border-color: #1ab3d0 !important;
    color: #fff !important;
}

/* Hover */
.btn-danger:hover {
    background-color: #169bb5 !important;
    border-color: #169bb5 !important;
}

/* Focus and active */
.btn-danger:focus,
.btn-danger.focus,
.btn-danger:active,
.btn-danger:not(:disabled):not(.disabled):active,
.show > .btn-danger.dropdown-toggle {
    background-color: #148ba3 !important;
    border-color: #148ba3 !important;
    box-shadow: 0 0 0 0.2rem rgba(26, 179, 208, 0.4) !important;
}

/* Prevent layout shift when Bootstrap modal opens */
body.modal-open {
    padding-right: 0 !important;
}

html {
    overflow-y: scroll !important;
}

@media (max-width: 600px) {
    .site-logo {
        display: none;
    }
}

#result {
    overflow-wrap: anywhere;
    word-break: break-all;
    max-width: 100%;
}

@media (max-width: 600px) {
    #result {
        font-size: 18px !important;
    }
}

@media (max-width: 600px) {
    .registerbtn .btn,
    .login .btn {
        width: 90vw !important;
        max-width: none !important;
        height: 55px;
        font-size: 20px;
    }
}

@media (max-width: 600px) {
    .login .btn {
        text-align: center;
        padding-top: 10px;
        padding-bottom: 10px;
    }
}

/* MOBILE ONLY: prevent the login status message from being cut off */
@media (max-width: 600px) {
    #pwview {
        width: calc(100% - 20px) !important;
        max-width: 100% !important;
        height: auto !important;
        min-height: 55px !important;
        padding: 12px 10px !important;
        line-height: 1.25 !important;
        white-space: normal !important;
        overflow-wrap: anywhere !important;
        word-break: normal !important;
    }
}