body{
    background-color:#e3f2fd
}
#auth{
    min-height:100vh;
    display:flex;
    align-items:center;
    justify-content:center;
    overflow-x:hidden;
    background:#e3f2fd;
    padding:2rem 1rem
}
#auth .row{
    width:100%;
    margin:0
}
#auth #auth-left{
    padding:3rem 2.5rem;
    background:#fff;
    margin:0 auto;
    border-radius:12px;
    box-shadow:0 4px 20px rgba(0,0,0,.08);
    max-width:420px
}
#auth #auth-left.auth-access-card{
    border:1px solid rgba(0,0,0,.06)
}
#auth #auth-left .auth-title{
    font-size:2rem;    
    margin-bottom: 0;
}
#auth #auth-left .auth-subtitle{
    color:#a8aebb;
    font-size:1.2rem;
    line-height:2.5rem
}
#auth #auth-left .auth-logo{
    margin-bottom:2rem;
    text-align: center;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}
#auth #auth-left .auth-logo a{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
#auth #auth-left .auth-logo img,
#auth #auth-left .auth-logo .auth-logo-img{
    max-width: 100%;
    width: 240px;
    height: auto;
    max-height: 80px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
    filter: brightness(0) saturate(100%) invert(32%) sepia(95%) saturate(2000%) hue-rotate(205deg);
}
@media screen and (max-width:767px){
    #auth #auth-left{
        padding:2rem 1.5rem
    }
}
@media screen and (max-width:576px){
    #auth #auth-left{
        padding:2rem 1rem
    }
}