@import url("https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,900");
@import url(https://fonts.googleapis.com/earlyaccess/notonaskharabic.css);
@import url("style.css");
html {
    height: 100%;
    font-size: 62.5%;
}
body {
    margin: 0;
    width: 100%;
    overflow-x: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    line-height: 1.7;
    font-size: 16px;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    vertical-align: baseline;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    text-rendering: optimizeLegibility;
    background: #6a85b6;
    background: -webkit-linear-gradient(to right, rgba(106, 133, 182, 0.5), rgba(186, 200, 224, 0.5));
    background: linear-gradient(to right, rgba(106, 133, 182, 0.5), rgba(186, 200, 224, 0.5))
}
header {
    /*padding: 15px;*/
    background: #2196f3;
    color: #fff;
    display:none;
}
.TopWrapper {
    flex: 1;
}
.body-data-div {
    margin: 0;
    width: 100%;
    overflow-x: hidden;
    height: 100%;
    display: flex;
    flex-direction: column;
    /*min-height: 100vh;*/
}
footer {
    /*padding: 15px;*/
   /* background: #333;
    color: #fff;*/
}
/* Error Div Main */
#blazor-error-ui {
    background: lightyellow;
    bottom: 0;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.2);
    display: none;
    left: 0;
    padding: 0.6rem 1.25rem 0.7rem 1.25rem;
    position: fixed;
    width: 100%;
    /*z-index: 1000;*/
    z-index: 99999999;
}
#blazor-error-ui .dismiss {
        cursor: pointer;
        position: absolute;
        right: 0.75rem;
        top: 0.5rem;
    }

.blazor-error-boundary {
    background: url(data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNTYiIGhlaWdodD0iNDkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM6eGxpbms9Imh0dHA6Ly93d3cudzMub3JnLzE5OTkveGxpbmsiIG92ZXJmbG93PSJoaWRkZW4iPjxkZWZzPjxjbGlwUGF0aCBpZD0iY2xpcDAiPjxyZWN0IHg9IjIzNSIgeT0iNTEiIHdpZHRoPSI1NiIgaGVpZ2h0PSI0OSIvPjwvY2xpcFBhdGg+PC9kZWZzPjxnIGNsaXAtcGF0aD0idXJsKCNjbGlwMCkiIHRyYW5zZm9ybT0idHJhbnNsYXRlKC0yMzUgLTUxKSI+PHBhdGggZD0iTTI2My41MDYgNTFDMjY0LjcxNyA1MSAyNjUuODEzIDUxLjQ4MzcgMjY2LjYwNiA1Mi4yNjU4TDI2Ny4wNTIgNTIuNzk4NyAyNjcuNTM5IDUzLjYyODMgMjkwLjE4NSA5Mi4xODMxIDI5MC41NDUgOTIuNzk1IDI5MC42NTYgOTIuOTk2QzI5MC44NzcgOTMuNTEzIDI5MSA5NC4wODE1IDI5MSA5NC42NzgyIDI5MSA5Ny4wNjUxIDI4OS4wMzggOTkgMjg2LjYxNyA5OUwyNDAuMzgzIDk5QzIzNy45NjMgOTkgMjM2IDk3LjA2NTEgMjM2IDk0LjY3ODIgMjM2IDk0LjM3OTkgMjM2LjAzMSA5NC4wODg2IDIzNi4wODkgOTMuODA3MkwyMzYuMzM4IDkzLjAxNjIgMjM2Ljg1OCA5Mi4xMzE0IDI1OS40NzMgNTMuNjI5NCAyNTkuOTYxIDUyLjc5ODUgMjYwLjQwNyA1Mi4yNjU4QzI2MS4yIDUxLjQ4MzcgMjYyLjI5NiA1MSAyNjMuNTA2IDUxWk0yNjMuNTg2IDY2LjAxODNDMjYwLjczNyA2Ni4wMTgzIDI1OS4zMTMgNjcuMTI0NSAyNTkuMzEzIDY5LjMzNyAyNTkuMzEzIDY5LjYxMDIgMjU5LjMzMiA2OS44NjA4IDI1OS4zNzEgNzAuMDg4N0wyNjEuNzk1IDg0LjAxNjEgMjY1LjM4IDg0LjAxNjEgMjY3LjgyMSA2OS43NDc1QzI2Ny44NiA2OS43MzA5IDI2Ny44NzkgNjkuNTg3NyAyNjcuODc5IDY5LjMxNzkgMjY3Ljg3OSA2Ny4xMTgyIDI2Ni40NDggNjYuMDE4MyAyNjMuNTg2IDY2LjAxODNaTTI2My41NzYgODYuMDU0N0MyNjEuMDQ5IDg2LjA1NDcgMjU5Ljc4NiA4Ny4zMDA1IDI1OS43ODYgODkuNzkyMSAyNTkuNzg2IDkyLjI4MzcgMjYxLjA0OSA5My41Mjk1IDI2My41NzYgOTMuNTI5NSAyNjYuMTE2IDkzLjUyOTUgMjY3LjM4NyA5Mi4yODM3IDI2Ny4zODcgODkuNzkyMSAyNjcuMzg3IDg3LjMwMDUgMjY2LjExNiA4Ni4wNTQ3IDI2My41NzYgODYuMDU0N1oiIGZpbGw9IiNGRkU1MDAiIGZpbGwtcnVsZT0iZXZlbm9kZCIvPjwvZz48L3N2Zz4=) no-repeat 1rem/1.8rem, #b32121;
    padding: 1rem 1rem 1rem 3.7rem;
    color: white;
}

    .blazor-error-boundary::after {
        content: "An error has occurred. please recover to try again.";
        /*white-space: pre;*/
        /* content: " \nAn error has occurred."*/
    }

.dashboard_Card {
    border-radius: 40px;
    box-shadow: 5px 5px 30px 7px rgba(0,0,0,0.25),-5px -5px 30px 7px rgba(0,0,0,0.22);
    transition: 0.4s;
}

    .dashboard_Card:hover {
        /*transform: scale(0.99, 0.99);*/
        transform: scale(1.01, 1.01);
        box-shadow: 5px 5px 30px 15px rgba(0,0,0,0.25), -5px -5px 30px 15px rgba(0,0,0,0.22);
    }


.modal {
    background: rgba(0, 0, 0, 0.5) !important;
}
/*bg-ash border border-warning border-3 m-4 p-10 fw-bold fs-3*/
.TopNotesBoard {
    font-weight:bold;font-size:medium;padding:5px;margin:4px;
    border: solid 4px #FF8800 !important;
    outline: solid 4px white !important;
    border-radius: 8px !important;
    box-shadow: 5px 5px 30px 7px rgba(0,0,0,0.25),-5px -5px 30px 7px rgba(0,0,0,0.22);
    transition: 0.4s;
}
 .TopNotesBoard:hover {
        transform: scale(1.01, 1.01);
        box-shadow: 5px 5px 30px 15px rgba(0,0,0,0.25), -5px -5px 30px 15px rgba(0,0,0,0.22);
    }


.WorkingBoard {
    padding:4px;
    /*margin:4px;*/
    margin: auto;
    border: solid 4px white; /* #FF8800;*/
    border-radius: 4px;
    box-shadow: 5px 5px 30px 7px rgba(0,0,0,0.25),-5px -5px 30px 7px rgba(0,0,0,0.22);
   /* transition: 0.4s;*/
}
/*    .WorkingBoard:hover {
        transform: scale(1.01, 1.01);
        box-shadow: 5px 5px 30px 15px rgba(0,0,0,0.25), -5px -5px 30px 15px rgba(0,0,0,0.22);
    }
.WorkingBoard1 {
    padding: 5px;
    margin: 4px;
    background-color: #ffffff;
    border: solid 4px white;
    border-radius: 4px;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
    box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
    transition: 0.4s;
}
    .WorkingBoard1:hover {
        transform: scale(1.01, 1.01);
        box-shadow: 5px 5px 30px 15px rgba(0,0,0,0.25), -5px -5px 30px 15px rgba(0,0,0,0.22);
    }
*/
/*.card {
    padding-bottom: 30px;
    border: none;
    height: 100%;
    background-color: initial;
}

.card-body {
    padding: 15px 30px 30px;
    background-color: #ffffff;
    border-radius: 4px;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
    box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
}
*/



*:not([random-attribute~="value"]) > h2 {
    color: red;
}

[random-attribute~="value"] > h2 {
    color: blue;
}


.centered {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#blazored-toast-container {
    /*color: red;
    font-size: 18px;
    font-weight: bold;*/
    z-index: 1056;
}

.breadcubs-header {
    padding: .75rem 1.25rem;
    margin-bottom: 0;
    background-color: rgba(0,0,0,.03);
    border-bottom: 1px solid rgba(0,0,0,.125);
}

    .breadcubs-header h3 {
        /*line-height: 1.4;*/
        font-size: 22px;
        font-family: 'Roboto', sans-serif;
        font-weight: 400;
        text-transform: capitalize;
        color: #111111;
        margin: 0;
        /* margin-bottom: 8px;*/
    }

    .breadcubs-header:first-child {
        border-radius: calc(.25rem - 1px) calc(.25rem - 1px) 0 0
    }

    .breadcubs-header + .list-group .list-group-item:first-child {
        border-top: 0
    }


#preloader4 {
    background: #ffffff url('/Uss/Server_Data/assets/img/preloader.gif') no-repeat scroll center center;
    height: 100%;
    left: 0;
    overflow: visible;
    position: fixed;
    opacity: 0.9;
    top: 0;
    width: 100%;
    z-index: 8888888;
}

.accordion-Templet.accordion-button {
    display: block;
    cursor: pointer;
    position: relative;
    /*margin: 2px 0 0 0;
   */
    padding: .5em .5em .5em .7em;
    font-size: 100%;
    color: white; /*#9ea8b5;*/
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
    background-color: #042954; /*#051f3e*/
    /*border:solid red 5px;*/
    border-radius: 10px;
}
.sectiontag {
    background-color: #c0caca !important;
}


.TopOf_mytablediv {
    width: fit-content;
    max-width:99%;
    text-align: center;
    margin: 0 auto !important;
    border: none;
    padding-bottom: 10px;
    overflow-x: auto;
}

.albabDivTop {
  /*  display: table-cell;*/
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid black;
    padding: 10px;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
   /* padding-bottom: 30px !important;*/
    
    width: fit-content;
    max-width: 99%;
    margin-bottom: 10px !important;
    overflow-x: auto;
}

.mytabledivbordernone {
    /*display: table-cell;*/
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    width: auto;
    border:green solid 5px;
  /*  -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid black;
    padding: 10px;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;*/
}

.dropdownmaintable {
    padding: 0 5px 0 12px;
    padding-right: 0px !important;
    margin-right: 0px !important;
}
    .dropdownmaintable .navbar-nav-link:after {
        content: none !important;
        background-color: yellow !important;
        padding-right: 0px !important;
        margin-right: 0px !important;
    }



/*.dropdown-toggle:after {
    content: none !important;
}
*/
.wset {
    width: fit-content;
}
.mytablediv {
    /*display: table-cell;*/
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    width: auto;
    /* min-width:100%;*/
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid black;
    padding: 10px;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
    /*padding-bottom: 30px !important;*/
    /*overflow-x: auto;*/
    /*border: solid 2px red;*/
}
.mytabledivNoBorder {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    width: auto;
    padding: 10px;
    border: none;
}
.mytabledivNoBorderFulWidth {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    width: 95%;
    padding: 10px;
    border: none;
}
.mytable_no_hover {
    vertical-align: top;

   /* text-align: center;
    margin:auto 0;
    padding-bottom:23px;*/


    /*min-width: 100%;*/
}

    .mytable_no_hover table {
        min-width: 100%;
        /*outline: 2cm #FFEAEA solid;*/
        /*margin: 10px;*/
        padding: 10px;
        width: 99%;
        border: #c1dad7 solid 5px;
        -webkit-box-shadow: #424035 4px 4px 4px;
        -moz-box-shadow: #424035 4px 4px 4px;
        box-shadow: #424035 4px 4px 4px;
    }

    .mytable_no_hover tr td {
        font-weight: normal;
        font-size: medium;
        padding: 3px;
        vertical-align: middle;
        text-align: center;
        border: #c1dad7 1px solid;
    }

    .mytable_no_hover tr:nth-child(even) {
        background-color: #ffffff;
        color: black;
    }
    .mytable_no_hover tr:nth-child(odd) {
        background-color: #e1edf2;
        /*background-color: #00004b;*/
        /*background-color: #f2f2f2;*/
        color: royalblue;
        /*color: #2060ab;*/
        /*#051f3e;*/
    }
