/*.content-wrapper, .hero-banner{
  background-image:linear-gradient(112deg, #dc3545, #dc3545bf);
}
.page-body-wrapper .main-panel{
    background-image:linear-gradient(112deg, #dc3545, #dc3545bf);
    background:#dc3545;
}
*/

/*******************************************************************************
  Body - Text Transform
*******************************************************************************/
body.uppercase > *{text-transform:uppercase;}
body.capitalize > *{text-transform:capitalize;}

.body{margin-top:50px;}
.body.reset{margin-top:0px;}
.body.version_1{margin-top:60px;}
.text-left{text-align:left !important;}
.text-center{text-align:center !important;}
.text-right{text-align:right !important;}

.text-uppercase > *{text-transform:uppercase;}
.text-lowercase > *{text-transform:lowercase;}
.text-capitalize > *{text-transform:capitalize;}

.text-uppercase{text-transform:uppercase !important;}
.text-lowercase{text-transform:lowercase !important;}
.text-capitalize{text-transform:capitalize !important;}

.date-width{
  width:95%;
}

.datepicker{
  position:absolute !important;
}

.datepicker.datepicker-dropdown .datepicker-days table.table-condensed tbody td.day.active:before,
.datepicker.datepicker-inline .datepicker-days table.table-condensed tbody td.day.active:before{
  background:#cc4444;
  color:#ffffff ;
}

.cursor-pointer{
  cursor:pointer;
}

.quick-links li:first-child {
  margin-left:10px;
  padding-left:10px;
  border-left:1px solid #212529;
  line-height:1;
}

/* Stamp */
.stamp {
  color:#555555;
  border-radius:1rem;
  display:inline-block;
  font-family:"Courier";
  font-size:12px;
  font-weight:100;
  mix-blend-mode:multiply;
  padding:5px;
  text-transform:uppercase;
  transform:rotate(14deg);
  border-radius:0;
}

.stamp.green{
  border:0.05rem solid #0A9928;
  color:#0A9928;
}

.stamp.blue{
  border:0.05rem solid #0a4399;
  color:#0a4399;
}

/*******************************************************************************
  Quick Links
*******************************************************************************/
.quick-links li:first-child{
  border-left:none;
}

/*******************************************************************************
  Select2
*******************************************************************************/
.select2-container--default .select2-selection--single {
  border:1px solid #dee2e6 !important;
  border-radius:2px !important;
  height:calc(1.5em + 0.75rem + 2px) !important;
  color:#4A4444 !important;

}

.select2-container--default .select2-selection--single .select2-selection__arrow b{
  top:55% !important;
}

.select2-container .select2-selection--single .select2-selection__rendered{
  padding-left:0px !important;
}

.select2-container{
  width:100% !important;
}

.sidebar {
  min-height:calc(130vh) !important;
  padding-bottom:60px;
}

/*******************************************************************************
  Button Toggle
*******************************************************************************/
.toggle.btn{
  /* width:99.5625px !important; */
  width:100%;
}

/*******************************************************************************
  Page Header
*******************************************************************************/
.bg-examination-marking{background:url(./../../../../images/pagecrumb/examination_marking.png) no-repeat center center;height:100% !important;width:100% !important}
.bg-teaching{background:url(./../../../../images/pagecrumb/teaching.jpg) no-repeat center center;}

.page-header{
  background-size:cover;
  border-radius:5px;
  padding:0px 0;
  width:100%;
}

.page-header .cover-page{
  background:rgba(0,0,0,0.5);
  width:100%;
}

.page-header .cover-page-no-transparent{
  background:none;
}

.page-header .wrapper-inner *{
  color:#ffffff !important;
  width:100%;
}

.custom-file-label{
  border-radius:2px !important;
  padding:0.8em 0.75rem !important;
  border: 1px solid #dee2e6 !important;
  height:calc(1.5em + 0.75rem + 2px) !important;
  color:#495057 !important;
  font-weight: 300 !important;
  font-size:0.75em !important;
  line-height:1;
}
.custom-file-label::after{
  border-top-right-radius:2px !important;
  border-bottom-right-radius:2px !important;
  margin-right:-1px !important;
}

.custom-file-label::after{
  background:#cc4444;
  color:#ffffff;
}

/*******************************************************************************
  Avatar Upload
*******************************************************************************/

.avatar-upload{
  max-width:205px;
  margin:50px auto;
  position:relative;
}

