*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

.container{
    width: 100%;
    height: 800vh;
    text-align: center;
    overflow: hidden;
    /* background-image: linear-gradient(
        179.2deg,
        rgba(34, 34, 34, 1) 0%,
        rgba(8, 0, 153, 1) 59.7%,
        rgba(118, 6, 166, 1) 83.4%,
        rgba(233, 0, 64, 0.58) 100.1%
    ); */
    background-image: linear-gradient(
        179.2deg,
        rgba(34, 34, 34, 1) 0%,
        rgba(8, 0, 153, 1) 59.7%,
        rgba(118, 6, 166, 1) 83.4%,
        rgba(233, 0, 64, 0.58) 100.1%
    );

    
}

h1{
    color: white;
    padding-top: 50px;
    font-family: sans-serif;
    font-size: 3rem;
}

.container__animation{
    position: relative;
    height: 785vh;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

.ufo{
    position: absolute;
    top: 10px;
    width: 350px;
    z-index: 1;
}

.planet{
    position: absolute;
    width: 300px;
    opacity: 0;
}

.sun{
    opacity: 0;
    right: 15%;
    top: 100vh;
}

.saturn{
    opacity: 0;
    top: 100vh;
    left: 10%;
}

.jupiter{
    opacity: 0;
    width: 500px;
    top: 50px;
    right: -100vw;
}

.mars{
    opacity: 0;
    width: 350px;
    top: 5vh;
    left: -100vw;
}

.moon{
    opacity: 0;
    width: 700px;
    right: 15%;
    top: 100vh;
}

.earth{
    opacity: 0;
    top: 200vh;
    width: 850px;
}