/**
 * Css para adaptar los estilos de la plantilla INSPINIA
 *
 * Created on : 01-mar-2017
 * Author     : sergiovalera
 */

/** 
 * Estilos genéricos
 */
#wrapper {
    overflow-x: visible;
}

div.clear {
   clear: both;
}

a {
    color: #af272f;
}

a:hover {
    color: #8e0e14;
}

/**
 * Contenedor central
 */
#page-wrapper {
    padding-bottom: 15px;
}

.container {
    width: 100%;
}

.ibox-content {
    padding-left: 0;
    padding-right: 0;
}

/* Color corporativo */
.corporativo {
   color: #01135d;
}

/* Amarillo */
/*#ffcd00*/

.bg-corporativo {
    background-color: #01135d;
}

/**
 * Botones
 */
.btn-primary {
    background-color: #01135d;
    border-color: #01135d;
    color: #ffcd00;
    font-weight: bold;
}

.btn-primary:focus,
.btn-primary:hover,
.btn-primary:active,
.btn-primary:active:focus, 
.btn-primary:active:hover {
    background-color: #da091e;
    border-color: #da091e;
    color: #ffcd00;
}

/* Botón activo */
.btn-primary.active, 
/*.btn-primary:active:hover,*/
.btn-primary.active:hover, 
.btn-primary.active:focus {
    background-color: #ffcd00;
    border-color: #da091e;
    color: #da091e;
    cursor:auto;
}

.btn-primary.disabled, .btn-primary.disabled:hover, .btn-primary.disabled:focus, .btn-primary.disabled:active, .btn-primary.disabled.active, 
.btn-primary[disabled], .btn-primary[disabled]:hover, .btn-primary[disabled]:focus, 
.btn-primary[disabled]:active, .btn-primary.active[disabled] {
    background-color: #af272f;
    border-color: #af272f;
}

.btn-label-left {
    margin-right: 5px;
}

.btn-label-right {
    margin-left: 5px;
}

.btn span  {
    margin-left: 5px;
}

/**
 * Alertas
 */
.alert {
    /*padding: 8px 12px;*/
    border-radius: 1px;
}

@media (max-width: 800px) { 
    .alert.pull-right {
        float: left !important;
        margin: 0 !important;
    }
}    

/**
 * Errores en formularios
 */
.has-error .form-control, .has-error .form-control:focus {
    border-color: #ce8483 !important;
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset, 0 0 6px #ce8483;
}

.form-control:focus,
.single-line:focus {
    border-color: #8c97a1 !important;
}

/**
 * Loader
 */
.sk-spinner-wave.sk-spinner {
    margin: 0;
}

.sk-spinner-wave div {
    background-color: #af272f;
}

/**
 * Barra de progreso 
 */
.pace .pace-progress {
    background-color: #ffcd00;
}

/* ------------------------------------------------------- */
/**
 * MARGINS & PADDINGS
 *
 * Nota: Seguimos la nomenclatura del tema
 */
.p-none {
    padding: 0 !important;
}

.p-t-none {
    padding-top: 0;
}
.p-b-none {
    padding-bottom: 0;
}

/* ------------------------------------------------------- */
/**
 * Divs como tablas
 */
.grid [class^="col-"] {
  /*padding-top: 10px;
  padding-bottom: 10px;
  margin: 0;*/
  /*font-size: 14px;*/
  margin-bottom: 15px;
}

.grid.border [class^="col-"] {
    border: 1px solid #ddd;
}

.grid .odd {
    background-color: #eee !important;
}

/* ------------------------------------------------------- */
/**
 * Navbar
 */
.top-navigation .navbar-wrapper {
    background-color: #01135d;
    color: #ffcd00;
}

.top-navigation .navbar-wrapper a {
    color: #ffcd00;
}

.navbar-wrapper .welcome-message {
    display:block;
    font-size: 150%;
}

.navbar-wrapper .welcome-message small {
    font-size: 0.7em;
}

@media (max-width: 500px) {
    .navbar-wrapper .welcome-message {
        margin-top: 15px;
    }
}

@media (min-width: 320px) and (max-width: 500px) {
    .navbar-wrapper .welcome-message {
        float: left !important;
        width: 75%;
    }
}

.navbar-wrapper .custom-link {
    float: right;
    margin-left: 15px;
    margin-top: 15px;
}

/* ------------------------------------------------------- */
/**
 * Formulario de login 
 */
.login-container {
    padding-top: 50px;
}

@media (max-width: 600px) {
    .login-container {
        padding-top: 20px;
    }    
}

