* {
	margin: 0px;
	padding: 0px;
	font-size: 100%;
	font-family: Georgia, "Times New Roman", Times, serif;
	word-spacing: 0.1em;
	border: none;
}

body{ margin: 0; padding: 0; }

.body {
  text-align: center;
}

body {
  margin: 0; padding: 0; background-color: #1E2836; background-image:url(../ui/background.jpg); background-repeat: repeat-x;
}

A:link {  color: #DFD3BD; text-decoration: none; font-weight:normal;}
A:visited {  color: #DFD3BD; text-decoration: none; font-weight:normal;}
A:hover {  color: #DFD3BD; text-decoration: underline; font-weight:normal;}
A:active {  color: #DFD3BD; text-decoration: none; font-weight:normal;}


#masthead_pr {display: none;}

#container {
	margin: 0px; padding: 0px;
	height: 223px; width: 100%;
}

#main {
	z-index: 2;
	width: 960px;
	margin: 0 auto 0 auto; padding: 0 12px 0 12px;
}


#masthead {position: absolute; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; width: 960px;}
#logo {position: absolute; padding: 0px 0px 0px 0px; margin: 20px 0px 0px 0px;}
#tel {position: absolute; right: 0px; padding: 0px 0px 0px 0px; margin: 25px 0px 0px 0px;}



#menu {
	position: absolute;
	top: 160px;  width: 960px; height: 48px; background-image: url(../ui/menu_bg.png);
	padding-top: 0px;
	z-index: 5;
	text-align: center;
	font-size: 0.75em;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	
}


#menu ul {margin: 20px 0px 0px 10px; padding: 0;} 
#menu li {list-style:none; padding: 0px 32px 0px 32px; margin: 0px; float:left; position:relative; }

#menu a {}
#menu A:link {  color: #a1a4a8; text-decoration: none; font-weight:normal;}
#menu A:visited {  color: #a1a4a8; text-decoration: none; font-weight:normal;}
#menu A:hover {  color: #e8d8b7; text-decoration: underline; font-weight:normal;}
#menu A:active {  color: #a1a4a8; text-decoration: none; font-weight:normal;}

#menu ul li ol {
	display:none; 
	position: absolute;
	left: 0px;;
	padding:0px; 
	padding-top: 10px; 
	padding-bottom: 10px; 
	margin: 0px 0px 0px 0px; 
	list-style:none;
	background-color: #020203;
	
	-moz-border-radius-bottomleft: 15px; webkit-border-bottom-left-radius: 15px;  
	-moz-border-radius-bottomright: 15px; webkit-border-bottom-right-radius: 15px;
	line-height: 2.5em;
	text-align: left;

}

#menu ul li:hover ol { display:block;}
#menu ul li.over ol { display:block;} 

#mainmenu ul li ol li {
	text-align: left;
	height: 20px;
	margin: 6px 0px 6px 0px;
	padding: 0px 0px 0px 0px;
	white-space: nowrap;
} 




#showreel {
	position: absolute;
	top: 208px;
	width: 100%;
	height: 370px;
	z-index: 4;
	background-color: #0A0B0E;
	background-image:url(../ui/showreel_bg.jpg); background-repeat: repeat-x
}

#multipanel {
	margin: 0 0 0 11px;
	padding: 0px;
	width: 287px; height: 360px;
	z-index: 6;
	background-image: url(../ui/multipanel_bg1.jpg); background-repeat: repeat-x;
	color: #a4a8af;	
	line-height: 1.2em;
}

#videowrapper {
	position: absolute;
	top: 0px; left: 310px;
	margin: 0px;
	padding: 0px;
	width: 640px;
	height: 360px;
	z-index: 5;
	background-image: url(../ui/video_placeholder.jpg); background-repeat: no-repeat;
}


#multipanel h1 {
	padding: 20px 24px 12px 24px; color: #dfd3bd; font-weight: normal; font-size: 0.9em;
}

#multipanel p {
	padding: 6px 24px 12px 24px;  font-size: 0.75em; line-height: 1.7em;
}

