body {
  background-color: lightblue;
}

/* Headers */

h1 {
  color: black; background: white; text-align: center; overflow: auto; font-size: 30px; font-family: Helvetica,sans-serif; margin-top: 5px; margin-bottom: 5px; padding: 5px;
}

h2 {
  color: black; background: white; text-align: center; overflow: auto; font-size: 25px; font-family: Helvetica,sans-serif; margin-top: 5px; margin-bottom: 5px; padding: 3px; 
}

h3 {
  color: black; text-align: center; overflow: auto; font-size: 20px; font-family: Helvetica,sans-serif; margin-top: 5px; margin-bottom: 5px; padding: 3px;
}

h4 {
  color: black;text-align: center; overflow: auto; font-size: 15px; font-family: Helvetica,sans-serif; margin-top: 5px; margin-bottom: 5px; padding: 3px;
}

h5 {
  color: black;text-align: center; overflow: auto; font-size: 15px; font-family: Helvetica,sans-serif; margin-top: 5px; margin-bottom: 5px; padding: 3px;
}

h6 {
  color: black; text-align: center; overflow: auto; font-size: 15px; font-family: Helvetica,sans-serif; margin-top: 5px; margin-bottom: 5px; padding: 3px;
}

/* Horizontal rule */

hr {
  height:5px;border-width:0;color:black;background-color:black; padding: 3
}

/* Paragraph */

p {
  font-family: Helvetica;
  font-size: 20px;
  margin-right: 10px;
  margin-left: 10px;
}

ul {
  font-family: verdana;
  font-size: 20px;
  padding: 3
}

/* Blockquote */

blockquote {
   font-family: Helvetica,sans-serif; 
   font-size: 15px; 
   padding-left: 15px; 
   border-left: 5px solid #000000;
}


/* DIVs */

.container {
    display: flex;
    align-items: center;   /* vertical alignment */
    gap: 20px;             /* space between items */
}

.center-image {
    display: block;
    margin-left: auto;
    margin-right: auto;
}

/* TOC */

  .toc {
      width: 300px;
      border: 5px solid black;
      background: white;
      padding: 10px 15px;
      font-size: 20px;
  }
  
  /* TOC title */
  .toc-title {
      text-align: center;
      font-family: Helvetica,sans-serif;
      font-weight: bold;
      margin-bottom: 10px;
      padding: 3
  }
  
  /* Remove default spacing () */
  .toc ul {
      list-style: none;
      padding-left: 0;
      margin: 0;
  }
  
  /* Nested levels */
  .toc ul ul {
      padding-left: 20px;
  }
  
  /* TOC items */
  .toc li {
      margin: 4px 0;
  }
  
  /* Links */
  .toc a {
      text-decoration: none;
      color: #000000;
  }
  
  .toc a:hover {
      text-decoration: underline;
  }

/* Dialouge */

 .dialogue-box {
    display: flex;
    margin: 30px auto;
    padding: 16px;
    background: #5A5A5A;
    border: 4px solid white;
    border-radius: 14px;
    width: auto;
    height: auto;
}

.dialouge-text {
  flex: 1;
  font-size: 20px;
}

.character-name {
    font-weight: bold;
    font-family: Helvetica,sans-serif;
    margin-bottom: 8px;
    color: white;
}

.text {
  font-family: Helvetica,sans-serif;
  color: white
}

/* Images */

figure {
  border: 5px black solid;
  padding: 5px;
  margin: 0;
  display: inline-block;
}

img {
    display: block;
}

figcaption {
  text-align: center;
  background-color: white;
  color: black;
  font-family: Helvetica,sans-serif;
  font-style: italic;
  padding: 3px;
}

/* Table */

table, th, td {
  border: 5px solid;
  padding: 10px;
  background-color: white;
  color: black;
}

table {
  font-family: Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

th {
  padding-top: 12px;
  padding-bottom: 12px;
  text-align: left;
  
}