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

* {margin: 0; padding: 0;}

img {border: 0;}
	
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 0.75em;
	background: black;
	text-align: center;
}

#wrapper {
	position: relative;
	text-align: left;
	width: 750px;
	margin-right: auto;
	margin-left: auto;
}

#header {
	width: 100%;
	height: 180px;
	margin-bottom: 100px;
}


h1 {
	background: url(../images/text/benedict-campbell.gif) no-repeat bottom;
	height: 20px;
	width: 340px;
	text-indent: -9999px;
	margin: 85px 0 0 0px;
	float: left;
	

}

#enter a {
	background: url(../images/enter-button.jpg) no-repeat;
	background-position: 0 0;
	height: 160px;
	width: 160px;
	float: right;
	text-indent: -9999px;
	margin: 25px 0px 0 0;
}
#enter a:hover {background-position: 0 -160px;}
#enter a:active {background-position: 0 -320px;}


#home a {
	background: url(../images/home-button.jpg) no-repeat;
	background-position: 0 0;
	height: 160px;
	width: 160px;
	float: right;
	text-indent: -9999px;
	margin: 25px 0px 0 0;
}
#home a:hover {background-position: 0 -160px;}
#home a:active {background-position: 0 -320px;
}


#button {
	background: url(../images/enter-button.jpg) no-repeat;
	background-position: 0 0;
	height: 160px;
	width: 160px;
	float: right;
	text-indent: -9999px;
	margin: 25px 0px 0 0;
}

p {
	font-size: 1.1em;
	color: #333;
	font-family: Futura, Arial, Helvetica, sans-serif;
	margin-bottom: 10px;
	text-align: justify;
}


#thumbs {
	float: left;
	margin-left: 20px;
}


#thumbs img{
	margin: 0 7px 7px 0;
}



/*------------------------------------------------------------------------------------
--------------Main Navigation Style---------------------------------------------------
------------------------------------------------------------------------------------*/
#nav {
	width: 120px;
	height: 150px;
	position: relative;
	/*background: url(../images/menu.png) no-repeat;*/
	list-style-type: none;
	float: left;
}

#nav li {float: left;}

#nav li a {
	position: absolute;
	top: 0;	
	height: 30px;
	background: url(../images/menu.png) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}
/*----------Original States---------------------------------------------------------*/
li#nav_pho a {top: 0; width: 120px; background-position: 0 0;}
li#nav_dig a {top: 30px; width: 120px; background-position: -120px 0;}
li#nav_fil a {top: 60px; width: 120px; background-position: -240px 0;}
li#nav_con a {top: 90px; width: 120px; background-position: -480px 0;}

/*----------Hover States------------------------------------------------------------*/
li#nav_pho a:hover, #body_pho li#nav_pho a:hover {background-position: 0 -30px;}
li#nav_dig a:hover, #body_dig li#nav_dig a:hover {top: 30px; width: 120px; background-position: -120px -30px;}
li#nav_fil a:hover, #body_fil li#nav_fil a:hover {top: 60px; width: 120px; background-position: -240px -30px;}
li#nav_con a:hover, #body_con li#nav_con a:hover {top: 90px; width: 120px; background-position: -480px -30px;}

/*----------Click States------------------------------------------------------------*/
li#nav_pho a:active, #body_pho li#nav_pho a:active {background-position: 0 -60px;}
li#nav_dig a:active, #body_dig li#nav_dig a:active {top: 30px; width: 120px; background-position: -120px -60px;}
li#nav_fil a:active, #body_fil li#nav_fil a:active {top: 60px; width: 120px; background-position: -240px -60px;}
li#nav_con a:active, #body_con li#nav_con a:active {top: 90px; width: 120px; background-position: -480px -60px;}

/*----------You Are Here States-----------------------------------------------------*/
#body_pho li#nav_pho a {background-position: 0 -90px;}
#body_dig li#nav_dig a {top: 30px; width: 120px; background-position: -120px -90px;}
#body_fil li#nav_fil a {top: 60px; width: 120px; background-position: -240px -90px;}
#body_con li#nav_con a, 
#body_con_bio li#nav_con a, 
#body_con_oxf li#nav_con a, 
#body_con_lon li#nav_con a,
#body_con_nyc li#nav_con a  {top: 90px; width: 120px; background-position: -480px -90px;}
/*------------------------------------------------------------------------------------
--------------End Main Navigation Style---------------------------------------------------
------------------------------------------------------------------------------------*/

#stuff_benedict1 {
	width: 165px;
	height: 38px;
	position: absolute;
	top: 446px;
	left: -45px;
}

#stuff_benedict1 a {
	background: url(../images/stuff_benedict1.jpg) no-repeat;
	background-position: 0 0;
	height: 38px;
	width: 165px;
	float: left;
	text-indent: -9999px;
	margin: 0;
}

