body {
  background-color: #C7CC7E;
  color: #474713;
  font-family: times;
  padding: 0;
}

h1 {
  background-color: #474713;
  color: #C7CC7E;
}

h2 {
  background-color: #474713;
  color: #C7CC7E;
  font-size: 16px;
  letter-spacing: 0.2em;
  word-spacing: 0.5em;
  padding: 5px
}

a {
    text-decoration: none;
    color: #C7CC7E;
}
container img {
   background-color: #C7CC7E;
    display: inline-block; /* Makes images behave as inline blocks */
    width: 10%; /* Example width, adjust as needed */
    margin: 15px; /* Adds space around the images */
}

text-box {
  width: 80%; /* Sets the width of the box */
  padding: 10px; /* Adds space between the text and the border */
  border: 2px solid #474713; /* Creates a solid border (2px width, gray color) */
  background-color: #C7CC7E; /* Adds a light gray background color */
  margin: 15px auto; /* Centers the box horizontally on the page with margin top/bottom */
}

/* The side navigation menu */
.sidebar {
  margin: 0;
  padding: 0;
  width: 150px;
  background-color: #C7CC7E;
  position: fixed;
  height: 100%;
  overflow: hidden;
}

/* Sidebar links */
.sidebar a {
  display: block;
  color: #474713;
  padding: 5px;
  text-decoration: none;
 
}
/* Links on mouse-over */
.sidebar a:hover:not(.active) {
  background-color: #474713;
  color: #C7CC7E;
}

/* Page content. The value of the margin-left property should match the value of the sidebar's width property */
.content {
  margin-left: 150px;
  padding: 1px 16px;
  height: 500px;
}


.row {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
}

/* Create two equal columns that sits next to each other */
.column {
  flex: 50%;
  padding: 0 4px;
  margin-left: 150px
}

.column img {
  margin-top: 8px;
  vertical-align: middle;
  width: 150px;
  height: 250px;
}