html {
  background: url("https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQ0ib_XfbaZXTALbYx6hvDdi3kw8T5zwreBfQ&usqp=CAU");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
}

#page {
  margin: 3vw;
}

#title {
 
  background-Blue;
  color: white;
  padding: 4vh;
  text-align: center;
  font-family: "Arial";
  margin-bottom: 10px;
  margin: 0vh 9vw;
  border-top-left-radius:25%;
    border-top-right-radius:25%;
}

.character {
  width: 10vw;
  border: 5px black solid;
  border-radius:50%;
  margin:10px;
}

.character:hover
{
	transform: rotate(180deg);
}

.character:active
{
	transform: rotate(270deg);
}


#content {
   background: linear-gradient(to bottom, rgb(102, 26, 0), rgb(128, 32, 0), rgb(153, 38, 0));
  background-color: ;
  text-align: center;
  padding: 4vh;
  margin: 4vh 9vw;
   border-top-left-radius:25%;
    border-top-right-radius:25%;
   border-bottom-left-radius:25%;
    border-bottom-right-radius:25%;
}

h2 {
  color: white;
  text-align: center;
  font-family: "Arial";
}

a, p {
  color: honeydew;
  font-family: Arial, sans-serif;
}

hr {
  background-color: rgb(255,255,255,0.1);
  border: none;
  height: 1px;
  margin: 15px 0px;
}


#footer {
  height: 50px;
  color: black;
}

.imagesrc a, p{
  color: black;
  text-align: center;
  padding-top: 50px;
  padding-bottom:50px;
  font-weight: 900;
}
  


a:hover
{
  color:green;
}

#bottom-content
{
   background: linear-gradient(to top, rgb(102, 26, 0), rgb(128, 32, 0), rgb(153, 38, 0));
   background-color:#661a00;
  padding: 0vh;
  color:white;
  text-align: center;
  margin: 4vh 9vh;
  border-bottom-left-radius:25%;
  border-bottom-right-radius:25%;
}