#login .card{
    background: rgba(3, 10, 89, 0.1) !important; /* White background with 10% opacity */
    backdrop-filter: blur(10px) !important; /* Blur the content behind the element */
    border: none !important; /* Remove border */
    border-radius: 10px !important; /* Optional: for rounded corners */
}

#login .glass-effect .card-body {
    color: #111111 !important; /* White text color */
    background: rgba(255, 255, 255, 0.1) !important;
}

.vh-70{
    height: 70vh!important;
}

/* #login-body{
    background: rgb(76,93,167);
    background: radial-gradient(circle, rgba(76,93,167,1) 0%, rgba(20,57,91,1) 84%);

}

nav{
    background: rgb(76,93,167);
    background: radial-gradient(circle, rgba(76,93,167,1) 0%, rgba(20,57,91,1) 84%);
} */

#login-body{
    background: rgb(22,27,45);
    background: radial-gradient(circle, rgba(22,27,45,1) 0%, rgba(0,0,0,1) 100%);

    /* height: 96vh!important; */
}
form{
    color: white;
}

nav{
    background: rgb(22,27,45);
    background: radial-gradient(circle, rgba(22,27,45,1) 0%, rgba(0,0,0,1) 100%);
}

.navbar .navbar-brand{
    color: white!important;
}

#login .btn-primary {
    background-color: #111111;
    border-color: #2c2c2c; /* Light grey border for subtle contrast */
}

#login .btn-primary:hover {
    background-color: #292929; /* Slightly lighter shade for hover effect */
    border-color: #4a4a4a; /* A bit lighter border color for better visibility on hover */
}