/* 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;
}
a.mail:link {color:#8C8C8C; }
a:focus, a:hover, a:active { outline:none } 

#imageContainer {
	height:515px;
	float:right;
	width:550px;
}

#imageContainer img {
	display:none;
	position:absolute;
}

/****************************************************************/
/* WRAPPER			                                            */
/****************************************************************/

#wrapper{
width:864px;
padding:10 0 10 10;
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:right;
width:197px;
margin-left:48px;
min-height:auto;
}
@font-face {font-family: "MyFont"; src: url(http://www.unit10productions.com/AVANTGA0.eot)}
.newfonttest{
float:right;
width:305px;
font-size:16px;
font-family: "MyFont"}


.right_content1{
font-family:"Trebuchet MS", Trebuchet, Verdana;
float:right;
width:305px;
}

.newfonttest{
font-family:"Trebuchet MS", Trebuchet, Verdana;
float:right;
width:305px;
}

.right_content2{
font-family:"Trebuchet MS", Trebuchet, Verdana;
float:right;
width:305px;
}
.rightbox{
height:117px;
width:100%;
}
.rightbox1{
height:37px;
width:100%;
}
.rightbox2{
height:135px;
width:100%;
}

#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;
}

/****************************************************************/
/* LEFT CONTENT                                                        */
/****************************************************************/

#box{
height:480px;
width:auto;
}

#homespace{
height:93px;
width:481px;
}
#homespace1{
height:103px;
width:481px;
}

#homepage{
font-family:"Trebuchet MS", Trebuchet, Verdana;
width:481px;
height:476px;
float:left;
}
#viralpage{
font-family:"Trebuchet MS", Trebuchet, Verdana;
width:550px;
height:476px;
float:left;
}
#livepage1{
font-family:"Trebuchet MS", Trebuchet, Verdana;
width:550px;
height:476px;
float:right;
}
.viralpara{
width:452px;
height:159px;
}
.viralpara1{
width:395px;
height:159px;
}
.clientspara{
width:460px;
height:124px;
}
#homepage1{
font-family:"Trebuchet MS", Trebuchet, Verdana;
width:490px;
height:476px;
float:left;
}
.homefirstpara{
color:#666666;
font-size:1.2em;
line-height:22px;
font-weight:lighter;
word-spacing:0.02em;
margin: 0 0.02em 0 0em;
}
.homesecondpara{
color:#3f3f3f;
font-size:0.84em;
line-height:18px;
font-weight:bold;
margin: 0 0.02em 0 0em;
}


.one{
font-family: "MyFont", Trebuchet, Verdana;
color:#666666;
font-size:1.0em;
line-height:22px;
font-weight:normal;
word-spacing:0.02em;
margin: 0 0.02em 0 0em;
}
.two{
font-family: "MyFont", Trebuchet, Verdana;
color:#3f3f3f;
font-size:0.84em;
line-height:18px;
font-weight:normal;
margin: 0 0.02em 0 0em;
}



.navspacer{
font-family:"Trebuchet MS", Trebuchet, Verdana;
height:105px;
width:100%;
border-top:1px dashed #3D383B;
padding-top:10px;
}
.navspacer1{
font-family:"Trebuchet MS", Trebuchet, Verdana;
height:98px;
width:100%;
}
.navspacer3{
font-family:"Trebuchet MS", Trebuchet, Verdana;
height:105px;
width:100%;
z-index:100;
border-top:1px dashed #3D383B;
padding-top:10px;
}
.caption{
color:#8C8C8C;
font-size:0.57em;
line-height:15px;
font-weight:bold;
margin: 0 0.1em 0 0em;
}
.viraltext1{
font-family: "MyFont", Trebuchet, Verdana;
color:#8C8C8C;
font-size:0.62em;
line-height:15px;
font-weight:normal;
margin: 0 0.1em 0 0em;
}
.viraltext2{
font-family: "MyFont", Trebuchet, Verdana;
color:#666666;
font-size:0.62em;
padding-top:10px;
line-height:15px;
font-weight:normal;
margin: 0 0.1em 0 0em;
}
.viraltext3{
font-family: "MyFont", Trebuchet, Verdana;
color:#8C8C8C;
font-size:0.70em;
line-height:15px;
font-weight:normal;
margin: 0 0.1em 0 0em;
}
.viraltext4{
font-family: "MyFont", Trebuchet, Verdana;
color:#666666;
font-size:0.70em;
line-height:15px;
font-weight:normal;
margin: 0 0.1em 0 0em;
}
.address{
font-family: "MyFont", Trebuchet, Verdana;
color:#666666;
font-size:0.70em;
line-height:15px;
font-weight:normal;
margin: 0 0.1em 0 0em;
}
.clientsleft{
font-family: "MyFont", Trebuchet, Verdana;
padding-top:85px;
color:#666666;
font-size:0.75em;
line-height:15px;
font-weight:normal;
width:200px;
float:left;
height:auto;
}