.login-container .logo-name {
    margin: 0 auto;
    width: 250px;
}

@media (max-width: 600px) {
    .login-container .logo-name {
        width: 150px !important;
    }
}

.logo-name img {
    width: 100%;
}

.login-container.loginColumns .ibox-content {
    border-top: none;
}

.login-container h1, .login-container h2, .login-container h3, .login-container h4 {
    color: #af272f;
    text-align: left;
}

.login-container h2.text-center {
    text-align: center;
}

/* ------------------------------------------------------- */
/**
 * Información de usuario
 */
.info-img {
    width: 120px;
    float: left;
}

.info-datos {
    float: left;
    padding: 20px;
}

/* ------------------------------------------------------- */
/**
 * Tablas
 */
.table-striped > tbody > tr:nth-of-type(2n) {
    background-color: #f9f9f9;
}

.table-striped > tbody > tr:nth-of-type(2n+1) {
    background-color: #ffffff;
}

table.dataTable thead .sorting,
table.dataTable thead .sorting_asc::after,
table.dataTable thead .sorting_desc,
table.dataTable thead .sorting_asc_disabled,
table.dataTable thead .sorting_desc_disabled {
    background-color: #f5f5f6;
}

.table > thead > tr > th, .table > tbody > tr > th, .table > tfoot > tr > th,
.table > thead > tr > td, .table > tbody > tr > td, .table > tfoot > tr > td {
    /*padding: 5px;*/
}

th.td-acciones {
    min-width: 75px !important;
}

/**
 * Tabla de promociones
 */
#tabla-promociones .cart-product {
    width: 80px;
    height: auto;
    padding-top: 0;
    margin: 0 auto;
}

#tabla-promociones input.form-control {
    max-width: 75px;
    min-width: 50px;
}

#tabla-promociones .badge {
    font-size: 16px;
}

/* ------------------------------------------------------- */
/**
 * Formulario de checkout
 */
#form-checkout .titulo {
    padding: 10px 0;
}

#form-checkout .titulo h2 {
    float: left;
}

#form-checkout .ibox-content {
    padding-bottom: 10px;
}

#form-checkout .text-navy {
    color: #af272f;
}

#form-checkout .cart-product {
    max-width: 250px;
    height: auto;
    padding-top: 0;
}
#form-checkout .fila {
    margin: 0;
    padding-bottom: 0;
}

#form-checkout .fila .label {
    font-size: 12px;
}

#form-checkout .grid input.form-control {
    max-width: 70px;
}
 
@media (max-width: 360px) { 
    
    #form-checkout .grid input.form-control {
        max-width: 100%;
    }
}

#form-checkout .num-cajas {
    float: right;
    margin-bottom: 15px;
    max-width: 120px;
}

#form-checkout .del-item {
    padding: 0;
    text-align: right;
}

@media (max-width: 360px) { 
    #form-checkout .del-item {
        float: left !important;
        margin: 0 0 20px !important;
    }
}    
    
@media (max-width: 800px) { 
    #form-checkout .num-cajas {
        float: left !important;
        margin-bottom: 15px;
    }
    
    #form-checkout .del-item {
        float: right;
        margin: 20px;
    }
}

@media (max-width: 480px) {
    #form-checkout button.pull-right {
        float: left !important;
        margin-bottom: 5px;
    }
}

/* ------------------------------------------------------- */
/**
 * Detalle de pedido
 */
#tabla-detalle .cart-product {
    width: 150px;
    height: auto;
    padding-top: 0;
    text-align: center;
    float: left;
}

#tabla-detalle .cart-product img {
    margin-bottom: 10px;
}

#tabla-detalle .nombre-product {
    display: inline-block;
    float: left;
}

#tabla-detalle .nombre-product .text-navy {
    color: #af272f;
}

@media (max-width: 480px) {
    #tabla-detalle .nombre-product .text-navy {
        font-size: 14px;
    }
}

@media (max-width: 480px) {
    #detalle-order .btn.pull-right {
        float: left !important;
    }
}

/* ------------------------------------------------------- */
/**
 * Tablas: ancho de columnas
 */
table th.col-5 {
    width: 5% !important;
}

table th.col-10 {
    width: 10% !important;
}

table th.col-12 {
    width: 12% !important;
}

table th.col-15 {
    width: 15% !important;
}

table th.col-20 {
    width: 20% !important;
}

table th.col-25 {
    width: 25% !important;
}

table th.col-30 {
    width: 30% !important;
}

