#mainDiv {
    background-image: linear-gradient( rgba(0,0,0,0.4), rgba(0,0,0,0.4) ), url('../../../img/backgrounds/tmfAcademicsLoginBg.png');
    background-repeat: round;
    background-size: cover;
    background-color: #000000;
}


/*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/


#loginBox {
    background-color: hsla(0, 0%, 10%, 0.1);
    border-top: 2px solid rgba(10, 255, 255, 0.9);
    border-right: 2px solid rgba(255, 20, 137, 0.8);
    border-bottom: 2px solid rgba(255, 20, 137, 0.8);
    border-left: 2px solid rgba(10, 255, 255, 0.9);
    backdrop-filter: blur(5px);
    overflow: hidden;
    padding: 1em;
    box-shadow: 11px 8px 11px 1px #020202fa;
}

#brandImg {
    --border-angle: 0turn;
    --main-bg: conic-gradient( from var(--border-angle), #213, #112 5%, #112 60%, #213 95% );
    border: solid 5px transparent;
    border-radius: 2em;
    --gradient-border: conic-gradient(from var(--border-angle), transparent 25%, #1ad4df, #e70a66 99%, transparent);
    background: var(--main-bg) padding-box, var(--gradient-border) border-box, var(--main-bg) border-box;
    background-position: center center;
    animation: bg-spin 3s linear infinite;
}
@keyframes bg-spin {
    to {
        --border-angle: 1turn;
    }
}
    @property --border-angle {
        syntax: "<angle>";
        inherits: true;
        initial-value: 0turn;
    }


/*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/
/*****************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************************/