/* CSS Document */
/* DOCUMENT INFORMATION -----------------------------------
TITLE:			Default screen display styles
LAST UPDATED:	10th July 2009
AUTHOR:			Ben Johnson
NOTES:			The 1st section will reset any variance	across all browsers 
				making them all	appear very similar. Retrieved from various 
				sources over the net

-- CONTENTS -----------------------------------------------
	=1:		[STANDARDS / HTML]
	=2:		[COMMON ELEMENTS]
	=3:		[TEXT STYLE]
	=4:		[HEADER]
	=5:		[NAVIGATION]
	=6:		[SIDE]
	=7:		[MAIN.TPL]
	=8:		[BODY / CONTENT]
	=9:		[FOOTER]
	=10:	[MISC]
	=11:	[JQuery Stylish Select]	
	=12:	[FISHEYE MENU]
---------------------------------------------------------*/

/*------=1:	[STANDARDS / HTML] -----------------------------*/
html, body, div, span, applet, object, iframe, table, caption, tbody, tfoot, thead, tr, th, td, 
del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, 
h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, 
dl, dt, dd, ol, ul, li, fieldset, form, label, legend {
	vertical-align: baseline;
	font-family: inherit;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	outline: 0;
	padding: 0;
	margin: 0;
	border: 0;
}
:focus { outline: 0; } /* remember to define focus styles! */

body, select, input, textarea {
	font-family: "Trebuchet MS", arial, verdana, helvetica, sans-serif;
	font-size: 12px; 
	text-align: left;
	color: #000;
}

body {
	color: #000;
	background-color: #FFF;
}


/*------=2:	 [COMMON ELEMENTS] -----------------------------*/
hr {
	height: 1px;
	background-color: #ccc;
	color: #ccc;
	border: 0px;
	width: 90%;
}

.floatLeft { float: left; }
.floatRight { float: right; }

.pointer {cursor:pointer; }

.left { text-align: left; }
.right { text-align: right; }
.center { text-align: center; }

.clearBoth { clear: both; }

.hide {	display: none; }

/* tables still need cellspacing="0" in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	font-weight: normal;
	text-align: left;
}

blockquote { 
	 margin: 0.4em 1.1em;
	 font-style: italic;
	 color: #121212;
	 font-size: 13px;
}

blockquote p {
    padding: 0; }
blockquote p:before {
    content: '"'; }
blockquote p:after {
    content: '"'; }

ol, ul {
	list-style: none;
}
	ul.bullet {
		list-style: square inside url("../images/bullet-point.png");
		margin: 8px 0 5px 0;
		padding: 0 0 10px 0;
	}
	ul.bullet li {
		border-bottom: 1px solid #CFCFCF;
		margin: 3px 0 14px 0;
		padding: 0 0 2px 0;
		line-height: 1.05em;
	}

img, fieldset {
	border: 0px;
	display: block;
}
#videoWrapper .video{
	margin:5px 30px 10px 30px; 
}

/*------=3:	 [TEXT STYLE] -----------------------------*/
h1, h2, h3, h4, h5, h6 {
	padding-bottom: 0.8em;	
}

h1 {
	font-size: 1.7em;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	color: #121212;
	letter-spacing: -0.03px;
	word-spacing: -0.05px;
	line-height: 1.2em;
	font-weight: 100;
	text-transform: capitalize;
	padding: 8px 0 0 0;
}


h2 { /* Same as h1 style for SEO only 1 h1 to a page */
	font-size: 1.7em;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	color: #121212;
	letter-spacing: -0.02em;
	word-spacing: 0.05em;
	line-height: 1.2em;
	font-weight: 100;
	text-transform: capitalize;
	padding: 8px 0 4px 0;
}
	h2.heading {
		padding: 12px 0 4px 0;
	}
	h2.subheading {
		padding: 0 0 5px 10px;
	}
		h2.subheading a {
			font-size: 95%;
		}
		
h3 {
	font-size: 1.3em;
	font-family: Verdana,Arial,Helvetica,sans-serif;
	color: #121212;
	letter-spacing: 0.4px;
	font-weight: 100;
	line-height: 1em;
	padding: 5px 0 2px 0;	
}
	h3 span {
			font-size: 0.8em;
			color: #807b7b;
			font-weight: 100;
			line-height: 1.2em;
			letter-spacing: -0.2px;
	}
