/* ==========================================
   BASE & RESET
   ========================================== */
body {
    background: #f3f3f4;
    font-family: 'Open Sans', "Helvetica Neue", Helvetica, Arial, sans-serif;
}

a {
    color: #08c;
    transition: .25s;
}

a:active, a:focus, a:hover {
    color: #2e4c69;
    outline: 0;
    text-decoration: none;
}

/* ==========================================
   AVATAR CORREGIDO
   ========================================== */
img.circle-avatar {
    max-width: 100%;
    width: 100%;
    aspect-ratio: 1 / 1; /* Mantiene el cuadrado perfecto */
    display: block;
    border-radius: 50%;
    object-fit: cover; /* Evita que la imagen se deforme */
    margin: 0 auto;
}

/* ==========================================
   HEADER & NAVBAR
   ========================================== */
header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1030;
}

.center { text-align: center !important; }
.clear { clear: both; }

header .navbar {
    background-color: #FFF;
    border-bottom: 1px solid #e6e6e6;
    box-shadow: 0 0 6px 0 rgba(0,0,0,.1);
    height: 50px;
    margin-bottom: 0;
    margin-left: 210px;
    transition: .25s;
}

header .navbar .nav a { color: #5e5e5e; }

header .navbar .sidebar-toggle {
    float: left;
    padding: 9px 5px;
    margin: 8px 0 8px 5px;
    background-color: transparent;
    background-image: none;
}

header .navbar .sidebar-toggle:hover .icon-bar { background: #999; }

header .navbar .sidebar-toggle .icon-bar {
    display: block;
    width: 22px;
    height: 2px;
    background: #333;
}

header .navbar .sidebar-toggle .icon-bar+.icon-bar { margin-top: 4px; }

header .navbar .navbar-header {
    width: 50%;
    float: left;
}

header .navbar .navbar-header .navbar-form .form-control {
    border: 0 !important;
    font-size: 13px;
    background: #f3f3f4;
}

header .navbar .navbar-header .navbar-form button {
    background: #f3f3f4;
    border-radius: 0 5px 5px 0;
}

header .navbar .nav>li.user>a { font-weight: 700; }
header .navbar .nav>li.user>a>i { margin-right: 5px; }

header .navbar .nav>li>a>.label {
    position: absolute;
    top: 7px;
    right: 5px;
    font-size: 10px;
    height: 16px;
    line-height: 1em;
    text-align: center;
    padding: 2px;
}

header .logo {
    background-color: #172b3e;
    color: #f9f9f9;
    float: left;
    font-size: 20px;
    padding: 0;
    width: 210px;
    font-weight: 600;
    height: 50px;
    display: block;
}

header .logo i {
    margin-right: 8px;
    background-color: #273849;
    box-shadow: inset 4px 0 0 0 #191919;
    padding: 15px;
}

/* ==========================================
   LAYOUT (SIDEBAR & CONTENT)
   ========================================== */
.leftside, .rightside {
    min-height: 100%;
    display: table-cell;
    transition: .25s;
}

.leftside {
    width: 210px;
    top: 0;
    padding-top: 50px;
    background: #253646;
    box-shadow: inset 4px 0 0 0 #191919;
    vertical-align: top;
}

.rightside {
    padding-top: 50px;
    background-color: #ebebeb;
    margin-left: 210px;
}

.fixed .leftside, .fixed .navbar, .fixed>header { position: fixed; }
.fixed>header { top: 0; right: 0; left: 0; }
.fixed .navbar { left: 0; right: 0; }
.fixed .leftside, .fixed .rightside { display: block; }
.fixed .wrapper { display: inherit; }
.wrapper { width: 100%; display: table; }
.content { padding: 0 15px 15px; }

/* Sidebar Small State */
.sidebar-sm .leftside, .sidebar-sm header .logo { width: 42px; z-index: 999; }
.sidebar-sm .leftside .sidebar .label, .sidebar-sm .leftside .sidebar .pull-right.fa, .sidebar-sm .leftside .sidebar span, .sidebar-sm .leftside .user-box, .sidebar-sm .sidebar .alert, .sidebar-sm .sidebar .sidebar-widget, .sidebar-sm .title, .sidebar-sm header .logo span { display: none; }
.sidebar-sm .rightside, .sidebar-sm header .navbar { margin-left: 42px; }
.sidebar-sm .leftside .slimScrollDiv { overflow: inherit !important; }
.sidebar-sm .sidebar .sidebar-menu .sub-menu { position: absolute !important; z-index: 9999 !important; margin-left: 40px !important; margin-top: -45px !important; box-shadow: none; }
.sidebar-sm .sidebar .sidebar-menu .sub-menu>li>a { padding: 10px 25px 10px 10px; }

/* ==========================================
   UTILITIES
   ========================================== */
.text-success { color: #14a610; }
.badge { border-radius: 2px; }
.help-block { font-size: 11px; }
.bold { font-weight: 700 !important; }

.page-header { margin: 10px 0 20px; }
.page-header>small { color: #666; display: block; margin-top: 5px; }
.sort-highlight { background: #f4f4f4; border: 1px dashed #ddd; margin-bottom: 10px; }
.box .label { font-weight: 400; }

.hr { border-bottom: 1px solid #e1e1e1; box-shadow: 0 1px 0 0 #FFF; margin: 0 15px 20px; display: block; }
.full-width, .iframe iframe { width: 100% !important; }
.display-inline { display: inline !important; }
.alert i { margin-right: 5px; }
.display-none { display: none !important; }
.display-show { display: inherit !important; }

.padding { padding: 10px; }
.margin { margin: 10px; }
.no-border { border: 0 !important; }
.no-padding { padding: 0 !important; }
.no-padding-top { padding-top: 0 !important; }
.no-margin { margin: 0 !important; }
.no-margin-top { margin-top: 0 !important; }
.no-shadow { box-shadow: none !important; }
.no-radius { border-radius: 0 !important; }
.text-center { text-align: center !important; }
.text-light { color: #727272 !important; }

.margin-left-xs { margin-left: 5px !important; }
.margin-left-sm { margin-left: 10px !important; }
.margin-left-md { margin-left: 20px !important; }
.margin-left-lg { margin-left: 30px !important; }
.margin-right-xs { margin-right: 5px !important; }
.margin-right-sm { margin-right: 10px !important; }
.margin-right-md { margin-right: 20px !important; }
.margin-right-lg { margin-right: 30px !important; }
.margin-top-xs { margin-top: 5px !important; }
.margin-top-sm { margin-top: 10px !important; }
.margin-top-md { margin-top: 20px !important; }
.margin-top-lg { margin-top: 30px !important; }
.margin-bottom-xs { margin-bottom: 5px !important; }
.margin-bottom-sm { margin-bottom: 10px !important; }
.margin-bottom-md { margin-bottom: 20px !important; }
.margin-bottom-lg { margin-bottom: 30px !important; }

.padding-xs { padding: 5px !important; }
.padding-sm { padding: 10px !important; }
.padding-md { padding: 20px !important; }
.padding-lg { padding: 30px !important; }

/* ==========================================
   PROGRESS BARS & PALETTES
   ========================================== */
.progress-xs { height: 5px !important; }
.progress-sm { height: 10px !important; }
.progress { background: #ebedef; border-radius: 32px; height: 12px; box-shadow: none; }
.progress-bar { background: #1abc9c; line-height: 12px; box-shadow: none; }
.progress-bar-success { background-color: #2ecc71; }
.progress-bar-warning { background-color: #f1c40f; }
.progress-bar-danger { background-color: #e74c3c; }
.progress-bar-info { background-color: #3498db; }

.inline { width: auto; display: inline; }

.pallete-item { width: 140px; float: left; margin: 0 0 20px 20px; }
.palette { font-size: 14px; line-height: 1.214; color: #fff; margin: 0; padding: 15px; text-transform: uppercase; }
.palette dd, .palette dt { line-height: 1.429; }
.palette dt { display: block; font-weight: 700; opacity: .8; }
.palette dd { font-weight: 300; margin-left: 0; opacity: .8; -webkit-font-smoothing: subpixel-antialiased; }

.palette-white { background-color: #FFF !important; }
.palette-turquoise { background-color: #1abc9c !important; }
.palette-green-sea { background-color: #16a085 !important; }
.palette-emerald { background-color: #2ecc71 !important; }
.palette-nephritis { background-color: #27ae60 !important; }
.palette-peter-river { background-color: #3498db !important; }
.palette-belize-hole { background-color: #2980b9 !important; }
.palette-amethyst { background-color: #9b59b6 !important; }
.palette-wisteria { background-color: #8e44ad !important; }
.palette-wet-asphalt { background-color: #34495e !important; }
.palette-midnight-blue { background-color: #2c3e50 !important; }
.palette-sun-flower { background-color: #f1c40f !important; }
.palette-orange { background-color: #f39c12 !important; }
.palette-carrot { background-color: #e67e22 !important; }
.palette-pumpkin { background-color: #d35400 !important; }
.palette-alizarin { background-color: #e74c3c !important; }
.palette-pomegranate { background-color: #c0392b !important; }
.palette-clouds { background-color: #ecf0f1 !important; }
.palette-silver { background-color: #bdc3c7 !important; }
.palette-concrete { background-color: #95a5a6 !important; }
.palette-asbestos { background-color: #7f8c8d !important; }

/* ==========================================
   PAGE HEAD
   ========================================== */
.rightside>.page-head {
    background: 0 0;
    box-shadow: none;
    position: relative;
    padding: 10px 0 15px 10px;
    margin: 0 3px 20px;
    border-bottom: 1px solid #DDD;
}

.rightside>.page-head>h1 { margin: 0; font-size: 24px; }
.rightside>.page-head>h1>small { font-size: 15px; display: inline-block; padding-left: 4px; font-weight: 300; }

.rightside>.page-head>.breadcrumb {
    position: absolute;
    top: 20px;
    right: 0;
    float: right;
    background: #FFF;
    font-size: 12px;
    border: 1px solid #ededed;
    padding: 7px 10px;
    border-radius: 5px;
}

.rightside>.page-head>.breadcrumb>li>a { color: #444; }
.rightside>.page-head>.breadcrumb>li+li:before { content: '\f0da'; font-family: FontAwesome; }

/* ==========================================
   SIDEBAR COMPONENTS
   ========================================== */
.info-box {
    background-color: #293C4E;
    margin-top: 20px;
    box-shadow: inset 4px 0 0 0 #191919;
    padding: 15px;
    color: #BDCFE0;
    font-weight: 600;
    font-size: 13px;
}

.sidebar a { color: #bdcfe0; font-weight: 600; font-size: 13px; }
.sidebar a:hover { text-decoration: none; }
.sidebar .alert { padding: 10px 15px; font-size: 11px; margin: 5px 0 0 5px; color: rgba(0,0,0,.6); }
.sidebar .alert button { margin-right: 15px; }
.sidebar .sidebar-menu { list-style: none; margin: 0; padding: 0; }
.sidebar .sidebar-widget { padding: 0 0 0 4px !important; margin: 0 !important; }
.sidebar .sidebar-widget .body { margin: -10px 0 0; }
.sidebar .sidebar-widget .title { color: #bdcfe0; font-size: 13px; font-weight: 700; padding: 10px 10px 15px; margin-bottom: 5px; }

/* Online Users / Chat Widget */
.sidebar .sidebar-widget.online-users a.item { display: inline-block; padding: 4px 10px; width: 100%; }
.sidebar .sidebar-widget.online-users a.item:hover { background: rgba(0,0,0,.2); }
.sidebar .sidebar-widget.online-users img { width: 34px; height: 34px; }
.sidebar .sidebar-widget.online-users .img { display: block; position: relative; margin: 4px 0; }
.sidebar .sidebar-widget.online-users .img::before { display: block; content: ''; position: absolute; width: 100%; height: 100%; }
.sidebar .sidebar-widget.online-users .img.online::before { box-shadow: inset 3px 0 0 0 #19b011; }
.sidebar .sidebar-widget.online-users .img.away::before { box-shadow: inset 3px 0 0 0 #f0ad4e; }
.sidebar .sidebar-widget.online-users .img.inactive::before { box-shadow: inset 3px 0 0 0 #e74c3c; }
.sidebar .sidebar-widget.online-users .info { padding: 3px 10px; line-height: 1; }
.sidebar .sidebar-widget.online-users .name { color: #FFF; font-size: 12px; margin: 5px 0; }
.sidebar .sidebar-widget.online-users .status { font-size: 10px; margin-bottom: 2px; }
.sidebar .sidebar-widget.online-users .activity { font-size: 10px; margin: 13px 0 0; }
.sidebar .sidebar-widget.online-users .activity i { margin-right: 2px; }
.sidebar .sidebar-widget.online-users .chat { display: none; }
.sidebar .sidebar-widget.online-users .chat .activity { color: #FFF; margin-right: 15px; position: absolute; top: -2px; right: 10px; background: #1e2b38; padding: 5px; display: none; }
.sidebar .sidebar-widget.online-users .chat .owner .activity { left: 15px; }
.sidebar .sidebar-widget.online-users .chat .message { width: 135px; font-weight: 400; font-size: 11px; padding: 8px 12px; }
.sidebar .sidebar-widget.online-users .chat .item { position: relative; padding: 7px 10px; }
.sidebar .sidebar-widget.online-users .chat .owner { color: #FFF; padding: 10px; }
.sidebar .sidebar-widget.online-users .chat .owner .message { width: 170px !important; }
.sidebar .sidebar-widget.online-users .chat .item:hover { background: 0 0 !important; }
.sidebar .sidebar-widget.online-users .chat .owner .message { background: #16a085 !important; }
.sidebar .sidebar-widget.online-users .chat .owner .message:after { left: 100% !important; border-left-color: #16a085 !important; border-right: 0 !important; }
.sidebar .sidebar-widget.online-users .chat .item .message { background: #1e2b38; position: relative; min-height: 20px; }
.sidebar .sidebar-widget.online-users .chat .item .message:after { right: 100%; top: 16px; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; border-color: rgba(30,43,56,0); border-right-color: #1e2b38; border-width: 10px; margin-top: -10px; }
.sidebar .sidebar-widget.online-users .chat .item:hover .activity { display: inherit; }
.sidebar .sidebar-widget.online-users .footer { width: 205px; height: 60px; padding: 15px 10px; background: #21303f; position: fixed; z-index: 999; bottom: 0; }
.sidebar .btn-primary { background-color: rgba(0,0,0,.3) !important; }
.sidebar .btn-primary:hover { background-color: rgba(0,0,0,.4) !important; }
.sidebar .sidebar-widget.online-users .footer input[type=text] { padding: 7px; font-size: 11px; height: auto; border: 0; background: rgba(0,0,0,.3); color: #bdcfe0; }

/* Sidebar Menu */
.sidebar .sidebar-menu>li.title { padding: 15px; color: #bdcfe0; font-weight: 700; background: #273849; font-size: 13px; }
.sidebar .sidebar-menu>li { margin: 0; padding: 0; background-color: #293c4e; box-shadow: inset 4px 0 0 0 #191919; }
.sidebar>.sidebar-menu>li>a:hover { color: #f6f6f6; background: rgba(0,0,0,.1); }
.sidebar>.sidebar-menu>li.active>a { color: #f6f6f6; background: rgba(0,200,255,.5); box-shadow: inset 4px 0 0 0 #f0ad4e; }
.sidebar>.sidebar-menu>li>.sub-menu { margin: 0; padding: 0; background: #253646; }
.sidebar .sidebar-menu>li>a { padding: 13px 15px; display: block; }
.sidebar .sidebar-menu>li>a>i { width: 20px; }
.sidebar .sidebar-menu .sub-menu { display: none; list-style: none; padding: 0; margin: 0; box-shadow: inset 4px 0 0 0 #f0ad4e; }
.sidebar .sidebar-menu .sub-menu>li { margin: 0; }
.sidebar .sidebar-menu .sub-menu>li>a { padding: 5px 7px 7px 35px; display: block; margin: 0; font-weight: 400; }
.sidebar .sidebar-menu .sub-menu>li.active>a, .sidebar .sidebar-menu .sub-menu>li>a:hover { color: #fff; background-color: rgba(0,0,0,.1); }
.sidebar .sidebar-menu .sub-menu>li>a>i { width: 20px; }
.sidebar .label { padding: 5px 7px; text-transform: uppercase; }

/* User Box */
.user-box { padding: 15px 12px 5px; background: #273849; box-shadow: inset 4px 0 0 0 #191919; }
.user-box:after, .user-box:before { display: table; content: " "; }
.user-box:after { clear: both; }
.user-box .avatar { float: left; box-shadow: inset 3px 0 0 0 #19b011; position: relative; width: 48px; height: 48px; display: block; }
.user-box .avatar::before { display: block; content: ''; position: absolute; width: 100%; height: 100%; box-shadow: inset 3px 0 0 0 #19b011; }
.user-box img { width: 48px; height: 48px; box-shadow: 0 0 3px 0 rgba(0,0,0,.3); }
.user-box .details { float: left; font-weight: 600; font-size: 14px; line-height: 1; padding: 0 12px; color: #eee; }
.user-box .details>p { margin-bottom: 14px; font-size: 15px; }
.user-box .details>a>i { margin-right: 3px; }
.user-box .position { font-size: 11px; background: rgba(0,0,0,.4); padding: 5px 8px 5px 12px; margin-left: -12px; }
.user-box .button { float: right; }
.user-box .button a { display: block; color: #FFF; padding: 0 10px; background: rgba(0,0,0,.3); border-radius: 50%; margin-right: 5px; margin-top: 10px; height: 30px; line-height: 30px; }
.user-box .button a:hover { background: rgba(0,0,0,.2); }

/* ==========================================
   DROPDOWNS
   ========================================== */
.dropdown-menu { box-shadow: 0 3px 6px rgba(0,0,0,.1); z-index: 2300; padding: 0; }
.dropdown-menu>li>a:hover { background-color: #3c8dbc; color: #f9f9f9; }

.navbar-nav .dropdown-menu { width: 270px; padding: 0 !important; margin: 0 !important; top: 100%; border: 1px solid #cfcfcf; border-radius: 4px !important; }
.navbar-nav .dropdown-menu>li.header { border-radius: 4px 4px 0 0; background-color: #f5f5f5; padding: 10px; color: #444; font-size: 14px; box-shadow: inset 0 1px 0 0 #FFF; text-shadow: 1px 1px 0 #FFF; }
.navbar-nav .dropdown-menu>li.header i { color: #696969; margin-right: 5px; }
.navbar-nav .dropdown-menu>li.footer>a { border-radius: 0 0 4px 4px; font-size: 12px; background-color: #f5f5f5; padding: 8px; color: #444; text-align: center; }
.navbar-nav .dropdown-menu>li.footer>a:hover { background: #f0f0f0; text-decoration: none; }

.navbar-nav>.dropdown-messages>.dropdown-menu>li ul, .navbar-nav>.dropdown-notifications>.dropdown-menu>li ul, .navbar-nav>.dropdown-tasks>.dropdown-menu>li ul { margin: 0; padding: 0; list-style: none; overflow-x: hidden; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a, .navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a, .navbar-nav>.dropdown-tasks>.dropdown-menu>li ul>li>a { display: block; white-space: nowrap; border-bottom: 1px solid #f0f0f0; }
.navbar-nav>.dropdown-tasks>.dropdown-menu .progress { height: 10px; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a:hover, .navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a:hover, .navbar-nav>.dropdown-tasks>.dropdown-menu>li ul>li>a:hover { background: #f6f6f6; text-decoration: none; }
.navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a { padding: 7px 0; font-size: 12px; color: #444; }
.navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a>span { font-size: 11px; }
.navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a>i { width: 25px; text-align: center; padding: 6px 0; margin: 5px; background: #00c0ef; border-radius: 4px; color: #FFF; }
.navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a>i.danger { background: #e74c3c; }
.navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a>i.warning { background: #f39c12; }
.navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a>i.success { background: #27ae60; }
.navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a>i.info { background: #3498db; }

.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a { margin: 0; line-height: 20px; padding: 10px 5px; border-radius: 4px; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a>div>img { margin: auto 10px auto auto; width: 40px; height: 40px; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a>h4 { padding: 0; margin: 0 0 0 45px; color: #444; font-size: 15px; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a>h4>small { color: #999; font-size: 10px; float: right; margin-top: -15px; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a>p { margin: 0 0 0 45px; font-size: 12px; color: #888; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a:after, .navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a:before { display: table; content: " "; }
.navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a:after { clear: both; }

.navbar-nav>.dropdown-tasks>.dropdown-menu>li ul>li>a { padding: 10px; }
.navbar-nav>.dropdown-tasks>.dropdown-menu>li ul>li>a>h3 { font-size: 14px; padding: 0; margin: 0 0 10px; color: #666; }
.navbar-nav>.dropdown-tasks>.dropdown-menu>li ul>li>a>h3>small { margin-top: -10px; }
.navbar-nav>.dropdown-tasks>.dropdown-menu>li ul>li>a>.progress { padding: 0; margin: 0; }

.navbar-nav>.widget-user { background-color: #F0F0F0; margin-left: 10px; }
.navbar-nav>.widget-user a { color: #5E5E5E; font-weight: 700; }
.navbar-nav>.widget-user>.dropdown-menu { max-width: 220px; padding: 0; margin: 0; border: 1px solid #cfcfcf; }
.navbar-nav>.widget-user>.dropdown-menu>li { padding: 0; margin: 0; }
.navbar-nav>.widget-user>.dropdown-menu>li.footer>a { text-align: left; }
.box .dropdown-menu>li>a, .navbar-nav>.widget-user>.dropdown-menu>li>a { padding: 10px !important; font-size: 12px; border-bottom: 1px solid #f0f0f0; }
.box .dropdown-menu>li>a:hover, .navbar-nav>.widget-user>.dropdown-menu>li>a:hover { background-color: #F0F0F0; color: #5E5E5E; }
.navbar-nav>.widget-user img { width: 30px; height: 30px; margin: -5px 10px 0 0; box-shadow: 0 0 0 2px #FFF; }

/* ==========================================
   ERROR PAGES & INVOICES
   ========================================== */
.error-template i { font-size: 80px; }
.error-template h1 { font-size: 60px; }
.error-template h2 { margin-bottom: 30px; }
.error-template { padding: 40px 15px 5px; text-align: center; width: 500px !important; margin: 0 auto; }
.error-actions { margin-top: 20px; margin-bottom: 15px; }
.error-actions .btn { margin-right: 20px; }
.error-actions span { margin-right: 10px; }

.invoice-title h2, .invoice-title h3 { display: inline-block; margin: 0 !important; }

/* ==========================================
   TABLES
   ========================================== */
.table>thead>tr>th { border-bottom: 0; font-weight: 600; }
.table-striped>tbody>tr:nth-child(2n+1)>td, .table-striped>tbody>tr:nth-child(2n+1)>th { box-shadow: inset 0 1px 0 0 #FFF; }
.table>tbody>tr>td, .table>tbody>tr>th, .table>tfoot>tr>td, .table>tfoot>tr>th, .table>thead>tr>td, .table>thead>tr>th { vertical-align: middle; }
.dataTable select, div.dataTables_filter input { background: #fefefe; border: 1px solid #d8dde5 !important; border-radius: 3px; padding: 5px 10px; }
table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_asc:after, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_desc_disabled { background: 0 0 !important; }
table.dataTable thead .sorting:after { content: "\f106"; float: right; font-family: fontawesome; color: rgba(50,50,50,.5); }
table.dataTable thead .sorting_asc:after { content: "\f106"; float: right; font-family: fontawesome; }
table.dataTable thead .sorting_desc:after { content: "\f107"; float: right; font-family: fontawesome; }

/* ==========================================
   FORMS
   ========================================== */
.form-control, .wysihtml5-sandbox { width: 100% !important; box-shadow: none !important; border-radius: 2px; background: #fefefe; border-color: #d8dde5 !important; }
.form-control:focus, .wysihtml5-sandbox:hover { border-color: #afafaf !important; box-shadow: none; }
.form-group.has-success label { color: #00a65a; }
.form-group.has-success .form-control { border-color: #00a65a !important; box-shadow: none; }
.form-group.has-warning label { color: #f39c12; }
.form-group.has-warning .form-control { border-color: #f39c12 !important; box-shadow: none; }
.form-group.has-error label { color: #f56954; }
.form-group.has-error .form-control { border-color: #f56954 !important; box-shadow: none; }

.bootstrap-wysihtml5-insert-image-modal h3, .bootstrap-wysihtml5-insert-link-modal h3 { display: inline-block !important; margin: 0; }
.input-group .input-group-addon { border-radius: 0; background-color: #f4f4f4; border-color: #d8dde5 !important; }
label { font-weight: 400; }
.checkbox, .radio { padding-left: 0; }
.checkbox label, .radio label { padding-left: 7px; }

/* ==========================================
   CUSTOM BOXES
   ========================================== */
.custom-box {
    position: relative;
    display: block;
    padding: 20px;
    margin-bottom: 20px;
    border-radius: 5px;
    color: #FFF;
    box-shadow: 1px 1px 0 0 #fff, 1px 1px 3px 0 rgba(0,0,0,.2) inset;
}

.custom-box h3 { font-size: 38px; font-weight: 700; margin: 0 0 10px; white-space: nowrap; padding: 0; }
.custom-box p { font-size: 15px; }
.custom-box p>small { display: block; color: #f9f9f9; font-size: 13px; margin-top: 5px; }
.custom-box h3, .custom-box p { z-index: 5px; }
.custom-box i { position: absolute; font-size: 90px; right: 15px; bottom: 0; line-height: auto; margin: 0; padding: 0; color: rgba(0,0,0,.1); }
.custom-box:hover { text-decoration: none; color: #f9f9f9; }

/* ==========================================
   BOXES / PANELS
   ========================================== */
.box {
    position: relative;
    background: #fff;
    margin-bottom: 20px;
    border-radius: 3px;
    width: 100%;
    box-shadow: 0 0 3px 0 rgba(0,0,0,.1);
}

.box .box-title {
    position: relative;
    border-radius: 3px 3px 0 0;
    color: #444;
    box-shadow: inset 0 1px 0 0 rgba(255,255,255,1);
    background: #f8f8f8;
    border-bottom: 1px solid #e4e4e4;
    padding: 10px;
}

.box .box-title:after, .box .box-title:before { display: table; content: " "; }
.box .box-title:after { clear: both; }
.box .box-title>i { margin: 0 10px 0 0; font-size: 18px; float: left; cursor: default; }
.box .box-title h3 { color: #505050; text-shadow: 1px 1px 0 #FFF; margin: 0; font-size: 17px; font-weight: 600; float: left; cursor: default; }
.box .box-title a:not(.btn) { color: #444; }
.box .box-title>.box-toolbar .dropdown-menu { margin-top: -7px; min-width: 60px !important; }

.box .box-body {
    padding: 10px;
    border-radius: 0 0 3px 3px;
}

.box .box-body>.table, .box .box-body>table { margin-bottom: 0; }
.box .box-body.chart-responsive { width: 100%; overflow: hidden; }
.box .box-body>.chart { position: relative; overflow: hidden; width: 100%; }
.box-body .external-event { color: #FFF; padding: 10px; font-size: 12px; }
.box-body #external-events .well { padding: 10px; margin: 10px 0 0; }
.box .box-body .fc { margin-top: 5px; }
#color-chooser a { color: #FFF !important; }
.fc-event-inner { padding: 5px 10px; }
.fc-event { background: #e74c3c; border: none !important; }
.box .box-body .fc-header-title h2 { font-size: 15px; line-height: 1.6em; color: #666; margin-left: 10px; }
.box .box-body .fc-header-right { padding-right: 10px; }
.box .box-body .fc-header-left { padding-left: 10px; }
.box .box-body .fc-widget-header { padding: 10px 0; }
.box .box-body .fc-widget-content:first-of-type, .box .box-body .fc-widget-header:first-of-type { border-left: 0; border-right: 0; }
.box .box-body .fc-widget-content:last-of-type, .box .box-body .fc-widget-header:last-of-type { border-right: 0; }
.box .box-body .fc-widget-content { padding: 5px; }
.box .box-body .table { margin-bottom: 0; }

.box .box-footer {
    border-radius: 0 0 3px 3px;
    padding: 10px;
    background-color: #fff;
}

.box .box-group>.box { margin-bottom: 5px; }
.box-bordered { background: #f6f6f6; border: 2px dotted #dbdbdb; padding: 10px; }

.todo { margin: 0; padding: 0; list-style: none; }
.todo>li { border-radius: 2px; padding: 10px; background: #f4f4f4; margin-bottom: 2px; color: #444; }
.todo>li:last-of-type { margin-bottom: 0; }
.todo>li>input[type=checkbox] { margin: 0 10px 0 5px; }
.todo>li .text { display: inline-block; margin-left: 5px; font-weight: 600; }
.todo>li .label { margin-left: 10px; font-size: 9px; }
.todo>li:hover { background-color: #f1f1f1; }
.todo>li.through { color: #999; }
.todo>li.through .text { text-decoration: line-through; font-weight: 500; }
.todo>li.through.label { background: #eaeaec !important; }

/* Box Chat */
.box .chat { padding: 5px 20px 5px 10px; }
.box .chat .item { margin-bottom: 10px; }
.box .chat .item:after, .box .chat .item:before { display: table; content: " "; }
.box .chat .item:after { clear: both; }
.box .chat .item>img { width: 40px; height: 40px; }
.box .chat .item>img.online { border: 2px solid #00a65a; }
.box .chat .item>img.offline { border: 2px solid #f56954; }
.box .chat .item>.message { position: relative; margin-left: 55px; margin-top: -40px; border: 1px solid #ddd; padding: 10px; }
.box .chat .item>.message:after, .box .chat .item>.message:before { right: 100%; top: 23%; border: solid transparent; content: " "; height: 0; width: 0; position: absolute; pointer-events: none; }
.box .chat .item>.message:after { border-color: rgba(255,255,255,0); border-right-color: #fff; border-width: 8px; margin-top: -8px; }
.box .chat .item>.message:before { border-color: rgba(221,221,221,0); border-right-color: #ddd; border-width: 9px; margin-top: -9px; }
.box .chat .item>.message>.name { display: block; font-weight: 600; margin: -5px 0 5px; }

/* ==========================================
   SLIDERS
   ========================================== */
.slider-handle { background-color: #FFF; height: 27px; width: 27px; box-shadow: 0 1px 3px rgba(0,0,0,.4); }
.slider.slider-vertical .slider-handle { margin-left: -8px; }
.slider.slider-horizontal .slider-handle { margin-top: -8px; }
.slider-track { background-color: #ebedef !important; box-shadow: none !important; background-image: none !important; }
.slider-selection { box-shadow: none !important; background-image: none !important; }
#blue .slider-selection { background: #3498db !important; }
#red .slider-selection { background: #e74c3c !important; }
#yellow .slider-selection { background: #f1c40f !important; }
#green .slider-selection { background: #1abc9c !important; }

/* ==========================================
   TIMELINE
   ========================================== */
.timeline-centered { position: relative; margin-bottom: 30px; }
.timeline-centered:after, .timeline-centered:before { content: " "; display: table; }
.timeline-centered:after { clear: both; }
.timeline-centered:before { content: ''; position: absolute; display: block; width: 4px; background: #fff; left: 50%; top: 20px; bottom: 20px; margin-left: -4px; }

.timeline-centered .timeline-entry { position: relative; width: 50%; float: right; margin-bottom: 70px; clear: both; }
.timeline-centered .timeline-entry:after, .timeline-centered .timeline-entry:before { content: " "; display: table; }
.timeline-centered .timeline-entry:after { clear: both; }
.timeline-centered .timeline-entry.begin { margin-bottom: 0; }

.timeline-centered .timeline-entry.left-aligned { float: left; }
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner { margin-left: 0; margin-right: -18px; }
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-time { left: auto; right: -100px; text-align: left; }
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-icon { float: right; }
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-label { margin-left: 0; margin-right: 70px; }
.timeline-centered .timeline-entry.left-aligned .timeline-entry-inner .timeline-label:after { left: auto; right: 0; margin-left: 0; margin-right: -9px; transform: rotate(180deg); }

.timeline-centered .timeline-entry .timeline-entry-inner { position: relative; margin-left: -22px; }
.timeline-centered .timeline-entry .timeline-entry-inner:after, .timeline-centered .timeline-entry .timeline-entry-inner:before { content: " "; display: table; }
.timeline-centered .timeline-entry .timeline-entry-inner:after { clear: both; }

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time { position: absolute; left: -100px; text-align: right; padding: 0 10px; box-sizing: border-box; }
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time>span { display: block; }
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time>span:first-child { font-size: 15px; font-weight: 700; }
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-time>span:last-child { font-size: 12px; }

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon {
    background: #fff;
    color: #fff;
    display: block;
    width: 40px;
    height: 40px;
    background-clip: padding-box;
    border-radius: 20px;
    text-align: center;
    box-shadow: 0 0 0 5px #fff;
    line-height: 40px;
    font-size: 15px;
    float: left;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label {
    position: relative;
    background: #fff;
    padding: 15px 20px;
    margin-left: 70px;
    background-clip: padding-box;
    border-radius: 3px;
    box-shadow: 0 1px 2px 0 rgba(0,0,0,.05);
    border: 1px solid #e0e0e0;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label:after {
    content: '';
    display: block;
    position: absolute;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 9px 9px 9px 0;
    border-color: transparent #fff transparent transparent;
    left: 0;
    top: 10px;
    margin-left: -9px;
}

.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2, .timeline-centered .timeline-entry .timeline-entry-inner .timeline-label p { color: #737881; font-size: 12px; margin: 0; line-height: 1.428571429; }
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label p+p { margin-top: 15px; }
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 { font-size: 16px; margin-bottom: 10px; }
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 a { color: #293c4e; }
.timeline-centered .timeline-entry .timeline-entry-inner .timeline-label h2 span { opacity: .6; }

/* ==========================================
   BUTTONS
   ========================================== */
.btn { border-radius: 3px; border: 1px solid transparent !important; }
.file-inputs { color: #FFF !important; }
.file-inputs:hover { color: #4d4d4d !important; }

.btn.btn-default { background-color: #fafafa; color: #666; }
.btn.btn-default:active, .btn.btn-default:hover { background-color: #f4f4f4 !important; }
.btn.btn-primary { background-color: #293c4e; }
.btn.btn-primary:active, .btn.btn-primary:hover { background-color: #1d364f; }
.btn.btn-success { background-color: #27ae60; }
.btn.btn-success:active, .btn.btn-success:hover { background-color: #1c8348; }
.btn.btn-info { background-color: #3498db; }
.btn.btn-info:active, .btn.btn-info:hover { background-color: #2980b9; }
.btn.btn-danger { background-color: #e74c3c; }
.btn.btn-danger:active, .btn.btn-danger:hover { background-color: #c0392b; }
.btn.btn-warning { background-color: #e67e22; }
.btn.btn-warning:active, .btn.btn-warning:hover { background-color: #d35400; }
.btn:active { box-shadow: inset 0 3px 5px rgba(0,0,0,.125); }
.btn:focus { outline: 0; }

.btn.btn-file { position: relative; width: 120px; height: 35px; overflow: hidden; }
.btn.btn-file>input[type=file] { display: block !important; width: 100% !important; height: 35px !important; opacity: 0 !important; position: absolute; top: -10px; cursor: pointer; }
.btn.btn-link { color: #666; }
.btn.btn-white { background-color: #FFF; color: #666; }
.btn-color { color: #FFF; }
.btn-color:active, .btn-color:hover { color: #FFF; opacity: .9; }

.btn-label { position: relative; left: -14px; display: inline-block; padding: 6px 12px; background: rgba(0,0,0,.15); border-radius: 3px 0 0 3px; }
.btn-labeled { padding-top: 0; padding-bottom: 0; }

.btn-outline { background-color: transparent !important; color: inherit; transition: all .5s; }
.btn-primary.btn-outline { color: #293c4e; border-color: #293c4e !important; }
.btn.btn-primary.btn-outline:active, .btn.btn-primary.btn-outline:hover { background-color: #293c4e !important; }
.btn-success.btn-outline { color: #27ae60; border-color: #27ae60 !important; }
.btn.btn-success.btn-outline:active, .btn.btn-success.btn-outline:hover { background-color: #27ae60 !important; }
.btn-info.btn-outline { color: #3498db; border-color: #3498db !important; }
.btn.btn-info.btn-outline:active, .btn.btn-info.btn-outline:hover { background-color: #3498db !important; }
.btn-warning.btn-outline { color: #e67e22; border-color: #e67e22 !important; }
.btn.btn-warning.btn-outline:active, .btn.btn-warning.btn-outline:hover { background-color: #e67e22 !important; }
.btn-danger.btn-outline { color: #e74c3c; border-color: #e74c3c !important; }
.btn.btn-danger.btn-outline:active, .btn.btn-danger.btn-outline:hover { background-color: #e74c3c !important; }
.btn-danger.btn-outline:hover, .btn-info.btn-outline:hover, .btn-primary.btn-outline:hover, .btn-success.btn-outline:hover, .btn-warning.btn-outline:hover { color: #fff; }

.btn-circle { width: 30px; height: 30px; text-align: center; padding: 6px 0; font-size: 12px; line-height: 1.428571429; border-radius: 15px; }
.btn-circle.btn-lg { width: 50px; height: 50px; padding: 10px 16px; font-size: 18px; line-height: 1.33; border-radius: 25px; }
.btn-circle.btn-xl { width: 70px; height: 70px; padding: 10px 16px; font-size: 24px; line-height: 1.33; border-radius: 35px; }

.icheckbox_minimal, .iradio_minimal { background-color: #FFF; }

/* ==========================================
   SOCIAL BUTTONS
   ========================================== */
.btn-social { position: relative; padding-left: 44px !important; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.btn-social :first-child { position: absolute; left: 0; top: 0; bottom: 0; width: 32px !important; line-height: 34px !important; font-size: 1.6em !important; text-align: center; border-right: 1px solid rgba(0,0,0,.2); }
.btn-social.btn-lg { padding-left: 60px !important; }
.btn-social.btn-lg :first-child { line-height: 45px; width: 45px; font-size: 1.8em; }
.btn-social.btn-sm { padding-left: 38px !important; }
.btn-social.btn-sm :first-child { line-height: 28px; width: 28px; font-size: 1.4em; }
.btn-social.btn-xs { padding-left: 30px !important; }
.btn-social.btn-xs :first-child { line-height: 20px; width: 20px; font-size: 1.2em; }

.btn-social-icon { position: relative; padding-left: 44px !important; text-align: left; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; height: 34px; width: 34px; padding: 0; }
.btn-social-icon :first-child { position: absolute; left: 0; top: 0; bottom: 0; line-height: 34px !important; font-size: 1.6em !important; }
.btn-social-icon.btn-lg { padding-left: 60px !important; height: 45px; width: 45px; padding-right: 0; }
.btn-social-icon.btn-lg :first-child { line-height: 45px; width: 45px; font-size: 1.8em; }
.btn-social-icon.btn-sm { padding-left: 38px !important; height: 30px; width: 30px; padding-right: 0; }
.btn-social-icon.btn-sm :first-child { line-height: 28px; width: 28px; font-size: 1.4em; }
.btn-social-icon.btn-xs { padding-left: 30px !important; height: 22px; width: 22px; padding-right: 0; }
.btn-social-icon.btn-xs :first-child { line-height: 20px; width: 20px; font-size: 1.2em; }
.btn-social-icon :first-child { border: none; text-align: center; width: 100% !important; }

.btn-bitbucket { color: #fff; background-color: #205081; border-color: rgba(0,0,0,.2); }
.btn-bitbucket:active, .btn-bitbucket:focus, .btn-bitbucket:hover, .open .dropdown-toggle.btn-bitbucket { color: #fff; background-color: #183c60; border-color: rgba(0,0,0,.2); }
.btn-bitbucket.active, .btn-bitbucket:active, .open .dropdown-toggle.btn-bitbucket { background-image: none; }
.btn-dropbox { color: #fff; background-color: #1087dd; border-color: rgba(0,0,0,.2); }
.btn-dropbox:active, .btn-dropbox:focus, .btn-dropbox:hover, .open .dropdown-toggle.btn-dropbox { color: #fff; background-color: #0d70b7; border-color: rgba(0,0,0,.2); }
.btn-dropbox.active, .btn-dropbox:active, .open .dropdown-toggle.btn-dropbox { background-image: none; }
.btn-facebook { color: #fff; background-color: #3b5998; border-color: rgba(0,0,0,.2); }
.btn-facebook:active, .btn-facebook:focus, .btn-facebook:hover, .open .dropdown-toggle.btn-facebook { color: #fff; background-color: #30487b; border-color: rgba(0,0,0,.2); }
.btn-facebook.active, .btn-facebook:active, .open .dropdown-toggle.btn-facebook { background-image: none; }
.btn-flickr { color: #fff; background-color: #ff0084; border-color: rgba(0,0,0,.2); }
.btn-flickr:active, .btn-flickr:focus, .btn-flickr:hover, .open .dropdown-toggle.btn-flickr { color: #fff; background-color: #d6006f; border-color: rgba(0,0,0,.2); }
.btn-flickr.active, .btn-flickr:active, .open .dropdown-toggle.btn-flickr { background-image: none; }
.btn-foursquare { color: #fff; background-color: #0072b1; border-color: rgba(0,0,0,.2); }
.btn-foursquare:active, .btn-foursquare:focus, .btn-foursquare:hover, .open .dropdown-toggle.btn-foursquare { color: #fff; background-color: #005888; border-color: rgba(0,0,0,.2); }
.btn-foursquare.active, .btn-foursquare:active, .open .dropdown-toggle.btn-foursquare { background-image: none; }
.btn-github { color: #fff; background-color: #444; border-color: rgba(0,0,0,.2); }
.btn-github:active, .btn-github:focus, .btn-github:hover, .open .dropdown-toggle.btn-github { color: #fff; background-color: #303030; border-color: rgba(0,0,0,.2); }
.btn-github.active, .btn-github:active, .open .dropdown-toggle.btn-github { background-image: none; }
.btn-google-plus { color: #fff; background-color: #dd4b39; border-color: rgba(0,0,0,.2); }
.btn-google-plus:active, .btn-google-plus:focus, .btn-google-plus:hover, .open .dropdown-toggle.btn-google-plus { color: #fff; background-color: #ca3523; border-color: rgba(0,0,0,.2); }
.btn-google-plus.active, .btn-google-plus:active, .open .dropdown-toggle.btn-google-plus { background-image: none; }
.btn-instagram { color: #fff; background-color: #3f729b; border-color: rgba(0,0,0,.2); }
.btn-instagram:active, .btn-instagram:focus, .btn-instagram:hover, .open .dropdown-toggle.btn-instagram { color: #fff; background-color: #335d7e; border-color: rgba(0,0,0,.2); }
.btn-instagram.active, .btn-instagram:active, .open .dropdown-toggle.btn-instagram { background-image: none; }
.btn-linkedin { color: #fff; background-color: #007bb6; border-color: rgba(0,0,0,.2); }
.btn-linkedin:active, .btn-linkedin:focus, .btn-linkedin:hover, .open .dropdown-toggle.btn-linkedin { color: #fff; background-color: #005f8d; border-color: rgba(0,0,0,.2); }
.btn-linkedin.active, .btn-linkedin:active, .open .dropdown-toggle.btn-linkedin { background-image: none; }
.btn-tumblr { color: #fff; background-color: #2c4762; border-color: rgba(0,0,0,.2); }
.btn-tumblr:active, .btn-tumblr:focus, .btn-tumblr:hover, .open .dropdown-toggle.btn-tumblr { color: #fff; background-color: #1f3346; border-color: rgba(0,0,0,.2); }
.btn-tumblr.active, .btn-tumblr:active, .open .dropdown-toggle.btn-tumblr { background-image: none; }
.btn-twitter { color: #fff; background-color: #55acee; border-color: rgba(0,0,0,.2); }
.btn-twitter:active, .btn-twitter:focus, .btn-twitter:hover, .open .dropdown-toggle.btn-twitter { color: #fff; background-color: #309aea; border-color: rgba(0,0,0,.2); }
.btn-twitter.active, .btn-twitter:active, .open .dropdown-toggle.btn-twitter { background-image: none; }
.btn-vk { color: #fff; background-color: #587ea3; border-color: rgba(0,0,0,.2); }
.btn-vk:active, .btn-vk:focus, .btn-vk:hover, .open .dropdown-toggle.btn-vk { color: #fff; background-color: #4a6a89; border-color: rgba(0,0,0,.2); }
.btn-vk.active, .btn-vk:active, .open .dropdown-toggle.btn-vk { background-image: none; }

/* ==========================================
   ICON LIST & MODALS
   ========================================== */
.icon-list { margin: 20px -15px 30px; }
.icon-list div { line-height: 26px; height: 26px; padding-left: 10px; }
.icon-list div i { width: 26px; font-size: 14px; display: inline-block; text-align: right; margin-right: 10px; }
.icon-list div:hover i { font-size: 26px; vertical-align: -4px; }

.modal-header { background: #f5f5f5; box-shadow: inset 0 1px 0 0 #FFF; border-radius: 5px 5px 0 0; color: #696969; text-shadow: 1px 1px 0 #FFF; }
.modal-header i { margin-right: 7px; }
.modal-footer { margin-top: 0; }

/* ==========================================
   PAGINATION & NAVS
   ========================================== */
.pagination>li>a { color: #666; box-shadow: 0 1px 3px 0 rgba(0,0,0,.06); padding: 4px 10px; }
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover { background: #f2f2f2; border-color: #ddd; color: #666; }

.nav.nav-pills { margin-bottom: 10px; }
.nav.nav-pills>li>a { border-top: 3px solid transparent; border-radius: 0; color: #444; padding: 13px 10px; }
.nav.nav-pills>li>a>i { margin-right: 5px; }
.nav.nav-pills>li.active>a, .nav.nav-pills>li.active>a:hover { background-color: #f6f6f6; border-top-color: #3c8dbc; color: #444; }
.nav.nav-pills>li.active>a { font-weight: 600; }
.nav.nav-pills.nav-stacked>li>a { border-top: 0; background-color: #f6f6f6; border-left: 3px solid transparent; color: #444; }
.nav.nav-pills>li>a:hover { background-color: #FFF; }
.nav.nav-pills.nav-stacked>li.active>a, .nav.nav-pills.nav-stacked>li.active>a:hover { background-color: #27ae60; color: #FFF; }

/* ==========================================
   MAILBOX
   ========================================== */
.mailbox-text { font-size: 13px; }
.mailbox-avatar { width: 100px; height: 100px; margin: 5px 10px 0 0; }
.mailbox-info { background: #f0efef; padding: 10px 10px 10px 0; margin-bottom: 10px; }
.mailbox-info .from span { background: #dcdcdc; padding: 10px 12px; margin-right: 10px; }
.mailbox-info .from a { color: #5a5a5a; }
.mailbox-info span.label { color: #5a5a5a; font-weight: 400; }
.mailbox-info i { margin-right: 5px; }
.mailbox-attachment { background: #f0efef; padding: 10px; margin-top: 15px; line-height: 30px; }
.mailbox-attachment small { margin-left: 10px; }
.mailbox .mailbox-tools { background: rgba(0,0,0,.03); margin-bottom: 10px; padding: 10px; width: 100%; }
.mailbox .box-bordered input, .mailbox .box-bordered textarea, .mailbox .mailbox-buttons { margin-bottom: 10px; }
.mailbox .search-form { margin-bottom: 15px; }
.mailbox .table tr.unread>td { background-color: rgba(0,0,0,.03); color: #000; font-weight: 600; }
.mailbox .table tr>td>.fa.fa-star, .mailbox .table tr>td>.fa.fa-star-o, .mailbox .table tr>td>.glyphicon.glyphicon-star, .mailbox .table tr>td>.glyphicon.glyphicon-star-empty { color: #f39c12; cursor: pointer; }
.mailbox .table tr>td.small { width: 32px; }
.mailbox .table tr>td.name { font-weight: 600; width: 145px; color: #444; }
.mailbox .table tr>td.time { text-align: right; width: 140px; }
.mailbox .table tr>td.time i { margin-right: 10px; }
.mailbox .table tr>td { padding: 13px 10px; }
.mailbox .table tr>td>a { color: #444; }

/* ==========================================
   LOADING BAR & CHARTS
   ========================================== */
.pace .pace-progress { background: #0f99f5; position: fixed; z-index: 2000; top: 0; left: 0; height: 2px; transition: width 1s; }
.pace-inactive { display: none; }
.flot { height: 350px; margin: 15px 0 10px; }
#flot_tip { position: absolute; display: none; padding: 2px 5px; color: #FFF; background-color: #000; opacity: .8; }
.flot-placeholder { width: 100%; height: 100%; font-size: 14px; line-height: 1.2em; }
.legendColorBox { padding-left: 10px; }
.legendLabel { padding-left: 4px; }

/* ==========================================
   LOGIN SCREEN
   ========================================== */
.login .lock-image { text-align: center; margin-bottom: 20px; }
.login .lock-image .name { box-shadow: 1px 1px 0 0 rgba(255,255,255,.1), inset 1px 1px 3px 0 rgba(0,0,0,.3); background: #13212f; margin: 30px -20px 0 0; padding: 10px 25px 10px 20px; color: #FFF; border-radius: 6px 0 0 6px; display: inline-block; }
.login .lock-image .img-circle { width: 100px; box-shadow: 1px 1px 0 0 rgba(255,255,255,.1), inset 1px 1px 3px 0 rgba(0,0,0,.3); background: #13212f; padding: 4px; position: relative; z-index: 9999; }
.login .lock-image .action { box-shadow: 1px 1px 0 0 rgba(255,255,255,.1), inset 1px 1px 3px 0 rgba(0,0,0,.3); background: #13212f; padding: 10px 2px 10px 0; color: #FFF; margin-left: -7px; border-radius: 0 6px 6px 0; display: inline-block; }
.login .lock-image .action a { background: #e74c3c; color: #FFF; padding: 8px 15px; border-radius: 0 6px 6px 0; }

.login { background-color: #273849; }
.login .well { background: rgba(0,0,0,.3); border-radius: 6px; padding: 10px 20px; box-shadow: 1px 1px 0 0 rgba(255,255,255,.1), inset 1px 1px 3px 0 rgba(0,0,0,.3); border: none; }
.login .logo { font-size: 36px; margin: 0 auto !important; text-align: center; border-radius: 6px; padding-bottom: 20px; }
.login .logo span { font-size: 32px; }
.login .logo a { color: #FFF; }
.login .wrapper { width: 430px; margin: 140px auto 0; }
.login .box { box-shadow: 0 0 6px 0 rgba(0,0,0,.2); border-radius: 6px; margin-bottom: 0; }
.login .box small { margin-left: 5px; color: #828282; }
.login .box .header { background: #2b4a6a; padding: 12px 10px 15px 17px; font-size: 20px; font-weight: 600; color: #fff; border-radius: 5px 5px 0 0; box-shadow: inset 0 1px 0 0 rgba(255,255,255,.1); text-shadow: 1px 1px 0 rgba(0,0,0,.8); }
.login .box .header a { color: rgba(0,0,0,.6); text-shadow: 1px 1px 0 rgba(255,255,255,.3); }
.login .box .header i { margin-right: 10px; }
.login .box-footer { padding: 15px 0 0; }
.login a { color: rgba(255,255,255,.5); }
.login a:hover { color: rgba(255,255,255,.7); }
.login .box-extra { padding: 10px 0; }

/* ==========================================
   FOOTER
   ========================================== */
.footer-position { bottom: 0; }
footer { color: rgba(255,255,255,.4); border-top: 1px solid rgba(0,0,0,.6); box-shadow: inset 0 1px 0 0 rgba(255,255,255,.1); text-shadow: 1px 1px 0 rgba(0,0,0,.3); padding: 20px 0; margin-top: 50px; text-align: center; }
footer ul { margin-top: 15px; }
footer ul li a { font-size: 12px; }

/* ==========================================
   CUSTOM EXTRA RULES
   ========================================== */
.extra-group { height: 30px; line-height: 30px !important; position: relative; }
#check-progress, #result { display: none; }
.w20px { width: 60px !important; text-align: center; }
#cc td, #cc tr { text-align: center; }
.business { font-weight: 700; color: #990e02; }
.premier { font-weight: 700; color: #0F0; }
.verified { font-weight: 700; color: #006DB0; }
#news img { height: 20px !important; }

/* ==========================================
   MEDIA QUERIES (RESPONSIVE)
   ========================================== */
@media screen and (max-width: 992px) {
    .info-box { display: none; }
    .leftside, header .logo { width: 42px; }
    .leftside .sidebar .label, .leftside .sidebar .pull-right.fa, .leftside .sidebar span, .leftside .user-box, .sidebar .alert, .sidebar .sidebar-widget, .title, header .logo span { display: none; }
    .rightside, header .navbar { margin-left: 42px; }
    .flot { height: 300px; }
    .leftside .slimScrollDiv { overflow: inherit !important; }
    .sidebar .sidebar-menu .sub-menu { position: absolute !important; z-index: 9999 !important; margin-left: 40px !important; margin-top: -45px !important; box-shadow: none; }
    .sidebar .sidebar-menu .sub-menu>li>a { padding: 10px 25px 10px 10px; }
}

@media screen and (max-width: 767px) {
    .navbar-header { float: left; width: 30%; }
    .navbar-form { margin: -2px 0 0; }
    .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; }
    .navbar .navbar-right { float: right; }
    .rightside>.page-head>.breadcrumb { display: inline-block; position: relative; float: none; width: 100%; }
    .navbar-nav>.dropdown-messages>.dropdown-menu, .navbar-nav>.dropdown-notifications>.dropdown-menu, .navbar-nav>.dropdown-tasks>.dropdown-menu, .navbar-nav>.widget-user>.dropdown-menu { position: absolute; top: 100%; right: 0; left: auto; background: #fff; box-shadow: 0 3px 6px rgba(0,0,0,.1); }
}

@media screen and (max-width: 480px) {
    .login .wrapper { width: 80%; }
    .dropdown.widget-user span, .fixed .leftside, .leftside, .navbar-form, .navbar-nav .dropdown-menu .header i, header .logo { display: none; }
    .rightside, header .navbar { margin-left: 0; }
    .navbar-nav>.dropdown-messages>.dropdown-menu, .navbar-nav>.dropdown-notifications>.dropdown-menu, .navbar-nav>.dropdown-tasks>.dropdown-menu { max-width: 180px; min-width: 180px; }
    .navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a>h4>small { display: block; float: none; margin: 10px 0; }
    .navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a, .navbar-nav>.dropdown-notifications>.dropdown-menu>li ul>li>a, .navbar-nav>.dropdown-tasks>.dropdown-menu>li ul>li>a { white-space: normal; }
    .navbar-nav>.dropdown-messages>.dropdown-menu>li ul>li>a>p { line-height: 15px; margin: 0; }
    .dropdown.widget-user { height: 50px; width: 60px; }
    .flot { height: 200px; }
    .custom-box, .navbar-nav .dropdown-menu .header { text-align: center; }
    .custom-box p { font-size: 12px; }
}

@media only screen and (max-width: 740px) {
    header .navbar .navbar-header { width: 40%; }
}

@media only screen and (max-width: 620px) {
    header .navbar .navbar-header { width: 30%; }
}

@media only screen and (max-width: 540px) {
  .navbar-form { display: none; }
}

/* Extra Classes */
.extra-group { height: 30px; line-height: 30px !important; position: relative; }
#check-progress, #result { display: none; }
.w20px { width: 60px !important; text-align: center; }

/* Table Styles */
#cc td, #cc tr { text-align: center; }

/* Status Colors */
.business { font-weight: 700; color: #990e02; }
.premier { font-weight: 700; color: #0F0; }
.verified { font-weight: 700; color: #006DB0; }

/* News Images */
#news img { height: 20px !important; }

/* File Inputs */
.file-inputs { color: #FFF !important; }
.file-inputs:hover { color: #4d4d4d !important; }

/* Slider Vertical */
.slider.slider-vertical .slider-handle { margin-left: -8px; }

/* Slider Horizontal */
.slider.slider-horizontal .slider-handle { margin-top: -8px; }

.sidebar .sidebar-menu .sub-menu {
    display: none;
    list-style: none;
    padding: 0;
    margin: 0;
    background: #253646;
}

.sidebar .sidebar-menu .sub-menu > li > a {
    padding: 10px 15px 10px 35px;
    display: block;
}

.sidebar .sidebar-menu .has-submenu > a {
    cursor: pointer;
}