body {
   /* background-color: #E4E6E9; */
    padding-bottom: 0;
    font-family: 'Open Sans';
    font-size: 13px;
    color: #393939;
    line-height: 1.5;
}

.crud {

    background:#fff;
    padding:25px;
}

.crudPanel {
 padding-left:10px;
 padding-top:0px;
 height:580px;
 background:#fff;
}

.crudBtnrow {

 padding-top:10px;

}

.crudView {
 padding:25px;
 background:#fff;
 overflow-y: scroll;


}


/*
body {
    padding-bottom: 0;
    min-height: 100%;
    font-family: 'Open Sans', 'Segoe UI';
    font-size: 13px;
    color: #444
}
body:before {
    content: "";
    display: block;
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: -1;
    background-color: #eee
}
*/

input[type=checkbox] {
  transform: scale(1.5);
}


.loader {
  border: 16px solid #f3f3f3;
  border-radius: 50%;
  border-top: 16px solid #3498db;


            position: fixed;
            z-index: 999;
           
            overflow: show;
            margin: auto;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;






  
  width: 80px;
  height: 80px;
  -webkit-animation: spin 2s linear infinite;
  animation: spin 2s linear infinite;
}

@-webkit-keyframes spin {
  0% { -webkit-transform: rotate(0deg); }
  100% { -webkit-transform: rotate(360deg); }
}

@keyframes spin {
  0% { transform: rotate(0deg); }
  100% { transform: rotate(360deg); }
}

.loading {
            position: fixed;
            z-index: 999;
            height: 2em;
            width: 2em;
            overflow: show;
            margin: auto;
            top: 0;
            left: 0;
            bottom: 0;
            right: 0;
        }
        /* Transparent Overlay */
        
        .loading:before {
            content: '';
            display: block;
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: rgba(0, 0, 0, 0.3);
        }

         .loading:not(:required) {
            /* hide "loading..." text */
            font: 0/0 a;
            color: transparent;
            text-shadow: none;
            background-color: transparent;
            border: 0;
        }
        
        .loading:not(:required):after {
            content: '';
            display: block;
            font-size: 10px;
            width: 1em;
            height: 1em;
            margin-top: -0.5em;
            -webkit-animation: spinner 1500ms infinite linear;
            -moz-animation: spinner 1500ms infinite linear;
            -ms-animation: spinner 1500ms infinite linear;
            -o-animation: spinner 1500ms infinite linear;
            animation: spinner 1500ms infinite linear;
            border-radius: 0.5em;
            -webkit-box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.5) -1.5em 0 0 0, rgba(0, 0, 0, 0.5) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
            box-shadow: rgba(0, 0, 0, 0.75) 1.5em 0 0 0, rgba(0, 0, 0, 0.75) 1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) 0 1.5em 0 0, rgba(0, 0, 0, 0.75) -1.1em 1.1em 0 0, rgba(0, 0, 0, 0.75) -1.5em 0 0 0, rgba(0, 0, 0, 0.75) -1.1em -1.1em 0 0, rgba(0, 0, 0, 0.75) 0 -1.5em 0 0, rgba(0, 0, 0, 0.75) 1.1em -1.1em 0 0;
        }
        /* Animation */
        
        @-webkit-keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }
        
        @-moz-keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }
        
        @-o-keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }
        
        @keyframes spinner {
            0% {
                -webkit-transform: rotate(0deg);
                -moz-transform: rotate(0deg);
                -ms-transform: rotate(0deg);
                -o-transform: rotate(0deg);
                transform: rotate(0deg);
            }
            100% {
                -webkit-transform: rotate(360deg);
                -moz-transform: rotate(360deg);
                -ms-transform: rotate(360deg);
                -o-transform: rotate(360deg);
                transform: rotate(360deg);
            }
        }
        
        .swiper-container {
            width: 100%;
            height: 100%;
        }
        
        .swiper-slide {
            text-align: center;
            font-size: 18px;
            background: #fff;
            /* Center slide text vertically */
            display: -webkit-box;
            display: -ms-flexbox;
            display: -webkit-flex;
            display: flex;
            -webkit-box-pack: center;
            -ms-flex-pack: center;
            -webkit-justify-content: center;
            justify-content: center;
            -webkit-box-align: center;
            -ms-flex-align: center;
            -webkit-align-items: center;
            align-items: center;
        }

.login-container {
    position: relative;
    margin: 10% auto;
    max-width: 300px
}
.login-container .loginbox {
    position: relative;
    width: 300px!important;
    height: 400px!important;
    padding: 0;
    -webkit-box-shadow: 0 0 14px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 0 14px rgba(0, 0, 0, .1);
    box-shadow: 0 0 14px rgba(0, 0, 0, .1)
}
.login-container .loginbox .loginbox-title {
    position: relative;
    text-align: center;
    width: 100%;
    height: 35px;
    padding-top: 10px;
    font-family: 'Lucida Sans', 'trebuchet MS', Arial, Helvetica;
    font-size: 20px;
    font-weight: normal;
    color: #444
}
.login-container .loginbox .loginbox-social {
    padding: 0 10px 10px;
    text-align: center
}
.login-container .loginbox .loginbox-social .social-title {
    font-size: 14px;
    font-weight: 500;
    color: #a9a9a9;
    margin-top: 10px
}
.login-container .loginbox .loginbox-social .social-buttons {
    height: 80px;
    padding: 15px 35px;
    text-align: center
}
.login-container .loginbox .loginbox-social .social-buttons .button-facebook {
    float: left;
    border: 2px solid #3b5998;
    color: #3b5998;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    margin-right: 30px
}
.login-container .loginbox .loginbox-social .social-buttons .button-facebook i {
    font-size: 26px;
    line-height: 50px
}
.login-container .loginbox .loginbox-social .social-buttons .button-twitter {
    float: left;
    border: 2px solid #29c1f6;
    color: #29c1f6;
    border-radius: 50%;
    width: 50px;
    height: 50px;
    margin-right: 30px
}
.login-container .loginbox .loginbox-social .social-buttons .button-twitter i {
    font-size: 26px;
    line-height: 50px
}
.login-container .loginbox .loginbox-social .social-buttons .button-google {
    float: left;
    border: 2px solid #ef4f1d;
    color: #ef4f1d;
    border-radius: 50%;
    width: 50px;
    height: 50px
}
.login-container .loginbox .loginbox-social .social-buttons .button-google i {
    font-size: 26px;
    line-height: 50px
}
.login-container .loginbox .loginbox-or {
    position: relative;
    text-align: center;
    height: 20px
}
.login-container .loginbox .loginbox-or .or {
    position: absolute;
    top: 0;
    -lh-property: 0;
    left: -webkit-calc(50% - 25px);
    left: -moz-calc(50% - 25px);
    left: calc(50% - 25px);
    width: 50px;
    height: 20px;
    background-color: #fff;
    color: #999;
    margin: 0 auto
}
.login-container .loginbox .loginbox-or .or-line {
    position: absolute;
    height: 1px;
    top: 10px;
    left: 40px;
    right: 40px;
    background-color: #ccc
}
.login-container .loginbox .loginbox-textbox {
    padding: 10px 40px
}
.login-container .loginbox .loginbox-textbox .form-control {
    -webkit-border-radius: 3px!important;
    -webkit-background-clip: padding-box!important;
    -moz-border-radius: 3px!important;
    -moz-background-clip: padding!important;
    border-radius: 3px!important;
    background-clip: padding-box!important
}
.login-container .loginbox .loginbox-forgot {
    padding-left: 40px
}
.login-container .loginbox .loginbox-forgot a {
    font-size: 11px;
    color: #666
}
.login-container .loginbox .loginbox-submit {
    padding: 10px 40px
}
.login-container .loginbox .loginbox-signup {
    text-align: center;
    padding-top: 10px
}
.login-container .loginbox .loginbox-signup a {
    font-size: 13px;
    color: #666
}
.login-container .logobox {
    width: 300px!important;
    height: 50px!important;
    padding: 5px;
    margin-top: 15px;
    -webkit-box-shadow: 0 0 14px rgba(0, 0, 0, .1);
    -moz-box-shadow: 0 0 14px rgba(0, 0, 0, .1);
    box-shadow: 0 0 14px rgba(0, 0, 0, .1);
    background-color: #fff;
    text-align: left
}



body {

     /*
    background-color: #EFF3F8; 
    */
    background-color: #fff; 
}

web {
    background-color: #eff3f8;
    
}

.widget-buttons {


}

