body {
  background-color:#f9f9f9;
  font-family:'Afacad', sans-serif;
  padding-right:50px;
  padding-top:20px;
  padding-bottom:50px;
  padding-left:50px;
  font-size:20px;
  overflow:hidden;
  }
  
footer {
  font-size:15px;
  }
  
  @font-face {
  font-family: Afacad;
  src: url('https://kmjdk.neocities.org/Afacad-Regular.ttf') 
  format("truetype");
}

/* Popup background */
.popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 9999;
}

/* Popup box */
.popup-content {
  background: #fff;
  padding: 20px;
  width: 300px;
  font-size:17px;
  margin: 15% auto;
  border-radius: 5px;
  border:2px solid black;
  box-shadow: 0 0 20px rgba(0,0,0,0.2);
  position: relative;
  text-align: left;
}

/* X button */
.close {
  position: absolute;
  right: 15px;
  top: 10px;
  font-size: 22px;
  cursor: pointer;
}

.popup-content, 
.popup-content p, 
.popup-content h2, 
.popup-content a {
  color: #000 !important;
}