.mytable {
    vertical-align: top;

   /* text-align: center;
    margin:auto 0;
    padding-bottom:23px;*/


    /*min-width: 100%;*/
}

    .mytable table {
        min-width: 100%;
        /*outline: 2cm #FFEAEA solid;*/
        /*margin: 10px;*/
        padding: 10px;
        width: 99%;
        border: #c1dad7 solid 5px;
        -webkit-box-shadow: #424035 4px 4px 4px;
        -moz-box-shadow: #424035 4px 4px 4px;
        box-shadow: #424035 4px 4px 4px;

    }

    .mytable tr td {
        font-weight: normal;
        font-size: medium;
        padding: 3px;
        vertical-align: middle;
        text-align:center;
        border: #c1dad7 1px solid;
    }

    .mytable tr:nth-child(even) {
        background-color: #ffffff;
        color: black;
    }
    .mytable tr:nth-child(odd) {
        background-color: #e1edf2;
        /*background-color: #00004b;*/
        /*background-color: #f2f2f2;*/
        color: royalblue;
        /*color: #2060ab;*/
        /*#051f3e;*/
    }
.lilink li {
    border: solid none 1px;
    border-radius: 5px;
    padding: 2px 2px 2px 10px;
    margin-left: 5px;
    margin-right: 10px;
    margin-bottom: 2px;
}
    .lilink li > input {
        margin-right: 10px;
        background-color: antiquewhite;
    }
    .lilink li:nth-child(even) {
        background-color: #ffffff;
        color: black;
    }
.lilink li:nth-child(odd) {
    background-color: #e1edf2;
    color: royalblue;
}
.moveTobread{
    display:none;
}
/*----------------SectionView---------------*/
.tb_Top_Title {
    height: 35px;
    padding: 5px;
    color: #1874CD;
    background-image: url('/App_Themes/IMS_Themes/Images/greybg.gif');
    background-color: #f7f7f7;
    border-bottom: #bbbbbb 1px solid;
    font-weight: bold;
    font-size: large;
    padding: 5px;
    white-space: nowrap;
    text-align: left;
    padding-left: 10px;
    padding-right: 7px;
}

.tb_DataManagerSV {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid #c1dad7;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
}

    .tb_DataManagerSV > table > tbody > tr:first-child > td {
        height: 35px;
        padding: 5px;
        border: 1px solid #c1dad7;
        border-bottom: #c1dad7 5px solid;
        /*background-color:#5D7B9D;*/ background-color: #205081;
        color: White;
        font-weight: bold;
        font-size: medium;
        text-align: center;
    }

    .tb_DataManagerSV tr:nth-child(even) {
        background-color: #e1edf2;
        color: royalblue;
    }

    .tb_DataManagerSV tr:nth-child(odd) {
        background-color: #ffffff;
        color: black;
    }

    .tb_DataManagerSV tr td {
        font-weight: normal;
        font-size: medium;
        padding: 3px;
        vertical-align: middle;
    }