.page-body {
    background: #fff;
    padding: 18px 20px 24px
}
.widget {
    padding: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none;
    margin: 3px 0 30px 0;
	
}
.widget.collapsed .widget-body {
    display: none
}
.widget.collapsed.radius-bordered .widget-header {
    -webkit-border-radius: 3px 3px 3px 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px 3px 3px 3px;
    -moz-background-clip: padding;
    border-radius: 3px 3px 3px 3px;
    background-clip: padding-box
}
.widget.no-header .widget-header {
    display: none
}
.widget.no-header.radius-bordered .widget-body {
    -webkit-border-radius: 3px 3px 3px 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px 3px 3px 3px;
    -moz-background-clip: padding;
    border-radius: 3px 3px 3px 3px;
    background-clip: padding-box
}
.widget.maximized {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    margin: 0;
    overflow: auto
}
.widget.maximized .widget-body {
    padding: 12px 0
}
.widget.transparent .widget-header,
.widget.transparent .widget-body {
    background-color: rgba(0, 0, 0, 0);
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none
}
.widget.transparent .widget-header {
    border-bottom: 1px solid #ccc
}
.widget.bordered-top {
    border-top: 3px solid #fff
}
.widget.bordered-bottom {
    border-bottom: 3px solid #fff
}
.widget.bordered-left {
    border-left: 3px solid #fff
}
.widget.bordered-right {
    border-right: 3px solid #fff
}
.widget.radius-bordered .widget-header {
    -webkit-border-radius: 3px 3px 0 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px 3px 0 0;
    -moz-background-clip: padding;
    border-radius: 3px 3px 0 0;
    background-clip: padding-box
}
.widget.radius-bordered .widget-body {
    -webkit-border-radius: 0 0 3px 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 0 3px 3px;
    -moz-background-clip: padding;
    border-radius: 0 0 3px 3px;
    background-clip: padding-box
}
.widget.flat .widget-body,
.widget.flat .widget-header {
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow: none
}
.widget.lightshadow .widget-body,
.widget.lightshadow .widget-header {
    -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, .2);
    box-shadow: 0 1px 4px rgba(0, 0, 0, .2)
}
.widget:hover .compact {
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
    box-shadow: 0 0 20px rgba(0, 0, 0, .2)
}
.widget:hover .compact i {
    color: #2dc3e8
}
.widget-header-original {
    position: relative;
    min-height: 35px;
    background: #fff;
    -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 0 4px rgba(0, 0, 0, .3);
    box-shadow: 0 0 4px rgba(0, 0, 0, .3);
    color: #555;
    padding-left: 12px;
    text-align: right
}

.widget-header {

    text-align: right;

    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
    position: relative;
    min-height: 38px;
    background: repeat-x #f7f7f7;
     
    /* original
    background-image: -webkit-linear-gradient(top, #FFF 0, #EEE 100%);
    background-image: -o-linear-gradient(top, #FFF 0, #EEE 100%);
    background-image: linear-gradient(to bottom, #FFF 0, #EEE 100%); 
    */

    /*
    background-image: -webkit-linear-gradient(top, #eeeeee 0, #EEE 100%);
    background-image: -o-linear-gradient(top, #eeeeee 0, #EEE 100%);
    background-image: linear-gradient(to bottom, #eeeeee 0, #EEE 100%); 
      */

    

    /*
    background-image: -webkit-linear-gradient(top, #e5e5e5 0, #e5e5e5 100%);
    background-image: -o-linear-gradient(top, #e5e5e5 0, #e5e5e5 100%);
    background-image: linear-gradient(to bottom, #e5e5e5 0, #e5e5e5 100%);
    */
    
    
    filter: progid: DXImageTransform.Microsoft.gradient(startColorstr='#ffffffff', endColorstr='#ffeeeeee', GradientType=0);
    
    color: #4682B4;
    
    border-bottom: 1px solid #DDD;
    padding-left: 12px
}

.widget-header .widget-icon {
    display: block;
    width: 30px;
    height: 32px;
    position: relative;
    float: left;
    font-size: 111%;
    line-height: 32px;
    text-align: center;
    margin-left: -10px
}
.widget-header>.widget-caption {
    
    line-height: 34px;
    padding: 0;
    margin: 0;
    float: left;
    text-align: left;
    /*font-weight: 400!important;*/
    font-weight: bold!important;
    font-size: 13px
}
.widget-header.lined {
    border: 0;
    -webkit-box-shadow: none!important;
    -moz-box-shadow: none!important;
    box-shadow: none!important;
    padding-left: 2%
}
.widget-header.lined:before {
    content: "";
    position: absolute;
    display: block;
    width: 96%;
    bottom: 0;
    top: 35px;
    height: 1px;
    left: 2%;
    z-index: 1;
    border-bottom: 1px solid #e5e5e5
}
.widget-header.lined .widget-buttons {
		display: none;
    padding-right: 2%
}
.widget-header.lined+.widget-body {
    padding-left: 2%;
    padding-right: 2%
}
.widget-header.separated {
    margin-bottom: 5px
}
.widget-header[class*="bg-"] {
    border: 0
}
.widget-header[class*="bg-"] .widget-caption,
.widget-header[class*="bg-"] i {
    color: #fff
}
.widget-header.bordered-left {
    border-left: 3px solid #fff
}
.widget-header.bordered-right {
    border-right: 3px solid #fff
}
.widget-header.bordered-top {
    border-top: 3px solid #fff
}
.widget-header.bordered-bottom {
    border-bottom: 3px solid #fff
}
.widget-header.header-large {
    min-height: 49px;
    padding-left: 18px
}
.widget-header.header-large h5 {
    line-height: 48px;
    font-size: 16px
}
.widget-header.header-large>.widget-buttons {
    line-height: 48px;
    height: 48px
}
.widget-header.header-large>.widget-buttons a {
    min-width: 26px
}
.widget-header.header-large>.widget-buttons a i {
    font-size: 20px
}
.widget-header.header-small {
    min-height: 29px;
    padding-left: 10px
}
.widget-header.header-small h5 {
    line-height: 28px;
    font-size: 12px
}
.widget-header.header-small>.widget-buttons {
    line-height: 29px;
    height: 29px
}
.widget-header.header-small>.widget-buttons a {
    min-width: 16px;
    height: 16px
}
.widget-header.header-small>.widget-buttons a i {
    font-size: 14px
}
.widget-buttons {
    xdisplay: inline-block;
	display: none;
    padding: 0 5px;
    line-height: 34px;
    position: relative;
    text-align: left;
    height: 36px
}
.widget-buttons.buttons-bordered {
    border-left: 1px solid #e5e5e5
}
.widget-buttons.compact {
    margin-top: 4px;
    background-color: #f5f5f5;
    line-height: 27px;
    -webkit-transition: background-color .218s ease;
    -moz-transition: background-color .218s ease;
    -o-transition: background-color .218s ease;
    transition: background-color .218s ease;
    -webkit-transition: -webkit-box-shadow .218s ease;
    -moz-transition: -moz-box-shadow .218s ease;
    -o-transition: box-shadow .218s ease;
    transition: box-shadow .218s ease;
    -webkit-transition: color .318s ease;
    -moz-transition: color .318s ease;
    -o-transition: color .318s ease;
    transition: color .318s ease;
    height: 27px
}
.widget-buttons.compact:hover {
    background-color: #2dc3e8;
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0, .2);
    box-shadow: 0 0 20px rgba(0, 0, 0, .2)
}
.widget-buttons.compact:hover i {
    color: #fff
}
.widget-buttons.compact:before {
    display: block;
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    right: -4px;
    width: 4px;
    max-width: 4px;
    overflow: hidden;
    background-color: #2dc3e8
}
.widget-buttons.compact a {
    min-width: 14px;
    line-height: 14px
}
.widget-buttons.compact i {
    color: #ccc;
    font-size: 14px
}
.widget-buttons.no-padding {
    padding: 0
}
.widget-buttons.padding-5 {
    padding: 0 5px
}
.widget-buttons.no-border:before {
    display: none
}
.widget-buttons label {
    display: inline-block;
    vertical-align: middle;
    margin-bottom: 0;
    line-height: 6px
}
.widget-buttons>a {
    font-size: 14px;
    margin: 0 1px;
    display: inline-block;
    padding: 0;
    line-height: 24px;
    min-width: 20px;
    text-align: center
}
.widget-buttons>a:hover {
    text-decoration: none
}
.widget-buttons>a i {
    vertical-align: middle
}
.widget-buttons>[data-toggle]>.fa {
    margin-right: 0
}
.widget-buttons>[data-toggle]:hover {
    zoom: 1;
    filter: alpha(opacity=50);
    -webkit-opacity: .5;
    -moz-opacity: .5;
    opacity: .5
}
.widget-buttons>[data-toggle]:focus {
    text-decoration: none
}
.widget-buttons>[data-toggle="dispose"] {
    color: #777;
    font-size: 14px
}
.widget-buttons>[data-toggle="maximize"] {
    color: #777;
    font-size: 14px
}
.widget-buttons>[data-toggle="collapse"] {
    color: #777;
    font-size: 14px
}
.widget-buttons>[data-toggle="refresh"] {
    color: #777;
    font-size: 14px
}
.widget-buttons>[data-toggle="config"] {
    color: #777;
    font-size: 14px
}
.widget-buttons .progress {
    vertical-align: middle;
    display: inline-block;
    margin: 0;
    min-width: 100px;
    margin-top: -3px
}
.widget-buttons .btn-group {
    margin-top: -2px
}
.widget-buttons .btn-group .dropdown-menu {
    right: 0;
    left: auto
}
.widget-buttons .badge {
    margin-top: -2px
}
.widget-buttons .label {
    padding: 5px 6px 5px 6px
}
.widget-buttons .pagination,
.widget-buttons .pager {
    float: right;
    margin: 5px 2px 1px
}
.widget-buttons .btn {
    margin-top: -2px
}
.widget-body {
    background-color: #fbfbfb;
    -webkit-box-shadow: 1px 0 10px 1px rgba(0, 0, 0, .3);
    -moz-box-shadow: 1px 0 10px 1px rgba(0, 0, 0, .3);
    box-shadow: 1px 0 10px 1px rgba(0, 0, 0, .3);
    padding: 12px
}
.widget-body.bordered-left {
    border-left: 3px solid #fff
}
.widget-body.bordered-right {
    border-right: 3px solid #fff
}
.widget-body.bordered-bottom {
    border-bottom: 3px solid #fff
}
.widget-body.bordered-top {
    border-top: 3px solid #fff
}
.widget-body[class*="bg-"] {
    color: #fff
}
.widget-body.no-padding {
    padding: 0
}
.widget-body.no-padding .accordion {
    border: 0
}
.widget-body.no-padding .dataTables_filter label {
    margin: 10px
}
.widget-body.no-padding .dataTables_length {
    top: 10px;
    right: 10px
}
.widget-body.no-padding .DTTT.btn-group {
    right: 80px;
    top: 10px
}
.widget-body .accordion.panel-group {
    border-top-width: 1px!important
}
.widget-body>table {
    margin-bottom: 0
}
.widget-body hr.wide {
    margin-left: -12px;
    margin-right: -12px
}

