.box {
  border: 5px solid green;
  padding: 10px;
  margin: 10px;
}

.pinyon-script-regular {
  font-family: "Pinyon Script", cursive;
  font-weight: 1000;
  font-size: 300%;
  font-style: normal;
}

.bluegradient {
  height: 100%;
  background-color: lightblue;
  background-image: linear-gradient(to bottom right, CornflowerBlue, AliceBlue);
}

.background-container {
    background-image: url('/images/background.gif');
    background-position: center; /* Centers the GIF in the container */
    background-size: cover; /* Scales the GIF to cover the entire container */
    background-repeat: no-repeat; /* Ensures the GIF does not tile */
    height: 100vh; /* Makes the container full height of the viewport */
    width: 100vw; /* Makes the container full width of the viewport */
    overflow: hidden; /* Hides any overflow from the GIF */
}

/* Optional: style your content so it's readable over the background */
h1 {
    color: white;
    text-align: center;
    padding-top: 200px;
}