.tb_Top_DataManagerSV {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 1px solid #bbbbbb;
}

    .tb_Top_DataManagerSV:first-child > * > *:first-child > * {
        height: 35px;
        padding: 5px;
        color: #1874CD;
        background-image: url('/App_Themes/IMS_Themes/Images/greybg.gif');
        background-color: #f7f7f7;
        border-bottom: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .tb_Top_DataManagerSV:first-child > * > *:first-child > td {
        padding: 5px;
    }
/*---------------------------------------*/

    /*
.dropdown-menu li:nth-child(even) {
    background-color: #D9E1F2;
    color: black;
}

.dropdown-menu li:nth-child(odd) {
    background-color: #f2f2f2;
    color: #2060ab;
}*/

.dropdown-menu li {
    height: 45px;
    font-size: 14px;
    border-radius: 4px;
    border: none;
    padding: 5px 15px;
    display: block;
    width: 100%;
    font-weight: 400;
    line-height: 1.5;
    appearance: none;
    transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
}
.mytable_no_hover thead:first-child tr th {
    height: 35px;
    padding: 5px;
    border: 2px solid #c1dad7;
    border-bottom: #c1dad7 3px solid;
    background-color: #205081;
    color: White;
    font-weight: bold;
    font-size: medium;
    text-align: center;
}
.mytable_no_hover tbody tr:nth-child(odd) td div div {
    border: lightblue 1px solid !important;
}
    .mytable_no_hover tbody tr:nth-child(odd) td div div div {
        border: none !important;
    }

/*
.mytable_no_hover tbody tr:nth-child(odd) td input {
    background-color: antiquewhite !important;
}
.mytable_no_hover tbody tr:nth-child(even) td input {
    background-color: rgb(232, 240, 254) !important;
}*/
.mytable thead:first-child tr th {
    height: 35px;
    padding: 5px;
    border: 2px solid #c1dad7;
    border-bottom: #c1dad7 3px solid;
    background-color: #205081;
    color: White;
    font-weight: bold;
    font-size: medium;
    text-align: center;
}
.mytable tbody tr:hover td:not(:first-child) 
{
background-color: #042040;
    color: white;
    opacity: 0.7;
}

.mytable tbody tr:hover td:has(div) {
    background-color: inherit !important;
    opacity: none !important;
    /* color: white;
    opacity: 0.7;*/
}

.mytable tbody tr:nth-child(odd) td div div {
    border: lightblue 1px solid !important;
}
    .mytable tbody tr:nth-child(odd) td div div div {
        border:none!important ;
    }


.mytable tbody tr:nth-child(odd) td input {
    background-color: antiquewhite !important;
}
.mytable tbody tr:nth-child(even) td input {
    background-color: rgb(232, 240, 254) !important;
}




/*tr:nth-child(even) 
        
        .sub:hover {
        background-color: red !important;*/
        /* background-color:forestgreen !important; #e5e8eb */
        /*color: black;*/
        /*opacity: 0.7;*/
    /*}*/
.sub:hover td {
    background-color:  unset !important;
    /* background-color:forestgreen !important; #e5e8eb */
    color: black !important;
    opacity: 0.9 !important;
}

.Topmytable {
    /*display: table-cell;*/
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 1px solid #bbbbbb;
}
    .Topmytable > * > *:first-child > * {
        height: 35px;
        padding: 5px;
        color: #1874CD;
        background-image: url('/Uss/Server_Data/assets/img/greybg.gif');
        background-color: #f7f7f7;
        border-bottom: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .Topmytable > * > *:nth-child(2) > * {
        background-color: rgb(224, 224, 228);
        height: 35px;
        padding: 5px;
        display: none;
        color: red;
        border-bottom: #bbbbbb 1px solid;
        font-weight: normal;
        font-size: large;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .Topmytable > * > *:nth-child(3) > * {
        min-width: 100%;
        background-color: rgb(224, 224, 228);
        height: 35px;
        padding: 5px;
        display: none;
        color: orangered;
        border-bottom: #bbbbbb 1px solid;
        font-weight: normal;
        font-size: large;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .Topmytable > * > *:nth-child(4) > * {
        height: 35px;
        padding: 5px;
        color: #fff;
        font-size: 11px;
        border-bottom: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        margin-bottom: 20px;
        /*white-space: nowrap;*/
        text-align: left;
        padding-left: 10px;
        background: #395870;
        background: linear-gradient(#49708f, #293f50);
    }

    .Topmytable > * > *:nth-child(5) > * {
        vertical-align: top;
        /*  white-space: nowrap;*/
        padding: 10px;
        text-align: center;
        margin: 0 auto;
    }

    .Topmytable > * > *:last-child > * {
        height: 35px;
        padding: 5px;
        color: #1874CD;
        background-color: white;
        border-top: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        margin-bottom: 20px;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
    }

    .Topmytable a {
        font-size: small;
        padding: 3px;
        font-weight: normal
    }

        .Topmytable a:hover {
            text-decoration: none;
            -webkit-transform: scale(1.1);
            transform: scale(1.1);
            background-color: #205081;
            color: white;
            -moz-box-shadow: #424035 3px 3px 3px;
            box-shadow: #424035 3px 3px 3px;
            /*Added by Owais ->*/ transition-property: all;
            transition-duration: 0.3s;
            transition-timing-function: ease-in-out;
            transition-delay: initial;
        }

        .Topmytable a:active {
            text-decoration: underline
        }

        .Topmytable a:visited {
            text-decoration: underline
        }



/*shadow-lg p-3 mb-5 bg-body rounded*/

/*.btn-self-warning-dark {
    background-color: transparent;
    color: #FF8800;
    border: 1px solid #FF8800;
    border-radius: 2px;
    padding: 3px;
}

    .btn-self-warning-dark:hover {
        background-color: #FF8800;
        color: white;
        border: 1px solid black;
    }
*/
/*.card {
    padding-bottom: 30px;
    border: none;
    height: 100%;
    background-color: initial;
}

.card-body {
    padding: 15px 30px 30px;
    background-color: #ffffff;
    border-radius: 4px;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
    box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
}
*/


.btn_Card {
    border-radius: 1px;
    box-shadow: 1px 1px 1px 1px rgba(0,0,0,0.25),-1px -1px -1px -1px rgba(0,0,0,0.22);
    transition: 0.4s;
}

.button-wrap {
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.button-style {
    width: 140px;
    height: 45px;
    font-family: 'Roboto', sans-serif;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 2.5px;
    font-weight: 500;
    color: #000;
    background-color: #fff;
    border: none;
    border-radius: 45px;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
    transition: all 0.3s ease 0s;
    cursor: pointer;
    outline: none;
}

    .button-style:hover {
        background-color: #2EE59D;
        box-shadow: 0px 15px 20px rgba(46, 229, 157, 0.4);
        color: #fff;
        transform: translateY(-7px);
    }
/*.card {
    padding-bottom: 30px;
    border: none;
    height: 100%;
    background-color: initial;
}

.card-body {
    padding: 15px 30px 30px;
    background-color: #ffffff;
    border-radius: 4px;
    -webkit-box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
    box-shadow: 0px 10px 20px 0px rgba(229, 229, 229, 0.75);
}
    card-body btn-self-warning-dark fas fa-user-graduate fa-3x
    <div class="shadow p-3 mb-5 bg-white rounded">Regular shadow</div>
*/

.btn-self-success-dark {
    background-color: transparent;
    color: #007E33;
    border: 1px solid #007E33;
    border-radius: 2px;
    padding: 3px;
}

    .btn-self-success-dark:hover {
        background-color: #007E33;
        color: white;
        border: 1px solid black;
    }



.btn-self-warning-dark {
    background-color: transparent;
    color: #FF8800;
    border: 1px solid #FF8800;
    border-radius: 2px;
    padding: 3px;
}
.btn-self-warning-dark:hover {
        background-color: #FF8800;
        color: white;
        border: 1px solid black;
}
.btn-self-primary-dark {
    background-color: transparent;
    color: #0d47a1;
    border: 1px solid #0d47a1;
    border-radius: 2px;
    padding: 3px;
}
.btn-self-primary-dark:hover {
        background-color: #0d47a1;
        color: white;
        border: 1px solid black;
}
.btn-self-secondary-dark {
    background-color: transparent;
    color: #9933CC;
    border: 1px solid #9933CC;
    border-radius: 2px;
    padding: 3px;
}
.btn-self-secondary-dark:hover {
        background-color: #9933CC;
        color: white;
        border: 1px solid black;
}
.offcanvas-top {
    height: 10vh;
}

.dropdown-menu-with-scroll_Top {
    width: inherit;
    font-size: medium;
    padding-top: 10px;
    padding-bottom: 10px;
    color: #ffa001;
    text-align: center;
}

.dropdown-menu-with-scroll {
    max-height: 380px;
    overflow-y: auto;
    /*scrollbar-width: auto;*/
    display: inline-block;
}

    .dropdown-menu-with-scroll > div:hover {
        background-color: antiquewhite;
    }
.Modal-full-Screen {
    max-width: 100%
}
.close-btn-set {
    border: none;
    background-color: transparent;
    float: right;
    /*font-size: 16pt;*/
}


.book:after {
    content: none
}
.book {
    background-color: darkgreen !important;
    width:fit-content;
    margin-right: 2px!important;
}

.navbar-nav {
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
}
.navbar-nav .book {
    margin-right: 28px;
    background-color: red;
}


.dropdown-menu-right {
    right: 0;
    left: auto !important;
}

.dropdown-menu-left {
    right: auto !important;
    left: 0
}

.dropdown-header {
    display: block;
    padding: 3px 20px;
    font-size: 12px;
    line-height: 1.42857143;
    color: #777;
    white-space: nowrap
}

.dropdown-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 990
}



/*  ======================================  
        Self Created Button Styles
    ======================================  */

.mybtn-printfile::before {
    content: "\f02f";
    color: black;
    padding: 3px;
    border: 1px solid black;
    -webkit-box-shadow: 0 3px 5px black;
    box-shadow: 0 3px 5px black;
}

.mybtn-printfile:hover:before {
    background-color: black;
    color: white;
    border: 1px solid black;
}
.mybtn-printexcel::before {
    content: "\f1c3";
    color: #0f703b;
    padding: 3px;
    border: 1px solid #0f703b;
    -webkit-box-shadow: 0 3px 5px #0f703b;
    box-shadow: 0 3px 5px #0f703b;
}
.mybtn-printexcel:hover:before {
    background-color: #0f703b;
    color: white;
    border: 1px solid #0f703b;
}
.mybtn-printword::before {
    content: "\f1c2";
    color: #1651aa;
    padding: 3px;
    border: 1px solid #1651aa;
    -webkit-box-shadow: 0 3px 5px #1651aa;
    box-shadow: 0 3px 5px #1651aa;
}
.mybtn-printword:hover:before {
    background-color: #1651aa;
    color: white;
    border: 1px solid #0d47c9;
}
.mybtn-printpdf::before {
    content: "\f1c1";
    color: #c30b15;
    padding: 3px;
    border: 1px solid #c30b15;
    -webkit-box-shadow: 0 3px 5px #c30b15;
    box-shadow: 0 3px 5px #c30b15;
}
.mybtn-printpdf:hover:before {
    background-color: #c30b15;
    color: white;
    border: 1px solid #c30b15;
}

.mybtn-sectiondropdown::before {
    content: "\e533 \f0d7";
    color: #ffae01;
    padding: 3px;
    border: 1px solid #ffae01;
    -webkit-box-shadow: 0 3px 5px #ffae01;
    box-shadow: 0 3px 5px #ffae01;
}
.mybtn-sectiondropdown:hover:before {
    /*background-color: #9933CC;*/
    background-color: #ffae01;
    color: white;
    border: 1px solid #ffae01;
}
.mybtn-accountdropdown::before {
    content: "\f555\f0d7";
    color: #9933CC;
    padding: 3px;
    border: 1px solid #9933CC;
    -webkit-box-shadow: 0 3px 5px #9933CC;
    box-shadow: 0 3px 5px #9933CC;
}

.mybtn-accountdropdown:hover:before {
    background-color: #9933CC;
    color: white;
    border: 1px solid #9933CC;
}

.mybtn-staffdropdown::before {
    content: "\f51c\f0d7";
    color: #0d47a1;
    padding: 3px;
    border: 1px solid #0d47a1;
    -webkit-box-shadow: 0 3px 5px #0d47a1;
    box-shadow: 0 3px 5px #0d47a1;
}
.mybtn-staffdropdown:hover:before {
    background-color: #0d47a1;
    color: white;
    border: 1px solid #0d47a1;
}
.mybtn-programdropdown::before {
    content: "\f44b\f0d7";
    color: #ffc107;
    padding: 3px;
    border: 1px solid #ffc107;
    -webkit-box-shadow: 0 3px 5px #ffc107;
    box-shadow: 0 3px 5px #ffc107;
}

.mybtn-programdropdown:hover:before {
    background-color: #ffc107;
    color: white;
    border: 1px solid #ffc107;
}

.mybtn-staff::before {
    content: "\f51c";
    color: #0d47a1;
    padding: 3px;
    border: 1px solid #0d47a1;
    -webkit-box-shadow: 0 3px 5px #0d47a1;
    box-shadow: 0 3px 5px #0d47a1;
}
.mybtn-staff:hover:before {
    background-color: #0d47a1;
    color: white;
    border: 1px solid #0d47c9;
}
/*
.mybtn-student::before {
    content: "\f501";
    color: #FF8800;
    padding: 3px;
    border: 1px solid #FF8800;
    -webkit-box-shadow: 0 3px 5px #FF8800;
    box-shadow: 0 3px 5px #FF8800;
}*/
.mybtn-student:hover:before {
    background-color: #FF8800;
    color: white;
    border: 1px solid #a35700;
}
.mybtn {
    cursor: pointer;
    font-family: "Font Awesome 6 free";
    font-size: 2em;
    background-color: transparent;
    border-radius: 4px;
    margin: 2px;
    transition: 0.4s;
}


.custom_li_button li button {
    box-sizing: border-box;
    background-color: transparent;
    display: inline-block;
    min-width: 1.5em;
    padding: .5em 1em;
    margin-left: 2px;
    margin-bottom: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    color: #333 !important;
   /* border: 1px solid red;*/
    border-radius: 2px
}

    .custom_li_button li button:hover {
        color: white !important;
       /* border: 1px solid red;*/
        background-color: #585858;
        /*  #ffae01 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111));*/
        background: -webkit-linear-gradient(top, #585858 0%, #111 100%);
        background: -moz-linear-gradient(top, #585858 0%, #111 100%);
        background: -ms-linear-gradient(top, #585858 0%, #111 100%);
        background: -o-linear-gradient(top, #585858 0%, #111 100%);
        /* background: linear-gradient(to bottom, #585858 0%, #111 100%)*/
        /*background: red;*/
        box-shadow: #424035 3px 3px 3px;
        transition-property: all;
        transition-duration: 0.3s;
        transition-timing-function: ease-in-out;
        transition-delay: initial;
    }
.custom_li_button li:nth-child(even) button {
    border: 1px solid #198754;
}
    .custom_li_button li:nth-child(even) button:hover {
        background: #198754;
    }
    .custom_li_button li:nth-child(odd) button {
    border: 1px solid #fd7e14;
    
}
        .custom_li_button li:nth-child(odd) button:hover {
            background: #fd7e14;
        }

.custom_paginate_button {
    box-sizing: border-box;
    background-color: transparent;
    display: inline-block;
    min-width: 1.5em;
    padding: .5em 1em;
    margin-left: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    color: #333 !important;
    border: 1px solid #ffae01;
    border-radius: 2px
}

.custom_paginate {
    box-sizing: border-box;
    background-color: transparent;
    display: inline-block;
    min-width: 1.5em;
    padding: .5em 1em;
    margin-left: 2px;
    text-align: center;
    text-decoration: none !important;
    cursor: pointer;
    color: #333 !important;
    border: 1px solid #ffae01;
    border-radius: 2px
}

.custom_paginate_button.current, .custom_paginate_button.current:hover {
    color: #333 !important;
    border: 1px solid #ffae01;
    cursor: default;
    background-color: rgba(230, 230, 230, 0.1);
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, rgba(230, 230, 230, 0.1)), color-stop(100%, rgba(0, 0, 0, 0.1)));*/
    background: -webkit-linear-gradient(top, rgba(230, 230, 230, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
    background: -moz-linear-gradient(top, rgba(230, 230, 230, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
    background: -ms-linear-gradient(top, rgba(230, 230, 230, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
    background: -o-linear-gradient(top, rgba(230, 230, 230, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
    /*background: linear-gradient(to bottom, rgba(230, 230, 230, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%)*/
    background: #ffae01;
}

.custom_paginate_button.disabled, .custom_paginate.disabled, .custom_paginate_button.disabled:hover, .custom_paginate_button.disabled:active {
    cursor: default;
    color: #666 !important;
    border: 1px solid transparent;
    background: transparent;
    box-shadow: none
}

.custom_paginate_button:hover {
    color: white !important;
    border: 1px solid #ffae01;
    background-color: #585858;
    /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111));*/
    background: -webkit-linear-gradient(top, #585858 0%, #111 100%);
    background: -moz-linear-gradient(top, #585858 0%, #111 100%);
    background: -ms-linear-gradient(top, #585858 0%, #111 100%);
    background: -o-linear-gradient(top, #585858 0%, #111 100%);
    /* background: linear-gradient(to bottom, #585858 0%, #111 100%)*/
    background: #ffae01;
    box-shadow: #424035 3px 3px 3px;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease-in-out;
    transition-delay: initial;
}

.custom_paginate_button:active {
    outline: none;
    background-color: #2b2b2b;
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #2b2b2b), color-stop(100%, #0c0c0c));
    background: -webkit-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    background: -moz-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    background: -ms-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    background: -o-linear-gradient(top, #2b2b2b 0%, #0c0c0c 100%);
    background: #ffae01;
    box-shadow: inset 0 0 3px #111
}


.modal-dialog_auto_fit {
    width: fit-content;
    max-width: none; /* Override Bootstrap's default max-width */
    margin: auto; /* Center the modal horizontally */
}
.albab_select {
    /*font-size: medium;*/
    /*background-color: red;
    color: green;*/
    font-size:medium;
    line-height: 1;
    border: 1px solid #707070;
    outline: none;
    padding: 8px;
    padding-right: 16px;
    /*font-size: 16px;*/
    /*border: 0;*/
    margin-left: 3px;
    margin-right: 2rem;
    width: fit-content;
    /*height: 34px;*/
    /*background: url(http://cdn1.iconfinder.com/data/icons/cc_mono_icon_set/blacks/16x16/br_down.png) no-repeat right #ddd;*/
    /*    padding: 10px;
    padding-right: 180px;
    margin-left: 30px;
*/ /*border-radius: 1000000px;*/
    /* -webkit-appearance: none;*/



    background: transparent;
    background-image: url("data:image/svg+xml;utf8,<svg fill='black' height='34' viewBox='0 0 24 24' width='24' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/><path d='M0 0h24v24H0z' fill='none'/></svg>");
    background-repeat: no-repeat;
    background-position-x: calc( 100% - 5px );
    /*
    background-image: linear-gradient(45deg, transparent 50%, black 50%), linear-gradient(135deg, black 50%, transparent 50%), linear-gradient(to right, #ccc, #ccc);
    background-position: calc(100% - 20px) calc(1em + 2px), calc(100% - 15px) calc(1em + 2px), calc(100% - 2.5em) 0.5em;
    background-size: 5px 5px, 5px 5px, 1px 1.5em;
    background-repeat: no-repeat;*/
    -webkit-appearance: none;
    -moz-appearance: none;
    border-radius: 5px;
    /*background-position: right;*/
    /*background-position-x: 100%;*/
    /*background-position-y: 5px;*/
}




.bg_ligblue {
    background-color: rgb(232, 240, 254) !important;
    /*color:red;
    
    font-size: medium;
    font-weight: normal;
    width: 100px;
    height: 25px;*/
    /*text-align: center;*/
    /*padding: 5px;*/
}

.bg_antiqu {
    background-color: antiquewhite !important;
    /*color:red;
    
    font-size: medium;
    font-weight: normal;
    width: 100px;
    height: 25px;*/
    /*text-align: center;*/
    /*padding: 5px;*/
}



.GeeksForGeeks {
    text-align: center;
    background: dodgerblue;
    position: absolute;
    top: 50%;
    left: 1%;
    right: 1%;
}


.albab-grid {
    height: auto;
    display: grid;
    border-radius: 1vw;
    gap: 0.5vw;
    background-color: #7a7a7a;
    padding: 0.5vw;
    grid-template-columns: 10vw 25vw;
    justify-content: center;
    margin-bottom: 0.5vw;
}

.albab-grid-div > div {
    background-color: white;
    color: black;
    text-align: left;
    padding: 5px;
    padding-left: 10px;
    font-size: medium;
    border-radius: 0.5vw;
    white-space: nowrap;
    overflow: visible;
}

.albab-grid-div *:nth-child(4n + 3), .albab-grid-div *:nth-child(4n + 4) {
    background: #d3eaf6;
}



/*
.myDivAlternate div:nth-child(even) {
    background-color: #ffffff;
    color: black;
}

.myDivAlternate div:nth-child(odd) {
    background-color: #e1edf2;
    color: #051f3e;
}*/


.MyBtn-default {
    font-size: inherit;
    font-weight: 500;
    max-width:200px;
}

.MyBtn-default:hover {
    color: white;
    border: solid 1px black;
    background-color: black;
}

.MyBtn-CashReceived {
    color: #278664;
    border: solid 1px #278664;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #278664;
    box-shadow: 0 3px 5px #278664;
}

    .MyBtn-CashReceived:hover {
        color: white;
        border: solid 1px #278664;
        background-color: #278664;
    }

.MyBtn-Challan {
    color: #50C878;
    border: solid 1px #50C878;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #50C878;
    box-shadow: 0 3px 5px #50C878;
}

    .MyBtn-Challan:hover {
        color: white;
        border: solid 1px #50C878;
        background-color: #50C878;
    }

.MyBtn-Repeat {
    color: #c30b15;
    border: solid 1px #c30b15;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #c30b15;
    box-shadow: 0 3px 5px #c30b15;
}

    .MyBtn-Repeat:hover {
        color: white;
        border: solid 1px #c30b15;
        background-color: #c30b15;
    }
     









.MyBtn-Section {
    color: #54B4D3;
    border: solid 1px #54B4D3;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #54B4D3;
    box-shadow: 0 3px 5px #54B4D3;
}

    .MyBtn-Section:hover {
        color: white;
        border: solid 1px #54B4D3;
        background-color: #54B4D3;
    }

.MyBtn-Print {
    color: black;
    border: solid 1px black;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px black;
    box-shadow: 0 3px 5px black;
}

    .MyBtn-Print:hover {
        color: white;
        border: solid 1px black;
        background-color: black;
    }

.MyBtn-Save {
    color: #0f703b;
    border: solid 1px#0f703b;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #0f703b;
    box-shadow: 0 3px 5px #0f703b;
}

    .MyBtn-Save:hover {
        color: white;
        border: solid 1px #0f703b;
        background-color: #0f703b;
    }

.MyBtn-Excel {
    color: #0f703b;
    border: solid 1px#0f703b;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #0f703b;
    box-shadow: 0 3px 5px #0f703b;
}

    .MyBtn-Excel:hover {
        color: white;
        border: solid 1px #0f703b;
        background-color: #0f703b;
    }

.MyBtn-Word {
    color: #1651aa;
    border: solid 1px #1651aa;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #1651aa;
    box-shadow: 0 3px 5px #1651aa;
}

    .MyBtn-Word:hover {
        color: white;
        border: solid 1px #1651aa;
        background-color: #1651aa;
    }

.MyBtn-Pdf {
    color: #c30b15;
    border: solid 1px #c30b15;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #c30b15;
    box-shadow: 0 3px 5px #c30b15;
}

    .MyBtn-Pdf:hover {
        color: white;
        border: solid 1px #c30b15;
        background-color: #c30b15;
    }
.MyBtn-Setting {
    color: #9e0bc3;
    border: solid 1px #9e0bc3;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #9e0bc3;
    box-shadow: 0 3px 5px #9e0bc3;
}

    .MyBtn-Setting:hover {
        color: white;
        border: solid 1px #9e0bc3;
        background-color: #9e0bc3;
    }

.MyBtn-Staff {
    color: #0d47a1;
    border: solid 1px #0d47a1;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #0d47a1;
    box-shadow: 0 3px 5px #0d47a1;
}

    .MyBtn-Staff:hover {
        color: white;
        border: solid 1px #0d47a1;
        background-color: #0d47a1;
    }

.MyBtn-Student {
    color: #FF8800;
    border: solid 1px #FF8800;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #FF8800;
    box-shadow: 0 3px 5px #FF8800;
}

    .MyBtn-Student:hover {
        color: white;
        border: solid 1px #FF8800;
        background-color: #FF8800;
    }
.MyBtn-Calendar {
    color: #FF8800;
    border: solid 1px #FF8800;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #FF8800;
    box-shadow: 0 3px 5px #FF8800;
}

    .MyBtn-Calendar:hover {
        color: white;
        border: solid 1px #FF8800;
        background-color: #FF8800;
    }

.MyBtn-Sort {
    color: #FF8800;
    border: solid 1px #FF8800;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #FF8800;
    box-shadow: 0 3px 5px #FF8800;
}

    .MyBtn-Sort:hover {
        color: white;
        border: solid 1px #FF8800;
        background-color: #FF8800;
    }

.MyBtn-Filter {
    color: #30b9e6;
    border: solid 1px #30b9e6;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #30b9e6;
    box-shadow: 0 3px 5px #30b9e6;
}

    .MyBtn-Filter:hover {
        color: white;
        border: solid 1px #30b9e6;
        background-color: #30b9e6;
    }

.MyBtn-Edit {
    color: #3B71CA;
    border: solid 1px #3B71CA;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #3B71CA;
    box-shadow: 0 3px 5px #3B71CA;
}

    .MyBtn-Edit:hover {
        color: white;
        border: solid 1px #3B71CA;
        background-color: #3B71CA;
    }

.MyBtn-Delete {
    color: #DC4C64;
    border: solid 1px #DC4C64;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #DC4C64;
    box-shadow: 0 3px 5px #DC4C64;
}

    .MyBtn-Delete:hover {
        color: white;
        border: solid 1px #DC4C64;
        background-color: #DC4C64;
    }

.MyBtn-Result {
    color: #688f59;
    border: solid 1px #688f59;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #688f59;
    box-shadow: 0 3px 5px #688f59;
}
.MyBtn-Result:hover {
    color: white;
    border: solid 1px #688f59;
    background-color: #688f59;
}

.MyBtn-Check {
    color: #3B71CA;
    border: solid 1px #3B71CA;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #3B71CA;
    box-shadow: 0 3px 5px #3B71CA;
}

    .MyBtn-Check:hover {
        color: white;
        border: solid 1px #3B71CA;
        background-color: #3B71CA;
    }

.MyBtn-Add {
    color: black;
    border: solid 1px black;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px black;
    box-shadow: 0 3px 5px black;
}

    .MyBtn-Add:hover {
        color: white;
        border: solid 1px black;
        background-color: black;
    }
.MyBtn-Email {
    color: #0dcaf0;
    border: solid 1px #0dcaf0;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #0dcaf0;
    box-shadow: 0 3px 5px #0dcaf0;
}

    .MyBtn-Email:hover {
        color: white;
        border: solid 1px #0dcaf0;
        background-color: #0dcaf0;
    }
.MyBtn-Phone {
    color: #6610f2;
    border: solid 1px #6610f2;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #6610f2;
    box-shadow: 0 3px 5px #6610f2;
}

    .MyBtn-Phone:hover {
        color: white;
        border: solid 1px #6610f2;
        background-color: #6610f2;
    }

.MyBtn-ViewList {
    color: #0f703b;
    border: solid 1px#0f703b;
    background-color: white;
    -webkit-box-shadow: 0 3px 5px #0f703b;
    box-shadow: 0 3px 5px #0f703b;
}

    .MyBtn-ViewList:hover {
        color: white;
        border: solid 1px #0f703b;
        background-color: #0f703b;
    }
 
.DataList_Border {
    border: #bbbbbb solid 5px;
}
.DataList_Div1 {
    /*#f7f7f7*/
    height: 35px;
    padding: 5px;
    color: #1874CD;
    background-image: url('/Uss/Server_Data/assets/img/greybg.gif');
    background-color: red !important;
    border-bottom: #bbbbbb 1px solid;
    font-weight: bold;
    font-size: large;
    white-space: nowrap;
    text-align: left;
    padding-left: 10px;
    padding-right: 7px;
}
.DataList_Div1_Self {
    border-bottom: #bbbbbb 1px solid;
    background:none;
/*    height: 35px;
    padding: 5px;
    color: #1874CD;
    background-image: url('/Uss/Server_Data/assets/img/greybg.gif');
    background-color: red !important;
    font-weight: bold;
    font-size: large;
    white-space: nowrap;
    text-align: left;
    padding-left: 10px;
    padding-right: 7px;*/
}




.div_border {
    text-align: center;
    margin: 0 auto;
/*    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
*/   
    border: 5px solid #c1dad7;
    border-bottom: none;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
    margin-bottom: 1px;
    width: fit-content;
}
.div_DataManager_top {
    height: 35px;
    padding: 5px;
    border: 5px solid #c1dad7;
    /*border-bottom: #c1dad7 5px solid;*/
    background-color: #205081;
    color: White;
    font-weight: bold;
    font-size: medium;
    text-align: center;
}


.tb_DataManager {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid #c1dad7;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
    margin-bottom:1px;
}



    .tb_DataManager tr:first-child td {
        height: 35px;
        padding: 5px;
        border: 1px solid #c1dad7;
        border-bottom: #c1dad7 5px solid;
        background-color: #205081;
        color: White;
        font-weight: bold;
        font-size: medium;
        text-align: center;
    }
.tb_DataManager tr td {
        border: #c1dad7 1px solid;
    }

/*    .tb_DataManager > tbody > tr:first-child > td {
        height: 35px;
        padding: 5px;
        border: 1px solid #c1dad7;
        border-bottom: #c1dad7 5px solid;
        background-color: #205081;
        color: White;
        font-weight: bold;
        font-size: medium;
        text-align: center;
    }
*/
    .tb_DataManager > tbody > tr:nth-child(even) {
        background-color: #e1edf2;
        color: royalblue;
    }

    .tb_DataManager > tbody > tr:nth-child(odd) {
        background-color: #ffffff;
        color: black;
    }

    .tb_DataManager > tbody > tr > td {
        font-weight: normal;
        font-size: medium;
        padding: 3px;
        vertical-align: middle;
        border: #c1dad7 1px solid;
    }

.Div_CutDateTime {
    text-align: center;
    Width: 80%;
    -webkit-transform: scale(1.1);
    -moz-box-shadow: #424035 4px 4px 4px;
    font-weight: bold;
    transform: scale(1.1);
    box-shadow: #424035 4px 4px 4px;
    color: black;
    background-color: orange;
    display: block;
    margin: 0 auto;
    padding: 10px;
    font-size:large;
    opacity:0.8;
    height:fit-content;
}


.input_radio_gender {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    font-size: 18px;
    font-weight: normal;
    white-space: nowrap;
    background-color: rgb(232, 240, 254) !important;
}


.input_radio_cash {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    font-size: 18px;
    color: green;
    font-weight: normal;
    white-space: nowrap;
    background-color: rgb(232, 240, 254) !important;
}

.input_radio_cash_2 {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    font-size: 18px;
    color: red;
    font-weight: normal;
    white-space: nowrap;
    background-color: rgb(232, 240, 254) !important;
}

.input_radio_cash_received {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
    font-size: 16px;
    font-weight: normal;
    white-space: nowrap;
    background-color: rgb(232, 240, 254) !important;
    color: #14A44D;/* equal to bootstrap success */
}

.input_radio_add_charges {
    font-size: 16px;
    font-weight: normal;
    white-space: nowrap;
    background-color: rgb(232, 240, 254) !important;
    color: #3B71CA; /* equal to bootstrap primary */
    /*color: #E4A11B;*/ /* equal to bootstrap warning */
}
.input_radio_waive_off {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
    font-size: 16px;
    font-weight: normal;
    white-space: nowrap;
    background-color: rgb(232, 240, 254) !important;
    color: #DC4C64; /* equal to bootstrap danger */
}




.container_01 {
    width: 200px;
    height: 200px;
    position: relative;
    margin: 20px;
}

.box_01 {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.8; /* for demo purpose  */
}

.stack-top_01 {
    z-index: 9;
    /*margin: 20px;*/
    /* for demo purpose  */
}

/* At Student Search Page  */
.albab_default_input {
    border: none;
    background-color: rgb(232, 240, 254) !important;
    color: inherit;
    font-weight: normal;
    font-size: inherit;
}

.albab_default_label_input {
    white-space: nowrap;
    display: block;
    font-size: medium;
    font-weight: normal;
}


.student_charges_list {
    text-align: center;
    border: solid 1px black;
    white-space: nowrap;
}

.challan_title {
    font-weight: normal;
    text-align: left;
    font-size: large;
    border: solid 1px black;
    padding-inline: 3px;
}

.challan_text {
    font-weight: bold;
    font-size: medium;
    white-space: nowrap;
    text-align: left;
    border: solid 1px black;
    padding-inline: 3px;
}

.fee_02 {
    white-space: nowrap;
    font-weight: bold;
    border: solid 1px black;
}

.fee_02_head {
    font-size: x-small;
    text-align: left;
}

.fee_02_value {
    font-size: small;
    text-align: right;
}

.fee_02_current_cal_01 {
    font-size: x-small;
    text-align: left;
    border: solid 1px black;
    font-weight: normal;
    width: 25%;
    white-space: pre-line;
}

.fee_02_current_cal_02 {
    font-size: small;
    text-align: right;
    border: solid 1px black;
    font-weight: normal;
    white-space: nowrap;
}


/*//////////New Data//////////*/

/*//////////New Data//////////*/

.Div_Page_Top_Radius {
    margin: 5px;
    padding: 5px;
    text-align: center;
    background-color: white;
    color: black;
    position: relative;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    border: 1px solid #395870;
}

.Div_Page_Top, #Div_StudentTransectionEditer_info {
    background-color: #fbfbfb;
    Width: 95%;
    white-space: normal;
    padding: 10px;
    font-size: 18px;
    font-weight: bold;
    display: none;
    -webkit-transform: scale(1.1);
    transform: scale(1.1);
    background-color: orange;
    color: black;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
    text-align: center;
    margin: 0 auto;
}
.tb_Top_DataManagerFam {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 1px solid #bbbbbb;
    width: auto;
}

    .tb_Top_DataManagerFam > * > *:first-child > * {
        content:"Hello";
        height: 35px;
        padding: 5px;
        color: #1874CD;
        background-image: url('/Uss/Server_Data/assets/img/greybg.gif') !important;
        /*background-color: #f7f7f7;*/
        border-bottom: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .tb_Top_DataManagerFam > * > *:nth-child(2) > * {
        background-color: rgb(224, 224, 228);
        height: 35px;
        padding: 5px;
        display: none;
        color: red;
        border-bottom: #bbbbbb 1px solid;
        font-weight: normal;
        font-size: large;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .tb_Top_DataManagerFam > * > *:nth-child(3) > * {
        background-color: rgb(224, 224, 228);
        height: 35px;
        padding: 5px;
        display: none;
        color: orangered;
        border-bottom: #bbbbbb 1px solid;
        font-weight: normal;
        font-size: large;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .tb_Top_DataManagerFam > * > *:nth-child(4) > * {
        height: 35px;
        padding: 5px;
        color: #fff;
        font-size: 11px;
        border-bottom: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        margin-bottom: 20px;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
        background: #395870;
        background: linear-gradient(#49708f, #293f50);
    }

    .tb_Top_DataManagerFam > * > *:nth-child(5) > * {
        vertical-align: top;
        white-space: nowrap;
        padding: 10px;
        text-align: center;
        margin: 0 auto;
    }

    .tb_Top_DataManagerFam > * > *:last-child > * {
        height: 35px;
        padding: 5px;
        color: #1874CD;
        background-color: white;
        border-top: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        margin-bottom: 20px;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
    }

    .tb_Top_DataManagerFam a {
        font-size: small;
        padding: 3px;
        font-weight: normal
    }

        .tb_Top_DataManagerFam a:hover {
            text-decoration: none;
            -webkit-transform: scale(1.1);
            transform: scale(1.1);
            background-color: #205081;
            color: white;
            -moz-box-shadow: #424035 3px 3px 3px;
            box-shadow: #424035 3px 3px 3px;
            /*Added by Owais ->*/ transition-property: all;
            transition-duration: 0.3s;
            transition-timing-function: ease-in-out;
            transition-delay: initial;
        }

        .tb_Top_DataManagerFam a:active {
            text-decoration: underline
        }

        .tb_Top_DataManagerFam a:visited {
            text-decoration: underline
        }


/*///////////Old/////////////////*/
/*.tb_Top_DataManagerFam {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 1px solid #bbbbbb;
    width: auto;
}

    .tb_Top_DataManagerFam > * > *:first-child > * {
        height: 35px;
        padding: 5px;
        color: #1874CD;
        background-image: url('/Uss/Server_Data/assets/img/greybg.gif');
        background-color: #f7f7f7;
        border-bottom: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .tb_Top_DataManagerFam > * > *:nth-child(2) > * {
        background-color: rgb(224, 224, 228);
        height: 35px;
        padding: 5px;
        display: none;
        color: red;
        border-bottom: #bbbbbb 1px solid;
        font-weight: normal;
        font-size: large;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .tb_Top_DataManagerFam > * > *:nth-child(3) > * {
        background-color: rgb(224, 224, 228);
        height: 35px;
        padding: 5px;
        display: none;
        color: orangered;
        border-bottom: #bbbbbb 1px solid;
        font-weight: normal;
        font-size: large;
        text-align: left;
        padding-left: 10px;
        padding-right: 7px;
    }

    .tb_Top_DataManagerFam > * > *:nth-child(4) > * {
        height: 35px;
        padding: 5px;
        color: #fff;
        font-size: 11px;
        border-bottom: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        margin-bottom: 20px;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
        background: #395870;
        background: linear-gradient(#49708f, #293f50);
    }

    .tb_Top_DataManagerFam > * > *:nth-child(5) > * {
        vertical-align: top;
        white-space: nowrap;
        padding: 10px;
        text-align: center;
        margin: 0 auto;
    }

    .tb_Top_DataManagerFam > * > *:last-child > * {
        height: 35px;
        padding: 5px;
        color: #1874CD;
        background-color: white;
        border-top: #bbbbbb 1px solid;
        font-weight: bold;
        font-size: large;
        margin-bottom: 20px;
        white-space: nowrap;
        text-align: left;
        padding-left: 10px;
    }

    .tb_Top_DataManagerFam a {
        font-size: small;
        padding: 3px;
        font-weight: normal
    }

        .tb_Top_DataManagerFam a:hover {
            text-decoration: none;
            -webkit-transform: scale(1.1);
            transform: scale(1.1);
            background-color: #205081;
            color: white;
            -moz-box-shadow: #424035 3px 3px 3px;
            box-shadow: #424035 3px 3px 3px;*/
            /*Added by Owais ->*/ /*transition-property: all;
            transition-duration: 0.3s;
            transition-timing-function: ease-in-out;
            transition-delay: initial;
        }

        .tb_Top_DataManagerFam a:active {
            text-decoration: underline
        }

        .tb_Top_DataManagerFam a:visited {
            text-decoration: underline
        }*/
















.CaseManager td {
    font-size: small;
    font-weight: normal;
    padding-left: 5px;
    padding-right: 5px;
    text-align: left;
}

.CaseManager tr:first-child td {
    color: orangered;
    font-weight: bold;
    font-size: medium;
}

.CaseManager tr:nth-child(n+2) td:first-child {
    color: dimgray;
}

.CaseManager input[type=button] {
    height: 30px;
    width: 165px;
    font-weight: normal;
    font-size: small;
    padding: 1px;
    padding-left: 2px;
    margin: 3px;
    margin-bottom: 10px;
}

.div_afu {
    width: auto;
    height: auto;
    margin: 2px;
    padding: 5px;
    text-align: left;
    white-space: normal;
    background-image: url('/Uss/Server_Data/assets/img/system/BackImage.jpg');
    color: black;
    position: relative;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    border-radius: 2px;
    border: 1px solid #26180A;
    -webkit-box-shadow: #424035 2px 2px 2px;
    -moz-box-shadow: #424035 2px 2px 2px;
    box-shadow: #424035 2px 2px 2px;
    overflow: hidden;
}

.afu {
    width: 240px;
    border: none;
    font-size: small;
    background-color: inherit;
    overflow: hidden;
}

    .afu input {
        width: 240px;
        background-color: inherit;
        border: none;
        font-size: x-small;
        overflow: hidden;
    }











/* 
    below styles were copied from bootstrap 4.5.0 and renamed to be compatible with blazor
    - '.validation-message' == bootstrap '.invalid-feedback'
    - '.invalid' == bootstrap '.is-invalid'
*/

.validation-message {
    display: none;
    width: 100%;
    margin-top: 0.25rem;
    font-size: 80%;
    color: #dc3545;
}

.invalid ~ .validation-message {
    display: block;
}

.form-control.invalid {
    border-color: #dc3545;
    padding-right: calc(1.5em + 0.75rem);
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' fill='none' stroke='%23dc3545' viewBox='0 0 12 12'%3e%3ccircle cx='6' cy='6' r='4.5'/%3e%3cpath stroke-linejoin='round' d='M5.8 3.6h.4L6 6.5z'/%3e%3ccircle cx='6' cy='8.2' r='.6' fill='%23dc3545' stroke='none'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
}

    .form-control.invalid:focus {
        border-color: #dc3545;
        box-shadow: 0 0 0 0.2rem rgba(220, 53, 69, 0.25);
    }

textarea.form-control.invalid {
    padding-right: calc(1.5em + 0.75rem);
    background-position: top calc(0.375em + 0.1875rem) right calc(0.375em + 0.1875rem);
}

.form-check-input.invalid ~ .form-check-label {
    color: #dc3545;
}

.form-check-input.invalid ~ .validation-message {
    display: block;
}







.my-small-div {
    color: green;
}

.form-group-lg {
    display: none;
}

.my-form-group:not(.my-small-div) .form-group-lg {
    display: block;
}

.red-input:focus {
    background: yellow;
    color: red;
}

.blue-input:focus-visible {
    background: red;
    color: blue;
}

.form-control.modifing {
    background-image: url("/Uss/Server_Data/assets/img/inputpreloader.gif");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
    border-style: solid !important;
    border-width: 5px;
    color: orange;
}

.validInfo:not(.invalid) {
    /* .form-control.modified background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3E%3Cpath fill='%235cb85c' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3E%3C/svg%3E");*/
    background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 8 8'%3e%3cpath fill='%23198754' d='M2.3 6.73L.6 4.53c-.4-1.04.46-1.4 1.1-.8l1.1 1.4 3.4-3.8c.6-.63 1.6-.27 1.2.7l-4 4.6c-.43.5-.8.4-1.1.1z'/%3e%3c/svg%3e");
    background-repeat: no-repeat;
    background-position: right calc(0.375em + 0.1875rem) center;
    background-size: calc(0.75em + 0.375rem) calc(0.75em + 0.375rem);
    border-style: solid !important;
    border-width: 1px;
    color: green;
}



.albab-btn {
    cursor: pointer;
    font-weight: 500;
    color: #ffffff;
    border: none;
    /*background-color: #0e56a9;*/
    border-radius: 4px;
    padding: 10px;
    /*padding: 12px 28px;*/
    margin-right: 5px;
    margin-bottom: 3px;
    /*margin-bottom: 10px;*/
    -webkit-transition: all 0.3s ease-out;
    -moz-transition: all 0.3s ease-out;
    -ms-transition: all 0.3s ease-out;
    -o-transition: all 0.3s ease-out;
    transition: all 0.3s ease-out;
}
/*.albab-btn:hover {
        background-color: #042954;
}*/
.albab-btn:focus {
        outline: none;
}
.albab-btn-blue {
    background-color: #0e56a9;
}
.albab-btn-blue:hover {
        background-color: #042954;
}

.albab-btn-gradient-gplus {
    background: -webkit-gradient(linear, left top, right top, from(#e84642), to(#f81b1b));
    background: -webkit-linear-gradient(left, #e84642, #f81b1b);
    background: -o-linear-gradient(left, #e84642, #f81b1b);
    background: linear-gradient(to right, #e84642, #f81b1b);
}
    .albab-btn-gradient-gplus:focus {
        background-color: red;
    }

    .albab-btn-gradient-gplus:disabled {
        background-color: green;
    }


.albab-btn-gplus:hover {
    background-color: #042954;
}


.albab-btn-gradient-yellow {
    background-color: #ffae01;
}
.albab-btn-gradient-yellow:focus {
        background-color: red;
    }
    .albab-btn-gradient-yellow:disabled {
        background-color: green;
    }


.albab-btn-green {
    background: -webkit-gradient(linear, left top, right top, from(rgba(67, 160, 71, 1)), to(rgba(102, 187, 106, 1)));
    background: -webkit-linear-gradient(left, rgba(67, 160, 71, 1), rgba(102, 187, 106, 1));
    background: -o-linear-gradient(left, rgba(67, 160, 71, 1), rgba(102, 187, 106, 1));
    background: linear-gradient(to right, rgba(67, 160, 71, 1), rgba(102, 187, 106, 1));
}
.albab-btn-green:hover {
    background-color: #042954;
}

/*bg-gradient-gplus":"gradient-pastel-green
*/

/*
.albab-btn-green:hover {

}
.albab-btn-yellow {

}
.albab-btn-yellow:hover {

}
.albab-btn-red {

}
.albab-btn-red:hover {

}*/


.img-bab-result-card {
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: 100px;
    width: 90px;
    border: none;
    padding: 1px;
}

.img-bab-xl {
    height: 185px;
    width: 170px;
}

.img-bab-lg {
    height: 185px;
    width: 170px;
    border: 3px orange outset;
    padding: 2px;
}

.img-bab-md {
    height: 150px;
    width: 130px;
    border: 2px orange outset;
    padding: 2px;
}

.img-bab-sm {
    height: 135px;
    width: 120px;
    border: 2px orange outset;
    padding: 2px;
}

.img-bab-xs {
    height: 100px;
    width: 90px;
    border: 1px orange outset;
    padding: 1px;
}
.c_shadow {
    border: 2px solid #fff;
    -moz-box-shadow: 0px 0px 10px 10px #ccc;
    -webkit-box-shadow: 0px 0px 10px 10px #ccc;
    box-shadow: 0px 0px 10px 10px #ccc;
    -moz-border-radius: 25px;
    -webkit-border-radius: 25px;
    border-radius: 25px;
    padding: 5px;
}
.imgbox{
    position:relative;
    height:fit-content;
    width:fit-content;
}

.custom-tooltip {
    --bs-tooltip-bg: var(--bs-primary);
}



.Client_Top_Logo {
    border: none;
    border-collapse: collapse;
    border-spacing: 0px;
    text-align: center;
    margin: auto;
}

.Client_Top_Logo2 {
    border: none;
    border-collapse: collapse;
    border-spacing: 0px;
    text-align: center;
    margin: auto;
}

.Client_Top_Logo img {
    width: 65px;
    height: 65px;
    border: none;
    margin: 5px;
}
@media only screen and (max-width:767px) and (orientation: portrait) {
    .Client_Top_Logo {
        border: none;
        border-collapse: collapse;
        border-spacing: 0px;
        text-align: center;
        margin: auto;
    }

    .Client_Top_Logo2 {
        border: none;
        border-collapse: collapse;
        border-spacing: 0px;
        text-align: center;
        margin: auto;
    }
    .Client_Top_Logo img {
        width: 50px;
        height: 50px;
        border: none;
        margin: 2px;
    }
}
.This_Table_Border > tbody > tr > td {
    border: 1px solid;
}
.G_Table > tbody > tr > td > table > tbody > tr > td {
    border: 1px solid;
}


/* Start Used at A_Gender and A_Married Selection Controls*/
.input_radio_Selection {
    font-size: 18px;
    font-weight: normal;
    white-space: nowrap;
    background-color: rgb(232, 240, 254) !important;
}

.input_radio_Selection1 {
    border-bottom-left-radius: 10px;
    border-top-left-radius: 10px;
}

.input_radio_Selection2 {
    border-bottom-right-radius: 10px;
    border-top-right-radius: 10px;
}
/* End Used at A_Gender and A_Married Selection Controls*/


/* Start Hide Control*/
.HideControl {
    display: none;
    opacity: 0;
}
/* End Hide Control*/


/*---------------------------------------*/
.tb_DataManagerFam {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid #c1dad7;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
}

.tb_DataManagerFam > * > *:first-child > * {
    height: 35px;
    padding: 5px;
    border: 1px solid #c1dad7;
    border-bottom: #c1dad7 5px solid;
    background-color: #205081;
    color: White;
    font-weight: bold;
    font-size: medium;
    text-align: center;
}

.tb_DataManagerFam > * > *:nth-child(even) > * {
    background-color: #e1edf2;
    color: royalblue;
}

.tb_DataManagerFam > * > *:nth-child(odd) > * {
    background-color: #ffffff;
    color: black;
}

.tb_DataManagerFam a {
    font-size: small;
    padding: 3px;
    font-weight: normal
}

    .tb_DataManagerFam a:hover {
        text-decoration: none;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        background-color: #205081;
        color: white;
        -moz-box-shadow: #424035 3px 3px 3px;
        box-shadow: #424035 3px 3px 3px;
        /*Added by Owais ->*/ transition-property: all;
        transition-duration: 0.3s;
        transition-timing-function: ease-in-out;
        transition-delay: initial;
    }

    .tb_DataManagerFam a:active {
        text-decoration: underline
    }

    .tb_DataManagerFam a:visited {
        text-decoration: underline
    }
/*---------------------------------------*/


.tab_border {
    margin-right: 1px;
    margin-bottom: 1px;
    font-size: small;
    color: black !important;
    border: solid 1px #dee2e6 !important;
}
.tab_border_active {
    margin-right: 1px;
    margin-bottom: 1px;
    font-size: small;
    color: orange!important;
    border-top: solid 2px orange !important;
}
.subtab_border_active {
    margin-right: 1px;
    margin-bottom: 1px;
    font-size: small;
    color: red!important;
    border-top: solid 2px red !important;
    background-color:transparent !important;
}
/*CollapsiblePanel*/
.collapsePanelHeader {
    width: 100%;
    height: 30px;
    background-image: url('/Uss/Server_Data/assets/img/ControllerImages/bg-menu-main.png');
    background-repeat: repeat-x;
    color: #FFF;
    font-weight: bold;
}

/* Reporting Format */
.rptb {
    border-collapse: collapse;
    border-spacing: 0px;
    border: black 1px none;
    width: 100%;
    white-space: nowrap;
    text-align: center;
    margin: 0 auto;
}

    .rptb tr td {
        border: black 1px solid;
        font-weight: normal;
        font-size: small;
        color: black;
    }
/* End Reporting Format */


.mytextwithicon {
    position: relative;
}

    .mytextwithicon:before {
        content: "\25AE"; /* this is your text. You can also use UTF-8 character codes as I do here */
        font-family: FontAwesome;
        left: -5px;
        position: absolute;
        top: 0;
    }


.trTotal td {
    height: 35px;
    padding: 5px;
    background-color: darkslategrey;
    color: orange;
    border: #c1dad7 1px solid;
    border-bottom: #c1dad7 5px solid;
    font-weight: bold;
    font-size: medium;
    text-align: center;
}

    .trTotal td:first-child {
        text-align: right;
    }
.trTotal td:first-child, .trth td:first-child, .tr0 td:first-child, .tr1 td:first-child {
    border-left: #c1dad7 5px solid;
}
.trTotal td:last-child, .trth td:last-child, .tr0 td:last-child, .tr1 td:last-child {
    border-right: #c1dad7 5px solid;
}
.selected-select option:checked {
    background: #333;
    color: white;
    padding: 2px;
    /* width: 100px; */
    border: 1px solid yellow;
}
.tb_DataManager .tb_Student_AddAttendance {
    vertical-align: middle;
    text-align: center;
    margin: 0 auto;
}

    .tb_DataManager .tb_Student_AddAttendance div {
        vertical-align: middle;
        cursor: pointer;
    }
@media only screen and (min-width:1200px) 
{
   .tb_DataManager .tb_Student_AddAttendance {
        padding: 3px;
    }
   .tb_DataManager .tb_Student_AddAttendance div {
            width: 30px;
            font-weight: bold;
            font-size: xx-large;
            padding: 3px;
            border-radius: 5px;
            text-align: center;
            margin: 0 auto;
        }
}
.td_AwardList1_Top {
    border: none;
    text-align: center;
    margin: 0 auto;
}

.td_AwardList1 {
    border: 1px solid black;
    text-align: center;
    margin: 0 auto;
}

    .td_AwardList1 tr:first-child {
        font-size: medium;
        font-weight: bold;
        padding: 5px;
        margin: 0 auto;
    }
    .td_AwardList1 tr:not(:nth-child(1)):nth-child(-n+8):nth-child(odd) {
        background-color: #ffffff;
        color: black;
    }
    .td_AwardList1 tr:not(:nth-child(1)):nth-child(-n+8):nth-child(even) {
        background-color: #e1edf2;
        color: brown;
    }
    .td_AwardList1 tr:not(:nth-child(1)):nth-child(-n+8) td {
        font-weight: bold;
        text-align: left;
        font-size: small;
        border: 1px solid black;
        padding: 3px;
        padding-left: 5px;
    }

    .td_AwardList1 tr:nth-child(9) {
        height: 35px;
        padding: 3px;
        background-color: #205081;
        color: white;
        font-weight: normal;
        font-size: x-small;
        text-align: center;
    }

    .td_AwardList1 tr:nth-child(9) {
        border: 1px solid black;
    }

    .td_AwardList1 tr:nth-child(n+10) {
        font-weight: normal;
        font-size: small;
    }

        .td_AwardList1 tr:nth-child(n+10):nth-child(odd) {
            background-color: #ffffff;
            color: black;
        }

        .td_AwardList1 tr:nth-child(n+10):nth-child(even) {
            background-color: #e1edf2;
            color: royalblue;
        }

        .td_AwardList1 tr:nth-child(n+10) td {
            border: 1px solid black;
            padding: 3px;
        }

            .td_AwardList1 tr:nth-child(n+10) td:nth-child(3) {
                text-align: left;
                padding-left: 5px;
            }

    .td_AwardList1 tr:last-child {
        border: none;
    }

        .td_AwardList1 tr:last-child td {
            border: none;
            font-style: italic;
            background-color: white;
            text-align: right;
        }

.td_AwardList2 {
    border: none;
    text-align: center;
    margin: 0 auto;
}

    .td_AwardList2 tr:nth-child(1) {
        border: none;
        background-color: white;
        text-align: center;
        margin: 0 auto;
    }

    .td_AwardList2 tr:nth-child(2) {
        border: solid 1px #5D7B9D;
        font-size: large;
        height: 35px;
        padding: 3px;
        padding-left: 7px;
        background-color: #c1dad7;
        color: brown;
        text-align: left;
    }

    .td_AwardList2 tr:nth-child(3) {
        border: solid 1px #5D7B9D;
        padding: 3px;
        background-color: white;
        color: black;
        padding-left: 7px;
        padding-right: 5px;
    }

    .td_AwardList2 tr:nth-child(4) {
        height: 35px;
        padding: 3px;
        background-color: #205081;
        color: white;
        text-align: center;
    }

    .td_AwardList2 tr:nth-child(n+5) td:nth-child(4) {
        text-align: left;
        padding-left: 5px;
    }

    .td_AwardList2 tr:nth-child(n+5):nth-child(odd) {
        background-color: #ffffff;
        color: black;
    }

    .td_AwardList2 tr:nth-child(n+5):nth-child(even) {
        background-color: #e1edf2;
        color: royalblue;
    }

    .td_AwardList2 tr:nth-child(n+2) td {
        border: 1px solid black;
        font-weight: bold;
        font-size: medium;
    }

    .td_AwardList2 tr:last-child td:first-child {
        border: none;
        padding: 0px;
        margin: 0px;
        background-color: white;
        text-align: right;
    }
.td_AwardList3 {
    border: none;
    text-align: center;
    margin: 0 auto;
}

    .td_AwardList3 tr:first-child {
        border: none;
        background-color: white;
        text-align: center;
        margin: 0 auto;
    }

    .td_AwardList3 tr:nth-child(2) {
        border: solid 1px black;
        font-size: large;
        height: 35px;
        padding: 3px;
        padding-left: 7px;
        background-color: #c1dad7;
        color: brown;
        text-align: left;
    }

    .td_AwardList3 tr:nth-child(3) {
        border: solid 1px black;
        font-size: medium;
        background-color: white;
        color: black;
        padding-left: 3px;
        padding-right: 3px;
    }

    .td_AwardList3 tr:nth-child(4) {
        height: 35px;
        padding: 3px;
        background-color: #205081;
        color: white;
        text-align: center;
    }

    .td_AwardList3 tr:nth-child(n+5) td:nth-child(4) {
        text-align: left;
        padding-left: 5px;
    }

    .td_AwardList3 tr:not(:nth-last-child(-n+2)):nth-child(n+5):nth-child(odd) {
        background-color: #ffffff;
        color: black;
    }

    .td_AwardList3 tr:not(:nth-last-child(-n+2)):nth-child(n+5):nth-child(even) {
        background-color: #e1edf2;
        color: royalblue;
    }

    .td_AwardList3 tr:not(:last-of-type):nth-child(n+4) td {
        border: 1px solid black;
        font-weight: bold;
        font-size: medium;
    }

    .td_AwardList3 tr:nth-last-child(2) {
        background-color: white;
        color: black;
    }

    .td_AwardList3 span {
        float: right;
    }

    .td_AwardList3:last-of-type {
        background-color: white;
        border: none;
        font-weight: normal;
        font-size: x-small;
        padding-top: 13px;
        margin-top: 30px;
    }

.td_AwardList4 {
border: none;
text-align: center;
margin: 0 auto;
}
.td_AwardList4 tr:first-child {
border: none;
background-color: white;
text-align: center;
margin: 0 auto;
}

.td_AwardList4 tr:nth-child(2) {
border: solid 1px #5D7B9D;
font-size: X-large;
height: 35px;
padding: 2px;
padding-left: 7px;
background-color: #c1dad7;
color: brown;
text-align: left;
}

.td_AwardList4 tr:nth-child(3) {
border: solid 1px #5D7B9D;
padding: 3px;
background-color: white;
color: black;
padding-left: 7px;
padding-right: 5px;
}

.td_AwardList4 tr:nth-child(4) {
height: 35px;
padding: 2px;
background-color: #205081;
color: white;
text-align: center;
}

.td_AwardList4 tr:nth-child(9) {
height: 35px;
padding: 2px;
background-color: #205081;
color: white;
text-align: center;
}

.td_AwardList4 tr:nth-last-child(8) {
height: 35px;
padding: 2px;
background-color: #205081;
color: white;
text-align: center;
}

.td_AwardList4 tr:nth-child(-n+8):nth-child(n+4) td {
font-weight: normal;
font-size: small;
}

.td_AwardList4 tr:nth-child(-n+8):nth-child(n+4) td:nth-child(1) {
    text-align: right;
    padding-right: 5px;
    font-weight: bold;
}

.td_AwardList4 tr:nth-child(-n+8):nth-child(n+5) td:nth-child(1) {
color: red;
}

.td_AwardList4 tr:nth-last-child(-n+8):nth-child(n+4) td {
font-weight: normal;
font-size: small;
}

.td_AwardList4 tr:nth-last-child(-n+8):nth-child(n+4) td:nth-child(1) {
    text-align: right;
    padding-right: 5px;
    font-weight: bold;
}

.td_AwardList4 tr:nth-last-child(-n+7):nth-child(n+4) td:nth-child(1) {
color: red;
}

.td_AwardList4 tr:not(:nth-last-child(-n+8)):nth-child(n+10) td:nth-child(4) {
text-align: left;
padding-left: 5px;
}

.td_AwardList4 tr:nth-child(9) td:nth-child(5) {
text-align: left;
padding-left: 5px;
}

.td_AwardList4 tr:not(:nth-last-child(-n+8)):nth-child(n+9) td:nth-child(n+1):nth-child(-n+3) {
padding-left: 5px;
font-size: x-small;
font-weight: normal;
}

.td_AwardList4 tr:not(:last-of-type):nth-child(n+4) td {
border: 1px solid black;
padding: 1px;
}

.td_AwardList4c1 {
border: none;
text-align: center;
margin: 0 auto;
}
.td_AwardList4c1 tr:first-child {
border: none;
background-color: white;
text-align: center;
margin: 0 auto;
}
.td_AwardList4c1 tr:nth-child(2) {
border: solid 1px #5D7B9D;
font-size: X-large;
height: 35px;
padding: 2px;
padding-left: 7px;
background-color: #c1dad7;
color: brown;
text-align: left;
}
.td_AwardList4c1 tr:nth-child(3) {
border: solid 1px #5D7B9D;
padding: 3px;
background-color: white;
color: black;
padding-left: 7px;
padding-right: 5px;
}

.td_AwardList4c1 tr:nth-child(4) {
height: 35px;
padding: 2px;
background-color: #205081;
color: white;
text-align: center;
}

.td_AwardList4c1 tr:nth-child(7) {
height: 35px;
padding: 2px;
background-color: #205081;
color: white;
text-align: center;
}
.td_AwardList4c1 tr:nth-child(-n+6):nth-child(n+4) td {
font-weight: normal;
font-size: small;
}
.td_AwardList4c1 tr:nth-child(-n+6):nth-child(n+4) td:nth-child(1) {
    text-align: right;
    padding-right: 5px;
    font-weight: bold;
}
.td_AwardList4c1 tr:nth-child(-n+6):nth-child(n+5) td:nth-child(1) {
color: red;
}
.td_AwardList4c1 tr:nth-child(7) td:nth-child(2) {
text-align: left;
padding-left: 5px;
}
.td_AwardList4c1 tr:nth-child(n+7) td:nth-child(n+1):nth-child(-n+2) {
padding-left: 5px;
font-size: x-small;
font-weight: normal;
}
.td_AwardList4c1 tr:not(:last-of-type):nth-child(n+4) td {
border: 1px solid black;
padding: 1px;
}

.sectionviewinchargename {
    font-weight: bold;
    font-size: medium;
    color: orangered;
    background-color: #c1dad7
}

.sectionviewlink {
    vertical-align: middle
}
.sectionviewlinkspan {
    font-size: large;
    font-weight: 900;
    margin-left: 2px;
    margin-right: 3px;
}
.sectionviewlinkspan2 {
    font-size: medium;
    font-weight: bold;
    font-style: italic;
    margin-left: 2px;
    margin-right: 3px;
    cursor: pointer;
}



.Div_Data_View_Center {
    background-color: #39519a;
    color: white;
    border: 5px outset #c1dad7;
    padding: 2px;
    /*width: 700px;
    height: 350px;
    width: 750px;*/
    text-align: center;
    margin: 0 auto;
    position: relative;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: #424035 4px 4px 5px 5px;
    -moz-box-shadow: #424035 4px 4px 5px 5px;
    box-shadow: #424035 4px 4px 5px 5px;
    z-index: 1000;
    margin: 5px auto;
    padding: 5px;
    filter: alpha(opacity=100);
    opacity: 1;
    -moz-opacity: 1;
    vertical-align: top;
}

/* SMSNotify.ascx Sytle */
.smsNotify {
    width: 310px;
    height: 500px;
    margin: 0 auto;
    padding: 5px;
    text-align: center;
    background-color: gray;
    color: black;
    position: relative;
    background-image: url('/App_Themes/IMS_Themes/Images/Background/BackImage.jpg');
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid #26180A;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
}

    .smsNotify > div {
        width: 278px;
        height: 479px;
        position: relative;
        border: solid black 3px;
        background-image: url('/Uss/Server_Data/assets/img/ControllerImages/imgSmsNotify.png');
        -webkit-border-radius: 40px;
        -moz-border-radius: 40px;
        border-radius: 40px;
        text-align: center;
        margin: 0 auto;
    }

    .smsNotify textarea {
        font-weight: normal;
        font-size: large;
        border: LightYellow 1px solid;
        padding: 5px;
        left: 15px;
        margin-top: 59px;
        resize: none;
        overflow: auto;
        position: absolute;
        -webkit-border-radius: 10px;
        -moz-border-radius: 10px;
        border-radius: 10px;
    }

    .smsNotify span {
        color: wheat;
        font-size: x-large;
        font-weight: normal;
        padding-top: 8px;
        width: 278px;
        left: 0;
        position: absolute;
        border: none;
        text-align: center;
        margin: 0 auto;
    }

    .smsNotify label {
        color: wheat;
        font-size: medium;
        font-weight: normal;
        padding-top: 8px;
        width: 278px;
        left: 0;
        position: absolute;
        border: none;
        text-align: center;
        margin: 0 auto;
    }

    .smsNotify #span_SMS_Notification {
        padding-left: 18px;
        font-size: small;
        font-weight: normal;
        color: wheat;
        text-align: left;
        bottom: 3px;
        margin: 0 auto;
        position: absolute;
    }

    .smsNotify #divBottom_SMS_Notification {
        background-color: transparent;
        border: none;
        left: 0;
        text-align: center;
        height: 75px;
        position: absolute;
        width: 278px;
        margin: 400px auto;
    }
    .smsNotify input[type=submit], .smsNotify input[type=button] {
        padding: 3px;
        background-color: orange;
        text-align: center;
        color: #205081;
        -webkit-border-radius: 5px;
        -moz-border-radius: 5px;
        border-radius: 5px;
    }

        .smsNotify input[type=submit]:hover, .smsNotify input[type=button]:hover {
            text-decoration: none;
            -webkit-transform: scale(1.1);
            transform: scale(1.1);
            background-color: #205081;
            color: white;
            -moz-box-shadow: orange 3px 3px 3px;
            box-shadow: orange 3px 3px 3px;
            transition-property: all;
            transition-duration: 0.3s;
            transition-timing-function: ease-in-out;
            transition-delay: initial;
        }

.div_Title {
    /*height:35px;margin-bottom:20px;*/
    /*white-space:nowrap;*/
    margin: 0px;
    padding: 5px;
    color: #fff;
    font-size: 11px;
    border-bottom: #bbbbbb 1px solid;
    font-weight: bold;
    font-size: large;
    text-align: left;
    padding-left: 10px;
    background: #395870;
    background: linear-gradient(#49708f, #293f50);
}
.right-arrow {
    display: inline-block;
    position: relative;
    background: orange;
    font-size: medium;
    text-align: center;
    color: #000099;
    margin: 15px;
    padding: 15px;
}

    .right-arrow:after {
        content: '';
        display: block;
        position: absolute;
        left: 100%;
        top: 50%;
        margin-top: -10px;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-right: 10px solid transparent;
        border-bottom: 10px solid transparent;
        border-left: 10px solid orange;
    }
.left-arrow {
    display: inline-block;
    position: relative;
    background: orange;
    font-size: medium;
    text-align: center;
    color: #000099;
    margin: 15px;
    padding: 15px;
}

    .left-arrow:after {
        content: '';
        display: block;
        position: absolute;
        right: 100%;
        top: 50%;
        margin-top: -10px;
        width: 0;
        height: 0;
        border-top: 10px solid transparent;
        border-right: 10px solid grey;
        border-bottom: 10px solid transparent;
        border-left: 10px solid transparent;
    }

.down-arrow {
    display: inline-block;
    position: relative;
    background: orange;
    font-size: medium;
    color: #000099;
    margin: 15px;
    padding: 15px;
    text-align: center;
}

    .down-arrow:after {
        content: '';
        display: block;
        position: absolute;
        left: 0;
        top: 100%;
        width: 0;
        height: 0;
        border-top: 20px solid darkcyan;
        border-right: 100px solid transparent;
        border-bottom: 0 solid transparent;
        border-left: 100px solid transparent;
    }


.up-arrow {
    display: inline-block;
    position: relative;
    background: orange;
    font-size: medium;
    text-align: center;
    color: #000099;
    margin: 15px;
    padding: 15px;
}
    /*a:hover.up-arrow {
    background: brown;
}*/
    .up-arrow:after {
        content: '';
        display: block;
        position: absolute;
        left: 20px;
        bottom: 100%;
        width: 0;
        height: 0;
        border-bottom: 10px solid green;
        border-top: 10px solid transparent;
        border-left: 10px solid transparent;
        border-right: 10px solid transparent;
    }
.timeselectoption {
    padding: .3125rem 3rem .3125rem 1rem;
    background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%22292.4%22%20height%3D%22292.4%22%3E%3Cpath%20fill%3D%22%23007CB2%22%20d%3D%22M287%2069.4a17.6%2017.6%200%200%200-13-5.4H18.4c-5%200-9.3%201.8-12.9%205.4A17.6%2017.6%200%200%200%200%2082.2c0%205%201.8%209.3%205.4%2012.9l128%20127.9c3.6%203.6%207.8%205.4%2012.8%205.4s9.2-1.8%2012.8-5.4L287%2095c3.5-3.5%205.4-7.8%205.4-12.8%200-5-1.9-9.2-5.5-12.8z%22%2F%3E%3C%2Fsvg%3E');
    background-repeat: no-repeat, repeat;
    background-position: right 1rem center;
    border-radius: .25rem;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    border: 1px solid #d8e2ef;
    color: #344040;
    background-size: 10px 12px;
    /*background-color: #fff;*/
    /*background-color: antiquewhite !important;*/
    box-shadow: 0 1px 2px rgba(0,0,0,0.075);
    outline: none;
}
.timeselectoption option:checked {
    background: #333;
    color: white;
    padding: 2px;
    /* width: 100px; */
    border: 1px solid yellow;
}



.albab_button button {
    box-sizing: border-box;
    /*background-color: transparent;*/
    display: inline-block;
    min-width: 1.5em;
    padding: .5em 1em;
    margin-left: 2px;
    margin-bottom: 2px;
    text-align: center;
    /*text-decoration: none !important;*/
    cursor: pointer;
    /* color: #333 !important;*/
    /* border: 1px solid red;*/

   
    /* background: linear-gradient(to bottom, #585858 0%, #111 100%)*/
    /*background: red;*/
    box-shadow: #424035 3px 3px 3px;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease-in-out;
    transition-delay: initial;
    border-radius: 2px
}
.albab_button  button:hover {
    color: white !important;
    /* border: 1px solid red;*/

    background-color: transparent !important;

    /*  #ffae01 background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #585858), color-stop(100%, #111));*/
    background: -webkit-linear-gradient(top, #585858 0%, #111 100%);
    background: -moz-linear-gradient(top, #585858 0%, #111 100%);
    background: -ms-linear-gradient(top, #585858 0%, #111 100%);
    background: -o-linear-gradient(top, #585858 0%, #111 100%);
    /* background: linear-gradient(to bottom, #585858 0%, #111 100%)*/
    /*background: red;*/
    box-shadow: #424035 3px 3px 3px;
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: ease-in-out;
    transition-delay: initial;
}

./*albab_button div:nth-child(even) button {
    border: 1px solid #198754;
}
    .albab_button div:nth-child(even) button:hover {
        background-color:transparent !important ;
    }
.albab_button div:nth-child(odd) button {
    border: 1px solid #fd7e14;
}
    .albab_button div:nth-child(odd) button:hover {
        background: #fd7e14;
    }*/

.video-controls {
    position: absolute;
    width: 50px;
    height: 20px;
    cursor: pointer;
    background-color: #FFF;
    border: 1px solid #000;
}




.result_V1 {
width: 100%;
}
    .result_V1 td {
        font-size: small;
        border: solid 1px black;
        text-align: center;
        white-space: nowrap;
        background-color: inherit;
        color: inherit;
    }
.result_V1 tr:last-child td {
    font-weight: bold;font-size:medium;
    /*background-color: lightcyan;*/
}

.result_V1 tr:nth-child(n+3):not(:last-child) td:nth-last-child(2) {
    /*background-color: red;*/
}
.result_V1 tr:nth-child(n+2):not(:last-child) td:nth-child(2) {
text-align: left;
/*background-color: green;
*/}
    .result_V1 tr:first-child td {
        font-weight: bold;
        font-size: large;
        white-space: normal;
        /* background-color: yellow;*/
    }
    .result_V1 tr:nth-child(2) td {
        font-weight: normal;
        font-size: small;
        /* background-color: gray;*/
    }

.accordion-button.collapsed {
    background-color: #042954;
    color: white !important;
    font-size: medium;
    font-weight: bold;
}

.accordion-button:not(.collapsed) {
    background-color: lightslategrey;
    color: white !important;
    font-size: medium;
    font-weight: bold;
}

.accordion-button.collapsed::after {
    background: url("/Uss/Server_Data/assets/img/ControllerImages/collapse_blue.jpg");
}

.accordion-button:not(.collapsed)::after {
    background: url("/Uss/Server_Data/assets/img/ControllerImages/collapse_blue.jpg");
}

.pp_radio
{
    width: 3em;
    height: 3rem;
    accent-color: green;
}
.MyModalConfirmation {
    background-color: #042954;
    color: white;
}


.SideBarMenuButton {
    background: #001C32;
  /*  width: fit-content;*/
    width: 150px;
    padding: 8.5px 15px;

    /*height:35px;*/
    
    -webkit-box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset rgba(255, 255, 255, 0.4) 0 1px 0;
    -moz-box-shadow: rgba(255,255,255,0.4) 0 1px 0, inset rgba(255,255,255,0.4) 0 1px 0;
    box-shadow: rgba(255, 255, 255, 0.4) 0 1px 0, inset rgba(255, 255, 255, 0.4) 0 1px 0;
    color: #FFF;
    font-size: 13px;
    font-weight: bold;
    text-decoration: none;
    vertical-align: middle;
}

   .SideBarMenuButton:hover  {
        font-weight: 800;
        background: #11715b;
        color: #FFF;
    }

  .SideBarMenuButton:disabled  {
        border: 1px solid #999999;
        background-color: #cccccc;
        color: #666666;
    }
.card1viewrow:has(.col-auto) {
    display: table-row;
}

.card2viewcell:has(.col-auto) {
    display: table-cell;
}



.tb_DataManagerBalance a, .tb_DataManagerBalanceWithoutTotal a {
    font-size: small;
    padding: 3px;
    font-weight: normal
}

    .tb_DataManagerBalance a:hover, .tb_DataManagerBalanceWithoutTotal a:hover {
        text-decoration: none;
        -webkit-transform: scale(1.1);
        transform: scale(1.1);
        background-color: #205081;
        color: white;
        -moz-box-shadow: #424035 3px 3px 3px;
        box-shadow: #424035 3px 3px 3px;
        /*Added by Owais ->*/ transition-property: all;
        transition-duration: 0.3s;
        transition-timing-function: ease-in-out;
        transition-delay: initial;
    }

    .tb_DataManagerBalance a:active, .tb_DataManagerBalanceWithoutTotal a:active {
        text-decoration: underline
    }

    .tb_DataManagerBalance a:visited, .tb_DataManagerBalanceWithoutTotal a:visited {
        text-decoration: underline
    }

.tb_DataManagerBalance, .tb_DataManagerBalanceWithoutTotal {
    border-collapse: collapse;
    text-align: center;
    margin: 0 auto;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 5px solid #c1dad7;
    -webkit-box-shadow: #424035 4px 4px 4px;
    -moz-box-shadow: #424035 4px 4px 4px;
    box-shadow: #424035 4px 4px 4px;
}

    .tb_DataManagerBalance tr:first-child td, .tb_DataManagerBalanceWithoutTotal tr:first-child td {
        height: 35px;
        padding: 5px;
        border: 1px solid #c1dad7;
        border-bottom: #c1dad7 5px solid;
        /*background-color: #A6CEB8;*/
        background-image: url('/App_Themes/IMS_Themes/Images/greybg.gif');
        color: #8e4545;
        font-weight: bold;
        font-size: medium;
        text-align: center;
    }

    .tb_DataManagerBalance tr:nth-child(2) td, .tb_DataManagerBalanceWithoutTotal tr:nth-child(2) td {
        height: 35px;
        padding: 5px;
        border: 1px solid #c1dad7;
        border-bottom: #c1dad7 5px solid;
        background-color: #205081;
        color: White;
        font-weight: bold;
        font-size: medium;
        text-align: center;
    }

    .tb_DataManagerBalance tr:nth-child(3) td {
        height: 35px;
        padding: 5px;
        border: 1px solid #c1dad7;
        border-bottom: #c1dad7 5px solid;
        background-color: darkslategrey;
        color: orange;
        font-weight: bold;
        font-size: medium;
        text-align: center;
    }

    .tb_DataManagerBalance tr:last-child td {
        height: 35px;
        padding: 5px;
        border: 1px solid #c1dad7;
        border-bottom: #c1dad7 5px solid;
        background-color: darkslategrey;
        color: orange;
        font-weight: bold;
        font-size: medium;
        text-align: center;
    }
    /*.tb_DataManager tr:nth-child(n+1) td {
        border: #c1dad7 1px solid;
    }*/
    .tb_DataManagerBalance tr:nth-child(even), .tb_DataManagerBalanceWithoutTotal tr:nth-child(even) {
        background-color: #e1edf2;
        color: royalblue;
    }

    .tb_DataManagerBalance tr:nth-child(odd), .tb_DataManagerBalanceWithoutTotal tr:nth-child(odd) {
        background-color: #ffffff;
        color: black;
    }

    .tb_DataManagerBalance tr td, .tb_DataManagerBalanceWithoutTotal tr td {
        font-weight: normal;
        font-size: medium;
        padding: 3px;
        vertical-align: middle;
        border: #c1dad7 1px solid;
    }



/*@media only screen and (max-width:767px) and (orientation: portrait) {
    .img_Footer_Logo {
        width: 70px;
        height: 70px;
        margin-right: 1px;
    }

    .table_footer_1 {
        text-align: left;
        margin: 0 auto;
    }

    .table_footer_Phone {
        cursor: pointer;
    }

    .div_footer_Top {
        font-size: 10px;
    }

    .div_footer_Top_1, .div_footer_Top_2, .div_footer_info_1, .div_footer_info_2, .div_footer_info_3 {
        margin-top: 5px;
        width: 100%;
        text-align: center;
        margin: 0 auto;
    }

    .div_footer_info_1, .div_footer_info_2, .div_footer_info_3 {
        font-size: 12px;
    }

    .SideBarMenu [type=button], .SideBarMenuButton, [type=button] {
        width: 75px;
    }

    #Div_Inst_Top {
        margin: 0 auto;
        margin-right: 2px;
        text-align: center;
    }

    .Client_Top_Logo {
        border: none;
        border-collapse: collapse;
        border-spacing: 0px;
        text-align: center;
        margin: auto;
    }

    .Client_Top_Logo2 {
        border: none;
        border-collapse: collapse;
        border-spacing: 0px;
        text-align: center;
        margin: auto;
    }

    .Client_Top_Logo img {
        width: 50px;
        height: 50px;
        border: none;
        margin: 2px;
    }

    .tb_DataManager .tb_Student_AddAttendance {
        padding: 1px;
    }
}*/
/* Extra Small landscape */
/*@media only screen and (max-width:767px) and (orientation: landscape) {
    .img_Footer_Logo {
        width: 125px;
        height: 125px;
        margin-right: 3px;
    }

    .div_footer_info_1 {
        font-size: 125%;
        float: left;
        width: 100%;
    }

    .div_footer_info_2 {
        font-size: 125%;
        float: left;
        width: 100%;
        margin-top: 5px;
    }

    .div_footer_info_3 {
        font-size: 125%;
        float: left;
        width: 100%;
    }

    .table_footer_1 {
        text-align: left;
        margin: 0 auto;
    }

    .table_footer_Phone {
        text-align: left;
        margin: 0 auto;
    }

    .SideBarMenu [type=button], .SideBarMenuButton, [type=button] {
        width: 75px;
    }

    #Div_Inst_Top {
        margin: 0 auto;
        text-align: center;
    }

    .Client_Top_Logo {
        border: none;
        border-collapse: collapse;
        border-spacing: 0px;
        text-align: center;
        margin: auto;
    }

    .Client_Top_Logo2 {
        border: none;
        border-collapse: collapse;
        border-spacing: 0px;
        text-align: center;
        margin: auto;
    }

    .Client_Top_Logo img {
        width: 50px;
        height: 50px;
        border: none;
        margin: 2px;
    }

    .tb_DataManager .tb_Student_AddAttendance {
        padding: 1px;
    }
}*/


.toast-warning {
    background-color: #ffc107; /* Yellow/orange for warning */
    color: #333; /* Dark text for contrast */
    padding: 15px 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
    /* Add positioning and animation properties as needed */
}

    .toast-warning .icon {
        margin-right: 10px;
        /* Style for the warning icon */
    }
.toast-danger {
    background-color: #dc3545; /* Bootstrap's danger red */
    color: #fff;
    font-size:medium;
    padding: 15px 20px;
    border-radius: 5px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);

    border: 1px solid #dc3545;
/*    padding: 1rem;
    border-radius: 0.25rem;
    position: fixed;
    bottom: 20px;
    right: 20px;
    z-index: 1050;
    text-align: center;*/
}
.trCaption td {
    height: 35px;
    padding: 5px;
    background-color: darkslategrey;
    color: orange;
    border: #c1dad7 5px solid;
    font-weight: bold;
    font-size: medium;
    text-align: left;
}

.trTotal td {
    height: 35px;
    padding: 5px;
    background-color: darkslategrey;
    color: orange;
    border: #c1dad7 1px solid;
    border-bottom: #c1dad7 5px solid;
    font-weight: bold;
    font-size: medium;
    text-align: center;
}

    .trTotal td:first-child {
        text-align: right;
    }
.trth {
    border: #c1dad7 5px solid;
}
.trth td {
    height: 35px;
    padding: 5px;
    background-color: #205081;
    color: White;
    border: #c1dad7 1px solid;
    border-bottom: #c1dad7 5px solid;
    font-weight: bold;
    font-size: medium;
    text-align: center;
}
.timesp {
    border: none;
    background-color: rgb(232, 240, 254);
    text-align: center;
    /*  margin: 0 auto; */
    width: 25px;
    color: inherit;
    font-weight: bold;
    font-size: 28pt;
    margin-left: 1px;
    margin-right: 1px;
    /*  height: 100px;
        width: 100px;
        background: red;
        margin: 10px;
        text-align: center; */
    display: table-cell;
    vertical-align: middle;
}
.cypher-select-custom {
    border: 2px solid #007bff;
    background-color: #f9f9f9;
    color: #333;
    border-radius: 8px;
    padding: 6px 12px;
    font-size: 1rem;
}
.cypher-select-custom option:nth-child(odd) {
    background: #f4f8fc;
    color: #102a43;
}

.cypher-select-custom option:nth-child(even) {
    background: #ffffff;
    color: #102a43;
}

.cypher-select-custom  option:checked {
    background: #dceeff;
    color: #001f3f;
}
    .cypher-select-custom option:hover {
        background-color: #007bff;
         /* Blue for the selected option */
         color: #fff; /* White text for the selected option */
    }
    .cypher-select-custom option {
        transition: background-color 0.15s ease, color 0.15s ease;
    }

        .cypher-select-custom option:nth-child(odd) {
            background: #f4f8fc;
            color: #102a43;
        }
/* light icy blue */
 .cypher-select-custom option:nth-child(even) {
    background: #ffffff;
    color: #102a43;
}

/* Hover = brighter, subtle highlight */
 .cypher-select-custom option:hover {
    background: #e2f0ff; /* soft sky-blue tint */
    color: #0a2540;
}

/* Checked (selected) = deeper, stronger contrast */
 .cypher-select-custom option:checked {
    background: #b3daff; /* solid selection blue */
    color: #001f3f;
    font-weight: 600; /* subtle emphasis */
}

/* Smooth transitions for UX polish */
 .cypher-select-custom option {
    transition: background-color 0.15s ease, color 0.15s ease;
}