/* 
Template Name: Color Admin - Responsive Admin Dashboard Template build with Twitter Bootstrap 3.3.5
Version: 1.8.0
Author: Sean Ngu
Website: http://www.seantheme.com/color-admin-v1.8/admin/

::  1.0 General Reset & Setup
-------------------------------------------
    1.1 Reset and overrides
        
::  3.0 Component Setting
-------------------------------------------
    3.1 Component - Form Elements
    3.2 Component - Dropdown Menu
    3.3 Component - Tooltip
    3.4 Component - Alert
    3.5 Component - Note Setting
    3.6 Component - Badge & Label Setting
    3.7 Component - Pagination & pager
    3.8 Component - Progress bar
    3.9 Component - Nav Setting
    3.10 Component - Nav Tabs
    3.11 Component - Nav Pills
    3.12 Component - Tab Content
    3.13 Component - Accordion Panel
    3.14 Component - Button
        3.14.1 Component - Button - Default
        3.14.2 Component - Button - White
        3.14.3 Component - Button - Inverse
        3.14.4 Component - Button - Primary
        3.14.5 Component - Button - Success
        3.14.6 Component - Button - Warning
        3.14.7 Component - Button - Danger
        3.14.8 Component - Button - Info
    3.15 Component - Panel
    3.16.Component - Panel - Panel Expand
    3.17 Component - Panel - Panel loading
    3.18 Component - Modal Setting
    3.19 Component - Media Object
    3.20 Component - Table
    3.21 Component - Well
    3.22 Component - Jumbotron
    3.23 Component - List Group
    3.24 Component - Carousel

::  4.0 Predefined CSS Setting
-------------------------------------------
    4.1 Predefined Classes

::  5.0 Plugins Setting
-------------------------------------------
    5.0 Plugins Setting
    5.1 Plugins - jQuery Draggable
    5.2 Plugins - Slimscrollbar
    5.3 Plugins - Gritter Notification
    5.4 Plugins - Data Table
    5.5 Plugins - Datepicker
    5.6 Plugins - Colorpicker
    5.7 Plugins - Bootstrap Timepicker
    5.8 Plugins - jQuery Autocomplete
    5.9 Plugins - Combobox
    5.10 Plugins - Bootstrap Select
    5.11 Plugins - TagIt
    5.12 Plugins - Parsley
    5.13 Plugins - CKEditor / wysihtml5
    5.14 Plugins - Bootstrap Wizard
    5.15 Plugins - Fullcalendar
    5.16 Plugins - jVectorMap
    5.17 Plugins - Flot Chart
    5.18 Plugins - Sparkline

::  6.0 Page Setting
-------------------------------------------
    6.1 Page - Search Result
    6.2 Media Message
    6.3 Widget Stats
    6.4 Todolist
    6.5 Page - Vector / Google Map
    6.6 Page - Invoice
    6.7 Page - Login
    6.8 Page - Gallery
    6.9 Page - Inbox
    6.10 Page - 404 Error Page

::  7.0 Update - V1.1 
-------------------------------------------
    7.1 Timeline Setting
    7.2 Coming Soon Page Setting

::  8.0 Update - V1.2 
-------------------------------------------
    8.1 Theme Panel Setting
    8.2 Powerange Slider Setting
    8.3 Plugins DateTimepicker
    8.4 Plugins wysihtml5 Sandbox
    8.5 Plugins Typeahead
    8.6 Plugins Select 2 Choice
    8.7 Login Page V2
    
::  9.0 Update - V1.3
-------------------------------------------
    9.1 Widget Chart Setting
    9.2 List Group Item Inverse Setting
    9.3 Bootstrap Calendar Setting
    9.4 Registered Users List Setting
    9.5 Chat List Setting
    9.6 Gallery v2 - Superbox Setting
    
::  10.0 Update - V1.4
-------------------------------------------
    10.1 Page - Email Inbox v2
    10.2 Page - Email Detail v2
    
::  11.0 Update - V1.5
-------------------------------------------
    11.1 Content Theme - Flat Black
        11.1.1  Flat Black - Body Setting
        11.1.2  Flat Black -  Navbar Inverse Setting
        11.1.3  Flat Black - Sidebar Setting
        11.1.4  Flat Black - Page Footer Setting
        11.1.5  Flat Black - List Group item Setting
        11.1.6  Flat Black - Nav Pills Setting
        11.1.7  Flat Black - Badge Setting
        11.1.8  Flat Black - Tabs Setting
        11.1.9  Flat Black - Panel Setting
        11.1.10 Flat Black - Table Setting
        11.1.11 Flat Black - Button Inverse Setting
        11.1.12 Flat Black - Button Default Setting
        11.1.13 Flat Black - Button White Setting
        11.1.14 Flat Black - Pagination Setting
        11.1.15 Flat Black -  Progress Bar Setting
        11.1.16 Flat Black - Vector Map Setting
        11.1.17 Flat Black - Helper Classes Setting
        11.1.18 Flat Black - Bootstrap Wizard Setting
        11.1.19 Flat Black - Timeline
        11.1.20 Flat Black - Invoice
        11.1.21 Flat Black - Error Page
    11.2 Pace Loader Setting
    
::  12.0 Update - V1.6
-------------------------------------------
    12.1 Unlimited Nav Tabs 
    
::  13.0 Update - V1.7
-------------------------------------------
    13.1 Light Sidebar Setting
    13.2 Wide Sidebar Setting
    13.3 Navbar Header Brand Without Background Setting
    13.4 Plugins - Jstree Setting
    13.5 Top Navbar Mega Menu Setting
    13.6 Login & Register Page with News Feed Setting
    13.7 Plugins - Bootstrap Date Range Picker
    13.8 Plugins - Select 2
    13.9 Top Navbar Language Setting
    13.10 Profile Page Setting
    
::  14.0 Update - V1.8
-------------------------------------------
    14.1 Full Color Panel
    14.2 Bootstrap Date Timepicker
*/


