html {
  height: 100vh;
  width: 100vw;
}

body {
  font-family: 'Waiting for the Sunrise', cursive; 
  font-size: clamp(15px, 2vw + 1rem, 30px);
  margin: 5rem 20px 3rem; 
  letter-spacing: 6px; 
  font-weight: bold;
  padding-bottom: 3rem;
  
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 1rem;
  text-align: center;
  background-image: url('paper_9.png');
  background-size: cover;
  background-position: center top;
}

body p,
body h1,
body h2,
body h3
 {
  width: fit-content;
  margin: 0;
}

.image-container {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  width: 100%;

  opacity: 0;
  transition: opacity 1.2s ease-in;
  transition-delay: 3s; /* Delay before the images appear */

}

.image-container.show {
  opacity: 1;
}

.instagram {
  opacity: 0;
  transition: opacity 1.2s ease-in;
  transition-delay: 3s; /* Delay before the images appear */

}

.instagram.show {
  opacity: 1;
}

.image-sub-container {
  position: relative;
  width: min(100%, 400px);
  height: 400px;
}

.image-sub-container img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;

}

@media (max-width: 800px) {
  .image-container {
    flex-direction: column;
  }
}