body {
    background-color: var(--bs-body-bg)
}

.btn-primary {
    background: linear-gradient(to right, #0cc0df, #ffde59);
}

#auth {
    height: 100vh;
    overflow-x: hidden
}

#auth #auth-right {
    height: 100%;
    background: url(../png/4853433.png), linear-gradient(90deg, #6f42c1, #7d5eb7)
}

#auth #auth-left {
    padding: 5rem 8rem
}

#auth #auth-left .auth-title {
    font-size: 2rem;
    margin-bottom: 1rem
}

#auth #auth-left .auth-subtitle {
    font-size: 1.7rem;
    line-height: 2.5rem;
    color: #a8aebb
}

#auth #auth-left .auth-logo {
    margin-bottom: 7rem
}

#auth #auth-left .auth-logo img {
    height: 2rem
}

@media screen and (max-width: 1399.9px) {
    #auth #auth-left {
        padding: 3rem
    }
}

@media screen and (max-width: 767px) {
    #auth #auth-left {
        padding: 5rem
    }
}

@media screen and (max-width: 576px) {
    #auth #auth-left {
        padding: 5rem 3rem
    }
}

#auth #auth-center {
    padding: 5rem 2rem
}

#auth #auth-center .auth-logo img {
    /* width: 250px; */
    /* width: 290px; */
    width: 400px;
    object-fit: contain;
    height: 166px;
}

.login-box {
    margin: auto;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background: rgba(11, 12, 17, .722);
    /* background: rgba(11, 12, 17, .722);
    background: radial-gradient(circle, rgba(19, 20, 24, .896) 0%, rgba(17, 21, 33, .896) 100%) 

    background: url(../png/4853433.png), linear-gradient(90deg, #5619c4, #7d5eb7);*/
}