/*

	CSS Template

	CONTENTS ----------

		1.Over all styles
		2.Layout
		3.Search
		4.Menu(s)
		5.ARD Tables
		6.Forms
		7.CZ styles
		8.Site Search results
		9.Tabs

    -------------------

	COLOURS ----------

		Text #000000
		
		A #3f71ce 

		A:hover #004890

		H1 #3f71ce
		
		H2 #004890

    -------------------

 */
 
/* Reset CSS */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* Make scroll bar always visibale IMPORTANT in FF */
HTMl { overflow-y: scroll; }


 /* 1.Over all styles
---------------------------------------------------------------*/
body {
	font: 12px Tahoma, Arial, Verdana; /* to add line height of eg 18px use 13px/18px  */
	color: #000000;
	background-color:#fff;
	margin-bottom:20px;
	}
	img { border:none; }
P, td, th, div { line-height: 17px; }
H1 { font:bold 24px/26px "Century Gothic", Tahoma, Arial, Verdana; color:#004890;}
H2 { font-size: 18px; font-weight: bold; color: #004890;  }
H3 { font-size: 18px; font-weight: bold; color: #004890; }
H4 { font-size: 14px; color: #505050; line-height: 17px; }
H5 { font-size: 14px; color: #505050; line-height: 17px; }
H5 A { text-decoration: none; }
A { color: #004890; text-decoration: underline; }
A:hover { color: #004890; text-decoration: none; cursor:pointer; }
A.noline { color: #000; text-decoration: none; }
A.noline:hover { color: #000; text-decoration: none; }
.highlight { font-weight:bold; }
.floatl { float:left; }
.floatr { float:right; }
.clear { clear:both; }
/* 2.Layout
---------------------------------------------------------------*/

#logo { border:0; }
.phone { display:block; float:left; line-height:170px; color: #004890; padding-left:14px; }
#contact-left { float:left; width:200px; margin-right:15px; }
#contact-right { float:right; width:200px; }

.headerimg { float:right; margin:31px 28px 0 0; width:126px; height:110px; overflow:hidden; }

#content p, #content h1, #content h2, #content h3, #content h4, #content h5 { margin-bottom:15px; }
#content ul, #content ol { margin:0 0 15px 20px; }
#content ol { list-style:decimal; }
#content ol li { margin-bottom:5px; }
#content table { margin-bottom:15px; }


.office { padding-left:-5px; }
.logos { text-align:center; margin-top:50px; }
a.taxPlanning { font-size:46px; line-height:46px; float: left; margin: 30px 30px 30px 80px; color:#004890; text-decoration:none; }
a.accounting { font-size:20px; float: left; margin: 30px 30px 30px 100px; text-decoration:none; color:#004890;}
a.audit { font-size:26px; line-height:26px; float: left; margin: 0px 30px 30px 240px; text-decoration:none; color:#004890;}
a.payroll { font-size:30px; line-height:30px; float: left; margin: 10px 30px 30px 40px; text-decoration:none; color:#004890;}
a.hr { font-size:34px; float: left; margin: 20px 30px 30px 40px; text-decoration:none; color:#004890;}
a.bookkeeping { font-size:38px; line-height:38px; float: left; margin: 0px 30px 30px 140px; text-decoration:none; color:#004890;}
a.taxAdvisory { font-size:30px; line-height:38px; float: left; margin: 5px 30px 30px 40px; text-decoration:none; color:#004890;}
a.businessPlanning { font-size:25px; line-height:25px; float: left; margin: 5px 30px 30px 170px; text-decoration:none; color:#004890;}
a.companySecretarial { font-size:35px; line-height:35px; float: left; margin: 20px 30px 30px 100px; text-decoration:none; color:#004890;}


a.taxPlanningsmall {
	font-size:16px;
	line-height:30px;
	color:#004890;
	text-decoration:none;
	position:absolute;
	left: 43px;
	top: 4px;
}
a.accountingsmall {
	font-size:12px;
	text-decoration:none;
	color:#004890;
	position:absolute;
	left: 271px;
	top: 8px;
}
a.auditsmall {
	font-size:12px;
	line-height:26px;
	text-decoration:none;
	color:#004890;
	position:absolute;
	left: 237px;
	top: 41px;
}
a.payrollsmall {
	font-size:16px;
	line-height:30px;
	text-decoration:none;
	color:#004890;
	position:absolute;
	left: 140px;
	top: 48px;
}
a.hrsmall {
	font-size:12px;
	text-decoration:none;
	color:#004890;
	position:absolute;
	left: 385px;
	top: 37px;
}
a.bookkeepingsmall {
	font-size:14px;
	line-height:38px;
	text-decoration:none;
	color:#004890;
	position:absolute;
	left: 3px;
	top: 42px;
}
a.taxAdvisorysmall {
	font-size:16px;
	line-height:38px;
	text-decoration:none;
	color:#004890;
	position:absolute;
	left: 268px;
	top: 77px;
}
a.businessPlanningsmall { font-size:14px; line-height:18px; text-decoration:none; color:#3f7fd0; position:absolute;}
a.companySecretarialsmall {
	font-size:16px;
	line-height:28px;
	text-decoration:none;
	color:#004890;
	position:absolute;
	left: 38px;
	top: 88px;
}
.smallmenucloud {
	position:absolute;
	left: 503px;
	top: 536px;
	width:430px;
}

.friends td { text-align:center; padding-bottom:10px; }

.getintouch { width:350px; margin:20px 40px 0 0; }
.color { color:#004890; }

#container {
  width: 960px; 
  margin: 0 auto; 
  text-align: left;
  position:relative;
}

#branding {
	height: 170px;
	background-color:#FFFFFF;
	background-image:url(/images/logobg.png);
	background-repeat:no-repeat;
	background-position:right;
	position:relative;
}
#branding img { float:right; }
#brandingLinks { float:right; text-align:center;  width:125px; margin:60px 7px 0 0; }
#brandingLinks h1 { 
	color:#FFFFFF;
	font-size:21px;
	padding-top:10px;
	font-family:Tahoma, Arial, Verdana;
	font-weight: normal;
	}
#brandingLinks h1.twolines { padding-top:0; }
#brandingLinks a { color:#999999; }

#contentContainer {
	width: 960px;
	display: block;
	clear: both;
	overflow: hidden;
	height:100%;
}
#content { 
  width: 920px;
  float: left;
  padding:20px 14px;
  margin-top:15px; 
  text-align:justify;
}
#text { width:451px; float:left; }
#image { float:right; width:430px; min-height:286px; background:url(/images/about.jpg) no-repeat 0 0; }
	#promise #image { margin-top:35px; }

.footerLogos { display:none; }
#home div.footerLogos { display:block; }

#noimage #image { display:none; }
#noimage #text { width:900px; }

#home #image { background-image:none; } 

#content p, #content h1, #content h2, #content h3, #content h4, #content h5, #mainBanner { margin-bottom:15px; }
.innerColumn { width:42%; padding:5px; float:left; background-color:#F3F3F3; }
.innerColumn li { margin-left:20px; }
.innerColumn li ul li { margin-left:0px; }
#column { 
  width: 200px; 
  float: right;
  margin-top:15px;
} 


#footer { 
  clear: both;
  padding: 10px 20px;
  height:40px;
  display:block;
} 
#footer p { color:#004890; }
#footer a { color:#004890; text-decoration:none; }
#footer a:hover { color:#004890; text-decoration:underline; }
#footerPrimary { 
  width: 470px;
  float: left;
  height:30px;
  line-height:30px;
  padding-top:10px;
}

#footerSecondary { 
  width: 240px; 
  float: right;
  padding-top:6px;
  text-align:right; font-size:22px;
  color:#999999;
} 

.footerLogos { margin:5px 15px; float:right; }

/* 3.Search
---------------------------------------------------------------*/
.searchform { padding:0; margin:0; }
.searchbut { 
	background: #004890; border: 1px solid #004890; padding: 4px; color: #fff; font-weight: bold; font-size: 11px; }
.searchbox {
	width: 120px; padding: 4px; border: 1px solid #004890; font-size: 11px; color:#666666;}

/* 4.Menu
---------------------------------------------------------------*/
#menuWrap {	
	clear: both;
	position:relative;
	display:block;
	height:32px;
	background:#FFFFFF; /* add background (this can be added directly to the #menu */
	position:relative;
	z-index:100;/* this makes sure that the menu appears on top of all elements of the page mainly things like JS banners and flash files */
	}

#menu, #menu ul{
	margin:0;
	padding:0;
	list-style-type:none;
	list-style-position:outside;
	position:relative;
	line-height:32px; /* add line height  DONT USE HEIGHT */
	font-weight:normal;
	}
	
#menu { margin-left:0px; /* add any padding - separate so you don’t add margin to the all the ul elements */ }

#menu li { 
	list-style:none;
	float:left; /* float needed */
	position:relative;
	border:0;
	}
#menu li:hover a { background-color: #004890; color:#FFFFFF; } /* keeps the original button highlighted */
#menu li.noborderr a { border-right:none;  } #menu li.noborderl a { border-left:none;  }/* Borders as appropriate */
#menu li.noborderr { float:right; padding:0;}

#menu a{
	display:block;
	padding:0px 14px; /* set padding will affect padding on all a tags in menu */
	line-height:32px; /* set line height DONT use just height */
	color:#004890;
	text-decoration:none;
	border-right:1px solid #004890; /* Borders as appropriate */
	}

#menu a:hover{
	background-color: #004890;
	color:#fff;
	}

#menu ul {
	position:absolute; /* Menu uses position ab to set drop downs so top: needs to be the same height as the menu */
	display:none; /*display none so menu is not visable until user hovers over the li*/
	width:194px; /* Width will need to be updated inline with all the padding on the menus */
	top:32px;
	background-color:#375e8c;
	}

#menu li ul a{
	width:150px; /* Width will need to be updated inline with all the padding on the menus */
	height:auto;
	float:left;
	border:0;
	border-bottom:1px solid #FFFFFF;
	line-height:18px;
	padding:8px 22px;
	}
#menu li ul a:hover { background-color:#dce6f2; color:#375e8c; }
#menu ul ul{
	top:auto;
	}	

#menu li ul ul { /* styles for sub drop downs */
	left:184px; /* left needs to be the overall width of the main drop down  */
	margin:0px 0 0 10px;
	width:204px;
	}
#menu li ul ul a { 
	width:160px; /*update width inline with all the overs*/
	}
#menu li:hover ul ul, #menu li:hover ul ul ul, #menu li:hover ul ul ul ul{
	display:none;
	}
#menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li li li li:hover ul{
	display:block;
	}


/* 5.ARD Tables
---------------------------------------------------------------*/

/*table formatting*/
.tablines { background-color: #505050; }

#content .tablines table { margin-bottom:0; } /*resets the padding to 0 on tables inside the tablines*/
 
/*a light colour on the borders of branded tables*/
.tabtitle{  font-weight: bold; color: #FFFFFF; background-color: #004890; padding:5px; }

.tabletitle{ font-weight: bold; color: #FFFFFF; background-color: #004890; padding:5px; }

/*Used if table has an extra heading.*/
.tabhead { font-weight: bold; color: #004890; background-color: #FFFFFF; padding:5px; }

/*dark colour, matching nav bar or other strong colour in the site.*/
.tabbody { font-weight: normal; color: #004890; background-color: #FFFFFF; padding:5px; }

/*standard text, white background, black text is most common.*/
.tabtotal{ font-weight: bold; color: #000000; background-color: #FFFFFF; padding:5px; }



/* 6.Forms (ask us a question)
---------------------------------------------------------------*/

#FirstName, #LastName { width:49%; }
#Business, #Telephone, #emailAddress { width:98%; }
#ValidationCode { width: 100px; }
#Comments { width: 99%; height: 100px; }

.FormButton  { 
	height: 19px;
	color: #FFFFFF;
	background-color: #004890;
	border: solid 1px #3f71ce; }
.FormText {
	background-color: #FFFFFF;
	border: solid 1px #3f71ce;
	margin-bottom:5px;
	padding:2px; }
.FormTextRequired {
	background-color: #FFFFFF;
	border: solid 1px #FF0000;
	margin-bottom:5px;
	padding:2px; }

/* 7.CZ
---------------------------------------------------------------*/

#CZDocumentBody td { padding:5px; }


/* 8.Site Search results
---------------------------------------------------------------*/
/*same background as tabbody but bold the text */

.NewsWireResult{ BORDER-RIGHT: graytext 1px solid; BORDER-TOP: graytext 1px solid; BORDER-LEFT: graytext 1px solid; BORDER-BOTTOM: graytext 1px solid; MARGIN-BOTTOM: 10px; PADDING: 2px; }
.NewsWireResult H3 { MARGIN-TOP: 2px; MARGIN-BOTTOM: 0em; }
.DataResult { BORDER-RIGHT: graytext 1px solid; BORDER-TOP: graytext 1px solid; BORDER-LEFT: graytext 1px solid; BORDER-BOTTOM: graytext 1px solid; MARGIN-BOTTOM: 10px; PADDING: 2px; }
.DataResult H3 { MARGIN-TOP: 2px; MARGIN-BOTTOM: 0em; }



/* 9. Tabs
----------------------------------------------------------------------------*/

#tabswrap { float:left; background:url(/images/partner-back.png) no-repeat 0 0; width:392px; height:380px; }
#content ul.tabs {
	margin:0 0 0 20px;
	padding: 0;
	float: left;
	list-style: none;
}
ul.tabs li {
	float:left;
	clear:left;
	overflow: hidden;
	position: relative;
	padding: 20px 0 0 0;
	background-repeat:no-repeat;
	background-position:0 20px;
	width:104px;
	}
ul.tabs li a {
	text-decoration: none;
	color: #000;
	display: block;
	outline: none;
	width:104px;
	height:100px;
}
ul.tabs li.nolink { display:block; width:104px; height:100px; padding:0; margin:20px 0 0 0; }
ul.tabs li a:hover {

}	
html ul.tabs li.active a, html ul.tabs li.active a:hover  {

}
.tab_container {
	float: left; 
	background: #fff;
	overflow:hidden;
	width:505px;
}
.tab_content {
	width:455px;
	height:173px;
	padding:14px 19px 21px 14px;
	background:url(/images/contact-details-background.png) no-repeat 0 0;
	margin:5px 0 15px 0;
}
.tab_content h3 { padding-top:10px; }
.partnerImage { width:126px; height:173px; float:left; margin-right:30px; }
.contact_details { padding-top:30px; }

.javid { background-image:url(/images/Javid-Siddiqui.jpg); }
.mickey { background-image:url(/images/Micky-Ackenson.jpg); }
.david { background-image:url(/images/David-White.jpg); }
.howard { background-image:url(/images/Howard-Harris.jpg); }
.james { background-image:url(/images/James-Edmond.jpg); }

.fadeThis span { background:url(/images/partners-hover.png) no-repeat top;
position: absolute;
		top: 20px;
		left: 0;
		display: block;
		height:100px;
		width: 104px; }

a.fadeThis:hover span {
		position: absolute;
		top: 20px;
		left: 0;
		display: block;
		height:100px;
		width: 104px;
		background:url(/images/partners-hover.png) no-repeat bottom;
	}