/* -------------------------------
   1.0 General reset & setup
------------------------------- */

/* 1.1 Reset and overrides */

body {
    background: #d9e0e7;
    font-size: 12px;
    font-family: 'Open Sans', "Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #707478;
}
.ie8 body {
    font-family: Arial,sans-serif;
}
h1, h2, h3, h4, h5, h6{
    font-weight: 500;
    color: #242a30;
}
h1 small, h2 small, h3 small, h4 small, h5 small, h6 small {
    font-size: 60%;
    font-weight: 300;
    color: #7c7f83;
}
a {
    transition: color 100ms ease-in-out;
    -o-transition: color 100ms ease-in-out;
    -ms-transition: color 100ms ease-in-out;
    -moz-transition: color 100ms ease-in-out;
    -webkit-transition: color 100ms ease-in-out;
}
a:focus {
    outline: none;
}
label {
    color: #242a30;
}





.fade .navbar-form .form-control {
    -webkit-animation: none;
}



/* -------------------------------
   3. Component Setting
------------------------------- */

/* 3.1 Component - Form Elements */

.form-control {
    border: 1px solid #ccd0d4;
    -webkit-box-shadow: none;
    box-shadow: none;
    font-size: 12px;
    border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
}
.form-control.input-white {
    background: #fff;
    border-color: #fff;
}
.form-control.input-white:focus {
    box-shadow: none;
    -webkit-box-shadow: none;
}
.form-control[disabled], 
.form-control[readonly],
fieldset[disabled] .form-control {
    background: #e5e9ed;
    opacity: 0.6;
    filter: alpha(opacity=60);
}
.form-control[disabled]:focus, 
.form-control[readonly]:focus,
fieldset[disabled] .form-control:focus {
    box-shadow: none;
    -webkit-box-shadow: none;
    border: 1px solid #ccd0d4;
}
.form-control:focus {
    border-color: #9fa2a5;
    -webkit-box-shadow: none;
    box-shadow: none;
}
.form-control.input-inline {
    display: inline;
    width: auto;
    padding: 0 7px;
}
.form-control.input-xs {
    height: 20px;
}
.form-horizontal.form-bordered .form-group {
    border-bottom: 1px solid #eee;
    margin: 0;
}
.form-horizontal.form-bordered .form-group:last-child {
    border-bottom: 0;
}
.form-horizontal.form-bordered .form-group > .control-label {
    padding: 22px 15px 15px;
}
.form-horizontal.form-bordered .form-group > div {
    padding: 15px;
}
.form-horizontal.form-bordered .form-group > div {
    border-left: 1px solid #eee;
}
.form-horizontal.form-bordered .form-group > .control-label {
    border-right: 1px solid #eee;
    margin-right: -1px;
}
.form-horizontal.form-bordered .has-feedback .form-control-feedback {
    top: 15px;
}
label {
    font-weight: 500;
}
.has-success .form-control,
.has-success .form-control:focus,
.has-warning .form-control,
.has-warning .form-control:focus,
.has-error .form-control,
.has-error .form-control:focus {
    -webkit-box-shadow: none;
    box-shadow: none;
}
.has-success .help-block, 
.has-success .control-label, 
.has-success .radio, 
.has-success .checkbox, 
.has-success .radio-inline, 
.has-success .checkbox-inline,
.has-success .form-control-feedback {
    color: #00acac;
}
.has-success .form-control {
    border-color: #00acac;
}
.has-success .form-control:focus {
    border-color: #008a8a;
}
.has-warning .help-block, 
.has-warning .control-label, 
.has-warning .radio, 
.has-warning .checkbox, 
.has-warning .radio-inline, 
.has-warning .checkbox-inline,
.has-warning .form-control-feedback {
    color: #f59c1a;
}
.has-warning .form-control {
    border-color: #f59c1a;
}
.has-warning .form-control:focus {
    border-color: #c47d15;
}
.has-error .help-block, 
.has-error .control-label, 
.has-error .radio, 
.has-error .checkbox, 
.has-error .radio-inline, 
.has-error .checkbox-inline,
.has-error .form-control-feedback {
    color: #ff5b57;
}
.has-error .form-control {
    border-color: #ff5b57;
}
.has-error .form-control:focus {
    border-color: #cc4946;
}
.form-control-feedback {
    line-height: 34px;
}

