@charset "utf-8";
/* CSS Document */

/* Normalizes margin padding and borders */
body, div, dl, dt, dd, ul, li, ol, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td { margin : 0; padding : 0; }
fieldset, img{ border : 0; }

/* Normalizes font-size, font weight, list styles and decorations */
h1, h2, h3, h4, h5, h6 { font-size : 100%; font-weight:100; }
ol, ul { list-style : none; }
address, caption, cite, code, dfn, em, strong, th, var { font-style : normal; font-weight : normal; }
a { text-decoration:none; }

/*----- Links (default colors) -----*/

a:link, a:visited {	color:#999; }
a:hover, a:focus  {	 }

/*----- Body (default font/size ) -----*/

@font-face {
	font-family: 'ChampignonRegular';
	src: url('fonts/champignon-webfont.eot');
	src: local('Champignon'), local('Champignon'), url('fonts/champignon-webfont.woff') format('woff'), url('fonts/champignon-webfont.ttf') format('truetype'), url('fonts/champignon-webfont.svg#webfontP80pXMDc') format('svg');
	font-weight: normal;
	font-style: normal;

}

/*  <!-- HTML and Body Layout -->  */

html {
	position:relative;
	background: black url('images/b01.gif') 50% 0px;
	min-width:740px;
	text-align : center; /* Hack to center page in IE6 */
}

body {
	font-family:"arial", Gadget, sans-serif;
	font-size:31.25%;
	color:white;
	width : 740px;
	margin : 60px auto; /* margin : "" "auto" correct way to center the page in current browsers  */
	margin-bottom: 20px;
	text-align : left;
}

/*  <!-- 1. Branding -->  */

div.branding { 
	position:relative;
	width : 740px;
	height : 555px;
	margin-bottom:20px;
}

div.branding h1, div.branding h2, div.branding h3, div.branding form {
	display:none;
}

/*  <!-- 2. Navigation -->  */

.navigation { position:relative;  width:100%; overflow:hidden; font-family: 'ChampignonRegular', "arial"; margin-top:140px; font-size:7em; letter-spacing:3px; }

.navigation h2{
	position: fixed;
	z-index:1000;
	top:0%;
	left:0%;
	background: url('images/c01_left.png') left top no-repeat;
	width:200px;
	height:2000px; 
	text-indent:-9999px; overflow:hidden; }/* hides navigation h3 */

.navigation ul {
	 z-index:20000;
	clear:left;
	float:left;
	text-align:center; 
	position:relative;
	left:50%;
}
	
.navigation li { display:block; float:left; padding:0px 10px; position:relative; right:50%;
}

#nav_home:hover, #nav_home:focus { color:#e823ff; }
#nav_about_us:hover, #nav_about_us:focus, body#about_us #nav_about_us { color:#ff0025;  }
#nav_portfolio:hover, #nav_portfolio:focus, body#portfolio #nav_portfolio { color:#FFE324;  }
#nav_directions:hover, #nav_directions:focus, body#directions #nav_directions { color:#00f269; }
#nav_contact_us:hover, #nav_contact_us:focus, body#contact_us #nav_contact_us { color:#3785f9; }









/*  <!-- 3. Content -->  */

.content p {
	font-size:2.2em;
	letter-spacing:0.1em;
	text-align:justify;
}

.content h2 {
	height:0px;
	text-indent:-9999px;
	overflow:hidden;
}

.content h3 {
	font-family: "arial";
	text-align:center;
	font-size:22em;
	margin-bottom:40px;
}

.content h4 {
	font-size:2.2em;
}


/*  <!-- 4. Site Info -->  */
 
.site_info { font-size:2em; color:#777; text-align:center; margin-top:20px; }

.site_info h2 {
	background : url('images/c01_top.png') repeat-x top center;
	position:absolute;
	z-index:10000;
	left:0px;
	top:0px;
	height:120px;
	width:100%;
		text-indent:-9999px; overflow:hidden;}/* hides navigation h3 */

.site_info h3 {
	position: fixed;
	z-index:1000;
	top:0%;
	right:0%;
	background: url('images/c01_right.png') right top repeat-y;
	width:200px;
	min-height:2000px; 
	text-indent:-9999px; overflow:hidden;
 }/* hides navigation h3 */

.site_info a { color:#777; }