#secciones {
    margin: auto;
}

/* Estilos comunes para los elementos flotantes */
#orbitas,
#cometas,
#sistemasol,
#tiropara,
#lanzamiento,
#hidrodinamica {
    width: 400px; /* Ajusté el ancho para tener espacio suficiente entre los elementos */
    height: 300px;
    background-repeat: no-repeat;
    background-size: 100% 100%;
    border-radius: 30px;
    margin-top: 5%;
    margin-bottom: 1%;

    margin-left: 7%;
    transition: opacity 0.3s ease; /* Para la animación de hover */
    float: left;  /* Cambié de 'right' a 'left' para alinearlos a la izquierda */
}

/* Asegurando que los elementos flotantes se alineen bien y no se desborden */
#orbitas,
#cometas,
#sistemasol,
#tiropara {
    margin-right: 4%; /* Espacio entre cada elemento flotante */
}

#lanzamiento {
    margin-left: 1%; /* Ajuste de margen para no solapar */
}

/* Especificaciones de cada sección */
#orbitas {
    background-image: url('../img/Secciones/Simulaciones/Órbitas.jpg');
}

#cometas {
    background-image: url('../img/Secciones/Simulaciones/Cometa.jpg');
}

#sistemasol {
    background-image: url('../img/Secciones/Simulaciones/Sistema_solar.jpg');
}

#tiropara {
    background-image: url('../img/Secciones/Simulaciones/Tiro_parabólico.png');
}

#lanzamiento {
    background-image: url('../img/Secciones/Simulaciones/Lanzamiento_de_cohetes.jpg');
    margin-left: 7%;
    margin-bottom: 5%;
}

#hidrodinamica {
    background-image: url('../img/Secciones/Simulaciones/hidrodinamica2D.jpeg');
    margin-left: 7%;
    margin-bottom: 5%;
}

/* Efecto hover: disminuye la opacidad */
#orbitas:hover,
#cometas:hover,
#sistemasol:hover,
#tiropara:hover,
#lanzamiento:hover,
#hidrodinamica:hover {
    opacity: 0.8;
}

/* Estilos comunes para los textos superpuestos */
#txtorbitas,
#txtcometas,
#txtsistemasol,
#txttiropara,
#txtlanzamiento,
#txthidrodinamica {
    width: 100%; /* Ocupa el 100% de la anchura de su contenedor */
    color: white;
    font-size: xx-large;
    font-weight: bold;
    margin-top: 1%;
    height: 5%;
    border-radius: 30px;
}

/* Estilos específicos para los textos de tiropará y órbitas */
#txttiropara,
#txtorbitas {
    color: black;
}

/* Clase clearfix para evitar que los elementos flotantes desborden el contenedor */
.clearfix {
    clear: both;
}
