html, body {
    margin: 0;
    padding: 0;
}

.login-content {
    width:100%;
    height:100vh;
    display: flex;
}

.login-image-cover {
    height: 100vh;
    display: flex; flex-direction: row; align-items: center; justify-content: space-between;
    flex: 1;
    color: #fff;

    padding-left: 5rem;
}

.login-form {
    height: 100%;
    background: #fff;
    box-shadow: -5px 0px 40px #000;
    min-width: 400px;
    display: flex;
    align-items: center;
    flex-direction: column;
    justify-content: space-around;
}

.login-form-controls {
    height: 600px;
    background: #fff;
    padding: 10%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-direction: column;
    row-gap: 10px;

    > #msgGeral {
        width: 100%;
    }
}

.login-captcha {
    width: 100%;
    white-space: nowrap;
    display: flex;
    justify-content: flex-start;
    align-items: center;
    gap: 10px;
}

.link-login {
    margin-top: 1rem !important;
}

/* Botao de SSO: so aparece quando saml.login.hybrid=true. */
.login-sso {
    width: 100%;
    margin-top: 1rem;
    font-family: var(--font-family, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif);
}

.login-sso-divisor {
    display: flex;
    align-items: center;
    gap: 10px;
    color: #6c757d;
    font-size: .8rem;
    text-transform: uppercase;
}

.login-sso-divisor::before,
.login-sso-divisor::after {
    content: "";
    flex: 1;
    border-top: 1px solid #ced4da;
}

.button-login-sso {
    margin-top: .75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    width: 100%;
    box-sizing: border-box;
    padding: .6rem 1rem;
    border: 1px solid #23a086;
    border-radius: 4px;
    background: #fff;
    color: #23a086;
    font-weight: 600;
    text-decoration: none;
}

.button-login-sso:hover {
    background: #23a086;
    color: #fff;
}

.texto-footer {
    margin-top: auto;
    font-size: .75rem;
    text-align: center;
}

/*Animation*/
.text-animate-logo {
    transform: scale(0.94);
    animation: scale 3s forwards cubic-bezier(0.5, 1, 0.89, 1);

    width:60%;
    margin-bottom: 1%;
    -webkit-filter: drop-shadow(-5px 0px 40px #000);
    filter: drop-shadow(5px 5px 5px #222);
}

@keyframes scale {
    100% {
        transform: scale(1);
    }
}

.text-animate-text1 {
    padding-left: 10px;
    transform: scale(0.94);
    animation: scale 3s forwards cubic-bezier(0.5, 1, 0.89, 1);

    margin-bottom: 1%;
}

.text-animate-text2 {
    padding-left: 10px;
    transform: scale(0.94);
    animation: scale 3s forwards cubic-bezier(0.5, 1, 0.89, 1);

    margin-bottom: 1%;
}

.text-animate-text3 {
    padding-left: 10px;
    transform: scale(0.94);
    animation: scale 3s forwards cubic-bezier(0.5, 1, 0.89, 1);
}

.text-animate-text1, .text-animate-text2, .text-animate-text3 {
    > span {
        text-shadow: 1px 1px 2px #212529;
    }
}

.text-animate-text1 span {
    display: inline-block;
    opacity: 0;
    filter: blur(4px);
}

.text-animate-text2 span {
    display: inline-block;
    opacity: 0;
    filter: blur(4px);
}

.text-animate-text3 span {
    display: inline-block;
    opacity: 0;
    filter: blur(4px);
}

.text-animate-text1 span:nth-child(1) {
    animation: fade-in 0.8s 0.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(2) {
    animation: fade-in 0.8s 0.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(3) {
    animation: fade-in 0.8s 0.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(4) {
    animation: fade-in 0.8s 0.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(5) {
    animation: fade-in 0.8s 0.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(6) {
    animation: fade-in 0.8s 0.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(7) {
    animation: fade-in 0.8s 0.7s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(8) {
    animation: fade-in 0.8s 0.8s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(9) {
    animation: fade-in 0.8s 0.9s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text1 span:nth-child(10) {
    animation: fade-in 0.8s 1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text2 span:nth-child(1) {
    animation: fade-in 0.8s 1.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text2 span:nth-child(2) {
    animation: fade-in 0.8s 1.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text2 span:nth-child(3) {
    animation: fade-in 0.8s 1.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text2 span:nth-child(4) {
    animation: fade-in 0.8s 1.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text2 span:nth-child(5) {
    animation: fade-in 0.8s 1.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text2 span:nth-child(6) {
    animation: fade-in 0.8s 1.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(1) {
    animation: fade-in 0.8s 1.7s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(2) {
    animation: fade-in 0.8s 1.7s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(3) {
    animation: fade-in 0.8s 1.9s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(4) {
    animation: fade-in 0.8s 2.0s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(5) {
    animation: fade-in 0.8s 2.1s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(6) {
    animation: fade-in 0.8s 2.2s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(7) {
    animation: fade-in 0.8s 2.3s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(8) {
    animation: fade-in 0.8s 2.4s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(9) {
    animation: fade-in 0.8s 2.5s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(10) {
    animation: fade-in 0.8s 2.6s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(11) {
    animation: fade-in 0.8s 2.7s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

.text-animate-text3 span:nth-child(12) {
    animation: fade-in 0.8s 2.8s forwards cubic-bezier(0.11, 0, 0.5, 0);
}

@keyframes fade-in {
    100% {
        opacity: 1;
        filter: blur(0);
    }
}

@media only screen and (max-width: 600px) and (orientation: portrait) {
    .login-image-cover {
        display: none;
    }
    .login-content {
        display: block;
    }
    .login-form {
    }
}

@media only screen and (min-width: 600px) and (max-width: 1000px) and (orientation: portrait) {
    .login-content {
        display: flex;
        flex-direction: column;
    }
    .login-form {
        height: unset;
        flex: 2;
    }
}