body {
  background-image: url("photos/mars 2112.jpeg");
  background-color: #eecb57;
  font-family: Copperplate, sans-serif;
  margin: 0px;
  color: #ef6940;
}

.container {


  width: 300px;
  height: 280px;
  top: 30%;
  left: 30%;
  margin-left: -150px;
  margin-top: -100px;
  position: absolute;
  border: 5px solid #577aee;
  background-color: #eecb57;
  padding: 40px;
  border-radius: 150px;
  animation: up-down 20s infinite alternate;
}

@keyframes up-down {
  0% {
    transform: translateX(0);
  }

  33% {
    transform: translateY(50%);
  }

}

.container2 {
  text-align: center;
  vertical-align: middle;
  line-height: 10px;
  width: 100px;
  height: 80px;
  top: 30%;
  right: 30%;
  margin-right: -180px;
  margin-top: -100px;
  position: absolute;
  border: 5px solid rgb(231, 115, 104);
  background-color: #faf252;
  padding: 40px;
  border-radius: 150px;
  animation: up-down 10s infinite alternate;

}

a {
  color: rgb(90, 72, 18);
  text-align: center;
}

.box {
  top: -50%;
  right: 100%;
  margin-left: 380px;
  margin-top: 80px;

}

.home {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 70px;
  height: 70px;
  background-color: rgb(143, 185, 36);
  border: 5px dotted rgb(12, 11, 14);
  border-radius: 150px;
  color: white;
  animation: left-to-right 20s infinite alternate;
}

@keyframes left-to-right {
  100% {
    transform: translateX(100%);
  }



}