body {
    font-family: "Roboto Slab","Helvetica Neue",Helvetica,Arial,sans-serif;
}

.box {
    background: rgba(255, 255, 255);
}

.skin-green .main-header .navbar
{
    background-color: #15b715;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 45px;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header {
    height: auto;
}

.required:after
{
    content: " *";
}
    
.required
{
    color: #a94442;
}

footer strong {
    margin: 0px;
}

.tit
{
    font-family: Nirmala,sans-serif;
    margin-top: 30px;
    text-transform: uppercase;
    padding-left: 20px;
    color: #666;
}

.box {
    border-top: 0px !important;
    box-shadow: none !important;
}

.bg-b
{
    
  background-color: #003979;  
}

.main-footer {
    margin-left: 0px;
}

.skin-green .sidebar a {
    color: #666;
}

.skin-green .treeview-menu > li > a {
    color: #fff;
}

.orange {
    background-color: #15b715 !important;
    color: #15b715;
    padding: 12px 5px 12px 18px;
    height: 50px;
    background-color: white !important;
    
}

.skin-green .treeview-menu > li > a:hover {
    font-size: 14px;
}

.orange:hover{
     background-color: #000760;
}

.skin-green .wrapper, .skin-green .main-sidebar, .skin-green .left-side {
    background-color: white;
    background-image: none;
    margin: 0px;
}

.sidebar-menu > li {
    padding-bottom: 0px;
    padding-top: 0px;
    border-bottom: 1px solid rgba(128, 128, 128, 0.29);
}

.sidebar-menu, .main-sidebar .user-panel, .sidebar-menu > li.header {
    white-space: none ;
}

.skin-green .sidebar-menu > li > .treeview-menu {
    color: #666;
    background: #15b715;
    border-left-color: #FFF;
    margin: 0px;
    padding: 10px;
}

.sidebar-menu .treeview-menu > li {
    margin: 0px;
    padding-bottom: 10px;
}

.skin-green .main-header li.user-header {
    background-color: #00A4FF;
}

a:focus, a:hover {
    text-decoration: none !important;
}

.skin-green .sidebar-menu > li:hover > a, .skin-green .sidebar-menu > li.active > a {
    color: #FFF;
    background: #00a4ff none repeat scroll 0% 0%;
    border-left-color: #FFF;
}

.content-wrapper, .right-side {
    min-height: 100%;
    background-color: #E9E9E9;
    z-index: 800;
    color: #666;
}

aside {
    padding: 0px;
}

.hgl {
    color: white;
    font-weight: 100;
    font-size: 40px;
    text-align: center;
}

.modl {
    background: rgb(227, 227, 227) none repeat scroll 0% 0%;
    border-radius: 5px;
    padding: 25px;
    text-align: center;
    color: white;
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857;
    background-image: none;
    border: 1px solid #CCC;
    border-radius: 4px;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    background-color: rgba(255, 255, 255, 0.03);
    color: #666;
}

.btn {
    padding: 8px;
    border-radius: 3px;
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #FFF;
    border: transparent;
    background-color: #15b715;
    min-width: 80px;
    font-weight: 700;
    margin-bottom: 5px;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: #00A4FF;
    border-color: #00A4FF;
    color: #fff;
}

.daterangepicker td.in-range {
    background: rgba(0, 164, 255, 0.37);
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.btn:hover, .open .dropdown-toggle.btn {
    border-color: transparent !important;
    color: #FFF !important;
    background-color: #00A4FF;
}

.btn.focus, .btn:focus, .btn:hover {
    color: #FFF;
    text-decoration: none;
}

.btn:hover {   
   background-color: #128b12;
}

.btn-navy.active {
    background-color: #00A4FF;
    color: #FFF;
}
.btn-group-vertical > .btn, .btn-group > .btn {
    position: relative;
    float: left;
    border-radius: 5px;
    border: 1px solid white !important;
}


label, h3, h4, strong
{
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #15b715;
    display: block;
    margin-top: 15px;
}

.input-group-addon:first-child {
  color: #00a4ff;
}

textarea
{
    max-width: 100%;
}

.tbodysc
{
    overflow-x: hidden;
    width: 100% !important;
    overflow-y: auto;
    max-height: 230px;
}

.box-body {
    padding: 40px;
}

.form-control:focus {
    border-color: #00a4ff !important;
    box-shadow: none;
}

.main-sidebar
{
    position: fixed;
}

.btn-group, .btn-group-vertical {

    display: block;
    margin-bottom: 0px;
}


.div-login .btn-xl
{
    width: 100%;
}

.btnEllipse {
    box-shadow: none;
    border: 1px solid transparent;
    height: 34px !important;
    border-radius: 5px;
    margin-left: 0px;
}

.btnEllipse .fa {
    padding: 3px;
    float: left;
}

.btnEllipse p {
    float: left;
}

.tbedit 
{ 
    display: none;
}

.main-footer2 {
    background: #FFF;
    padding: 15px;
    color: #8F8F8F;
    border-top: none;
    border-radius: 3px;
}

.input-group-addon:first-child {
    border-right: 0px none;
    border-radius: 3px 0px 0px 3px !important;
}

.separadorv {
    padding-left: 20px;
    border-left: 2px solid rgba(0, 0, 0, 0.2);
    margin-top: 25px;
}

#logo-md {
    padding-top: 10px;
    padding-left: 7px;
    padding-bottom: 20px;
    width: 100%;
}