select.form-control {
    border-color: #ccd0d4;
}
select[multiple].form-control {
    border-color: #ccd0d4;
}
.input-group-addon {
    background: #e2e7eb;
    border: none;
}
legend {
    padding-bottom: 3px;
    border-bottom: 1px solid #e2e7eb;
}



/* 3.13 Component - Accordion Panel */

.panel-title a {
    display: block;
}
.panel-title > a:hover,
.panel-title > a:focus {
    text-decoration: none;
}


/* 3.14 Component - Button */

.btn {
    font-weight: 300;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.btn:focus, 
.btn:active:focus, 
.btn.active:focus {
    outline: none;
}
.btn-icon,
.btn.btn-icon {
    display: inline-block;
    width: 28px;
    height: 28px;
    padding: 0;
    border: none;
    line-height: 28px;
    text-align: center;
    font-size: 14px;
}
.btn-circle,
.btn.btn-circle {
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
}
.btn-icon.btn-xs {
    width: 16px;
    height: 16px;
    font-size: 8px;
    line-height: 16px;
}
.btn-icon.btn-sm {
    width: 22px;
    height: 22px;
    font-size: 11px;
    line-height: 22px;
}
.btn-icon.btn-lg {
    width: 34px;
    height: 34px;
    font-size: 17px;
    line-height: 34px;
}
.btn-scroll-to-top {
    position: fixed;
    bottom: 20px;
    right: 25px;
    z-index: 1020;
}
.page-with-right-sidebar .btn-scroll-to-top {
    left: 25px;
    right: auto;
}
.btn > .pull-left, 
.btn > .pull-right {
    line-height: 1.428571429;
}
.btn-block {
    padding-left: 12px;
    padding-right: 12px;
}
.btn:active,
.btn.active {
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.1);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.1);
} 




/* 3.14.2 Component - Button - White */

.btn.btn-white {
    font-weight: normal;
    color: #333;
    background: #fff;
    border-color: #e2e7eb;
}
.btn.btn-white.btn-white-without-border {
    border-color: #fff;
}
.btn.btn-white.btn-white-without-border.active,
.btn.btn-white.btn-white-without-border.active:hover,
.btn.btn-white.btn-white-without-border.active:focus {
    border-color: #ddd;
}
.btn.btn-white.btn-white-without-border:hover,
.btn.btn-white.btn-white-without-border:focus {
    border-color: #eee;
}
.btn-white:hover, 
.btn-white:focus, 
.btn-white:active, 
.btn-white.active,
.open .dropdown-toggle.btn-white {
    background: #e2e7eb;
    border-color: #d8dde1;
}
.btn-group .btn.btn-white:not(.active) + .btn.btn-white,
.input-group-btn .btn.btn-white:not(.active) + .btn.btn-white {
    border-left-color: #eee;
}


/* 3.14.3 Component - Button - Inverse */

.btn.btn-inverse {
    color: #fff;
    background: #2d353c;
    border-color: #2d353c;
}
.btn-inverse:hover, 
.btn-inverse:focus, 
.btn-inverse:active, 
.btn-inverse.active, 
.open .dropdown-toggle.btn-inverse {
    background: #242a30;
    border-color: #242a30;
}
.btn-group .btn.btn-inverse:not(.active) + .btn.btn-inverse,
.input-group-btn .btn.btn-inverse:not(.active) + .btn.btn-inverse {
    border-left-color: #242a30;
}


/* 3.14.4 Component - Button - Primary */

.btn.btn-primary {
    color: #fff;
    background: #348fe2;
    border-color: #348fe2;
}
.btn-primary:hover, 
.btn-primary:focus, 
.btn-primary:active, 
.btn-primary.active, 
.open .dropdown-toggle.btn-primary {
    background: #2a72b5;
    border-color: #2a72b5;
}
.btn-group .btn.btn-primary:not(.active) + .btn.btn-primary,
.input-group-btn .btn.btn-primary:not(.active) + .btn.btn-primary {
    border-left-color: #2a72b5;
}


/* 3.14.5 Component - Button - Success */

.btn.btn-success {
    color: #fff;
    background: #00acac;
    border-color: #00acac;
}
.btn.btn-success:hover, 
.btn.btn-success:focus, 
.btn.btn-success:active, 
.btn.btn-success.active, 
.open .dropdown-toggle.btn-success {
    background: #008a8a;
    border-color: #008a8a;
}
.btn-group .btn.btn-success:not(.active) + .btn.btn-success,
.input-group-btn .btn.btn-success:not(.active) + .btn.btn-success {
    border-left-color: #008a8a;
}


/* 3.14.6 Component - Button - Warning */

.btn.btn-warning {
    color: #fff;
    background: #f59c1a;
    border-color: #f59c1a;
}
.btn-warning:hover, 
.btn-warning:focus, 
.btn-warning:active, 
.btn-warning.active, 
.open .dropdown-toggle.btn-warning {
    background: #c47d15;
    border-color: #c47d15;
}
.btn-group .btn.btn-warning:not(.active) + .btn.btn-warning,
.input-group-btn .btn.btn-warning:not(.active) + .btn.btn-warning {
    border-left-color: #c47d15;
}


