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

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

textarea {
    resize: vertical;
}

.btnarbell {
    background-color: rgba(255, 133, 27, 1) !important;
    color: #fff !important;
}

.btnarbell:hover {
    background-color: rgba(255, 133, 27, 0.65) !important;
}

.prod_image img {
    max-width: 100% !important;
    background-color: #ccc;
}

.imagen_cat {
    max-width: 100%;
    width: 100%;
}

.imagen_cat_min {
    max-width: 50px;
    width: 100%;
}

.txt_efefef {
    color: #efefef !important;
}

.txt_dddddd {
    color: #dddddd !important;
}

.txt_CCC {
    color: #ccc !important;
}

.txt_24AA7A {
    color: #24aa7a !important;
}

.txt_blue {
    color: #3c8dbc !important;
}

.txt_fff {
    color: #fff !important;
}

.txt_fff:hover {
    color: #444 !important;
}

/** FIXED TABLE - AGREGA SCROLL VERTICAL A LA TABLA **/

.table-fixed thead {
    width: 97%;
}

.table-fixed tbody {
    height: 230px;
    overflow-y: auto;
    width: 100%;
}

.table-fixed thead,
.table-fixed tbody,
.table-fixed tr,
.table-fixed td,
.table-fixed th {
    display: block;
}

.table-fixed tbody td,
.table-fixed thead > tr > th {
    float: left;
    border-bottom-width: 0;
}

.padding-5-xs {
    padding-right: 5px !important;
    padding-left: 5px !important;
}

/** FIXED TOP BAR - CORRIGE LA ELIMINACION DE LA BARRA SUPERIOR EN MOBILE **/
@media (max-width: 768px) {
}

@media (max-width: 767px) {
    .main-sidebar,
    .control-sidebar,
    .left-side {
        padding-top: 50px !important;
    }

    .fixed .content-wrapper,
    .fixed .right-side {
        padding-top: 50px !important;
    }
}

.register-page {
    background-image: url("../img/fondo-extranet.jpg");
    background-position: center center;
    background-repeat: no-repeat;
}

@media (max-width: 879px) {
    .register-page {
        background-position: center top;
        background-repeat: repeat-y;
    }
}

/** ESTILOS DEL LOGIN CON FONDO **/
.box-row {
    width: 100%;
    padding: 0;
    vertical-align: top;
}

.box-cell,
.box-row {
    float: none;
}

.box-cell[class*=" col-md-"],
.box-cell[class*=" col-lg-"],
.box-cell[class*=" col-xl-"],
.box-cell[class*=" col-sm-"],
.box-cell[class^="col-md-"],
.box-cell[class^="col-lg-"],
.box-cell[class^="col-xl-"],
.box-cell[class^="col-sm-"] {
    display: block;
}

.logo_ext img {
    margin: auto !important;
    height: auto;
}

.box-login-logo {
    border-radius: 10px 0px 0px 10px;
}

@media (min-width: 768px) {
    .box-cell[class*=" col-md-"],
    .box-cell[class^="col-md-"] {
        display: table-cell;
    }
}

@media (max-width: 768px) {
    .logo_ext {
        padding: 10px;
        text-align: center;
    }

    .box-login-logo {
        border-radius: 10px 10px 0px 0px;
    }
}

.main-header .logo .logo-lg img {
    width: 100% !important;
}

.main-header .logo .logo-mini img {
    width: 50px !important;
}

.nav-tabs-custom > .nav-tabs > li {
    border-top-color: #ccc;
    background-color: #f9f9f9;
    border-radius: 3px 3px 0px 0px;
}

.nav-tabs-custom > .nav-tabs > li.active > a {
    color: #3c8dbc !important;
    font-weight: bold;
}

.nav-tabs-custom > .nav-tabs > li.pull-right {
    margin-right: 0px !important;
}

.nav-tabs-custom {
    background-color: transparent !important;
}

.nav-tabs-custom > .nav-tabs-red > li.active {
    border-top-color: #dd4b39 !important;
}

.nav-tabs-custom > .nav-tabs-red > li.active > a {
    color: #dd4b39 !important;
    font-weight: bold;
}

.nav-tabs-custom > .nav-tabs-yelow > li.active {
    border-top-color: #f39c12 !important;
}

.nav-tabs-custom > .nav-tabs-yelow > li.active > a {
    color: #f39c12 !important;
    font-weight: bold;
}

