/* Add here all your CSS customizations */
.filtro {
    filter: grayscale(70%);
    transition: filter 0.3s ease;
}

.filtro:hover {
     filter: grayscale(0%);
     border: 0.5px solid #000;
     box-shadow: 0 0 10px rgba(0, 0, 0, 0.5);
}

.tarjetita {
   border: 1px solid #883939 !important;
   border-radius: 10px !important;
   transition-duration: 1s !important;
}

.tarjetita:hover {
    border: 2px solid #ce2020 !important;
    transition-duration: 1s !important;
}

/* Para celulares (ancho máximo de 600px) */
@media only screen and (max-width: 600px) {

    .logo
    {
        width: 80px !important;
        height: 50px !important;
    }
}

/* Para desktop (ancho mínimo de 1024px) */
@media only screen and (min-width: 601px) {
    .logo
    {
        width: 100px !important;
        height: 60px !important;
    }

}