.spl-user-box {
    border-radius: 30px;
    margin-top: 20px;
    margin-bottom: 20px;
    height: 46px;
    background-color: rgba(211, 219, 223, 0.5);
    background-image: linear-gradient(to right, rgba(189, 201, 207, 0.5), rgba(189, 206, 207, 0.5));
    background-image: linear-gradient(to left, rgba(226, 117, 74, 0.01), rgba(255, 102, 0, 0.2));
    background-image: linear-gradient(to left, rgba(255, 94, 0, 0.05), rgb(255, 94, 0, 0.7), rgb(255, 94, 0, 0.98));
    background-image: linear-gradient(to left, rgba(0, 255, 42, 0.6), rgba(0, 255, 85, 0.9), rgb(24, 168, 79));
    background-image: linear-gradient(to left, rgba(8, 95, 52, 0.4), rgb(8, 95, 52, 0.9));
    color: white;
    background-size: 200% 100%;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
}

.spl-user-box:active {
    color: white !important;
    background-image: linear-gradient(to left, rgba(8, 95, 52, 0.3), rgb(8, 95, 52, 0.8));
}

.spl-user-box:hover {
    background-image: linear-gradient(to left, rgba(8, 95, 52, 0.3), rgb(8, 95, 52, 0.8));
    color: white !important;
}


.spl-user-box:not(:hover) {
    color: white !important;
}



.spl-user-box-zzzzz {
    border: 0;
    text-shadow: 0 0 5px rgba(0, 0, 0, .25);
    background: #186e4b;
    background-image: linear-gradient(to right, #03776b, #209b68, #0c774a, #01695f);
    background-size: 300% 100%;
    -moz-transition: all .4s ease-in-out;
    -o-transition: all .4s ease-in-out;
    -webkit-transition: all .4s ease-in-out;
    transition: all .4s ease-in-out;
    color: white;
}


#empl-tbl {
    font-family: "Varela Round" !important;
}


#empl-tbl th {
    font-family: "Varela Round" !important;
    font-weight: 100 !important;
}


.spl-mdl-ttl {
    color: #38618f;
    font-family: "Varela Round";
    font-weight: 100;
}


.spl-frm-btns {
    font-family: "Varela Round";
    font-weight: 100;
}


.form-control {
    border-color: #84a8be;
    font-family: "Varela Round" !important;
}

.form-control:focus {
    border-color: #446f8a;
    background-color: #fffce9;
    background-color: #f5f9ff;
}


.form-label,
.form-check-label {
    font-family: "Varela Round" !important;
}


.spl-txt-fnt {
    font-family: "Varela Round" !important;
}