.nav-tabs-custom > .nav-tabs-black > li.active {
    border-top-color: #777676 !important;
}

.nav-tabs-custom > .nav-tabs-black > li.active > a {
    color: #777676 !important;
    font-weight: bold;
}

.nav-tabs-custom > .nav-tabs-maroon > li.active {
    border-top-color: #d81b60 !important;
}

.nav-tabs-custom > .nav-tabs-maroon > li.active > a {
    color: #d81b60 !important;
    font-weight: bold;
}
/******************* Stylish Button List **********************/
/* http://bootsnipp.com/snippets/featured/stylish-button-list */
.ds-btn li {
    list-style: none;
    float: left;
    padding: 10px;
}

.ds-btn li a span {
    padding-left: 15px;
    padding-right: 5px;
    width: 100%;
    display: inline-block;
    text-align: left;
}

.ds-btn li a span small {
    width: 100%;
    display: inline-block;
    text-align: left;
}

/**************************************************************/

/*******************BLOCK BUTTON ON MOBILE **********************/
/* http://stackoverflow.com/questions/28191573/change-buttons-to-btn-block-on-mobile-screen-size */

@media all and (max-width: 768px) {
    .btn-responsive-block {
        width: 100%;
        display: block;
        margin-bottom: 3px;
        border-radius: 0;
    }

    .btn-responsive-group {
        width: 100%;
        display: block;
    }
}

/* FIX- OCULTA PAGINACION DE FOOTABLE CUANDO LA PANTALLA ES XS */
.footable.breakpoint-xs ul.pagination li[data-page="first"],
.footable.breakpoint-xs ul.pagination li[data-page="last"],
.footable.breakpoint-xs ul.pagination li.footable-page {
    display: none;
}

/* FIN----FIX- OCULTA PAGINACION DE FOOTABLE CUANDO LA PANTALLA ES XS */

/* Hide dropdown button in footable-filtering-search */
.footable-filtering-search .btn.dropdown-toggle {
    display: none;
}

.footable-filtering-search .btn.btn-primary {
    border-top-right-radius: 3px !important;
    border-bottom-right-radius: 3px !important;
}

/* FIN Hide dropdown button in footable-filtering-search */

/*** PRODUCTOS DEL ISOTOPE.JS  ***/
.bg-white {
    background-color: #ffffff !important;
}

.section-box h4 {
    margin-top: 0px;
    min-height: 60px;
}

.section-box h4 a {
    font-size: 15px;
}

.separator {
    padding-right: 5px;
    padding-left: 5px;
}

.section-hr {
    margin-top: 0;
    margin-bottom: 5px;
    border: 0;
    border-top: 1px solid #eee;
}

/*** FIN PRODUCTOS DEL ISOTOPE.JS   ***/

/*** FIXED FOOTER PEDIDOS Y FACTURAS  ***/
.footer_fixed {
    position: fixed;
    bottom: 0px;
    right: 0px;
    left: 0px;
    /* z-index: 809; */
}
.footer_fixed_chevron {
    margin-bottom: 0px;
    margin-top: 8px;
}

.footer_pedido_color {
    border-top: 2px solid #3c8dbc !important;
}

.footer_factura_color {
    border-top: 2px solid#dd4b39 !important;
}

/*** FIN FIXED FOOTER PEDIDOS Y FACTURAS  ***/

/*** AGREGA SCROLL VERTICAL AL BODY DEL MODAL  ***/
.modal-body-scroll {
    max-height: calc(100vh - 212px);
    overflow-y: auto;
}

.modal-body-scroll-accordion {
    max-height: calc(100vh - 260px);
    overflow-y: auto;
}

/*** FIN AGREGA SCROLL VERTICAL AL BODY DEL MODAL  ***/

/*** AGREGA ESTILOS DE TEXTO A BOOTSTRAP 3 ***/
.text-white {
    color: #ffffff !important;
}
.text-recibido {
    color: #f5ce20 !important;
}
.text-aceptado {
    color: #f57e20 !important;
}

.text-encurso {
    color: #7e02db !important;
}

.text-normal {
    font-style: normal;
}

.text-bold {
    font-weight: bold;
}

.text-bold300 {
    font-weight: 300;
}

.text-bold400 {
    font-weight: 400;
}