#multipanel ul {
	padding: 8px 8px 8px 8px;
}

#multipanel li {
	margin: 0 0 6px 0;
}


#recentprojects {
	width: 940px;
	height: 270px;
	background-image: url(../ui/portfolio_bg.jpg); background-repeat: repeat-x;
	margin: 12px 0 0 10px;
	padding: 0px;
}

#recentprojects A:link {  color: #a1a4a8; text-decoration: none;}
#recentprojects A:visited {  color: #a1a4a8; text-decoration: none;}
#recentprojects A:hover {  color: #e8d8b7; text-decoration: underline;}
#recentprojects A:active {  color: #a1a4a8; text-decoration: none; }


#recentprojects h2 {
	color: #dfd3bd; font-weight: normal; font-size: 1.1em; margin: 14px 10px 6px 12px; width: 500px;
}

#recentprojects .link {
	position: absolute; top: 380px; right: 20px; margin: 0 0 0 0; font-size: 0.8em; width: 300px; color: #A4A8AF; text-align: right;
}

.hr {border-bottom: 1px solid #2F3541; width: 910px; margin: 20px 0 10px 25px; clear: both;}

#portfolio {
	position: absolute;
	top: 208px;
	width: 960px;
	background-color: #121923;
	color: #4C5966;
	background-image: url(../ui/content_bg.jpg); background-repeat: repeat-x;
	border-top: 1px solid #2F3541;
}

#portfolio h1 {
	color: #dfd3bd; font-weight: normal; font-size: 1.1em; margin: 20px 10px 6px 30px;
}

#portfolio #projecttitle {
	margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;
	background-color: #4c5966;
}
#portfolio #projecttitle h1 {
	color: #D3D5D5; font-weight: normal; font-size: 1.1em;  padding: 6px 0px 4px 0px;

}


#portfolio h2 {
	color: #dfd3bd; font-weight: normal; font-size: 1.0em; margin: 20px 10px 6px 30px;
}
#portfolio #projectclient {
	margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;
	background-color: #4c5966;
}
#portfolio #projectclient h2 {
	color: #D3D5D5; font-weight: normal; font-size: 0.9em;  padding: 4px 0px 6px 0px;
}



#portfolio h3 {
	color: #A1A4A8; font-weight: normal; font-size: 1em; margin: 0px 0px 0px 30px;
}

#portfolio p {
	color: #A1A4A8; font-weight: normal; font-size: 0.8em; margin: 20px 20px 6px 30px; line-height: 1.5em;
}

#portfolio td ul {
	margin: 20px 20px 6px 30px;
}

#portfolio td p {
	padding: 2px 15px 2px 15px;
}

#portfolio ul {
	margin: 0px 20px 6px 40px;
}

#portfolio li {
	color: #A1A4A8; font-weight: normal; margin: 0px 20px 6px 30px; font-size: 0.8em; 
	list-style-image: url(../ui/bullet_1.png); 
}

#portfolio table {
	margin: 20px 30px 6px 30px;
}

#portfolio td img {
	margin: 12px 0px 0px 0px;
}

#portfolio td li {
	list-style-image: url(../ui/bullet_2.png); 
}

#portfolio td .cellbg {
	background-color: #1E2836; padding: 10px; min-height: 560px;
	width: 260px; text-align: left;
	-moz-border-radius: 15px;  
	-moz-border-radius: 15px;
	font-size: 0.9em;
}

#portfolio td .cellbg h2 {
	padding: 0px; margin: 0px; font-size: 1.2em;
}

#portfolio td .cellbg ul {
	padding: 0px; margin: 0px;
}

#portfolio td .cellbg img {
	padding: 0px; margin: 10px 0 20px 0;
}




.portfoliofooter {text-align: center; margin-top: 10px;}

#info {}
.infoarea {text-align:right;}
.projectmasthead {position: absolute; right:10px; top:250px; text-align: right; width: 500px;}
.projectplain {position: absolute; right:10px; top:4px; text-align: right; width: 500px;}

