/*

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

*/


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


/* =Base Structure
============================================================================== */
	


	#content {
	position: relative;
	margin-left: auto;
	margin-right: auto;
	width: 640px;
	height: 160px;
	overflow: auto;
	background: #FFF;
		}
		

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

	/* =Reflection Nav
	-------------------------------------------------------------------------- */
		
		#nav-reflection {
			margin: 0 0 10px 0px;
			padding: 10px 0 0 0px;
			width: 620px;
			min-height: 40px;
			background: url(http://www.jonzmikly.com/sjmc/buttons/images/page-shadow.jpg) top center no-repeat;
			list-style: none;
			}
			
		#nav-reflection li {
			margin-right: 10px;
			width: 145px;
			float: left;
			}
			
		#nav-reflection a, #nav-reflection a:visited, #nav-reflection a:hover {
			width: 150px;
			height: 60px;
			text-indent: -9999px;
			overflow: hidden;
			background: url(http://www.jonzmikly.com/sjmc/buttons/images/icons.png) no-repeat;
			display: block;
			}
			
		#nav-reflection span {
			margin-top: 1px;
			width: 150px;
			height: 60px;
			text-align: center;
			background: url(http://www.jonzmikly.com/sjmc/buttons/images/icons-reflections.jpg) no-repeat;
			display: block;
			}
			
		/* Button Colors */
		
		#nav-reflection li.button-color-1 a {
			background-position: 0px 0px;
			}
			
		#nav-reflection li.button-color-2 a {
			background-position: -151px 0px;
			}
			
		#nav-reflection li.button-color-3 a {
			background-position: -300px 0px;
			}
			
		#nav-reflection li.button-color-4 a {
			background-position: -450px 0px;
			}
			
		/* Button Reflection Color */
		
		#nav-reflection li.button-color-1 span {
			background-position: 0px 0px;
			}
			
		#nav-reflection li.button-color-2 span {
			background-position: -151px 0px;
			}
			
		#nav-reflection li.button-color-3 span {
			background-position: -300px 0px;
			}

		#nav-reflection li.button-color-4 span {
			background-position: -450px 0px;
			}			
			
			
	/* =Shadow Nav
	-------------------------------------------------------------------------- */
		
		#nav-shadow {
			margin: 0 auto 0px auto;
			padding: 0px 0 0 0px;
			width: 600px;
			min-height: 40px;
			text-align: center;
			background: url(http://www.jonzmikly.com/sjmc/buttons/images/page-shadow.jpg) top center no-repeat;
			list-style: none;
			}
			
		#nav-shadow li {
			margin-right: 10px;
			width: 150px;
			height: 40px;
			position: relative;
			float: left;
			}
			
		#nav-shadow a, #nav-shadow a:visited, #nav-shadow a, #nav-shadow a:hover {
			margin: 0 auto;
			width: 150px;
			height: 40px;
			text-indent: -9999px;
			overflow: hidden;
			background: url(http://www.jonzmikly.com/sjmc/buttons/images/icons.png) no-repeat;
			display: block;
			position: relative;
			z-index: 2;
			}
			
		/* Button Colors */
		
		#nav-shadow li.button-color-1 a {
			background-position: 0px -3px;
			}
			
		#nav-shadow li.button-color-2 a {
			background-position: -151px -3px;
			}
			
		#nav-shadow li.button-color-3 a {
			background-position: -300px -3px;
			}
			
		#nav-shadow li.button-color-4 a {
			background-position: -450px -3px;
			}
			
			
		/* Button Shadow */
		
		#nav-shadow li img.shadow {
			margin: 0 auto;
			position: absolute;
			bottom: 0;
			left: 0;
			z-index: 1;
			}