body {
  background:#2E5844;
  font-size:80%;
  margin-top:2em;
  }

  
#header {
  background:white; 
  padding-top:0;
  clear:both;
  height:100px;
  } /*Instead of using all of that padding in the header you want 
to use other styles to create the space that you need.  See below for more information on that.*/

.image { 
  float:left; 
  padding:0;
  border:0;
  }

/* mine: #img1{float:left; padding-right:3em;} /*Instead of a section for the image you want to create an image style for the header. 
That would look something like this:*/
#info {
  float:left;
  text-align:center;
  font-size:100%;
  width:25%;
  padding-top:2em;
  padding-left:2em;
  }

/*Along with that so that the links in the header are at the bottom of the image you create another section that will be in the 
header something like*/
#persistent {
  float:right; 
  text-align:right;
  font-family:Palatino Linotype, Book Antiqua3, Palatino6, serif;
  font-size:95%;
  padding-right:1em; 
  width:55%;
  }
/*That will place the links where you want them in the code.

You also want to style the links for the header section so that they display appropriately on your background color.  
You would do that with:*/
#persistent a:link {
  font-weight:bold; 
  color:blue;
  }
#persistent a:visited {
  font-weight:bold; 
  color:purple;
  }
#persistent a:hover {
  font-weight:bold; 
  color:red;
  }
/*Adding the styles that you want to each.
*/
#wrapper {
  background: url(background.jpg) repeat-y;
  width: 95%;
  overflow: auto; 
  margin: 2em auto;
  min-width:950px;
  }

#search {
  float:right; 
  padding-right:.5em;
  width: 50%;
  } /*It's always good to add widths to divided sections so the borwser knows how much space to provide 
for the content within the section. */

/*In order to get the navigation to work the way you want it to you need to use the list approach 
instead of the navbar styles and the mainnav section.  Instead of the main nav and the navbar you would use 
something like this:*/
#nav {width:15%; float:left;}

#navbar ul {
  float:left;
  list-style: none;
  margin-top:5em;
  padding-left:.5em;
  padding-right: 3em;
  /*width:11%;*/
}

#navbar li {
  border-bottom: 1px solid #ED9F9F;
  padding-bottom:4px; 
  padding-top:4px;
  width:9em;
}

#navbar li a:link {
  background:#130B2F; 
  display:block;
  border:2px outset #19115E; 
  text-decoration: none; 
  font-weight: bold; 
  margin:2px; 
  color: #6BE6A2; 
  font-size:110%; 
  font-family: Veranda, Arial, Helvetica, sans-serif;
}

#navbar li a:visited  {
   background:#130B2F; 
  display:block;
  border:2px outset #19115E; 
  text-decoration: none; 
  font-weight: bold; 
  margin:2px; 
  color: #6BE6A2; 
  font-size:110%; 
  font-family: Veranda, Arial, Helvetica, sans-serif;
}

#navbar li a:hover {
  display:block;
  background:#19115E;  
  display:block;
  text-decoration: none;
  color: #FBFD7B; 
  font-weight: bold; 
  border:2px inset #19115E;
 }

#home #navbar li.home a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#home #navbar li.home a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#home #navbar li.home a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

#about #navbar li.about a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#about #navbar li.about a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#about #navbar li.about a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

#art #navbar li.art a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#art #navbar li.art a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#art #navbar li.art a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

#trips #navbar li.trips a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#trips #navbar li.trips a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#trips #navbar li.trips a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

#sponsoring #navbar li.sponsoring a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#sponsoring #navbar li.sponsoring a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#sponsoring #navbar li.sponsoring a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

#contact #navbar li.contact a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#contact #navbar li.contact a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#contact #navbar li.contact a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

#projects #navbar li.projects a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#projects #navbar li.projects a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#projects #navbar li.projects a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

#news #navbar li.news a:link {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#news #navbar li.news a:hover {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}
#news #navbar li.news a:visited {background-color:#004E4A; color:#FBFD7B; border:2px inset #004E4A;}

/*This sets up the links in the list with background, border, etc. You would start the section with <ul div id="navbar"> 
instead of the main nav and then put in the list.*/

/*mine - #mainNav {width: 12%; font-size: 100%; font-weight: bold; color:black; float: left; 
padding-left:.5em; padding-right:.5em; margin-top: 8em; padding-top:.5em;}*/

#content_wrapper {
  width: 80%; 
  float:left;
  /*padding-left:.5em; 
  padding-right:3em;*/
  } 

.thumbnails {
  float:left;
  margin-left: 1em;
  margin-right: 1em;
  margin-bottom: 3em;
  border:0;
  }

.caption {
  float:right;
  color:black;
  clear:both;
  width:25%;
  text-align:center;
  }

h1 {
  font-size:125%; 
  text-align: left; 
  font-weight: bold; 
  padding-top: .2em; 
  padding-bottom: .2em;
  }

h2 {
  font-size:115%; 
  text-align: left; 
  font-weight: bold; 
  padding-top: .2em; 
  padding-bottom: .2em;
  }

h3 {
  font-size:105%; 
  text-align: left; 
  font-weight: bold; 
  padding-top: .2em; 
  padding-bottom: .2em;
  }

#footer {
  clear:both; 
  /*float:right; */
  text-align: center;
  width:99%; 
  margin-top:10em; 
  font-size:80%; 
  color: black; 
  padding-bottom: 2em;
  }

a:link {
  font-size:100%;
  color:blue;
  }
a:visited {
  font-size:100%;
  color:purple;
  }
a:hover {
  font-size:100%;
  color:red;
  }

.emph {font-style:italic}

#popupwrapper {
  background: white;
  width: 95%;
  overflow: auto; 
  margin: 2em auto;
  }
  
#popupImages {
  float: right;
  margin-left: .5em;
  margin-right: .5em;
  margin-top: .5em;
  margin-bottom: 1em;
  }

#popupText {
  float: left;
  margin-left: 2.25em;
  margin-top: 1em;
  font-family: Palatino Linotype, Book Antiqua3, Palatino6, serif;
  font-size: small;
  color: #acacac;
  text-align:left;
  }

  /*Need to add font-weight: to the bold or the browser doesn't know what to make bold.*/

/*You don't need the navbar sections as you define here with what I suggested above. */




