/* CSS Document */

/****************************************************************/
/* 1. UNIT !) PRODUCTIONS CSS 20/07/08                        	*/
/* 1. By Tom @ Webpraxis Ltd 			 	                    */
/* tom@webpraxis.co.uk - www.webpraxis.co.uk			        */
/****************************************************************/


/****************************************************************/
/* GENERIC STYLING			                                    */
/****************************************************************/

body{
margin-top:10px;
padding:0px;
background-color:#231f20;
height:100%;
}

img{
vertical-align:top;
border:0px;
}


/****************************************************************/
/* WRAPPER			                                            */
/****************************************************************/

#wrapper{
width:726px;
padding:10px;
margin:0px auto;
}


/****************************************************************/
/* STATIC CONTENT			                                    */
/****************************************************************/

.static_content_img_float_left{
float:left;
}


/****************************************************************/
/* MAIN IMAGE		                                        */
/****************************************************************/


#main_image{
width:481px;
height:476px;
float:left;
padding-bottom:97px;
margin-top:16px;
}

.fade {
position: absolute;
}

.fade div {
position: absolute;
top: 0;
left: 0;
display: none;
height: 476px;
width: 481px;
}

/****************************************************************/
/* RIGHT CONTENT		                                        */
/****************************************************************/

.unit-10-logo{
margin-bottom:37px;
margin-top:0px;
}

#right_content{
float:left;
width:197px;
margin-left:48px;
border-bottom:1px dotted #3D383B;
min-height:490px;
}

#right_content h1{
color:#3D383B;
margin-top:0px;
margin-bottom:10px;
margin-right:0px;
margin-left:0px;
font-size:0.75em;
font-family:"Trebuchet MS", Trebuchet, Verdana;
text-transform:uppercase;
font-weight:bold;
}

#right_content h2{
color:#3D383B;
margin-top:10px;
margin-bottom:10px;
margin-right:0px;
margin-left:0px;
font-size:0.75em;
font-family:"Trebuchet MS", Trebuchet, Verdana;
font-weight:bold;
}

#right_content h3{
color:#3D383B;
margin-top:0px;
margin-bottom:10px;
margin-right:0px;
margin-left:0px;
font-size:0.75em;
font-family:"Trebuchet MS", Trebuchet, Verdana;
text-transform:uppercase;
}

#right_content ul{
font-size:0.65em;
font-family:"Trebuchet MS", Trebuchet, Verdana;
margin-top:10px;
margin-bottom:10px;
margin-left:0px;
color:#3D383B;
line-height:1.2em;
padding:0px;
list-style-type:none;
}

#right_content ul li{
background-image:url(../images/ul-line.gif);
background-repeat:no-repeat;
padding-left:10px;
background-position:0px 5px;
}

#right_content ol{
font-size:0.65em;
font-family:"Trebuchet MS", Trebuchet, Verdana;
margin-top:10px;
margin-bottom:10px;
margin-left:25px;
color:#3D383B;
line-height:1.2em;
padding:0px;
}


#right_content p{
color:#3D383B;
margin-top:10px;
margin-bottom:10px;
margin-right:0px;
margin-left:0px;
font-size:0.65em;
font-family:"Trebuchet MS", Trebuchet, Verdana;
line-height:1.2em;
}

.unit10{
color:#585254;
text-transform:uppercase;
font-weight:bold;
}

#right_content a{
color:#625a5c;
}

#right_content a:link{
color:#625a5c;
}

#right_content a:hover{
color:#625a5c;
text-decoration:none;
}


/****************************************************************/
/* SHOWREEL	                                                        */
/****************************************************************/




#showreel{
padding-bottom:119px;
margin-left:3px;
}

/****************************************************************/
/* MENU	                                                        */
/****************************************************************/

#menu{
width:726px;
}

#menu ul{
margin:0px;
padding:0px;
list-style-type:none;
}

#menu li{
float:left;
margin-right:0px;
}

.about a{
text-indent: -1000em;
background-image:url(../images/about.gif);
background-repeat:no-repeat;
width: 108px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.about a:hover{
text-indent: -1000em;
background-image:url(../images/about-menu-hover.gif);
background-repeat:no-repeat;
width: 108px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.about a{
background-image:url(../images/about.gif);
background-repeat:no-repeat;
}

.video a{
text-indent: -1000em;
background-image:url(../images/video.gif);
background-repeat:no-repeat;
width: 140px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.video a:hover{
text-indent: -1000em;
background-image:url(../images/video-menu-hover.gif);
background-repeat:no-repeat;
width: 140px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.video{
background-image:url(../images/video.gif);
background-repeat:no-repeat;
}

.live a{
text-indent: -1000em;
background-image:url(../images/live.gif);
background-repeat:no-repeat;
width: 133px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.live a:hover{
text-indent: -1000em;
background-image:url(../images/live-menu-hover.gif);
background-repeat:no-repeat;
width: 133px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.live {
background-image:url(../images/live.gif);
background-repeat:no-repeat;
}

.photography a{
text-indent: -1000em;
background-image:url(../images/photography.gif);
background-repeat:no-repeat;
width: 218px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.photography a:hover{
text-indent: -1000em;
background-image:url(../images/photography-menu-hover.gif);
background-repeat:no-repeat;
width: 218px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.photography {
background-image:url(../images/photography.gif);
background-repeat:no-repeat;
}

.contact a{
text-indent: -1000em;
background-image:url(../images/contact.gif);
background-repeat:no-repeat;
width: 120px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.contact a:hover{
text-indent: -1000em;
background-image:url(../images/contact-menu-hover.gif);
background-repeat:no-repeat;
width: 120px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.contact {
background-image:url(../images/contact.gif);
background-repeat:no-repeat;
}

/****************************************************************/
/* INTRO WRAPPER                                                */
/****************************************************************/


#intro_wrapper{
width:726px;
padding:10px;
margin:0px auto;
}

#intro_wrapper_inner{
margin-top:36px;
}

.showreel a{
text-indent: -1000em;
background-image:url(../images/showreel.gif);
background-repeat:no-repeat;
width: 726px;
height: 115px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.showreel a:hover{
text-indent: -1000em;
background-image:url(../images/showreel-hover.gif);
width: 726px;
height: 115px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.showreel{
text-indent: -1000em;
background-image:url(../images/showreel.gif);
background-repeat:no-repeat;
width: 726px;
height: 115px;
display: block;
overflow: hidden; /* For nested divs in Safari */
margin-top:200px;
}

.enter a{
text-indent: -1000em;
background-image:url(../images/enter.gif);
background-repeat:no-repeat;
width: 53px;
height: 19px;
display: block;
overflow: hidden; /* For nested divs in Safari */
margin-left:350px;
}

.enter a:hover{
text-indent: -1000em;
background-image:url(../images/enter-hover.gif);
width: 53px;
height: 19px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

/****************************************************************/
/* INTRO			                                    */
/****************************************************************/



.unit10_intro a{
text-indent: -1000em;
background-image:url(../images/intro-1.gif);
background-repeat:no-repeat;
width: 508px;
height: 460px;
display: block;
overflow: hidden; /* For nested divs in Safari */
margin-left:228px;
}

.unit10_intro a:hover{
text-indent: -1000em;
background-image:url(../images/intro-3.gif);
background-repeat:no-repeat;
width: 508px;
height: 460px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

