/* BACKGROUND GRADIENT   */
body{
    color: #2e305e;
}
body.my-login-page {
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' version='1.1' xmlns:xlink='http://www.w3.org/1999/xlink' xmlns:svgjs='http://svgjs.dev/svgjs' width='1440' height='900' preserveAspectRatio='none' viewBox='0 0 1440 900'%3e%3cg mask='url(%26quot%3b%23SvgjsMask1111%26quot%3b)' fill='none'%3e%3crect width='1440' height='900' x='0' y='0' fill='url(%26quot%3b%23SvgjsLinearGradient1112%26quot%3b)'%3e%3c/rect%3e%3cpath d='M1195 277L748 724' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M325 683L-213 1221' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M884 443L423 904' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M516 293L-118 927' stroke-width='8' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M217 6L828 -605' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M158 221L-230 609' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M1359 832L1803 388' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M261 405L765 -99' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M702 312L69 945' stroke-width='8' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M545 148L780 -87' stroke-width='8' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M533 256L832 -43' stroke-width='8' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M573 105L1001 -323' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M1248 287L1850 -315' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M215 261L723 -247' stroke-width='8' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M514 884L-133 1531' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M987 138L742 383' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M723 334L1286 -229' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M396 772L105 1063' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M1040 194L742 492' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M201 840L854 187' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M876 866L645 1097' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M751 703L1056 398' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M469 799L243 1025' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M813 357L1208 -38' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M396 750L702 444' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M638 279L261 656' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M1325 725L838 1212' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M1357 435L1827 -35' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M735 625L1233 127' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M373 400L-199 972' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M553 805L1017 341' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M283 696L707 272' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M898 818L658 1058' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M770 198L294 674' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M288 534L-202 1024' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M1015 328L347 996' stroke-width='10' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M395 246L711 -70' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M898 807L1564 141' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M900 108L558 450' stroke-width='8' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M435 85L778 -258' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M869 366L1370 -135' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3cpath d='M925 593L1512 6' stroke-width='6' stroke='url(%26quot%3b%23SvgjsLinearGradient1113%26quot%3b)' stroke-linecap='round' class='TopRight'%3e%3c/path%3e%3cpath d='M633 169L973 -171' stroke-width='8' stroke='url(%26quot%3b%23SvgjsLinearGradient1114%26quot%3b)' stroke-linecap='round' class='BottomLeft'%3e%3c/path%3e%3c/g%3e%3cdefs%3e%3cmask id='SvgjsMask1111'%3e%3crect width='1440' height='900' fill='white'%3e%3c/rect%3e%3c/mask%3e%3clinearGradient x1='50%25' y1='100%25' x2='50%25' y2='0%25' gradientUnits='userSpaceOnUse' id='SvgjsLinearGradient1112'%3e%3cstop stop-color='%230e2a47' offset='0'%3e%3c/stop%3e%3cstop stop-color='%2300459e' offset='1'%3e%3c/stop%3e%3c/linearGradient%3e%3clinearGradient x1='0%25' y1='100%25' x2='100%25' y2='0%25' id='SvgjsLinearGradient1113'%3e%3cstop stop-color='rgba(142%2c 28%2c 28%2c 0)' offset='0'%3e%3c/stop%3e%3cstop stop-color='rgba(142%2c 28%2c 28%2c 1)' offset='1'%3e%3c/stop%3e%3c/linearGradient%3e%3clinearGradient x1='100%25' y1='0%25' x2='0%25' y2='100%25' id='SvgjsLinearGradient1114'%3e%3cstop stop-color='rgba(142%2c 28%2c 28%2c 0)' offset='0'%3e%3c/stop%3e%3cstop stop-color='rgba(142%2c 28%2c 28%2c 1)' offset='1'%3e%3c/stop%3e%3c/linearGradient%3e%3c/defs%3e%3c/svg%3e");
    font-size: 14px;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vh;
}

.bg-btn-login {
    background-color: #20376f;
}
.my-login-page .brand {
    width: 111px;
    height: 111px;
    overflow: hidden;
    border-radius: 50%;
    margin: 40px auto;
    /* box-shadow: 0 5px 10px rgba(0,0,0,.10); */
    position: relative;
    z-index: 1;
    transition: 3s;
    /* background: rgba(36,39,52,0.3); */
}

.my-login-page .brand img {
    width: 100%;
}

.my-login-page .card-wrapper {
    width: 450px;
}

.my-login-page .card {
    border-color: white;
    box-shadow: 0 4px 8px rgba(0,0,0,.05);
}

.my-login-page .card.fat {
    padding: 10px;
    background: rgb(189, 191, 198);
    border-radius: 35px;
}





@media screen and (max-width: 425px) {
    .my-login-page .card-wrapper {
        width: 90%;
        margin: 0 auto;
    }
}

@media screen and (max-width: 320px) {
    .my-login-page .card.fat {
        padding: 0;
    }
    .my-login-page .card.fat .card-body {
        padding: 15px;
    }
}

/* JS CLASS FOR ROTATE AVATAR PART ( YOU CAN REMOVE IF YOU DONT LIKE IT :) */
.hover{
    transition: 2s;
    transform: rotateY(360deg);
    position: relative;
}

.svg-bg {
    position: fixed;
    bottom: 0;
    z-index: -2;
}