.spl-sd-bar {
    background-color: #576a86;
    background-image: linear-gradient(to left, #21324b, #324664, #576a86);

}


.spl-sd-bartop {
    background-color: #354864 !important;
    background-image: linear-gradient(to left, #324664, #576a86);

}






.spl-mnu-ttl {
    margin-top: 12px !important;
    font-family: "Varela Round" !important;
    font-weight: 800 !important;
    font-size: 13px !important;
    color: #a6ff00 !important;
    color: #3cff00 !important;
    color: #ffbb00 !important;
    color: #ff9c5a !important;

}


.spl-tbl-btn {
    text-align: center !important;
    /* background-color: #e7eef0 !important; */
    background-color: #ecf1f0 !important;
    border-radius: 10em;
    transition: all 0.2s ease-in-out;
}

.spl-tbl-btn:hover {
    scale: 1.2;
    background-color: #ffffff !important;
}




.spl-crd-cntnt {
    margin-bottom: 0 !important;
    padding-bottom: 0 !important;
}


.spl-sdbar-btm {
    position: fixed;
    bottom: 0;
    color: rgb(241, 242, 243);
    margin: 22px;
    width: 210px;

    text-align: center;
    font-family: "Varela Round" !important;

    font-size: 0.75rem;

    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 8px;
    padding: 5px;

}


.spl-tbl-boldclmn {
    font-weight: bold !important;
    color: #1f3655 !important;
    /* color: #292942 !important; */
    font-size: 1.01em !important;
}



fact-tbl.dataTable td.spl-tbl-boldclmn {
    background-color: #7359b1;
    /* Light gray background */
}



.spl-menahel-rashi {
    background-color: #9e50c2 !important;
}



.spl-btn-addnew {
    /*     background-color: #704f96 !important;
    border-color: #704f96 !important;

    background-color: #5c4f96 !important;
    border-color: #5c4f96 !important;
 */
    background-color: #4e5a83 !important;
    border-color: #4e5a83 !important;
    margin-bottom: 20px !important;

    transition: all 0.3s ease-in-out;
}

.spl-btn-addnew:hover {
    /* opacity: 0.9; */
    background-color: #6d789c !important;
}


.choices,
.choices__inner {
    font-family: "Varela Round" !important;
}


.choices__item {
    margin-bottom: 6px !important;
}



.lgn-crd-box {
    background-color: rgb(255, 255, 255);
    background-image: linear-gradient(to right, rgb(218, 223, 230), rgb(255, 255, 255));
    border-radius: 24px !important;
    font-family: "Varela Round" !important;
    box-shadow: 0 0 22px 3px rgba(56, 70, 77, 0.5);
    /*max-width: 380px;*/
}


.lgn-entr-btn {
    margin-top: 150px !important;
}


.spl-pgs-ttl {
    font-family: "Varela Round" !important;
    color: rgb(60, 87, 112) !important;
}


.spl-warning-box {
    background-color: #ffd3a0 !important;
    color: rgb(112, 0, 0);
    border-color: rgb(255, 127, 52);
    margin-right: 16px !important;
    margin-left: 14px !important;
    margin-bottom: 0 !important;
    transition: all 200ms ease-out;
    /* width: 80%; */
    /* text-align: center; */
    /* color: white !important */
}


.spl-warning-box:hover {
    background-color: #ffdeb9 !important;
}


/* .dropdown-menu {
    margin-top: 0;
    left: auto !important;
    right: auto !important;
} */


.spl-fltr-mnu {
    background-color: #f1ede8;
}




.spl-dsbrd-clockbox {
    background-color: #909dad !important;
    background-image: linear-gradient(#4f5d6e, #7d8b9c, #cfd6dd);
}


.spl-dsbrd-clkbtns {
    border-style: solid !important;
    border-width: 2px !important;
    border-color: white !important;
    margin-top: 5px !important;
}


.spl-dsbrd-enttime {
    background-color: rgba(255, 255, 255, 0.6) !important;
    margin-right: 50px !important;
    margin-left: 50px !important;
    padding: 8px;
    /* border-radius: 50%; */
    color: rgb(0, 76, 112) !important;
    color: rgb(255, 255, 255) !important;
    color: rgb(5, 36, 65) !important;
    margin-bottom: 12px !important;
    border-radius: 30px !important;
    transition: all .4s ease-in-out;
}

.spl-dsbrd-enttime:hover {
    background-color: rgba(255, 255, 255, 0.9) !important;
}

.spl-dsbrd-exttime {
    margin-right: 100px !important;
    margin-left: 100px !important;
    padding: 8px;
    margin-bottom: 0 !important;
}


.spl-ltl-link {
    /* color: white; */
    text-decoration: underline !important;
    font-size: 16px;
    margin-top: 15px;
}


.spl-digi-time {
    font-size: 3rem !important;
    font-weight: lighter !important;
    margin-top: 0 !important;
}


.spl-dsbrd-entextbxss {
    background-color: rgba(111, 120, 139, 0.2);
    background-color: rgba(189, 198, 207, 0.4);
    background-color: rgba(238, 241, 245, 0.9);
    background-color: rgba(224, 229, 235, 0.9);
    min-height: 342px;
    border-radius: 10px !important;
}


.spl-trvl-mdl {
    max-width: 360px !important;
}