*{
    font-family:Georgia, 'Times New Roman', Times, serif !important;
    background-color: #033825;
    font-style: italic;
}
.subtitle{
  color: gold;
}
h1{
  color: lemonchiffon;
}
figcaption{
  color: darkorange;
  font-size: 20px;
}
.expandable_title_bar{
  background-color: #084202;
}
.Essays{
  color: gold;
  font-style: italic;
  font-size: 20px;
}
.grey{
  color: grey;
}
.white{
  color: white;
}
#Changes{
  color: grey;
  font-size: 20px;
}
#caption{
  color: forestgreen;
}
.Underline{
  color: lemonchiffon;
}
.p-name{
    color: forestgreen;
  }
  .Blog{
    text-align: left;
    color: gold;
  }
  .heading{
    justify-content:left;
    color: lemonchiffon;
    font-size:20px;
  }
  .heading1{ 
    color: lemonchiffon;
    font-size: 22px;
    font-style: italic;
  }
.p-summary{
color: forestgreen;
font-size: 20px;
}
a[href]:hover{
color: gold;
}
li.a[href]{
  color: darkorange;
}
li.a[href]:hover{
  color:gold;
}
 ul li  {
  color: forestgreen;
  font-size: 22px;
  justify-content: left;
}
p{
    color: forestgreen;
    font-size: 20px;
}
a{
  color: darkorange;
  }
.centered-paragraph {
    max-width: 1100px; /* what causes the text top be centered*/
    margin: 0 auto; /* Center the text container within its parent */
    padding: 0 10px; /* what causes the extra negative space */
}

#ref{ /* the paragraphs section*/
text-align: center;
color: forestgreen;
font-size: 23px;
word-wrap: break-word; /* causes the text to be wrapped and break when it overflows*/
}
@media (max-width: 768px) { 
  .centered-paragraph {
      max-width: 90%; /* Use a percentage for smaller screens to be more flexible */
      padding: 0 15px; /* Reduce padding on smaller screens */
  }
}
#Part{
  color: forestgreen;
}
.title{
  color: lemonchiffon;
}
.index span{ 
  color: grey;
  height: 10px; 
  }

.Nav {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.Nav span a{
    justify-content: left;
    background-color: green;
    display: inline-block;
    border-radius: 10px;
    padding: 20px;
    text-decoration: none;
    color: orange;
    }
.Nav span a:hover{
    background-color: darkgreen;
    color: gold;
    };
.position {
      margin-left: auto; /* Push this item to the far right */
  }

/* Media queries for responsiveness */
@media only screen and (max-width: 479px) {
  header {
      display: contents;
      flex-wrap: nowrap;
      width: 100%;
  }
}
@media (max-width: 768px) {
  nav {
      display: flex;
      flex-direction: column; /* Vertical format */
      justify-content: center;
      align-items: center;
      width: 100%;
  }
  nav.open {
      display: flex;
      flex-direction: column; /* Ensure vertical format when open */
  }
  table {
      width: 100%;
  }
  td {
      display: block; /* Ensure table cells are displayed as block elements */
      text-align: center;
      padding: 10px 0;
  }
}