/*******************************
11.0 - MAIN
*******************************/
    .main {
        position: relative;
        padding-top: 50px;
        padding-bottom: 50px;
    }
    
/* ----- CONTENT ----- */
    .dashboard {
        overflow: hidden;
    }
    
    .dashboard .container-fluid {
        padding: 10px 15px;
    }
    
/* ----- PAGE TITLE ----- */
    .page-title h1 {
        position: relative;
        margin: 0;
        padding: 6px 14px;
        font-size: 22px;
        line-height: 30px;
        text-transform: uppercase;
    }
    
    .page-title h1:after {
        bottom: -3px;
        content: "";
        height: 10px;
        left: 25px;
        margin-left: -1px;
        position: absolute;
        -webkit-transform: rotate(45deg);
        -moz-transform:    rotate(45deg);
        -ms-transform:     rotate(45deg);
        -o-transform:      rotate(45deg);
        width: 10px;
    }
    
    h1 small {
        font-weight: 300;
        text-transform: none;
    }
        
/* ----- CANCELS ----- */
    .no-margin-top {
        margin-top: 0 !important;
    }
    
    .no-margin-bottom {
        margin-bottom: 0 !important;
    }        
    
/*******************************
12.0 - GRID
*******************************/
    .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1,
    .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2,
    .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3,
    .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4,
    .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5,
    .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6,
    .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7,
    .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8,
    .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9,
    .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10,
    .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11,
    .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
        padding-left: 10px;
        padding-right: 10px;
    }
    
    .container-fluid {
        padding-top: 20px;
        padding-left: 20px;
        padding-right: 20px;
    }
    
    .center-col {
        float: none;
        margin: 0 auto;
    }
    
    @media (max-width: 767px) {
        .container-fluid {
            padding-top: 20px;
            padding-left: 10px;
            padding-right: 10px;
        }
    }
    
/*******************************
13.0 - PANES
*******************************/
    .pane {
        margin-bottom: 20px;
        padding: 15px;
    }
    
    .container-fluid.white .pane {
        border: none;
    }
    
    @media (max-width: 767px) {
        .pane {
            margin-bottom: 10px;
        }
    }
    
    .pane + .pane {
        margin-top: 30px;
    }
        
/* ----- PANE TITLES ----- */
    .pane h2 {
        position: relative;
        margin: 0 0 20px;
        height: 30px;
        border-bottom: 1px solid;
        font-weight: 300;
        font-size: 20px;
    }
    
    .pane h2 span {
        display: inline-table;
        height: 30px;
        border-bottom: 1px solid;
    }
    
    .pane h3 {
        margin: 30px 0 20px;
        padding: 0 0 10px;
        border-bottom: 1px solid;
        font-weight: 300;
        font-size: 18px;
    }
        
        .pane p:last-child {
            margin-bottom: 0;
        }
        
        
    .widget .scrollpane-container {
        position: absolute;
        width: 100%;
        height: 100%;
        padding: 8px;
    }
    
    .scrollpane {
        width: 100%;
        height: 100%;
        overflow: auto;
        outline: none;
    }
    
    .scrollpane .jspPane {
        position: absolute;
        width: 100% !important;
        margin-left: 0 !important;
    }
    
    .scrollpane .jspVerticalBar {
        position: absolute;
        top: 0;
        right: 3px;
        width: 4px;
        height: 100%;
        background-color: #fafafa;
    }
    
    .scrollpane .jspContainer {
        width: 100% !important;
        overflow: hidden;
        position: relative;
    }
    
    .scrollpane .scroll-pane {
        width: 100% !important;
        height: 100%;
    }
    
    .scrollpane .jspTrack {
        position: relative;
    }
    
    .scrollpane .jspDrag {
        position: relative;
        top: 0;
        left: 0;
        cursor: pointer;
        -moz-opacity: 0.30;
        -khtml-opacity: 0.30;
        opacity: 0.30;
        -ms-filter:"progid:DXImageTransform.Microsoft.Alpha"(Opacity=30);
        filter: progid:DXImageTransform.Microsoft.Alpha(opacity=30);
        filter:alpha(opacity=30);
        background-color: #bbb;
    }




