﻿/*

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

*/


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

	@import url("resets.css");


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

	#content {
		width: 800px;
		margin: 100px auto;
		}
		
/* =Navigation
============================================================================== */

	/* =Reflection Nav
	-------------------------------------------------------------------------- */
		
		#nav-reflection {
			margin: 0 auto 50px auto;
			padding: 50px 0 0 172px;
			width: 452px;
			min-height: 130px;
			background: url(../images/page-shadow.jpg) top center no-repeat;
			list-style: none;
			}
			
		#nav-reflection li {
			margin-right: 15px;
			width: 59px;
			float: left;
			}
			
		#nav-reflection a, #nav-reflection a:visited, #nav-reflection a:hover {
			width: 59px;
			height: 59px;
			text-indent: -9999px;
			overflow: hidden;
			background: url(../images/icons-nord01.png) no-repeat;
			display: block;
			}
			
		#nav-reflection span {
			margin-top: 1px;
			width: 59px;
			height: 34px;
			text-align: center;
			background: url(../images/icons-reflections.jpg) no-repeat;
			display: block;
			}
			
		/* Button Colors */
		
		#nav-reflection li.button-color-1 a {
			background-position: -3px -3px;
			}
			
		#nav-reflection li.button-color-2 a {
			background-position: -92px -3px;
			}
			
		#nav-reflection li.button-color-3 a {
			background-position: -181px -3px;
			}
			
		#nav-reflection li.button-color-4 a {
			background-position: -270px -3px;
			}
			
		#nav-reflection li.button-color-5 a {
			background-position: -359px -3px;
			}

		#nav-reflection li.button-color-6 a {
			background-position: -448px -3px;
			}

		#nav-reflection li.button-color-7 a {
			background-position: -537px -3px;
			}

		#nav-reflection li.button-color-8 a {
			background-position: -626px -3px;
			}

		#nav-reflection li.button-color-9 a {
			background-position: -715px -3px;
			}

		#nav-reflection li.button-color-10 a {
			background-position: -804px -3px;
			}

		#nav-reflection li.button-color-11 a {
			background-position: -893px -3px;
			}

		#nav-reflection li.button-color-12 a {
			background-position: -982px -3px;
			}

		#nav-reflection li.button-color-13 a {
			background-position: -1071px -3px;
			}

		#nav-reflection li.button-color-14 a {
			background-position: -1160px -3px;
			}

		/* Button Reflection Color */
		
		#nav-reflection li.button-color-1 span {
			background-position: 0 0;
			}
			
		#nav-reflection li.button-color-2 span {
			background-position: -89px 0;
			}
			
		#nav-reflection li.button-color-3 span {
			background-position: -178px 0;
			}
			
		#nav-reflection li.button-color-4 span {
			background-position: -267px 0;
			}

		#nav-reflection li.button-color-5 span {
			background-position: -356px 0;
			}

		#nav-reflection li.button-color-6 span {
			background-position: -445px 0;
			}

		#nav-reflection li.button-color-7 span {
			background-position: -534px 0;
			}

		#nav-reflection li.button-color-8 span {
			background-position: -623px 0;
			}

		#nav-reflection li.button-color-9 span {
			background-position: -712px 0;
			}

		#nav-reflection li.button-color-10 span {
			background-position: -801px 0;
			}

		#nav-reflection li.button-color-11 span {
			background-position: -890px 0;
			}

		#nav-reflection li.button-color-12 span {
			background-position: -979px 0;
			}

		#nav-reflection li.button-color-13 span {
			background-position: -1068px 0;
			}

		#nav-reflection li.button-color-14 span {
			background-position: -1157px 0;
			}
			
			
	/* =Shadow Nav
	-------------------------------------------------------------------------- */
		
		#nav-shadow {
			margin: -20px auto 12px auto;
			padding: 23px 0 0 4px;
			width: 960px;
			/* min-height: 60px; */
			height:96px;
			text-align: center;
			background: url(../images/page-shadow.jpg) top center no-repeat;
			list-style: none;
			}
			
		#nav-shadow li {
			margin-right: 11px;
			width: 53px;
			height: 72px;
			position: relative;
			float: left;
			}
			
		#nav-shadow a, #nav-shadow a:visited, #nav-shadow a, #nav-shadow a:hover {
			margin: 0 auto;
			width: 64px;
			height: 64px;
			text-indent: -9999px;
			overflow: hidden;
			background: url(../images/icons-sued01.png) no-repeat;
			display: block;
			position: relative;
			z-index: 2;
			}
			
		/* Button Colors */
		
		#nav-shadow li.button-color-1 a {
			background-position: -3px -3px;
			}
			
		#nav-shadow li.button-color-2 a {
			background-position: -92px -3px; */
			}
			
		#nav-shadow li.button-color-3 a {
			background-position: -181px -3px;
			}
			
		#nav-shadow li.button-color-4 a {
			background-position: -270px -3px;
			}
			
		#nav-shadow li.button-color-5 a {
			background-position: -359px -3px;
			}

		#nav-shadow li.button-color-6 a {
			background-position: -448px -3px;
			}

		#nav-shadow li.button-color-7 a {
			background-position: -537px -3px;
			}

		#nav-shadow li.button-color-8 a {
			background-position: -626px -3px;
			}

		#nav-shadow li.button-color-9 a {
			background-position: -715px -3px;
			}

		#nav-shadow li.button-color-10 a {
			background-position: -804px -3px;
			}

		#nav-shadow li.button-color-11 a {
			background-position: -893px -3px;
			}

		#nav-shadow li.button-color-12 a {
			background-position: -982px -3px;
			}

		#nav-shadow li.button-color-13 a {
			background-position: -1071px -3px;
			}

		#nav-shadow li.button-color-14 a {
			background-position: -1160px -3px;
			}

		#nav-shadow li.button-color-15 a {
			background-position: -1235px -3px;
			}

		/* Button Shadow */
		
		#nav-shadow li img.shadow {
			margin: 0 auto;
			position: absolute;
			bottom: 0;
			left: 0;
			z-index: 1;
			}