.modalContent .mText {
    text-align: center;
}
#passResetForm,
#recoveryForm {
    width: 90%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.repoLinks,
.recoveryOp {
    height: 40px;
}
@media screen and (max-width: 900px){
    .loginMainContainer {
        background-position: top;
    }
    .xsContainer {
        width: 90svw;
        height: 60svh;
    }
    .xsContainer .mText {
        font-size: clamp(.9em, 6vw, 1.5em) !important;
    }
    .xsContainer .sText {
        font-size: clamp(.9em, 6vw, 1.2em) !important;
    }
    #loginForm {
        width: 100%;
    }
    .loginFormContainer {
        height: 40vh;
    }
    .oneInput {
        height: 30vh;
    }
    .inputContainer {
        height: 15vh;
    }
    .inputField,
    #sendButton {
        height: 7vh;
        font-size: clamp(.9em, 6vw, 1.5em) !important;
        border-radius: 20px;
        padding: 3px 3px 3px 70px;
        background-position: 15px;
        background-size: 40px;
        background-repeat: no-repeat;
    }
    #sendButton {
        background: var(--orange) url(../assets/icons/send.svg) 100% / 50px no-repeat;
    }
    .eyeShow {
        bottom: 80px;
    }
}
@media screen and (max-width: 899px){
    .loginMainContainer {
        background-position: top;
    }
    .xsContainer {
        width: 90svw;
        height: 60svh;
    }
    .xsContainer .mText {
        font-size: clamp(.7em, 6vw, 1.2em) !important;
    }
    .xsContainer .sText {
        font-size: clamp(.4em, 6vw, .8em) !important;
    }
    #loginForm {
        width: 100%;
    }
    .loginFormContainer {
        height: 40vh;
    }
    .oneInput {
        height: 30vh;
    }
    .inputContainer {
        height: 15vh;
    }
    .inputField, #sendButton {
        height: 10vh;
        font-size: clamp(.9em, 6vw, 1em) !important;
        border-radius: 15px;
        padding: 3px 3px 3px 55px;
        background-position: 8px;
        background-size: 35px;
        background-repeat: no-repeat;
    }
    #sendButton {
        background-position: 90%;
    }
    .eyeShow {
        bottom: 25px;
    }
}
@media screen and (max-width: 700px){
    .loginMainContainer {
        background-position: top;
    }
    .xsContainer {
        width: 90svw;
        height: 55svh;
    }
    .xsContainer .mText {
        font-size: clamp(.7em, 6vw, 1em) !important;
    }
    .xsContainer .sText {
        font-size: clamp(.6em, 6vw, .8em) !important;
    }
    #loginForm {
        width: 100%;
    }
    .loginFormContainer {
        height: 100%;
    }
    .oneInput {
        height: 12vh;
    }
    .inputContainer {
        height: 11vh;
    }
    .inputField, #sendButton {
        height: 7vh;
        font-size: clamp(10px, 6vw, 12px) !important;
        border-radius: 10px;
        padding: 3px 3px 3px 40px;
        background-position: 5px;
        background-size: 25px;
        background-repeat: no-repeat;
    }
    #sendButton {
        background-position: 95%;
    }
    .eyeShow {
        bottom: 10px;
    }
}
@media (min-height: 900px) and (max-width: 700px ){
    .loginMainContainer {
        background-position: 0% 20%;
    }
    .xsContainer {
        width: 90svw;
        height: 40svh;
    }
    .xsContainer .mText {
        font-size: clamp(.7em, 6vw, 1em) !important;
    }
    .xsContainer .sText {
        font-size: clamp(.6em, 6vw, .8em) !important;
    }
    #loginForm {
        width: 100%;
    }
    .loginFormContainer {
        height: 30vh;
    }
    .oneInput {
        height: 8vh;
    }
    .inputContainer {
        height: 7vh;
    }
    .inputField, #sendButton {
        height: 5vh;
        font-size: clamp(12px, 6vw, 14px) !important;
        border-radius: 10px;
        padding: 3px 3px 3px 40px;
        background-position: 5px;
        background-size: 25px;
        background-repeat: no-repeat;
    }
    #sendButton {
        background-position: 95%;
    }
    .eyeShow {
        bottom: 20px;
    }
}