/* Header */
body > .header {position: absolute; top: 0; left: 0; right: 0; z-index: 1030; background: #f1f1f1;}

/* Define 2 column template */
.right-side, .left-side {min-height: 100%; display: block;}
.right-side {margin-left: 250px;}
.left-side {position: absolute; width: 250px; top: 0;}
.left-side .sidebar-offcanvas a {padding: 0; margin: 0; vertical-align: top;}

/* H1 - H6 font */
.content-header h1 {font-size: 22px; line-height: 1.5;}

/* Josh Style starts here ----- */
.responsive_nav {margin-top: -8px; background: url(../img/nav_icon.png); width: 25px; height: 17px;}
.nav_icons ul {margin: 0; padding-left: 29px; padding-top: 10px;}
.nav_icons li {float: left; list-style: none; cursor: pointer; padding: 5px 9px;}
.clear {clear: both;}
.fa-plus, .fa-minus {font-size: 10px;}
.nopadmar {margin: 0; padding: 0;}
body > .header .navbar .sidebar-toggle {float: left; padding: 9px 5px; margin-top: 8px; margin-right: 0; margin-bottom: 8px; margin-left: 5px; color: #f9c3c3; border: 1px solid transparent; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
.left-side li a {font-family: 'Noto Sans', sans-serif; letter-spacing: 0.1em; font-size: 14px;}
.left-side li a i {padding-top: 2px;}
.right-side > .content-header > .breadcrumb a {color: #333;}

/* skin-josh logo */
.skin-josh .logo {background-color: #515763;}
.skin-josh .logo > h1 {margin-top: 0; font-size: 40px; letter-spacing: 0.1em; color: #fff; text-shadow: 4px 4px 4px #888;}

/* skin-josh content header */
.skin-josh .right-side > .content-header {background: #f1f1f1; box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.05); border-bottom: 1px solid #d0d0d0; min-height: 54px; height: auto; margin-bottom: 20px;}
.skin-josh .right-side > .content-header h1 {color: #333; -webkit-font-smoothing: antialiased;}

/*Components: navbar, logo and content header----------*/
body > .header {position: relative; z-index: 1030;}
body > .header .navbar {height: 50px; margin-bottom: 0; margin-left: 250px;}
body > .header .navbar .sidebar-toggle {float: left; padding: 15px 10px 10px 10px; margin-top: 8px; margin-right: 0; margin-bottom: 8px; margin-left: 5px; background-color: #444954; background-image: none; -webkit-border-radius: 0; -moz-border-radius: 0; border-radius: 0;}
body > .header .navbar .nav > li > a > .label {-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; position: absolute; top: 7px; right: 10px; font-size: 10px; font-weight: normal; width: 15px; height: 15px; line-height: 1.0em; text-align: center; padding: 2px;}
body > .header .navbar .nav > li > a:hover > .label {top: 3px;}
body > .header .logo {display: block; float: left; height: 50px; line-height: 50px; padding: 0 10px; text-align: center; width: 250px;}
body > .header .logo .icon {margin-right: 10px;}
.right-side > .content-header {position: relative; padding: 10px;}
.right-side > .content-header > h1 {margin: 0;}
.right-side > .content-header > h1 > small {font-size: 15px; display: inline-block; padding-left: 4px; font-weight: 300;}
.right-side > .content-header > .breadcrumb {float: right; background: transparent; margin-top: 0; margin-bottom: 0; font-size: 12px; font-family: Lato, sans-serif; padding: 7px 5px; position: absolute; top: 15px; right: 10px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px;}
.right-side > .content-header > .breadcrumb > li > a {color: #444; text-decoration: none;}
.right-side > .content-header > .breadcrumb > li > a > .fa, .right-side > .content-header > .breadcrumb > li > a > .glyphicon, .right-side > .content-header > .breadcrumb > li > a > .ion {margin-right: 5px;}
.right-side > .content-header > .breadcrumb > li + li:before {content: '\00BB'; font-size: 16px; color: #000;}

/*Component: Sidebar--------------------------*/
.sidebar {margin-bottom: 5px;}
.sidebar .sidebar-form input:focus {-webkit-box-shadow: none; -moz-box-shadow: none; box-shadow: none; border-color: transparent;}
.sidebar .sidebar-menu {list-style: none; margin: 0; padding: 0;}
.sidebar .sidebar-menu > li {border-bottom: 1px solid #676767; margin: 0; padding: 0;}
.sidebar .sidebar-menu > li > a {padding: 15px 9px 15px 15px; display: block;}
.sidebar .sidebar-menu > li > a > .fa, .sidebar .sidebar-menu > li > a > .glyphicon, .sidebar .sidebar-menu > li > a > .ion {width: 20px;}
.sidebar .sidebar-menu .treeview-menu {display: none; list-style: none; padding: 0; margin: 0;}
.sidebar .sidebar-menu .treeview-menu > li {margin: 0; background: #333;}
.sidebar .sidebar-menu .treeview-menu > li > a {padding: 5px 5px 5px 15px; display: block; font-size: 14px; margin: 0;}
.sidebar .sidebar-menu .treeview-menu > li > a > .fa, .sidebar .sidebar-menu .treeview-menu > li > a > .glyphicon, .sidebar .sidebar-menu .treeview-menu > li > a > .ion {width: 20px;}
.user-panel {padding: 10px;}
.user-panel:before, .user-panel:after {display: table; content: " ";}
.user-panel:after {clear: both;}
.user-panel > .image > img {width: 45px; height: 45px;}
.user-panel > .info {font-weight: 600; padding: 5px 5px 5px 15px; font-size: 14px; line-height: 1;}
.user-panel > .info > p {margin-bottom: 9px;}
.user-panel > .info > a {text-decoration: none; padding-right: 5px; margin-top: 3px; font-size: 11px; font-weight: normal;}
.user-panel > .info > a > .fa, .user-panel > .info > a > .ion, .user-panel > .info > a > .glyphicon {margin-right: 3px;}

/*Dropdown menus----------------------------*/
.dropdown-menu > li > a > .glyphicon, .dropdown-menu > li > a > .fa, .dropdown-menu > li > a > .ion {margin-right: 10px;}
.dropdown-menu {box-shadow: 0 6px 12px rgba(0, 0, 0, .175);}

/*Drodown in navbars*/
.skin-blue .navbar .dropdown-menu > li > a {color: #444444;}

/*---------------------Navbar custom dropdown menu---------------*/
.navbar-nav > .notifications-menu > .dropdown-menu, .navbar-nav > .messages-menu > .dropdown-menu, .navbar-nav > .tasks-menu > .dropdown-menu {width: 250px; padding: 0 0 0 0; margin: 0; margin-top: -3px; top: 100%; border: 1px solid #dfdfdf; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
.navbar-nav > .notifications-menu > .dropdown-menu > li.header, .navbar-nav > .messages-menu > .dropdown-menu > li.header, .navbar-nav > .tasks-menu > .dropdown-menu > li.header {-webkit-border-top-left-radius: 4px; -webkit-border-top-right-radius: 4px; -webkit-border-bottom-right-radius: 0; -webkit-border-bottom-left-radius: 0; -moz-border-radius-topleft: 4px; -moz-border-radius-topright: 4px; -moz-border-radius-bottomright: 0; -moz-border-radius-bottomleft: 0; border-top-left-radius: 4px; border-top-right-radius: 4px; border-bottom-right-radius: 0; border-bottom-left-radius: 0; background-color: #ffffff; padding: 7px 10px; border-bottom: 1px solid #676767; color: #444444; font-size: 14px;}
.navbar-nav > .notifications-menu > .dropdown-menu > li.header:after, .navbar-nav > .messages-menu > .dropdown-menu > li.header:after, .navbar-nav > .tasks-menu > .dropdown-menu > li.header:after {bottom: 100%; left: 92%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-width: 7px; margin-left: -7px;}
.navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a, .navbar-nav > .messages-menu > .dropdown-menu > li.footer > a, .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a {-webkit-border-top-left-radius: 0; -webkit-border-top-right-radius: 0; -webkit-border-bottom-right-radius: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-topleft: 0; -moz-border-radius-topright: 0; -moz-border-radius-bottomright: 4px; -moz-border-radius-bottomleft: 4px; border-top-left-radius: 0; border-top-right-radius: 0; border-bottom-right-radius: 4px; border-bottom-left-radius: 4px; font-size: 12px; background-color: #f4f4f4; padding: 7px 10px; color: #444444; text-align: center;}
.navbar-nav > .notifications-menu > .dropdown-menu > li.footer > a:hover, .navbar-nav > .messages-menu > .dropdown-menu > li.footer > a:hover, .navbar-nav > .tasks-menu > .dropdown-menu > li.footer > a:hover {background: #f4f4f4; text-decoration: none; font-weight: normal;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu, .navbar-nav > .messages-menu > .dropdown-menu > li .menu, .navbar-nav > .tasks-menu > .dropdown-menu > li .menu {margin: 0; padding: 0; list-style: none; overflow-x: hidden;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a, .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a, .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a {display: block; white-space: nowrap; border-bottom: 1px solid #eee;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a:hover, .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:hover, .navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a:hover {text-decoration: none;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a {font-size: 12px; color: #444444;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .glyphicon, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .fa, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .ion {font-size: 20px; width: 50px; text-align: center; padding: 15px 0; margin-right: 5px; background: #00c0ef; color: #f9f9f9; color: rgba(255, 255, 255, 0.7);}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .glyphicon.danger, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .fa.danger, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .ion.danger {background: #f56954;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .glyphicon.warning, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .fa.warning, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .ion.warning {background: #F89A14;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .glyphicon.success, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .fa.success, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .ion.success {background: #01BC8C;}
.navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .glyphicon.info, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .fa.info, .navbar-nav > .notifications-menu > .dropdown-menu > li .menu > li > a > .ion.info {background: #00c0ef;}
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a {margin: 0; line-height: 20px; padding: 10px 5px 10px 5px; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px;}
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > div > img {margin: auto 10px auto auto; width: 40px; height: 40px; border: 1px solid #dddddd;}
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 {padding: 0; margin: 0 0 0 45px; color: #444444; font-size: 15px;}
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > h4 > small {color: #999999; font-size: 10px; float: right; margin-top: -7px;}
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a > p {margin: 0 0 0 45px; font-size: 12px; color: #888888;}
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:before, .navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:after {display: table; content: " ";}
.navbar-nav > .messages-menu > .dropdown-menu > li .menu > li > a:after {clear: both;}
.navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a {padding: 10px;}
.navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a > h3 {font-size: 14px; padding: 0; margin: 0 0 10px 0; color: #666666;}
.navbar-nav > .tasks-menu > .dropdown-menu > li .menu > li > a > .progress {padding: 0; margin: 0;}
.navbar-nav > .user-menu > .dropdown-menu {padding: 0; margin-top: -6px; border-radius: 4px;}
.navbar-nav > .user-menu > .dropdown-menu:after {bottom: 100%; right: 10px; border: solid rgba(255, 255, 255, 0); content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-bottom-color: #ffffff; border-width: 10px; margin-left: -10px;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header {height: auto; width:200px; overflow-x:hidden; padding: 6%; background: #3c8dbc; text-align: center;}
.navbar-nav > .user-menu > a img{height:35px;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > img {z-index: 5; height: 90px; width: 90px; border: 8px solid; border-color: rgba(255, 255, 255, 0.2);}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > p {z-index: 5; color: #f9f9f9; color: rgba(255, 255, 255, 0.8); font-size: 17px; margin-top: 10px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-header > p > small {display: block; font-size: 12px;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body {padding: 15px; border-bottom: 1px solid #f4f4f4; border-top: 1px solid #dddddd;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body:before, .navbar-nav > .user-menu > .dropdown-menu > li.user-body:after {display: table; content: " ";}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body:after {clear: both;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-body > div > a {color: #0073b7;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer {padding: 10px;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer:before, .navbar-nav > .user-menu > .dropdown-menu > li.user-footer:after {display: table; content: " ";}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer:after {clear: both;}
.navbar-nav > .user-menu > .dropdown-menu > li.user-footer .btn-default {color: #666666;}


.dropdown-menu .menu i {display: inline-block; margin: 4px 12px; float: left; padding: 10px 30px 30px 10px; text-align: center; border-radius: 50%; border: 1px solid #eee;}
.dropdown-menu .menu a {line-height: 54px;}
.dropdown-menu .header {background: #1d1d1d !important; color: #FFF !important;}
.mesages li img {width: 46px; padding-top: 5px; height: auto; float: left; margin-right: 15px;}
.mesages li {padding: 5px; cursor: pointer;}
.mesages li span {font-size: 12px; display: inline-block; clear: both; float: none;}
.mesages li .samp {font-family: Lato, sans-serif; font-size: 11px; clear: both; margin-top: -3px;}
.mesages li .time {font-size: 11px; color: #666; margin-top: -3px;}
.notifications-menu small {clear: both !important; top: 0 !important; margin-top: -48px; padding-top: 0; padding-right: 10px; display: inline-block;}
.message .message-image {display: block; float: left; width: 45px; height: 45px; margin-right: 15px; text-align: center; padding-top: 3px;}
.message .message-body {overflow: hidden; zoom: 1; line-height: 16px;}
.message-body small {font-size: 11px;}
.paddingright_10 {padding-right: 5px;}
.message-body strong {font-size: 12px;}
.message-body {font-size: 11px;}
.message-body small {font-size: 9px;}
li.dropdown-title {padding: 010px; background: #f1f1f1; border-bottom: 1px solid #ccc;}
.slimScrollDiv .menu li {width: 100%; font-size: 12px; display: inline-block;}
li.dropdown-footer {padding: 010px; background: #f1f1f1; border-bottom: 1px solid #ccc;}
.success {background-color: #00bc8c;}
.padding-15 {padding: 15px !important;}
.dropdown-menu .message a {padding: 3px 6px;}
.dropdown-menu li > .message {border-bottom: 1px solid #ccc; padding-bottom: 5px; padding-top: 3px;}
.dropdown-menu .footer {margin: 0; padding: 0; border-bottom: none;}
.dropdown-menu .message:hover {background: #e0e0e0 !important;}
.message .ol {padding: 5px; padding-right: 10px;}
.message .ol:hover {color: #090;}
.navbar-right .nav > li > a {position: relative; display: block; padding: 8px 7px;}
.btn-primary, .primary {background: #428BCA;}
.btn-success, .success {background: #01BC8C;}
.btn-warning, .warning {background: #F89A14;}
.btn-danger, .danger {background: #f56954;}
.paddingrightleft_10 {padding-left: 15px; padding-right: 15px;}
.paddingtopbottom_5px {padding-bottom: 5px; padding-top: 5px;}
.dropdown > .messages-menu > .open {background: #FFF !important;}
.plus-minus {float: right;}
.sidebar_threeicons li a, .sidebar_threeicons li {border-top: 2px;}
.sidebar_threeicons li a {padding: 10px;}
.sidebar_threeicons li {padding: 0; margin: 0 3px;}

/* Page Sidebar */
.page-sidebar .page-sidebar-menu li > a > .arrow:before, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li > {float: right; margin-top: -1px; margin-right: 5px; display: inline; font-size: 16px; font-family: FontAwesome; height: auto; content: "+"; font-weight: 300; text-shadow: none;}
.page-sidebar .page-sidebar-menu li > a > .badge, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu li > a > .badge {float: right; margin-top: 1px; margin-right: 0; font-weight: normal; background-color: #EF6F6C;}
.page-sidebar .page-sidebar-menu .sub-menu li > a .arrow:before, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > a .arrow:before {margin-right: 4px; font-size: 16px;}
.page-sidebar .page-sidebar-menu .sub-menu li > a .arrow.open:before, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > a .arrow.open:before {margin-right: 2px; font-size: 16px;}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu {margin: 0;}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu > li > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu > li > a {padding-left: 60px;}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu > li > .sub-menu, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu > li > .sub-menu {margin: 0;}
.page-sidebar .page-sidebar-menu .sub-menu li > .sub-menu > li > .sub-menu > li > a, .page-sidebar-closed.page-sidebar-fixed .page-sidebar:hover .page-sidebar-menu .sub-menu li > .sub-menu > li > .sub-menu > li > a {padding-left: 80px;}
.back-to-top {cursor: pointer; position: fixed; bottom: 30px; right: 30px; display: none; border-radius: 50%; padding: 15px; font-size: 10px; opacity: 0.7; z-index: 9999;}
.navbar-right .nav .open > a, .navbar-right .nav .open > a:hover, .navbar-right .nav .open > a:focus, .navbar-right .nav > li > a:hover, .navbar-right .nav > li > a:focus {background-color: #414151; border-color: #428bca;}
.riot {color: #fff; padding: 15px 4px 5px 45px;}
.riot .caret {margin-top: -10px;}
.riot span i {margin-top: 0 !important;}
.riot div {margin-top: -10px;}
.message_menu {width: auto; height: 200px; overflow: scroll;}
.navbar-nav > .user-menu > .dropdown-menu:after {-moz-border-bottom-colors: none; -moz-border-left-colors: none; -moz-border-right-colors: none; -moz-border-top-colors: none; border-color: transparent;}

/*side bar nav */
.sidebar {display: block; float: left; width: 250px;}
.content {display: block; width: auto;}
.sidebar-nav {background: #515763;}
.sidebar-nav ul {padding: 0; margin: 0; list-style: none;}
.sidebar-nav ul li, .sidebar-nav ul a {display: block;}
.sidebar-nav ul a {padding: 12px; color: #aaa; -webkit-font-smoothing: antialiased;}
.skin-josh .navbar {background-color: #515763;}
.skin-josh .navbar .nav a {color: #333;}
.skin-josh .navbar .nav > li > a:hover, .skin-josh .navbar .nav > li > a:active, .skin-josh .navbar .nav > li > a:focus, .skin-josh .navbar .nav .open > a, .skin-josh .navbar .nav .open > a:hover, .skin-josh .navbar .nav .open > a:focus {color: #333;}
.skin-josh .navbar .navbar-right > .nav {margin-right: 10px;}
.skin-josh .navbar .sidebar-toggle .icon-bar {background: #515763;}
.skin-josh .sidebar .page-sidebar-menu > li {border-bottom: 1px solid #515763;}
.skin-josh .sidebar .page-sidebar-menu > li:hover {background: #3a4252; border-bottom: 1px solid rgba(54, 60, 70, 0.5);}
.skin-josh .sidebar > .sidebar-menu > li > a {margin-right: 1px;}
.skin-josh .left-side {background: #515763; border-right: none;}
.skin-josh .sidebar a {color: #fff; font-family: Lato, sans-serif; -webkit-font-smoothing: antialiased; text-decoration: none;}
.skin-josh .sidebar li ul {background: #464d5a; border-top: 0.08em solid #666;}
.skin-josh .sidebar li.open a:hover {background: #3a4252 !important; text-decoration: none !important;}
.left-side #active {background: #32323c !important; color: #FFF;}
.skin-josh .sidebar li.open ul:hover, .skin-josh .sidebar li.open a ul:hover, .skin-josh .sidebar li.open ul li:hover{text-decoration: none !important;}
.left-side .active {background: #414151 !important;}
#active {color: #e0e0e0; text-decoration: none;}
.sidebar li .sub-menu li i {padding-right: 10px;}
.sidebar_threeicons li:hover {background: #3a4252;}

/*dashboard top 4 panels css*/
.squarebox h4 {font-size: 14px; padding: 0; margin: 0;}
.square_box .number {font-size: 30px; float: left; clear: both; margin-top: 0; text-align: left; font-weight: 700;}
.square_box span {font-size: 12px; float: left;}
.no-radius {border-radius: 4px;}
.lightbluebg {background: #418bca; color: #FFF; font-family: Lato, sans-serif; margin: 10px 0;}
.redbg {background: #EF6F6C; color: #FFF; font-family: Lato, sans-serif; margin: 10px 0;}
.goldbg {background: #F89A14; color: #FFF; font-family: Lato, sans-serif; margin: 10px 0;}
.palebluecolorbg {background: #00bc8c; color: #FFF; font-family: Lato, sans-serif; margin: 10px 0;}
.breadcrumb #active a, .breadcrumb a, .breadcrumb a:hover {color: #428bca; text-decoration: none;}
.bg-aqua {background: #028482}
img.flag {height: 16px; width: 28px; padding-right: 10px;}
.has-error .form-control {border-color: #EF6F6C; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);}
.has-error .control-label {color: #EF6F6C;}
.error{color:#ef6f6c;}
.error span{color: #ef6f6c;}
.has-success .form-control {border-color: #00bc8c; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);}
.has-success .control-label {color: #00bc8c;}
.has-warning .form-control {border-color: #F89A14; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);}
.has-warning .control-label {color: #F89A14;}
.panel-heading small {line-height: 23px; font-size: 12px;}
.orange_small_squarebox {width: 4px; height: 0; border: 5px solid #F89A14; overflow: hidden;}
.ccc_border {border: 1px solid #ccc; padding: 1px;}
.panel-title .ccc_border {margin-top: 20px;}
.panel-border {border: 1px solid #ddd;}
.panel-border .panel-heading {border-bottom: 1px solid #ddd; padding-bottom: 10px;}
.white-text {color: #fff; opacity: 0.7;}

/* this is for alligining livicon and tab title in same lineheight */
.page-sidebar-menu .livicon {float: left; margin-top: -2px; margin-right: 10px;}
.list1 {border-bottom: 1px solid #ccc; display: inline-block; width: 100%; padding: 2px 5px 1px 3px !important; background: #fff; float: left;}
.todoitemjs {padding-top: 3px;}
.text-col {color: #fff !important;}
.btn-success:hover {color: #fff; background-color: #1bc398; border-color: #1bc398;}
.btn-default:hover {color: #fff; background-color: #A9B6B1 !important; border-color: #A9B6B1 !important;}
.text-primary {color: #428BCA;}
.text-success {color: #01BC8C;}
.text-warning {color: #F89A14;}
.text-danger {color: #f56954;}
.paddingleft_right15 {padding: 0 15px;}
.clickable {cursor: pointer;}
.panel-heading span {margin-top: -20px; font-size: 15px;}
.portlet > .portlet-body.warning, .portlet.warning {background-color: #F89A14;}
.portlet.box > .portlet-title {margin-bottom: 0; padding: 10px 10px 4px 10px; border-bottom: 1px solid #eee;}
.portlet.box > .portlet-body {background-color: #fff; padding: 10px;}
.portlet > .portlet-body.success, .portlet.success {background-color: #01BC8C;}
.portlet > .portlet-body.orange, .portlet.orange {background-color: #A9B6BC;}
.portlet > .portlet-body.primary, .portlet.primary {background-color: #418BCA;}
.portlet.box.default > .portlet-title {background-color: #A9B6BC;}
.portlet.box.danger > .portlet-title {background-color: #EF6F6C;}
.portlet.box.info > .portlet-title {background-color: #67C5DF;}
.portlet.box > .portlet-title {margin-bottom: 0px; padding: 10px 10px 4px 10px; border-bottom: 1px solid #eee; color: #fff;}
.portlet.box {padding: 0px !important;}
.portlet {clear: both; margin-top: 0px; margin-bottom: 25px; padding: 0px;}
.portlet > .portlet-title > .actions > .btn.btn-sm {padding: 3px 8px; margin-top: -57px;}
.portlet > .portlet-title > .tools, .portlet > .portlet-title > .actions {display: inline-block; padding: 0; margin: 0; margin-top: 6px; float: right;}

/* panel css start*/
.panel-tools .dropdown {display: inline-block;}
.panel-tools {position: absolute; right: 33px; top: 14px; color: black !important;}
.panel-purple, .partition-purple {background-color: #7C3B97; position: relative; color: white;}
.panel-orange, .partition-orange {background-color: #f89a14; position: relative; color: white;}
.panel-red, .partition-red {background-color: #EF6F6C; position: relative; color: white;}
.panel-green, .partition-green {background-color: #01BC8C; position: relative; color: white;}
.panel-blue, .partition-blue {background-color: #418bca; position: relative; color: white;}
.panel-yellow, .partition-yellow {background-color: #FFB848; position: relative; color: white;}
.panel-lightgreen, .partlightgreenition-lightgreen {background-color: #39C3A9; position: relative; color: white;}
.panel-pink, .partition-pink {background-color: #E16E92; position: relative; color: white;}
.panel-dark, .partition-dark {background-color: #363A49; position: relative; color: white;}
.panel-grey, .partition-grey {background-color: #A9B6BC; position: relative; color: white;}

/* btn custom css*/
.btn-success {color: #fff; background-color: #01BC8C; border-color: #01BC8C;}
.btn-primary {color: #fff; background-color: #418BCA; border-color: #418BCA;}
.btn-info {color: #fff; background-color: #67C5DF; border-color: #67C5DF;}
.btn-warning {color: #fff; background-color: #F89A14; border-color: #F89A14;}
.btn-danger {color: #fff; background-color: #EF6F6C; border-color: #EF6F6C;}
.border-light {border-color: rgba(0, 0, 0, 0.1) !important;}

/* tables custome code*/
.label-success {background-color: #01BC8C;}
.label-primary {background-color: #c0daf1; color: #07447a;}
.label-info {background-color: #67C5DF;}
.label-warning {background-color: #F89A14;}
.label-danger {background-color: #EF6F6C;}
.label-default {background-color: #A9B6BC;}
.success {background: #01BC8C;}
.primary {background: #418BCA;}
.info {background: #67C5DF;}
.warning {background: #F89A14;}
.danger {background: #EF6F6C;}
.default {background: #F89A14;}
.alert-success {color: #fff; background-color: #22ddad; border-color: #acf6ac;}
.alert-success .alert-link {color: #fff;}
.alert-info {color: #fff; background-color: #62aceb; border-color: #67C5DF;}
.alert-info .alert-link {color: #fff;}
.alert-warning {color: #fff; background-color: #ffbb35; border-color:#F5A83D;}
.alert-warning .alert-link {color: #fff;}
.alert-danger {color: #fff; background-color: #ff908d; border-color: #EF6F6C;}
.alert-danger .alert-link {color: #fff;}
.alert-message-default {background-color: #EEE; border-color: #A9B6BC;}
.alert-message-success {background-color: #F4FDF0; border-color: #01BC8C;}
.alert {margin-bottom: 20px; border-radius: 4px;}
.alert.alert-dismissable {padding: 15px 35px 15px 15px;}
.alert h4 {margin: 0 0 10px;}
.alert ul {margin: 0; padding-left: 40px;}
.alert .close.btn-close {
    position: relative;
    top: -2px;
    right: -21px;
    float: right;
    width: auto;
    height: auto;
    box-sizing: border-box;
    padding: 0 !important;
    color: inherit;
    background: transparent !important;
    border: 0;
    border-radius: 0;
    opacity: .2;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    text-shadow: 0 1px 0 #fff;
}

#toast-container > .toast {
    border: 0;
    font-size: 14px;
    line-height: 20px;
}
.btn-orange {color: white; background-color: #EF6F6C; border-color: "";}
.btn-purple {color: white; background-color: #418BCA; border-color: "";}

/***Customized Bootstrap Panels***/

/*custom*/
.panel-custom {border-color: #ececec;}
.panel-custom > .panel-heading {color: #000; background-color: #ececec; border-color: #ececec;}
.panel-custom > .panel-heading + .panel-collapse .panel-body {border-top-color: #ececec;}

/*Info*/
.panel-info {border-color: #E7E1E8;}
.panel-info > .panel-heading {color: #fff; background-color: #67C5DF; border-color: #67C5DF;}
.panel-info > .panel-heading + .panel-collapse .panel-body {border-top-color: #67C5DF;}
.panel-info > .panel-footer + .panel-collapse .panel-body {border-bottom-color: #67C5DF;}

/*warning*/
.panel-warning {border-color: #E7E1E8;}
.panel-warning > .panel-heading {color: #fff; background-color: #F89A14; border-color: #F89A14;}
.panel-warning > .panel-heading + .panel-collapse .panel-body {border-top-color: #F89A14;}
.panel-warning > .panel-footer + .panel-collapse .panel-body {border-bottom-color: #F89A14;}

/*danger*/
.panel-danger {border-color: #E7E1E8;}
.panel-danger > .panel-heading {color: #fff; background-color: #EF6F6C; border-color: #EF6F6C;}
.panel-danger > .panel-heading + .panel-collapse .panel-body {border-top-color: #EF6F6C;}
.panel-danger > .panel-footer + .panel-collapse .panel-body {border-bottom-color: #EF6F6C;}

/*success*/
.panel-success {border-color: #E7E1E8;}
.panel-success > .panel-heading {color: #fff; background-color: #01BC8C; border-color: #01BC8C;}
.panel-success > .panel-heading + .panel-collapse .panel-body {border-top-color: #01BC8C;}
.panel-success > .panel-footer + .panel-collapse .panel-body {border-bottom-color: #01BC8C;}

/*Primary*/
.panel-primary {border-color: #E7E1E8;}
.panel-primary > .panel-heading {color: #fff; background-color: #418BCA; border-color: #418BCA;}
.panel-primary > .panel-heading + .panel-collapse .panel-body {border-top-color: #418BCA;}
.panel-primary > .panel-footer + .panel-collapse .panel-body {border-bottom-color: #418BCA;}

/*default*/
.panel-default > .panel-heading {color: #fff; background-color: #A9B6BC; border-color: #A9B6BC;}
.panel-default > .panel-heading + .panel-collapse .panel-body {border-top-color: #A9B6BC;}
.panel-default > .panel-footer + .panel-collapse .panel-body {border-bottom-color: #A9B6BC;}

/***Customized Bootstrap Buttons***/
.btn-green {color: white; background-color: #1bbc9b; border-color: "";}
.btn-yellow {color: white; background-color: #F89A14; border-color: "";}
.btn-red {color: white; background-color: #EF6F6C; border-color: "";}
.btn-green1 {color: white; background-color: #01BC8C; border-color: "";}
.btn-warning {color: white; background-color: #F89A14; border-color: "";}
.btn-custom {color: #fff; background-color: #A9B6BC; border-color: "";}
.navbar-defaults {background: #e7e7e7 !important;}
.tabbable .nav .open > a, .tabbable .nav .open > a:hover, .tabbable .nav .open > a:focus, .tabbable .nav > li > a:hover, .tabbable .nav > li > a:focus {background-color: white; border-color: #ccc; border-bottom: none;}
.tabbable .nav-tabs > li {float: left; margin-bottom: -2px;}
.tabbable a, #rootwizard a, #rootwizard1 a {color: #3c8dbc !important;}
#rootwizard .nav .open > a, #rootwizard .nav .open > a:hover, #rootwizard .nav .open > a:focus, #rootwizard .nav > li > a:hover, #rootwizard .nav > li > a:focus {background-color: #428bca; border-color: #ccc; border-bottom: none; color: #fff !important;}
#rootwizard1 .nav .open > a, #rootwizard1 .nav .open > a:hover, #rootwizard1 .nav .open > a:focus, #rootwizard1 .nav > li > a:hover, #rootwizard1 .nav > li > a:focus {background-color: #428bca; border-color: #ccc; border-bottom: none; color: #fff !important;}
#rootwizard .active a, #rootwizard1 .active a {color: #fff !important;}
.bs-example .nav-tabs > li {float: left; margin-bottom: -2px;}
.fancybox-custom .fancybox-skin {box-shadow: 0 0 50px #222;}
.gallery-padding {padding: 10px;}
.gallery-border {padding: 5px;}
.btn-primary:hover {color: #fff; background-color: #418BC1; border-color: #418BC1;}
.btn-danger:hover {color: #fff; background-color: #EF6F61; border-color: #EF6F61;}
.btn-info:hover {color: #fff; background-color: #31B0D5; border-color: #31B0D5;}
.glyphicon.arrow:before {content: "\e079";}
.active > a > .glyphicon.arrow:before {content: "\e114";}
.fa.arrow:before {content: "\f104";}
.active > a > .fa.arrow:before {content: "\f107";}
.plus-times {float: right;}
.fa.plus-times:before {content: "\f067";}
.active > a > .fa.plus-times {filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1); -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg);}
.plus-minus {float: right;}
.fa.plus-minus:before {content: "\f067";}
.active > a > .fa.plus-minus:before {content: "\f068";}

@media screen and (min-width: 992px) {
    .left-side {top: 50px;}
    .right-side.strech {margin-left: 0;}
    .right-side.strech > .content-header {margin-top: 0;}
    .left-side.collapse-left {left: -250px;}
}
/** Off Canvas*-----*  Gives us the push menu effect*/
@media screen and (max-width: 992px) {
    .right-side {margin-left: 0;}
    .relative {position: relative;}
    .row-offcanvas-right .sidebar-offcanvas {right: -250px;}
    .row-offcanvas-left .sidebar-offcanvas {left: -250px;}
    .row-offcanvas-right {right: 250px;}
    .row-offcanvas-left {left: 250px;}
    .sidebar-offcanvas {left: 0;}
    body.fixed .sidebar-offcanvas {margin-top: 50px; left: -250px;}
    body.fixed .row-offcanvas-left .navbar {left: 250px; right: 0;}
    body.fixed .row-offcanvas-left .sidebar-offcanvas {left: 0;}
}
@media (max-width: 767px) {
    .right-side > .content-header > .breadcrumb {position: relative; margin-top: 5px; top: 0; right: 0; float: none;}
    .navbar .navbar-nav > li {float: left;}
    .navbar-nav {margin: 0; float: left;}
    .navbar-nav > li > a {padding-top: 15px; padding-bottom: 15px; line-height: 20px;}
    .page-header.navbar .top-menu .navbar-nav {display: block !important;}
    .page-header.navbar .top-menu .navbar-nav > li {position: relative; display: block; float: left !important;}
    .page-header.navbar .top-menu .navbar-nav > li > a {position: relative; display: block; white-space: normal;}
    .page-header.navbar .top-menu .navbar-nav > li:has(> .hide) {width: 0; height: 35px;}
    .label-style {width: auto;}
    .navbar .navbar-right {float: right;}
    .page-sidebar.navbar-collapse.collapse.show {position: relative; display: block !important; visibility: visible; overflow: hidden !important; overflow-y: auto !important;}
    /* Fix dropdown menu for small screens to display correctly on small screens */
    .navbar-nav > .notifications-menu > .dropdown-menu, .navbar-nav > .user-menu > .dropdown-menu, .navbar-nav > .tasks-menu > .dropdown-menu, .navbar-nav > .messages-menu > .dropdown-menu {position: absolute; top: 100%; right: 0; left: auto; border-bottom: 1px solid #dddddd; border-left: 1px solid #dddddd; background: #ffffff;}
}
@media screen and (max-width: 560px) {
    body > .header {position: relative;}
    body > .header .logo, body > .header .navbar {width: 100%; float: none; position: relative;}
    body > .header .navbar {margin: 0;}
    body.fixed > .header {position: fixed;}
    body.fixed > .wrapper, body.fixed .sidebar-offcanvas {margin-top: 100px;}
}
/* Fix menu positions on xs screens to appear correctly and fully */
@media screen and (max-width: 480px) {
    .navbar-nav > .notifications-menu > .dropdown-menu > li.header:after, .navbar-nav > .tasks-menu > .dropdown-menu > li.header:after, .navbar-nav > .messages-menu > .dropdown-menu > li.header:after {border-width: 0;}
    .navbar-nav > .tasks-menu > .dropdown-menu {position: absolute; right: -120px; left: auto;}
    .navbar-nav > .notifications-menu > .dropdown-menu {position: absolute; right: -87px; left: auto;}
    .navbar-nav > .messages-menu > .dropdown-menu {position: absolute; right: -100px; left: auto;}
}

.hide_old{
    position:absolute;
    top:-10000px;
}

/*
 * Bootstrap 5 compatibility for the retained Metronic/Bootstrap 3 design.
 * Keep this after app.css so Bootstrap 5 remains the only loaded framework.
 */
html {
    font-size: 10px;
    font-family: sans-serif;
}

body {
    font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
}

hr {
    height: 0;
    margin: 20px 0;
    border: 0;
    border-top: 1px solid #eee;
    opacity: 1;
}

a {
    color: #337ab7;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-family: inherit;
    font-weight: 500;
    line-height: 1.1;
    color: inherit;
}

h1,
h2,
h3 {
    margin-top: 20px;
    margin-bottom: 10px;
}

h4,
h5,
h6 {
    margin-top: 10px;
    margin-bottom: 10px;
}

h1 { font-size: 36px; }
h2 { font-size: 30px; }
h3 { font-size: 24px; }
h4 { font-size: 18px; }
h5 { font-size: 14px; }
h6 { font-size: 12px; }

p {
    margin: 0 0 10px;
}

button,
input,
optgroup,
select,
textarea {
    margin: 0;
    font: inherit;
    color: inherit;
}

label {
    display: inline-block;
    max-width: 100%;
    margin-bottom: 5px;
    font-weight: 500;
}

.hide {
    display: none !important;
}

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

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

.container {
    width: auto;
    max-width: none;
    padding-right: 15px;
    padding-left: 15px;
}

.row {
    --bs-gutter-x: 30px;
    display: block;
}

.row::before,
.row::after {
    display: table;
    content: " ";
}

.row::after {
    clear: both;
}

.row > * {
    margin-top: 0;
    padding-right: 0;
    padding-left: 0;
}

.row > :not([class*="col-"]) {
    width: auto;
    max-width: none;
}

[class^="col-"],
[class*=" col-"] {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
}

.col-xs-15,
.col-sm-15,
.col-md-15,
.col-lg-15 {
    padding-right: 10px;
    padding-left: 10px;
}

.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 10px !important; }
.mt-2 { margin-top: 20px !important; }
.mt-3 { margin-top: 30px !important; }
.mt-4 { margin-top: 40px !important; }
.mt-5 { margin-top: 50px !important; }

.mb-0 { margin-bottom: 0 !important; }
.mb-1 { margin-bottom: 10px !important; }
.mb-2 { margin-bottom: 20px !important; }
.mb-3 { margin-bottom: 30px !important; }
.mb-4 { margin-bottom: 40px !important; }
.mb-5 { margin-bottom: 50px !important; }

.mr-1 { margin-right: 10px !important; }
.mr-2 { margin-right: 20px !important; }
.mr-3 { margin-right: 30px !important; }
.mr-4 { margin-right: 40px !important; }
.mr-5 { margin-right: 50px !important; }

.p-0 { padding: 0 !important; }
.p-1 { padding: 10px !important; }
.p-2 { padding: 20px !important; }
.p-3 { padding: 30px !important; }
.p-4 { padding: 40px !important; }
.p-5 { padding: 50px !important; }

:is(.shadow-sm, .shadow, .shadow-lg):is(.mb-1, .mb-2, .mb-3, .mb-4, .mb-5) {
    margin: 15px !important;
}

.input-group {
    display: table;
    width: auto;
    border-collapse: separate;
}

.input-group[class*="col-"] {
    float: none;
    padding-right: 0;
    padding-left: 0;
}

.input-group.col-xs-1 { width: 8.33333333%; }
.input-group.col-xs-2 { width: 16.66666667%; }
.input-group.col-xs-3 { width: 25%; }
.input-group.col-xs-4 { width: 33.33333333%; }
.input-group.col-xs-5 { width: 41.66666667%; }
.input-group.col-xs-6 { width: 50%; }
.input-group.col-xs-7 { width: 58.33333333%; }
.input-group.col-xs-8 { width: 66.66666667%; }
.input-group.col-xs-9 { width: 75%; }
.input-group.col-xs-10 { width: 83.33333333%; }
.input-group.col-xs-11 { width: 91.66666667%; }
.input-group.col-xs-12 { width: 100%; }

.input-group .form-control {
    position: relative;
    z-index: 2;
    display: table-cell;
    float: left;
    width: 100%;
    margin-bottom: 0;
}

.input-group-addon,
.input-group-btn {
    display: table-cell;
    width: 1%;
    white-space: nowrap;
    vertical-align: middle;
}

.input-group-btn.d-flex {
    display: table-cell !important;
}

.input-group-addon {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    color: #555;
    text-align: center;
    background-color: #eee;
    border: 1px solid #ccc;
    border-radius: 4px;
}

.input-group-addon.input-group-text {
    display: table-cell;
}

.input-group .form-control + .input-group-addon {
    border-left: 0;
}

.input-group > :not(:first-child):not(.dropdown-menu):not(.valid-tooltip):not(.valid-feedback):not(.invalid-tooltip):not(.invalid-feedback) {
    margin-left: 0;
}

.form-group.mb-3 {
    margin-bottom: 15px !important;
}

.form-group[class$="mb-3 row"] {
    margin-right: 0;
    margin-left: 0;
    padding-right: 0;
    padding-left: 0;
}

.form-group[class$="mb-3 row"]::before,
.form-group[class$="mb-3 row"]::after {
    display: none;
    content: none;
}

.form-horizontal .form-group[class$="mb-3 row"] {
    margin-right: -15px;
    margin-left: -15px;
}

.form-horizontal .form-group[class$="mb-3 row"]::before,
.form-horizontal .form-group[class$="mb-3 row"]::after {
    display: table;
    content: " ";
}

.form-horizontal .form-group[class$="mb-3 row"]::after {
    clear: both;
}

.form-horizontal .form-group > .form-control {
    width: 100%;
}

.form-control {
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857143;
    color: #555;
    background-color: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}

select.form-control {
    appearance: auto;
    line-height: normal;
}

#margin .form-control,
.col-md-15 .form-control {
    font-weight: 300;
}

#employeeform .form-control {
    font-weight: 300;
}

#unit_list_form_sort .form-control {
    font-weight: 500;
}

.btn.btn-primary.form-control {
    color: #fff;
    background-color: #418bca;
    border-color: #418bca;
}

.form-control:disabled,
.form-control[readonly] {
    background-color: #eee;
    opacity: 1;
}

.btn {
    padding: 6px 12px;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.42857143;
    white-space: nowrap;
    border-radius: 4px;
}

.btn-sm {
    padding: 2px 5px;
    font-size: 13px;
    line-height: 1.42857143;
    border-radius: 3px;
}

.gs .title .btn-sm {
    font-weight: 300;
}

.btn.btn-default.btn-light {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.btn.btn-default.btn-light.border {
    border-color: #ccc !important;
}

.page-header.navbar .btn.dropdown-toggle,
.page-sidebar .btn.submit {
    color: #fff;
}

.page-sidebar .btn.submit {
    display: inline-block;
    margin-left: -1px;
}

.btn.submit {
    display: inline-block;
}

.btn.rgba-white-slight {
    color: #fff;
    background-color: #f0f0f0;
}

.btn-block {
    display: block;
    width: 100%;
}

.users-table label:has(button.btn-block) {
    margin-bottom: 5px;
    font-weight: 500;
}

.users-table .btn {
    font-weight: 300;
}

.table {
    margin-bottom: 20px;
    border-spacing: 0;
}

div.dataTables_wrapper div.dataTables_info {
    padding-top: 8px !important;
}

div.dataTables_wrapper div.dataTables_processing > div {
    display: none;
}

div.dataTables_wrapper div.dataTables_processing {
    padding: 13px 0;
    z-index: auto;
}

div.dataTables_wrapper div.dataTables_filter input.form-control-sm {
    margin-left: 6px;
    padding: 5px 10px;
    font-size: 12px;
    line-height: 1.5;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination > li {
    display: inline;
}

div.dataTables_wrapper div.dataTables_paginate > ul.pagination {
    display: inline-block;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination > li > .page-link {
    float: left;
    padding: 6px 12px !important;
    font-size: 14px;
    line-height: 1.42857143;
    color: #337ab7;
    background-color: #fff;
    border: 1px solid #ddd;
    border-radius: 0;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination > li:first-child > .page-link {
    border-radius: 4px 0 0 4px;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination > li:last-child > .page-link {
    border-radius: 0 4px 4px 0;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination > .active > .page-link {
    color: #fff;
    background-color: #337ab7;
    border-color: #337ab7;
}

div.dataTables_wrapper div.dataTables_paginate ul.pagination > .disabled > .page-link {
    color: #777;
    background-color: #fff;
    border-color: #ddd;
}

.table-condensed.table-sm > thead > tr > th,
.table-condensed.table-sm > thead > tr > td,
.table-condensed.table-sm > tbody > tr > th,
.table-condensed.table-sm > tbody > tr > td,
.table-condensed.table-sm > tfoot > tr > th,
.table-condensed.table-sm > tfoot > tr > td {
    padding: 5px;
}

.table-condensed.table-sm > thead > tr > th {
    vertical-align: bottom;
}

.table-condensed.table-sm > tbody > tr > td {
    vertical-align: top;
}

.table-condensed.table-sm > tbody > tr > td:first-child {
    padding-left: 15px;
}

.table-condensed.table-sm > tbody > tr > td:last-child {
    padding-right: 15px;
}

.label.badge {
    display: inline;
    padding: .2em .6em .3em;
    font-size: 75%;
    font-weight: 700;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: baseline;
    border-radius: .25em;
}

.label-danger.text-bg-secondary {
    color: #fff !important;
    background-color: #ef6f6c !important;
}

.list-group {
    display: block;
    padding-left: 0;
    margin-bottom: 20px;
}

#display-style.tags_wrapper {
    margin-bottom: 22px !important;
}

.tags_wrapper > [class*="col-"] {
    flex: 0 1 auto;
}

.nav-tabs {
    display: block;
}

.nav-tabs::before,
.nav-tabs::after {
    display: table;
    content: " ";
}

.nav-tabs::after {
    clear: both;
}

.nav-tabs > li {
    display: block;
    float: left;
}

.nav-tabs > li > a {
    display: block;
    margin-right: 2px;
}

.table > :not(caption) > * > * {
    padding: 8px;
    vertical-align: top;
    border-top: 1px solid #ddd;
    border-right: 0;
    border-bottom: 0;
    border-left: 0;
    background-color: transparent;
    box-shadow: none;
}

.table-bordered {
    border: 1px solid #ddd;
}

.table-bordered > :not(caption) > * > * {
    border: 1px solid #ddd;
}

.table > thead,
.table > tbody,
.table > tfoot {
    border: 0;
}

.table > thead > tr,
.table > tbody > tr,
.table > tfoot > tr {
    border: 0;
}

.table > :not(caption) > * > [class^="col-"],
.table > :not(caption) > * > [class*=" col-"] {
    display: table-cell;
    float: none;
    position: static;
}

.table > thead > tr > th {
    vertical-align: bottom;
    border-top: 0;
    border-bottom: 2px solid #ddd;
}

table.dataTable thead > tr > .sorting::before,
table.dataTable thead > tr > .sorting_asc::before,
table.dataTable thead > tr > .sorting_desc::before,
table.dataTable thead > tr > .sorting::after,
table.dataTable thead > tr > .sorting_asc::after,
table.dataTable thead > tr > .sorting_desc::after {
    display: none !important;
}

.panel {
    margin-bottom: 20px;
    background-color: #fff;
    border: 1px solid transparent;
    border-radius: 4px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
}

.panel.card {
    display: block;
    color: inherit;
}

.panel.card.admin-product-submenu {
    display: none;
}

.panel-heading.card-header {
    padding: 10px 15px;
}

.gs .panel-heading.card-header {
    padding: 0 15px 10px;
}

.panel-title {
    margin-top: 0;
    margin-bottom: 0;
    font-size: 16px;
    color: inherit;
}

.panel-body,
.panel-body.card-body {
    flex: none;
    padding: 15px;
}

.panel-body::before,
.panel-body::after {
    display: table;
    content: " ";
}

.panel-body::after {
    clear: both;
}

.panel-default {
    border-color: #ddd;
}

.modal-dialog {
    position: relative;
    width: auto;
    margin: 10px;
}

body.modal-open[style*="padding-right: 15px"] .modal.show {
    padding-right: 15px;
}

.modal-content {
    display: block;
    position: relative;
    color: #333;
    background-color: #fff;
    background-clip: padding-box;
    border: 1px solid rgba(0, 0, 0, .2);
    border-radius: 6px;
    box-shadow: 0 3px 9px rgba(0, 0, 0, .5);
}

.modal-header {
    display: block;
    padding: 15px;
    border-bottom: 1px solid #e5e5e5;
    border-radius: 0;
}

.modal-footer::before,
.modal-footer::after {
    display: table;
    content: " ";
}

.modal-header::after,
.modal-footer::after {
    clear: both;
}

.modal-title {
    margin: 0;
    line-height: 1.42857143;
}

.modal-body {
    position: relative;
    flex: none;
    padding: 15px;
}

.modal-footer {
    display: block;
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
    border-radius: 0;
}

.modal-footer > * {
    margin: 0;
}

.modal-footer > .btn:not([class*="btn-"]) {
    color: #fff;
    background-color: #f0f0f0;
}

.modal-footer .btn + .btn {
    margin-bottom: 0;
    margin-left: 5px;
}

.modal-footer .btn-outline:not(.btn-success):not(.btn-gray):not(.btn-grey) {
    color: #fff;
    background-color: #f0f0f0;
    border-color: transparent;
}

.modal .close.btn-close {
    position: static;
    float: right;
    width: auto;
    height: auto;
    padding: 0 !important;
    margin: -2px 0 0;
    font-size: 21px;
    font-weight: 700;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    background: transparent none !important;
    border: 0;
    border-radius: 0;
    opacity: .2;
}

.page-header.navbar {
    display: block;
}

.dropdown-menu {
    margin: 2px 0 0;
    font-size: 14px;
    line-height: 1.42857143;
    color: #333;
}

.daterangepicker.dropdown-menu {
    border-color: rgba(0, 0, 0, .15);
}

.daterangepicker .btn {
    font-weight: 300;
}

.daterangepicker .btn-success {
    background-color: #5cb85c;
    border-color: #4cae4c;
}

.daterangepicker .btn-default {
    color: #333;
    background-color: #fff;
    border-color: #ccc;
}

.btn-secondary {
    border-color: transparent;
}

.page-header.navbar .page-header-inner {
    width: 100%;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user {
    position: relative;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu {
    position: absolute !important;
    inset: 100% 0 auto auto !important;
    min-width: 160px;
    margin-top: 0;
    font-size: 14px;
    line-height: 20px;
    text-align: left;
    list-style: none;
    border: 1px solid rgba(0, 0, 0, .15);
    transform: none !important;
}

.page-header.navbar .top-menu .navbar-nav > li.dropdown-user > .dropdown-menu > li > a {
    display: block;
    padding: 3px 20px;
    clear: both;
    font-size: 14px;
    font-weight: 400;
    line-height: 20px;
    color: #333;
    white-space: nowrap;
}

.panel-login {
    margin-top: 10vh;
}

.panel-login .form-label {
    display: inline-block;
    margin: 0 0 5px;
    padding: 15px 10px 10px 5px;
    color: inherit;
    font-weight: 700;
}

.panel-login > .clearfix > .col-12 {
    float: left;
}

.panel-login .mb-3 {
    margin-bottom: 15px !important;
}

.panel-login .form-check {
    position: relative;
    width: 155px;
    height: 52px;
    margin: 0;
    padding: 7px 0 0;
}

.panel-login .form-check-input {
    position: absolute;
    top: 26px;
    left: -15px;
    float: none;
    margin: 0;
}

.panel-login .login-btn {
    margin-bottom: 0;
}

[class^="col-xs-"],
[class*=" col-xs-"] {
    float: left;
}

@media (min-width: 768px) {
    .container {
        width: 750px;
    }

    .modal-dialog {
        width: 600px;
        max-width: 600px;
        margin: 30px auto;
    }

    .modal-content {
        box-shadow: 0 5px 15px rgba(0, 0, 0, .5);
    }

    /* Restore Bootstrap 3 hidden-xs semantics after the mechanical BS5 class migration. */
    .hidden-xs.d-none:not(.hidden-sm) {
        display: revert !important;
    }

    .page-header.navbar .top-menu .navbar-nav {
        display: block;
        flex-direction: row;
        flex-wrap: nowrap;
    }

    .page-header.navbar .top-menu .navbar-nav > li {
        display: block;
        float: left;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown {
        display: inline-block;
    }

    .page-header.navbar .top-menu .navbar-nav > li.dropdown > .dropdown-toggle {
        display: block;
    }

    .page-header.navbar .top-menu .dropdown-user > .dropdown-toggle::after {
        display: none;
    }

    .input-group.col-sm-1 { width: 8.33333333%; }
    .input-group.col-sm-2 { width: 16.66666667%; }
    .input-group.col-sm-3 { width: 25%; }
    .input-group.col-sm-4 { width: 33.33333333%; }
    .input-group.col-sm-5 { width: 41.66666667%; }
    .input-group.col-sm-6 { width: 50%; }
    .input-group.col-sm-7 { width: 58.33333333%; }
    .input-group.col-sm-8 { width: 66.66666667%; }
    .input-group.col-sm-9 { width: 75%; }
    .input-group.col-sm-10 { width: 83.33333333%; }
    .input-group.col-sm-11 { width: 91.66666667%; }
    .input-group.col-sm-12 { width: 100%; }

    [class^="col-sm-"],
    [class*=" col-sm-"] {
        float: left;
    }
}

@media (min-width: 992px) {
    .container {
        width: 970px;
    }

    .hidden-xs.hidden-sm.d-none {
        display: revert !important;
    }

    span.hidden-xs.hidden-sm.d-none {
        white-space: nowrap;
    }

    /* Restore Bootstrap 3 hidden-sm semantics without forcing table cells to block. */
    .hidden-sm.d-sm-none {
        display: revert !important;
    }

    .page-sidebar.navbar-collapse.collapse {
        display: block !important;
    }

    [class^="col-md-"],
    [class*=" col-md-"] {
        float: left;
    }

    .col-md-push-1 {
        left: 8.33333333%;
    }
}

@media (min-width: 1200px) {
    .container {
        width: 1170px;
    }

    [class^="col-lg-"],
    [class*=" col-lg-"] {
        float: left;
    }
}