.quote {width: 272px; float: right; background-color: #1E2836; -moz-border-radius: 10px; color: #ECEDF1; padding: 0px 0px 10px 0px; margin: 10px 30px 10px 20px; font-size: 0.8em;}
.quote .italic {font-style: italic; line-height: 28px; font-size: 1.7em;}
.quote .quot {font-size: 3em; font-weight: bold; color: #DED3BD;}

#portfolio .quote ul {padding: 0px; margin: 20px 0px 6px 20px; text-align: left;}
#portfolio .quote li {padding: 0px; margin: 6px 0px 6px 10px; text-align: left; font-size: 1em;}
#portfolio .quote h2 {font-size: 1.3em; padding: 0px; margin: 10px 0px 10px 10px; text-align: left;}


#pagenav {
	font-size: 0.8em; text-align: right; margin: 20px 25px 0 0;
}

#pagenav A:link {  color: #A1A4A8; text-decoration: none;}
#pagenav A:visited {  color: #A1A4A8; text-decoration: none;}
#pagenav A:hover {  color: #e8d8b7; text-decoration: underline;}
#pagenav A:active {  color: #A1A4A8; text-decoration: none;}



#thumbnails {
	width: 100%;
	padding: 0px 0px 0px 0px;
	margin: 12px 0px 8px 8px;
	color: #5F7385;
	clear: both;
}


#thumbnails td {width: 231px; height: 229px; padding: 0px 0px 0px 0px; margin: 0px; background-repeat: no-repeat; background-position:center; text-align: center; }

#thumbnails td img {padding: 16px 0 8px; margin: 0;}

#thumbnails p {padding: 0px 10px 2px 10px; margin: 0px 0px 0px 0px; line-height: 14px; color: #d5d4d5; font-size: 0.7em;}

#thumbnails a {  font-weight: bold;}
#thumbnails A:link {  color: #dfd3bd; text-decoration: none;}
#thumbnails A:visited {  color: #dfd3bd; text-decoration: none;}
#thumbnails A:hover {  color: #dfd3bd; text-decoration: underline;}
#thumbnails A:active {  color: #dfd3bd; text-decoration: none;}



#maincontent {
	position: absolute;
	top: 654px;
	width: 940px;
	z-index: 4;
	
	margin: 0px 0 0 10px; padding: 0 0 0 0;
	/*background-image: url(../ui/content_bg.gif); background-repeat: repeat-y;*/
	background: #121923;
}


#content {
	margin: 20px 0px 0px 0px;
	padding: 0px 0px 20px 300px;
	width: 620px;
	font-size: 0.75em;
	line-height: 1.5em;
}

#content {color: #A1A4A8;}

#content A:link {color: #DFD3BD; text-decoration: none;}
#content A:visited {color: #DFD3BD; text-decoration: none;}
#content A:hover {color: #DFD3BD; text-decoration: underline;}
#content A:active {color: #DFD3BD; text-decoration: none;}

#content  h2 {font-size: 1.4em; font-weight:normal; padding: 4px 0px 6px 0px; margin: 0px 0px 0px 0px; color: #DFD3BD; letter-spacing: 0.05em;}

#content p {padding: 0px 0px 0px 0px; margin: 10px 0px 20px 0px; line-height: 1.8em;}

#content ul {margin: 10px 0px 20px 0px; padding: 0px 0px 0px 0px;}
#content li {list-style-image: url(../graphics/bullet.gif); margin: 4px 0px 4px 20px; padding: 0px 0px 0px 4px;}

#subcontent {
	width: 210px; background-color: #121923; float: right; margin: -8px 0px 10px 14px; padding: 10px;
	-moz-border-radius: 15px;
	-moz-border-radius: 15px;
	 color: #A1A4A8;
	 font-size: 0.9em;
	 background-color: #1E2836;
}

#subcontent h3 {
	 color: #E4D4BD; margin: 2px 6px 10px 6px; font-size: 1.3em;
}

#subcontent ul {
	 margin: 0px 0px 0px 0px; 
	 padding: 0px 0px 0px 20px;
}