.avatar-upload .avatar-edit{
  position:absolute;
  right:12px;
  top:10px;
  z-index:1;
}

.avatar-upload .avatar-edit input{display:none;}

.avatar-upload .avatar-edit input + label{
  background:#FFFFFF;
  border:1px solid transparent;
  border-radius:100%;
  box-shadow:0px 2px 4px 0px rgba(0,0,0,0.12);
  cursor:pointer;
  display:inline-block;
  font-weight:normal;
  height:34px;
  margin-bottom:0;
  transition:all 0.2s ease-in-out;
  width:34px;
}

.avatar-upload .avatar-edit input + label:hover{
  background:#f1f1f1;
  border-color:#d6d6d6;
}

.avatar-upload .avatar-edit input + label:after{
  color:#757575;
  content:'\F167';
  font-family:'Material Design Icons';
  left:0;
  margin:auto;
  position:absolute;
  right:0;
  text-align:center;
  top:10px;
}

.avatar-upload .avatar-preview{
  border-radius:100%;
  border:6px solid #F8F8F8;
  box-shadow:0px 2px 4px 0px rgba(0,0,0,0.1);
  height:192px;
  position:relative;
  width:192px;
}

.avatar-upload .avatar-preview > div{
  background-size:cover;
  background-size:120px;
  background-repeat:no-repeat;
  background-position:center;
  border-radius:100%;
  height:100%;
  width:100%;
}

/*******************************************************************************
  Thumbnail Upload
*******************************************************************************/

.thumbnail-upload{
  /* max-width:205px; */
  /* margin:50px auto; */
  position:relative;
}

.thumbnail-upload .thumbnail-edit{
  position:absolute;
  /* right:12px; */
  top:10px;
  z-index:1;
}

.thumbnail-upload .thumbnail-edit input{display:none;}

.thumbnail-upload .thumbnail-edit input + label{
  background:#FFFFFF;
  border:1px solid transparent;
  border-radius:100%;
  box-shadow:0px 2px 4px 0px rgba(0,0,0,0.12);
  cursor:pointer;
  display:inline-block;
  font-weight:normal;
  height:34px;
  margin-bottom:0;
  transition:all 0.2s ease-in-out;
  width:34px;
}

.thumbnail-upload .thumbnail-edit input + label:hover{
  background:#f1f1f1;
  border-color:#d6d6d6;
}

.thumbnail-upload .thumbnail-edit input + label:after{
  color:#757575;
  content:'\F167';
  font-family:'Material Design Icons';
  left:0;
  margin:auto;
  position:absolute;
  right:0;
  text-align:center;
  top:10px;
}

.thumbnail-upload .thumbnail-preview{
  /* border:6px solid #F8F8F8; */
  /* box-shadow:0px 2px 4px 0px rgba(0,0,0,0.1); */
  height:192px;
  position:relative;
  width:192px;
}

.thumbnail-upload .thumbnail-preview > div{
  background-size:cover;
  /* background-size:120px; */
  background-repeat:no-repeat;
  background-position:center;
  height:100%;
  width:100%;
}

/*******************************************************************************
  Signature Upload
*******************************************************************************/

.signature-upload{
  max-width:205px;
  margin:50px auto;
  position:relative;
}

.signature-upload .signature-edit{
  position:absolute;
  right:12px;
  top:10px;
  z-index:1;
}

.signature-upload .signature-edit input{display:none;}

.signature-upload .signature-edit input + label{
  background:#FFFFFF;
  border:1px solid transparent;
  /* border-radius:100%; */
  box-shadow:0px 2px 4px 0px rgba(0,0,0,0.12);
  cursor:pointer;
  display:inline-block;
  font-weight:normal;
  height:34px;
  margin-bottom:0;
  transition:all 0.2s ease-in-out;
  width:34px;
}

.signature-upload .signature-edit input + label:hover{
  background:#f1f1f1;
  border-color:#d6d6d6;
}

.signature-upload .signature-edit input + label:after{
  color:#757575;
  content:'\F167';
  font-family:'Material Design Icons';
  left:0;
  margin:auto;
  position:absolute;
  right:0;
  text-align:center;
  top:10px;
}

.signature-upload .signature-preview{
  border-radius:100%;
  border:6px solid #F8F8F8;
  box-shadow:0px 2px 4px 0px rgba(0,0,0,0.1);
  height:192px;
  position:relative;
  width:192px;
}