table th.col-35 {
    width: 35% !important;
}

table th.col-40 {
    width: 40% !important;
}

table th.col-45 {
    width: 45% !important;
}

table th.col-50 {
    width: 50% !important;
}

/**
 * Clockpicker
 */
.input-group.clockpicker {
    padding: 4px;
    
}

/**
 * Campos fecha y hora
 */
div[class^="col-"].fecha {
    max-width: 200px;
}

div[class^="col-"].hora {
    max-width: 150px;
}

/* ------------------------------------------------------- */
/**
 * Mensajes de información/error
 */
.mensaje.widget h2, .mensaje.widget h3 {
    margin: 20px 0;
}

.mensaje small {
    font-size: 100%;
}

/**
 * Block UI (para el mensaje de Cargando...)
 */
.blockUI.blockOverlay {
    background-color: rgba(0, 0, 0, 0.4) !important;
    opacity:         1.24;
}

/* Copiamos los estilos de sweet alert */
.blockUI.blockMsg {
    background-color: #333 !important;
    border: medium none !important;
    border-radius: 10px;
    color: #fff !important;
    left: 50% !important;
    margin-left: -220px !important;
    margin-top: -150px !important;
    opacity: 0.8;
    overflow: hidden !important;
    padding: 15px !important;
    position: fixed !important;
    top: 50% !important;
    width: 400px !important;
}

.blockui-spiner {
    height: 100px;
    padding: 25px 0;
}

.blockui-spiner .sk-spinner {
    margin: 0 auto;
}

/* ------------------------------------------------------- */
/**
 * Sweep alert de mantenimiento
 */
.sweet-alert.swal-maintenance {
    margin-top: -300px !important;
}

.sweet-alert.swal-maintenance .sa-icon.sa-custom {
    height: 150px !important;
    width: 150px !important;
}

/* ------------------------------------------------------- */
/**
 * Footer
 */
footer, .footer {
    position: relative;
}

/* ------------------------------------------------------- */
/**
 * Chosen (select)
 */
.chosen-container.chosen-container-single {
    font-size: 14px;
}

.chosen-container.chosen-container-single .chosen-single {
    padding: 6px 8px;
}

.chosen-container.chosen-container-single.chosen-container-active.chosen-with-drop .chosen-single {
    border: 1px solid #af272f;
}

.chosen-container.chosen-container-single .chosen-drop .active-result.highlighted {
    background-color: #af272f;
    color: #ffcd00;
    font-weight: bold;
}


.parpadea {
  
  animation-name: parpadeo;
  animation-duration: 1s;
  animation-timing-function: linear;
  animation-iteration-count: infinite;

  -webkit-animation-name:parpadeo;
  -webkit-animation-duration: 1s;
  -webkit-animation-timing-function: linear;
  -webkit-animation-iteration-count: infinite;
}

@-moz-keyframes parpadeo{  
  0% { opacity: 1.0; }
  50% { opacity: 0.0; }
  100% { opacity: 1.0; }
}

@-webkit-keyframes parpadeo {  
  0% { opacity: 1.0; }
  50% { opacity: 0.0; }
   100% { opacity: 1.0; }
}

@keyframes parpadeo {  
  0% { opacity: 1.0; }
   50% { opacity: 0.0; }
  100% { opacity: 1.0; }
}

.buttonLink {
  font-size: 15px;
  text-decoration: none;
  background-color: #EEEEEE;
  color: #333333;
  padding: 2px 6px 2px 6px;
  border-top: 1px solid #CCCCCC;
  border-right: 1px solid #333333;
  border-bottom: 1px solid #333333;
  border-left: 1px solid #CCCCCC;
}

/*
  DESEOS
*/

.url-deseos{
    white-space: -moz-pre-wrap !important;  /* Mozilla, since 1999 */
    white-space: -webkit-pre-wrap;          /* Chrome & Safari */ 
    white-space: -pre-wrap;                 /* Opera 4-6 */
    white-space: -o-pre-wrap;               /* Opera 7 */
    white-space: pre-wrap;                  /* CSS3 */
    word-wrap: break-word;                  /* Internet Explorer 5.5+ */
    word-break: break-all;
    white-space: normal;
}



/*
BUSCADOR DE MODELOS
*/

.typeahead.dropdown-menu{
    width: 150%!important;
    max-height: 300px;
    overflow-y: auto;
}

.typeahead.dropdown-menu .active .dropdown-item{
    background: #01135d!important;
}


#autoBusquedaModelo{
   
 }