@import url('https://fonts.googleapis.com/css2?family=Audiowide&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Audiowide&family=Unica+One&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Audiowide&family=Tulpen+One&family=Unica+One&display=swap');

body {
  background: url('index_bkg.gif') no-repeat center center fixed;
  background-size: cover;
  overflow-x: hidden;
  height: 100vh;
  margin:0;
  user-select: none;
}

.page-title {
  font-family: "Audiowide", sans-serif;
  font-size: 4rem;
  margin: 10px 10px 10px;
  text-align: center;
  color: #be3046;
}

@keyframes dud-bulb {
    0%, 10% { opacity: 1; text-shadow: 0 0 10px #be3046; }
    11%, 13% { opacity: 0.3; text-shadow: 0 0 5px #be3046; }
    14%, 24% { opacity: 1; text-shadow: 0 0 10px #ff4651; }
    25%, 27% { opacity: 0; text-shadow: none; }
    28%, 98% { opacity: 1; text-shadow: 0 0 10px #ff4651; }
    99%, 100% { opacity: 0.5; text-shadow: 0 0 5px #ff4651; } 
}

.page-title {
  animation: dud-bulb 1s infinite steps(3);
}

p {
font-family: "Audiowide", sans-serif;
font-size: 2rem;
margin: 10px 0 10px;
text-align: center;
color: #ff4651;
}

.page-container{
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 20px;
  gap: 15px;
}

.content-box{
  background-color: #246f72;
  padding: 5px;
  border-radius: 50px;
  max-width: 500px;
  width: 50%;
  margin: 0 auto;
  z-index: 10;
  position: fixed;
  text-align: center;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}