@import url('https://fonts.googleapis.com/css2?family=Mulish:wght@200;300;400;500;600;700;800;900');

html { position: relative; min-height: 100%; }
body { font-family: 'Mulish', sans-serif; /*font-size: 0.9rem;*/ font-size: 14px; background-color:#fff; padding-bottom:80px; animation-name: fadeIn; animation-duration: 1s;}
h1,h2,h3,h4,h5,h6{ font-family: 'Mulish', sans-serif; }

a { color:#0473d5; text-decoration: none; transition: all 0.5s ease 0s; } 
a:hover{transition: all 0.5s ease 0s; color:#666;}
p { font-family: 'Mulish', sans-serif; }

.small { font-size: 0.7rem;  }
.noradius { border-radius: 0; }
.noborder { border: 0 !important; }
.radius-circle { border-radius: 50px;  }  
label { font-weight: 500; }
.label { display: inline-block; padding: 0.2em 0.6em; font-size:14px; font-weight: bold; color: #ffffff; text-align: center; white-space: nowrap; vertical-align: baseline; border-radius: 0.25rem; border-radius:2px;}
.label:empty { display: none; }
img { vertical-align: middle; border: 0; }
.bg-log{ border: 15px solid transparent; border-image-slice: 1; width:100%; display:flex; }
.pwd-by{ position:absolute; right:25px; bottom:25px;}
.naactitle{ font-size: 25px;  text-align: center;  padding: 5px 0;  margin: 0px -18px 0px -18px;   font-weight: 600;  background: #4194f3;  color: #fff;}

.cirls{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; padding: 0; margin: 0; }
.cirls li{ position: absolute; display: block; list-style: none; width: 20px; height: 20px; background: rgba(255, 255, 255, 0.15); animation: animate 25s linear infinite; bottom: -150px; }
.cirls li:nth-child(1){ left: 25%; width: 80px; height: 80px; animation-delay: 0s; }
.cirls li:nth-child(2){ left: 10%; width: 20px; height: 20px; animation-delay: 2s; animation-duration: 12s; }
.cirls li:nth-child(3){ left: 70%; width: 20px; height: 20px; animation-delay: 4s; }
.cirls li:nth-child(4){ left: 40%; width: 60px; height: 60px; animation-delay: 0s; animation-duration: 18s; }
.cirls li:nth-child(5){ left: 65%; width: 20px; height: 20px; animation-delay: 0s; }
.cirls li:nth-child(6){ left: 75%; width: 110px; height: 110px; animation-delay: 3s; }
.cirls li:nth-child(7){ left: 35%; width: 150px; height: 150px; animation-delay: 7s; }
.cirls li:nth-child(8){ left: 50%; width: 25px; height: 25px; animation-delay: 15s; animation-duration: 45s; }
.cirls li:nth-child(9){ left: 20%; width: 15px; height: 15px; animation-delay: 2s; animation-duration: 35s; }
.cirls li:nth-child(10){ left: 85%; width: 150px; height: 150px; animation-delay: 0s; animation-duration: 11s; }
@keyframes animate {
0%{ transform: translateY(0) rotate(0deg); opacity: 1; border-radius: 0; }
100%{ transform: translateY(-1000px) rotate(720deg); opacity: 0; border-radius: 50%; }
}

.ldrimg{ position: absolute; left: 0; top: 0; z-index: 9; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: rgba(50, 50, 50, 0.4);}
.image_loader{ position: absolute; left: 0; top: 0; z-index: 9; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: rgba(50, 50, 50, 0.4);}
 
.footer-main{ position: fixed; z-index: 99; width: 100%; margin-top:0px; bottom:00px; border-top: 1px solid rgb(217, 217, 217); background-color: #f0f0f0; transition: 0.4s;}
.main-footer { padding: 15px 20px 15px; font-weight: 400; display: flex; align-items: center; justify-content: space-between}
.main-footer span{ display:block;}
.main-footer span.cptext{ font-size: 13px; color: #555; margin: auto;}
.enlarged .footer-main{ padding-left: 65px; transition: 0.4s;}
.enlarged .body-content{ min-height: 980px; transition: 0.4s;}
.bootstrap-duallistbox-container .filter{ margin-top:8px;}
.modal-dialog{ max-width:950px; margin-top: 70px; animation-name: zoomIn; animation-duration: 1s;}
.mdl-frm{ padding:15px;}
.modal-header{ color:#333; padding: 15px 15px;}
.modal-header h4{ font-size:17px; text-transform: uppercase}
.modal-header .close{ color:rgba(0,0,0,0.7) !important;}

.table-responsive1{ width: 100%; display: flex; flex-wrap: wrap; }
.table-responsive1 .btn-group-vertical > .btn, .btn-group > .btn{ width: 100%; background: #fff; font-size: 15px; color: #333; border: 1px solid #e4e4e4; border-radius: 4px; text-align: left; display: flex; justify-content: space-between; align-items: center;}
.btn-group, .btn-group-vertical{ display: block;}
.multiselect-container{ width: 100%;}
.multiselect-container > li > a > label{ padding: 3px 20px 3px 20px !important;}

.tab-content{ font-size: 16px; padding: 20px 25px; background: ghostwhite; border: #dfdff5 1px solid; border-top: #e56611 3px solid;}
.tab-content h2{ font-size: 20px; color: #012d50; font-weight: 600; margin-top: 10px;}
.tab-content p{ font-size: 16px; line-height: 20px; margin-bottom: 30px;}
.nav-tabs .nav-link{ margin: 3px 2px 0px; background: aliceblue; border: #ddecf8 1px solid; border-bottom: 0px;}
.nav-tabs{ border-bottom: 0px; transition: 0.6s;}
.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{ background: #e56611; border: 0px; color: #fff; margin-top: 1px; padding: 10px 17px; transition: 0.6s;}

.mdl-head{ text-align:left; font-size: 22px;}
.mdl-head h4{font-size: 22px;}
.mdl-gender .modal-dialog{ max-width:370px !important;}
.mdl-gender1{ font-size:16px; color:#333; text-align:left; border-top: 4px solid #e5e4e4; border-radius: 3px; background:#f7f7f7; padding: 18px 15px;}
.mdl-gender2{ border-bottom:4px solid #e5e4e4; border-radius:0px 0px 3px 3px; border-top:1px solid #e7e7e7;}

.pgntion{ margin-top:20px; padding:0px 10px;}
.page-link{ padding:5px 10px; font-size:14px;}
.pgn-lft{ display:flex; align-items:center;}
.pgn-rht{ display:flex; justify-content:flex-end; align-items:center;}
.pgn-rht ul{ margin:0px;}
.rht{text-align:right; padding-right:0 !important;}

.helpcon{}
.helpcon h1{ font-size: 16px;  color: red;  font-weight: bold;  padding-bottom: 00px;  background: #eee;  padding: 6px 20px;  border-radius: 40px;}
.helpcon ul{font-size: 14px; padding: 5px 15px 15px 15px;}
.helpcon ul li{ padding: 5px 0px;}
.helpcon ul li strong{ color: #1a2f9b;}
.helpcon ul li a{ color: #ff4d4f; text-decoration: underline;}

.head-time{ background-color: #f3f3f3;  padding: 5px 15px; margin-right: 15px; border-radius: 30px; min-width:180px; text-align:left; font-size: 13px; color: #555;}
.head-time i{ color: #b3b5b7; }

.bootbox-error .modal-header { background-color: #ff4d4f;}
.bootbox-error .modal-header h5{ color: #fff;}
.bootbox-error .modal-dialog{ width: 700px; margin-left: auto; margin-right: auto; }

.bootbox-success .modal-header{ background-color: #52c41a; }
.bootbox-success .modal-header h5{ color: #fff;}
.bootbox-success .modal-dialog{ width: 700px;}

.bootbox-info .modal-header{ background-color: #1890ff; }
.bootbox-info .modal-header h5{ color: #fff;}
.bootbox-info .modal-dialog{ width: 700px;}

.bootbox-warning .modal-header{ background-color: #faad14; }
.bootbox-warning .modal-header h5{ color: #fff;}
.bootbox-warning .modal-dialog{ width: 700px;}

.alert{ margin-left:30px; margin-right: 30px; }
.alert .close{ color: #000 !important; padding: .55rem 1.25rem !important;}

button.close { color: rgba(255,255,255,0.7) !important; }
.modal-title1{ color:#fff; font-size:20px;}
.modal-content{ border-radius: 15px 15px 15px 15px; box-shadow: 10px solid rgba(0,0,0,0.2); border: 1px solid rgba(0,0,0,0.05);}
#myModalEdit .modal-body iframe .body-content{ min-height:300px !important}

/* Dropdown Box */
.drp-box{ width: 100%; background-color: #d60000; padding: 10px; position: relative; top: 0; z-index: 0; transition: 0.6s;}
.drp-box:before{ position: absolute; content: ""; background-color:#c50000; width: 100%; height: 1px; left: 0; top: 0; z-index: -9; visibility: hidden; opacity: 0; transition: 0.6s; border-bottom: 2px solid #c82929;}
.navbar-custom .dropdown-menu:hover .drp-box:before{ visibility: visible; opacity: 1; height: 100%; transition: 0.6s; border-bottom: 2px solid #c82929;}
.drp-box .drp-head{ width: 100%; display: flex; align-items: center;}
.drp-box .drp-head span{ width:34px; height: 34px; background-color: #fff; border-radius: 50px; display: flex; align-items: center; justify-content: center; padding: 4px;}
.drp-box .drp-head span img{ width: auto; height: auto; object-fit: contain; border-radius: 50px; }
.drp-box .drp-head ul{ width: 80%; padding: 0; margin-left: 6px;}
.drp-box .drp-head ul li{ list-style: none; display: flex; align-items: center; width: 100%; flex-wrap: wrap; line-height: 1.3;}
.drp-box .drp-head ul li b{ width: 100%; text-transform:uppercase; font-size: 13px; font-weight: normal; color: #fff;}
.drp-box .drp-head ul li small{ width: 100%; font-size: 12px; color: #fff;}
.navbar-custom .dropdown-menu .drp-logout{ width: 100%; display: flex; justify-content: center; align-items: center; padding:12px 0px 4px; border-top: 2px solid #f5f5f5;}
.navbar-custom .dropdown-menu .drp-logout a i{ font-size: 12px; margin-right:2px;  transition: 0.4s; color: #555; transition:0.6s; animation: shake 3s cubic-bezier(.6,.05,.05,.07) both infinite;  transform: translate3d(0, 0, 0);}
.navbar-custom .dropdown-menu .drp-logout a{ background-color: #808080; border: 1px solid #808080; padding:4px 14px 4px 12px; border-radius: 50px; text-align: center; text-transform: uppercase; color: #fff; font-size: 12px; transition: 0.4s;}
.navbar-custom .dropdown-menu .drp-logout a:hover{ background-color: transparent; border: 1px solid #d0d0d0; color: #ff0000;}
.navbar-custom .dropdown-menu .drp-logout a:hover i{ color: #ff0000;}
@keyframes shake {
  10%, 90% {
    transform: translate3d(-1px, 0, 0);
  }
  
  20%, 80% {
    transform: translate3d(1px, 0, 0);
  }

  30%, 50%, 70% {
    transform: translate3d(-2px, 0, 0);
  }

  40%, 60% {
    transform: translate3d(2px, 0, 0);
  }
}

.myorg{ max-width:850px !important;}
::-webkit-scrollbar { width: 12px; height: 12px;}
::-webkit-scrollbar-track { background: rgba(0, 0, 0, 0.2);}
::-webkit-scrollbar-thumb { background: rgba(0, 0, 0, 0.6);}
.breadcrumb-holder { margin:0px 0px 3px; padding:15px 30px 8px; display: flex; align-items: center; justify-content:space-between; position: relative;}
.breadcrumb-holder .main-title { margin-bottom: 0; font-size:16px; display: flex; align-items: center; color:#1a2860; font-weight:800; text-transform:uppercase; margin-top: 00px;}
.breadcrumb-holder .main-title i{ padding-right:8px; font-size:16px; color:#1a2860;}
.tbl-title { width: 100%; display: flex; justify-content: space-between; margin-bottom: 15px;}
.tbl-title .main-title { margin-bottom: 0; font-size:15px; display: flex; align-items: center; color:#444; font-weight:500; text-transform:uppercase; position: relative; padding-bottom: 6px;}

.breadcrumb-holder .toplnk{ background: gainsboro; border-radius: 5px;}
.breadcrumb-holder .toplnk:hover{ background: aquamarine; cursor: pointer;}
.breadcrumb-holder .toplnk a{ padding: 5px 10px 5px 6px; margin: 0px; line-height: 1;}
.breadcrumb-holder .toplnk a i{ padding-right: 5px; font-size: 15px;}

.card{ border:none;}
.card-box { padding:17px 17px 0px; background-clip: padding-box; margin-bottom:20px; background-color: #fff; border:1px solid rgba(183,183,183,.125);}
.card-box i { font-size:67px; margin-top: 20px; }
.card-header { color: #fff; background-color:#808285; border-bottom: 1px solid rgba(111,111,111,.13); padding:10px 20px; text-transform:uppercase; font-size:14px;}
.card-header h3 { font-weight: 500; font-size:15px; margin-bottom: 0; line-height:1.6;}
.header-title { font-size: 1rem; text-transform: uppercase; }
.page-header { margin-top: 30px; margin-bottom: 20px; font-size: 1.15rem; padding-bottom: 10px; border-bottom: 1px solid #dedede; }
.button-list { margin-bottom: -5px; margin-left: -7px; }
.button-list button, .button-list a { margin: 5px 7px; }
.card-title{ color:#565656; animation-name: slideInLeft; font-weight:400;}
.card-footer{ background-color:transparent}

.card-head{ color: #6b6b6b; padding-bottom:15px; margin-bottom:25px; border-bottom:1px dotted #ccc;}
.card-head h3 { font-weight: 500; font-size: 1.1rem; margin-bottom: 0; line-height:1.3;}
.card-head h3 i{ font-size:1.0; padding-right:5px;}
.count{ padding:0 !important; display:flex;}
.tbl{ padding:0 !important;}
.no-padding{ padding:0 !important;}

canvas { max-width: 100%; }
svg { max-width: 100%; }
a { outline: none !important; text-decoration: none !important; transition: 0.4s; margin-bottom: 2px;}
.row { margin-right: -10px; margin-left: -10px; }
.col, .col-1, .col-10, .col-11, .col-12, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-lg, .col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-md, .col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-sm, .col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-xl, .col-xl-1, .col-xl-10, .col-xl-11, .col-xl-12, .col-xl-2, .col-xl-3, .col-xl-4, .col-xl-5, .col-xl-6, .col-xl-7, .col-xl-8, .col-xl-9 { padding-right: 10px; padding-left: 10px; }
.nav-pills .nav-item.show .nav-link, .nav-pills .nav-link.active { background-color: #0f9df7; }
.dropdown-item { font-size: 0.9rem; white-space: inherit; }
.dropdown-item:focus, .dropdown-item:hover{ color: #eb1c27;}

.card-inner-header { color: #666; background: linear-gradient(#fef8f8, #ffffff); border-bottom: 1px solid rgba(111,111,111,.13); }
.card-inner-header h3 { font-weight: 500; font-size: 1.1rem; margin-bottom: 0; line-height:1.3; padding:10px 10px 10px; margin-bottom:5px;}
.card-inner-header h3 i{ font-size:1.0; padding-right:5px;}

/* IE9, IE10, IE11 */
@media screen and (min-width: 0\0) {
.form-control {
padding: 0.55rem 0.75rem !important;
}
.input-group-addon {
line-height: inherit !important;
font-size: 1rem !important;
}
.carousel-control span {
right: 20px;
}
}

.optrow{ display: flex; flex-direction: row; justify-content: space-between;}
.optrow1{ display: flex; flex-direction: row; justify-content: center;}

.panel-body .btn-lg{ padding: 6px 10px;}

.headerbar { left:0;position:fixed; right:0; top: 0; z-index:9; background: #4194f3;}
.headerbar .headerbar-left { background:#4194f3; text-align:center; width:100%; z-index:1; display: flex; flex-direction: column;}
.headerbar .headerbar-left .menu-left{ z-index: 9; position: relative; display: flex; align-items: center;}
.headerbar .headerbar-left .menu-left:before { position: absolute; content: ""; background-color: #d60000; top: 0px; left: 0; width: 45px; height: 101%; z-index: -9; }
.headerbar .headerbar-btm{ position: relative ; transition: 0.4s;}
.headerbar .headerbar-left .logo{ align-items: center;}
.headerbar .headerbar-left .logo img {  width: 735px;  height: 110px;  padding: 3px 0px;  object-fit: contain; margin-left: 3px;}
.navbar-custom { background-color: #fff;  border-radius: 0; margin-bottom: 0; padding:12px 17px 10px; margin-left:190px; min-height:62px; display: flex; justify-content:flex-end; align-items: center; position: relative; transition: 0.4s; /*box-shadow: 0 14px 15px -12px rgba(91, 91, 91, 0.44);*/ }

.headerbar .headerbar-left .titbar{ background: rgb(0, 67, 128);  padding: 10px 15px;  color: #fff;  font-size: 18px;  font-weight: 800;  align-items: center;  display: flex;  flex-direction: row;  justify-content: space-between;  border-top: #0a5597 1px solid; }
.headerbar .headerbar-left .titbar a{ text-transform: none;  display: flex;  flex-direction: row;  align-items: center;  margin-right: 3px;}
.headerbar .headerbar-left .titbar div{ display: flex;}
.headerbar .headerbar-left .titbar div i{ margin-right: 3px;}

.headerbar .helplink{ font-weight: 400; font-size: 15px; color: #fff; margin-left: 5px;}
.headerbar .helplink > i{ font-size: 23px; color: #fff;}
.headerbar .helplink:hover{ color: yellow;}
.headerbar .helplink:hover > i{ color: yellow;}

.stky { padding:0px 0; position: -webkit-sticky; transition: 0.4s; }
.sticky { position: fixed; width: 100%; left: 0; top: 0; z-index: 99999; border-top: 0; padding:0px; transition: all 0.6s; transition: 0.4s; }
.sticky .navbar-custom{ background-color: #fff; transition: 0.4s; padding:7px 17px 5px; box-shadow:0 14px 15px -12px rgba(91, 91, 91, 0.44); }
.sticky .headerbar-btm{ box-shadow: 0 14px 10px -12px rgba(91, 91, 91, 0.44);}
 
.navbar-custom .xbtn-srch{ margin-right:10px; padding:2px 15px; border-radius:50px;}
.navbar-custom .nav-link { padding: 0 !important; line-height:54px; color: #e9f2ff; font-size:20px; }
.navbar-custom .nav-link .tlogdwn{ border-radius:50px; display:flex; align-items:center; line-height: normal; padding:3px 3px; transition: all 0.5s ease 0s; margin-top:0px; background-color: rgba(120, 120, 120, 0.5); width: 35px; height: 35px; justify-content: center; position: relative;}
.navbar-custom .nav-link .tlogdwn:before{ width:11px; height:11px; border-radius:50px; background-color:#00e676; content: ""; position: absolute; right:-2px; bottom:-2px; border:2px solid#fff;}
.navbar-custom .nav-link .tlogdwn i{ padding: 0 6px; color: #aaa; margin-top:1px;}
.list-inline-item:hover .nav-link .tlogdwn{ background-color:rgba(221, 221, 221, 0.95); transition: all 0.5s ease 0s;}
.list-inline-item:hover .nav-link .tlogdwn i{ color: #fff;}
.navbar-custom .dropdown-toggle:after { content: initial;}
.navbar-custom .menu-left { overflow: hidden; }
.navbar-custom .dropdown-menu{ animation-name: zoomIn; animation-duration: 0.5s; -webkit-box-shadow: 0 5px 25px 0 rgba(0,0,0,.1); box-shadow: 0 5px 25px 0 rgba(0,0,0,.1); transition: 0.8s; border-bottom: 1px solid #ebebeb;}

.navbar-custom .nav-lst{ margin-right:15px;}
.navbar-custom .nav-lst .dropdown .btn-nav{ background-color:#888; color:#fff; padding:5px 12px; font-size:12px; box-shadow:none; text-transform:uppercase; border-radius:50px;}
.navbar-custom .nav-lst .dropdown .btn-nav i{ padding-left:2px;}
.navbar-custom .nav-lst .dropdown .dropdown-menu{ top:10px}
.navbar-custom .nav-lst .dropdown .dropdown-item{ font-size:13px; padding:5px 10px; border-bottom:1px solid #dedede;}
.navbar-custom .nav-lst .dropdown .dropdown-item:last-child{ border-bottom:0 none}

.crp-btn{ width:100%;}
.crp-btn{ text-align:right; padding-right:0px; margin-bottom:10px;}
.crp-btn button{ border:0; width:35px; height:35px; border-radius:50px; margin:1px; background:#d9d9d9; transition:0.4s; cursor:pointer;}
.crp-btn button i{ font-size:14px; color:#666; text-align:center; padding-top:4px; transition:0.4s}
.crp-btn button:nth-child(2):hover i{ color:#ff0000; transition:0.4s; transform:rotate(50deg);}
.crp-btn button:nth-child(1):hover i{ color:#ff0000; transition:0.4s; transform:rotate(-50deg);}
#thumbnail_preview .cr-boundary{ width: 100% !important}

.logo { display: flex;  text-align: center;  justify-content: center;  width: 100%;  background-color: #fff;  flex-direction: column;  margin-bottom: 0px;}
.logo span span { color: #fff; }
.main-sidebar { top:60px; width:470px; z-index:1; bottom:85px; margin-bottom:-70px; margin-top:0; padding-bottom:0px; position:absolute; transition:all 0.5s ease 0s; padding-top:0px; border-top: 2px solid #f0f0f0; }
.content-page { margin:165px auto 0px; transition: all 0.5s ease 0s; position:relative}
.content-page .content { padding: 0 3px; margin-top:10px; margin-bottom:0px; position: relative; background: #fff;}
.content-page .content:before{ position: absolute; top: 0px; left: 0; width: 100%; height:270px; transition: .3s ease all; /*background: -webkit-linear-gradient(-180deg, #7b7979,#f0f1f7) !important; background: linear-gradient(-180deg, #7b7979,#f0f1f7) !important; */background-color: #fff; content: ""; /*border-bottom: 3px solid #fff; */ -webkit-transition: .3s ease all; -moz-transition: .3s ease all; -ms-transition: .3s ease all; -o-transition: .3s ease all;  }

.content-page .content .card-body{ padding:5px 5px 0px;}
.full-page{ margin-left: 0;}
.full-page .content{ margin-top: 0;}
.full-page .body-content{ min-height: 400px;}
.full-page .body-content .tbl-frm { padding: 0;}
.full-page .inner-banner{ background-color: #fff;}
.btn-mdl{ background-color: #0283d6; border-color: #0283d6; color: #fff; border-radius: 50px; padding: 5px 30px; margin: 3px 0px;}
.btn-mdl i{ padding-right: 5px;}

.main-sidebar.left { position: absolute; }
body.adminbody .main-sidebar.left { bottom: 0px; margin-bottom: 0px; margin-top:1px; padding-bottom: 0px; z-index: 1051; background-color: #1a2860; position: fixed; height: 100%; transition: 0.8s; -webkit-transition: 0.8s; /*overflow: auto;*/ scrollbar-width: thin; scrollbar-color:transparent transparent; padding-right:0px; padding-top: 15px;}
body.adminbody .main-sidebar.left:before{ position: absolute; content: ""; background-color:#6a6a6a; top: 0px; left: -40px; width: 38px; height:100%;}
body.adminbody .main-sidebar.left:hover{ overflow: auto; scrollbar-width: none; scrollbar-color:transparent transparent; transition: 0.8s; -webkit-transition: 0.8s; }
.button-menu-mobile { color:#fff; font-size:16px; margin-right: 0px;  cursor: pointer; display: inline-block; overflow: hidden; vertical-align: middle; z-index: 1; transition:0.4s; background:transparent; margin-top:5px; height:32px; width:36px; display: flex; justify-content: center; align-items:center; border: 0;}
.button-menu-mobile:hover { color:#bbb; transition:0.4s;}
.sidebar-inner { height:100%; background:#1a2860; background-size: cover; transition: 0.4s;}

::-webkit-scrollbar { width: 5px;}
::-webkit-scrollbar-thumb { background: #fff; height: 30px; }
::-webkit-scrollbar-track { background: #fff; border: 0px none #fff; border-radius: 53px; }
.clr-case-tag{ color: #d07a1a; font-weight: 500; margin: 0px 2px; font-size: 14px;}
.inner-top-exp{ width: 100%; display: flex; justify-content: space-between;}

.clt-lst ul li:nth-child(1), .clt-lst ul li:nth-child(2), .clt-lst ul li:nth-child(3), .clt-lst ul li:nth-child(4){ width:49% !important;}
.tk-icn:before{ content:"\f068"; }
.collapsed.tk-icn:before{ content:"\f067";}
.hiddenRow { padding: 0 4px !important; }

/* Sidebar */
.body-content{ min-height:140vh; margin-top: 00px; margin-bottom: 10px !important; padding:10px 20px 20px; border-radius: 6px 6px 0px 0px; }
#sidebar-menu, #sidebar-menu ul, #sidebar-menu li, #sidebar-menu a { border: 0; font-weight: normal; line-height: 1; list-style: none; margin: 0; padding:120px 0px 0px 0px; position: relative; text-decoration: none;}
#sidebar-menu ul{ position: relative; padding: 0;}
.main-sidebar.left:before{ position: absolute; content: ""; background-color: #d60000; top: 0px; left: 0; height:100%;}
/*#sidebar-menu li:first-child{ padding-top: 1px;}*/
#sidebar-menu li{ /*border-top:1px solid #eee;*/ text-align:left; padding: 0px 0px; margin: 5px 0px; position: relative;}
/*#sidebar-menu li::before{position: absolute; content: ""; background-color: #fff; top: -15px; left: 0px; width: 100%; height: 15px; border-radius: 0px 0px 40px 0px;}
#sidebar-menu li::after{position: absolute; content: ""; background-color: #fff; top: 47px; left: 0px; width: 100%; height: 15px; border-radius: 0px 0px 40px 0px;}*/
/*#sidebar-menu li:first-child::before{ position: absolute; content: ""; background-color: #fff; top: -10px; left: 0px; width: 100%; height: 15px; border-radius: 0px 0px 40px 0px; -webkit-border-radius: 0px 0px 40px 0px; -moz-border-radius: 0px 0px 40px 0px; -ms-border-radius: 0px 0px 40px 0px; -o-border-radius: 0px 0px 40px 0px; }
#sidebar-menu li:first-child::after{position: absolute; content: ""; background-color: #fff; top: 35px; left: 0px; width: 100%; height: 15px; border-radius: 0px 40px 0px 0px;}*/
#sidebar-menu { padding-bottom:200px; width: 100%; /*background:#fff; */ }
#sidebar-menu:before{ position: absolute; content: ""; background-color: #d60000; top: -20px; left: 0; width:45px; height:100%;}
#sidebar-menu a { line-height: 1.3; }
#sidebar-menu ul li .menu-arrow { -webkit-transition: -webkit-transform .15s; -o-transition: -o-transform .15s; transition: transform .15s; position: absolute; right:10px; top:7px; display: inline-block; font-family: 'FontAwesome'; text-rendering: auto; line-height:20px; font-size:14px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); }
#sidebar-menu ul li .menu-arrow:before { /* content: "\f105"; font-family: 'FontAwesome';*/ background-color: #fff;
font-weight: 400; text-transform: uppercase; padding: 0px 4px 0px 7px; font-size: 10px; width: 85px; content: "";  
-webkit-clip-path: polygon(73% 9%, 100% 50%, 71% 92%, 55% 92%, 85% 50%, 57% 9%); clip-path: polygon(73% 9%, 100% 50%, 71% 92%, 55% 92%, 85% 50%, 57% 9%);}
#sidebar-menu ul li a.subdrop .menu-arrow { -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg); }


#sidebar-menu ul li .menu-arrow1 { -webkit-transition: -webkit-transform .15s; -o-transition: -o-transform .15s; transition: transform .15s; position: absolute; right:10px; top:1px; display: inline-block; font-family: 'FontAwesome'; text-rendering: auto; line-height:18px; font-size:14px; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -webkit-transform: translate(0, 0); -ms-transform: translate(0, 0); -o-transform: translate(0, 0); transform: translate(0, 0); }
#sidebar-menu ul li .menu-arrow1:before { /* content: "\f105"; font-family: 'FontAwesome';*/ background-color: #6c6c6c;
font-weight: 400; text-transform: uppercase; padding: 0px 4px 0px 7px; font-size: 10px; width: 85px; content: "";  
-webkit-clip-path: polygon(73% 9%, 100% 50%, 71% 92%, 55% 92%, 85% 50%, 57% 9%); clip-path: polygon(73% 9%, 100% 50%, 71% 92%, 55% 92%, 85% 50%, 57% 9%);}
#sidebar-menu ul li a.subdrop .menu-arrow1 { -ms-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); transform: rotate(90deg);}

#sidebar-menu ul ul { display: none; }
#sidebar-menu ul ul li { border-top: 0; position:relative; /*border-top:1px solid #f0f0f0 !important;*/ padding-bottom: 2px;}
/* #sidebar-menu ul ul li:before{ position:absolute; width:1px; height:60%; content:""; left:22px; top:6px; background-color:#e4e4e4; }*/
#sidebar-menu ul ul li.active a { color: #f3f3f3; }
#sidebar-menu .submenu .list-unstyled { background-color: #eee; border-radius: 5px 0px 0px 5px; padding-top: 1px; z-index: 2; margin-left: 10px; -webkit-border-radius: 15px 0px 0px 15px; -moz-border-radius: 5px 0px 0px 5px; -ms-border-radius: 5px 0px 0px 5px; -o-border-radius: 5px 0px 0px 5px; }
#sidebar-menu .submenu .list-unstyled li{ position: relative; margin: 2px 0px 2px;}
#sidebar-menu .submenu .list-unstyled li:before{ position: absolute; width:79%; height: 1px; background-color:#fff; content: ""; left:39px; bottom: 0; position:absolute; transition: 0.6s;}
#sidebar-menu .submenu .list-unstyled li:last-child:before{ background-color: transparent;}

#sidebar-menu .submenu .list-unstyled:before{ width:35px; height: 100%; background-color:#6a6a6a; content: ""; left: 0; bottom: 0; position:absolute; transition: 0.6s; border-radius: 15px 0px 0px 15px; -webkit-border-radius: 15px 0px 0px 15px; -moz-border-radius: 15px 0px 0px 15px; -ms-border-radius: 15px 0px 0px 15px; -o-border-radius: 15px 0px 0px 15px; }

#sidebar-menu ul ul a { color:#4d4b4b; -webkit-transition: all 0.3s ease-out; -moz-transition: all 0.3s ease-out; -o-transition: all 0.3s ease-out; -ms-transition: all 0.3s ease-out; transition: all 0.3s ease-out; display:flex; padding:4px 3px 4px 20px; animation:none; font-size:13px; text-align:left; line-height:1.3; position: relative; overflow: hidden; z-index: 0;}
#sidebar-menu ul ul a.active{ background-color:#eee; color:#ff0000; border-radius: 50px 0px 0px 50px; display: flex}
#sidebar-menu ul ul a.active i{ color: #ccc;}

#sidebar-menu ul ul a:before{ width: 1%; height: 100%; background-color:#e5e5e5; content: ""; left: 0; bottom: 0; position:absolute; border-radius:15px 0px 0px 15px; visibility: hidden; transition: 0.6s; z-index: -9; margin-left: 5px; -webkit-border-radius:15px 0px 0px 15px; -moz-border-radius:15px 0px 0px 15px; -ms-border-radius:15px 0px 0px 15px; -o-border-radius:15px 0px 0px 15px; }
/*#sidebar-menu ul ul a:after{ width: 3px; height: 100%; background-color:#a8a8a8; content: ""; left: 0; bottom: 0; position:absolute;  border-radius:0px 5px 5px 0px; transition: 0.6s; z-index: -9}*/
#sidebar-menu ul ul a:hover:before{ width: 100%; visibility: visible; width: 100%; left: 0; transition: 0.6s; border-radius:15px 0px 0px 15px; -webkit-border-radius:15px 0px 0px 15px; -moz-border-radius:15px 0px 0px 15px; -ms-border-radius:15px 0px 0px 15px; -o-border-radius:15px 0px 0px 15px; -webkit-transition: 0.6s; -moz-transition: 0.6s; -ms-transition: 0.6s; -o-transition: 0.6s; }
#sidebar-menu ul ul a.active:hover:before{ background-color:transparent;}
#sidebar-menu ul ul a:hover { color:#ff0000; transition: all 0.5s ease 0s; animation:none}
#sidebar-menu ul ul li a i{ margin-right:0; color: #b5b5b5; font-size:12px; margin-left:-4px; margin-top:-2px; display:inline-block; padding-right:28px; width:auto; height:auto; padding-bottom:2px; padding-top:5px;}
#sidebar-menu ul ul li a i{ background-color:transparent}
#sidebar-menu ul ul li a:hover i { color: #b9b8b8; animation:none; background-color:transparent}
#sidebar-menu ul ul ul a { padding-left:18px;}
#sidebar-menu ul ul ul a.active{ background-color:#eee; color:#353535; border-radius: 50px 0px 0px 50px; display: flex}
#sidebar-menu .label { margin-top: 2px;}
#sidebar-menu .subdrop { color: #555 !important; /*background: -webkit-linear-gradient(45deg,#0f0e9f,#7b1fa2); background: linear-gradient(45deg, #303f9f,#7b1fa2); transition:0.4s;*/ background-color: #fff; border-radius: 20px 0px 0px 20px; }
#sidebar-menu .subdrop span b{ color: #555;}
#sidebar-menu .subdrop:hover:before{ background-color: transparent}
#sidebar-menu .subdrop .menu-arrow:before { background-color: #555 !important;}
#sidebar-menu .subdrop .menu-arrow1:before { background-color: #b0b0b0 !important;}
#sidebar-menu .subdrop i { color: #555 !important; /*box-shadow: 0px 0px 20px #F0F0F0; background-color: rgba(0, 0, 0, 0.20); */}
#sidebar-menu .subdrop span small { color:#555!important; transition:0.4s; }
#sidebar-menu .submenu ul .submenu .menu-arrow { top: 10px !important; }
#sidebar-menu ul li ul li a.subdrop { color: #ff0000 !important; background: #ededed; transition:0.4s; }
#sidebar-menu ul li ul li a.subdrop i{ color: #999 !important; background-color:transparent !important }
#sidebar-menu ul li ul li:last-child{ border-bottom:0 none;}
#sidebar-menu ul li ul li ul li a.subdrop { color: #ff0000 !important; background-color: #ededed; transition:0.4s; }
#sidebar-menu ul li ul li ul li a.subdrop i { color:#999 !important; background-color:transparent !important}
#sidebar-menu ul li ul li ul li:last-child{ border-bottom:0 none;}
#sidebar-menu > ul > li > a { font-size: 16px; color: #fff; display:flex; padding:8px 8px 8px 3px; transition:0.6s; align-items: center; position:relative; overflow: hidden; transition: 0.6s; z-index: 1; transition: 0.4s; -webkit-transition:0.6s; -moz-transition:0.6s; -ms-transition:0.6s; -o-transition:0.6s; margin-left: 5px; }
#sidebar-menu > ul > li > a:before{ width: 1%; height: 100%; content: ""; right: 0; top: 0; position:absolute; border-radius:0px; visibility: hidden; transition: 0.6s; z-index: -9; background: linear-gradient(45deg, #fff,#fff);  }
#sidebar-menu > ul > li:hover > a:before{ width: 100%; visibility: visible; width: 100%; right: 0; transition: 0.6s;}
#sidebar-menu > ul > li > a.active:hover:before{visibility: visible !important;}
#sidebar-menu .submenu .list-unstyled li:hover:before{ display: none;}
#sidebar-menu .submenu .list-unstyled li:hover::after{ display: none;}

.stdetail{ width: 100%; margin-bottom: 20px;}
.stdetail > .accordion > .card{ width: 100%;}
.stdetail > .accordion > .card > .card-header { background: lightsteelblue; padding: 3px 5px; margin: 2px; border-radius: 5px;}
.stdetail > .accordion > .card > .card-header:hover { background: #c3e0ec;}
.stdetail > .accordion .titxt{ font-size: 16px; width: 100%; color: black; font-weight: 700; display: flex; flex-direction: row; align-items: center;  justify-content: space-between; padding: 5px 10px 2px 10px; text-decoration: none !important;}
.stdetail > .accordion .titxt:hover{ text-decoration: none;}

.stdetail > .accordion .titxt div{ font-weight: 400; font-size: 15px;}
.stdetail > .accordion .titxt span.yes{ background: green; color: #fff; padding: 2px 7px; border-radius: 3px;}
.stdetail > .accordion .titxt span.no{ background: red; color: #fff; padding: 2px 7px; border-radius: 3px;}

.modal-footer button{ margin: 0px 3px;}

/* LogIn Page */
.logarea{ display: flex; flex-direction: row;}
.loginbg{ bottom: 0px; margin-bottom: 0px; margin-top: 0; padding-bottom: 0px;  background: #fff; padding-top:0%; }
.login-card { border: 0 none; background-color: transparent; margin-bottom:30px; }
.logbg { text-align: center; background-color:#004b8e; display: flex; width: 100%; align-items: center; animation-name: slideInLeft; animation-duration: 1.5s;  }
.logbg .vcntr { width: 100%;  }
.logfrm { width: 45%; padding:10px 20px 10px; border-radius:0 15px 15px 0; box-shadow:30px 30px 30px -25px rgba(0,0,0,0.3); background: oldlace; border: #ece6db 1px solid; border-left: 0px; }
.logfrm .user{ text-align:center; margin:10px 0px 0px;}
.logfrm .user img{ border-radius: 50%; width: 125px; height: 125px; border: #f0f0f0 2px solid; padding: 5px; background: #fff;}
.logfrm h2{ text-align: center; margin: 15px 0px; font-size:20px; text-transform: uppercase; color:#1a2860; font-weight:800;}
.logfrm h3{ text-align: center; margin: 15px 0px; font-size:16px; color:red; font-weight:400;}
.logfrm p{ text-align: center; margin-bottom: 30px;}
.logfrm h4{ text-align: center; margin: 5px 0px 20px; font-size:16px; color:black; font-weight:400; background: #fff; padding: 20px; border-radius: 10px; border: #fff 1px solid;}
.logfrm .form-group span{ text-align:center; display:flex; margin-top:10px; justify-content: center;}
.logfrm .form-group span .btn-secondary{ padding:5px 25px 5px 23px; background-color:#83d47a; color:#333; border-radius:50px; border:1px solid #fff;}
.logfrm .form-group span .btn-secondary i{ margin-right:5px;}
.logfrm .form-group span .btn-secondary:hover{ transition:0.4s; color:#333; border:1px solid #4ca243;}
.logfrm .form-group span .btn-red{ padding:5px 25px 5px 23px; background-color:rgba(255, 0, 0, 0.5); color:#fff; border-radius:50px; border:1px solid #fff; margin:0px 3px;}
.logfrm .form-group span .btn-red:hover{ transition:0.4s; color:#fff; border:1px solid #F00;}
.logfrm .form-control{border: #ccc 1px solid; height: auto !important; padding: 8px 16px; background-color:transparent; border-radius: 50px; -webkit-border-radius: 50px; -moz-border-radius: 50px; -ms-border-radius: 50px; -o-border-radius: 50px; }
.logfrm .form-group label{ font-weight:500; color:#444;}

.loginterms { width: 50%; display: flex; align-items: center; text-align: center; justify-content: center; flex-direction: column; background-color: lavender; padding: 30px 20px; border: lavender 1px solid; border-radius: 15px 0 0 15px; background-size: cover; box-shadow: 30px 30px 30px -25px rgba(0,0,0,0.3);}
.loginterms h1{ color: #1a2860; font-size: 20px; font-weight: 800; border-bottom: #dddbc7 3px dotted; padding-bottom: 10px; margin-bottom: 10px;}
.loginterms ul{ padding: 0px; margin: 0px;}
.loginterms ul li{ list-style: none; padding: 5px 0;}
.loginterms ul li::before{margin: 0px 0 0 0; padding: 0 7px 0 0; color: #000; font-size: 18px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f105"; transition: all 0.5s ease 0s; width: 0;}
.loginterms img{ width: 50%;}
.loginterms .btn{ margin: 2px;}

.inslogo{ text-align: center;  padding: 10px;  margin: 10px 10px -13px 10px;  border-radius: 20px;}
.inslogo img{ width: 60%;}

.sfrlogo{ text-align: center; padding: 10px; padding-right: 70px;}
.sfrlogo img{ width: 60%;}

.logbg .brand { margin:0 0 20px; }
.logfrm .form-group{margin-bottom: 25px;}
.btn-shw { position:absolute; right:10px; top:50%; transform:translate(0,-50%); -webkit-transform:translate(0,-50%); -o-transform:translate(0,-50%); padding: 2px 7px; font-size:12px; cursor:pointer; background-color: #338c21; border-radius: 14px; border: 0 none; color:#fff; font-size:12px; -moz-transform:translate(0,-50%); -ms-transform:translate(0,-50%);  }
.pashw{position: relative;}
.frgt-pwd{ color:#ea2529; transition:0.4s;}
.frgt-pwd:hover{ color:#0f0e9f; transition:0.4s;}

#sidebar-menu > ul > li > a:hover { color:#000!important; text-decoration:none; transition: all 0.5s ease 0s; border-radius: 23px 0px 0px 20px; transition: 0.6s; -webkit-transition: all 0.5s ease 0s; -moz-transition: all 0.5s ease 0s; -ms-transition: all 0.5s ease 0s; -o-transition: all 0.5s ease 0s; -webkit-border-radius: 23px 0px 0px 20px; -moz-border-radius: 23px 0px 0px 20px; -ms-border-radius: 23px 0px 0px 20px; -o-border-radius: 23px 0px 0px 20px; }
#sidebar-menu > ul > li > a:hover span b{ color: #555; transition: 0.6s;}
#sidebar-menu > ul > li > a:hover #sidebar-menu li{ border-top: 0 none;}
#sidebar-menu > ul > li > a:hover .menu-arrow:before { background-color: #555 !important;}
#sidebar-menu > ul > li > a:hover .menu-arrow1:before { background-color: #555 !important;}
#sidebar-menu > ul > li > a:hover span small { color:#555!important; transition: all 0.5s ease 0s;}
#sidebar-menu > ul > li > a > span { vertical-align: middle;}
#sidebar-menu ul li a i { display:flex; color:#ececec; font-size:14px; margin-right:18px; text-align: center; vertical-align: middle;  transition:0.2s; width:28px; height:27px; /*border-radius:50px; background-color: rgba(76, 83, 134, 0.12);*/ justify-content: center; align-items: center}
#sidebar-menu ul li a:hover i { color: #555; /*background-color: rgba(0, 0, 0, 0.15);*/ transition: all 0.5s ease 0s;}
#sidebar-menu ul li a .drop-arrow { float: right; }
#sidebar-menu ul li a .drop-arrow i { margin-right: 0; }
#sidebar-menu > ul > li > a.active { color: #555 !important; border-radius: 20px 0px 0px 20px; background-color: #fff; /*border-right: 2px solid #d80b13;*/ }
/* #sidebar-menu > ul > li > a.active i{ background-color:rgba(0, 0, 0, 0.18); box-shadow:0px 0px 20px #F0F0F0; }*/
#sidebar-menu > ul > li > a.active .menu-arrow:before{ background-color: #555;}
#sidebar-menu > ul > li > a.active .menu-arrow1:before{ background-color: #555;}
#sidebar-menu > ul > li > a.active i { color: #333 !important; font-size:14px;}
#sidebar-menu > ul > li > a.active span small{ color: #555;}
#sidebar-menu > ul > li > a.active span b{ color: #555;}
#sidebar-menu > ul > li > a.pro { background-color: #f16854; color: #fff; bottom: 0; }

.sub-active{ display:block !important;}

.menu-title { padding: 12px 20px !important; letter-spacing: .035em; pointer-events: none; cursor: default; font-size: 13px; }
.footer { border-top: 1px solid rgba(115, 140, 152, 0.2); bottom: 0; color: #818a91; text-align: left !important; padding: 10px; position: absolute; right: 0; left: 250px; background-color: #fff; }

#main.enlarged .menu-title { display: none; }
#main.enlarged .menu-arrow { display: none !important; }
#main.enlarged .menu-arrow1 { display: none !important; }
#main.enlarged .footer { left: 70px; }
#main.enlarged #sidebar-menu ul ul { box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.1), 0 1px 10px 0 rgba(0, 0, 0, 0.08); }
#main.enlarged .left.main-sidebar { width:50px; height: 100%; z-index: 5; padding-right: 5px; background-color: #fff; transition: 0.4s; }
#main.enlarged .left.main-sidebar #sidebar-menu > ul > li > a { padding-left: 10px; transition: 0.4s; }
#main.enlarged .left.main-sidebar #sidebar-menu > ul > li > a:hover { background-color: #64b0f2; transition: 0.4s; }
#main.enlarged .left.main-sidebar span.pull-right { display: none !important; }
#main.enlarged .left.main-sidebar #sidebar-menu ul > li { position: relative; white-space: nowrap;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > a { background-color:#64b0f2; position:relative; width:260px; transition:0.4s;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > ul { display: block; left: 50px; position: absolute; width: 192px; background: #ffffff; animation-name: fadeInRight; animation-duration: 0.5s; padding: 2px 3px 2px 0px; }
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > ul a { background: #ffffff !important; border: none; box-shadow: none; padding-left: 15px; position: relative; width:auto; z-index: 6; color:#636363; }
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > ul a:before{ background-color: #e0e0e0; border-radius: 0px 5px 5px 0px;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > ul a:hover { color:#919191 !important; background-color:#f00; border-start-end-radius: 0px 5px 5px 0px;}
#main.enlarged .left.main-sidebar #sidebar-menu ul.list-unstyled:before{ background-color: transparent; width: auto;}
#main.enlarged .left.main-sidebar #sidebar-menu ul.list-unstyled li a:after{ background-color: transparent; width: auto;}
#main.enlarged .left.main-sidebar #sidebar-menu ul.list-unstyled li{ border-bottom: 1px solid #f3f3f3; padding-top: 2px;}
#main.enlarged .left.main-sidebar #sidebar-menu ul.list-unstyled li:last-child{ border-bottom: 0 none;}
#main.enlarged .left.main-sidebar #sidebar-menu ul.list-unstyled i{ padding-right: 8px;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > ul a:hover i{ color:#999;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover a span { display: inline; }
#main.enlarged .left.main-sidebar #sidebar-menu ul > li > ul { display: none; }
#main.enlarged .left.main-sidebar #sidebar-menu ul ul li:hover > ul { display: block; left: 190px; margin-top: -36px; position: absolute; width: 190px; }
#main.enlarged .left.main-sidebar #sidebar-menu ul ul li > a span.pull-right { -ms-transform: rotate(270deg); -webkit-transform: rotate(270deg); position: absolute; right: 20px; top: 12px; transform: rotate(270deg); }
#sidebar-menu ul > li > a span { padding-top:0px; line-height:0.9;}
#sidebar-menu ul > li > a span b{ display:block; font-weight:500; letter-spacing: 0.2px; font-size:12px; text-transform:uppercase; color:#fff;}
#sidebar-menu ul > li > a span small{ color:#e1e1e1; letter-spacing:0.5px; text-transform: uppercase; font-size: 10px; font-weight: 400;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li > a span b{ color: #fff;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li > a span small{ color: rgba(255, 255, 255, 0.8) !important;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li > a span { display: none; padding-left:5px; }
#main.enlarged .left.main-sidebar #sidebar-menu > ul > li > a { padding: 6px 5px; /* min-height: 52.09px; */ transition: 0.4s;}
#main.enlarged .left.main-sidebar #sidebar-menu > ul > li > a i { margin-left:0px; margin-right: 0; font-size:13px; transition: 0.4s;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > a { position: relative; width: 420px; border-radius: 20px 0px 0px 20px; background: #1a2860;  color: #fff; border-radius:0px 5px 5px 0px; border-right:4px solid rgba(0, 0, 0, 0.2); transition: 0.4s; -webkit-border-radius: 20px 0px 0px 20px; -moz-border-radius: 20px 0px 0px 20px; -ms-border-radius: 20px 0px 0px 20px; -o-border-radius: 20px 0px 0px 20px; }
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > a:before{ background-color: #f1f1f1 !important; left: 0; right: 0; transition:0.6s;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > a i { color: #f1f1f1; transition: 0.4s; }
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > a span small{ color:rgba(255, 255, 255, 0.8);}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > a span small{ color:rgba(0, 0, 0, 0.9);}
#main.enlarged .content-page { margin-left:50px; }
#main.enlarged .navbar-custom { margin-left: 70px; }
#main.enlarged .headerbar .headerbar-left .logo span { display: none; opacity: 0; }
#main.enlarged .headerbar .headerbar-left .logo i { margin-right: 0; }
#main.enlarged #sidebar-menu > ul > li:hover > a.open :after { display: none; }
#main.enlarged #sidebar-menu > ul > li:hover > a.active :after { display: none; }
#main.enlarged .user-detail { bottom: 0; padding: 15px 0; width: 70px; text-align: center; }
#main.enlarged .user-detail .dropup { margin: 0 auto; margin-left: 17px; }
#main.enlarged .user-detail h5 { display: none; }
#main.enlarged .user-detail p { position: absolute; right: 15px; top: 32px; }
#main.enlarged .user-detail p span { display: none; }
#main.enlarged #sidebar-menu ul ul li.active a { color: #0f9df7; }

#main.enlarged #sidebar-menu > ul > li > a:before{ width: 1%; height: 100%; content: ""; right: 0; top: 0; position:absolute; border-radius:0px; visibility: hidden; transition: 0.6s; z-index: -9; background: linear-gradient(45deg, #f60000,#f60000);  }
#main.enlarged #sidebar-menu > ul > li:hover > a:before{ width: 100%; visibility: visible; width: 100%; right: 0; transition: 0.6s; border-radius:20px 0px 0px 20px; -webkit-border-radius:20px 0px 0px 20px; -moz-border-radius:20px 0px 0px 20px; -ms-border-radius:20px 0px 0px 20px; -o-border-radius:20px 0px 0px 20px; }
#main.enlarged #sidebar-menu > ul > li > a.active:hover:before{visibility: visible !important;}
#main.enlarged #sidebar-menu > ul > li > a.active i{ color: #555 !important;}
#main.enlarged #sidebar-menu > ul > li > a.active:hover i{ color: #fff !important;}
#main.enlarged #sidebar-menu > ul > li::before{ display: none;}
#main.enlarged #sidebar-menu > ul > li::after{ display: none;}
#main.enlarged #sidebar-menu > ul .list-unstyled{ border-radius: 0; -webkit-border-radius: 0; -moz-border-radius: 0; -ms-border-radius: 0; -o-border-radius: 0; }
#sidebar-menu > ul > li:hover > a span b{ color: #555;}
#sidebar-menu > ul > li:hover > a span small{ color: #555;}
#sidebar-menu > ul > li:hover > a i{ color: #333;}
#sidebar-menu > ul > li:hover > a:before{ width: 100%; visibility: visible; width: 100%; right: 0; transition: 0.6s; border-radius:20px 0px 0px 20px; -webkit-border-radius:20px 0px 0px 20px; -moz-border-radius:20px 0px 0px 20px; -ms-border-radius:20px 0px 0px 20px; -o-border-radius:20px 0px 0px 20px; }

.course-frm{ display:flex; align-items: center; float: left; align-items: normal; flex-wrap: wrap;}
.frmbar .collapse.show{ display: flex;}
.wrap-frm{ flex-wrap: wrap;}
.fulen-frm{ flex-direction: column; justify-content: flex-start; align-items: stretch; width: 100%; padding: 0 5px;}
.course-frm div img{ height: auto;}
.course-frm .form-control { font-size:14px; border:1px solid #e4e4e4; padding:4px 5px; font-size:13px !important; color:#474747; min-height: 34px; border-radius:4px; overflow: auto; margin-right: 10px;}
.course-fm{ background:linear-gradient(#fafafa, #ffffff); border:1px solid #ddd; border-radius:3px; margin-bottom:15px;}
.course-fm label{ color:#333; padding-top:5px;}
.course-frm1{ display:flex;}
.course-fm1{ background:linear-gradient(#fafafa, #ffffff); border:1px solid #ddd; border-radius:3px; margin-bottom:15px;}
.course-fm1 label{ color:#333; padding-top:5px;}
.course-frm1{ margin-bottom:0;}
.frm-title{ width: 100%; display: block; margin-bottom: 25px; margin-top: 00px; display: flex; flex-direction: row; width: 100%; justify-content: space-between; padding: 10px 10px 10px 0px; font-size: 20px; border-bottom: 2px dotted rgba(0,0,0,0.2);}
.frm-title h2{ margin: 0; font-size: 18px; color: #000; font-weight: 800; display: flex; align-items: center;justify-content: space-between;}
.frm-title h2 span{ text-transform: none; padding-left:5px; font-weight: 400;}
.frm-title h2 span.mandatory{ color: red; font-size: 14px;}
.frm-title .editor{ margin: 0; font-size: 15px; color: #4e6286; font-weight: 400; display: flex; align-items: center;  justify-content: space-between;}
.frm-title .editor button{ margin-right: 5px;}
.frm-title .status{ font-size: 16px; color: #000;}
.frm-title .status .live { color: #fff !important; background-color: #f00; padding: 2px 5px; text-transform: uppercase; display: inline-block; font-size: 14px; font-weight: 500; letter-spacing: 3px; }
.frm-title .status .completed { color: #fff !important; background-color: green; padding: 2px 5px; text-transform: uppercase; display: inline-block; font-size: 14px; font-weight: 500; letter-spacing: 1px;}

.frm-title h3{ margin: 0; font-size: 1.3rem; color: #105493; text-transform: uppercase; font-weight: 600; text-align: center; width: 100%;}
.frm-title h3 span{ text-transform: none; padding-left:5px}

.edudet{ display: flex; flex-direction: row; width: 100%; flex-wrap: wrap;}
.edudet .edudet_items{ width: 50%; margin: 20px 0px; padding: 0px 20px;}
.edudet .edudet_items h2{ font-size: 16px; font-weight: 600; color: #000; padding: 0px 00px; display: flex; align-items: center; flex-direction: row; justify-content: space-between;}

.edutotal{ background: khaki; width: 100%; padding: 10px; margin-top: 20px;}
.edutotal .edudet .edudet_items{ margin-top: 10px;}

.boxdetail1{ border: #ddd 1px solid; margin: 10px 00px 00px; background: #fff;}
.boxdetail1 .boxdetail{ margin-bottom: 0px;}

.frmbar{ display: flex; flex-direction: row; width: 100%;}
.frmbar .lside{ width: 49%;}
.frmbar .rside{ width: 49%;}
.frmbar .cside{ width: 2%; position: relative;}
.frmbar .cside::before{ position: absolute; content: ""; background-color: #d6d6d6; top: 0px; left: 50%; width: 1px; height: 100%; z-index: 1; }

.detailarea{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between;}
.boxdetail{ width: 100%;  padding: 10px 20px;  margin-bottom: 20px;  display: flex;  flex-direction: row;  flex-wrap: wrap;}
.boxdetail h1{ font-size: 16px; width: 100%; color: darkred; border-bottom: #bbd3dd 1px solid; padding: 0px 0px 10px; font-weight: 800; display: flex; flex-direction: row; align-items: center; justify-content: space-between;}
.boxdetail .det1{ display: block; width: 49%; font-weight: 500; color: #000; padding: 10px 0px;}
.boxdetail .det1 span{ color: #004388; font-weight: 800; text-transform: uppercase; display: block; width: 100%;}

.boxdetail1 .boxdetail .det1{ padding: 8px 0px;}

.boxdetail .det1 span.yes{ background: green; color: #fff; padding: 2px 7px; border-radius: 3px; display: unset; text-transform: unset; font-weight: normal;}
.boxdetail .det1 span.no{ background: red; color: #fff; padding: 2px 7px; border-radius: 3px; display: unset; text-transform: unset; font-weight: normal;}

.boxdetail .det1 .canimg {  width: 150px;  height: auto;  border-radius: 10px;  border: #e5e5e5 2px solid;  background: #fff;  padding: 5px;  margin: 10px 0 15px;}
.boxdetail .det1 .canimg img {  width: 100%;  border-radius: 10px; height: 190px;}

.frmbar .rside .docpre{ width: 100%; background-color: #fff; border-radius: 5px; border: #e5e5e5 2px solid; padding: 15px;}
.frmbar .rside .docpre h3{ font-size: 16px; font-weight: 800; text-transform: uppercase; color:#d0d0d0; padding: 17px; border-bottom: #e5e5e5 2px solid; margin-bottom: 15px; padding-top: 0px; letter-spacing: 2px;}
.frmbar .rside .docpre img{ width: 100%; height: auto;}

.frmbar .lside h3{ font-size: 17px; color: red; font-weight: 500; text-align: left; display: block; margin-bottom: 10px; }
.frmbar .lside h3 span{ font-size: 15px; color: red; font-weight: 400; text-align: left; display: block; margin-bottom: 20px; }
.frmbar .lside h3 span:after{ display: none;}

.frmbar h4{ background: gainsboro;  font-size: 16px;  color: #000;  padding: 10px 20px;  margin-bottom: 20px; display: flex; justify-content: space-between;}
.frmbar h4 span{ font-size: 15px; color: #000;}

.dashcontent{}
.dashcontent .hotline{ color: #21538d; font-size: 16px; width: 100%; padding: 10px; text-align: center; margin-bottom: 40px;}
.dashcontent .cside::before{ display: none;}

.topboxbar{ display: flex; flex-direction: column; align-items: center; }
.topboxbar a{ display: inline-block; width: max-content; margin-bottom: 15px;}

.dashlogin{ background: #ebebeb; border-radius: 10px; background: #ebebeb; margin: auto;}
.dashlogin h1{ font-size: 25px; color: #000; text-transform: uppercase; text-align: center; padding: 60px 0 20px; font-weight: 800;}
.dashlogin h2{ font-size: 16px; color: #000; text-align: center; padding: 20px 30px 40px;}

.topboxbar{background: #ebebeb; border-radius: 10px; background: gainsboro; margin: auto; width: 40%; padding: 50px; margin: 20px auto 30px; font-size: 17px; color: #000; text-align: center;}

.dashlogin .dashbtn{ font-size: 17px; text-transform: uppercase; color: #fff; text-align: center; margin: 40px 0;}
.dashlogin .dashbtn .new{ background: #e56611; border-radius: 5px; padding: 15px 20px; margin: 0 3px 0 0; color: #fff; }
.dashlogin .dashbtn .login{ background: #4194f3; border-radius: 5px; padding: 15px 20px; color: #fff;}

.dashlogin .dashbtn .new:hover{ background: #c24e00;}
.dashlogin .dashbtn .login:hover{ background: #1b6ece;}

.dashlogin .dashfot{ background: #b6d2f1; padding: 3% 6%; border-radius: 0px 0px 10px 10px;}
.dashlogin .dashfot a{ font-size: 16px; padding: 3px 0; display: block; color: #000; }
.dashlogin .dashfot a:hover{ color: red; text-decoration: underline;}

.loginterms .dashfot{ background: #b6d2f1; padding: 10px 20px; border-radius: 0px 0px 10px 10px; margin-top: -17px;}
.loginterms .dashfot a{ font-size: 16px; padding: 3px 0; display: block; color: #000; }
.loginterms .dashfot a:hover{ color: red; text-decoration: underline;}

.dashcontent ul{ margin: 0px 20px; padding: 0px 0px 20px; border-bottom: 1px solid rgba(255,255,255,0.2);}
.dashcontent li{ padding: 5px 0px; list-style: none; font-size: 16px; color: #000;}
.dashcontent li:before{margin: 0px 0 0 0; padding: 0 10px 0 0; color: #105493; font-size: 18px; font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f105"; transition: all 0.5s ease 0s; width: 0;}
.dashcontent li a{ color: #105493;}
.dashcontent li a:hover{ color: gold;}

.course-frm h1{ font-size:16px; color:black; font-weight: bold;}
.course-frm h2{ font-size:20px; color:red; font-weight: bold;}
.course-frm h2 span{ font-size:16px; color:#666; font-weight: normal;}

.course-frm label.imgbox{ background: #fff; border-radius: 10px; padding-left: 15px; display: flex; align-items: center; border: #dfdfdf 1px solid;}

.course-frm .frm-radio input{ margin-right: 5px;}
.course-frm .frm-radio label{ margin-right: 10px;}

.course-frm label{ font-weight: 400;}
.pric-box .btn, .pric-box .btn:hover { color: #fff; width: max-content;}
.pric-box .btn{ margin: 0px 2px;}

.tbl-bdy1{ width:100%; border-radius:0px; background-color: #fff; margin-top:7px; min-height:500px; max-height: 500px; overflow: auto;}
.tbl-bdy2{ width:100%; border-radius:0px; background-color: #fff; margin-top:7px; min-height:100px; max-height: 500px; overflow: auto;}
.tbl-bdy{ width:100%; border-radius:0px; background-color: #fff; margin-top:7px; overflow: auto;}
.tbl-frm{ padding:0px; border-radius:0px; background-color: #fff; padding: 15px 15px; margin-top:8px; min-height: calc(100vh - 200px);}
.dis-frm form{ border-bottom: 3px dotted #bbb; padding-bottom: 10px; margin-bottom: 30px;}
.dis-frm .add-butt{ margin-top: 15px; border-top: 1px solid #eaeaea;}

.tbl-frm1{ width: 100%; padding:0px; border-radius:0px; background-color: #fff; padding: 15px 15px 25px; margin-top:8px; min-height: calc(100vh - 200px);}
.tbl-frm1a{ width: 100%; padding:0px; border-radius:0px; background-color: #fff; padding: 15px 15px 140px; margin-top:8px; min-height: calc(100vh - 200px);}
.tbl-frm2{border-top: #93d5ff 5px solid; width: 100%; padding:0px; border-radius:0px; background-color: #f3f3f3; padding: 15px 15px; margin-top:0px; z-index: 1;  position: relative;}

.tbl-frm2 h3{ font-size: 17px; color: red; font-weight: 500; text-align: left; display: block; margin-bottom: 10px; }
.tbl-frm2 h3 span{ font-size: 15px; color: red; font-weight: 400; text-align: left; display: block; margin-bottom: 00px; padding-left: 10px; line-height: 22px; }
.tbl-frm2 h3 span:after{ display: none;}

.frmbar h2{ font-size: 18px; color: #000; background: #e8e8e8; padding: 10px; font-weight: 800; text-align: center; display: block; margin: 10px 0px 20px; width: 100%; }
.tbl-frm2 h4{ font-size: 25px; color: red; font-weight: 800; text-align: center; display: block; margin: 10px 0px; width: 100%; }

.tbl-frm3{ width: 100%; padding:0px; border-radius:0px; background-color: #fff; padding: 15px 15px; margin-top:8px;}

.tbl-frm-case{ padding:8px 10px; border-radius:3px 3px 0px 0px;}
.tbl-frm-case .card{ margin-bottom:0px;}
.tbl-frm-case .card.active{ background-color:#fff2f3;}
.tbl-frm-case .card:hover{ background-color:#fffae5;}
.tbl-frm-case .card:hover .card-body{ background-color:#fefbef;}
.tbl-frm-case .card-header{ background-color:transparent; padding:0px;}
.tbl-frm-case .card-header div .head-link{ display:block; width:100%; text-align:left; padding:8px 0px; cursor:initial !important;}
.tbl-frm-case .card-header div .head-link:hover{ text-decoration:none}
.tbl-frm-case .card-body{ padding:5px !important;}

/* Tab Accordion */
.tab-acc{ width: 100%;}
.tab-acc .card-body .usr-roll .usr-rht span{ background-color: transparent; border-radius:0px; border-left: 1px solid #e0e2ea;}
.tab-acc .card-body .usr-roll .usr-rht span::before{ border-radius: 0px;}
.tab-acc .card-body .usr-roll .usr-rht span:hover:before{ border-radius: 0px;}

.enrol-content h3{ display: flex; flex-direction: row; justify-content: space-evenly; margin-bottom: 10px;}
.enrol-content h3 span{display: flex; flex-direction: column; }
.enrol-content h3 span i{width: 35px; z-index: 5; height: 35px; margin: auto; background: #fff; line-height: 35px; text-align: center; border-radius: 50%; font-size: 15px; color: #333; font-style: normal; }
.enrol-content h3 span a{width: 35px; height: 35px; z-index: 5; margin: auto; background: #0095d8; line-height: 35px; text-align: center; border-radius: 50%; font-size: 15px; color: #fff; display: flex; align-items: center; justify-content: center; border: #fff 3px solid;}
.enrol-content h3 span a:hover{ background: #00d824; color: #000;}
.enrol-content h3 span a.active{ background: #11b611; color: #fff;}
.enrol-content h3 span small{ font-size: 15px; color: #000; font-weight: normal; padding: 7px 0;}

.enrol-content span .disabled{ background: #bbb; border-color: #ddd; color: #fff; opacity: 1.0;}
.enrol-content span small.disabled { color: rgba(255, 255, 255, 0.5); background:none; border: none;}

.enrol-content h3 span::after{content: '';width: 69.4%;height: 2px;position: absolute;left: 16.5%;top: 16px;z-index: 0; background-color: #fff;}

.formnav{ display: flex; flex-direction: row; justify-content: center; align-items: center; align-content: center; padding: 25px; background: #eee;}
.formnav .pagibut{ padding: 8px 15px; border-radius: 5px; text-align: center; background: #fff; border: 0px; margin: 0px 5px;}
.formnav .paginextbut{ background-color: green; color: #fff;}
.formnav .paginextbut:hover{ background-color: darkgreen;}
.formnav .pagicancelbut{ background-color: darkgray; color: #fff;}
.formnav .pagicancelbut:hover{ background-color: black; color: #fff;}
.formnav .pagiredbut{ background-color: red; color: #fff;}
.formnav .pagiredbut:hover{ background-color: #c60303; color: #fff;}
.formnav button{ margin: 3px;}

/* Table Style */
.pric-box{ color: #fff; text-align: left;}
.pric-box h1{ padding-bottom: 10px !important; margin-bottom: 10px !important;}
.pric-box th{ padding: 10px; font-size: 15px; font-weight: 600; border: none; color: #fff; background:#012d50; text-align: center;}
.pric-box td{ padding: 10px; font-size: 15px; color: #333; }
.pric-box td span{ display: block; color: brown;}
.pric-box .bor-rb{ border-right: #d3d3d3 1px solid; border-bottom: #d3d3d3 1px solid;}
.pric-box .bor-rb img{ width: 50px; border-radius: 7px; background: lightblue; margin-right: 5px;}
.pric-box .bor-t{ border-top: #d3d3d3 1px solid;}
.pric-box .bor-l{ border-left: #d3d3d3 1px solid;}
.pric-box strong{ font-size: 16px;  color: #000;  padding-top: 10px;  display: block;  font-weight: 600;  line-height: 24px; }
.pric-box strong i{font-size: 14px;  font-style: normal;  display: block;  padding-bottom: 10px;  font-weight: normal;}

.pric-box a.action{ padding: 7px 10px; font-size: 15px; font-weight: 500; text-align: center; display: inline-block; border-radius: 30px; color: #000; background: #fff;  }
.pric-box a.delete:hover{ background: red; color: #fff;}
.pric-box a.edit:hover{ background: darkorange; color: #fff;}
.pric-box tr.bg1{ background-color: lavender;}
.pric-box tr.bg1 td{ color: firebrick; font-weight: 800;}
.pric-box tr.bg2{ background-color: blanchedalmond;}
.pric-box tr.bg2 td{ color: firebrick; font-weight: 800;}

.pric-box div.sublink{ background: #fff; border: rgba(0, 0, 0, 03); padding: 0px; margin: 0; z-index: 1; border-radius: 0 0 20px 20px;}
.pric-box div.sublink a{ font-size: 16px !important; background: #26c6da !important; border-radius: 5px !important; color: #fff !important; padding: 10px 15px !important; display: inline-block !important; font-weight: 500 !important;}
.pric-box div.sublink a:hover{ background: #0f70ab !important;}
.pric-box div.sublink a::after{display: none;}

.pric-box .custom-select{height: 32px;  padding: 3px 30px 3px 10px;  margin: 0 20px 0 0;}

.pric-box .text-red{ font-weight: 800;}
.pric-box .text-green{ font-weight: 800;}

.pric-box .uploadimg{ display: flex; flex-direction: column; align-items: center;}
.pric-box .uploadimg .canimg{ width: 200px; height: auto; border-radius: 10px; border: #e5e5e5 2px solid; background: #fff; padding: 10px; margin: 10px 0 15px;}
.pric-box .uploadimg .canimg img{ width: 100%; border-radius: 10px;}
.pric-box .uploadimg .butrow{ display: flex; flex-direction: row;}
.pric-box .uploadimg .butrow button{ margin: 5px;}

.cnt-part{ width: 100%;}

.tab {  overflow: hidden;  border-radius: 7px;}
.tabbg{ background-color: #d9ebff;}

/* Style the buttons inside the tab */
.tab button {  background-color: inherit;  float: left;  border: none;  outline: none;  cursor: pointer;  padding: 7px 20px;  transition: 0.3s;  font-size: 17px; text-transform: uppercase;}
.tab button:first-child{ border-radius: 7px 0 0 7px;}

/* Change background color of buttons on hover */
.tab button:hover {  background-color: #ddd;}

/* Create an active/current tablink class */
.tab button.active {  background-color: #e56611; color: #fff;}

/* Style the tab content */
.tabcontent {  display: none;  padding: 25px 20px;  border: 0px solid #ccc;  border-top: none; }

.container{ width: 1200px;}

/* Extra large devices (large desktops, 1368px and up) */

@media (max-width: 1200px) {
  .container{ width: 1140px;}
}

/* Small devices (landscape phones, less than 768px) */
@media (max-width: 1024px) {
body { overflow-x: hidden; }
.headerbar .headerbar-left .logo img{ width: 100%; max-height: 75px;}
.headerbar .headerbar-left .titbar{ padding: 8px; font-size: 17px;}
.logo{ height: unset; padding: 8px 0;}
#main.enlarged .left.main-sidebar{ left: 75px; position: fixed;}
#main.enlarged .left.main-sidebar #sidebar-menu ul > li:hover > a{ width: 420px;}
.enlarged .left.main-sidebar { margin-left: -75px; }
.headerbar-left { width:200px; }
.headerbar-left span { display: none !important; }
.headerbar-left i { display: block !important; }
.headerbar .headerbar-btm::before{ background-color: transparent;}
.navbar-custom { margin-left:0px !important; }
.content-page { margin-left: 0 !important; margin-top: 130px; }
.footer { left: 0 !important; }
.mobile-sidebar { left: 0; }
.mobile-content { left: 250px; right: -250px; }
.wrapper-page { width: 90%; }
.dataTables_wrapper .col-xs-6 { width: 100%; text-align: left; }
div#datatable-buttons_info { float: none; }
.ms-container { width: 100%; }
.navbar-toggleable-md .navbar-nav { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -webkit-flex-direction: row; -ms-flex-direction: row; flex-direction: row; }
.login .login-box .login-det h2{ font-size:21px;}
.button-menu-mobile{ padding:0px 15px;}
.nav-user img{ width:30px; height:30px;}
.navbar-custom .nav-link .tlogdwn{ padding:2px 12px 2px 12px;}
.navbar-custom .nav-lst{ margin-right:10px; }  
.headerbar .headerbar-left{ height: 63px;}
.headerbar{ box-shadow: 0 14px 15px -12px rgba(91, 91, 91, 0.44);}
.navbar-custom{ height: 63px; box-shadow: none;}
.sticky .headerbar-btm{ box-shadow:none;}
.sticky .navbar-custom{ box-shadow: none;}
.sticky { box-shadow: 0 14px 15px -12px rgba(91, 91, 91, 0.44);}

.login .login-box .login-lft{ width: 45%;}
.login .login-box .login-det{ width: 55%; padding: 53px 30px 53px 30px;}
.login .login-box span small{ line-height: 1.2; font-size: 18px;}

.toplnk{ text-align: right;}
.toplnk a{ margin-bottom: 2px;}
body.adminbody-void{ min-height: 700px;}
body.adminbody .main-sidebar.left{ padding-right: 5px;}
.headerbar .headerbar-left .menu-left{ position: relative; right: auto;}
.table td a, .table td button{ margin-bottom: 2px;}
.splt select{ width: 20%;}
.xso-org1 h2{ z-index: 0; }
.xso-org3 .xso-icn{ width: 49%;}

.footer-main{ padding-left:0;}
.enlarged .footer-main { padding-left: 0; bottom: -61px; }
.profile-dropdown{ margin-top: 13px;}

.frmbar{ flex-direction: column;}
.frmbar .lside{ width: 100%;}
.frmbar .rside{ width: 100%;}
.frmbar .cside{ display: none;}
.stdetail > .accordion .titxt{ flex-direction: column;}

.edudet .edudet_items{ width: 100%; padding: 0px;}
.boxdetail1{ margin-right: 0px;}
}

@media (max-width: 767px) {
.container{ width: 100%;}
.logfrm{ width: 100%;}
.loginterms{ width: 100%;}
.topboxbar{ width: 60%; margin-top: 0px;}
.breadcrumb-holder .main-title, .breadcrumb-holder .breadcrumb { float: none; }
.assment-table .usr_txt1 li b{ width:100%;}
.login .login-box .login-det .login-frm-lnk{ flex-wrap:wrap; text-align:center; justify-content:center; margin:5px 0px 20px;}
.login .login-box .login-det .login-frm-lnk a{ margin:10px 0px 10px; width:100%;}
.login .login-box .login-det h2{ font-size:20px;}
.login .login-box{  flex-wrap: wrap;}
.login .login-box .login-lft{ min-height: 300px;}
.login .login-box .login-det{ width: 100%; padding: 15px 30px 20px 30px;}
.login .login-box .login-lft{ width: 100%; padding: 50px 30px 20px 30px;}
.login .login-box .login-det form{ width: 100%;}
.quick-srch .qsrch{ width: 240px;}
.quick-srch .qsrch:focus{ width:260px;}
.quick-srch{ display: none;}
.headerbar .headerbar-left .menu-left{ position: relative; right: auto;}
.logo{ padding-left: 10px;}
.xso-org3 .xso-icn{ width: 100%; padding: 6px 6px 6px 15px;}
.xso-org3 .xso-icn span i{ font-size: 14px; width: 16px;}
.xso-org3 .xso-icn span b{ font-size: 14px;}
.logarea{ flex-direction: column-reverse;}
.loginterms {  width: 100%; border-radius: 0px 0px 15px 15px; }
.logfrm {  width: 100%; border-radius: 15px 15px 0 0; }
.boxdetail{ width: 99%;}
.boxdetail .det1{ width: 100%;}
.sfrlogo{ padding-right: 10px;}
.boxdetail1 .boxdetail .det1:first-child{ padding: 0px;}
.boxdetail1 .boxdetail .det1:nth-child(2){ padding: 0px 0px 10px;}
}

/* Extra small devices (portrait phones, less than 576px) */
@media (max-width: 576px) {
.container-fluid{ padding: 0px;}
body.adminbody .main-sidebar.left{ margin-top: 0;}
body.adminbody-void{ min-height:auto; margin-bottom: 20px;}
#main.enlarged .navbar-custom{ background-color: #fff; padding:0px 15px 0px 0px; background: #fff !important;}
.sticky .headerbar-btm{ box-shadow: none;}
.sticky .navbar-custom{ transition: 0.4s; padding:5px 15px 5px;}
.sticky{ background-color: #fff;}
.remainder span{ box-shadow: none; width: 16px; height: 16px;}
.remainder a{ width: 26px; height: 26px;}
.remainder a i{ font-size: 12px;}
.quick-srch{ display: none;}
.content-page .content{ padding:0;}
.button-menu-mobile{ padding:2px 2px; right:auto; margin-left: 0px;}
.headerbar{ background-color:#fff; box-shadow: none;}
.sticky{ box-shadow: 0 15px 20px -15px rgba(0,0,0,0.3);}
.course-frm{ display:inline-block; padding: 0px 0px;}
.form-group{ margin-bottom: 3px;}
.cel-split input{ width:40%;}
.quick-srch .qsrch{ padding: 5px 55px 5px 12px}
.toplnk{ padding-top: 2px; min-width: 50px;}
.breadcrumb-holder::before{ top:0px; width: 450px; right: -15px;}
.clndr { margin-right: 5px; color: #444; font-size: 11px; background-color: #eee; border-radius: 50px; padding: 2px 8px; }
.clndr i { color: #666; font-size: 12px; }
.logo { top: 1px; justify-content: flex-start; padding-left: 5px; padding-right: 5px; height: 75px; }
.frm-title { margin-bottom: 10px; flex-direction: column; text-align: center; }
.frm-title h2{ flex-direction: column;}
.role-display h2{ font-size: 15px !important;}

.mini-stat{ width: 100%; margin-right: 0;}
.tbl-des .tbl-des-rht h2{ font-size: 16px;}
.tbl-des .tbl-des-lft{ width: 100%;}
.tbl-des .tbl-des-rht{ width: 100%; border-left: 0 none; padding-left: 0;}

.ser-box h2{ font-size: 16px;}
.ser-box .test-ptrs{ padding: 15px 20px;}
.ser-box .ser-box-cnt .ser-tit h2{ font-size: 16px;}
.ser-box .ser-box-cnt .ser-image{ height: 110px; width: 110px;}

.nav-user img{ width:26px; height:26px;}
.navbar-custom{ margin-left:0px !important; min-height: 60px; background: #fff !important; padding: 0px 15px;}
.navbar-custom .nav-lst{ margin-right:2px;}
.navbar-custom .nav-lst .dropdown .btn-nav{ font-size:10px; padding:3px 10px; margin-top:1px;}
.navbar-custom .nav-link .tlogdwn i{ padding:0 5px 0px 3px; margin-top:1px;}
.navbar-custom .nav-link { border-radius: 50px;}

.headerbar .headerbar-left{ height: 61px; }
.headerbar .headerbar-left .menu-left:before{ height: 105%; color: #666666;}
.headerbar .headerbar-left .logo img{ padding:0px; width: 100%;}
.headerbar .headerbar-left{ border-right: 0;}
.topboxbar{ width: 95%;}

.breadcrumb-holder .main-title{ font-size:20px; margin-top: 0px;}
.breadcrumb-holder .main-title i{ font-size: 13px; margin-right:2px;}
.breadcrumb-holder .breadcrumb::before{ background-color:transparent; border-left:0 none}
.breadcrumb-holder .breadcrumb{ font-size:12px; background:transparent !important; width:100%; padding:10px 0px; margin:8px 0px 4px !important; border-top:1px solid #5B5B5B; border-radius:0;}
.breadcrumb-holder{ border-bottom:0 none; padding:0px 0px 5px 0px; /*background:rgba(0, 0, 0, 0.02);*/ margin-bottom:20px; margin-bottom:5px; flex-direction: column;}

.main-sidebar{ top: 61px; width: 220px;}
#sidebar-menu:after { position: absolute; content: ""; background-color: #eee; top: 0px; left: 0; width:100%; height: 1px; }
.card-title{ font-size:22px;}

.breadcrumb-holder .main-title i{ padding-right: 5px;}
.scrollToTop{ display: block !important;}

.crse-sel .card-body .usr-roll{ flex-wrap: wrap; padding: 5px 0px;}
.crse-sel .card-body .usr-roll .usr-lft{ width: 100%; margin-right: 0; padding:0px 5px;}
.crse-sel .card-body .usr-roll .usr-lft h2{ font-size: 15px !important; margin: 2px 0px !important;}
.crse-sel .card-body .usr-roll .usr-rht{ width: 100%;}
.crse-sel .card-body .usr-roll .usr-rht span{ width: 31%;}
.crse-sel .card-body .usr-roll .usr-rht span:nth-child(3n+3){ margin-right: 0;}

.xso-org{ margin-top: 0;}
.xso-org1{ justify-content: center; padding: 25px 10px;}
.xso-org1::before{ background-color: transparent;}
.xso-org1 span{ height: 80px; z-index: 0; margin-bottom: 10px;}
.xso-org1 h2{ font-size: 17px; text-align: center; margin: 15px 0px 10px; z-index: 0; letter-spacing: 0;}
.xso-org1 small{ margin: 5px 0px 10px; position: relative; right: auto;}
.xso-org1 small a{ padding: 2px 20px 3px 15px;}
.xso-org:hover .xso-org1::before{ background-color: transparent;}
.xso-org-list ul li{ flex-wrap: wrap;}
.xso-org-list ul li b{ width: 100%; border-radius: 4px 4px 0px 0px; border-right: 1px solid #e8e8e8;}
.xso-org-list ul li span{ width: 100%; border-left: 1px solid #e4e5ee; border-radius: 0px 0px 4px 4px;}
.xso-org3 .xso-icn{ width: 100%; margin-right:0;}
.xso-org2{ padding:10px;}
.xso-org3{ padding: 15px;}

.remainder{ margin-right:12px;}
.xbtn-add { padding: 3px 10px 1px;}
.tbl-frm{ padding:10px 10px}
.table thead th{ font-size:12px;}
.table > tbody > tr td{ font-size:13px;}

.pgn-lft, .pgn-rht{ justify-content:center; padding:5px 10px; overflow: auto;}
.dataTables_paginate{ width: 100%;}
.pagination{ padding:0px 15px; justify-content: center;}
.body-content{ padding-bottom:15px; /*min-height: auto*/ min-height: 1000px;}
.remainder small{ padding-top:4px;}
.scrollToTop { bottom:10px; right:10px; background:linear-gradient(-7deg, #fff,#fff);}
.scrollToTop:hover{ bottom: 20px;}

.xsearchbdy label.empty{ height: 15px;}
.xsearchbdy .form-group label{ padding-left: 0;}
.content-page .content{ padding: 0;}
.content-page .content:before { height: 258px;}
.form-row label{ text-align:left; padding:5px 10px; font-size:13px;}
.crse-sel .card::after{ left: 4px;}
.modal-dialog{ margin-top: 90px;}
.splt2-frm{ flex-wrap: wrap;}

.main-footer span{ text-align:center}
.footer-main{ background-color: #e3e3e3;}
.main-footer{ flex-wrap: wrap; justify-content: center;}
.main-footer span.cptext{ width: 100%; display: block; margin-bottom: 10px; text-align: center;}
.pwd-by{ right:auto; bottom:25px; display:flex; justify-content:center; width:100%;}

.loginterms {  width: 100%; }
.logfrm {  width: 100%; }
.headerbar .headerbar-left .titbar{ flex-direction: column;}
.headerbar .headerbar-left .titbar div{ justify-content: center;}
.content-page{ margin-top: 170px;}
}

/* my styles  */
label.required:after { color: #ff0000; content: "*"; margin-left: 5px; }
.help-block { color: red;  }
p.help-block{ margin: 0; padding-top: 3px; font-size: 14px;}
.error{ color: #ec2029 !important; font-size: 12px !important; width: 100% !important}
#type-error{ color: #ec2029 !important; font-size: 12px !important;}
.cke_button__easyimageupload { display:none !important; }
#modal_form input[type=text], #modal_form select, #modal_form textarea { background: #fff7be !important; border: 1px solid #ddd; border-radius: 2px; }
.no-rcd{ width: 100%; display: flex; align-items: center; justify-content: center; text-align:center; font-size: 16px; text-transform: uppercase; color: #636363; padding: 10px 0px; transition: 0.4s;  }
.no-rcd:hover i{ animation-name: zoomIn; animation-duration: 1s; transition: 0.8s;}
.no-rcd i{ color: #f42b2b; margin-right: 5px; font-size: 26px; transition: 0.8s;}
p.no-rcd{ margin-bottom: 0;}
.badge-warning{ color: #fff !important; background-color: #fd6f6f;}
.text-red { color: red !important }
.text-yellow { color: #f39c12 !important }
.text-aqua { color: #00c0ef !important }
.text-blue { color: #0073b7 !important }
.text-black { color: #111 !important }
.text-light-blue { color: #3c8dbc !important }
.text-green { color: #00a65a !important }
.text-gray { color: #d2d6de !important }
.text-navy { color: #001f3f !important }
.text-teal { color: #39cccc !important }
.text-olive { color: #3d9970 !important }
.text-lime { color: #01ff70 !important }
.text-orange { color: #ff851b !important }
.text-fuchsia { color: #f012be !important }
.text-purple { color: #605ca8 !important }
.text-maroon { color: #d81b60 !important }
.text-white { color: #ffffff !important }
/*  // my styles  */

.menutab{ display: flex; flex-direction: row; position: relative;}
.menutab > a { font-size: 16px; color: #000; text-align: center; padding: 10px 15px; background: #f3f3f3; margin:0px 2px; border-radius: 5px 5px 0 0; cursor: pointer;}
.menutab > a.active{ background: #4194f3; color: #fff;}
.menutab > a:hover{ background: #d8f0ff;}
.menutab > a:hover.active{ background: #3181dd; color: #fff; }
.tabbox{ position: absolute; top: 45px; left: 0px; width: 100%; padding-bottom: 80px; }

@media (max-width: 1341px) {
  .tabbox{ top: 68px;}
}
@media (max-width: 1190px) {
  .tabbox{ top: 92px;}
}
@media (max-width: 1160px) {
  .menutab > a{ width: 100%;}
  .menutab{ flex-wrap: wrap;}
  .tabbox{ position: unset; }
  .menutab > a{ text-align: left;}
  .menutab > a { background: lavender; margin:2px 2px; border-radius: 5px; cursor: pointer;}
  .menutab > a.active{ border-radius: 5px 5px 0 0; margin-bottom: 0px;}
}