/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */
@font-face {
font-family:'pix';
src: url('https://technostalgia.neocities.org/gothicpixels-webfont.woff') format('woff');}
.gothpix {
font-family:'pix';
font-weight: normal;
font-style: normal;
}


@font-face {
font-family:'sperry';
src: url('https://ninjaweb.neocities.org/font/Web437_SperryPC_8x16.woff') format('woff');}
.sperry{font-family:'sperry';font-size:14px}

@font-face {
font-family:'toshiba';
src: url('https://ninjaweb.neocities.org/font/WebPlus_ToshibaTxL1_8x16.woff') format('woff');
}

.toshiba{
  font-family:'toshiba';font-size:14px
}

body {
  background-color: lightblue;
  color: black;
  font-family: monospace;
  display: flex;
  justify-content: center; /* Centers content horizontally */
  align-items: center; /* Centers content vertically */
  min-height: 100vh; /* Ensures the body takes up at least the full viewport height */
}

div {
  background-color: white;
   border: 2px solid black; /* Creates a 2px solid black border */
  padding: 20px; /* Adds 20px of space between the border and the content */
  margin: 15px; /* Adds 15px of space around the entire div, separating it from other elements */
}

div button {
  border: 2px solid black; /* Creates a 2px black solid border around the button */
  padding: 8px; /* Adds space between the a button and the border */
}

div a:link {
  border: 2px solid black; /* Creates a 2px black solid border around the link */
  padding: 8px; /* Adds space between the link content and the border */
}

div a:visited {
  border: 2px solid purple; /* Creates a 2px purple solid border around the link */
  padding: 8px; /* Adds space between the link content and the border */
}

div a:hover {
  background-color: yellow;
  }

@media only screen and (max-width: 500px) {
  .chapter{display:none}}