.signature-upload .signature-preview > div{
  background-size:cover;
  background-size:120px;
  background-repeat:no-repeat;
  background-position:center;
  border-radius:100%;
  height:100%;
  width:100%;
}

/*******************************************************************************
  Quote of the Day
*******************************************************************************/
.quote_of_the_day .banner{
  padding:10px;
  background-repeat:no-repeat;
  background-position:center;
  -webkit-background-size:cover;
  -moz-background-size:cover;
  -o-background-size:cover;
  background-size:cover;
}
.quote_of_the_day .banner .content{
  background:rgba(0,0,0,0.2);
  padding:8px;
}

.quote_of_the_day .banner .content > *{
  color:#ffffff;
}

/******************************************************************************
  Theme Color Default
*******************************************************************************/
body .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

body .sidebar{
  background:linear-gradient(to top, #040101b8, #cc3333) !important;
}

.mapael .mapTooltip {
    position:absolute !important;
    background-color:#474c4b !important;
    moz-opacity:0.70 !important;
    opacity:0.70 !important;
    filter:alpha(opacity=70) !important;
    border-radius:10px !important;
    padding:10px !important;
    z-index:1000 !important;
    max-width:200px !important;
    color:#fff !important;
}


/*******************************************************************************
  Form Control Div
*******************************************************************************/
.form-control.input-dummy{
  line-height:30px !important;
}

.form-control.input-dummy.readonly{
  background:#e9ecef;
  cursor:not-allowed;
}

.form-control.input-dummy.readonly.textarea{
  height:100px;
}

/*******************************************************************************
  Button
*******************************************************************************/
body .btn .mdi{
  color:#ffffff !important;
}

.btn.btn-custom.gap{
  margin-top:10px;
}

/*******************************************************************************
  Button dropdown
*******************************************************************************/
.dropdown.custom{
  display:inline-block;
  vertical-align:bottom;
}

/*
.btn.btn-icons{
  width:40px;
  height:30px !important;
  padding:0px;
} */

/*******************************************************************************
  Tags Input

div.tagsinput{
  width:100% !important;
  min-height:auto !important;
  height:auto !important;
  padding:2px !important;
  border:1px solid #dee2e6 !important;
  border-radius:2px !important;
}

div.tagsinput input{
  padding:0px !important;
  margin:0px !important;
}

div.tagsinput span.tag{
  margin-bottom:0px !important;
}


div.tagsinput .tags_addTag{
  padding:0px !important;
}

div.tagsinput .tags_addTag input{
  padding:0px !important;
  border:1px solid black !important;

}

div.tagsinput > a{

}


*******************************************************************************/
.bootstrap-tagsinput{
  width:100% !important;
  border:1px solid #dee2e6 !important;
  border-radius:2px !important;

}

.bootstrap-tagsinput .tag{
  padding:2px 4px !important;
  border-radius:4px !important;
  margin:2px !important;
  border-width:1px !important;
  border-style:solid !important;
}

.twitter-typeahead{
  width:200px !important;
}

.twitter-typeahead .tt-menu{
  width:300px !important;
}

.twitter-typeahead pre{
  display:none !important;
}
/*
.twitter-typeahead,
.tt-hint, .tt-input, .tt-menu { width:100% !important; }*/

.tt-hint{
  line-height:20px !important;
  margin:-7px 0px !important;
  padding:-25px 5px !important;
  font-size:14px;
display:none !important;
}

/*******************************************************************************
  Checkbox
*******************************************************************************/

.form-check.form-check-flat label input:checked + .input-helper:before{
  /* background-color:#ff6258; */

  background-color:#cc3333;


}

.form-check .form-check-label .input-helper:after{
  top:0;
}

.form-check .form-check-label input:disabled:checked + .input-helper:after{
  /* content:'ds'; */
  color:#white;
  font-family: Material Design Icons;
  content: '\F156';
  font-size: 0.9375rem;
  font-weight: bold;
  left: 0;
  position:absolute;
  color:#ffffff;
}

.form-check .form-check-label input:disabled:checked + .input-helper:after{
  /* color:#ffffff !important; */
}

.form-check.form-check-flat label input:disabled + .input-helper:before{
  background-color:#dee2e6 !important;
  border-color:#dee2e6 !important;


}

/*******************************************************************************
  Pagination
*******************************************************************************/
.pagination{
  justify-content:center;
  padding:10px 0px;
}

.pagination .page-item.active .page-link{
  background:#ff3225 !important;
  border-color:#ff3225 !important;
}

.pagination .page-item:active .page-link,
.pagination .page-item .page-link:active:focus{
  background-color:#ff3225 !important;
}

.pagination .page-item span.page-link:active:focus,
.pagination .page-item span.page-link:active:hover,
.pagination .page-item span.page-link:focus:hover{
  background:pink !important;
  border:none !important;
  outline:none !important;
}

.pagination .page-item .page-link:hover,
.pagination .page-item.disabled:hover span.page-link,
.pagination .page-item.disabled span.page-link:hover{
  background:#ff3225 !important;
  border-color:#ff3225  !important;
}

/*******************************************************************************
  Sort List Button
*******************************************************************************/

.list-sort{
  width:60px !important;
}

/*******************************************************************************
  Selected Checkbox (List)
*******************************************************************************/

.selected-btn{
  height:40px !important;
}

/*******************************************************************************
  Pull Right
*******************************************************************************/

.right-pull{
  float:right !important;
}

/*******************************************************************************
  Toggle
*******************************************************************************/
.toggle-on{
  top:10% !important;

}
.toggle-off{
  top:10% !important;

}
.toggle{
  height:3% !important;

}

/* Mobile Tab
*******************************************************************************/

.select2.menu-mobile-selection .select2-container--default{
  border:1px solid red;
}

/*  Login
*******************************************************************************/
#login .submit-btn{
  background:#cc3333 !important;
  border-color:#cc3333 !important;
}