h4 {
	font-size: 1.2em;
	color: #121212;
	letter-spacing: 0.6px;
	font-weight: 100;
	line-height: 0.9em;
	padding: 5px 0 0 7px;	
}
h5 {
	font-size: 1.2em;	
}
h6 {
	font-size: 1em;	
}
p {
	padding-bottom: 1.2em;	
	font-size: 1em;
}
p:first-letter {
	font-size: 110%;
}

strong { font-weight: bold; }

a {	text-decoration: none; }
a, a:visited { color: #000; }
p a, p a:visited, li a, li a:visited, ul a, ul a:visited { color: #5f9520; }

.date {
	font-weight: normal;
	font-size: 70%;
	color: #807b7b;
	margin: 0;
	padding: 0;
}
.error {
	color: #C00;
	font-weight: bold;	
}
.confirmation {
	color: #080;
	font-weight: bold;	
}

/*------=4:	 [HEADER] ----------------------------------*/
#header {
	height: 268px;
	width: 1012px;
	margin: 0 auto;
}

/*------=5:	 [NAVIGATION] ------------------------------*/
#nav {
	height: 83px;
	width: 94%;
	background: url('../images/menu_left.gif') no-repeat left;
	margin: 0 auto;
}

	ul.nav {
		width: 100%;
		margin-left: 3px;
	}
		ul.nav li {
			background: url('../images/button.gif') right no-repeat;
			height: 81px;
			width: 118px;
			list-style-type:none;
			padding-top: 1px;
			float:left;
		}
				
		ul.nav li:hover a {
			background: url('../images/button_on.gif') bottom center no-repeat;
		}
		
		#nav a {
			height: 73px;
			display: block;
			color: #4c4c4c;
		}
		ul.nav li h4 {
			font-size: 15px;
			font-weight: 400;
			color: #4c4c4c;
			margin: 7px 0 0 5px;
			padding: 0;
		}
		ul.nav li span {
			font-size: 12px;
			font-weight: 100;
			color: #aeaeae;
		}
		
/*----------dropdownMenu-------------*/
#nav li ul{
	display:none;
	margin: -1px 0 0 0;
}

#nav li:hover ul{
	display:block;	
}

#nav li ul li {
	background-image: none;
	background-color: #e0e0e0;
	color: #121212;
	height: 20px;
	text-align: center;
}
#nav li ul li:hover {
	background-image: none;
	background-color: #e0e0e0;
	color: #121212;
}

/*------=6:	 [SIDEBAR] ---------------------------------*/
#sidebar {
	
}

/*------=7:	 [MAIN.TPL] --------------------------------*/
#outerpage {
	background: url('../images/outerpage_top.gif') top left repeat-x;
}
	body#Graphics_Design #outerpage {
		background: url('../images/blue/outerpage_top.gif') top left repeat-x;
	}
	body#Localisation #outerpage {
		background: url('../images/purple/outerpage_top.gif') top left repeat-x;
	}
	body#Website_Design #outerpage {
		background: url('../images/pink/outerpage_top.gif') top left repeat-x;
	}
	body#Translation #outerpage {
		background: url('../images/green/outerpage_top.gif') top left repeat-x;
	}	
