
/*

	CSS Template

	CONTENTS ----------

		1.Over all styles
		2.Layout
		3.Search
		4.Menu(s)
		5.ARD Tables

    -------------------

	COLOURS ----------

		Text #000000
		
		A #08085a 

		A:hover #1d4699

		H1 #08085a
		
		H2 #1d4699

    -------------------

 */
 
/* Zero down margin and paddin on all elements */
* {
  margin: 0;
  padding: 0;
}
/* Make scroll bar always visibale IMPORTANT in FF */
HTMl { overflow-y: scroll; }


 /* 1.Over all styles
---------------------------------------------------------------*/
body {
	font: 12px Arial, Helvetica, sans-serif; /* to add line height of eg 18px use 13px/18px  */
	color: #000000;
	background-color:#bec7d6;
	background-image:url(../images/bodybg.gif); background-repeat:repeat-x;
	}
P, td, th, div { line-height: 17px; }
H1 { font: 24px/26px bold Arial, Helvetica, sans-serif; color:#08085a;}
H2, h2 a.anchor { font-size: 18px; font-weight: bold; color: #1d4699;  }
H3, h3 a.anchor { font-size: 16px; font-weight: bold; color: #505050; }
H4, h4 a.anchor { font-size: 14px; color: #08085a; line-height: 17px; }
H5, h5 a.anchor { font-size: 14px; color: #505050; line-height: 17px; }
H5 A { text-decoration: none; }
A { color: #08085a; text-decoration: underline; }
A:hover { color: #08085a; text-decoration: none; cursor:pointer; }
A.noline { color: #000; text-decoration: none; }
A.noline:hover { color: #000; text-decoration: none; }
A.anchor { text-decoration:none;}
.white { color:#FFFFFF; }
.float-l { float:left; }
.float-r { float:right; }
.clear { clear:both; }
.spacer a { padding-left:5px; padding-right:5px; }
.photo { border: 2px solid #000066; padding:1px; background-color:#FFFFFF; margin:0 10px 10px 0; float:left; }

/* 2.Layout
---------------------------------------------------------------*/

#logo { border:0; }

#content p, #content h1, #content h2, #content h3, #content h4, #content h5 { margin-bottom:15px; }
#content ul, #content ol { margin:0 0 15px 30px; }
#content ul { list-style-type:disc; }
#content table { margin-bottom:15px; }

#container {
  width: 1000px; 
  margin: 0 auto; 
  text-align: left;
  position:relative;
}


#branding {
	height: 140px;
	position:relative;
}

#brandingLinks { 
	position:absolute;
	right: 15px;
	top: 0px; 
	bottom: 10px;
	width:430px;
	}
	
.skype-logo { left: 47px;
    position: absolute;
    top: 35px; }
	
#brandingLinks p {
	color:#16344e;
	font-size:12px;
	margin:13px 0; padding:0;
	text-align:right;
	font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
	}
#brandingLinks p.large {
	font-size:22px; margin-top:10px; }	
#brandingLinks p.email, a.email {
	font-size:14px; color:#16344e; }	


.pics { height:225px; width:910px; padding:0; margin:0; overflow: hidden; }
.pics img { top:0; left:0; height:225px; width:910px; }

#contentContainer {
	width: 910px;
	padding:0 45px;
	background-color:#FFFFFF;
	display: block;
	clear: both;
	overflow: hidden;
}

#mainBanner { padding: 0; margin-bottom:20px; white-space:nowrap;  }
.breadcrumb {  margin-top:20px; }
.contact-quote { float:right; background-color:#dce5f4; border: 1px solid #2e4185;  padding:5px;  margin-bottom:20px; }
.contact-quote p, .contact-quote a, .breadcrumb p, .breadcrumb a  { color:#1453bb; }
#primary { width:60px; float: left; padding:70px 0 0 30px; }
#content { 
  width: 640px;
  float: left;
  padding:15px 20px 15px 0;
  background-color:#FFFFFF; 
}
.index-links { width:190px; float:left; margin-right:10px; padding:5px; text-align:center; }
.index-links ul { text-align:left; }
.innerColumn { width:42%; padding:5px; float:left; background-color:#F3F3F3; }
.innerColumn li { margin-left:20px; }
#content p { margin-bottom:10px; }
.icon-border { border-left: 1px solid #7fa5ff; border-right: 1px solid #7fa5ff; }

#column { 
  width: 220px; 
  float: right;
  margin:15px 0;
} 
.boxContainer {  margin-bottom:1px; display:block; text-decoration:none; width:220px; border-bottom: 1px solid #bec7d6; height:35px; line-height:35px;}
.boxContainer:hover { background-color:#bec7d6; margin-bottom:1px; display:block; text-decoration:none; }
.boxContainer p { color:#FFFFFF; font-size:12px; margin: 0 0 0 45px; font-weight:800; color:#08085a; line-height:35px; }
.boxContainer img { float:left; border: none; }
.boxed { background-color:#a1a1a9; padding:10px; min-height:70px; margin-bottom:12px; }
.boxed img { float:right; }
.boxed p { color:#FFFFFF; }
.boxed a { color:#FFFFFF; text-decoration:none; }
.boxed h4, .boxed h4 a { font-size:16px; color:#0c0c70; font-family:Georgia, "Times New Roman", Times, serif; font-weight:bold; }
.boxed strong { color:#0c0c70; }
#dividerLine { background-color:#FFFFFF; margin:0 auto; padding:0; height:20px; width:1000px; background-image:url(../images/dividerline.gif); background-position:center; background-repeat:no-repeat; }

.socialnetworking li, #content ul.socialnetworking { margin:0; padding:0; list-style:none; }

.events tr { background-color:#C2C9E3; }
.events tr:nth-child(2n) { background-color:#D2E1EB; }
.events td { padding:5px; }

.aside { float:right; width:230px; padding:15px; position:relative; margin: 0 -35px 10px 10px; background:url(/images/testimon-home-back.png) no-repeat 0 0; }

#content .testimonials { margin:20px 30px 0px 20px; padding:0; display:block; min-height:160px; padding:15px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; font-size:12px;  }
#content .testimonials li { list-style:none; display:none; position:relative; z-index:1; color:white; margin-right:12px; }
#content .testimonials li:first-child { display:block; }


.testimonials-page p { display:block; background:url(/images/testimon.png) no-repeat left top; min-height:80px; padding:0 0 0 40px; width:250px; float:left; margin:0 30px 0 0;}

#footer { 
  clear: both;
  padding: 10px 45px;
  background-color:#FFFFFF;
  margin-bottom:20px;
  display:block;
  overflow:auto;
  zoom:1;
} 
#footer p { margin: 5px 0 10px 0; line-height:normal; color:#08085a; font-size:11px; }
#footer a { color:#08085a; }
.small { font-size:10px; color:#7c0032; }
#footerImage { 
  float: left;
  padding-right: 20px;
}
#footerPrimary { 
  width: 690px;
  padding-left:0px;
  float: left;
    background-color:#FFFFFF;
}

#footerSecondary { 
  width: 220px; 
  float: right; 
  text-align:right;
  padding-right:40px;
  margin: 0px 0 10px 0;
} 

/* 3.Search
---------------------------------------------------------------*/
.searchform { margin: 0 0 0 10px; padding:0px; float:right }
input.searchfield { width: 140px; padding: 1px; border: 2px solid #ccc; font-size: 11px; background-color:#d2e1eb; color:#000000; }
input.searchbutton { background: #08085a; border: 0; padding:1px; color: #fff; font-weight: bold; font-size: 11px; }


/* 4.Menu
---------------------------------------------------------------*/
#menuWrap {	
	clear: both;
	position:relative;
	display:block;
	height:44px;
	background-image:url(../images/menubg.gif);	position:relative;
	z-index:1000;/* 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:1.5em; /* add line height  DONT USE HEIGHT */
	font-family:Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-size:12px;
	}
	
#menu { margin-left:25px; /* 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 */  
	}
	
#menu li.noborderr a { border-right:none;  } #menu li.noborderl a { border-left:none;  }/* Borders as appropriate */

#menu a{
	display:block;
	padding:0px 14px; /* set padding will affect padding on all a tags in menu */
	line-height:44px; /* set line height DONT use just height */
	color:#011c88;
	font-size:12px;
	text-decoration:none;
	border-right:1px solid #7a88c1; /* Borders as appropriate */
	}

#menu a:hover{
	background-color: #08085a;
	color:#fff;
	}

#menu li{
	float:left; /* IMPORTANT */
	position:relative;
	border:0;
	}

#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:164px; /* Width will need to be updated inline with all the padding on the menus */
	top:44px;
	background-color:#08085a;
	}

#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:normal;
    padding:8px 7px;
	color:#FFFFFF;
	}
	#menu li ul a:hover { background-color:#7a88c1; }

#menu ul ul{
	top:auto;
	}	

#menu li ul ul { /* styles for sub drop downs */
	left:164px; /* left needs to be the overall width of the main drop down  */
	margin:0;
	width:164px;
	}
#menu li ul ul a { 
	width:150px; /*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; }
 
/*a light colour on the borders of branded tables*/
.tabtitle{  font-weight: bold; color: #FFFFFF; background-color: #08085a; padding:5px; }

.tabletitle{ font-weight: bold; color: #FFFFFF; background-color: #08085a; padding:5px; }

/*Used if table has an extra heading.*/
.tabhead { font-weight: bold; color: #08085a; background-color: #FFFFFF; padding:5px; }

/*dark colour, matching nav bar or other strong colour in the site.*/
.tabbody { font-weight: normal; color: #000000; 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; }



/* 5.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: #08085a;
	border: solid 0px #08085a; }
.FormText {
	background-color: #FFFFFF;
	border: solid 1px #08085a;
	margin-bottom:5px;
	padding:2px; }
.FormTextRequired {
	background-color: #FFFFFF;
	border: solid 1px #7c0032;
	margin-bottom:5px;
	padding:2px; }

.v-divide {   display:block; width:1px; border-left: 1px solid #bec7d6; height:35px; }