.Doc {
    font-weight: 600;
    color: #00A4FF;
    cursor:pointer;
}

.btn.focus, .btn:focus, .btn:hover {
    color: #FFF !important;
}

#DR1 {
    margin-top: 15px;
    border-top: 1px solid #999;
    padding-top: 20px;
}

/*input del tipo rango con esfera de color*/

input[type=range]{
    -webkit-appearance: none;
}

input[type=range]::-webkit-slider-runnable-track {
    width: 300px;
    height: 5px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #00A4FF;
    margin-top: -4px;
}

input[type=range]:focus {
    outline: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #ccc;
}

input[type=range]{
    /* fix for FF unable to apply focus style bug  */
    border: 1px solid white; 

    /*required for proper track sizing in FF*/
}

input[type=range]::-moz-range-track {
    height: 5px;
    background: #ddd;
    border: none;
    border-radius: 3px;
}

input[type=range]::-moz-range-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #00A4FF;
}

/*hide the outline behind the border*/
input[type=range]:-moz-focusring{
    outline: 1px solid white;
    outline-offset: -1px;
}

input[type=range]:focus::-moz-range-track {
    background: #ccc;
}

input[type=range]::-ms-track {
    width: 300px;
    height: 5px;
    
    /*remove bg colour from the track, we'll use ms-fill-lower and ms-fill-upper instead */
    background: transparent;
    
    /*leave room for the larger thumb to overflow with a transparent border */
    border-color: transparent;
    border-width: 6px 0;

    /*remove default tick marks*/
    color: transparent;
}
input[type=range]::-ms-fill-lower {
    background: #777;
    border-radius: 10px;
}
input[type=range]::-ms-fill-upper {
    background: #ddd;
    border-radius: 10px;
}
input[type=range]::-ms-thumb {
    border: none;
    height: 16px;
    width: 16px;
    border-radius: 50%;
    background: #00A4FF;
}
input[type=range]:focus::-ms-fill-lower {
    background: #888;
}
input[type=range]:focus::-ms-fill-upper {
    background: #ccc;
}

----

.tbf table {
        width: 100%;
    }

.tbf  thead, .tbf tbody,.tbf  tr,.tbf  td,.tbf  th { display: block; }

.tbf tr:after {
    content: ' ';
    display: block;
    visibility: hidden;
    clear: both;
}

.tbf thead th {
    height: 30px;

    /*text-align: left;*/
}

.tbf tbody {
    height: 210px;
    overflow-y: auto;
}

.tbf thead {
    /* fallback */
}


.tbf tbody td, .tbf thead th {
    width: 19.2%;
    float: left;
}


.table-responsive > .table > tbody > tr > td, .table-responsive > .table > tbody > tr > th, .table-responsive > .table > tfoot > tr > td, .table-responsive > .table > tfoot > tr > th, .table-responsive > .table > thead > tr > td, .table-responsive > .table > thead > tr > th {
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}


.table-responsive > .table > tbody > tr > td
{
    line-height: 35px;
}

----

@font-face {
    font-family: "Nirmala";
    src: url(/dist/font/NirmalaB.ttf) format("truetype");
}

@media (max-width: 767px) {
    .main-sidebar,
    .left-side {
        padding-top: 60px
    }
    .separadorv {
        padding-left: 0px;
        border-left: 0px solid rgba(0, 0, 0, 0.2);
        margin-top: 0px;
}   
    .btnEllipse {
    height: 45px !important;
    width: 45px !important;
    min-width: 45px;
    border-radius: 50%;

}
    .btnEllipse .fa {
    padding: 8px;
}
    .btnEllipse p {
    display: none;
}
    .orange {
    background-color: #00A4FF !important;
    color: white !important;
}
}

