body{
	background: url(../images/slPageBG.gif) top left repeat-x #040200;
	padding: 0;
	margin: 0;
	font-family: Arial, Helvetica, sans-serif;
	}
	
h1{
	color: #fff;
	background: url(../images/h1BG.gif) top left no-repeat #84796b;
	font-size: 20px;
	text-transform: uppercase;
	vertical-align: baseline;
	margin: 0;
	height: 22px;
	padding: 24px 0 0 10px;
	font-family: Helvetica, Arial, sans-serif;
	}
	
h2{
	font-size: 16px;
	color: #f7941e;
	}
	
a img{
	border: none;
	}
	
a:link, a:visited{
	color: #f7941e;
	text-decoration: none;
	}
	
a:hover{
	text-decoration: underline;
	}
	
#container{
	width: 927px;
	margin: 0px auto;
	padding-top: 30px;
	}
	
#header	{
	width: 927px;
	height: 150px;
	margin-bottom: 10px;
	}
	
	#logo{
		float: left;
		width: 150px;
		}
		
	#tagline{
		float: left;
		width: 351px;
		padding: 121px 0 0 426px;
		}
	
#navigation{
	clear: both;
	background: url(../images/navBG.gif) no-repeat;
	height: 36px;
	padding: 4px 5px;
	margin-bottom: 5px;
	}
	
	#navigation ul{
		list-style-type: none;
		display: inline;
		margin: 0;
		padding: 0;
		}
		
	#navigation ul li{
		display: inline;
		}
		
	#navigation a{
		text-decoration: none;
		outline: none;
		}
		
	/* ** PORTFOLIO NAV ** */
	
	.portfolioNav{
		background: #c6c1bb;
		font-size: 12px;
		height: 22px;
		padding: 10px 0 0 10px;
		margin-top: 2px;
		font-family: Helvetica, Arial, sans-serif;
		}
		
		.portfolioNav a:link, .portfolioNav a:visited{
			padding: 0 5px 9px 5px;
			font-size: 12px;
			color: #040200;
			text-decoration: none;
			}		
		
		.portfolioNav a:hover, .portfolioNav a.active{
			text-decoration: underline;
			}
			
		#gallery{
			float: left;
			width: 430px;
			height: 22px;
			text-transform: uppercase;
			}
		
		#pages{
			float: left;
			text-align: right;
			width: 470px;
			height: 22px;
			}
		
#flash{
	margin: 0px auto;
	width: 927px;
	height: 565px;
	}
	
#content{
	background: url(../images/contentBG.gif) bottom left  no-repeat #fff;
	min-height: 374px;
	overflow: auto;
	}
	
	#textArea{
		float: left;
		width: 622px;
		font-size: 11px;
		color: #666;
		}
		
	#galleryArea{
		float: left;
		width: 927px;
		font-size: 11px;
		color: #666;
		}
	
	
	.mainContent{
		padding: 10px;
		}
		
	#contentImg{	
		float: left;
		width: 305px;
		}
	
	#contact{
		float: left;
		width: 150px;
		line-height: 15px;
		}
		
		.company{
			font-size: 16px;
			}

	.rtCol{
		float: left;
		width: 450px;
		margin-bottom: 10px;
		}
		
	form{
		float: left;
		padding: 0 0 20px 0px;
		overflow: auto;
		width: 450px;
		}
		
	.formInput{
		border: 1px solid #84796B;
		width: 200px;
		padding: 5px;
		}
		
	.rtImage{
		float: right;
		margin: 0 0 10px 10px;
		}
		
	#thumbnails{
		width: 230px;
		float: right;
		}
		
		#thumbnails img{
			float: left;
			margin: 0 0 10px 10px;
			border: 1px solid #333;
			}	
	
#footer{
	clear: both;
	color: #666;
	margin-top: 10px;
	padding: 10px;
	font-size: 10px;
	}
	
	#copy{
		float: left;
		padding-top: 8px;
		height: 20px;
		vertical-align: baseline;
		}
	
	#designko{
		height: 20px;
		float: left;
		padding: 0 0 0 640px;
		}
		
		

/* *** sIFR styles *** */

@media screen {
  .sIFR-flash {
    visibility: visible !important;
    margin: 0;
    padding: 0;
  }
  
  .sIFR-replaced, .sIFR-ignore {
    visibility: visible !important;
  }
  
  .sIFR-alternate {
    position: absolute;
    left: 0;
    top: 0;
    width: 0;
    height: 0;
    display: block;
    overflow: hidden;
  }
  
  .sIFR-replaced div.sIFR-fixfocus {
    margin: 0pt; 
    padding: 0pt; 
    overflow: auto; 
    letter-spacing: 0px; 
    float: none;
  }
}

@media print {
  .sIFR-flash {
    display    : none !important;
    height     : 0;
    width      : 0;
    position   : absolute;
    overflow   : hidden;
  }
  
  .sIFR-alternate {
    visibility : visible !important;
    display    : block   !important;
    position   : static  !important;
    left       : auto    !important;
    top        : auto    !important;
    width      : auto    !important;
    height     : auto    !important;
  }
}

/*
Place CSS rules for to-be-replaced elements here. Prefix by .sIFR-active
so they only apply if sIFR is active. Make sure to limit the CSS to the screen
media type, in order not to have the printed text come out weird.
*/
@media screen {
/*  .sIFR-active h1 {
    font-family: Verdana;
    visibility: hidden;
  }
*/
}

/* *** Lightbox Styles *** */

#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}
	

/* Min-Width */
.lbWidth { /* most browsers */
	position: absolute;
	top: 0px; left: 0px;
	width: 100%;
	min-width: 790px;
	}

* html .lbContent { /* IE6 */
	margin-left: -790px;
	position:relative;
	}

* html .lbMinWidth { /* IE6 */
	padding-left: 790px;
	}
	
	
/* Clearfix */	
.clearfix:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */ 
	

/* *** Gallery Styles *** */

	
.galleria_container{
	float: right;
	width: 600px;
	margin: 0 0 0 10px;
	display: block;
	border: 1px solid #fff;
	}
	
.galleria_container img{
	border: 1px solid #040200;
	}
	
.galleria_wrapper{
	text-align: center;
	}

.galleria{
	list-style: none;
	width: 285px; 
	float: right;
	margin: 0;
	padding: 0;
	}

.galleria li{
	display: block;
	width: 80px;
	height: 80px;
	overflow: hidden;
	float: left;
	margin: 0 10px 10px 0;
	border: 1px solid #040200;
	}

.galleria li a{
	display: none
	}

.galleria li div{
	position: absolute;
	display: none;
	top: 0;
	left: 180px
	}

.galleria li div img{
	cursor: pointer;
	
	}

.galleria li.active div img,.galleria li.active div{
	display: block
	}

.galleria li img.thumb{
	cursor: pointer;
	top: auto;
	left: auto;
	display: block;
	width: auto;
	height: auto;
	
	}

.galleria li .caption{
	display: block;
	padding-top: .5em;
	}
	
.nav{
	clear: right;
	}

* html .galleria li div span{width:400px} /* MSIE bug */