#stuff_benedict1 a:hover {
	background-position: 0px -38px;
}


#reportage {
	width: 165px;
	height: 25px;
	position: absolute;
	top: 408px;
}

#reportage a {
	background: url(../images/reportage.jpg) no-repeat;
	background-position: 0 0;
	height: 25px;
	width: 165px;
	float: left;
	text-indent: -9999px;
	margin: 0;
}

#reportage a:hover {
	background-position: 0px -25px;
}


/*------------------------------------------------------------------------------------
--------------Photo Navigation Style--------------------------------------------------
------------------------------------------------------------------------------------*/

#photo-nav {
	position: absolute;
	width: 350px;
	height: 50px;
	position: relative;
	list-style-type: none;
	margin-left: 120px;
	display: block;
	float: left;
}

#photo-nav li {float: left;}

#photo-nav li a {
	position: absolute;
	top: 0;	
	height: 50px;
	background: url(../images/photo-menu.jpg) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}
/*----------Original States---------------------------------------------------------*/
li#photo-nav_peo a {left: 0; width: 50px; background-position: 0 0;}
li#photo-nav_fas a {left: 60px; width: 50px; background-position: -50px 0;}
li#photo-nav_sty a {left: 120px; width: 50px; background-position: -100px 0;}
li#photo-nav_sti a {left: 180px; width: 50px; background-position: -150px 0;}
li#photo-nav_aut a {left: 240px; width: 50px; background-position: -200px 0;}
li#photo-nav_per a {left: 300px; width: 50px; background-position: -250px 0;}

/*----------Hover States------------------------------------------------------------*/
li#photo-nav_peo a:hover {background-position: 0 -50px;}
li#photo-nav_fas a:hover {left: 60px; width: 50px; background-position: -50px -50px;}
li#photo-nav_sty a:hover {left: 120px; width: 50px; background-position: -100px -50px;}
li#photo-nav_sti a:hover {left: 180px; width: 50px; background-position: -150px -50px;}
li#photo-nav_aut a:hover {left: 240px; width: 50px; background-position: -200px -50px;}
li#photo-nav_per a:hover {left: 300px; width: 50px; background-position: -250px -50px;}


/*------------------------------------------------------------------------------------
--------------Navigation Styles-------------------------------------------------------
-------------------END--------------------------------------------------------------*/

/*------------------------------------------------------------------------------------
--------------Automotive Navigation Style--------------------------------------------------
------------------------------------------------------------------------------------*/

#auto-nav {
	position: absolute;
	width: 220px;
	height: 220px;
	position: relative;
	list-style-type: none;
	margin-left: 20px;
	display: block;
	float: left;
}

#auto-nav li {float: left;}

#auto-nav li a {
	position: absolute;
	top: 0;	
	height: 100px;
	background: url(../images/auto-menu.jpg) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}
/*----------Original States---------------------------------------------------------*/
li#auto-nav_2wh a {left: 0; width: 100px; background-position: 0 0;}
li#auto-nav_4wh a {left: 110px; width: 100px; background-position: -100px 0;}
/*----------Hover States------------------------------------------------------------*/
li#auto-nav_2wh a:hover {left: 0; width: 100px; background-position: 0 -100px;}
li#auto-nav_4wh a:hover {left: 110px; width: 100px; background-position: -100px -100px;}
/*------------------------------------------------------------------------------------
--------------Navigation Styles-------------------------------------------------------
-------------------END--------------------------------------------------------------*/



/*------------------------------------------------------------------------------------
--------------Digital Artist Navigation Style--------------------------------------------------
------------------------------------------------------------------------------------*/

#digart-nav {
	position: absolute;
	width: 420px;
	height: 50px;
	position: relative;
	list-style-type: none;
	margin-left: 120px;
	display: block;
	float: left;
}

#digart-nav li {float: left;}

#digart-nav li a {
	position: absolute;
	top: 0;	
	height: 50px;
	background: url(../images/digart-menu.jpg) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}
/*----------Original States---------------------------------------------------------*/
li#digart-nav_cyb a {left: 0; width: 50px; background-position: 0 0;}
li#digart-nav_3di a {left: 60px; width: 50px; background-position: -50px 0;}
li#digart-nav_efx a {left: 120px; width: 50px; background-position: -100px 0;}
li#digart-nav_pop a {left: 180px; width: 50px; background-position: -150px 0;}
li#digart-nav_3dr a {left: 240px; width: 50px; background-position: -200px 0;}
li#digart-nav_art a {left: 300px; width: 50px; background-position: -250px 0;}
li#digart-nav_pai a {left: 360px; width: 50px; background-position: -300px 0;}

