/*************************************************************************************/
/*ESTILOS PARA EL INDEX*/

/*Contenedor padre*/
.contenedor-padreHome {
    display: flex;            /* Usar Flexbox */
    flex-wrap: wrap;          /* Permite que los elementos se ajusten en múltiples filas */
    justify-content: center;  /* Centra los elementos horizontalmente */
    gap: 100px;                /* Espacio entre los contenedores */
    margin-top: 60px;         /* Espacio desde arriba */
}

/*************************************************************************************/
/*Descripción de la home*/
.descripcion-home {
    max-width: 1000px;
    margin: 15px auto 0 auto;
    border: 1px solid #cfcfcf;
    border-radius: 10px;
    padding: 20px;
    font-size: 1.5rem;
    line-height: 1.8;
}

/*************************************************************************************/
/*Contendor de las imagenes con estilos comunes*/
.contenedor {
    width: 400px;
    height: 400px;
    border-radius: 10px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    transition: transform 0.25s ease,
                box-shadow 0.25s ease;
}

.contenedor:hover {

    transform: scale(1.02);

    box-shadow: 0 4px 12px rgba(0,0,0,0.20);
}

/*************************************************************************************/
/*Contenedores de las imagenes para añadir cada una*/
.contenedorBasico {
    background-image: url('../imagenes/ManejoVariables.png');
}

.contenedorCondicionales {
    background-image: url('../imagenes/EjerciciosCondicionales.png');
}

.contenedorBucles {
    background-image: url('../imagenes/EjerciciosBucles.png');
}