.clientsright{
font-family: "MyFont", Trebuchet, Verdana;
padding-top:85px;
color:#666666;
font-size:0.75em;
line-height:15px;
font-weight:normal;
width:260px;
float:right;
height:auto;
}

/****************************************************************/
/* SHOWREEL	                                                        */
/****************************************************************/




#showreel{
padding-top:93px;
padding-bottom:119px;
margin-left:3px;
}

/****************************************************************/
/* MENU	                                                        */
/****************************************************************/

#menu{
width:864px;
margin-left:8px;
}

#menu ul{
margin:0px;
padding:0px;
list-style-type:none;
}

#menu li{
float:left;
margin-right:0px;
}


 

.aboutnew a{
text-indent: -1000em;
background-image:url(../dev/images/buttonsoff/grey_01.gif);
background-repeat:no-repeat;
width: 106px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.aboutnew a:hover{
text-indent: -1000em;
background-image:url(../dev/images/buttonson/green_01.gif);
background-repeat:no-repeat;
width: 106px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.aboutnew a{
background-image:url(../dev/images/buttonsoff/grey_01.gif);
background-repeat:no-repeat;
}

.show a{
text-indent: -1000em;
background-image:url(../dev/images/buttonsoff/grey_02.gif);
background-repeat:no-repeat;
width: 147px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.show a:hover{
text-indent: -1000em;
background-image:url(../dev/images/buttonson/green_02.gif);
background-repeat:no-repeat;
width: 147px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.show a{
background-image:url(../dev/images/buttonsoff/grey_02.gif);
background-repeat:no-repeat;
}

.viral a{
text-indent: -1000em;
background-image:url(../dev/images/buttonsoff/grey_03.gif);
background-repeat:no-repeat;
width: 125px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.viral a:hover{
text-indent: -1000em;
background-image:url(../dev/images/buttonson/green_03.gif);
background-repeat:no-repeat;
width: 125px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.viral a{
background-image:url(../dev/images/buttonsoff/grey_03.gif);
background-repeat:no-repeat;
}

.promo a{
text-indent: -1000em;
background-image:url(../dev/images/buttonsoff/grey_04.gif);
background-repeat:no-repeat;
width: 131px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.promo a:hover{
text-indent: -1000em;
background-image:url(../dev/images/buttonson/green_04.gif);
background-repeat:no-repeat;
width: 131px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.promo a{
background-image:url(../dev/images/buttonsoff/grey_04.gif);
background-repeat:no-repeat;
}

.live a{
text-indent: -1000em;
background-image:url(../dev/images/buttonsoff/grey_05.gif);
background-repeat:no-repeat;
width: 124px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.live a:hover{
text-indent: -1000em;
background-image:url(../dev/images/buttonson/green_05.gif);
background-repeat:no-repeat;
width: 124px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.live a{
background-image:url(../dev/images/buttonsoff/grey_05.gif);
background-repeat:no-repeat;
}

.clients a{
text-indent: -1000em;
background-image:url(../dev/images/buttonsoff/grey_06.gif);
background-repeat:no-repeat;
width: 129px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.clients a:hover{
text-indent: -1000em;
background-image:url(../dev/images/buttonson/green_06.gif);
background-repeat:no-repeat;
width: 129px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.clients a{
background-image:url(../dev/images/buttonsoff/grey_06.gif);
background-repeat:no-repeat;
}

.contact a{
text-indent: -1000em;
background-image:url(../dev/images/buttonsoff/grey_07.gif);
background-repeat:no-repeat;
width: 83px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.contact a:hover{
text-indent: -1000em;
background-image:url(../dev/images/buttonson/green_07.gif);
background-repeat:no-repeat;
width: 83px;
height: 20px;
display: block;
overflow: hidden; /* For nested divs in Safari */
}

.contact a{
background-image:url(../dev/images/buttonsoff/grey_07.gif);
background-repeat:no-repeat;
}


/****************************************************************/
/* INTRO WRAPPER                                                */
/****************************************************************/


#intro_wrapper{
width:864px;
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 */
}