body {
    background-color: rosybrown;
}

.head {
  justify-content: center;
  align-content: center;
  font-size: 3vh;
  font-family: 'playfair display', serif;
  background-color: #FFD7BE;
  height: 15vh;
  border-radius: 1vh;
  box-shadow: 0px 10px 20px 0px rgb(0,0,0,0.5);
}

.body {
  margin-top: 2vh;
  background-color: #FFD7BE;
  height: 100vh;
  border-radius: 1vh;
  box-shadow: 0px 10px 20px 0px rgb(0,0,0,0.5);
}

#head {
  color: #333333;
}

.select {
  background-color: #FOE4CC;
  box-shadow: 0px 10px 20px 0px rgb(0,0,0,0.3);
  height: 10vh;
  justify-content: center;
}

a {
  font-family: 'Georgia',serif;
  color: white;
  text-decoration: none;
}
button {
  margin-top: 1vh;
  margin-left: 4.5vh;
  background-color: #333333; /* or #FFD700 for gold */
  color: #FFFFFF;
  border: none;
  padding: 1.5vh 3vh;
  font-size: 3vh;
  font-family: 'Playfair Display', serif;
  border-radius: 1vh;
  cursor: pointer;
  transition: background-color 0.3s ease;
}

button:hover {
  background-color: #444444; /* or #FFC400 for gold hover */
}

button:active {
  background-color: #555555; /* or #FFA000 for gold active */
  transform: scale(0.98);
}


#info {
  font-size: 6vh;
  margin-left: 5vh;
  font-family: 'Georgia',serif;
  color: #333333;
}

 .body #mainpic {
   margin-top: 5vh;
   border-radius: 1vh;
   outline: 1vh solid white;
   margin-left: 6.5vh;
   height: 35vh;
}
.historybody{
  
  margin-top: 2vh;
  background-color: #FFD7BE;
  height: 150vh;
  border-radius: 1vh;
  box-shadow: 0px 10px 20px 0px rgb(0,0,0,0.5);
}