.centro {
    min-height: calc(100svh - 100px);
    padding-top: 1rem;
}

footer div {    
    display: flex;
    color: white;
    flex-direction: row;
    justify-content: space-evenly;
    flex-wrap: nowrap;
}

.contenido-card {
    display: flex;    
    flex-direction: row;
    justify-content: space-evenly;
    flex-wrap: nowrap;
    column-gap: 1rem;    
}

.card-destacado {
    text-align: center;
    font-size: 1.7em;
    font-weight: bold;
    padding-bottom: 1rem;
    color: aliceblue;
}

label {
  font:
    1rem 'Fira Sans',
    sans-serif;
}

input {
  margin: 0.4rem;
}

#perfil { display: none;}

.h2 { border-bottom: 1px solid black;}

label { font-weight: bold;}

input[type=text], input[type=email], input[type=password] { width: 15vw; border-color: black;}
input[type=date]  { width: 100%; border-color: black;}
input.inputMedicion { width: 100%!important;}

@media screen and (max-width: 450px) {
    input[type=text], input[type=email], input[type=password] { width: 90%;}
    input[type=date]  { width: 70%;}  
    
    #cajaIndex { display: flex
        ;
                flex-direction: column-reverse;
                align-content: center; }
}

.cajainput {
    display: flex !important;
        align-content: center;
        flex-direction: row;
        flex-wrap: wrap;
        justify-content: center;
        align-items: baseline;
}


.chart-container {
    width: 300px;
    height: 300px;
    position: relative;
    margin: auto;
}
.needle {
    position: absolute;
    top: 32%;
    left: 50%;
    width: 4px;
    height: 40%;
    background: black;
    transform-origin: bottom;
    transform: rotate(0deg);
    transition: transform 1s ease-in-out;
}