@keyframes pulsate {
    0% { transform: scale(1); }
    50% { transform: scale(1.1); }
    100% { transform: scale(1); }
}

div#load_screen {
    background: linear-gradient(120deg, rgba(255,255,255,0.7707457983193278) 35%, rgba(255,255,255,1) 58%);
    opacity: 1;
    position: fixed;
    z-index: 999999;
    top: 0px;
    bottom: 0;
    left: 0;
    right: 0;
    width: 100%;
    transition: opacity 1s ease; /* Smooth transition after timeout */
}

div#load_screen.hidden {
    opacity: 0; /* Make the element transparent when hidden */
    pointer-events: none; /* Disable pointer events on hidden element */
    transition: opacity 1s ease; /* Smooth transition after timeout */
}

div#load_screen .loader {
    display: flex;
    justify-content: center;
    height: 100vh;
}

div#load_screen .loader-content {
    right: 0;
    align-self: center;
}

.spinner-grow {
    color: #304aca;
}

.error {
    color: #ff0000;
    text-align: left;
    display: inline-block;
}

.loader-img {
    height: 175px;
    background: url(brain-light.gif) no-repeat;
    width: 175px;
    display: block;
    background-size: 175px;
    border-radius: 100%;
    animation: pulsate 2s infinite alternate; /* Apply pulsating animation with a slower duration */
}