#subcontent li {
	 margin: 0px 0px 4px 0px; 
	 padding: 0px 0px 0px 0px;
	 list-style-image: url(../ui/bullet_2.png);
}

#subcontent2 {
	width: 210px; background-color: #121923; float: right; margin: -8px 0px 10px 14px; padding: 10px;
	text-align: center;
	-moz-border-radius: 15px;
	-moz-border-radius: 15px;
	 color: #A1A4A8;
	 font-size: 0.9em;
}


#lh {
	position: absolute; top: 0px;
	margin: 0px 0px 20px 8px;
	padding: 0px 20px 0px 0px;
	width: 268px;


}

#lh-content {margin: 10px 0px 10px 10px; padding: 10px 10px 10px 10px; color: #A1A4A8; line-height: 16px; border: none; border-right: 1px solid #1E2836;}

#lh-content h2 {margin: 0px 0px 0px 0px; padding: 6px 6px 6px 6px; color: #E4D4BD; font-weight: normal;}

#lh-content ul {margin: 0px 0px 10px 0px; padding: 6px;}
#lh-content li {list-style-image: url(../ui/bullet_1.png); margin: 8px 0px 10px 20px; padding: 0px 0px 0px 0px; font-size: 0.75em;}




#footer {
	width: 100%; height: 80px;
	background-image: url(../ui/footer2_bg.gif); background-repeat: no-repeat;
	color: #4B5763;
	text-align: right;
	font-size: 0.8em;
}

#footer .footernav {
	padding: 25px 0 0 10px; float: left;
}

#footer .footertext {
	padding: 30px 10px 0 0;
}

#footer .footerct {
	display: none;
}



#indexfooter {
	width: 100%; height: 80px;
	clear: both;
	background-image: url(../ui/footer_bg.gif); background-repeat: no-repeat;
	color: #4B5763;
	text-align: right;
	font-size: 0.8em;
}

#indexfooter .footernav {
	padding: 25px 0 0 10px; float: left;
}

#indexfooter .footertext {
	padding: 30px 10px 0 0;
}

#indexfooter .footerct {
	display: none;
}


#login {
	position: absolute;
	top: 60px; right: 6px; text-align: right;
	padding: 0px 0px 0px 0px;
	color: #A1A4A8; 
	font-weight: normal; 
	font-size: 0.7em;
}

#login p {
	line-height: 2em;
}


#googleplus {
	position: absolute;
	top: 70px; right: 0px; text-align: right;
	padding: 0px 0px 0px 0px;
}

#loginform {
	padding: 0px 0px 0px 0px;
	margin: 20px 0px 20px 0px;
	color: #A1A4A8; 
	font-weight: normal; 
	font-size: 0.8em;
}


.form {
	margin: 0px 10px 0px 10px;
	padding: 4px;
	background-color:#000000;
	color: #DFD3BD;
	border: 1px solid #2F3541;
	font-size: 0.8em;
}



.contactform {

}

.contactform label {
 	display: block;
	margin: 10px 0px 10px 0px;
	color: #A1A4A8;
	font-size: 0.8em;
}

.contactform textarea {
	margin: 0px 0px 10px 0px;
	display: block;
}

.contactform select {
	margin: 0px 0px 10px 0px;
	display: block;
}

.contactform option {
	margin: 0px;
	display: block;
	padding: 2px;
}

.contactform input {
	margin: 0px 0px 10px 0px;
	display: block;
}

