body {
    height: 100%;
    margin: 0;
  }
.video-container {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
  }
#background-video {
    width: 100%;
    height: 100%;
    object-fit: cover;
  }
.title {
    position: absolute;
    color: white;
    font-size: 2rem;
    left: 41%;
    z-index: 2;
}
@media only screen and (max-width: 767px) {
    .title {
        position: absolute;
        left: 24%;
        font-size: 1.5rem;
        top: 2rem;
    }
}
@media screen and (min-width: 1650px) {
    .title {
        position: absolute;
        left: 43%;
    }
}
.informationText {
    color: white;
    position: absolute;
    font-size: 1.25em;
    border: 0.25rem;
    border-radius: 1.25rem;
    top: 10rem;
    width: 50%;
    font-weight: 700;
    z-index: 2;
    left: 27%;
}
@media only screen and (max-width: 767px) {
    .informationText {
        position: absolute;
        left: 5%;
        width: 90%;
        top: 10rem;
        font-size: 1em;
    }
}
@media screen and (min-width: 1650px) {
    .informationText {
        position: absolute;
        left: 35%;
    }
}
.solarSystem {
    color: white;
    position: absolute;
    top: 32%;
    left: 22%;
    font-size: 130%;
    z-index: 2;
}
@media screen and (min-width: 1650px) {
    .solarSystem {
        left: 26%;
        top: 25%;
    }
}
@media only screen and (max-width: 767px) {
    .solarSystem {
        position: absolute;
        left: 30%;
        font-size: 1rem;
        top: 20rem;
    }
}
.stars {
    color: white;
    position: absolute;
    top: 32%;
    left: 68%;
    font-size: 130%;
    z-index: 2;
}
@media only screen and (max-width: 767px) {
    .stars {
        position: absolute;
        left: 40%;
        font-size: 1rem;
        top: 40rem;
    }
}
@media screen and (min-width: 1650px) {
    .stars {
        left: 69%;
        top: 25%;
    }
}
#solarSystemImage {
    position: absolute;
    width: 30%;
    top: 25rem;
    left: 15%;
    border-radius: 1.2rem;
}
@media only screen and (max-width: 767px) {
    #solarSystemImage {
        position: absolute;
        left: 10%;
        width: 20rem;
        top: 44%;
    }
}
#starsImage {
    position: absolute;
    width: 30%;
    top: 25rem;
    left: 56%;
    border-radius: 1.2rem;
}
@media only screen and (max-width: 767px) {
    #starsImage {
        position: absolute;
        left: 10%;
        width: 20rem;
        top: 80%;
    }
}
.blackHole {
    color: white;
    position: absolute;
    top: 88%;
    left: 22%;
    font-size: 130%;
    z-index: 2;
}
@media screen and (min-width: 1650px) {
    .blackHole {
        left: 26%;
        top: 73%;
    }
}

@media only screen and (max-width: 767px) {
    .blackHole {
        position: absolute;
        left: 30%;
        font-size: 1rem;
        top: 60rem;
    }
}
.galaxy {
    color: white;
    position: absolute;
    top: 88%;
    left: 66%;
    font-size: 130%;
    z-index: 2;
}
@media only screen and (max-width: 767px) {
    .galaxy {
        position: absolute;
        left: 35%;
        font-size: 1rem;
        top: 78rem;
    }
}
@media screen and (min-width: 1650px) {
    .galaxy {
        left: 68%;
        top: 73%;
    }
}
#blackHoleImage {
    position: absolute;
    width: 30%;
    top: 100%;
    left: 15%;
    border-radius: 1.2rem;
}
@media only screen and (max-width: 767px) {
    #blackHoleImage {
        position: absolute;
        left: 10%;
        width: 20rem;
        top: 115%;
    }
}
@media screen and (min-width: 1650px) {
    #blackHoleImage {
        top: 80%;
    }
}
#galaxieImage {
    position: absolute;
    width: 30%;
    top: 100%;
    left: 56%;
    border-radius: 1.2rem;
}
@media only screen and (max-width: 767px) {
    #galaxieImage {
        position: absolute;
        left: 10%;
        width: 20rem;
        top: 145%;
    }
}
@media screen and (min-width: 1650px) {
    #galaxieImage {
        top: 80%;
    }
}