/*-----------------------------------------------------------------------------
Style Sheet (Main)

version:   1.0
author:    k@revolutionaryfocus.com
website:   http://www.revolutionaryfocus.com
-----------------------------------------------------------------------------*/

/* = General
-----------------------------------------------------------------------------*/
*{
margin: 0;
padding: 0;
}

body{
color:#808080;
font-size:62.5%;
font-family: Verdana, sans-serif;
background:#363637 url(../images/bodyBackground.jpg) repeat-x left top;
line-height:1.8em;
}

html { height: 100%; margin-bottom: 1px; }

h1,h2{
font-size:1em;
color:#5fafc7;
font-weight:100;
text-align:left;
line-height:1.4em;
padding:0.3em 0 0.3em 3em;
background:url(../images/h1Background.jpg) no-repeat left top;}

#selectedh1{
color:#ccc;
background:url(../images/arrows.jpg) no-repeat -3px -3px;
}

h1 a{
color:#808080;
display:block;
padding:0.3em 0 0.3em 3em;
margin-left:-2.5em;
background:url(../images/arrows.jpg) no-repeat -3px -28px;
}
h1 a:hover{
color:#ccc;
background:url(../images/arrows.jpg) no-repeat -3px -3px;
}

li{
list-style:none;
}

a{
text-decoration:none;
outline-style: none !important;
}
.clear, .project{
clear:both;
}
.left{
float:left;
}

.right{
float:right;
}
#awards .last{background:none;}

/* = Header
-----------------------------------------------------------------------------*/
#header h1 {
text-indent:-3000px;
display:block;
width:800px;
height:90px;
position:relative;
margin:0 auto 0 auto;
padding-left:-10px;
background:url(../images/revolutionaryfocus.png) no-repeat;
}

/* = Content
-----------------------------------------------------------------------------*/
#stageWrapper{	
margin:0 auto;
width:900px;
background:url(../images/wrapperShadow.png) repeat-y;
}

#bottomShadow{
margin:0 auto;
display:block;
height:20px;
width:863px;
background:#363637 url(../images/footerShadow.png) no-repeat 2px 0;
}

#stage{
width:808px;
margin:0 auto;
padding:1.3em 1.3em;
background:#272727  url(../images/stageBackground.jpg) no-repeat center top;
}

#primaryContent {
width:100%;
margin-bottom:1.3em;
}

#primaryContent #intro{
padding:18px;
height:61px;
background: url(../images/introBackground.jpg) no-repeat left top;
}

#primaryContent span{
color:#ccc;
}

/*---------------------------------------*/

.project #navThumbnails li{
float:left;
margin-left: 1.3em;
text-align:center;
}
.project ul{
height:1%;
padding:0;
}
.project #navThumbnails img, #overImg{
padding:4px 9px 11px 9px;
border:#fff solid 0px;
background:url(../images/overlayThumbnail.png) no-repeat 0px 0px;
}

.project #navThumbnails li a{
color:#808080;
}

.project #navThumbnails ul li a:hover{
border-bottom:#fff solid 2px;
display:block;
}

/*---------------------------------------*/

#wrapper{
width:100%;
position:relative;
overflow:hidden;																			
}

#projectView{
float:right;	
width:620px;
height:0em;
margin-top:1.3em;
position:relative;
overflow:hidden;																							
}

#projectView h1{
color:#ccc;
padding:0.3em 0 0.3em 1em;
height:18px;
}

#projectView #projectContent{
width:616px;
padding-left:2em;
background:url(../images/right_shadow.png) left top no-repeat;
}

#projNavDiv ul 
{
width:160px;
height:400px;
}

#projNavDiv ul{
margin-top:1.3em;
position:absolute;
top:0.4em;																	
}
#projNavDiv ul li{
text-align:right;
background:url(../images/bottom_shadow.jpg) no-repeat bottom center;
padding: 0 0 1.5em 2.6em;
}

#projNavDiv ul .last{
background:none;
}