/*******************************
16.0 - DASHBOARD WIDGETS
*******************************/
    .widget {
        /*position: absolute;*/
        width: 100%;
        height: 100%;
    }
    
    .widget-header {
        padding: 15px 15px 0;
    }
    
    .widget-content {
        padding: 8px;
    }
    
    .widget h2 {
        position: relative;
        margin: 0;
        height: 30px;
        border-bottom: 1px solid #eee;
        font-weight: 300;
        font-size: 20px;
    }
    
    .widget h2 span {
        display: inline-table;
        height: 30px;
        border-bottom: 1px solid;
    }
    
    .widget .drag {
        display: none;
        cursor: move;
        z-index: 999;
        position: absolute;
        top: 0;
        right: 0;
        padding: 10px;
        background-color: #f4f4f4;
        color: #ddd;
    }
    
    .widget:hover .drag {
        display: block;
    }
    
    .widget .drag:before {
        content: "\f047";
    }
    
    .widget .drag:hover {
        background-color: #eee;
        color: #999;
    }
    
    @media (max-width: 767px) {
        .widget:hover .drag {
            display: none;
        }
    }/*END*/
    
/* ----- SCROLLPANE ----- */
    .widget.scroll-panel .widget-content {
        padding: 0;
    }
        
/* ----- TODAY'S SALES ----- */
    .widget-sales {
        background-color: #ABB7B7;
    }
    
    .widget-sales h2 {
        border-bottom-color: #a3afaf;
        color: #fff;
    }
    
    .widget-sales h2 span {
        border-bottom-color: #fff !important;
    }
    
    .widget-sales .flot-chart {
        margin: 0;
    }
    
    .widget-sales .flot-chart .line {
        height: 395px;
    }
    
    .widget-sales .flot-chart .flot-text {
        color: #fff !important;
        font-weight: 400;
    }
        
/* ----- MINI STATISTICS ----- */
    .widget-mini-stat {
        background-repeat: no-repeat;
        background-size: cover;
    }
    
    .widget-mini-stat.new-orders {
        background-image: url('../img/core/new-order.jpg');
    }
    
    .widget-mini-stat.revenue {
        background-image: url('../img/core/revenue.jpg');
    }
    
    .widget-mini-stat.in-cart {
        background: #F4D03F
    }
    
    .widget-mini-stat.cancelled {
        background: #D24D57
    }
    
    .widget-mini-stat .widget-content {
        padding: 0;
    }
    
/*Text*/
    .widget-mini-stat .mini-details {
        position: absolute;
        width: 100%;
        padding: 10px;
    }
    
    .widget-mini-stat.normal .mini-details .mini-title,
    .widget-mini-stat.normal .mini-details .mini-count {
        text-shadow: none;
        color: #fff;
    }
    
    .widget-mini-stat .mini-details .mini-title,
    .widget-mini-stat .mini-details .mini-count {
        cursor: default;
        text-shadow: 1px 1px 1px rgba(255, 255, 255, 1);
        color: #000;
    }
    
    .widget-mini-stat .mini-details .mini-title {
        display: block;
        margin-bottom: 5px;
        font-weight: 400;
        font-size: 1.1em;
    }
    
    .widget-mini-stat .mini-details .mini-count {
        font-size: 3em;
    }
    
/*Chart*/
    .widget-mini-stat .flot-chart {
        position: absolute;
        width: 100%;
        bottom: 0;
    }

    .widget-mini-stat .flot-chart .line {
        height: 160px;
    }
    
    .widget-mini-stat .flot-chart .flot-text {
        display: none;
    }
    
