@import url("https://fonts.googleapis.com/css?family=Roboto:700");
body {
  margin: 0px;
  font-family: "Roboto";
  text-align: center;
  background: rgb(255, 136, 50);
}

.imgLogo {
  width: 300px;
  border: 10px solid rgb(255, 255, 255);
  border-radius: 10px;
}
.img {
  margin-top: 20px;
  border: 1px;
}
#page {
 display: flex; /* เปิดใช้งาน Flexbox */
  flex-direction: column;
  justify-content: center; /* จัดกึ่งกลางแนวนอน */
  align-items: center; /* จัดกึ่งกลางแนวตั้ง */
  min-height: 100vh; /* ทำให้ container สูงเต็มหน้าจอเพื่อจัดกึ่งกลาง div */
}

#flip {
  height: 100px;
  overflow: hidden;
}

#flip div {
  margin: 0;
  font-size: 65px;
}

#flip > div > div {
  color: #fff;
  padding: 12px;
  height: 45px;
  margin-bottom: 45px;
  display: inline-block;
}

#flip div:first-child {
  animation: show 5s linear infinite;
}

/* #flip div div {
  background: #4ec7f3;
}

#flip div:first-child div {
  background: #016fff;
}
#flip div:last-child div {
  background: #ff0000;
} */

@keyframes show {
  0% {
    margin-top: -270px;
  }
  5% {
    margin-top: -180px;
  }
  33% {
    margin-top: -180px;
  }
  38% {
    margin-top: -90px;
  }
  66% {
    margin-top: -90px;
  }
  71% {
    margin-top: 0px;
  }
  99.99% {
    margin-top: 0px;
  }
  100% {
    margin-top: -270px;
  }
}