.text-bold500 {
    font-weight: 500;
}

.text-italic {
    font-style: italic;
}

.text-min-line-heigth {
    line-height: 1.1 !important;
}

.margin-bottom-10 {
    margin-bottom: 10px;
}

.text-ellipsis {
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
    display: block;
    overflow: hidden;
}

.text-ellipsis-2lines {
    display: -webkit-box;
    max-width: 400px;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.input-xs {
    padding-top: 0px;
    padding-bottom: 0px;
    height: 24px;
    line-height: 24px;
}

.product-description-dd {
    margin-bottom: 10px;
    border-bottom: gainsboro solid thin;
    padding: 5px;
}

.bg-note {
    background-color: #fbe8aa;
}

.bg-recibido {
    background-color: #f5ce20 !important;
}
.bg-aceptado {
    background-color: #f57e20 !important;
}

.bg-encurso {
    background-color: #7e02db !important;
}
.bg-arbell {
    background-color: #0098d9 !important;
    color: #fff;
}

.box-title-filter {
    padding-left: 30px;
}

/*** FIN ESTILOS DE TEXTO A BOOTSTRAP 3 ***/

/*** AGREGA COLORES AL BOX***/
.box.box-maroon {
    border-top-color: #d81b60;
}

.box.box-orange {
    border-top-color: #ff851b;
}

/***FIN AGREGA COLORES AL BOX***/

/*** SELECTIZE INLINE-BLOCK***/
.selectize-inline-block {
    display: inline-block;
}

/*** FIN SELECTIZE INLINE-BLOCK***/

/*** BUTTON OVERLAY IMAGE ***/
.img-wrapper {
    position: relative;
}

.img-overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
}

.img-overlay:before {
    content: " ";
    display: block;
    /* adjust 'height' to position overlay content vertically */
    height: 80%;
}

/*** FIN BUTTON OVERLAY IMAGE ***/

.knob-widget {
    display: block;
    text-align: right;
    width: 50%;
    margin: 0 auto;
    padding-bottom: 10px;
    min-width: 220px;
}

.knob-widget-graph {
    float: left;
    padding-left: 10px;
    padding-right: 10px;
}

/*** REDUCE PADDING SI SE APLICA A GRILLA BOOTSTRAP**/
@media (max-width: 768px) {
    .padding-xs {
        padding-right: 10px;
        padding-left: 10px;
    }

    .padding-right-xs {
        padding-right: 5px;
    }

    .padding-left-xs {
        padding-left: 5px;
    }
}

/*** FIN REDUCE PADDING SI SE APLICA A GRILLA BOOTSTRAP**/

/*** AVATAR REVENDEDORES**/
.rev-img {
    border: 2px solid;
}

.rev-image-label {
    position: relative;
    top: 1px;
    right: 2px;
    text-align: center;
    font-size: 9px;
    padding: 2px;
    line-height: 0.9;
    display: inline-block;
}

.border-purple {
    border-color: #605ca8 !important;
}

.border-teal-active {
    border-color: #30bbbb !important;
}

.border-navy {
    border-color: #001f3f !important;
}
.border-light-blue {
    border-color: #3c8dbc !important;
}

.border-black {
    border-color: #111111 !important;
}

/*** FIN AVATAR REVENDEDORES**/

/*** AVATAR CONTACTOS**/
.img-contact {
    max-width: 80px;
    padding: 10px;
}
.img-contact-status {
    position: absolute;
    left: 5px;
    top: 5px;
}
.img-contact-fav-status {
    position: absolute;
    font-size: 10px;
    left: -2px;
    top: 8px;
}
/*** FIN AVATAR CONTACTOS**/

/*** AJUSTA ALINEACION DE TABLA BOOTSTRAP**/
.table > tbody > tr > td {
    vertical-align: middle;
}

table.footable > thead > tr > td.footable-sortable,
table.footable > thead > tr > th.footable-sortable,
table.footable > tbody > tr > td.footable-sortable,
table.footable > tbody > tr > th.footable-sortable,
table.footable > tfoot > tr > td.footable-sortable,
table.footable > tfoot > tr > th.footable-sortable {
    padding-right: 25px !important;
}

td.footable-sortable > span.fooicon,
th.footable-sortable > span.fooicon {
    margin-top: -5px !important;
}

