/*

Screen Stylesheet for jQuery Realistic Hover Effect
Created by Adrian Pelletier
http://www.adrianpelletier.com

*/


/* =Imports
============================================================================== */

	@import url("resets00.css");


/* =Base Structure
============================================================================== */
	
	html body {
		font:12pt/1.5 Georgia, Palatino, "Palatino Linotype", serif;
		color:#555;		
		}

	#nav {
	 
		width: 960px;
		height:80px;
		margin: 15px auto 10px auto;
		padding:5px;
		clear:both;


		}
		
	h1 {
		font-size: 20px;
		color: #7f2d2d;
		text-align: center;
		}
		
	p {
		text-align: center;
		}

/* =Navigation
============================================================================== */

	/* =Reflection Nav
	-------------------------------------------------------------------------- */
		
		#nav-reflection {
			margin: 0px auto;
			padding: 15px 0 0 5px;
			width: 720px;
			min-height:90px;
			background: url(../img/page-sh.jpg) top center no-repeat;
			list-style: none;

			}
			
		#nav-reflection li {
			margin-right: 80px;
			width: 100px;
			float: left;				
		
			
			}
			
		#nav-reflection a, 
		#nav-reflection a:visited, 
		#nav-reflection a:hover 
		{
			width: 100px;
			height: 25px;
			text-indent: -9999px;
			overflow: hidden;
			display: block;
		}	
			
			
		#nav-reflection span 
		{
			margin-top: 1px;
			width: 100px;
			height: 25px;
			text-align: center;
			display: block;
		}
		
	/*-------------------------------------------------------*/			
	/* Button Colors */
		
		#nav-reflection li.button-color-1 a 
		{
		    background:url('../img/work.png') no-repeat;	
		}
			
		#nav-reflection li.button-color-2 a 
		{
			background:url('../img/projects.png') no-repeat;		
		}
			
		#nav-reflection li.button-color-3 a 
		{
			background:url('../img/fresh.png') no-repeat;		
		}
			
		#nav-reflection li.button-color-4 a 
		{
			background:url('../img/contacts.png') no-repeat;		
		}
		
	/* Button Colors Active*/
		
		#nav-reflection li.button-color-1a a 
		{
		    background:url('../img/work_a.png') no-repeat;	
		}
			
		#nav-reflection li.button-color-2a a 
		{
			background:url('../img/projects_a.png') no-repeat;		
		}
			
		#nav-reflection li.button-color-3a a 
		{
			background:url('../img/fresh_a.png') no-repeat;		
		}
			
		#nav-reflection li.button-color-4a a 
		{
			background:url('../img/contacts_a.png') no-repeat;		
		}
			
	/*-------------------------------------------------------*/	
	/* Button Reflection Color */
		
		#nav-reflection li.button-color-1 span 
		{
			background:url('../img/rwork.png') no-repeat;	
		}
			
		#nav-reflection li.button-color-2 span 
		{
			background:url('../img/rprojects.png') no-repeat;
		}
			
		#nav-reflection li.button-color-3 span 
		{
			background:url('../img/rfresh.png') no-repeat;	
		}
			
		#nav-reflection li.button-color-4 span 
		{
			background:url('../img/rcontacts.png') no-repeat;
		}
			

	/* Button Reflection Color Active*/
		
		#nav-reflection li.button-color-1a span 
		{
			background:url('../img/rwork_a.png') no-repeat;	
		}
			
		#nav-reflection li.button-color-2a span 
		{
			background:url('../img/rprojects_a.png') no-repeat;
		}
			
		#nav-reflection li.button-color-3a span 
		{
			background:url('../img/rfresh_a.png') no-repeat;	
		}
			
		#nav-reflection li.button-color-4a span 
		{
			background:url('../img/rcontacts_a.png') no-repeat;
		}