.logo {
    font-family: 'Aileron Bold';
    width: 100%;
    font-size: 3em;
    margin-top: 30px;
    color: var(--sonic-blue);
    transition: color 1000ms linear;

    display: flex;
    justify-content: center;
    align-items: center;
}
.logo-sm {
    width: 100%;
    font-size: 2em;
    font-family: 'Aileron Thin';
    display: flex;
    justify-content: center;
    align-items: center;

    margin-bottom: 50px;
    color: var(--sonic-blue);
    transition: color 1000ms linear;
}
.login-body {
    font-family: 'Aileron Thin';
}
.login-footer {

}

.form-label {
    font-size: 1.5em;
}
.divider:after,
.divider:before {
    content: "";
    flex: 1;
    height: 1px;
    background: #eee;
}
.h-custom {
    height: calc(100% - 96px);
}
@media (max-width: 450px) {
    .h-custom {
        height: 100%;
    }
}

.sonic-logo {
    z-index: 1000;
    border: 3px solid #fff;
    border-radius: 50%;
    width: 64px;
    height: 64px;
    position: absolute;
    bottom: 66px;
    left: calc(50% - 32px);
}


.dl-dark .logo,
.dl-dark .logo-sm {
    color: white;
}


body, html {
  font-family: "Aileron Regular";
}