* {
    margin: 0px;
    padding: 0px;
}

.container {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100vh;
    flex-direction: row; 
}

.container img {
    width: 200px;
    transition: all 0.3s;
    margin: 50px;
    cursor: pointer;
}

.container img:hover {
    scale: 2;
    border-radius: 40px;
    opacity: 0.4;
}

@media screen and (max-width: 440px) {
    .container {
        display: flex;
        align-items: center;
        justify-content: center;
        flex-direction: column; /* Cambia a orientación vertical */
        margin-top: 20px; /* Añade margen superior */
    }

    .container img {
        margin: 10px 0; /* Da espacio entre imágenes en vertical */
    }

    .container img:hover{
        scale: 1.2;
        border: 20px;
        opacity: 0.8;
    }
}