#projNavDiv ul li a{
color:#808080;
padding-right: 1.3em;
background:url(../images/link.gif) right center no-repeat;
}

/*---------------------------------------*/

#projectView #projectContent #projDetails{
float:right;
width:15em;
}

#projectView #projectContent #projDetails ul{
margin-top:1.2em;
}

#projectView #projectContent #projDetails ul li{
text-align:left;
border:#fff solid 0.1em;
background: #eee url(../images/detail.arrow.jpg) no-repeat 0.4em;
padding: 0.6em 0.3em 0.6em 2.4em;	
}

#projectView #projectContent #dtlDisc{
height:15.5em;
padding:1em;																		
background:#e6e5e5;
border:#FFF solid 0.6em;
border-top:#FFF solid 0.1em;
}
/*---------------------------------------*/


#mainImage, #flash{
border:#FFFFFF solid 0px;
position:absolute;
left:1.2em;
top:45px;
}

#flash{ height:256px;}

#projectView #projImage {																				
float:left;
position:relative;																			
width:574px;
height:323px;
background:url(../images/overlay.png) no-repeat ;
}

#thumbnailContainer{
position:absolute;
width:165px;
height:268px;
left:400px;
top:33px;
}

#thumbnailContainer a img{
position:absolute;
border:none;
left:13px;
top:12px;
}
#thumbnailContainer #firstThumbnail{
top:0px !important;
}


#thumbnailContainer a{
display:block;
position:absolute;
width:170px;
height:137px;
top:148px;
background:url(../images/overlayThumbnail1.png) no-repeat;
}

/*---------------------------------------*/

#projOverview a:link, #projOverview a:visited, #projOverview a:active
{
color:#fff;
}

#projOverview a:hover
{
color:#fff;
text-decoration:underline;
}

#projectView #projectContent #projOverview{
width:39em;
float:left;
}
#projectView #projectContent #projOverview p{
padding:0 1.3em;
margin:-6px 0 0 0;																		
}


/*---------------------------------------*/
#projectView #projectContent #projRoles{																					
float:left;
width:16.8em;
margin-left:1.6em;		
}

#projRoles ul
{
margin:-6px 0 0 0;
}

#projectView #projectContent #projRoles ul li{
padding:0.1em 1.4em;
}
/* = SecondaryContent
----------------------------------------*/
#secondaryContent {
position:relative;
width:100%;
height:350px;
color:#808080;
background:url(../images/bottomBackground.jpg);
}

#secondaryContent #awards{
margin-left:5px;
}

#contact{
margin-top:-10px;
}
#contact a{color:#FFFFFF;}

#approach, #downloads, #contact, #awards{
width:45%;
color:#808080;
padding:1.2em ;
}

#secondaryContent #contact, #downloads{
float:right;
}

#secondaryContent h3{
font-weight:100;
font-size:1.1em;
color:#ccc;
}

#secondaryContent h2{
font-weight:900;
font-size:1.6em;
color:#ffffff;
padding:0 0 0.6em 0;
border-bottom:1px #414141 solid;
background: none;

}

#secondaryContent ul li{
padding:1.4em 0;
background:url(../images/list.dot.gif) bottom left repeat-x;
}
#secondaryContent #contact fieldset{
border : none;
background:transparent;
}
#secondaryContent dd{
padding-bottom:1em;
}
#secondaryContent dt{
padding-bottom:0.5em;
}
#secondaryContent #contact input,#secondaryContent #contact textarea{
width:90%;
color:#808080;
border:1px solid #ccc;
background:transparent;
}
ul li .last {
background:none;
}
/* = preloader
-----------------------------------------------------------------------------*/
#preloader{
position:absolute;
top:50%;
left:50%;
width:320px;
height:100px;
margin: -50px -160px ;
background:url(../images/loader.png) 22% 15% no-repeat;
text-align:left;
}

#bar{
	position:absolute;
	top:70px;
	left:42px;
}