#login-form {
    box-shadow: 0px 12px 15px 9px rgba(0, 0, 0, 0.51);
    -webkit-box-shadow: 0px 12px 15px 9px rgba(0, 0, 0, 0.51);
    -moz-box-shadow: 0px 12px 15px 9px rgba(0, 0, 0, 0.51); }

#login-form .btn {
    color: white;
    font-weight: bold; }

#icon-login-form {
    color: gray; }

#icon-login-form:hover {
    color: burlywood; }

#img-logo {
    transition: transform .3s; }

#img-logo:hover {
    transform: scale(1.2); }

#login-form input {
    color: var(--bs-warm-yellow);
    font-weight: bold; }

#login-form ::-webkit-input-placeholder {
    color: var(--bs-warm-yellow);
    font-weight: bold; }

#login-form :-ms-input-placeholder {
    color: var(--bs-warm-yellow);
    font-weight: bold; }

#login-form ::placeholder {
    color: var(--bs-warm-yellow);
    font-weight: bold; }

#submit_button:hover{
    color: var(--bs-warm-yellow);
    background-color: var(--bs-forest-green);
}
/**/
.bg {
    animation:slide 6s ease-in-out infinite alternate;
    background-image: linear-gradient(-60deg, #80B918 50%, #09f 50%);
    bottom:0;
    left:-50%;
    opacity:.5;
    position:fixed;
    right:-50%;
    top:0;
    z-index:-1;
}
.bg2 {
    animation-direction:alternate-reverse;
    animation-duration:7s;
}
.bg3 {
    animation-duration:8s;
}
@keyframes slide {
    0% {
        transform:translateX(-25%);
    }
    100% {
        transform:translateX(25%);
    }
}