.arrow::after {
   font-family: FontAwesome;
   content: "\f0dc";
   display: inline-block;
   padding-left: 5px;
   vertical-align: middle;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: #15b715 !important;
    border: 1px solid #15b715 !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice__remove {
    color: #ffffff !important;
}


/* Juan Donis 28/04/2016 -  Estilos para corregir BUGS en Intl-Tel-Input */

.intl-tel-input {display: table-cell;}

.intl-tel-input .country-list .country.highlight {background-color: #ccc;}

.intl-tel-input .iti-flag .arrow {border: none;}  

.intl-tel-input .country-list {z-index: 10;}

.intl-tel-input {width: 100%!important;}
       


body {
    font-family: "Roboto Slab","Helvetica Neue",Helvetica,Arial,sans-serif;
}

.box {
    background: rgba(255, 255, 255);
}

.skin-green .main-header .navbar
{
    background-color: #15b715;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 45px;
}

.navbar-nav > .user-menu > .dropdown-menu > li.user-header 
{
    height: auto;
}

.tit
{
    font-family: Nirmala,sans-serif;
    margin-top: 30px;
    text-transform: uppercase;
    padding-left: 20px;
    color: #666;
}

.box {
    border-top: 0px !important;
    box-shadow: none !important;
}

.bg-b
{
    
  background-color: #003979;  
}

.main-footer {
    margin-left: 0px;
}

.skin-green .sidebar a {
    color: #666;
}

.orange {
    background-color: #15b715 !important;
    color: #15b715;
    padding: 12px 5px 12px 18px;
    height: 50px;
    background-color: white !important;
    
}

.skin-green .treeview-menu > li > a:hover {
    font-size: 14px;
}

.orange:hover{
     background-color: #000760;
}

.skin-green .wrapper, .skin-green .main-sidebar, .skin-green .left-side {
    background-color: white;
    background-image: none;
    margin: 0px;
}

.sidebar-menu > li {
    padding-bottom: 0px;
    padding-top: 0px;
    border-bottom: 1px solid rgba(128, 128, 128, 0.29);
}

.sidebar-menu, .main-sidebar .user-panel, .sidebar-menu > li.header {
    white-space: none ;
}

.skin-green .sidebar-menu > li > .treeview-menu {
    color: #666;
    background: #15b715;
    border-left-color: #FFF;
    margin: 0px;
    padding: 10px;
}

.sidebar-menu .treeview-menu > li {
    margin: 0px;
    padding-bottom: 10px;
}

.skin-green .main-header li.user-header {
    background-color: #00A4FF;
}

a:focus, a:hover {
    text-decoration: none !important;
}

.skin-green .sidebar-menu > li:hover > a, .skin-green .sidebar-menu > li.active > a {
    color: #FFF;
    background: #00a4ff none repeat scroll 0% 0%;
    border-left-color: #FFF;
}

.content-wrapper, .right-side {
    min-height: 100%;
    background-color: #E9E9E9;
    z-index: 800;
    color: #666;
}

aside {
    padding: 0px;
}

.form-control {
    display: block;
    width: 100%;
    height: 34px;
    padding: 6px 12px;
    font-size: 14px;
    line-height: 1.42857;
    background-image: none;
    border: 1px solid #CCC;
    border-radius: 4px;
    box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset;
    transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s;
    background-color: rgba(255, 255, 255, 0.03);
    color: #666;
}

.btn {
    padding: 8px;
    border-radius: 3px;
    text-transform: uppercase;
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #FFF;
    border: transparent;
    background-color: #15b715;
    min-width: 80px;
    font-weight: 700;
    margin-bottom: 5px;
}

.daterangepicker td.active, .daterangepicker td.active:hover {
    background-color: #00A4FF;
    border-color: #00A4FF;
    color: #fff;
}

.daterangepicker td.in-range {
    background: rgba(0, 164, 255, 0.37);
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
}

.btn:hover, .open .dropdown-toggle.btn {
    border-color: transparent !important;
    color: #FFF !important;
    background-color: #00A4FF;
}

.btn.focus, .btn:focus, .btn:hover {
    color: #FFF;
    text-decoration: none;
}

.btn:hover {   
   background-color: #128b12;
}

.btn-navy.active {
    background-color: #00A4FF;
    color: #FFF;
}
.btn-group-vertical > .btn, .btn-group > .btn {
    position: relative;
    float: left;
    border-radius: 5px;
    border: 1px solid white !important;
}


label, h3, h4, strong{
    font-family: Montserrat,"Helvetica Neue",Helvetica,Arial,sans-serif;
    color: #15b715;
}

.input-group-addon:first-child {
  color: #00a4ff;
}

textarea
{
    max-width: 100%;
}

.tbodysc
{
    overflow-x: hidden;
    width: 100% !important;
    overflow-y: auto;
    max-height: 230px;
}

.box-body {
    padding: 40px;
}

.form-control:focus {
    border-color: #00a4ff !important;
    box-shadow: none;
}

.main-sidebar
{
    position: fixed;
}

.btn-group, .btn-group-vertical {

    display: block;
    margin-bottom: 0px;
}


.div-login .btn-xl
{
    width: 100%;
}

.btnEllipse {
    box-shadow: none;
    border: 1px solid transparent;
    height: 34px !important;
    border-radius: 5px;
    margin-left: 0px;
}

.btnEllipse .fa {
    padding: 3px;
    float: left;
}

.btnEllipse p {
    float: left;
}

.tbedit 
{ 
    display: none;
}

.main-footer2 {
    background: #FFF;
    padding: 15px;
    color: #8F8F8F;
    border-top: none;
    border-radius: 3px;
}

.input-group-addon:first-child {
    border-right: 0px none;
    border-radius: 3px 0px 0px 3px !important;
}

.separadorv {
    padding-left: 20px;
    border-left: 2px solid rgba(0, 0, 0, 0.2);
    margin-top: 25px;
}

#logo-md {
    padding-top: 10px;
    padding-left: 7px;
    padding-bottom: 20px;
    width: 100%;
}

