html {
    height: 100%
}
body {
    font-family: 'DM Sans', sans-serif;
    height: 100%;
    margin: 0px;
    padding: 0px
}
.capitalize {
    text-transform: capitalize;
}

/* #over_map {
    position: absolute; 
    top: 0px;
    left: 0px;
    z-index: 99;
}  
#under_map {
    position: absolute;
    bottom: 0px;
    left: 0px;
    z-index: 99;
}
#botright_map {
    position: absolute;
    bottom: 0px;
    right: 0px;
    z-index: 99;
}
.angular-google-map-container {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 100%;
    width: 100%;
} */
.titulo{
    font-weight: 800;
}
.logo{
   
    height: 2rem;

}

/**Card general**/
.card-size{
    width: 100%;
    height: 100%;
}
/**Cards sizes**/
.card-container{
        /* Colors/Neutral/White */
        background: #FFFFFF;
        /* Divider/Light/1px - 60% */
        border: 1px solid rgba(228, 228, 228, 0.6);
        box-sizing: border-box;
        box-shadow: 0px 16px 16px rgba(187, 187, 187, 0.08);
        border-radius: 4px;
        width: 420px;
        height: 'auto';

}
.card-1{
    /* Colors/Neutral/White */
    background: #FFFFFF;
    /* Divider/Light/1px - 60% */
    border: 1px solid rgba(228, 228, 228, 0.6);
    box-sizing: border-box;
    box-shadow: 0px 16px 16px rgba(187, 187, 187, 0.08);
    border-radius: 4px;
    width: 420px;
    height: 'auto';
}
.card-2{
      /* Colors/Neutral/White */
      background: #FFFFFF;
      /* Divider/Light/1px - 60% */
      border: 1px solid rgba(228, 228, 228, 0.6);
      box-sizing: border-box;
      box-shadow: 0px 16px 16px rgba(187, 187, 187, 0.08);
      border-radius: 4px;
      width: 420px;
    height: auto;
}
.card-3{
    /* Colors/Neutral/White */
    background: #FFFFFF;
    /* Divider/Light/1px - 60% */
    border: 1px solid rgba(228, 228, 228, 0.6);
    box-sizing: border-box;
    box-shadow: 0px 16px 16px rgba(187, 187, 187, 0.08);
    border-radius: 4px;
    Width: 420px;
    Height: 300px;
}
.card-4{
    /* Colors/Neutral/White */
    background: #FFFFFF;
    /* Divider/Light/1px - 60% */
    border: 1px solid rgba(228, 228, 228, 0.6);
    box-sizing: border-box;
    box-shadow: 0px 16px 16px rgba(187, 187, 187, 0.08);
    border-radius: 4px;
    Width: 420px;
    Height: 250px;
}
.logoApp{
    height: 35px;
    padding-right:10px;
    padding-left: 10px;
    padding-bottom: 3px; 
}

/**Progreso **/
.progreso-size{
    height: 2rem;
} 
.progreso{
    font-style: normal;
    font-weight: bold;
    font-size: 20px;
    color: 'black';
    
}
.contenedor-datos{
   margin: 0.5rem 0.2rem 0 0.2rem;
}
.div-progreso-dos{
    margin: 0 0.5rem 0 0.5rem;
}
.borde{
    border: 0.5px solid rgba(228, 228, 228, 0.6);
}
.fecha-actualizacion{

    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    color: #999;
    text-align: right;
}
.color{
    color:#00C48C;
}
.hora{
    color: #17A6E9;
    margin-right: 1rem;
}
/**detalle orden**/
.align-right{
    text-align: right;
}
.orden{

    font-style: normal;
    font-weight: bold;
    font-size: 19px;
    line-height: 25px;
    color: #17A6E9;

}
.paquete{
    font-style: normal;
    font-weight: normal;
    font-size: 13px;
    line-height: 18px;
    color: #000000;
}
.id-treggo{
    font-size: 13px;
    line-height: 18px;
    color: #17A6E9;
}

/**Detalle destinatario**/
.destinatario-nombre{
    font-style: normal;
    font-weight: bold;
    line-height: 1.5rem;
    color: #000000;
}
.destino{
    font-style: normal;
    font-weight: bold;
    line-height: 1.5rem;
    color: #000000;
    text-align: left;
}
/**Historial de envío**/
.historial{
    font-style: normal;
    font-weight: bold;
    line-height: 1.5rem;
    color: #000000;
    text-align: left;
    margin-left: 0.5rem;
}


.fecha-style{
    font-weight: bold;
    font-size: 15px;
    line-height: 20px;
    color: #000000;
}
.fecha{
    margin: 0;
}

.status{
    text-align: right;
}

/**Actualizacion de seguimiento**/
.eta{
    width: 418px;
    height: 37px;
    border: 1px solid #17A6E9;
    box-sizing: border-box;
    filter: drop-shadow(0px 16px 16px rgba(183, 183, 194, 0.08));
    border-radius: 10px;
    position: relative;
    left: 0;
    top: 1rem;

}
.estilo{
    margin-left: 1rem;
    color: #17A6E9;
    font-weight: bold;
    font-size: 15px;
    
}
.font-size{
    font-size: 15px;
    font-weight: bold;
    margin-right: 1rem;
}

/**Courier Card**/
.foto-courier{
    border-radius: 100px;
    width: 75px;
}
.estado{
    color: #17A6E9;
    font-weight: bold;
    font-size: 20px;
}
/**Footer**/
footer{
    position: fixed;
    bottom: 0;
    left: 6rem;
}