@font-face {
    font-family: lightFont;
    src: url('../fonts/GTWalsheimPro-Light.woff2');
}

@font-face {
    font-family: RegularFont;
    src: url('../fonts/GTWalsheimPro-Regular.woff2');
}

@font-face {
    font-family: mediumFont;
    src: url('../fonts/GTWalsheimPro-Medium.woff2');
}

body {
    font-family: RegularFont;
}

.loginFormContainer {
    height:32rem;
    max-width: 450px;
    /* background: #291a5b;*/
    background: linear-gradient(0deg, rgb(255, 255, 255) 0%, rgb(244, 247, 251) 100%);
    border-radius: 40px;
    padding: 25px 35px;
    border: 1px solid #069ad8;
    box-shadow: rgba(133, 189, 215, 0.8784313725) 0px 30px 30px -20px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.heading {
    text-align: center;
    font-size: 1.5rem;
    color: #291a5b;
    font-family: mediumFont;
}

.loginFormContainer img {
 /*   width: 80%;*/
    margin: 2rem auto;
  
    display: block;
    /* margin-top: 15px;
    margin-bottom: 15px;*/
    mix-blend-mode: multiply;
}

.loginFormContainer .form {
    margin-top: 40px;
}

    .loginFormContainer .form .input {
        width: 100%;
        background: white;
        border: none;
        padding: 15px 20px;
        border-radius: 20px;
        margin-top: 15px;
        box-shadow: #cff0ff 0px 10px 10px -5px;
        border-inline: 2px solid transparent;
    }

        .loginFormContainer .form .input::-moz-placeholder {
            /*color: rgb(170, 170, 170);*/
        }

        .loginFormContainer .form .input::placeholder {
            /*    color: rgb(170, 170, 170);*/
            color: #069ad8;
        }

        .loginFormContainer .form .input:focus {
           
            outline: none;
            border-inline: 2px solid   #f67600;
        }

    .loginFormContainer .form .forgot-password {
        display: block;
        margin-top: 3rem;
        margin-left: 10px;
    }

.login-button {
    display: block;
    width: 100%;
    font-weight: bold;
    font-size: 1.15rem;
    /*background: rgb(41,26,91);*/
    background: #069ad8;
    color: white;
    padding-block: 10px;
    margin: 20px auto;
    border-radius: 20px;
    box-shadow: rgba(133, 189, 215, 0.8784313725) 0px 20px 10px -15px;
    border: none;
    transition: all 0.2s ease-in-out;
    letter-spacing: 1px;
}

    .login-button:hover {
        transform: scale(1.03);
        box-shadow: rgba(133, 189, 215, 0.8784313725) 0px 23px 10px -20px;
    }

    .login-button:active {
        transform: scale(0.95);
        box-shadow: rgba(133, 189, 215, 0.8784313725) 0px 15px 10px -10px;
    }

.text-danger {
    display:block;
    margin: 5px 20px !important;
   
}

@media(max-width: 768px) {
    .loginFormContainer {
        width: 95%;
    }

        .loginFormContainer .heading {
            font-size: 20px;
        }
}