body {
    background-color: #f5f5f5;
}

.content {
    min-height: calc(100vh - 48px);
}
.footer {
    height: 36px;
    text-align: center;
    font-size: 0.8em;
    color: #414141;
}

a {
    text-decoration: none;
}

/* LOGIN */

.yzr-login {
    width: 375px;
    padding: 24px 36px;
    text-align: center;
    margin: auto;
    background-color: var(--yzr-dark-blue);
    border-radius: 16px !important;
}

@media only screen and (max-width: 600px) {
    .yzr-login {
        width: 348px;
    }
}

.yzr-login-image{
    margin: auto;
}

.yzr-rounded {
    max-width: 640px;
    padding: 24px 36px;
    border-radius: 16px !important;
}

/* HOME */

.yzr-navbar {
    background-color: var(--yzr-dark-blue);
    min-height: 96px;
    color: #fff;
}

.yzr-navbar-link {
    margin: 6px 6px 0px 0px;
    color: var(--yzr-blue);
}

.yzr-card {
    color: #0a2969;
    /* background-color: var(--bs-blue-dark); */
    transition: 0.3s transform cubic-bezier(0.155, 1.105, 0.295, 1.12), 0.3s box-shadow,
    0.3s -webkit-transform cubic-bezier(0.155, 1.105, 0.295, 1.12);
    cursor: pointer;
    border-radius: 16px !important;
}

.yzr-card:hover {
    color: var(--yzr-light-blue);
    transform: scale(1.01);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12), 0 4px 8px rgba(0, 0, 0, 0.06);
    font-size: 1.01em;
}

.yzr-card tr {
    color: #666;
    font-size: 0.8em;
}

.card-icon {
    text-align: center;
    width: 96px;
    padding-top: 16px;
    padding-bottom: 8px;
    margin: auto;
    filter: invert(62%) sepia(91%) saturate(1736%) hue-rotate(94deg) brightness(107%) contrast(92%);
    /* filter: invert(37%) sepia(77%) saturate(2290%) hue-rotate(185deg) brightness(107%) contrast(103%); */
}

.card-title {
    font-size: 2em;
    padding: 16px;
}

.yzr-username {
    margin: 0px 6px 0px 0px;
    color: var(--yzr-green);
}

.yzr-error-area {
    height: 24px;
}

.yzr-text-danger {
    width: 100%;
    text-align: center;
    color: #e53935;
    line-height: 24px;
}
.captcha{
    width: 100%;
    text-align: center;
    color: #e53935;
    line-height: 24px;
    border-radius: 0.375rem;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}

svg {
    margin-left: 36px;
    cursor: pointer;
    width: 1.8em;
    height: 1.8em;
    color: white;
}

svg:hover {
    color: #0099ff;
}

:root {
    --yzr-blue: #0099ff;
    --yzr-dark-blue: #092662;
    --yzr-light-blue: #00ccff;
    --yzr-green: #0ae863;
}
