index.css

.earth-img{
    align-items: center;
    width: 600px;
    height: 600px;
}

.hero {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 90vh;
    text-align: center;
}

.content {
    max-width: 572px;
}

.content h1 {
    font-size: 4em;
    margin: 0;
    text-align: left;
}

button {
    background-color: rgba(0, 0, 0, 0.2);
    border: none;
    padding: 10px 20px;
    color: white;
    font-size: 1.2em;
    cursor: pointer;
    margin-top: 20px;
    transition: background-color 0.3s;
    border-radius: 33;
}

button:hover {
    background-color: rgba(2, 8, 93, 0.4);
}

.floating-button {
    position: fixed;
    bottom: 20px;
    right: 20px;
    background-color: #007BFF; /* Color del botón */
    color: white;
    border: none;
    border-radius: 5px;
    padding: 15px 20px;
    font-size: 16px;
    cursor: pointer;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.3);
    transition: background-color 0.3s;
}

.floating-button:hover {
    background-color: #0056b3; /* Color del botón al pasar el ratón */
}
.container {
    position: relative; /* Para posicionar el GIF sobre el texto */
}

.texto-con-gif {
    color:#FFFF;
    font-size: 48px; /* Tamaño de la fuente */
    color: #ffffff; /* Color del texto */
    text-shadow: 2px 2px 5px rgba(0, 0, 0, 0.5); /* Sombra del texto */
    position: relative; /* Para asegurar que el texto esté en el nivel correcto */
}

.gif-superpuesto {
    position: absolute;
    top: 0; /* Ajusta según necesites */
    left: 0; /* Ajusta según necesites */
    width: 700px; /* Ajusta el tamaño del GIF */
    height: 700px; /* Mantiene la proporción del GIF */
    opacity: 0.7; /* Ajusta la opacidad del GIF */
}

button {
    padding: 10px 20px;
    font-size: 16px;
    cursor: pointer;
}

.earth-title {
    color: white;
    font-family: Jockey One;
    font-size: 120px;
    font-weight: 400;
    line-height: 100px;
    text-align: left;
}

.explore-button {
    width: 235px;
    gap: 0px;
    border-radius: 41px;
    opacity: 0px;

    background: rgba(217, 217, 217, 0.3);
    border: 0.2px solid;
    border-image-source: linear-gradient(180deg, rgba(255, 255, 255, 0.25) 0%, #FFFFFF 100%);
    margin-top: 50px;
}

.line {
    width: 1571px;
    height: 32px;
    top: 151px;
    left: 78px;
    gap: 0px;
    border: 1px solid;
    border-image-source: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, #FFFFFF 50.31%, rgba(255, 255, 255, 0) 100%);
}