body {
    margin: 1.7rem;
    padding: 1.7rem;
    background-color: #181819;
    color: rgb(254, 242, 225);
    font-family: Arial, sans-serif;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    text-align: center;
    overflow: auto; /* Allow scrolling if content overflows */
    height: auto; /* Let the content grow */
}

.flickerText{
    font-family: "Poppins", serif;
    font-weight: 300;
    font-size: 25px; /* Adjust as needed */
    margin: 1rem;
    opacity: 0; /* Initially hidden */
    transition: opacity 0.3s ease-in-out;
    word-wrap: break-word; /* Break words to fit in the container */
    line-height: 1.2em;
    text-shadow: 0 0 5px #ffffff, 0 0 10px #ffffff, 0 0 15px #ffb300, 0 0 20px #ffb300, 0 0 30px #ffb300, 0 0 40px #ffb300, 0 0 50px #ffb300; /* Glowing effect */
} 

.newText {
    font-family: "Nanum Brush Script", sans-serif;
    font-weight: 400;
    font-size: 30px; /* Adjust as needed */
    margin: 1rem;
    opacity: 0; /* Initially hidden */
    transition: opacity 1s ease-in-out; /* Smooth fade transition */
    word-wrap: break-word; /* Break words to fit in the container */
    line-height: 1.3;
    text-shadow: 0 0 5px #ffffff, 0 0 10px #ffffff, 0 0 15px #ffb300, 0 0 20px #ffb300, 0 0 30px #ffb300, 0 0 40px #ffb300, 0 0 50px #ffb300; /* Glowing effect */
}

.showText {
    opacity: 1; /* Text becomes visible */
}

.flickering {
    animation: flicker 5s infinite ease-in-out;
}

@keyframes flicker {
    0% { opacity: 1; }
    10% { opacity: 0.8; }
    20% { opacity: 1; }
    30% { opacity: 0.6; }
    40% { opacity: 1; }
    50% { opacity: 0.7; }
    60% { opacity: 1; }
    70% { opacity: 0.9; }
    80% { opacity: 1; }
    90% { opacity: 0.7; }
    100% { opacity: 1; }
}

/* Navigation links */
.previous-link {
    font-family: "Poppins", serif;
    font-weight: 300;
    position: fixed;
    bottom: 20px;
    left: 20px;
    font-size: 1rem;
    text-decoration: none;
    color: rgb(0, 0, 0);
    transition: opacity 0.5s ease-in-out;
    z-index: 3;
  }
  
  .next-link {
    font-family: "Poppins", serif;
    font-weight: 300;
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 1rem;
    text-decoration: none;
    color: rgb(0, 0, 0);
    transition: opacity 0.5s ease-in-out;
    z-index: 3;
  }
  
  .star-link {
    font-family: "Poppins", serif;
    font-weight: 300;
    position: fixed;
    top: 20px;
    left: 20px;
    font-size: 1rem;
    text-decoration: none;
    color: rgb(0, 0, 0);
    transition: opacity 0.5s ease-in-out;
    z-index: 3;
  }
  
  .previous-link:hover, .next-link:hover, .star-link:hover {
    color: #f9f9f9;
    text-shadow: 0 0 10px rgb(254, 246, 215), 0 0 15px rgb(217, 194, 130), 0 0 20px rgb(178, 147, 63); /* Stronger glow on hover */
  }