/*** FIN AJUSTA ALINEACION DE TABLA BOOTSTRAP**/
/*** ANCHO MINIMO COLUMNA CHECK EN FOOTABLE **/
th.check {
    min-width: 60px;
}
/*** FIN ANCHO MINIMO COLUMNA CHECK EN FOOTABLE**/

/*** AJUSTA TEXTO DE ERRORES EN EL FORMULARIO**/
.help-block {
    font-style: italic;
    font-size: 12px;
    float: right !important;
    margin: 0px !important;
}

/*** FIN AJUSTA TEXTO DE ERRORES EN EL FORMULARIO**/
/* Cambiar color hover table */
/*
.table-hover tbody tr:hover td {
    background:  #ececff;
}
*/

.margin-top-bottom-6 {
    margin-bottom: 6px;
    margin-top: 6px;
}
@media print {
    .salto-hoja-impresion {
        break-after: page;
    }
}

/*** COLORES ROLES **/
:root {
    --color-rol-nivel-4: #076633;
    --color-rol-nivel-3: #1ab3a9;
    --color-rol-nivel-2: #9265a8;
    --color-rol-nivel-1: #e6007e;
    --color-rol-nivel-pre: #f4a76a;
    --color-rol-gold: #ffdd0e;
    --color-rol-silver: #9d9d9c;
    --color-rol-platinum: #97cbff;
    --color-rol-bronze: #e94e1a;
    --color-rol-pre-experta: #596e80;
    --color-rol-nulo: #777;
    --color-arbell: #0098d9;
}

/*** ROLES EXPERTAS**/
.bg-rol-platinum {
    background-color: var(--color-rol-platinum) !important;
}
.bg-rol-gold {
    background-color: var(--color-rol-gold) !important;
}
.bg-rol-silver {
    background-color: var(--color-rol-silver) !important;
}
.bg-rol-bronze {
    background-color: var(--color-rol-bronze) !important;
}
.bg-rol-pre-experta {
    background-color: var(--color-rol-pre-experta) !important;
}
.bg-rol-nulo {
    background-color: var(--color-rol-nulo) !important;
}

.color-rol-platinum {
    color: var(--color-rol-platinum) !important;
}
.color-rol-gold {
    color: var(--color-rol-gold) !important;
}
.color-rol-silver {
    color: var(--color-rol-silver) !important;
}
.color-rol-bronze {
    color: var(--color-rol-bronze) !important;
}
.color-rol-pre-experta {
    color: var(--color-rol-pre-experta) !important;
}
.color-rol-nulo {
    color: var(--color-rol-nulo) !important;
}
.color-arbell {
    color: var(--color-arbell) !important;
}
/*** ROLES LIDERES-INTEGRA**/
.bg-rol-nivel-4 {
    background-color: var(--color-rol-nivel-4) !important;
}
.bg-rol-nivel-3 {
    background-color: var(--color-rol-nivel-3) !important;
}
.bg-rol-nivel-2 {
    background-color: var(--color-rol-nivel-2) !important;
}
.bg-rol-nivel-1 {
    background-color: var(--color-rol-nivel-1) !important;
}
.bg-rol-nivel-pre {
    background-color: var(--color-rol-nivel-pre) !important;
}

.color-rol-nivel-4 {
    color: var(--color-rol-nivel-4) !important;
}
.color-rol-nivel-3 {
    color: var(--color-rol-nivel-3) !important;
}
.color-rol-nivel-2 {
    color: var(--color-rol-nivel-2) !important;
}
.color-rol-nivel-1 {
    color: var(--color-rol-nivel-1) !important;
}
.color-rol-nivel-pre {
    color: var(--color-rol-nivel-pre) !important;
}

.btn-canjear {
    color: #fff;
    background-color: #0098d9;
    border-color: #0098d9;
}
.btn-canjear:hover,
.btn-canjear:focus,
.btn-canjear:active,
.btn-canjear.active {
    color: #fff;
    background-color: #038ac4;
    border-color: #038ac4;
}
.slow-spin {
    -webkit-animation: fa-spin 20s infinite linear;
    animation: fa-spin 20s infinite linear;
}

/* ---------- MAPAS CON API GOOGLE ---------- */
#googleMap {
    width: 100%;
    height: 500px;
    margin: 10px auto;
}

/*output box*/
#output {
    text-align: center;
    margin: 20px auto;
}

#mode {
    color: black;
}