body{
margin:0;
padding:0;

font-family: 'Open Sans Condensed', Helvetica, arial, "sans-serif";
}

#page{
z-index: 2;
position: relative;
height:100%;
width:100%;
padding:0;
margin:0;

}


#greyFade{
width:100%;
height:100%;
position:absolute;
z-index:0;
background-color:black;
opacity:.6;

}



#bgContainer{
height:100%;
width:100%;
margin:0;
padding:0;
position:absolute;
z-index:-9999;

}

#titleBar{
width:100%;
height:130px;
background-image:url("../images/opacity.png");


}


#centeredNav{
margin: 0;
width:150px;

float:right;
width:150px;
margin-right:40px;
}


#leftNavContainer{
float:left;
margin-top:6px;
width:150px;
font-size:18px;
text-align:right;

}
#ourWorkContainer{
float:left;
margin-top:6px;
width:150px;
font-size:18px;
text-align:right;

}
#ourResultsContainer{
float:left;
margin-top:6px;
width:150px;
font-size:18px;
text-align:right;

}
#logoContainer{
width:200px;
height:74px;
margin:0 auto;
float:left;
margin-top:20px;
margin-left:30px;

}

#rightNavContainer{
float:left;
margin-top:6px;
width:150px;
font-size:18px;

text-align:right;
}



.nav{
cursor:pointer;
}

#slides{
background-image:url('../images/slides.png');
background-repeat:no-repeat;
height:20px;
width:20px;
background-color:rgb(100, 100, 100);
opacity: 0.8;
float:right;

margin:5px 30px 0 0  ;

-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

#hidenav{
background-image:url('../images/uparrow.png');
background-repeat:no-repeat;

height:20px;
width:20px;
background-color:rgb(100, 100, 100);
opacity: 0.8;
float:right;
margin:5px 10px 0 0 ;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

#about{
width:600px;
background-color: #eee;
margin: 50px auto 0 auto;
padding:20px;
position:absolute;
left: 50%; 
margin-left: -25%;
-webkit-box-shadow: 1px 1px 50px 0px #000000;
-moz-box-shadow: 1px 1px 50px 0px #000000;
box-shadow: 1px 1px 50px 0px #000000;


}

#portrait{
margin: 0 20px 20px 0;
float:left;
-webkit-box-shadow: 1px 1px 8px 0px #000000;
-moz-box-shadow: 1px 1px 8px 0px #000000;
box-shadow: 1px 1px 8px 0px #000000;
opacity:1;
}

#contact{
width:600px;
background-color: #eee;
margin: 50px auto 0 auto;
padding:20px;
position:absolute;
left: 50%; 
margin-left: -25%;
-webkit-box-shadow: 1px 1px 50px 0px #000000;
-moz-box-shadow: 1px 1px 50px 0px #000000;
box-shadow: 1px 1px 50px 0px #000000;
}

#ourWork{
width:600px;
background-color: #eee;
margin: 50px auto 0 auto;
padding:20px;
position:absolute;
left: 50%; 
margin-left: -25%;
height:440px;
-webkit-box-shadow: 1px 1px 50px 0px #000000;
-moz-box-shadow: 1px 1px 50px 0px #000000;
box-shadow: 1px 1px 50px 0px #000000;


}

#ourResults{
width:600px;
background-color: #eee;
margin: 50px auto 0 auto;
padding:20px;
position:absolute;
left: 50%; 
margin-left: -25%;
height:440px;
-webkit-box-shadow: 1px 1px 50px 0px #000000;
-moz-box-shadow: 1px 1px 50px 0px #000000;
box-shadow: 1px 1px 50px 0px #000000;

}

#family{
margin: 0 0 20px 20px;
float:right;
-webkit-box-shadow: 1px 1px 8px 0px #000000;
-moz-box-shadow: 1px 1px 8px 0px #000000;
box-shadow: 1px 1px 8px 0px #000000;
opacity:1;
}

#jacket{
margin: 0 20px 20px 0;
float:left;
-webkit-box-shadow: 1px 1px 8px 0px #000000;
-moz-box-shadow: 1px 1px 8px 0px #000000;
box-shadow: 1px 1px 8px 0px #000000;
opacity:1;
}

.closeButton{
background-image:url('../images/close.png');
background-repeat:no-repeat;
height:20px;
width:20px;
background-color:rgb(100, 100, 100);

float:right;
margin:-30px -30px 0 0;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
}

.writeup{

}

.slider{
width:600px;
height:440px;
margin:0 auto;
-webkit-box-shadow: 1px 1px 10px 0px #000000;
-moz-box-shadow: 1px 1px 10px 0px #000000;
box-shadow: 1px 1px 10px 0px #000000;
}