.loginForm {
    flex: 1;
    width : 100%;
    background-color : var(--whole-background-color);
    display: flex;
    justify-content: center;
    align-items : center;
}
.authContainer {
    display : flex;
    flex-direction : column;
    gap : 0;
    background-color: var(--loginform-background-color);
    border-color : var(--loginform-border-color);
    padding : 3px 1px;
    width : 50%;
    height: 50%;
    border-style: solid;
    border-width : 3px;
    border-radius: 8px;
}

.formInput:hover {
    filter: brightness(80%);
    border-color: color-mix(in srgb, var(--settings-button-border-color) 70%, black);
}

.formSubmit:hover {
    filter: brightness(80%);
    border-color: color-mix(in srgb, var(--settings-button-border-color) 70%, black);
}
.formSubmit:active {
    filter: brightness(40%);
    border-color: color-mix(in srgb, var(--settings-button-border-color) 40%, black);
}
.formInput, .formSubmit {
    border-style: solid;
    border-color: var(--loginform-button-border-color);
    border-radius: 0.85vw;
    background-color: var(--settings-button-background-color);
    color: var(--settings-normal-text-color);
    text-decoration-line: none;
    transition: filter 0.2s ease, border-color 0.2s ease;
}
.formInput {
    margin: 0.75vw;
}

.formSubmit {
    margin : 0.75vw 2.35vw;
}

.separator {
    margin : 1.5vw 7.5vw;
    border-style: solid;
    border-radius : 1.5vw;
    border-bottom-width: 0px;
    border-color: var(--loginform-separator-color);
}