body{
    background-color: black
}

.Header{
    font-family: "Staatliches", sans-serif;
    font-weight: 400;
    font-size: x-large;
    background-color: rgb(24, 61, 61);
    text-align: center;
    animation: fadeIn 2s ease-in-out;
    
}
@keyframes fadeIn {
  from { opacity: 0; transform: translateY(-20px); }
  to { opacity: 1; transform: translateY(0); }
}
nav a{
    margin: 0 10px;
    text-decoration: none;
    color: rgb(92, 131, 116);
}
h1{
    color: rgb(147, 177, 166);
}
h2{
    color: rgb(147, 177, 166);
    text-align: center;
}
h3{
    font-family: "Staatliches", sans-serif;
    font-weight: 400;
    font-size: 20px;
    color: rgb(147, 177, 166);
    text-align: center;

}

.Navigation{
    font-family: "Staatliches", sans-serif;
    font-weight: 400;
    font-size: xx-large;
    text-align: center;
}

.Gallery{
    text-align: center;
}
.images {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
  justify-content: center;
  align-items: center;
}

.images img {
  width: 300px;
  border-radius: 8px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.1);
  transition: transform 0.3s;
}

.images img:hover {
  transform: scale(1.05);
}

.Calendar{
    text-align: center;
    width: 100%;
    height: 600px;
    filter: invert(100%);
}
.Contact{
    font-family: "Staatliches", sans-serif;
    font-weight: 400;
    font-size: xx-large;
    background-color: rgb(24, 61, 61);
    color: rgb(147, 177, 166);
    text-align: center;
}
button{
    font-family: "Staatliches", sans-serif;
    font-weight: 400;
    font-size: xx-large;
    background-color: rgb(24, 61, 61);
    color: rgb(147, 177, 166);
}
.Clown-Resources{
    text-align: center;

}

@media (max-width: 600px){
    

}
@media (min-width: 601px){


}
footer{
    text-align: center;
    color: rgb(147, 177, 166);
}