/**************************************************************
   AUTHOR:  Pat Heard (fullahead.org)
   DATE:    2008.01.08
   PURPOSE: Controls the layout of the site elements
 **************************************************************/


/**************************************************************
   Main content container
 **************************************************************/


#container {
  position: relative;
  top: 60px;

  width: 770px;
  min-height: 90%;
  margin: 0 auto;  
  background: #FFF url(../img/bg/container.gif) repeat-x bottom left;
}




/**************************************************************
   Header
 **************************************************************/

/* Holds title, tagline and main menu */
#header #meta {
  position: relative;
  float: right;
  width: 366px;
  
  margin: 35px 32px 0 0;
  text-align: center;
}

#header h1 {    
  height: 41px;
  width: 100%;
  padding: 0;
  margin: 0;

  text-indent: -1000em;
  background: url(../img/bg/header_title.png) no-repeat top left;
}

#header h2 {    
  padding: 42px 10px;
  margin: 0;  
  line-height: 1.5em;  
}

#header ul {  
  padding: 0;
  margin: 0;
  list-style: none;
}

#header ul li {
  padding: 0;
  margin: 0;
  display: inline;
}

#header ul li a {
  float: left;

  margin: 0 22px;
  padding: 0 5px;
  
  font: 1.4em georgia, serif;
  
  color: #b1836e;
  background: none; 
}

#header ul li a:hover {
  color: #391e11;
  border: 0;
}

#header ul li.active a {
  color: #391e11;
  border-bottom: 4px solid #e4f8b4;
}

#header img {
  float: left;
  padding-bottom: 10px;
}


/**************************************************************
   Holds page content
 **************************************************************/

#content {
  clear: both;
  width: 510px;
  margin: 0 auto;
}



/* Beginning of page large image letters */
.letter {
  height: 31px;
  width: 31px;
  float: left;  
  margin: 5px 5px 3px 0;  
  font-size: 0px;
}

.F {
  background: url(../img/bg/letter_F.gif) no-repeat top left;
}

.B {
  background: url(../img/bg/letter_B.gif) no-repeat top left;
}

.Y {
  background: url(../img/bg/letter_Y.gif) no-repeat top left;
}


/* Thumbnail grid */
#thumbnails {  
  position: relative;
  left: -4px;
  width: 518px;
  padding-top: 30px;
}

#thumbnails a {
  background: none;
}

#thumbnails a:hover {
  border: none;
}

#thumbnails a img {
  margin: 11px;
  border: 4px solid #FFF;
}

#thumbnails a:hover img {
  border: 4px solid #e4f8b4;
}

#thumbnails a.first img {
  margin-left: 0;
}

#thumbnails a.last img {
  margin-right: 0;
}


/**************************************************************
   Footer
 **************************************************************/
 
 #footer {
   padding: 40px 0 175px 0;
 }
 
 #footer p {
   float: left;
   padding-top: 15px;
 }
 
 #footer img {
   float: right;
 }
 
 #footer a {
   background: none;
 }