/* 3.14.7 Component - Button - Danger */

.btn.btn-danger {
    color: #fff;
    background: #ff5b57;
    border-color: #ff5b57;
}
.btn-danger:hover, 
.btn-danger:focus, 
.btn-danger:active, 
.btn-danger.active, 
.open .dropdown-toggle.btn-danger {
    background: #cc4946;
    border-color: #cc4946;
}
.btn-group .btn.btn-danger:not(.active) + .btn.btn-danger,
.input-group-btn .btn.btn-danger:not(.active) + .btn.btn-danger {
    border-left-color: #cc4946;
}


/* 3.14.8 Component - Button - Info */

.btn.btn-info {
    color: #fff;
    background: #49b6d6;
    border-color: #49b6d6;
}
.btn-info:hover, 
.btn-info:focus, 
.btn-info:active, 
.btn-info.active, 
.open .dropdown-toggle.btn-info {
    background: #3a92ab;
    border-color: #3a92ab;
}
.btn-group .btn.btn-info:not(.active) + .btn.btn-info,
.input-group-btn .btn.btn-info:not(.active) + .btn.btn-info {
    border-left-color: #3a92ab;
}


/* 3.15 Component - Panel */

.panel {
    border: none;
    -webkit-box-shadow: none;
    box-shadow: none;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.panel.panel-no-rounded-corner .panel-heading,
.panel.panel-no-rounded-corner .panel-body,
.panel.panel-no-rounded-corner .panel-footer {
    -webkit-border-radius: 0 !important;
    -moz-border-radius: 0 !important;
    border-radius: 0 !important;
}
.panel-heading {
    padding: 10px 15px;
    border: none;
}
.panel-heading + .table,
.panel-heading + .slimScrollDiv {
    border-top: 1px solid #eee;
}
.panel-heading-btn {
    float: right;
}
.panel-heading-btn > a {
    margin-left: 8px;
}
.panel-heading .btn-group .btn {
    margin-top: -7px;
}
.panel-heading .btn-group .btn.btn-sm {
    margin-top: -5px;
}
.panel-heading .btn-group .btn.btn-xs {
    margin-top: -1px;
}
.panel-heading .label.pull-left,
.panel-heading .label.pull-right {
    line-height: 15px;
}
.panel-heading .progress.pull-right,
.panel-heading .progress.pull-left {
    width: 40%;
    min-width: 120px;
}
.panel-heading + .alert {
    margin-bottom: 0;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.panel-with-tabs.panel-default .panel-heading {
    background: #c1ccd1;
    color: #333;
}
.panel-heading .nav-tabs {
    margin-top: -10px;
    margin-right: -15px;
}
.panel-heading .nav-tabs > li > a {
    padding: 10px 15px;
    line-height: 20px;
}
.panel-title {
    line-height: 20px;
    font-size: 12px;
}
.panel-title .accordion-toggle {
    margin: -10px -15px;
    padding: 10px 15px;
}
.panel-title .accordion-toggle.accordion-toggle-styled .fa:before {
    content: '\f056';
}
.panel-title .accordion-toggle.accordion-toggle-styled.collapsed .fa:before {
    content: '\f055';
}
.panel-title .pull-right {
    line-height: 20px;
}
.panel-toolbar {
    border-top: 1px solid #eee;
    border-bottom: 1px solid #eee;
    padding: 10px 15px;
    background: #fff;
}
.panel-toolbar + .form-control {
    margin: -1px 0 0;
    border-right: none;
    border-left: none;
}
.panel-group .panel {
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.form-control + .panel-footer {
    border-top: none;
}
.panel-body {
    padding: 15px;
}
.panel-body.no-border {
    border: none !important;
}
.panel-body.panel-table,
.panel-body.panel-form,
.panel-body.no-padding,
.panel-body.panel-full-width {
    padding: 0 !important;
}
.panel-body.with-table > .table {
    border: 0;
    margin: 0;
}
.panel-body.with-table > .table tr:last-child th,
.panel-body.with-table > .table tr:last-child td{
    border-bottom: 0;
}
.panel-default > .panel-heading + .panel-collapse .panel-body {
    border-top: 1px solid #eee;
}
.panel-footer {
    background: #fff;
    border-top: 1px solid #eee;
}
.panel .tab-content {
    -webkit-border-radius: 0 0 3px 3px;
    -moz-border-radius: 0 0 3px 3px;
    border-radius: 0 0 3px 3px;
}
.panel-default > .panel-heading {
    background: #fafafa;
}
.panel-inverse > .panel-heading,
.panel-success > .panel-heading,
.panel-warning > .panel-heading,
.panel-danger > .panel-heading,
.panel-primary > .panel-heading,
.panel-info > .panel-heading {
    color: #fff;
}
.panel-inverse > .panel-heading { background: #242a30; }
.panel-success > .panel-heading { background: #008a8a; }
.panel-warning > .panel-heading { background: #c47d15; }
.panel-danger > .panel-heading { background: #cc4946; }
.panel-primary > .panel-heading { background: #2a72b5; }
.panel-info > .panel-heading { background: #3a92ab; }


/* 3.16.Component - Panel - Panel Expand */

.panel.panel-expand {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: 0;
    overflow: hidden;
    z-index: 1080;
}
.panel-expand .height-xs,
.panel-expand .height-sm,
.panel-expand .height-md,
.panel-expand .height-lg,
.panel-expand .height-full {
    height: 100% !important;
}
@keyframes panelExpand {
    from { top: 50%; left: 50%; right: 50%; bottom: 50%; }
    to { top: 0; left: 0; right: 0; bottom: 0; }
}
@-webkit-keyframes panelExpand {
    from { top: 50%; left: 50%; right: 50%; bottom: 50%; }
    to { top: 0; left: 0; right: 0; bottom: 0; }
}
.panel.panel-expand > .panel-heading .fa.fa-expand:before {
    content: '\f066';
}
.panel.panel-expand,
.panel.panel-expand > .panel-heading,
.panel.panel-expand > .panel-body {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.panel.panel-expand > .panel-body {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 0;
    top: 40px;
    overflow-y: scroll;
    z-index: 1020;
}
.panel.panel-expand > .panel-footer {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
}


/* 3.17 Component - Panel - Panel loading */

.panel.panel-loading .panel-body {
    position: relative;
    z-index: 0;
}
.panel.panel-loading.panel-expand .panel-body {
    position: absolute;
}
.panel.panel-loading .panel-body .panel-loader {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fff;
    opacity: 0.9;
    filter: alpha(opacity=90);
    animation: fadeIn .2s;
    -webkit-animation: fadeIn .2s;
    z-index: 1020;
    -webkit-border-radius: 0 0 4px 4px;
    -moz-border-radius: 0 0 4px 4px;
    border-radius: 0 0 4px 4px;
}
@keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}
@-webkit-keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
}


/* 3.18 Component - Modal Setting */

.modal-content {
    border: none;
    -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
}
.modal-header {
    padding: 12px 15px;
    border-bottom-color: #e2e7eb;
}
.modal-header .close {
    margin-top: 2px;
}
.modal-body {
    padding: 15px;
}
.modal-footer {
    border-top-color: #e2e7eb;
    padding: 14px 15px 15px;
}

.modal-message .modal-dialog {
    width: 100%;
}
.modal-message .modal-content {
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}
.modal-message .modal-header,
.modal-message .modal-body,
.modal-message .modal-footer {
    width: 60%;
    border: none;
    margin: 0 auto;
}
.modal-backdrop.fade.in {
    opacity: 0.5;
    filter: alpha(opacity=50);
}



/* -------------------------------
   4.0 Predefined CSS Setting
------------------------------- */

/* 4.1 Predefined Classes */

.row { margin: 0 -10px; }
.row > [class*="col-"] {  padding: 0 10px; }

.row.row-space-0 { margin: 0; }
.row.row-space-2 { margin: 0 -1px; }
.row.row-space-4 { margin: 0 -2px; }
.row.row-space-6 { margin: 0 -3px; }
.row.row-space-8 { margin: 0 -4px; }
.row.row-space-10 { margin: 0 -5px; }
.row.row-space-12 { margin: 0 -6px; }
.row.row-space-14 { margin: 0 -7px; }
.row.row-space-16 { margin: 0 -8px; }
.row.row-space-18 { margin: 0 -9px; }
.row.row-space-18 { margin: 0 -10px; }
.row.row-space-22 { margin: 0 -11px; }
.row.row-space-24 { margin: 0 -12px; }
.row.row-space-26 { margin: 0 -13px; }
.row.row-space-28 { margin: 0 -14px; }
.row.row-space-30 { margin: 0 -15px; }
.row.row-space-0 > [class*="col-"] {  padding: 0; }
.row.row-space-2 > [class*="col-"] {  padding: 0 1px; }
.row.row-space-4 > [class*="col-"] {  padding: 0 2px; }
.row.row-space-6 > [class*="col-"] {  padding: 0 3px; }
.row.row-space-8 > [class*="col-"] {  padding: 0 4px; }
.row.row-space-10 > [class*="col-"] {  padding: 0 5px; }
.row.row-space-12 > [class*="col-"] {  padding: 0 6px; }
.row.row-space-14 > [class*="col-"] {  padding: 0 7px; }
.row.row-space-16 > [class*="col-"] {  padding: 0 8px; }
.row.row-space-18 > [class*="col-"] {  padding: 0 9px; }
.row.row-space-20 > [class*="col-"] {  padding: 0 10px; }
.row.row-space-22 > [class*="col-"] {  padding: 0 11px; }
.row.row-space-24 > [class*="col-"] {  padding: 0 12px; }
.row.row-space-26 > [class*="col-"] {  padding: 0 13px; }
.row.row-space-28 > [class*="col-"] {  padding: 0 14px; }
.row.row-space-30 > [class*="col-"] {  padding: 0 15px; }

.semi-bold { font-weight: 600; }

.overflow-auto { overflow: auto !important; }
.overflow-hidden { overflow: hidden !important; }
.overflow-visible { overflow: visible !important; }
.overflow-scroll { overflow: scroll !important; }
.overflow-x-hidden { overflow-x: hidden !important; }
.overflow-x-visible { overflow-x: visible !important; }
.overflow-x-scroll { overflow-x: scroll !important; }
.overflow-y-hidden { overflow-y: hidden !important; }
.overflow-y-visible { overflow-y: visible !important; }
.overflow-y-scroll { overflow-y: scroll !important; }

.m-auto { margin: 0 auto !important; }
.m-0 { margin: 0px !important; }
.m-1 { margin: 1px !important; }
.m-2 { margin: 2px !important; }
.m-3 { margin: 3px !important; }
.m-4 { margin: 4px !important; }
.m-5 { margin: 5px !important; }
.m-10 { margin: 10px !important; }
.m-15 { margin: 15px !important; }
.m-20 { margin: 20px !important; }
.m-25 { margin: 25px !important; }
.m-30 { margin: 30px !important; }
.m-35 { margin: 35px !important; }
.m-40 { margin: 40px !important; }

.m-t-0 { margin-top: 0px !important; }
.m-t-1 { margin-top: 1px !important; }
.m-t-2 { margin-top: 2px !important; }
.m-t-3 { margin-top: 3px !important; }
.m-t-4 { margin-top: 4px !important; }
.m-t-5 { margin-top: 5px !important; }
.m-t-10 { margin-top: 10px !important; }
.m-t-15 { margin-top: 15px !important; }
.m-t-20 { margin-top: 20px !important; }
.m-t-25 { margin-top: 25px !important; }
.m-t-30 { margin-top: 30px !important; }
.m-t-35 { margin-top: 35px !important; }
.m-t-40 { margin-top: 40px !important; }

.m-r-0 { margin-right: 0px !important; }
.m-r-1 { margin-right: 1px !important; }
.m-r-2 { margin-right: 2px !important; }
.m-r-3 { margin-right: 3px !important; }
.m-r-4 { margin-right: 4px !important; }
.m-r-5 { margin-right: 5px !important; }
.m-r-10 { margin-right: 10px !important; }
.m-r-15 { margin-right: 15px !important; }
.m-r-20 { margin-right: 20px !important; }
.m-r-25 { margin-right: 25px !important; }
.m-r-30 { margin-right: 30px !important; }
.m-r-35 { margin-right: 35px !important; }
.m-r-40 { margin-right: 40px !important; }

.m-b-0 { margin-bottom: 0px !important; }
.m-b-1 { margin-bottom: 1px !important; }
.m-b-2 { margin-bottom: 2px !important; }
.m-b-3 { margin-bottom: 3px !important; }
.m-b-4 { margin-bottom: 4px !important; }
.m-b-5 { margin-bottom: 5px !important; }
.m-b-10 { margin-bottom: 10px !important; }
.m-b-15 { margin-bottom: 15px !important; }
.m-b-20 { margin-bottom: 20px !important; }
.m-b-25 { margin-bottom: 25px !important; }
.m-b-30 { margin-bottom: 30px !important; }
.m-b-35 { margin-bottom: 35px !important; }
.m-b-40 { margin-bottom: 40px !important; }

.m-l-0 { margin-left: 0px !important; }
.m-l-1 { margin-left: 1px !important; }
.m-l-2 { margin-left: 2px !important; }
.m-l-3 { margin-left: 3px !important; }
.m-l-4 { margin-left: 4px !important; }
.m-l-5 { margin-left: 5px !important; }
.m-l-10 { margin-left: 10px !important; }
.m-l-15 { margin-left: 15px !important; }
.m-l-20 { margin-left: 20px !important; }
.m-l-25 { margin-left: 25px !important; }
.m-l-30 { margin-left: 30px !important; }
.m-l-35 { margin-left: 35px !important; }
.m-l-40 { margin-left: 40px !important; }

.p-0 { padding: 0px !important; }
.p-1 { padding: 1px !important; }
.p-2 { padding: 2px !important; }
.p-3 { padding: 3px !important; }
.p-4 { padding: 4px !important; }
.p-5 { padding: 5px !important; }
.p-10 { padding: 10px !important; }
.p-15, .wrapper { padding: 15px !important; }
.p-20 { padding: 20px !important; }
.p-25 { padding: 25px !important; }
.p-30 { padding: 30px !important; }
.p-35 { padding: 35px !important; }
.p-40 { padding: 40px !important; }

.p-t-0 { padding-top: 0px !important; }
.p-t-1 { padding-top: 1px !important; }
.p-t-2 { padding-top: 2px !important; }
.p-t-3 { padding-top: 3px !important; }
.p-t-4 { padding-top: 4px !important; }
.p-t-5 { padding-top: 5px !important; }
.p-t-10 { padding-top: 10px !important; }
.p-t-15 { padding-top: 15px !important; }
.p-t-20 { padding-top: 20px !important; }
.p-t-25 { padding-top: 25px !important; }
.p-t-30 { padding-top: 30px !important; }
.p-t-35 { padding-top: 35px !important; }
.p-t-40 { padding-top: 40px !important; }

.p-r-0 { padding-right: 0px !important; }
.p-r-1 { padding-right: 1px !important; }
.p-r-2 { padding-right: 2px !important; }
.p-r-3 { padding-right: 3px !important; }
.p-r-4 { padding-right: 4px !important; }
.p-r-5 { padding-right: 5px !important; }
.p-r-10 { padding-right: 10px !important; }
.p-r-15 { padding-right: 15px !important; }
.p-r-20 { padding-right: 20px !important; }
.p-r-25 { padding-right: 25px !important; }
.p-r-30 { padding-right: 30px !important; }
.p-r-35 { padding-right: 35px !important; }
.p-r-40 { padding-right: 40px !important; }

.p-b-0 { padding-bottom: 0px !important; }
.p-b-1 { padding-bottom: 1px !important; }
.p-b-2 { padding-bottom: 2px !important; }
.p-b-3 { padding-bottom: 3px !important; }
.p-b-4 { padding-bottom: 4px !important; }
.p-b-5 { padding-bottom: 5px !important; }
.p-b-10 { padding-bottom: 10px !important; }
.p-b-15 { padding-bottom: 15px !important; }
.p-b-20 { padding-bottom: 20px !important; }
.p-b-25 { padding-bottom: 25px !important; }
.p-b-30 { padding-bottom: 30px !important; }
.p-b-35 { padding-bottom: 35px !important; }
.p-b-40 { padding-bottom: 40px !important; }

.p-l-0 { padding-left: 0px !important; }
.p-l-1 { padding-left: 1px !important; }
.p-l-2 { padding-left: 2px !important; }
.p-l-3 { padding-left: 3px !important; }
.p-l-4 { padding-left: 4px !important; }
.p-l-5 { padding-left: 5px !important; }
.p-l-10 { padding-left: 10px !important; }
.p-l-15 { padding-left: 15px !important; }
.p-l-20 { padding-left: 20px !important; }
.p-l-25 { padding-left: 25px !important; }
.p-l-30 { padding-left: 30px !important; }
.p-l-35 { padding-left: 35px !important; }
.p-l-40 { padding-left: 40px !important; }

.f-s-8 { font-size: 8px !important; }
.f-s-9 { font-size: 9px !important; }
.f-s-10 { font-size: 10px !important; }
.f-s-11 { font-size: 11px !important; }
.f-s-12 { font-size: 12px !important; }
.f-s-13 { font-size: 13px !important; }
.f-s-14 { font-size: 14px !important; }
.f-s-15 { font-size: 15px !important; }
.f-s-16 { font-size: 16px !important; }
.f-s-17 { font-size: 17px !important; }
.f-s-18 { font-size: 18px !important; }
.f-s-19 { font-size: 19px !important; }
.f-s-20 { font-size: 20px !important; }

a.text-inverse:hover,
a.text-inverse:focus { 
    color: #575d63 !important; 
}
.text-success { color: #00acac !important; }
a.text-success:hover,
a.text-success:focus { 
    color: #33bdbd !important; 
}
.text-info { color: #49b6d6 !important; }
a.text-info:hover,
a.text-info:focus { 
    color: #6dc5de !important; 
}
.text-primary { color: #348fe2 !important; }
a.text-primary:hover,
a.text-primary:focus { 
    color: #5da5e8 !important; 
}
.text-warning { color: #f59c1a !important; }
a.text-warning:hover,
a.text-warning:focus { 
    color: #f7b048 !important; 
}
.text-danger { color: #ff5b57 !important; }
a.text-danger:hover,
a.text-danger:focus { 
    color: #ff7c79 !important; 
}
.text-white { color: #fff !important; }
a.text-white:hover,
a.text-white:focus { 
    color: #f0f3f4 !important; 
}


.fade {
    opacity: 0;
    -webkit-transition: opacity .3s linear;
    transition: opacity .3s linear;
}
.text-ellipsis {
    white-space: nowrap !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
}
.underline {
    border-bottom: 1px solid #e2e7eb !important;
}


/* -------------------------------
   5.0 Plugins Setting
------------------------------- */

/*  5.1 Plugins - jQuery Draggable */

.row > [class*="col-"].ui-sortable {
    min-height: 50px;
}
.theme-panel [class*="col-"].ui-sortable,
.panel [class*="col-"].ui-sortable {
    min-height: 0px;
}


/* 6.7 Page - Login */
	    
.login {
    margin: 168px 0;
    position: relative;
}
.login label {
    color: #707478;
}
.login .login-header {
    position: absolute;
    top: -80px;
    left: 50%;
    right: 0;
    width: 450px;
    padding: 0 40px;
    margin-left: -225px;
    font-weight: 300;
}
.login .login-header .brand {
    padding: 0;
    font-size: 28px;
}
.login .login-header .brand .logo {
    border: 14px solid transparent;
    border-color: #4DCACA #31A3A3 #1D8888;
    width: 28px;
    height: 28px;
    position: relative;
    font-size: 0;
    margin-right: 10px;
    top: -9px;
}
.login .login-header .brand small {
    font-size: 14px;
    display: block;
}
.login .login-header .icon {
    position: absolute;
    right: 40px;
    top: -2px;
    opacity: 0.1;
    filter: alpha(opacity=10);
}
.login .login-header .icon i {
    font-size: 70px;
}
.login .login-content {
    padding: 30px 40px;
    color: #999;
    width: 450px;
    margin: 0 auto;
}




/*  8.7 Login Page V2 */

.login-v2 {
    background: url(../img/transparent/black-0.4.png);
    background: rgba(0,0,0,0.4);
    color: #ccc;
    width: 450px;
    margin: 168px auto;
    position: relative;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}
.login-v2 .login-content {
    padding: 40px;
}   
.login.login-v2 label {
    color: #ccc;
}
.login.login-v2 a {
    color: #fff;
}
.login.login-v2 .login-header {
    color: #fff;
}
.login.login-v2 .login-header .icon {
    opacity: 0.4;
    filter: alpha(opacity=40);
}
.login-v2 .form-control {
    background: url(../img/transparent/black-0.4.png);
    background: rgba(0,0,0,0.4);
    border: none;
    color: #fff;
}
.login-cover,
.login-cover-bg,
.login-cover-image {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
}
.login-cover-image img {
    max-width: 100%;
    top: 0;
    left: 0;
    position: absolute;
}
.login-cover-bg {
    background: #666666; /* Old browsers */
    background: -moz-radial-gradient(center, ellipse cover,  #666666 0%, #000000 100%); /* FF3.6+ */
    background: -webkit-gradient(radial, center center, 0px, center center, 100%, color-stop(0%,#666666), color-stop(100%,#000000)); /* Chrome,Safari4+ */
    background: -webkit-radial-gradient(center, ellipse cover,  #666666 0%,#000000 100%); /* Chrome10+,Safari5.1+ */
    background: -o-radial-gradient(center, ellipse cover,  #666666 0%,#000000 100%); /* Opera 12+ */
    background: -ms-radial-gradient(center, ellipse cover,  #666666 0%,#000000 100%); /* IE10+ */
    background: radial-gradient(ellipse at center,  #666666 0%,#000000 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#666666', endColorstr='#000000',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    opacity: 0.6;
    filter: alpha(opacity=60);
}
.login-bg-list {
    position: absolute;
    right: 20px;
    bottom: 20px;
    z-index: 1020;
    list-style-type: none;
    margin: 0;
    padding: 0 0 0 20px;
}
.login-bg-list > li {
    width: 80px;
    height: 60px;
    overflow: hidden;
    float: left;
    transition: all .2s linear;
    -webkit-transition:  all .2s linear;
}
.login-bg-list > li a {
    display: block;
    height: 60px;
}
.login-bg-list > li.active {
    outline: 3px solid #fff;
    z-index: 1020;
    position: relative;
}
.login-bg-list > li img {
    max-height: 100%;
}





/* 13.6 Login & Register Page with News Feed Setting */

.login.login-with-news-feed,
.register.register-with-news-feed {
    width: 100%;
    margin: 0;
    padding: 0;
}
.login.login-with-news-feed .news-feed,
.register.register-with-news-feed .news-feed {
    position: fixed;
    left: 0;
    right: 500px;
    top: 0;
    bottom: 0;
    -webkit-transform: translateZ(0);
    overflow: hidden;
}
.login.login-with-news-feed .news-image,
.register.register-with-news-feed .news-image {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    top: 0;
}
.login.login-with-news-feed .news-image img,
.register.register-with-news-feed .news-image img {
    position: absolute;
    right: 0;
    top: 0;
    left: 0;
    bottom: 0;
    max-height: 100%;
    min-width: 100%;
    top: -1960px;
    bottom: -1960px;
    left: -1960px;
    right: -1960px;
    margin: auto;
}
.login.login-with-news-feed .news-caption,
.register.register-with-news-feed .news-caption {
    background: rgba(255,255,255,0.15);
    background: rgba(0, 0, 0, 0.7);
    color: #999;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 30px 60px;
    font-size: 14px;
    z-index: 20;
    font-weight: 300;
    min-width: 680px;
}
.login.login-with-news-feed .news-caption .caption-title,
.register.register-with-news-feed .news-caption .caption-title {
    color: #fff;
    color: rgba(255,255,255,0.8);
    font-weight: 300;
    font-size: 28px;
}
.login.login-with-news-feed .right-content,
.register.register-with-news-feed .right-content {
    float: right;
    width: 500px;
}
.login.login-with-news-feed .login-content,
.register.register-with-news-feed .register-content {
    width: auto;
    padding: 30px 60px;
}
.register.register-with-news-feed .register-content {
    padding: 20px 60px 30px;
}
.login.login-with-news-feed .login-header,
.register.register-with-news-feed .register-header {
    position: relative;
    top: 0;
    margin: 0;
    left: 0;
    right: 0;
    padding: 100px 60px 0;
}
.register.register-with-news-feed .register-header {
    padding: 60px 60px 0;
    font-size: 32px;
}
.register.register-with-news-feed .register-header small {
    color: #707478;
    display: block;
    font-size: 14px;
    margin-top: 10px;
    line-height: 20px;
}
.login.login-with-news-feed .login-header .brand {
    color: #242a30;
}
.login.login-with-news-feed .login-header .brand small {
    color: #707478;
}
.login.login-with-news-feed .login-header .icon {
    top: 98px;
    right: 10px;
}