.Doc {
    font-weight: 600;
    color: #00A4FF;
    cursor:pointer;
}

.btn.focus, .btn:focus, .btn:hover {
    color: #FFF !important;
}

#DR1 {
    margin-top: 15px;
    border-top: 1px solid #999;
    padding-top: 20px;
}

.alert-danger, .alert-success, .alert-warning, .alert-info
{
    background-color: #f0f0f0 !important;
    color: #666 !important;
}

.cropit-image-zoom-input {
    display: block !important;
    width: 200px !important;
    max-width: 90%;
    border: 0px !important;
    box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.075) inset;
}

 .cropit-preview {
        background-color: #f8f8f8;
        background-size: cover;
        border: 1px solid #ccc;
        border-radius: 3px;
        margin-top: 7px;
        width: 200px;
        height: 200px;
      }
      .cropit-preview-image-container {
        cursor: move;
      }
      .image-size-label {
        margin-top: 10px;
      }
      input, .export {
        display: block;
      }

@font-face {
    font-family: "Nirmala";
    src: url(/dist/font/NirmalaB.ttf) format("truetype");
}

@media (max-width: 767px) {
    .main-sidebar,
    .left-side {
        padding-top: 60px
    }
    .separadorv {
        padding-left: 0px;
        border-left: 0px solid rgba(0, 0, 0, 0.2);
        margin-top: 0px;
}   
    .btnEllipse {
    height: 45px !important;
    width: 45px !important;
    min-width: 45px;
    border-radius: 50%;

}
    .btnEllipse .fa {
    padding: 8px;
}
    .btnEllipse p {
    display: none;
}
    .orange {
    background-color: #00A4FF !important;
    color: white !important;
}
}

      
.select2-container--default .select2-selection--single {
    background-color: #fff;
    border: 1px solid #D2D6DE;
    border-radius: 0;
    height: 34px;
    margin-top: 1px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #56565B;
    line-height: 32px;
}
            
.select2-container--default .select2-selection--single .select2-selection__arrow b {
       
    margin-top: 3px;
        
}



/* 
    Autor: Juan Donis
    Fecha: 17/05/2016
    Sinopsis: FIX PARA ERROR DE ALLOWCLEAR DE SELECT2 EN CAMPOS PEQUEÑOS O TEXTOS LARGOS
*/

.select2-selection__clear {
    position: absolute !important;
    right: 20px !important;
}

.select2-container .select2-selection--single .select2-selection__rendered {
    padding-left: 0;
    padding-right: 8px;    
}



/* 
    Autor: Juan Donis
    Fecha: 17/05/2016
    Sinopsis: FIX PARA ERROR DE BOTONES EN FOOTER DE MODAL
*/
.modal-footer .btn+.btn {
    margin-bottom: 5px;
    
}

#btnCargarReporte{
    min-width: 8px;
    background-color: rgb(3, 169, 250);
}


.box-circle {
    background: #15b715;
    border-radius: 1em;
    -moz-border-radius: 1em;
    -webkit-border-radius: 1em;
    color: #ffffff!important;
    display: inline-block;
    font-weight: bold;
    line-height: 2em;
    margin-right: 5px;
    text-align: center;
    width: 2em;
}