#outerpage_bottom {
	background: url('../images/outerpage_bottom.gif') bottom left repeat-x;
}

	#container {
		width: 1012px;
		margin: 0 auto;
	}
	
		#shadow {
			width: 1012px;
			background: url('../images/shadow.gif') repeat-y;
		}		
			body#Translation #shadow 		{background: url('../images/green/shadow-bk-green.gif') repeat-y; }
			body#Website_Design #shadow		 {background: url('../images/pink/shadow.gif') repeat-y;	}
			body#Localisation #shadow 		{background: url('../images/purple/shadow.gif') repeat-y; }
			body#Graphics_Design #shadow 	{background: url('../images/blue/shadow.gif') repeat-y; }
		
		#page_top {
			width: 1012px;
			background: url('../images/page_top.gif') top left no-repeat;
		}
			body#Translation #page_top 		{background: url('../images/green/page_top.gif') top left no-repeat;	}
			body#Website_Design #page_top 	{background: url('../images/pink/page_top.gif') top left no-repeat; }
			body#Localisation #page_top		{background: url('../images/purple/page_top.gif') top left no-repeat; }
			body#Graphics_Design #page_top 	{background: url('../images/blue/page_top.gif') top left no-repeat; }
		
		#page_bottom {
			width: 1012px;
			background: url('../images/page_bottom.gif') bottom left no-repeat;
			padding: 0 0 20px 0;
		}
			body#Translation #page_bottom 		{background: url('../images/green/page_bottom.gif') bottom left no-repeat; }
			body#Website_Design #page_bottom 	{background: url('../images/pink/page_bottom.gif') bottom left no-repeat; }
			body#Localisation #page_bottom 		{background: url('../images/purple/page_bottom.gif') bottom left no-repeat; }
			body#Graphics_Design #page_bottom 	{background: url('../images/blue/page_bottom.gif') bottom left no-repeat;	}
	
	#page {
		width: 930px;
		min-height: 530px;
		margin: 0 auto;
		color: #2a2a2a;
		font-size: 13px;
		padding-bottom: 10px;
	}
		
#breadCrumb {
	float: left;
	width: 600px;
	height: 10px;
}

/*------=8:	 [BODY/CONTENT] ----------------------------*/

#content {
	padding-bottom:40px;
	padding-top:20px;
}	

#content ol, #content ul {
	list-style: circle inside;
}
#content p {
	line-height: 1.8em;
}
.leftcol { 
	width: 410px;
	float: left;
	margin: 0 4px 0 0;
}

.rightcol {
	width: 510px;
	float: left;
	margin: 0 0 0 6px;
}

/* BOD */
.box {
	background: url('../images/box_bottom.gif') bottom left no-repeat;
	width: 510px;
	float: left;
	margin: 0 0 16px 0;
	padding: 0 0 6px 0;
}
	.box_top {
		background: url('../images/box_top.gif') repeat-x;
		height: 40px;
		width: 494px;
		padding: 8px;
	}
	.box_top h3 {
	margin: 0;
	padding: 0;
	letter-spacing: 0.04em;
	word-spacing: -0.2em;
	line-height: 1.2em;
	text-transform: capitalize;
	}
	.box_top a {
	color: #000;
	}
	.box_middle {	
		padding: 9px 6px 0 6px;
		border-left: 1px solid #e0e0e0;
		border-right: 1px solid #e0e0e0;
		float: left;
	}
		.box_middle img {
			float: right;
			margin: -3px 4px 0px 6px;
		}
		
/* POD */
.pod {
	width: 407px;
	float: left;
	margin: 0;
}
	.pod_middle {
		background: url('../images/pod_middle.png') top left no-repeat;
		width: 407px;
		float: left;
		margin-top: 4px;
	}
	.pod_cont {
		width: 380px;
		margin: 0 auto;
	}
	.pod_bottom {
		width: 407px;
		float: left;
	}		
	.podimage {
		margin: -30px auto 0px auto;
	}
	

table#quickquote {
	border-top: 1px solid #e0e0e0;
	border-left: 1px solid #e0e0e0;
	border-right: 1px solid #e0e0e0;
	width: 407px;
}
	table#quickquote tr td {
		background-color:#fff;
		border-bottom: 1px solid #e0e0e0;
	}
	table#quickquote tr th {
		background-color:#f7f7f7;	
		border-bottom: 1px solid #e0e0e0;
	}
	table#quickquote p { margin: 3px 0 0 10px; padding: 0; color: #807b7b; font-size: 14px;}
	#content table#quickquote tr th {
	font-weight: bold;
	font-size: 120%;
	padding: 5px;
	}
	#content table#quickquote tr td {
	padding: 4px;
	}

.newsitem {
	
}
.latestnews {
	float: right;
	clear: right;
	width: 180px;
	border-left: 2px groove #fff;
	border-bottom: 2px groove #fff;
	margin: 5px 0 0 9px;
	padding-left: 10px;
}
.randomImage {
	 float: left;
	 margin: 0 0 4px 8px;
}

