body{
    background:#FAFAFA;
}
.order-card {
    color: #fff;
}

.bg-c-blue {
   background: #1775E5;
}

.bg-c-green {
    background: #21BF97;
}

.bg-c-yellow {
   background: #FFA151;
}

.bg-c-pink {
   background: #ED5D7F;
}

.card {
    border-radius: 5px;
    -webkit-box-shadow: 0 1px 2.94px 0.06px rgba(4,26,55,0.16);
    box-shadow: 0 1px 2.94px 0.06px rgba(4,26,55,0.16);
    border: none;
    margin-bottom: 30px;
    -webkit-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}

.btn-default {
    background-color: #f4f4f4;
    border-color: #ddd;
}

.card{
    padding: 25px;
}

.order-card i {
    font-size: 26px;
}

.f-left {
    float: left;
}

.f-right {
    float: right;
}

.categoria{
    border-radius: 8px;
    font-size: 16px;
    box-shadow: 0 1px 2.94px 0.06px rgba(4,26,55,0.16);
    margin-bottom: 15px;
}
.middle{
    display: flex;
    display: block;
    justify-content: center;
    align-self: center;
}
.d-front{
  z-index:2; /*El z-index es mayor al de la caja azul por lo que se muestra primero que la caja roja*/
  left:8px;
  top:100px;
}
.icon-add-producto{
    color: #63CA44; 
    font-size: 32px;
}
.center{
  padding: 5px 0;
}

td{
    padding: 3px;
}

.th-w{
    width: 16%;
}

.middle {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

.p-nombre{
    font-size: 19px;
}

.h-input{
    height: 30px;
}

.td-no-border{
 border:none;
 border-color: white;
}

.form-control, .btn{
    outline: 0 none !important;
    box-shadow: none !important;
}

.btn-flotante {
    font-size: 16px; /* Cambiar el tamaño de la tipografia */
    color: #ffffff; /* Color del texto */
    border-radius: 5px; /* Borde del boton */
    position: fixed;
    bottom: 25px;
    right: 25px;
    transition: all 300ms ease 0ms;
    box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.1);
    z-index: 99;
}
.btn-flotante:hover {
    box-shadow: 0px 15px 20px rgba(0, 0, 0, 0.3);
    transform: translateY(-7px);
    text-decoration: none;
    color: white;
}

.a-new-cliente:hover{
    cursor: pointer;
}

.table td, .table th {
   
    vertical-align: middle; 
   
}

#thead{
    border-style: none;
}
.btn-filter{
    border-radius: none;
}

.w-td{
    width: 150px;
}

.input-precio{
     -webkit-appearance: textfield !important;
    margin: 0;
    -moz-appearance:textfield !important;
}

.leido{
    
}

.recordatorio{
    background-color: #EAFAF1;
}

.recordatorio:hover{
    border-left: solid 4px;
    border-color: #47A2F7;
    cursor: pointer;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);
}

.recordatorio-leido{
    background-color: #F8F9F9;
}

.recordatorio-leido:hover{
    border-left: solid 4px;
    border-color: #47A2F7;
    cursor: pointer;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.8);
}

.dashboard{
    width:100%;
    height: 100vh;
}

iframe{
    width: 100%;
    height: 100vh;
}

.embed_movil{
   padding-right: 0px;
   margin-left: 10px;
}
#tabla{
    display: block;
    overflow-x: auto;
    white-space: nowrap;
}
.bg-nav{
    background-color: #1775E5 !important;
}

#btn-orange{
    background: #FFA151;
}

#btn-blue{
   border-color: #1775E5;
   color: #1775E5;
}

#btn-blue:hover{
   background-color: #1775E5;
   color: white;
}

#btn-blue:active{
   background-color: #1775E5;
   color: black;
}

.btn-blue{
   background-color: #1775E5; 
}

#date-orange{
    background: rgba(255, 161, 81, 0.15);
}

#fecha_hasta{
    background: rgba(255, 161, 81, 0.15);
}

#fecha_de{
    background: rgba(255, 161, 81, 0.15);
}

    
#leidos{
   background-color: #FFA151; 
}

#leidos2{
   background-color: #1775E5; 
}
#filtros{
    align-items: center;
}

.tablas{
    border-radius: 25px;
    background-color: #012C67;
}

.tabla-details{
    border-radius: 10px;
    background: rgba(255, 161, 81, 0.15);
}

#fila:hover{
    background: rgba(275, 205, 155, 0.25);
    cursor: pointer;
}

#saludo{
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 48px;
    margin-bottom: 0px;
    padding: 0px;
    /* identical to box height */

    color: #1775E5;
}

.text-blue{
    color: #1775E5;
}

@media only screen and (min-width: 776.0px) and (max-width: 992.0px) {


.container{
    max-width: 880px;
}


}



.file-upload { overflow: hidden; position: relative; text-align: center; cursor: pointer; }
.file-upload:hover{ opacity: .5; }
.file-upload > input {top: 0px; bottom: 0px; left: 0px; right: 0px; width: 100%; height: 100%; position: absolute; cursor: pointer; opacity: 0; }