/* ----- SOCIAL CAROUSEL ----- */
    .widget-social-carousel .widget-content {
        padding: 5px;
    }
    
    .social-stats .owl-controls {
        position: absolute;
        z-index: 100;
        bottom: 0;
        left: 0;
        margin: 0 !important;
        -moz-opacity: 0.40;
        -khtml-opacity: 0.40;
        opacity: 0.40;
    }
    
    .social-stats .owl-controls .owl-nav [class*=owl-] {
        margin: 0 !important;
        background-color: #fff !important;
    }
    
    .social-stats .owl-carousel .owl-item {
        background: none;
        -webkit-backface-visibility: visible;
    }
    
    .social-stats .social {
        overflow: hidden;
        position: relative;
        min-height: 100px;
        -moz-opacity: 0.90;
        -khtml-opacity: 0.90;
        opacity: 0.90;
        -webkit-backface-visibility: hidden;
    }
    
    .social-stats .social:hover {
        -moz-opacity: 1;
        -khtml-opacity: 1;
        opacity: 1;
    }
    
    .social-stats .social-title {
        position: absolute;
        z-index: 2;
        top: 15px;
        left: 12px;
        font-size: 16px;
        color: #fff;
    }
    
    .social-stats .social-count {
        position: absolute;
        z-index: 2;
        bottom: 0;
        left: 0;
        margin: 0 0 10px 10px;
        font-size: 3em;
        color: #fff;
    }
    
    .social-stats .social-count small {
        font-size: 14px;
    }

    .social-stats .social-count a {
        color: #fff;
        cursor:pointer;
    }

    .social-stats .social-count span {
        color: #fff;
    }
    
    .social-stats .social .social-icon {
        position: absolute;
        z-index: 1;
        right: -2px;
        top: -10px;
        font-size: 10em;
        color: #fff;
        -moz-opacity: 0.20;
        -khtml-opacity: 0.20;
        opacity: 0.20;
        -ms-transform: rotate(30deg);
        -webkit-transform: rotate(30deg);
        transform: rotate(30deg);
        -webkit-transition: opacity 0.3s linear, transform 0.3s ease-out;
           -moz-transition: opacity 0.3s linear, transform 0.3s ease-out;
             -o-transition: opacity 0.3s linear, transform 0.3s ease-out;
                transition: opacity 0.3s linear, transform 0.3s ease-out;
    }

        .social-stats .social .social-icon-inverse {
        position: absolute;
        z-index: 1;
        right: -2px;
        top: -10px;
        font-size: 10em;
        color: #fff;
        -moz-opacity: 0.20;
        -khtml-opacity: 0.20;
        opacity: 0.20;
        -ms-transform: rotate(345deg);
        -webkit-transform: rotate(345deg);
        transform: rotate(345deg);
        -webkit-transition: opacity 0.3s linear, transform 0.3s ease-out;
           -moz-transition: opacity 0.3s linear, transform 0.3s ease-out;
             -o-transition: opacity 0.3s linear, transform 0.3s ease-out;
                transition: opacity 0.3s linear, transform 0.3s ease-out;
    }
    
    .social-stats .social:hover .social-icon {
        -moz-opacity: 0.60;
        -khtml-opacity: 0.60;
        opacity: 0.60;
        -ms-transform: rotate(25deg);
        -webkit-transform: rotate(25deg);
        transform: rotate(25deg);
    }

    .social-stats .social:hover .social-icon-inverse {
        -moz-opacity: 0.60;
        -khtml-opacity: 0.60;
        opacity: 0.60;
        -ms-transform: rotate(340deg);
        -webkit-transform: rotate(340deg);
        transform: rotate(340deg);
    }
    
    .social.twitter {background-color: #63cdf1;}
    .social.facebook {background-color: #507cbe;}
    .social.youtube {background-color: #f16261;}
    .social.google-plus {background-color: #DB5952;}
    .social.linkedin {background-color: #0274B3;}
    .social.dribbble {background-color: #F26798;}
    .social.good {background-color: #3fb136;}
    .social.warning {background-color: #cc9d03;}
    .social.warning {background-color: #cc9d03;}
    .social.AFR-Red {background-color: rgb(234,96,142);}
    .social.AFR-Blue {background-color: rgb(30,35,128);}
    
/* ----- WEBSITE STATISTICS ----- */
    .widget-website-stats .widget-content {
        padding: 0;
    }
    
    .widget-website-stats ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }
    
    .widget-website-stats ul li {
        padding: 15px 10px;
        border-bottom: 1px solid #f6f6f6;
        font-weight: 400;
        color: #999;
    }
    
    .widget-website-stats ul li span {
        font-weight: 600;
        color: #666;
    }
    
    .widget-website-stats ul li:hover {
        background-color: #fcfcfc;
    }
    
    .widget-website-stats .flot-chart {

    }
    
    .widget-website-stats .flot-chart .flot {
        position: absolute;
        bottom: 0;
        height: 145px;
    }
    
/* ----- SERVER STATUS ----- */
    .widget-server-status {
        background-color: #D2D7D3;
    }
    
    .widget-server-status .widget-content {
        padding: 0;
    }
    
    .widget-server-status .title {
        display: block;
        margin-top: 5px;
        text-align: center;
        font-size: 20px;
        color: #939b94;
    }
    
    .widget-server-status .flot-chart {
        width: 108%;
        margin-left: -8px;
    }

    .widget-server-status .flot-chart .real {
        height: 335px;
    }
    
    .widget-server-status .flot-chart .flot-text {
        display: none;
    }
    
/* ----- SOCIAL STATISTICS ----- */
    .widget-social-stats .flot-chart .pie {
        height: 275px;
    }