/*----------Hover States------------------------------------------------------------*/
li#digart-nav_cyb a:hover {background-position: 0 -50px;}
li#digart-nav_3di a:hover {left: 60px; width: 50px; background-position: -50px -50px;}
li#digart-nav_efx a:hover {left: 120px; width: 50px; background-position: -100px -50px;}
li#digart-nav_pop a:hover {left: 180px; width: 50px; background-position: -150px -50px;}
li#digart-nav_3dr a:hover {left: 240px; width: 50px; background-position: -200px -50px;}
li#digart-nav_art a:hover {left: 300px; width: 50px; background-position: -250px -50px;}
li#digart-nav_pai a:hover {left: 360px; width: 50px; background-position: -300px -50px;}


/*------------------------------------------------------------------------------------
--------------Navigation Styles-------------------------------------------------------
-------------------END--------------------------------------------------------------*/



/*------------------------------------------------------------------------------------
--------------Film Maker Navigation Style--------------------------------------------------
------------------------------------------------------------------------------------*/

#filmmaker-nav {
	position: absolute;
	width: 410px;
	height: 310px;
	position: relative;
	list-style-type: none;
	margin-left: 120px;
	display: block;
	float: left;
}

#filmmaker-nav li {float: left;}

#filmmaker-nav li a {
	position: absolute;
	top: 0;	
	height: 150px;
	background: url(../images/filmmaker_nav.jpg) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}
/*----------Original States---------------------------------------------------------*/
li#filmmaker_wal a {left: 0; width: 200px; background-position: 0 0;}
li#filmmaker_caf a {left: 210px; width: 200px; background-position: -200px 0;}
li#filmmaker_sam a {top: 160px; left: 0px; width: 200px; background-position: -400px 0;}
li#filmmaker_run a {top: 160px; left: 210px; width: 200px; background-position: -600px 0;}

/*----------Hover States------------------------------------------------------------*/
li#filmmaker_wal a:hover {left: 0; width: 200px; background-position: 0 -150px;}
li#filmmaker_caf a:hover {left: 210px; width: 200px; background-position: -200px -150px;}
li#filmmaker_sam a:hover {top: 160px; left: 0px; width: 200px; background-position: -400px -150px;}
li#filmmaker_run a:hover {top: 160px; left: 210px; width: 200px; background-position: -600px -150px;}



/*------------------------------------------------------------------------------------
--------------Navigation Styles-------------------------------------------------------
-------------------END--------------------------------------------------------------*/

#film-archive {
	width: 110px;
	height: 20px;
	position: absolute;
	top: 625px;
	right: 75px;
}

#film-archive a {
	background: url(../images/archive-button.jpg) no-repeat;
	background-position: 0 0;
	height: 20px;
	width: 110px;
	float: left;
	text-indent: -9999px;
	margin: 0;
}

#film-archive a:hover {
	background-position: 0px -20px;
}

#vimeo {
	float: left;
	margin: 10px 0 0 70px;
}


/*------------------------------------------------------------------------------------
--------------Film Maker Archive Navigation Style--------------------------------------------------
------------------------------------------------------------------------------------*/

#film-nav {
	position: absolute;
	width: 330px;
	height: 220px;
	position: relative;
	list-style-type: none;
	margin-left: 120px;
	display: block;
	float: left;
}

#film-nav li {float: left;}

#film-nav li a {
	position: absolute;
	top: 0;	
	height: 100px;
	background: url(../images/film-menu.jpg) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}
/*----------Original States---------------------------------------------------------*/
li#film-nav_tr8 a {left: 0; width: 100px; background-position: 0 0;}
li#film-nav_str a {left: 110px; width: 100px; background-position: -100px 0;}
li#film-nav_roc a {left: 220px; width: 100px; background-position: -200px 0;}
li#film-nav_tig a {top: 110px; left: 0px; width: 100px; background-position: -300px 0;}
li#film-nav_kat a {top: 110px; left: 110px; width: 100px; background-position: -400px 0;}
li#film-nav_tr7 a {top: 110px; left: 220px; width: 100px; background-position: -500px 0;}

/*----------Hover States------------------------------------------------------------*/
li#film-nav_tr8 a:hover {left: 0; width: 100px; background-position: 0 -100px;}
li#film-nav_str a:hover {left: 110px; width: 100px; background-position: -100px -100px;}
li#film-nav_roc a:hover {left: 220px; width: 100px; background-position: -200px -100px;}
li#film-nav_tig a:hover {top: 110px; left: 0px; width: 100px; background-position: -300px -100px;}
li#film-nav_kat a:hover {top: 110px; left: 110px; width: 100px; background-position: -400px -100px;}
li#film-nav_tr7 a:hover {top: 110px; left: 220px; width: 100px; background-position: -500px -100px;}



/*------------------------------------------------------------------------------------
--------------Navigation Styles-------------------------------------------------------
-------------------END--------------------------------------------------------------*/


#movie {
	float: left;
	margin: -30px 0 0 140px;
}