#login .mdi{
  color:#000000 !important;
  border-color:#cc3333 !important;
}


/******************************************************************************
  Theme Color Default
*******************************************************************************/
body[data-theme='default'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

body[data-theme='default'] .sidebar{
  background:linear-gradient(to top, #040101b8, #cc3333) !important;
}


/*  Text Custom
*******************************************************************************/
body[data-theme='default'] .text-custom{
  color:#cc3333;
}



/*  Button
*******************************************************************************/
body[data-theme='default'] .btn-custom{
  background-color:#ff3225;
  border-color:#ff2618;
  color:#ffffff;
}

body[data-theme='default'] .btn-custom:hover{
  background-color:#ff3e32;
  border-color:#ff3225;
  color:#ffffff;
}

/*  Tab
*******************************************************************************/
body[data-theme='default'] .tab-switch .nav-item .nav-link.active{
  border-bottom:3px solid #ff3225 !important;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='default'] .bootstrap-tagsinput .tag{
  border-color:#942d40 !important;
  background:#cc3333 !important;
  color:#ffffff !important;
}

body[data-theme='default'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/*  Text Color
*******************************************************************************/
body[data-theme='default']{
  color:#cc3333 !important;
}

/******************************************************************************
  Theme Color Red
*******************************************************************************/
body[data-theme='red'] .bg-custom{
  background-color:#cc3333;
}

/*  Icon
*******************************************************************************/
body[data-theme='red'] .mdi{
  color:#cc3333;
}



/*  Icon Inverse
*******************************************************************************/
body[data-theme='red'] .mdi.inverse{
  color:#ffffff;
}


/*  Color Palette
*******************************************************************************/
body[data-theme='red'] .color-palette{
  display:flex;
}

body[data-theme='red'] .color-palette .color{
  border-radius:5em;
  font-size: 6px;
  padding:1px;
  margin-right: 5px;
}

body[data-theme='red'] .color-palette .color.success{
  background-color:#19d895;
  border:1px solid #19d895;
}

body[data-theme='red'] .color-palette .color.primary{
  background-color:#2196f3;
  border:1px solid #2196f3;
}

body[data-theme='red'] .color-palette .color.danger{
  background-color:#ff6258;
  border:1px solid #ff6258;
}

body[data-theme='red'] .color-palette .color.warning{
  background-color:#ffaf00;
  border:1px solid #ffaf00;
}

body[data-theme='red'] .color-palette .color.custom{
  background-color:#cc3333;
  border:1px solid #cc3333;
}

body[data-theme='red'] .color-palette .color::after{
  content:'\00a0\00a0';
  padding:8px;
}

body[data-theme='red'] .color-palette .text{
  font-size: 0.8rem;
}



/*  Icon
*******************************************************************************/
body[data-theme='red'] .btn-secondary .mdi{
  color:#cc3333 !important;
}

/*  Header
*******************************************************************************/
body[data-theme='red'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='red'] .sidebar{
  background:#cc3333 !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='red'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='red'] .sidebar > .nav > .nav-item > a:hover{
  background:#942d40 !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='red'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#cc3333 !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='red'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='red'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#942d40 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='red'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='red'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='red'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='red'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#942d40 !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='red'] .text-custom{
  color:#cc3333;
}

/*  Button Custom
*******************************************************************************/
body[data-theme='red'] .btn-custom{
  background-color:#cc3333;
  border-color:#cc3333;
  color:#ffffff;
}

body[data-theme='red'] .btn-custom:hover{
  background-color:#cc4444;
  border-color:#cc4444;
  color:#ffffff;
}

/*  Tab
*******************************************************************************/
body[data-theme='red'] .tab-switch .nav-item .nav-link.active{
  border-bottom:3px solid #cc4444 !important;
}

body[data-theme='red'] .tab-solid.tab-solid-custom .nav-link.active{
  background-color:#cc3333;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='red'] .bootstrap-tagsinput .tag{
  border-color:#942d40 !important;
  background:#cc3333 !important;
  color:#ffffff !important;
}

body[data-theme='red'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/*  Border Custom
*******************************************************************************/
body .border-custom{
  border:1px solid #cc3333;
}

/******************************************************************************
  Theme Color Red Gradient
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='red-gradient'] .mdi{
  color:#cc3333 !important;
}

/*  Header
*******************************************************************************/
body[data-theme='red-gradient'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='red-gradient'] .sidebar{
  background:linear-gradient(to top, #040101b8, #cc3333) !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='red-gradient'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='red-gradient'] .sidebar > .nav > .nav-item > a:hover{
  background:#942d40 !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='red-gradient'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:linear-gradient(to top, #040101b8, #cc3333) !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='red-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='red-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#942d40 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='red-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='red-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='red-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='red-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#942d40 !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='red-gradient'] .text-custom{
  color:#cc3333;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='red-gradient'] .bootstrap-tagsinput .tag{
  border-color:#942d40 !important;
  background:#cc3333 !important;
  color:#ffffff !important;
}

body[data-theme='red-gradient'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Blue
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='blue'] .mdi{
  color:#0d0bce !important;
}

/*  Header
*******************************************************************************/
body[data-theme='blue'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='blue'] .sidebar{
  background:#0d0bce !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='blue'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='blue'] .sidebar > .nav > .nav-item > a:hover{
  background:#040363 !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='blue'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#040363 !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='blue'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='blue'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#040363 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='blue'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='blue'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='blue'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='blue'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#040363 !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='blue'] .text-custom{
  color:#040363;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='blue'] .bootstrap-tagsinput .tag{
  border-color:#040363 !important;
  background:#0d0bce !important;
  color:#ffffff !important;
}

body[data-theme='blue'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Blue Gradient
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='blue-gradient'] .mdi{
  color:#0d0bce !important;
}

/*  Header
*******************************************************************************/
body[data-theme='blue-gradient'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='blue-gradient'] .sidebar{
  background:linear-gradient(to top, #040101b8, #0d0bce) !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='blue-gradient'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='blue-gradient'] .sidebar > .nav > .nav-item > a:hover{
  background:#040363 !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='blue-gradient'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#040363 !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='blue-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='blue-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#040363 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='blue-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='blue-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='blue-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='blue-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#040363 !important;
}


/*  Text Custom
*******************************************************************************/
body[data-theme='blue-gradient'] .text-custom{
  color:#040363;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='blue-gradient'] .bootstrap-tagsinput .tag{
  border-color:#040363 !important;
  background:#0d0bce !important;
  color:#ffffff !important;
}

body[data-theme='blue-gradient'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Purple
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='purple'] .mdi{
  color:#26249d !important;
}

/*  Header
*******************************************************************************/
body[data-theme='purple'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='purple'] .sidebar{
  background:#26249d !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='purple'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='purple'] .sidebar > .nav > .nav-item > a:hover{
  background:#01012c !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='purple'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#01012c !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='purple'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='purple'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#01012c !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='purple'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='purple'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='purple'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='purple'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#01012c !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='purple'] .text-custom{
  color:#01012c;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='purple'] .bootstrap-tagsinput .tag{
  border-color:#26249d !important;
  background:#01012c !important;
  color:#ffffff !important;
}

body[data-theme='purple'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Purple Gradient
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='purple-gradient'] .mdi{
  color:#26249d !important;
}

/*  Header
*******************************************************************************/
body[data-theme='purple-gradient'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='purple-gradient'] .sidebar{
  background:linear-gradient(to top, #040101b8, #26249d) !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='purple-gradient'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='purple-gradient'] .sidebar > .nav > .nav-item > a:hover{
  background:#01012c !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='purple-gradient'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#01012c !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='purple-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='purple-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#01012c !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='purple-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='purple-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='purple-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='purple-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#01012c !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='purple-gradient'] .text-custom{
  color:#01012c;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='purple-gradient'] .bootstrap-tagsinput .tag{
  border-color:#26249d !important;
  background:#01012c !important;
  color:#ffffff !important;
}

body[data-theme='purple-gradient'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Green
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='green'] .mdi{
  color:#146722 !important;
}

/*  Header
*******************************************************************************/
body[data-theme='green'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='green'] .sidebar{
  background:#146722 !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='green'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='green'] .sidebar > .nav > .nav-item > a:hover{
  background:#0a3211 !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='green'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#0a3211 !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='green'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='green'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#0a3211 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='green'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='green'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='green'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='green'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#0a3211 !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='green'] .text-custom{
  color:#0a3211;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='green'] .bootstrap-tagsinput .tag{
  border-color:#0a3211 !important;
  background:#0a3211 !important;
  color:#ffffff !important;
}

body[data-theme='green'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Green Gradient
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='green-gradient'] .mdi{
  color:#146722 !important;
}

/*  Header
*******************************************************************************/
body[data-theme='green-gradient'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='green-gradient'] .sidebar{
  background:linear-gradient(to top, #040101b8, #146722) !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='green-gradient'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='green-gradient'] .sidebar > .nav > .nav-item > a:hover{
  background:#0a3211 !important;
}

/*  Sidebar Circle Dot
*******************************************************************************/
body[data-theme='green-gradient'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#0a3211 !important;
}

/*  Sidebar Border Line Background
*******************************************************************************/
body[data-theme='green-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='green-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#0a3211 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='green-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='green-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='green-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='green-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#0a3211 !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='green-gradient'] .text-custom{
  color:#0a3211;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='green-gradient'] .bootstrap-tagsinput .tag{
  border-color:#0a3211 !important;
  background:#0a3211 !important;
  color:#ffffff !important;
}

body[data-theme='green-gradient'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Pink
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='pink'] .mdi{
  color:#ce3c56 !important;
}

/*  Header
*******************************************************************************/
body[data-theme='pink'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='pink'] .sidebar{
  background:#ce3c56 !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='pink'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='pink'] .sidebar > .nav > .nav-item > a:hover{
  background:#942d40 !important;
}

/*  Sidebar List Circle Dot Background
*******************************************************************************/
body[data-theme='pink'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#ce3c56 !important;
}

/*  Sidebar List Border Line Background
*******************************************************************************/
body[data-theme='pink'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='pink'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#942d40 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='pink'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='pink'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='pink'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='pink'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#942d40 !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='pink'] .text-custom{
  color:#942d40;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='pink'] .bootstrap-tagsinput .tag{
  border-color:#942d40 !important;
  background:#ce3c56 !important;
  color:#ffffff !important;
}

body[data-theme='pink'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Pink Gradient
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='pink-gradient'] .mdi{
  color:#ce3c56 !important;
}

/*  Header
*******************************************************************************/
body[data-theme='pink-gradient'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='pink-gradient'] .sidebar{
  background:linear-gradient(to top, #040101b8, #ce3c56) !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='pink-gradient'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='pink-gradient'] .sidebar > .nav > .nav-item > a:hover{
  background:#942d40 !important;
}

/*  Sidebar List Circle Dot Background
*******************************************************************************/
body[data-theme='pink-gradient'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:linear-gradient(to top, #040101b8, #ce3c56) !important;
}

/*  Sidebar List Border Line Background
*******************************************************************************/
body[data-theme='pink-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='pink-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#942d40 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='pink-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='pink-gradient'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='pink-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='pink-gradient'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#942d40 !important;
}

/*  Text Custom
*******************************************************************************/
body[data-theme='pink-gradient'] .text-custom{
  color:#942d40;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='pink-gradient'] .bootstrap-tagsinput .tag{
  border-color:#942d40 !important;
  background:#ce3c56 !important;
  color:#ffffff !important;
}

body[data-theme='pink-gradient'] div.tagsinput span.tag a{
  color:#ffffff !important;
}

/******************************************************************************
  Theme Color Orange
*******************************************************************************/

/*  Icon
*******************************************************************************/
body[data-theme='orange'] .mdi{
  color:#ffa500 !important;
}

/*  Header
*******************************************************************************/
body[data-theme='orange'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='orange'] .sidebar{
  background:#ffa500 !important;
}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='orange'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='orange'] .sidebar > .nav > .nav-item > a:hover{
  background:#9b6502 !important;
}

/*  Sidebar List Circle Dot Background
*******************************************************************************/
body[data-theme='orange'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#9b6502 !important;
}

/*  Sidebar List Border Line Background
*******************************************************************************/
body[data-theme='orange'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='orange'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#9b6502 !important;
}

/*  Sidebar Border Line and Font Background
*******************************************************************************/
body[data-theme='orange'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:hover:before,
body[data-theme='orange'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:hover:before {
  color:#ffffff !important;
  background:#ffffff !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='orange'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='orange'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#9b6502 !important;
}


/*  Text Custom
*******************************************************************************/
body[data-theme='orange'] .text-custom{
  color:#9b6502;
}

/*  Tags Input
*******************************************************************************/
body[data-theme='orange'] .bootstrap-tagsinput .tag{
  border-color:#9b6502 !important;
  background:#9b6502 !important;
  color:#ffffff !important;
}

body[data-theme='orange'] div.tagsinput span.tag a{
  color:#ffffff !important;
}


/******************************************************************************
  Theme Color Yellow (Under Construction)
*******************************************************************************/

/*  Header
*******************************************************************************/
body[data-theme='yellow'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

/*  Sidebar
*******************************************************************************/
body[data-theme='yellow'] .sidebar{
  background:#f7f70a !important;

}

/*  Sidebar Icon Color
*******************************************************************************/
body[data-theme='yellow'] .sidebar i:before{
  color:#ffffff !important;
}

/*  Sidebar Font
*******************************************************************************/
body[data-theme='yellow'] .sidebar a,
body[data-theme='yellow'] .sidebar p,
body[data-theme='yellow'] .sidebar li{
  color:#000000 !important;
}

/*  Sidebar Hover Background
*******************************************************************************/
body[data-theme='pink-gradient'] .sidebar > .nav > .nav-item > a:hover{
  background:#942d40 !important;
}

/*  Sidebar List Circle Dot Background
*******************************************************************************/
body[data-theme='yellow'] .sidebar > .nav > .nav-item > .nav-link:before{
  background:#f7f70a !important;
  border-color:#c8c6c6 !important;
}

/*  Sidebar List Border Line Background
*******************************************************************************/
body[data-theme='yellow'] .sidebar > .nav .nav-item:not(.hover-open) .collapse .sub-menu .nav-item .nav-link:before,
body[data-theme='yellow'] .sidebar > .nav .nav-item:not(.hover-open) .collapsing .sub-menu .nav-item .nav-link:before{
    background:#c8c6c6 !important;
}

/*  Sidebar Icon Sub Background
*******************************************************************************/
body[data-theme='yellow'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link,
body[data-theme='yellow'].sidebar-icon-only .sidebar .nav .nav-item.hover-open .nav-link .menu-title {
    background:#a5a500 !important;
}

/******************************************************************************
  Theme Color Pink Gradient
*******************************************************************************/
body[data-theme='yellow-gradient'] .navbar.default-layout .navbar-brand-wrapper{
  background:#ffffff;
}

body[data-theme='yellow-gradient'] .sidebar{
  background:linear-gradient(to top, #040101b8, #ce3c56) !important;
}

body[data-theme='yellow-gradient'] .sidebar > a{
  color:black;
}

body[data-theme='yellow-gradient'] .sidebar .nav-link:before{
  background:#c8c6c6 !Important;
  border-color:black !Important;
}

body[data-theme='yellow-gradient'] .sidebar .nav-item:hover{
  background:rgba(0, 0, 0, 0.3) !important;
}

body[data-theme='yellow-gradient'] .sidebar .nav-item a:hover{
  background:rgba(0, 0, 0, 0.3) !important;
}

@media (max-width:575.98px){
  .btn.btn-auto-resize{
    width:100%;
    margin:3px;
  }
}