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


body{ 
	background:#000 url(../img/bg_body.png) center 64px no-repeat;
	color:#fff;
	font:62.5%/1.6 Verdana, "MS Sans Serif", Geneva, sans-serif;
	width:960px;
	margin:0 auto;}
	
#wrapper {
	position:relative;
	text-align:left;
	background:#000;}

p{margin:0 0 1em 0;font-size:1.1em;}
h3{margin:0 0 1em 0;font-size:1.5em;}
a {color:#666; text-decoration:none;}
a:hover {color:#ed1c24; border:1px dotted #ccc;border-width:0 0 1px 0;padding:0 0 2px 0;}

ul.nav {
	position:relative;
	top: 0;
	left:94px;
	height:62px;
	}
	.nav li{float:left;}
	.nav li a{text-indent:-10000px;display:block;height:62px;}
	
	a.about{background:#000 url(../img/menu_sprite.png) 0 0 no-repeat; width:109px;}
	a.about:hover{background-position:0 -62px;}
	body#about a.about{background:#000 url(../img/menu_sprite.png) 0 -62px no-repeat; width:109px;}
	
	a.services{background:#000 url(../img/menu_sprite.png) -109px 0 no-repeat; width:107px;}
	a.services:hover{background-position:-109px -62px;}
	body#services a.services{background:#000 url(../img/menu_sprite.png) -109px -62px no-repeat; width:107px;}
	
	a.portfolio{background:#000 url(../img/menu_sprite.png) -216px 0 no-repeat; width:116px;}
	a.portfolio:hover{background-position:-216px -62px;}
	body#portfolio a.portfolio{background:#000 url(../img/menu_sprite.png) -216px -62px no-repeat; width:116px;}
	
	a.contact{background:#000 url(../img/menu_sprite.png) -330px 0 no-repeat; width:116px;}
	a.contact:hover{background-position:-330px -62px;}
	body#contact a.contact{background:#000 url(../img/menu_sprite.png) -330px -62px no-repeat; width:116px;}

#strip{
	background:#000 url(../img/header_bar.png) 0 0 no-repeat;
	position:relative;
	top:0; left:0px;
	height:100px;}
	#strip a img {position:absolute;right:4px;}

#content{
	position:relative;
	top:39px;
	width:960px;
	color:#000;
	text-align:left;}
	
#content .inner-content{background:#fff; width:100%; height:333px; }
#content .inner-content div {height:293px; padding:20px 20px 20px 114px;}
#content .inner-content img{float:right; margin:0 0 0 40px;}
#content .inner-content-info strong{color:#ed1c24;}
#content .inner-content-info{background:#fff; width:100%; height:293px; width:526px; padding:20px 320px 20px 114px;}

#footer{
	position:absolute;
	top:580px; left:0px;
	background:#000 url(../img/footer-logo.png) 0 0 no-repeat;
	width:116px; height:59px;}
	
ul.tab{position:absolute;background:fff;top:-20px;left:114px;}
	li.contact {background:#000 url(../img/tabs_sprite.png) -564px -20px no-repeat;width:94px; height:20px;}
	li.about {background:#000 url(../img/tabs_sprite.png) -470px -20px no-repeat;width:94px; height:20px;}
	li.portfolio {background:#000 url(../img/tabs_sprite.png) -658px -20px no-repeat;width:94px; height:20px;}

/* portfolio slider*/	
div.pane{background-color:#fff;overflow:hidden;clear:left;position:relative;width:912px;height:309px;
	border:2px #fff solid;border-width:12px 24px 12px 24px;}
/* hide prev arrow initially */
#prev {display:none;position:absolute;top:0px;left:2px;background:url(../img/arrows_left.png) no-repeat 0 120px;width:82px;height:333px;z-index:99;cursor:pointer;}
#next {position:absolute;top:0px;left:810px;background:url(../img/arrows_right.png) no-repeat 130px 120px;width:152px;height:333px;z-index:99;cursor:pointer;}
ul.elements li{float:left;width:300px;height:311px;border:2px #fff solid;border-width:0 24px 0 0;
	text-align:center;position:relative;background-color:#fff;}
ul.elements li .sample-box{width:300px; height:300px; background:#fff;}
ul.elements li .sample-box img{float:right;width:300px;height:240px;}
ul.elements li .sample-box p{clear:both; text-align:left;}
	
/* slider modal */	
#slider{text-align:center;margin-top:20px;}	
#slider ul, #slider li{margin:0;padding:0;list-style:none;}
#slider ul{width:560px;}
#slider li{ display:block;width:550px;height:460px;overflow:hidden;}	
#slider li p{text-align:left;margin:0 0 0 90px;}
#prevBtn, #nextBtn{ 
	display:block;
	width:30px;
	height:33px;
	position:absolute;
	left:0px;
	top:100px;z-index:99;}	
#nextBtn{left:531px;}														
#prevBtn a, #nextBtn a{  
	display:block;
	width:22px;
	height:33px;
	background:url(../img/arrows_left.png) no-repeat 0 0;
	text-indent:-10000px;
	border:none;}	
#nextBtn a{background:url(../img/arrows_right.png) no-repeat 0 0;text-indent:-10000px;}
	

	
 /* this class should be placed on a div or break element and should be the final 
 	element before the close of a container that should fully contain a float */
.clearfloat {
	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;}