.contactform .error {color:#CC0000; display: none; margin: 4px 0 10px 0; font-size: 0.8em;}


.enquiryform {
	background: #E3D6BE; margin: 20px 30px 30px 30px; padding: 0px;
}

.enquiryform label {
 	display: block;
	margin: 10px 30px 10px 0px;
	color: #1E2836;
	font-size: 0.8em;
	line-height: 1.4em;
}

.enquiryform textarea {
	margin: 0px 0px 10px 0px;
	display: block;
}

.enquiryform select {
	margin: 0px 0px 10px 0px;
	display: block;
}

.enquiryform option {
	margin: 0px;
	display: block;
	padding: 2px;
}

.enquiryform input {
	margin: 0px 0px 10px 0px;
	display: block; 
}

.enquiryform table {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}

.enquiryform td {
	padding: 0px 0px 0px 0px;
	margin: 0;
}

.enquiryform .error {color:#CC0000; display: none; margin: 4px 0 10px 0; font-size: 0.8em;}

.enquiryform .form {background:#c3b498; color: #000000; border: 1px solid #8b7d62; width: 90%;}

fieldset {
	padding: 10px 10px 10px 10px;
	margin: 30px 30px 30px 30px;
	border: 1px solid #C3B498;
}

.enquiryform legend {
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
	color: #1E2836;
	font-weight: bold;
	font-size: 0.9em;
}








/* PORTFOLIO TABS ---------------------------------------------------------------------- */

#split {width: 100%;}

#split .panes div {
	display:none;
	padding: 0;
	margin: 0;
}

#split .panes p {
	padding: 0px 0px 0px 0px;
	margin: 0;
}	

#split .panes ul {
	padding: 0px 0px 0px 0px;
	margin: 6px 0 6px 20px;
}	
	
#split .panes ul li {
	padding: 0px 0px 0px 0px;
	margin: 6px 0 6px 0px;
}		

/* root element for tabs  */
#split ul.tabs { 
	list-style:none; 
	margin:0 !important; 
	padding:0;	
	height:30px;
}

/* single tab */
#split ul.tabs li { 
	float:left;	 
	text-indent:0;
	padding:0;
	margin:0 !important;
	list-style-image:none !important; 
}

/* link inside the tab. uses a background image */
#split ul.tabs a { 
	background-color: #1E2836;
	color:#A1A4A8;
	display:block;
	height: 30px;  
	line-height:30px;

	text-align:center;	
	text-decoration:none;
	padding: 0 30px 0 30px;
	margin: 0px 1px 0 0;	
	position:relative;
	font-size: 1.1em;
}

#split ul.tabs a:active {
	outline: none;
}

/* when mouse enters the tab move the background image */
#split ul.tabs a:hover {
	background-color: #4C5966;	
	color:#DFD3BD;
}

/* active tab uses a class name "current" */
#split ul.tabs a.current, ul.tabs a.current:hover, ul.tabs li.current a {
	background-color: #1E2836;
	cursor:default !important; 
	color:#A1A4A8 !important;
}

/* Different widths for tabs: use a class name: w1, w2, w3 or w2 */


/* width 1 */
ul.tabs a.s 			{ width:81px; }
ul.tabs a.s:hover 	{ }
ul.tabs a.s.current  {}

/* width 2 */
ul.tabs a.l 			{ width:174px; }
ul.tabs a.l:hover 	{ }
ul.tabs a.l.current  { }


/* width 3 */
ul.tabs a.xl 			{ width:248px; }
ul.tabs a.xl:hover 	{ }
ul.tabs a.xl.current { }


/* initially all panes are hidden */ 
#split .panes .pane {
	display:none;		
}

#portfolio td.static  {
	margin: 0; padding: 0px;
	text-align: center;
}

#portfolio td.static p  {
	margin: 0; padding: 10px 0 0 0px;
}





/* This is the moving lens square underneath the mouse pointer. */
.cloud-zoom-lens {
	border: 0;
	margin:0px;	/* Set this to minus the border thickness. */
	background-color:#fff;	
	cursor:move;		
}

/* This is for the title text. */
.cloud-zoom-title {
	font-family:Arial, Helvetica, sans-serif;
	position:absolute !important;
	background-color:#000;
	color:#fff;
	padding:3px;
	width:100%;
	text-align:center;	
	font-weight:bold;
	font-size:10px;
	top:0px;
}

/* This is the zoom window. */
.cloud-zoom-big {
	border:0;
	overflow:hidden;
}

/* This is the loading message. */
.cloud-zoom-loading {
	color: #A1A4A8;	
	background: #1E2836;
	padding:6px;
	border: 4px solid #121923;
}