/*


COLOUR REFERENCES
BODY BG: #FFF
TOP STRIP: #000
BODY COLOUR: #666
LINKS: #000
-------------------------------------------------------- */


/* RESET */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
  margin:0;
  padding:0;
}
table {
  border-collapse:collapse;
  border-spacing:0;
}
fieldset,img {
  border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
  font-style:normal;
  font-weight:normal;
}
ol,ul {
  list-style:none;
}
caption,th {
  text-align:left;
}
h1,h2,h3,h4,h5,h6 {
  font-size:100%;
  font-weight:normal;
}
q:before,q:after {
  content:'';
}
abbr,acronym {
  border:0;
}
/*---------- END RESET ----------*/


/*-------------------------------------------+
|                                            |
|            MAIN STRUCTURE STYLES           |
|                                            |
+-------------------------------------------*/
html{
  font-size:100%;
  min-height:101%;
}
body{
  font-size:62.5%;
  font-family:"orator std", sans-serif;
  background: #fff; 
  padding:0 1em;
}
#wrapper{
  width:800px;
  margin:0 auto;
}

div#header { 
	height: 130px;
	background: #fff;
	width: 1015px;
	padding: 20px 0px 10px 5px;
}
/*NAVIGATION
   */
#nav{
  font-size:12px;

}
#nav a{

  color:#000;
  
}

#nav a:hover{
  text-decoration:none;
}
#nav span{
  float:left;
  margin-top:10px;

}



/* Top navigation */
/* Uses image replacement technique from http://wellstyled.com/css-replace-text-by-image.html */
/* Uses CSS dropdown similar to http://ago.tanfa.co.uk/css/examples/menu/tutorial-h.html */

#topnav { 
  margin-bottom: 30px;
  font-size: 12px;
}


#topnav ul {
  display: block;
  margin: 0;
  padding: 0;
  list-style: none;
}

#topnav li {
  position: relative;
  float: right;
  display: block;
  margin: 0;
  padding: 0;
  list-style-type: none;
}

#topnav li ul {
  position: absolute;
  left: 0;
  top: 100%;
  background: #fff;
  display: block;
  visibility: hidden;
}

#topnav li ul li {
  display: list-item;
  float: none;
}

#topnav li:hover ul {
  visibility: visible;
}

#topnav li {
  display: block;
  float: right;
  margin: 0 0 0 10px;
  padding: 0;
  position: relative;
  /* overflow: hidden; */
}

#topnav a span {
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  margin: 0;
  padding: 0;
}

#topnav li, #topnav li a span {
  height: 22px;
}

#topnav li li {
  height: auto;
  margin: 0 5px;
}

#topnav a {
  text-decoration: none;
}

#topnav a:link {
  color: #856d52;
}

#topnav a:visited {
  color: #ad987e;
}

#topnav a:hover {
  color: #ad987e;
}

#topnav a:active {
  color: #ad987e;
}

#topnav ul li ul li.selected a { 
  color: #ad987e;
}

/* Peace */

#topnav #peacenav {
	float: left;
	margin: 0px;
}

#peacenav, #peacenav span {
	width: 120px
	
}

/* Friends */

#topnav #friendsnav {
	float: left;
	margin: 0;
}

#friendsnav, #friendsnav span {
	width: 120px
	
}

/* About */

#topnav #aboutnav {
	float: left;
	margin: 0;
}

#aboutnav, #aboutnav span {
	width: 120px
	
}

/* Boutique */

#topnav #boutiquenav {
	float: left;
	margin: 0;
}

#boutiquenav, #boutiquenav span {
	width: 125px
	
}

/* Collections */

#topnav #collectionsnav {
	float: left;
	margin: 0;
}

#collectionsnav, #collectionsnav span {
	width: 150px
	
}

/* Home */
#topnav #homenav {
  float: left;
  margin: .2;
}

#homenav, #homenav span {
  width: 100px;
}

#homenav span {
  background: url("/images/banner.gif") top left no-repeat;
}



	/* The containing box for the gallery. */ 
#container { 
	
	/*position:relative;
	top: 40px;
	left: -125px;*/
	float:left;
	width:700px; 
	height:396px; 
	margin:30px auto 0 auto;
	/*border: 1px solid #aaa;*/

}


	/* Remove the images and text from sight */ 
#container a.gallery span { 
	position:absolute; 
	width:1px; 
	height:1px; 
	top:5px; 
	left:5px; 
	overflow:hidden; 
	background:#fff; 
} 

	/* Adding the thumbnail images */ 
	#container a.gallery, #container a.gallery:visited { 
	    display:block; 
	    color:#000; 
	    text-decoration:none; 
	    border:0px solid #000; 
	    margin:1px 5px 1px 2px; 
	    text-align:left; 
	    cursor:default; 
	    } 
	#container a.slidea { 
	    background:url(images/oceanthumbnail1.jpg); 
	    height:75px; 
	    width:75px; 
	    } 
	#container a.slideb { 
	    background:url(images/oceanthumbnail2.jpg); 
	    height:75px; 
	    width:75px; 
	    } 
	#container a.slidec { 
	    background:url(images/oceanthumbnail3.jpg); 
	    height:75px; 
	    width:75px; 
	    } 
	#container a.slided { 
	    background:url(images/oceanthumbnail4.jpg); 
	    height:75px; 
	    width:75px; 
	    } 
	#container a.slidee { 
	    background:url(images/oceanthumbnail5.jpg); 
	    height:75px; 
	    width:75px; 
	    } 
	#container a.slidef { 
	    background:url(images/oceanthumbnail6.jpg); 
	    height:75px; 
	    width:75px; 
	    }  
	#container a.slideg { 
	    background:url(images/oceanthumbnail7.jpg); 
	    height:75px; 
	    width:75px; 
	    } 
	#container a.slideh { 
	    background:url(images/oceanthumbnail8.jpg); 
	    height:75px; 
	    width:75px; 
	    } 
	#container a.slidei { 
	    background:url(images/oceanthumbnail9.jpg); 
	    height:75px; 
	    width:75px; 
	    } 

		
			/* set the size of the unordered list to neatly house the thumbnails */ 
#container ul { 
	width:300px; 
	height:300px;
} 
#container li { 
	float:left; 
} 

		/* move the thumbnails into the correct position */ 
		#container ul { 
			
		
			margin:0px;
			float: left;
			position: relative;
			top: 165px;
			left: 25px;
			 
		} 

	/* change the thumbnail border color */ 
	#container a.gallery:hover { 
	    border:0px solid #fff; 
	    } 
		
	/* styling the :hover span */ 
	#container a.gallery:hover span { 
	    position:absolute; 
	    width:331px; 
	    height:394px; 
	    top:-174px; 
	    left:300px; 
	    color:#000; 
	    background:#fff; 
	    } 
	
	#container a.gallery:hover img { 
	    border:1px solid #fff; 
	    float:left; 
	    margin-right:5px; 
	    } 	
		
	#container { 
	    background:#fff url(images/ocean1.jpg) 325px 1px no-repeat;
	    } 
		
	#story p { 
	
	font-family: Comic Sans MS;
	font-size: 13px;
	font: itallic;
	width: 665px;
	color: #bea288;
	padding: 0px 0px 0px 10px;
	}
		
	#footer { 

float: left;


}
		
		<div class="generic eighteighty pagination end clear"></div>