/*------------------------------------------------------------------------------------
--------------Contact & Bio Navigation Style--------------------------------------------------
------------------------------------------------------------------------------------*/

#bio-nav {
	position: absolute;
	width: 50px;
	height: 240px;
	position: relative;
	list-style-type: none;
	margin: 0 0 0 50px;
	display: block;
	float: left;
}

#bio-nav li {float: left;}

#bio-nav li a {
	position: absolute;
	top: 0;	
	height: 50px;
	background: url(../images/bio-menu.jpg) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}
/*----------Original States---------------------------------------------------------*/
li#bio-nav_bio a {left: 0; width: 50px; background-position: 0 0;}
li#bio-nav_oxf a {top: 60px; left: 0px; width: 50px; background-position: -50px 00px;}
li#bio-nav_lon a {top: 120px; left: 0px; width: 50px; background-position: -100px 0;}
li#bio-nav_nyc a {top: 180px; left: 0px; width: 50px; background-position: -150px 0;}


/*----------Hover States------------------------------------------------------------*/
li#bio-nav_bio a:hover {background-position: 0 -50px;}
li#bio-nav_oxf a:hover, #body_con_oxf li#bio-nav_oxf a {left: 0px; width: 50px; background-position: -50px -50px;}
li#bio-nav_lon a:hover, #body_con_lon li#bio-nav_lon a {left: 0px; width: 50px; background-position: -100px -50px;}
li#bio-nav_nyc a:hover, #body_con_nyc li#bio-nav_nyc a {left: 0px; width: 50px; background-position: -150px -50px;}

/*----------You are Here States------------------------------------------------------------*/
 #body_con_bio li#bio-nav_bio a {background-position: 0 -100px;}
#body_con_oxf li#bio-nav_oxf a {left: 0px; width: 50px; background-position: -50px -100px;}
#body_con_lon li#bio-nav_lon a {left: 0px; width: 50px; background-position: -100px -100px;}
#body_con_nyc li#bio-nav_nyc a {left: 0px; width: 50px; background-position: -150px -100px;}
 

/*------------------------------------------------------------------------------------
--------------Navigation Styles-------------------------------------------------------
-------------------END--------------------------------------------------------------*/

/*------------------------------------------------------------------------------------
--------------Social Media-------------------------------------------------------
---------------------------------------------------------------------------------*/

#social {
	width: 16px;
	height: 76px;
	position: absolute;
	top: 280px;
	right: 5px;
	/*background: url(../images/menu.png) no-repeat;*/
	list-style-type: none;
	float: left;
}

#social li {float: left;}

#social li a {
	position: absolute;
	top: 0;	
	height: 16px;
	background: url(../images/social-media-icons.jpg) no-repeat;
	text-indent: -9999px;
	overflow: hidden;
	font-size: 1%;
	display: block;
}

	
/*----------Original States---------------------------------------------------------*/
li#tumblr a {left: 0; width: 16px; background-position: 0 0;}
li#twitter a {top: 20px; width: 16px; background-position: -20px 0;}
li#instagram a {top: 40px; width: 16px; background-position: -40px 0;}
li#vimeo-icon a {top: 60px; width: 16px; background-position: -60px 0;}

/*----------Hover States------------------------------------------------------------*/
li#tumblr a:hover {left: 0; width: 16px; background-position: 0 -16px;}
li#twitter a:hover {left: 0px; width: 16px; background-position: -20px -16px;}
li#instagram a:hover {left: 0px; width: 16px; background-position: -40px -16px;}
li#vimeo-icon a:hover {left: 0px; width: 16px; background-position: -60px -16px;}
/*------------------------------------------------------------------------------------
--------------Social Media-------------------------------------------------------
-------------------END--------------------------------------------------------------*/







#contact {
	float: left;
	width: 400px;
	margin: 0 0 0 50px;
}


#email a {
	background: url(../images/email-button.jpg) no-repeat;
	background-position: 0 0;
	height: 20px;
	width: 20px;
	float: left;
	text-indent: -9999px;
	margin: 0px 0px 0 0;
}

#email a:hover {background-position: 0px -20px;}




#stuff {
	float: right;
	width: 400px;
	margin: 70px 0px 0 0;
}


#stuff a {
	background: url(../images/stuff-button.jpg) no-repeat;
	background-position: 0 0;
	height: 90px;
	width: 400px;
	float: left;
	text-indent: -9999px;
	margin: 0;
}

#stuff a:hover {background-position: 0px -90px;}

#stuff_small {
	float: right;
	width: 250px;
	margin: 0px 70px 0 0;
}


#stuff_small a {
	background: url(../images/stuff-button-small.jpg) no-repeat;
	background-position: 0 0;
	height: 56px;
	width: 250px;
	float: left;
	text-indent: -9999px;
	margin: 0;
}

#stuff_small a:hover {background-position: 0px -56px;}