.portfolioItem {
	float: left;
	border-bottom: 1px solid #ccc;
	margin: 4px 0px;
	padding-bottom: 4px;
	width: 99%;
}
	.portfolioItem  img { float: left; padding: 2px; margin: 2px; border: 1px solid #444; }
	.portfolioItem	.info { float: left; padding: 2px; }
	.portfolioItem  h2 { font-size: 12px; font-weight: bold; margin-bottom: 4px; }


/*------=9: [FOOTER] ------------------------------------*/
#footer {
	width: 1012px;
	height: 122px;
	float:left;
	color: #343434;
	margin: 0 0 0 53px;
}
	.left {
		float: left;
		width: 570px;
		margin: 20px 0 0 0;	
	}
	.right {
		float: left;
		margin: 20px 0 0 200px;
	}
	#footer img {
		float: left;
		margin: 0 15px 0 0;
	}
	
/*------=10: [MISC] --------------------------------------*/
.button_send {
	background: url('../images/form/send.png') no-repeat;
	width: 69px;
	height: 33px;
	border: 0;
	float: none;
	margin: 10px 0 0 160px;
}
.selector {
	float: right;
	margin: 0 5px 5px 0;
}
label {
	float: right;
	font-weight: bold;
	padding: 0 4px 0 0;
	height: 22px;	
}
input {
	float: right;
	margin: 0 10px 0 0;
}
	input.txt {
		background: url('../images/form/input.gif') no-repeat;
		width: 125px;
		height: 22px;
		border: 0;
		padding: 2px 7px 0 4px;
		letter-spacing: 1px;
		font-size: 11px;
	}
	input.small {
		background: url('../images/form/input_small.gif') no-repeat;
		width: 65px;
		height: 22px;
		border: 0;
		padding: 2px 7px 0 4px;
		letter-spacing: 1px;
		font-size: 11px;
	}
	input.large {
		background: url('../images/form/input_large.gif') no-repeat;
		width: 180px;
		height: 22px;
		border: 0;
		padding: 2px 7px 0 4px;
		letter-spacing: 1px;
		font-size: 11px;
	}
select {
	float: right;
	height: 21px;
	width: 112px;
	background: url('../images/form/select.gif') no-repeat;
	border: 0;
}
.contactForm {
	width: 500px;
	float: left;
	margin-left: 75px;
}
	.contactForm label {
		float: left;
		width: 140px;	
	}
	.contactForm input, .contactForm select  {
		float: left;
		width: 200px;
		height: 22px;
		margin-bottom: 10px;
	}
	.contactForm textarea  {
		float: left;
		width: 190px;
		height: 90px;
		margin-bottom: 10px;
		background: url('../images/form/textarea.gif');
		border: 0;
		padding: 5px;
	}
	.contactForm .newListSelected  {
		float: left;
		margin-bottom: 5px;
	}
/*------=11: [JQuery Stylish Select] --------------------------------------*/
ul.newList {margin:0; padding:0; list-style:none; color:#343434; width:175px;  border:1px solid #ccc; overflow:auto; z-index:9999; background: #fff;}
.newListSelected {width:175px; color:#343434; height:19px; padding:1px 0 0 6px; float:right; background:url(../images/form/select-bg.png) no-repeat;}
ul.newList li {padding:1px 6px;}
.newListHover {background:#F7F7F7!important; color:#343434!important; cursor:default;}
.newListSelHover, .newListSelFocus {background-position:0 -21px; cursor:default;}

/*------=12: [Fisheye Menu] --------------------------------------*/

/* dock - top */



.dock {
	position: relative; 
	height: 270px;
	left:-10px;
	text-align: center;
}
.dock-container {
	position: absolute;
	height: 270px;
}
div.dock-item {
	display: block;
	color: #000;
	position: absolute;
	top: 0px;
	text-align: center;
	text-decoration: none;
	font: bold 12px Arial, Helvetica, sans-serif;
	cursor:pointer;
}
.dock-item img {
	border: none; 
	margin: 0 10px 0px; 
	width: 100%;
	position:absolute;
	top:0;
	left:0;
	z-index:10;
}

.dock-item img.shadow {
	z-index:1;
}

.dock-item a {
	display:block;
	width:100%;
	height:100%;
}

#dockTimeout {
	position:relative;
	left:-100000px;
}

#recaptcha_widget_div {
	margin: 0 0 0 6px;
}