.error{
    border: 1px solid red;
}

td strong {
    margin: 0px;
}

textarea {
    background-color: white !important;
}

/* CSS de AUDITORIA */

.col-xs-15 {
    width: 20%;
    float: left;
}
    
    
.small-box:hover .icon {
    font-size: 75px;
}
.small-box h3, .small-box p {
    color: white;
}
@media (min-width: 768px) {
    .col-sm-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 992px) {
    .col-md-15 {
        width: 20%;
        float: left;
    }
}
@media (min-width: 1200px) {
    .col-lg-15 {
        width: 20%;
        float: left;
    }
} 


/* CSS de BOLETIN */

.table-scroll{
  height: 350px !important;
}

/* CSS de CONFVENDEDOR y CONSDOC */

.toggle.btn
{
    min-width: 59px;
    min-height: 30px;
    margin-top: 24px;
}

/* CSS de FOTOGRAFIAS */

.table > caption + thead > tr:first-child > td, .table > caption + thead > tr:first-child > th, .table > colgroup + thead > tr:first-child > td, .table > colgroup + thead > tr:first-child > th, .table > thead:first-child > tr:first-child > td, .table > thead:first-child > tr:first-child > th {
    text-align: center;
}

/******************************* CODIGOS TABLA CON HEADER FIJO *******************************************/

/*
Force table width to 100%
*/
 table.table-fixed {
    width: 100%;   
}
/*
Set table elements to block mode.  (Normally they are inline).
This allows a responsive table, such as one where columns can be stacked
if the display is narrow.
*/
 table.table-fixed, table.table-fixed>thead, table.table-fixed>tbody, table.table-fixed>thead>tr, table.table-fixed>tbody>tr, table.table-fixed>thead>tr>th, table.table-fixed>tbody>td {
    display: block;
}
table.table-fixed>thead>tr:after, table.table-fixed>tbody>tr:after {
    content:' ';
    display: block;
    visibility: hidden;
    clear: both;
}
/*
When scrolling the table, actually it is only the tbody portion of the
table that scrolls (not the entire table: we want the thead to remain
fixed).  We must specify an explicit height for the tbody.  We include
100px as a default, but it can be overridden elsewhere.

Also, we force the scrollbar to always be displayed so that the usable
width for the table contents doesn't change (such as becoming narrower
when a scrollbar is visible and wider when it is not).
*/


/*
We really don't want to scroll the thead contents, but we want to force
a scrollbar to be displayed anyway so that the usable width of the thead
will exactly match the tbody.
*/
 table.table-fixed>thead {
    overflow-y: hide;
    padding-right: 15px;
}
/*
For browsers that support it (webkit), we set the background color of
the unneeded scrollbar in the thead to make it invisible.  (Setting
visiblity: hidden defeats the purpose, as this alters the usable width
of the thead.)
*/
 table.table-fixed>thead::-webkit-scrollbar {
    background-color: inherit;
}


table.table-fixed>thead>tr>th:after, table.table-fixed>tbody>tr>td:after {
    content:' ';
    display: table-cell;
    visibility: hidden;
    clear: both;
}

/*
We want to set <th> and <td> elements to float left.
We also must explicitly set the width for each column (both for the <th>
and the <td>).  We set to 20% here a default placeholder, but it can be
overridden elsewhere.
*/

table.table-fixed>tbody tr td {
    float: left;    
    word-wrap:break-word;     
}

 table.table-fixed>thead tr th{
    float: left;
 }

/*table.table-fixed td{
    margin-left: 5px;
    margin-right: 5px;
}*/

table.table-fixed>tbody td {
   /* overflow-x: auto;*/
   /* display: block; */   
    
}

/*@media (max-width: 768px)
.table {
    width: 100%;
    margin-bottom: 15px;
    overflow-x: scroll;
    overflow-y: hidden;
    border: none;
    -ms-overflow-style: -ms-autohiding-scrollbar;
    -webkit-overflow-scrolling: touch;
}*/

@media screen and (max-width: 400px) {
    .table-responsive{
        overflow-x: auto;
        display: block;
    }
}
 
/******************************* FIN DE CODIGOS TABLA CON HEADER FIJO *******************************************/

/* Footer */

footer > .pull-right {
    margin-top: 15px;
}

input[type=number]::-webkit-outer-spin-button,
input[type=number]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}

input[type=number] {
    -moz-appearance:textfield;
}

.sidebar-menu, .main-sidebar .user-panel, .sidebar-menu > li.header {
    white-space: none;
    font-family: "Roboto","Segoe UI","Helvetica";
}