.chart {
    height: 220px;
    margin: 5px
}
.chart-sm {
    height: 100px
}
.chart-lg {
    height: 250px
}
.chart-xl {
    height: 350px
}


.databox-container {
    text-align: center;
    font-size: 0
}
.databox {
    display: inline-block;
    width: 100%;
    height: 65px;
    padding: 0;
    font-size: 0;
    margin-bottom: 30px;
    vertical-align: top;
    min-width: 130px
}
.databox .databox-icon {
    margin: 0;
    display: inline-block;
    width: 100%;
    text-align: center
}
.databox .databox-icon>.fa,
.databox .databox-icon .typcn,
.databox .databox-icon .glyphicon,
.databox .databox-icon .wi {
    display: inline-block;
    margin: 0;
    text-align: center;
    position: relative;
    margin-top: 3px
}
.databox .databox-icon>.fa:before,
.databox .databox-icon .typcn:before,
.databox .databox-icon .glyphicon:before,
.databox .databox-icon .wi:before {
    font-size: 40px;
    display: block;
    text-align: center
}
.databox .databox-sparkline {
    padding-top: 0;
    margin: 0 auto;
    display: inline-block;
    vertical-align: bottom;
    width: 100%;
    text-align: center;
    font-size: 24px
}
.databox .databox-piechart {
    padding-top: 0;
    margin: 0 auto;
    display: inline-block;
    vertical-align: bottom;
    width: 100%;
    text-align: center;
    font-size: 14px;
    font-weight: 300
}
.databox .databox-header {
    display: block;
    font-size: 18px;
    font-family: 'Lucida Sans', 'trebuchet MS', Arial, Helvetica;
    font-weight: 400;
    margin: 8px 5px;
    position: relative
}
.databox .databox-header i {
    margin-right: 5px
}
.databox .databox-number {
    display: block;
    font-size: 17px;
    line-height: 26px;
    margin: 2px;
    position: relative;
    font-family: 'Lucida Sans', 'trebuchet MS', Arial, Helvetica;
    font-weight: 700
}
.databox .databox-number i {
    margin-right: 5px
}
.databox .databox-number.number-xs {
    font-size: 11px
}
.databox .databox-number.number-sm {
    font-size: 14px
}
.databox .databox-number.number-lg {
    font-size: 20px
}
.databox .databox-number.number-xlg {
    font-size: 23px
}
.databox .databox-number.number-xxlg {
    font-size: 30px
}
.databox .databox-title {
    display: block;
    font-size: 16px;
    font-weight: 300;
    margin: 2px;
    position: relative
}
.databox .databox-title i {
    margin-right: 5px;
    font-size: 13px
}
.databox .databox-text {
    display: block;
    font-size: 11px;
    margin: 4px 0 2px;
    position: relative
}
.databox .databox-text i {
    margin-right: 5px;
    font-size: 13px
}
.databox .databox-inlinetext {
    font-size: 11px;
    margin: 2px;
    position: relative
}
.databox .databox-inlinetext i {
    margin-right: 5px;
    font-size: 13px
}
.databox .databox-stat {
    display: inline-block;
    position: absolute;
    right: 7px;
    top: 7px;
    padding: 2px 5px
}
.databox .databox-stat.stat-left {
    left: 7px;
    right: auto
}
.databox .databox-stat .stat-text {
    display: inline-block;
    font-size: 13px;
    padding-right: 5px;
    font-weight: 500
}
.databox .databox-stat .stat-icon {
    display: inline-block;
    font-size: 13px
}
.databox .databox-stat .stat-icon.icon-lg {
    font-size: 16px
}
.databox .databox-stat .stat-icon.icon-xlg {
    font-size: 18px
}
.databox .databox-stat.radius-bordered {
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box
}
.databox .databox-stat[class*="bg-"] {
    color: #fff
}
.databox .databox-state {
    position: absolute;
    top: 10px;
    right: 10px;
    height: 24px;
    width: 24px;
    -webkit-border-radius: 50%;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 50%;
    -moz-background-clip: padding;
    border-radius: 50%;
    background-clip: padding-box;
    background-color: #e5e5e5;
    text-align: center;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    border: 2px solid #fff
}
.databox .databox-state i {
    font-size: 13px;
    color: #fff;
    line-height: 20px
}
.databox .databox-row {
    width: 100%;
    margin: 0;
    position: relative
}
.databox .databox-row[class*="bg-"] {
    color: #fff
}
.databox .databox-row.bordered-bottom {
    border-bottom: 1px solid #fff
}
.databox .databox-row.bordered-top {
    border-top: 1px solid #fff
}
.databox .databox-row.bordered-left {
    border-left: 1px solid #fff
}
.databox .databox-row.bordered-right {
    border-right: 1px solid #fff
}
.databox .databox-row.bordered-thick {
    border-width: 2px
}
.databox .databox-row.row-1 {
    height: 8.33%
}
.databox .databox-row.row-2 {
    height: 16.66%
}
.databox .databox-row.row-3 {
    height: 25%
}
.databox .databox-row.row-4 {
    height: 33.33%
}
.databox .databox-row.row-5 {
    height: 41.66%
}
.databox .databox-row.row-6 {
    height: 50%
}
.databox .databox-row.row-7 {
    height: 58.33%
}
.databox .databox-row.row-8 {
    height: 66.66%
}
.databox .databox-row.row-9 {
    height: 75%
}
.databox .databox-row.row-10 {
    height: 83.33%
}
.databox .databox-row.row-11 {
    height: 91.66%
}
.databox .databox-row.row-12 {
    height: 100%
}
.databox .databox-cell {
    height: 100%;
    margin: 0;
    position: relative;
    display: inline-block;
    vertical-align: middle;
    padding: 0 10px
}
.databox .databox-cell[class*="bg-"] {
    color: #fff
}
.databox .databox-cell.bordered-bottom {
    border-bottom: 1px solid #fff
}
.databox .databox-cell.bordered-top {
    border-top: 1px solid #fff
}
.databox .databox-cell.bordered-left {
    border-left: 1px solid #fff
}
.databox .databox-cell.bordered-right {
    border-right: 1px solid #fff
}
.databox .databox-cell.bordered-thick {
    border-width: 2px
}
.databox .databox-cell.cell-1 {
    width: 8.33%
}
.databox .databox-cell.cell-2 {
    width: 16.66%
}
.databox .databox-cell.cell-3 {
    width: 25%
}
.databox .databox-cell.cell-4 {
    width: 33.33%
}
.databox .databox-cell.cell-5 {
    width: 41.66%
}
.databox .databox-cell.cell-6 {
    width: 50%
}
.databox .databox-cell.cell-7 {
    width: 58.33%
}
.databox .databox-cell.cell-8 {
    width: 66.66%
}
.databox .databox-cell.cell-9 {
    width: 75%
}
.databox .databox-cell.cell-10 {
    width: 83.33%
}
.databox .databox-cell.cell-11 {
    width: 91.66%
}
.databox .databox-cell.cell-12 {
    width: 100%
}
.databox.databox-inverted .databox-left {
    -lh-property: 0;
    width: -webkit-calc(100% - 65px);
    width: -moz-calc(100% - 65px);
    width: calc(100% - 65px)
}
.databox.databox-inverted .databox-right {
    width: 65px
}
.databox.databox-transparent .databox-left {
    background-color: transparent!important
}
.databox.databox-transparent .databox-right {
    background-color: transparent!important
}
.databox .databox-left {
    position: relative;
    display: inline-block;
    vertical-align: top;
    text-align: center;
    margin: 0;
    width: 65px;
    height: 65px;
    padding: 10px;
    color: #2dc3e8
}
.databox .databox-left[class*="bg-"] {
    color: #fff
}
.databox .databox-right {
    position: relative;
    display: inline-block;
    vertical-align: top;
    margin: 0;
    -lh-property: 0;
    width: -webkit-calc(100% - 65px);
    width: -moz-calc(100% - 65px);
    width: calc(100% - 65px);
    height: 65px;
    color: #555;
    padding: 5px 10px
}
.databox .databox-right.bordered {
    border-left: 1px solid #fff
}
.databox .databox-right.bordered-thick {
    border-left: 3px solid #fff
}
.databox .databox-right[class*="bg-"] {
    color: #fff
}
.databox.databox-shadowed {
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, .2);
    box-shadow: 0 0 3px rgba(0, 0, 0, .2)
}
.databox.radius-bordered {
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box
}
.databox.radius-bordered .databox-left {
    -webkit-border-radius: 3px 0 0 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px 0 0 3px;
    -moz-background-clip: padding;
    border-radius: 3px 0 0 3px;
    background-clip: padding-box
}
.databox.radius-bordered .databox-right {
    -webkit-border-radius: 0 3px 3px 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 3px 3px 0;
    -moz-background-clip: padding;
    border-radius: 0 3px 3px 0;
    background-clip: padding-box
}
.databox.radius-bordered .databox-right .databox-row:first-child {
    -webkit-border-radius: 0 3px 0 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 3px 0 0;
    -moz-background-clip: padding;
    border-radius: 0 3px 0 0;
    background-clip: padding-box
}
.databox.radius-bordered .databox-right .databox-row:last-child {
    -webkit-border-radius: 0 0 3px 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 0 3px 0;
    -moz-background-clip: padding;
    border-radius: 0 0 3px 0;
    background-clip: padding-box
}
.databox.databox-graded {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNkZGRkZGQiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
    background-image: -webkit-linear-gradient(left, #ddd, #fff);
    background-image: -moz-linear-gradient(left, #ddd, #fff);
    background-image: -o-linear-gradient(left, #ddd, #fff);
    background-image: linear-gradient(to right, #ddd, #fff)
}
.databox.databox-halved .databox-left {
    width: 50%!important
}
.databox.databox-halved .databox-right {
    width: 50%!important
}
.databox.databox-lg {
    height: 80px
}
.databox.databox-lg .databox-icon>.fa:before,
.databox.databox-lg .databox-icon .typcn:before,
.databox.databox-lg .databox-icon .glyphicon:before,
.databox.databox-lg .databox-icon .wi:before {
    font-size: 48px;
    padding: 6px 4px 7px
}
.databox.databox-lg .databox-sparkline {
    margin: 13px auto
}
.databox.databox-lg .databox-number {
    font-size: 20px;
    margin: 4px 0 6px
}
.databox.databox-lg .databox-left {
    width: 80px;
    height: 80px
}
.databox.databox-lg .databox-right {
    -lh-property: 0;
    width: -webkit-calc(100% - 80px);
    width: -moz-calc(100% - 80px);
    width: calc(100% - 80px);
    height: 80px;
    padding: 10px 15px
}
.databox.databox-lg.databox-inverted .databox-left {
    -lh-property: 0;
    width: -webkit-calc(100% - 80px);
    width: -moz-calc(100% - 80px);
    width: calc(100% - 80px)
}
.databox.databox-lg.databox-inverted .databox-right {
    width: 80px
}
.databox.databox-xlg {
    height: 170px
}
.databox.databox-xlg .databox-icon>.fa:before,
.databox.databox-xlg .databox-icon .typcn:before,
.databox.databox-xlg .databox-icon .glyphicon:before {
    padding: 6px 4px 7px
}
.databox.databox-xlg .databox-icon .wi:before {
    font-size: 55px!important
}
.databox.databox-xlg .databox-left {
    width: 170px;
    height: 170px
}
.databox.databox-xlg .databox-right {
    -lh-property: 0;
    width: -webkit-calc(100% - 170px);
    width: -moz-calc(100% - 170px);
    width: calc(100% - 170px);
    height: 170px
}
.databox.databox-xlg.databox-inverted .databox-left {
    -lh-property: 0;
    width: -webkit-calc(100% - 170px);
    width: -moz-calc(100% - 170px);
    width: calc(100% - 170px)
}
.databox.databox-xlg.databox-inverted .databox-right {
    width: 170px
}
.databox.databox-xxlg {
    height: 250px
}
.databox.databox-xxlg .databox-icon>.fa:before,
.databox.databox-xxlg .databox-icon .typcn:before,
.databox.databox-xxlg .databox-icon .glyphicon:before,
.databox.databox-xxlg .databox-icon .wi:before {
    font-size: 200px;
    padding: 6px 4px 7px
}
.databox.databox-xxlg .databox-left {
    width: 250px;
    height: 250px
}
.databox.databox-xxlg .databox-right {
    -lh-property: 0;
    width: -webkit-calc(100% - 250px);
    width: -moz-calc(100% - 250px);
    width: calc(100% - 250px);
    height: 250px
}
.databox.databox-xxlg.databox-inverted .databox-left {
    -lh-property: 0;
    width: -webkit-calc(100% - 250px);
    width: -moz-calc(100% - 250px);
    width: calc(100% - 250px)
}
.databox.databox-xxlg.databox-inverted .databox-right {
    width: 250px
}
.databox.databox-vertical {
    width: 100%;
    height: 100px
}
.databox.databox-vertical .databox-top {
    position: relative;
    width: 100%;
    height: 50px;
    display: inline-block;
    text-align: center;
    margin: 0;
    padding: 5px;
    color: #2dc3e8
}
.databox.databox-vertical .databox-top[class*="bg-"] {
    color: #fff
}
.databox.databox-vertical .databox-bottom {
    position: relative;
    width: 100%;
    height: 50px;
    display: inline-block;
    margin: 0;
    color: #555;
    padding: 5px 10px
}
.databox.databox-vertical .databox-bottom.bordered {
    border-top: 1px solid #fff
}
.databox.databox-vertical .databox-bottom.bordered-thick {
    border-top: 3px solid #fff
}
.databox.databox-vertical .databox-bottom[class*="bg-"] {
    color: #fff
}
.databox.databox-vertical .databox-icon>.fa:before,
.databox.databox-vertical .databox-icon .typcn:before,
.databox.databox-vertical .databox-icon .glyphicon:before,
.databox.databox-vertical .databox-icon .wi:before {
    font-size: 38px
}
.databox.databox-vertical.radius-bordered {
    -webkit-border-radius: 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px;
    -moz-background-clip: padding;
    border-radius: 3px;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-top {
    -webkit-border-radius: 3px 3px 0 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px 3px 0 0;
    -moz-background-clip: padding;
    border-radius: 3px 3px 0 0;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-top .databox-row:first-child .databox-cell:first-child {
    -webkit-border-radius: 3px 0 0 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px 0 0 0;
    -moz-background-clip: padding;
    border-radius: 3px 0 0 0;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-top .databox-row:first-child .databox-cell:last-child {
    -webkit-border-radius: 0 3px 0 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 3px 0 0;
    -moz-background-clip: padding;
    border-radius: 0 3px 0 0;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-top img {
    -webkit-border-radius: 3px 3px 0 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 3px 3px 0 0;
    -moz-background-clip: padding;
    border-radius: 3px 3px 0 0;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-bottom {
    -webkit-border-radius: 0 0 3px 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 0 3px 3px;
    -moz-background-clip: padding;
    border-radius: 0 0 3px 3px;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-bottom .databox-row:last-child .databox-cell:first-child {
    -webkit-border-radius: 0 0 0 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 0 0 3px;
    -moz-background-clip: padding;
    border-radius: 0 0 0 3px;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-bottom .databox-row:last-child .databox-cell:last-child {
    -webkit-border-radius: 0 0 3px 0;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 0 3px 0;
    -moz-background-clip: padding;
    border-radius: 0 0 3px 0;
    background-clip: padding-box
}
.databox.databox-vertical.radius-bordered .databox-bottom img {
    -webkit-border-radius: 0 0 3px 3px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 0 0 3px 3px;
    -moz-background-clip: padding;
    border-radius: 0 0 3px 3px;
    background-clip: padding-box
}
.databox.databox-vertical.databox-graded {
    background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNlNWU1ZTUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
    background-image: -webkit-linear-gradient(top, #e5e5e5, #fff);
    background-image: -moz-linear-gradient(top, #e5e5e5, #fff);
    background-image: -o-linear-gradient(top, #e5e5e5, #fff);
    background-image: linear-gradient(to bottom, #e5e5e5, #fff)
}
.databox.databox-vertical.databox-halved .databox-top {
    height: 50%
}
.databox.databox-vertical.databox-halved .databox-bottom {
    height: 50%
}
.databox.databox-vertical.databox-lg {
    height: 150px;
    width: 100%
}
.databox.databox-vertical.databox-lg .databox-number {
    font-size: 17px;
    margin: 2px
}
.databox.databox-vertical.databox-lg .databox-icon>.fa:before,
.databox.databox-vertical.databox-lg .databox-icon .typcn:before,
.databox.databox-vertical.databox-lg .databox-icon .glyphicon:before {
    font-size: 38px!important;
    padding: 0
}
.databox.databox-vertical.databox-lg .databox-icon .wi:before {
    font-size: 50px!important;
    padding: 0
}
.databox.databox-vertical.databox-lg .databox-top {
    height: 50px
}
.databox.databox-vertical.databox-lg .databox-bottom {
    height: 100px
}
.databox.databox-vertical.databox-lg.databox-inverted .databox-icon>.fa:before,
.databox.databox-vertical.databox-lg.databox-inverted .databox-icon .typcn:before,
.databox.databox-vertical.databox-lg.databox-inverted .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-lg.databox-inverted .databox-icon .wi:before {
    font-size: 85px;
    padding: 0
}
.databox.databox-vertical.databox-lg.databox-inverted .databox-top {
    height: 100px
}
.databox.databox-vertical.databox-lg.databox-inverted .databox-bottom {
    height: 50px
}
.databox.databox-vertical.databox-lg.databox-halved .databox-icon>.fa:before,
.databox.databox-vertical.databox-lg.databox-halved .databox-icon .typcn:before,
.databox.databox-vertical.databox-lg.databox-halved .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-lg.databox-halved .databox-icon .wi:before {
    font-size: 58px;
    padding: 0
}
.databox.databox-vertical.databox-lg.databox-halved .databox-top {
    height: 75px
}
.databox.databox-vertical.databox-lg.databox-halved .databox-bottom {
    height: 75px
}
.databox.databox-vertical.databox-xlg {
    height: 200px;
    width: 100%
}
.databox.databox-vertical.databox-xlg .databox-icon>.fa:before,
.databox.databox-vertical.databox-xlg .databox-icon .typcn:before,
.databox.databox-vertical.databox-xlg .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xlg .databox-icon .wi:before {
    font-size: 38px;
    padding: 0
}
.databox.databox-vertical.databox-xlg .databox-top {
    height: 50px
}
.databox.databox-vertical.databox-xlg .databox-bottom {
    height: 150px
}
.databox.databox-vertical.databox-xlg.databox-inverted .databox-icon>.fa:before,
.databox.databox-vertical.databox-xlg.databox-inverted .databox-icon .typcn:before,
.databox.databox-vertical.databox-xlg.databox-inverted .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xlg.databox-inverted .databox-icon .wi:before {
    font-size: 120px;
    padding: 10px
}
.databox.databox-vertical.databox-xlg.databox-inverted .databox-top {
    height: 150px
}
.databox.databox-vertical.databox-xlg.databox-inverted .databox-bottom {
    height: 50px
}
.databox.databox-vertical.databox-xlg.databox-halved .databox-icon>.fa:before,
.databox.databox-vertical.databox-xlg.databox-halved .databox-icon .typcn:before,
.databox.databox-vertical.databox-xlg.databox-halved .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xlg.databox-halved .databox-icon .wi:before {
    font-size: 85px;
    padding: 0
}
.databox.databox-vertical.databox-xlg.databox-halved .databox-top {
    height: 100px
}
.databox.databox-vertical.databox-xlg.databox-halved .databox-bottom {
    height: 100px
}
.databox.databox-vertical.databox-xxlg {
    height: 300px;
    width: 100%
}
.databox.databox-vertical.databox-xxlg .databox-icon>.fa:before,
.databox.databox-vertical.databox-xxlg .databox-icon .typcn:before,
.databox.databox-vertical.databox-xxlg .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xxlg .databox-icon .wi:before {
    font-size: 38px;
    padding: 0
}
.databox.databox-vertical.databox-xxlg .databox-top {
    height: 50px
}
.databox.databox-vertical.databox-xxlg .databox-bottom {
    height: 250px
}
.databox.databox-vertical.databox-xxlg.databox-inverted .databox-icon>.fa:before,
.databox.databox-vertical.databox-xxlg.databox-inverted .databox-icon .typcn:before,
.databox.databox-vertical.databox-xxlg.databox-inverted .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xxlg.databox-inverted .databox-icon .wi:before {
    font-size: 220px;
    padding: 10px
}
.databox.databox-vertical.databox-xxlg.databox-inverted .databox-top {
    height: 250px
}
.databox.databox-vertical.databox-xxlg.databox-inverted .databox-bottom {
    height: 50px
}
.databox.databox-vertical.databox-xxlg.databox-halved .databox-icon>.fa:before,
.databox.databox-vertical.databox-xxlg.databox-halved .databox-icon .typcn:before,
.databox.databox-vertical.databox-xxlg.databox-halved .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xxlg.databox-halved .databox-icon .wi:before {
    font-size: 120px;
    padding: 10px
}
.databox.databox-vertical.databox-xxlg.databox-halved .databox-top {
    height: 150px
}
.databox.databox-vertical.databox-xxlg.databox-halved .databox-bottom {
    height: 150px
}
.databox.databox-vertical.databox-xxxlg {
    height: 500px;
    width: 100%
}
.databox.databox-vertical.databox-xxxlg .databox-icon>.fa:before,
.databox.databox-vertical.databox-xxxlg .databox-icon .typcn:before,
.databox.databox-vertical.databox-xxxlg .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xxxlg .databox-icon .wi:before {
    font-size: 38px;
    padding: 0
}
.databox.databox-vertical.databox-xxxlg .databox-top {
    height: 50px
}
.databox.databox-vertical.databox-xxxlg .databox-bottom {
    height: 450px
}
.databox.databox-vertical.databox-xxxlg.databox-inverted .databox-icon>.fa:before,
.databox.databox-vertical.databox-xxxlg.databox-inverted .databox-icon .typcn:before,
.databox.databox-vertical.databox-xxxlg.databox-inverted .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xxxlg.databox-inverted .databox-icon .wi:before {
    font-size: 420px;
    padding: 10px
}
.databox.databox-vertical.databox-xxxlg.databox-inverted .databox-top {
    height: 450px
}
.databox.databox-vertical.databox-xxxlg.databox-inverted .databox-bottom {
    height: 50px
}
.databox.databox-vertical.databox-xxxlg.databox-halved .databox-icon>.fa:before,
.databox.databox-vertical.databox-xxxlg.databox-halved .databox-icon .typcn:before,
.databox.databox-vertical.databox-xxxlg.databox-halved .databox-icon .glyphicon:before,
.databox.databox-vertical.databox-xxxlg.databox-halved .databox-icon .wi:before {
    font-size: 220px;
    padding: 10px
}
.databox.databox-vertical.databox-xxxlg.databox-halved .databox-top {
    height: 250px
}
.databox.databox-vertical.databox-xxxlg.databox-halved .databox-bottom {
    height: 250px
}
.databox .chart {
    font-size: 13px
}

#flotTip {
    padding: 3px 5px;
    background-color: #f5f5f5;
    z-index: 9999;
    color: #262626;
    -webkit-box-shadow: 0 1px 8px rgba(0, 0, 0, .3);
    -moz-box-shadow: 0 1px 8px rgba(0, 0, 0, .3);
    box-shadow: 0 1px 8px rgba(0, 0, 0, .3);
    font-size: 13px;
    -webkit-border-radius: 2px;
    -webkit-background-clip: padding-box;
    -moz-border-radius: 2px;
    -moz-background-clip: padding;
    border-radius: 2px;
    background-clip: padding-box;
    border: 1px solid #ccc
}
#flotTip span {
    color: #5db2ff;
    font-weight: 700
}


/* legdado -- pure-form.css */

/*
.pure-input-1 {
    width: 100%
}
.pure-input-2-3 {
    width: 66%
}
.pure-input-1-2 {
    width: 50%
}
.pure-input-1-3 {
    width: 33%
}
.pure-input-1-4 {
    width: 25%
}
*/

.info-box-number {
  display: block;
  font-weight: bold;
  font-size: 18px;
}




/*new template.. other css ---*/

/*
.card,
.card-title {
    margin-bottom: 1.5rem
}
.card-block,
.card-footer,
.card-header {
    padding: 1.5rem
}

.card {
    position: relative;
    display: block;
    border: 1px solid rgba(0, 0, 0, .06)
}
.card-block::after,
.card-footer::after,
.card-header::after {
    display: table;
    content: '';
    clear: both
}
.card-footer:last-child,
.card-header:first-child,
.card-img {
    border-radius: 0
}
.card-img-top,
.card>.list-group:first-child .list-group-item:first-child {
    border-top-right-radius: 0;
    border-top-left-radius: 0
}
.card-img-bottom,
.card>.list-group:last-child .list-group-item:last-child {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0
}
.card-header,
.card-subtitle,
.card-text:last-child {
    margin-bottom: 0
}
.card-subtitle {
    margin-top: -.75rem
}
.card-link:hover {
    text-decoration: none
}
.card-link+.card-link {
    margin-left: 1.5rem
}
.card-header-pills,
.card-header-tabs {
    margin-right: -.75rem;
    margin-left: -.75rem
}
.card-header {
    border-bottom: 1px solid rgba(0, 0, 0, .06)
}
.card-footer {
    border-top: 1px solid rgba(0, 0, 0, .06)
}
.card-header-tabs {
    margin-bottom: -1.5rem;
    border-bottom: 0
}
.card-primary {
    background-color: #00B5B8;
    border-color: #00B5B8
}
.card-primary .card-footer,
.card-primary .card-header {
    background-color: transparent
}
.card-success {
    background-color: #16D39A;
    border-color: #16D39A
}
.card-success .card-footer,
.card-success .card-header {
    background-color: transparent
}
.card-info {
    background-color: #2DCEE3;
    border-color: #2DCEE3
}
.card-info .card-footer,
.card-info .card-header {
    background-color: transparent
}
.card-warning {
    background-color: #FFA87D;
    border-color: #FFA87D
}
.card-warning .card-footer,
.card-warning .card-header {
    background-color: transparent
}
.card-danger {
    background-color: #FF7588;
    border-color: #FF7588
}
.card-danger .card-footer,
.card-danger .card-header,
.card-outline-danger,
.card-outline-info,
.card-outline-primary,
.card-outline-secondary,
.card-outline-success,
.card-outline-warning {
    background-color: transparent
}
.card-outline-primary {
    border-color: #00B5B8
}
.card-outline-secondary {
    border-color: #626E82
}
.card-outline-info {
    border-color: #2DCEE3
}
.card-outline-success {
    border-color: #16D39A
}
.card-outline-warning {
    border-color: #FFA87D
}
.card-outline-danger {
    border-color: #FF7588
}
.card-inverse .card-footer,
.card-inverse .card-header {
    border-color: rgba(255, 255, 255, .2)
}
.card-inverse .card-blockquote,
.card-inverse .card-footer,
.card-inverse .card-header,
.card-inverse .card-title {
    color: #FFF
}
.card-inverse .card-blockquote .blockquote-footer,
.card-inverse .card-link,
.card-inverse .card-subtitle,
.card-inverse .card-text {
    color: rgba(255, 255, 255, .65)
}
.card-inverse .card-link:focus,
.card-inverse .card-link:hover {
    color: #FFF
}
.card-blockquote {
    padding: 0;
    margin-bottom: 0;
    border-left: 0
}
.card-img-overlay {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    padding: 1.25rem
}
@media (min-width: 544px) {
    .card-deck {
        display: table;
        width: 100%;
        margin-bottom: 1.5rem;
        table-layout: fixed;
        border-spacing: 1.25rem 0
    }
    .card-deck .card {
        display: table-cell;
        margin-bottom: 0;
        vertical-align: top
    }
    .card-deck-wrapper {
        margin-right: -1.25rem;
        margin-left: -1.25rem
    }
    .card-group {
        display: table;
        width: 100%;
        table-layout: fixed
    }
    .card-group .card {
        display: table-cell;
        vertical-align: top
    }
    .card-group .card+.card {
        margin-left: 0;
        border-left: 0
    }
    .card-group .card:first-child {
        border-bottom-right-radius: 0;
        border-top-right-radius: 0
    }
    .card-group .card:first-child .card-img-top {
        border-top-right-radius: 0
    }
    .card-group .card:first-child .card-img-bottom {
        border-bottom-right-radius: 0
    }
    .card-group .card:last-child {
        border-bottom-left-radius: 0;
        border-top-left-radius: 0
    }
    .card-group .card:last-child .card-img-top {
        border-top-left-radius: 0
    }
    .card-group .card:last-child .card-img-bottom {
        border-bottom-left-radius: 0
    }
    .card-group .card:not(:first-child):not(:last-child),
    .card-group .card:not(:first-child):not(:last-child) .card-img-bottom,
    .card-group .card:not(:first-child):not(:last-child) .card-img-top {
        border-radius: 0
    }
    .card-columns {
        -webkit-column-count: 3;
        -moz-column-count: 3;
        column-count: 3;
        -webkit-column-gap: 1.25rem;
        -moz-column-gap: 1.25rem;
        column-gap: 1.25rem
    }
    .card-columns .card {
        display: inline-block;
        width: 100%
    }
}
 

.p-2 {
    padding: 1.5rem!important
}

.collapsing,
.embed-responsive,
.media,
.media-body,
.modal,
.modal-open,
.navbar-divider,
svg:not(:root) {
    overflow: hidden
}

.media-body {
    width: 10000px
}
.media-body,
.media-left,
.media-right {
    display: table-cell;
    vertical-align: top
}
.media-middle {
    vertical-align: middle
}
.media-bottom {
    vertical-align: bottom
}
.media-object {
    display: block
}
.media-object.img-thumbnail {
    max-width: none
}
.media-right {
    padding-left: 10px
}
.media-left {
    padding-right: 10px
}
.media-heading {
    margin-top: 0;
    margin-bottom: 5px
}
.media-list {
    padding-left: 0;
    list-style: none
}

*/

/*--- fim new template... other css --*/


/*
 * Component: Small Box
 * --------------------
 */
 .small-box {
    line-height: 1.5em ; 
    border-radius: 2px;
    position: relative;
    display: block;
    margin-bottom: 20px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  }
  .small-box > .inner {
    padding: 10px;
  }
  .small-box > .small-box-footer {
    position: relative;
    text-align: center;
    padding: 3px 0;
    color: #fff;
    color: rgba(255, 255, 255, 0.8);
    display: block;
    z-index: 10;
    background: rgba(0, 0, 0, 0.1);
    text-decoration: none;
  }
  .small-box > .small-box-footer:hover {
    color: #fff;
    background: rgba(0, 0, 0, 0.15);
  }
  .small-box h3 {
    font-size: 38px;
    font-weight: bold;
    margin: 0 0 10px 0;
    white-space: nowrap;
    padding: 0;
  }
  .small-box p {
    font-size: 15px;
  }
  .small-box p > small {
    display: block;
    color: #f9f9f9;
    font-size: 13px;
    margin-top: 5px;
  }
  .small-box h3,
  .small-box p {
    z-index: 5;
  }
  .small-box .icon {
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 0;
    font-size: 90px;
    color: rgba(0, 0, 0, 0.15);
  }
  .small-box:hover {
    text-decoration: none;
    color: #f9f9f9;
  }
  .small-box:hover .icon {
    font-size: 95px;
  }
  @media (max-width: 767px) {
    .small-box {
      text-align: center;
    }
    .small-box .icon {
      /*display: none ;*/
    }
    .small-box p {
      font-size: 15px;
    }
  }
  /*
   * Component: Box
   * --------------
   */
  .box {
    position: relative;
    border-radius: 3px;
    background: #ffffff;
    border-top: 3px solid #d2d6de;
    margin-bottom: 20px;
    width: 100%;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.1);
  }
  .box.box-primary {
    border-top-color: #3c8dbc;
  }
  .box.box-info {
    border-top-color: #00c0ef;
  }
  .box.box-danger {
    border-top-color: #dd4b39;
  }
  .box.box-warning {
    border-top-color: #f39c12;
  }
  .box.box-success {
    border-top-color: #00a65a;
  }
  .box.box-default {
    border-top-color: #d2d6de;
  }
  .box.collapsed-box .box-body,
  .box.collapsed-box .box-footer {
    display: none;
  }
  .box .nav-stacked > li {
    border-bottom: 1px solid #f4f4f4;
    margin: 0;
  }
  .box .nav-stacked > li:last-of-type {
    border-bottom: none;
  }
  .box.height-control .box-body {
    max-height: 300px;
    overflow: auto;
  }
  .box .border-right {
    border-right: 1px solid #f4f4f4;
  }
  .box .border-left {
    border-left: 1px solid #f4f4f4;
  }
  .box.box-solid {
    border-top: 0;
  }
  .box.box-solid > .box-header .btn.btn-default {
    background: transparent;
  }
  .box.box-solid > .box-header .btn:hover,
  .box.box-solid > .box-header a:hover {
    background: rgba(0, 0, 0, 0.1);
  }
  .box.box-solid.box-default {
    border: 1px solid #d2d6de;
  }
  .box.box-solid.box-default > .box-header {
    color: #444444;
    background: #d2d6de;
    background-color: #d2d6de;
  }
  .box.box-solid.box-default > .box-header a,
  .box.box-solid.box-default > .box-header .btn {
    color: #444444;
  }
  .box.box-solid.box-primary {
    border: 1px solid #3c8dbc;
  }
  .box.box-solid.box-primary > .box-header {
    color: #ffffff;
    background: #3c8dbc;
    background-color: #3c8dbc;
  }
  .box.box-solid.box-primary > .box-header a,
  .box.box-solid.box-primary > .box-header .btn {
    color: #ffffff;
  }
  .box.box-solid.box-info {
    border: 1px solid #00c0ef;
  }
  .box.box-solid.box-info > .box-header {
    color: #ffffff;
    background: #00c0ef;
    background-color: #00c0ef;
  }
  .box.box-solid.box-info > .box-header a,
  .box.box-solid.box-info > .box-header .btn {
    color: #ffffff;
  }
  .box.box-solid.box-danger {
    border: 1px solid #dd4b39;
  }
  .box.box-solid.box-danger > .box-header {
    color: #ffffff;
    background: #dd4b39;
    background-color: #dd4b39;
  }
  .box.box-solid.box-danger > .box-header a,
  .box.box-solid.box-danger > .box-header .btn {
    color: #ffffff;
  }
  .box.box-solid.box-warning {
    border: 1px solid #f39c12;
  }
  .box.box-solid.box-warning > .box-header {
    color: #ffffff;
    background: #f39c12;
    background-color: #f39c12;
  }
  .box.box-solid.box-warning > .box-header a,
  .box.box-solid.box-warning > .box-header .btn {
    color: #ffffff;
  }
  .box.box-solid.box-success {
    border: 1px solid #00a65a;
  }
  .box.box-solid.box-success > .box-header {
    color: #ffffff;
    background: #00a65a;
    background-color: #00a65a;
  }
  .box.box-solid.box-success > .box-header a,
  .box.box-solid.box-success > .box-header .btn {
    color: #ffffff;
  }
  .box.box-solid > .box-header > .box-tools .btn {
    border: 0;
    box-shadow: none;
  }
  .box.box-solid[class*='bg'] > .box-header {
    color: #fff;
  }
  .box .box-group > .box {
    margin-bottom: 5px;
  }
  .box .knob-label {
    text-align: center;
    color: #333;
    font-weight: 100;
    font-size: 12px;
    margin-bottom: 0.3em;
  }
  .box > .overlay,
  .overlay-wrapper > .overlay,
  .box > .loading-img,
  .overlay-wrapper > .loading-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .box .overlay,
  .overlay-wrapper .overlay {
    z-index: 50;
    background: rgba(255, 255, 255, 0.7);
    border-radius: 3px;
  }
  .box .overlay > .fa,
  .overlay-wrapper .overlay > .fa {
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -15px;
    margin-top: -15px;
    color: #000;
    font-size: 30px;
  }
  .box .overlay.dark,
  .overlay-wrapper .overlay.dark {
    background: rgba(0, 0, 0, 0.5);
  }
  .box-header:before,
  .box-body:before,
  .box-footer:before,
  .box-header:after,
  .box-body:after,
  .box-footer:after {
    content: " ";
    display: table;
  }
  .box-header:after,
  .box-body:after,
  .box-footer:after {
    clear: both;
  }
  .box-header {
    color: #444;
    display: block;
    padding: 10px;
    position: relative;
  }
  .box-header.with-border {
    border-bottom: 1px solid #f4f4f4;
  }
  .collapsed-box .box-header.with-border {
    border-bottom: none;
  }
  .box-header > .fa,
  .box-header > .glyphicon,
  .box-header > .ion,
  .box-header .box-title {
    display: inline-block;
    font-size: 18px;
    margin: 0;
    line-height: 1;
  }
  .box-header > .fa,
  .box-header > .glyphicon,
  .box-header > .ion {
    margin-right: 5px;
  }
  .box-header > .box-tools {
    position: absolute;
    right: 10px;
    top: 5px;
  }
  .box-header > .box-tools [data-toggle="tooltip"] {
    position: relative;
  }
  .box-header > .box-tools.pull-right .dropdown-menu {
    right: 0;
    left: auto;
  }
  .box-header > .box-tools .dropdown-menu > li > a {
    color: #444!important;
  }
  .btn-box-tool {
    padding: 5px;
    font-size: 12px;
    background: transparent;
    color: #97a0b3;
  }
  .open .btn-box-tool,
  .btn-box-tool:hover {
    color: #606c84;
  }
  .btn-box-tool.btn:active {
    box-shadow: none;
  }
  .box-body {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    padding: 10px;
  }
  .no-header .box-body {
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
  }
  .box-body > .table {
    margin-bottom: 0;
  }
  .box-body .fc {
    margin-top: 5px;
  }
  .box-body .full-width-chart {
    margin: -19px;
  }
  .box-body.no-padding .full-width-chart {
    margin: -9px;
  }
  .box-body .box-pane {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 3px;
  }
  .box-body .box-pane-right {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 0;
  }
  .box-footer {
    border-top-left-radius: 0;
    border-top-right-radius: 0;
    border-bottom-right-radius: 3px;
    border-bottom-left-radius: 3px;
    border-top: 1px solid #f4f4f4;
    padding: 10px;
    background-color: #ffffff;
  }

  
  .bg-red,
  .bg-yellow,
  .bg-aqua,
  .bg-blue,
  .bg-light-blue,
  .bg-green,
  .bg-navy,
  .bg-teal,
  .bg-olive,
  .bg-lime,
  .bg-orange,
  .bg-fuchsia,
  .bg-purple,
  .bg-maroon,
  .bg-black,
  .bg-red-active,
  .bg-yellow-active,
  .bg-aqua-active,
  .bg-blue-active,
  .bg-light-blue-active,
  .bg-green-active,
  .bg-navy-active,
  .bg-teal-active,
  .bg-olive-active,
  .bg-lime-active,
  .bg-orange-active,
  .bg-fuchsia-active,
  .bg-purple-active,
  .bg-maroon-active,
  .bg-black-active,
  .callout.callout-danger,
  .callout.callout-warning,
  .callout.callout-info,
  .callout.callout-success,
  .alert-success,
  .alert-danger,
  .alert-error,
  .alert-warning,
  .alert-info,
  .label-danger,
  .label-info,
  .label-warning,
  .label-primary,
  .label-success,
  .modal-primary .modal-body,
  .modal-primary .modal-header,
  .modal-primary .modal-footer,
  .modal-warning .modal-body,
  .modal-warning .modal-header,
  .modal-warning .modal-footer,
  .modal-info .modal-body,
  .modal-info .modal-header,
  .modal-info .modal-footer,
  .modal-success .modal-body,
  .modal-success .modal-header,
  .modal-success .modal-footer,
  .modal-danger .modal-body,
  .modal-danger .modal-header,
  .modal-danger .modal-footer {
    color: #fff !important;
  }
  .bg-gray {
    color: #000;
    background-color: #d2d6de !important;
  }
  .bg-gray-light {
    background-color: #f7f7f7;
  }
  .bg-black {
    background-color: #111111 !important;
  }
  .bg-red,
  .callout.callout-danger,
  .alert-danger,
  .alert-error,
  .label-danger,
  .modal-danger .modal-body {
    background-color: #dd4b39 !important;
  }
  .bg-yellow,
  .callout.callout-warning,
  .alert-warning,
  .label-warning,
  .modal-warning .modal-body {
    background-color: #f39c12 !important;
  }
  .bg-aqua,
  .callout.callout-info,
  .alert-info,
  .label-info,
  .modal-info .modal-body {
    background-color: #00c0ef !important;
  }
  .bg-blue {
    background-color: #0073b7 !important;
  }
  .bg-light-blue,
  .label-primary,
  .modal-primary .modal-body {
    background-color: #3c8dbc !important;
  }
  .bg-green,
  .callout.callout-success,
  .alert-success,
  .label-success,
  .modal-success .modal-body {
    background-color: #00a65a !important;
  }
  .bg-navy {
    background-color: #001f3f !important;
  }
  .bg-teal {
    background-color: #39cccc !important;
  }
  .bg-olive {
    background-color: #3d9970 !important;
  }
  .bg-lime {
    background-color: #01ff70 !important;
  }
  .bg-orange {
    background-color: #ff851b !important;
  }
  .bg-fuchsia {
    background-color: #f012be !important;
  }
  .bg-purple {
    background-color: #605ca8 !important;
  }
  .bg-maroon {
    background-color: #d81b60 !important;
  }
  .bg-gray-active {
    color: #000;
    background-color: #b5bbc8 !important;
  }
  .bg-black-active {
    background-color: #000000 !important;
  }
  .bg-red-active,
  .modal-danger .modal-header,
  .modal-danger .modal-footer {
    background-color: #d33724 !important;
  }
  .bg-yellow-active,
  .modal-warning .modal-header,
  .modal-warning .modal-footer {
    background-color: #db8b0b !important;
  }
  .bg-aqua-active,
  .modal-info .modal-header,
  .modal-info .modal-footer {
    background-color: #00a7d0 !important;
  }
  .bg-blue-active {
    background-color: #005384 !important;
  }
  .bg-light-blue-active,
  .modal-primary .modal-header,
  .modal-primary .modal-footer {
    background-color: #357ca5 !important;
  }
  .bg-green-active,
  .modal-success .modal-header,
  .modal-success .modal-footer {
    background-color: #008d4c !important;
  }
  .bg-navy-active {
    background-color: #001a35 !important;
  }
  .bg-teal-active {
    background-color: #30bbbb !important;
  }
  .bg-olive-active {
    background-color: #368763 !important;
  }
  .bg-lime-active {
    background-color: #00e765 !important;
  }
  .bg-orange-active {
    background-color: #ff7701 !important;
  }
  .bg-fuchsia-active {
    background-color: #db0ead !important;
  }
  .bg-purple-active {
    background-color: #555299 !important;
  }
  .bg-maroon-active {
    background-color: #ca195a !important;
  }
  [class^="bg-"].disabled {
    opacity: 0.65;
    filter: alpha(opacity=65);
  }
  .text-red {
    color: #dd4b39 !important;
  }
  .text-yellow {
    color: #f39c12 !important;
  }
  .text-aqua {
    color: #00c0ef !important;
  }
  .text-blue {
    color: #0073b7 !important;
  }
  .text-black {
    color: #111111 !important;
  }
  .text-light-blue {
    color: #3c8dbc !important;
  }
  .text-green {
    color: #00a65a !important;
  }
  .text-gray {
    color: #d2d6de !important;
  }
  .text-navy {
    color: #001f3f !important;
  }
  .text-teal {
    color: #39cccc !important;
  }
  .text-olive {
    color: #3d9970 !important;
  }
  .text-lime {
    color: #01ff70 !important;
  }
  .text-orange {
    color: #ff851b !important;
  }
  .text-fuchsia {
    color: #f012be !important;
  }
  .text-purple {
    color: #605ca8 !important;
  }
  .text-maroon {
    color: #d81b60 !important;
  }



  
.material-icons {
    font-family: 'Material Icons';
    font-weight: normal;
    font-style: normal;
    font-size: 24px;
    line-height: 1;
    letter-spacing: normal;
    text-transform: none;
    display: inline-block;
    white-space: nowrap;
    word-wrap: normal;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    -webkit-font-smoothing: antialiased;
  }
      
  
       ::-webkit-scrollbar {
              width: 0px;
              height: 0px;
          }
          
          ::-webkit-scrollbar-button {
              width: 0px;
              height: 0px;
          }
          
          ::-webkit-scrollbar-thumb {
              background: #e1e1e1;
              border: 0px none #ffffff;
              border-radius: 50px;
          }
          
          ::-webkit-scrollbar-thumb:hover {
              
          }
          
          ::-webkit-scrollbar-thumb:active {
              
          }
          
          ::-webkit-scrollbar-track {
              background: #666666;
              border: 0px none #ffffff;
              border-radius: 50px;
          }
          
          ::-webkit-scrollbar-track:hover {
              
          }
          
          ::-webkit-scrollbar-track:active {
              
          }
          
          ::-webkit-scrollbar-corner {
              background: transparent;
          }
          
  
          /* customizar scrool bar dos cockpits*/
          
          .dataTables_scrollBody::-webkit-scrollbar-track {
              -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
              border-radius: 10px;
              background-color: #FFF;
          }
          
          .dataTables_scrollBody::-webkit-scrollbar {
              width: 8px;
              height: 8px;
              /* background-color: #F5F5F5;  */
          }
          
          .dataTables_scrollBody::-webkit-scrollbar-thumb {
              border-radius: 10px;
              -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
              /* background-color: #555; */
          }
          /* customizar scrool bar dos grids jeasy-ui */
          
          .datagrid-body::-webkit-scrollbar-track {
              -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
              border-radius: 10px;
              background-color: #FFF;
          }
          
          .datagrid-body::-webkit-scrollbar {
              width: 8px;
              height: 8px;
              /* background-color: #F5F5F5;  */
          }
          
          .datagrid-body::-webkit-scrollbar-thumb {
              border-radius: 10px;
              -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
              /* background-color: #555; */
          }
          
  
          /* classe para colocar scroll-bar */
  
          .zscroll::-webkit-scrollbar-track {
              -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
              border-radius: 10px;
              background-color: #FFF;
          }
          
          .zscroll::-webkit-scrollbar {
              width: 8px!important;
              height: 8px!important;
              /* background-color: #F5F5F5;  */
          }
          
          .zscroll::-webkit-scrollbar-thumb {
              border-radius: 10px;
              -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
              /* background-color: #555; */
          }
          
  
  
  
  
  /* 
    ##Device = Desktops
    ##Screen = 1281px to higher resolution desktops
  */
  
  @media (min-width: 1281px) {
     
    
  }
  
  /* 
    ##Device = Laptops, Desktops
    ##Screen = B/w 1025px to 1280px
  */
  
  @media (min-width: 1025px) and (max-width: 1280px) {
    
    
    
  }
  
  /* 
    ##Device = Tablets, Ipads (portrait)
    ##Screen = B/w 768px to 1024px
  */
  
  @media (min-width: 768px) and (max-width: 1024px) {
    
     
    
  }
  
  /* 
    ##Device = Tablets, Ipads (landscape)
    ##Screen = B/w 768px to 1024px
  */
  
  @media (min-width: 768px) and (max-width: 1024px) and (orientation: landscape) {
    
     
    
  }
  
  /* 
    ##Device = Low Resolution Tablets, Mobiles (Landscape)
    ##Screen = B/w 481px to 767px
  */
  
  @media (min-width: 481px) and (max-width: 767px) {
    
    
    
  }
  
  /* 
    ##Device = Most of the Smartphones Mobiles (Portrait)
    ##Screen = B/w 320px to 479px
  */
  
  @media (min-width: 320px) and (max-width: 480px) {
    
    
    
  }	
  
  
  .dataTables_wrapper {
      white-space:nowrap;
      
      
      margin: 0 auto;
  }
  
  
  .dataTables_scrollHead {
      max-width:98.8%;
  }
  
  .modal.modal-wide .modal-dialog {
    width: 90%;
    
  }
  .modal-wide .modal-body {
    overflow-y: auto;
    white-space:nowrap;
    
  }
  
  .modal.modal-wide-10 .modal-dialog {
    width: 10%;  
  }
  
  .modal.modal-wide-20 .modal-dialog {
    width: 20%;  
  }
  
  .modal.modal-wide-30 .modal-dialog {
    width: 30%;  
  }
  
  .modal.modal-wide-40 .modal-dialog {
    width: 40%;  
  }
  
  .modal.modal-wide-50 .modal-dialog {
    width: 50%;  
  }
  
  .modal.modal-wide-60 .modal-dialog {
    width: 60%;  
  }
  
  .modal.modal-wide-70 .modal-dialog {
    width: 70%;  
  }
  .modal.modal-wide-80 .modal-dialog {
    width: 80%;  
  }
  .modal.modal-wide-90 .modal-dialog {
    width: 90%;  
  }
  .modal-wide .modal-body {
    overflow-y: auto;
    white-space:nowrap;
    
  }
  
  .modal-header {
      padding: 5px;
      border-bottom: 1px solid #e5e5e5;
      color: #Fff;
      background: #438EB9;
  
  }
  
  
  
      
  .cub_loading.hide {
    display: none;
}

.cub_loading {
    position: fixed;
    top: 0;
    width: 100%;
    height: 100%;
    background: white;
    z-index: 1032;
    opacity: 1;
    transition: opacity 0.5s cubic-bezier(0.7, 0, 0.3, 1);
    

    overflow: show;
    margin: auto;
        
    left: 0;
    bottom: 0;
    right: 10px;  
    width: 80px;
    height: 80px;
}


 /* inicio */

.cssload-container{

display: block;
margin:250px auto ;

width:97px;
}

.cssload-loading{
width: 19px;
height: 19px;
margin: auto;
text-align: left;
transform-origin:center;
    -o-transform-origin:center;
    -ms-transform-origin:center;
    -webkit-transform-origin:center;
    -moz-transform-origin:center;
animation:cssload-loading-ani1 1.15s ease-in-out infinite;
    -o-animation:cssload-loading-ani1 1.15s ease-in-out infinite;
    -ms-animation:cssload-loading-ani1 1.15s ease-in-out infinite;
    -webkit-animation:cssload-loading-ani1 1.15s ease-in-out infinite;
    -moz-animation:cssload-loading-ani1 1.15s ease-in-out infinite;
}
.cssload-loading i,
.cssload-loading i:before,
.cssload-loading i:after{
content: "";
position:absolute;
width: 19px;
height: 19px;
display: inline-block;
border-radius: 50%;
}
.cssload-loading i:before{
transform:translate(0,-19px) scale(0.75);
    -o-transform:translate(0,-19px) scale(0.75);
    -ms-transform:translate(0,-19px) scale(0.75);
    -webkit-transform:translate(0,-19px) scale(0.75);
    -moz-transform:translate(0,-19px) scale(0.75);

}
.cssload-loading i:after{
transform:translate(0,-34px) scale(0.5);
    -o-transform:translate(0,-34px) scale(0.5);
    -ms-transform:translate(0,-34px) scale(0.5);
    -webkit-transform:translate(0,-34px) scale(0.5);
    -moz-transform:translate(0,-34px) scale(0.5);
}
.cssload-loading i:nth-child(1){
transform:translate(0,49px);
    -o-transform:translate(0,49px);
    -ms-transform:translate(0,49px);
    -webkit-transform:translate(0,49px);
    -moz-transform:translate(0,49px);
}
.cssload-loading i:nth-child(1),
.cssload-loading i:nth-child(1):before,
.cssload-loading i:nth-child(1):after{
background: rgb(255,179,100);
}
.cssload-loading i:nth-child(2),
.cssload-loading i:nth-child(2):before,
.cssload-loading i:nth-child(2):after{
background: rgb(0,168,146);
}
.cssload-loading i:nth-child(2){
transform:rotate(90deg) translate(0,49px);
    -o-transform:rotate(90deg) translate(0,49px);
    -ms-transform:rotate(90deg) translate(0,49px);
    -webkit-transform:rotate(90deg) translate(0,49px);
    -moz-transform:rotate(90deg) translate(0,49px);
}
.cssload-loading i:nth-child(3),
.cssload-loading i:nth-child(3):before,
.cssload-loading i:nth-child(3):after{
background: rgb(31,76,89);
}
.cssload-loading i:nth-child(3){
transform:rotate(180deg) translate(0,49px);
    -o-transform:rotate(180deg) translate(0,49px);
    -ms-transform:rotate(180deg) translate(0,49px);
    -webkit-transform:rotate(180deg) translate(0,49px);
    -moz-transform:rotate(180deg) translate(0,49px);
}
.cssload-loading i:nth-child(4),
.cssload-loading i:nth-child(4):before,
.cssload-loading i:nth-child(4):after{
background: rgb(255,89,84);
}
.cssload-loading i:nth-child(4){
transform:rotate(270deg) translate(0,49px);
    -o-transform:rotate(270deg) translate(0,49px);
    -ms-transform:rotate(270deg) translate(0,49px);
    -webkit-transform:rotate(270deg) translate(0,49px);
    -moz-transform:rotate(270deg) translate(0,49px);
}


@keyframes cssload-loading-ani1{
80%,100%{
    transform:rotate(360deg);
}
}

@-o-keyframes cssload-loading-ani1{
80%,100%{
    -o-transform:rotate(360deg);
}
}

@-ms-keyframes cssload-loading-ani1{
80%,100%{
    -ms-transform:rotate(360deg);
}
}

@-webkit-keyframes cssload-loading-ani1{
80%,100%{
    -webkit-transform:rotate(360deg);
}
}

@-moz-keyframes cssload-loading-ani1{
80%,100%{
    -moz-transform:rotate(360deg);
}
}