body {
  background-color: black;
}
h1 {
  color: rgb(69, 9, 109); text-align: center;
  font: 2rem 'Impact', Serif;
  margin-top: 2rem;
}
@font-face {
  font-family: "GothicWar";
 src: url(GothicWar.otf);
}
#name {
  font-family: GothicWar;
  font-size: 4rem;
}

@font-face {
  font-family: "Romance";
  src: url(Relationshipofmelodrame.ttf);
}
p {
    color: white; 
    text-align: center;
    font-family: Romance;
    font-size: 1.8rem;
}

.entry-image {
    display: block;
    margin: 0 auto;
}
.entry {
   padding: 15px 25px;
   font: 3rem 'Impact', Serif;
   text-align: center;
   text-decoration: underline;
   cursor: pointer;
   outline: none;
   background-color: rgb(69, 9, 109);
   border: none;
   border-radius: 15px;
   box-shadow: 0 5px #8b037c;
   width:fit-content;
   margin: 25px auto;
}

a:link {
  color:#fff;
}

.entry:hover {
  color: #fff;
  text-decoration: none;
  background-color: #65025e47;
}
.entry:active {
  color: #fff;
  background-color: #65025e;
  box-shadow: 0 5px #65025e;
  transform: translateY(4px);
}

.hello {
  background-image: url("hello_bg.jpg");
  background-repeat: repeat;
}
#button {
  color: white; 
  text-align: center;
  font: 1.6rem 'Romance';
  line-height: 3rem;
 }
  #button ul {
  list-style: none;
  }
  #button li a {
  color: #fff;
  } 
  html>body #button li a {
  width: auto;
  } 
  #button li a:hover {
  color: #fff; 
  text-decoration: none;
  }
h2 {
   color: #fff;
   font-family: GothicWar;
   font-size: 4rem;
   text-align: center;
}