/* -------------------------------------------------------------------------

	Strategic Screen Style Sheet
	last update: 31 August 2011
	author: Andy Gosling @ Antenna Industries
	website: www.antennaindustries.co.uk
	email: hello@antennaindustries.co.uk

------------------------------------------------------------------------- */

/* colour palette ----------------------------------------------------------

dark blue: 			#003B73
light blue: 		#91B8D6
light blue text: 	#7395AF
grey:				#DBDBDB
*/


/* !Eric Meyer's css reset (http://meyerweb.com/eric/tools/css/reset/) -- */

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

/* end css reset */


/* !LAYOUT -------------------------------------------------------------- */

body {
	font-size: 13px;
	line-height: 20px;
	font-family: "Lucida Grande", Verdana, Arial, sans-serif;
	color: #444;
	background-color: #FFF;
}

#wrapper {
	width: 960px;
	margin: 0 auto;
}

.clear {
	clear: both;
}

/* !TYPOGRAPHY ---------------------------------------------------------- */

h1, h2, h3, h4 {
	font-weight: normal;
	color: #7395AF;
}

h1 {
	font-size: 45px;
	line-height: 50px;
	margin: 20px 0 10px 70px;
}

h2 {
	font-size: 30px;
	line-height: 40px;
	margin: 40px 0 20px 0;
}

h3 {
	font-size: 20px;
	line-height: 25px;
	color: #999;
	margin: 20px 0 10px 0;
}

h4 {
	font-size: 14px;
	font-weight: bold;
	margin: 20px 0 10px 0;
}

#content p {
	margin: 10px 0;
}

#content p.small {
	font-size: 12px;
	margin: 0 0 20px 0;
	color: #555;
}

#content p.intro {
	font-size: 15px;
}

#content p.pullquote {
	color: #7395AF;
	float: left;
	font-size: 15px;
	margin: 0 20px 10px -60px;
	text-align: right;
	width: 200px;
}

#content ol {
	margin-left: 20px;
	list-style: decimal;
}

#content li {
	margin: 0 0 10px 0;
	background: url(../images/bullet-arrow.gif) no-repeat 0 0.6em;
	padding-left: 15px;
}

#about #content p.pullquote {
	text-align: left;
	width: 370px;
	margin-right: 80px;
}

.services li {
	background: url(../images/bullet-arrow.gif) no-repeat 0 0.6em;
	padding-left: 15px;
}

.hr {
	border-top: 1px solid #DBDBDB;
	margin: 20px 0;
}

.hr hr {
	display: none;
}

a:link, a:visited {
	color: #003B73;
	text-decoration: none;
	padding: 0 1px;
	border-bottom: 1px solid #DDD;
}

a:hover, a:active {
	color: #FFF;
	background-color: #91B8D6;
	border-bottom: 1px solid #91B8D6;
}

/* !TOPLINK ------------------------------------------------------------- */

#top {
	position: absolute;
	top: -100px;
	left: -100px;
}

/* !NAVIGATION ---------------------------------------------------------- */

#nav-wrap {
	min-height: 34px;
	background-color: #91B8D6;
}

#navigation {
	width: 880px;
	min-height: 34px;
	margin: 0 auto;
	padding: 0 10px 0 70px;
	background: url(../images/nav_bg.gif) repeat-y;
}

#navigation ul {
	background: url(../images/nav_divide.gif) repeat-y top left;
	min-height: 34px;
	padding-left: 1px;
	float: left;
}

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

#navigation li {
	font-size: 17px;
	line-height: 20px;
	float: left;
	min-height: 34px;
}

#navigation li a:link,
#navigation li a:visited {
	background: #91B8D6 url(../images/nav_divide.gif) repeat-y top right;
	border: none;
	color: #FFF;
	display: block;
	min-height: 24px;
	padding: 5px 12px;
}

#navigation li a:hover,
#navigation li a:active {
	background-color: #B2CDE2;
}

#navigation p {
	background: url(../images/telephone.gif) no-repeat 12px 8px;
	float: right;
	margin: 0;
	min-height: 34px;
	text-indent: -999em;
	width: 220px;
}

/* selected navigation items */

#home #navigation #navHome a,
#about #navigation #navAbout a,
#services #navigation #navServices a,
#five-steps #navigation #navSteps a,
#staff #navigation #navStaff a,
#contact #navigation #navContact a {
	background-color: #FFF;
	background-image: none;
	color: #003B73;
	cursor: default;
}

/* !SUB NAVIGATION ------------------------------------------------------ */

#sub-nav {	
	background: url(../images/h_rule.gif) no-repeat center bottom;
}

#sub-nav ul {
	margin: 0 auto;
	margin-left: 70px;
	padding-left: 5px;
	background: url(../images/subnav-divide.gif) no-repeat 0 0;
	height: 30px;
}

#sub-nav li {
	font-size: 14px;
	line-height: 20px;
	float: left;
	padding: 7px 0;
	margin-right: 5px;
	background: url(../images/subnav-divide.gif) no-repeat top right;
}

#sub-nav li a:link, #sub-nav li a:visited {
	display: block;
	margin-right: 5px;
	border: none;
	color: #003B73;
	text-decoration: none;
	padding: 0 5px 1px 5px;
}

#sub-nav li a:hover, #sub-nav li a:active {
	color: #FFF;
	background-color: #91B8D6;
}

/* !LOGO ---------------------------------------------------------------- */

#home h1,
p.logo {
	height: 125px;
	width: 100%;
	background: url(../images/logo-head.gif) no-repeat 0 34px;
	margin: 0;
	text-indent: -999em;
}

/* !BANNER -------------------------------------------------------------- */

#banner {
	height: 186px;
	width: 880px;
	margin: 0 0 20px 70px;
	background-repeat: no-repeat;
}

#home #banner {
	background-image: url(../images/banner-home.jpg);
	margin-bottom: 40px;
}

#about #banner {
	background-image: url(../images/banner-about.jpg);
}

#services #banner {
	background-image: url(../images/banner-services.jpg);
}

#five-steps #banner {
	background-image: url(../images/banner-5steps.jpg);
}

#staff #banner {
	background-image: url(../images/banner-staff.jpg);
}

#contact #banner {
	background-image: url(../images/banner-contact.jpg);
}

#banner p {
	float: right;
	height: 186px;
	width: 220px;
	background: #91B8D6 url(../images/banner-title-home.gif) no-repeat 14px 145px;
	margin: 0;
	text-indent: -999em;
}

/* !CONTENT ------------------------------------------------------------- */

#content {
	margin: 0 0 0 0;
}

#home #content {
	background: url(../images/v_rule.gif) repeat-y 470px 0;
}

#primary-content {
	margin: 0 0 0 70px;
	float: left;
}

#secondary-content,
#tertiary-content {
	margin: 0 0 0 20px;
	float: left;
}

#home #primary-content {
	width: 380px;
	padding-right: 20px;
}

#home #secondary-content,
#home #tertiary-content {
	width: 220px;
}

#home #content #secondary-content li {
	margin: 0 0 5px 0;
}

/* !BREADCRUMB ---------------------------------------------------------- */

#content p.breadcrumb {
	font-size: 11px;
	margin: 10px 0 10px 70px !important;
	color: #666;
}

/* !PANELS ------------------------------------------------------------- */

/* guidance */

h2.guidance {
	background: url(../images/h2_guidance.jpg) no-repeat;
	height: 80px;
	width: 220px;
	text-indent: -999em;
	margin-top: 10px;
}

/* meeting panel */

#content .meeting-panel {
	background-color: #91B8D6;
	padding-bottom: 1px;
	margin-bottom: 20px;
}

#content .meeting-panel h2 {
	height: 132px;
	background: url(../images/meeting-panel-head.jpg) no-repeat 0 0;
	text-indent: -999em;
	margin: 10px 0;
}

#content .meeting-panel p {
	padding: 0 10px;
	margin: 10px 0;
	color: #FFF;
}

#content .meeting-panel p.tel {
	font-size: 26px;
	line-height: 20px;
	margin-top: -1px;
}

/* 5 steps panel */

.fivesteps-panel {
	background: url(../images/5steps-panel-bg.jpg) no-repeat 0 0;
	width: 220px;
	height: 138px;
	margin-bottom: 20px;
	position: relative;
}

.fivesteps-panel h2 {
	margin-top: 0;
	text-indent: -999em;
}

.fivesteps-panel p {
	position: absolute;
	top: -999em;
}


.fivesteps-panel a:link,
.fivesteps-panel a:visited {
	background: url(../images/5steps-panel-bg.jpg) no-repeat 0 0;
	display: block;
	padding: 0;
	width: 220px;
	height: 138px;
	border: none;
}

.fivesteps-panel a:hover,
.fivesteps-panel a:active {
	background-position: -220px 0;
}

/* services panels */

ul#services-panels {
	margin-left: 69px;
	float: left;
}

ul#services-panels li {
	width: 171px;
	height: 55px;
	float: left;
	margin-right: 6px;
	margin-bottom: 40px;
}

ul#services-panels li a:link,
ul#services-panels li a:visited {
	width: 171px;
	height: 55px;
	display: block;
	border: 1px solid #C8DBEA;
	background-color: #FFF;
	padding: 0;
	background: url(../images/services-buttons.jpg) no-repeat 0 0;
	text-indent: -999em;
}

ul#services-panels li a:hover,
ul#services-panels li a:active {
	width: 171px;
	height: 55px;
	display: block;
	border: 1px solid #91B8D6;
	background-position-y: -56px !important;
}

ul#services-panels #service-pension a:link,
ul#services-panels #service-pension a:visited {
	background-position: -177px 0;
}

ul#services-panels #service-planning a:link,
ul#services-panels #service-planning a:visited {
	background-position: -354px 0;
}

ul#services-panels #service-protection a:link,
ul#services-panels #service-protection a:visited {
	background-position: -531px 0;
}

ul#services-panels #service-ethical a:link,
ul#services-panels #service-ethical a:visited {
	background-position: -708px 0;
}

/* !ABOUT US ------------------------------------------------------------ */

#about #content {
	background: url(../images/v_rules_about.gif) no-repeat 730px 0;
}

#about #primary-content {
	width: 640px;
}

#about #secondary-content{
	width: 200px;
	margin-left: 40px;
}

#about #primary-content .column {
	width: 300px;
	float: left;
	padding: 0 20px 10px 0;
}


#about #primary-content .specialism {
	padding-top: 5px;
	padding-bottom: 30px;
}

#about #primary-content .specialism img {
	float: left;
}

#about #primary-content .column h3 {
	margin-top: 0;	
}

#about #primary-content .specialism h3 {
	margin: 0 0 10px 120px;	
}

#about #primary-content .specialism p {
	margin: 10px 0 10px 120px;	
}

#about #primary-content p {
	margin-right: 10px;
}

#about #secondary-content p,
#about #tertiary-content p {
	font-size: 13px;
	line-height: 20px;
	margin: 20px 10px 20px 0;
}

#about .env {
	background: url(../images/acorn_leaf.jpg) no-repeat bottom right;
	padding-bottom: 85px;
}

#about.landing #secondary-content h2 {
	font-size: 24px;
	line-height: 30px;
	margin: 5px 0 20px 0;
}

/* !staff */

#about.staff #content {
	background-image: none;
}

#about.staff #primary-content {
	width: 400px;
	padding-top: 10px;
}

#about.staff #secondary-content {
	width: 400px;
	padding-top: 10px;
	margin: 0 0 0 80px;
}

#about.staff #content img {
	float: left;
}

#about.staff #content h2 {
	margin: 0 0 0 120px;
	font-size: 24px;
}

#about.staff #content h3,
#about.staff #content ul {
	margin-left: 120px;
}

#about.staff #content h3 {
	margin-top: 0;
	font-size: 13px;
	line-height: 20px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}

#about.staff #content p {
	margin: 10px 0 10px 120px;
}

/* !SERVICES ------------------------------------------------------------ */

#services #primary-content {
	width: 640px;
}

#services #content .service-type {
	border-bottom: 1px solid #dbdbdb;
	margin-bottom: 20px;
	padding: 0 0 20px 120px;
	background-repeat: no-repeat;
	background-position: 0 0;
}

#services .servicetype {
	width: 640px;
}

#services .servicetype h3 {
	font-size: 15px;
	line-height: 20px;
	margin: 0 0 10px 0;
	color: #7395AF;
}

#services .servicetype p {
	margin: 0 0 10px 0;
}

#services .servicetype ul {
	margin-left: 20px;
}

#services .servicetype li {
	background: url(../images/bullet-arrow.gif) no-repeat 0 0.6em;
	padding-left: 15px;
	margin: 10px 0;
}

#services #primary-content .investments {
	background-image: url(../images/icon-investments.jpg);
}

#services #primary-content .pension-provision {
	background-image: url(../images/icon-pensions.jpg);
}

#services #primary-content .planning-advice {
	background-image: url(../images/icon-planning.jpg);
}

#services #primary-content .protection {
	background-image: url(../images/icon-protection.jpg);
}

#services #primary-content .ethical-investment {
	background-image: url(../images/icon-ethical.jpg);
	border-bottom: none;
}

#services #nav_categories h2 {
	font-size: 24px;
	line-height: 30px;
	margin-bottom: 10px;
}

#services h2 {
	margin: 0 0 5px 0;
	font-size: 16px;
}

#services #primary-content .nav_categories li {
	background: none;
	padding-left: 0;
}

#services #secondary-content {
	width: 220px;
}

#services .serv-intro {
	margin-bottom: 40px;
}

/* slider */

#services .slider {
	padding-bottom: 40px;
}

#services .slider h2 {
	font-size: 18px;
	border-top: 1px solid #DBDBDB;
	padding-top: 8px;
	background: url(../images/read-more.gif) no-repeat 557px 11px;
	cursor: pointer;
}

#services .slider h3 {
	font-size: 14px;
	margin-top: 20px;
}

#services .slider h2.active {
	background-image: url(../images/close-button.gif);
}

#services .slider .servicetype {
	padding-bottom: 20px;
}

/* investments */

#services .investments {
	background: url(../images/img-investments.jpg) no-repeat bottom right;
}

#services .investments #secondary-content {
	padding-bottom: 130px;
}

/* pension provision */

#services .pension-provision {
	background: url(../images/img-pension.jpg) no-repeat bottom right;
}

#services .pension-provision #secondary-content {
	padding-bottom: 180px;
}

/* planning advice */

#services .planning-advice {
	background: url(../images/img-planning.jpg) no-repeat bottom right;
}

#services .planning-advice #secondary-content {
	padding-bottom: 180px;
}

/* protection */

#services .protection {
	background: url(../images/img-protection.jpg) no-repeat bottom right;
}

#services .protection #secondary-content {
	padding-bottom: 180px;
}

/* ethical */

#services .ethical {
	background: url(../images/img-ethical.jpg) no-repeat bottom right;
}

#services .ethical #secondary-content {
	padding-bottom: 220px;
}


/* services side panel */

#secondary-content .service-panel h2 {
	font-size: 21px;
	line-height: 30px;
	background-color: #91B8D6;
	color: #FFF;
	margin-bottom: 0;
	padding: 5px 6px 3px;
}

#secondary-content .service-panel ul {
	width: 218px;
}

#secondary-content .service-panel li {
	background-image: none;
	margin: 0;
	padding-left: 0;
}

#secondary-content .service-panel li a {
	background-position: 0 3px;
	background-repeat: no-repeat;
	font-size: 14px;
	line-height: 20px;
	display: block;
	min-height: 35px;
	width: 150px;
	padding: 18px 0 0 68px;
	border: 1px solid #DBDBDB;
	border-top: none;
}

#secondary-content .service-panel li a:link,
#secondary-content .service-panel li a:visited {
	background-color: #FFF;
	color: #7395AF;
}

#secondary-content .service-panel li a:hover,
#secondary-content .service-panel li a:active {
	background-color: #FFFFFF;
	color: #003B73;
}

#secondary-content .service-panel li.investments a {
	background-image: url(../images/icon-investment-small.jpg);
}

#secondary-content .service-panel li.pension-provision a {
	background-image: url(../images/icon-pension-small.jpg);
}

#secondary-content .service-panel li.planning-advice a {
	background-image: url(../images/icon-planning-small.jpg);
}

#secondary-content .service-panel li.protection a {
	background-image: url(../images/icon-protection-small.jpg);
}

#secondary-content .service-panel li.ethical-investment a {
	background-image: url(../images/icon-ethical-small.jpg);
}

/* ! current panel */

.planning-advice li.planning-advice a,
.investments li.investments a,
.pension-provision li.pension-provision a,
.protection li.protection a,
.ethical li.ethical-investment a {
 	color: #003B73 !important;
}

/* !FIVE STEPS ---------------------------------------------------------- */

#five-steps #primary-content {
	width: 520px;
}

#five-steps #secondary-content {
	width: 340px;
	margin: 0 0 0 20px;
}

#five-steps h2 {
	margin: 20px 0 10px 0;
}

#five-steps #secondary-content img {
	margin: 23px 0 10px 0;
}

#five-steps #secondary-content h2 {
	font-size: 20px;
	line-height: 30px;
	text-align: center;
}

/* !CONTACT ------------------------------------------------------------- */

#contact #primary-content {
	width: 400px;
}

#contact .intro {
	margin-bottom: 20px;
}

#contact #secondary-content {
	width: 400px;
	margin: 0 0 0 80px;
}

#contact #content img {
	float: left;
}

#contact h2 {
	border-top: 1px solid #BDBDBD;
	padding-top: 20px;
}

#contact  p.small {
	margin: 0 0 10px 0;
}

#contact #map {
	width: 398px;
	height: 398px;
	border: 1px solid #dbdbdb;
}

#contact .address span {
	color: #7395AF;
}

/* enquiry form */

#enquiryform {
	width: 400px;
	float: left;
	padding-bottom: 20px;
}

#enquiryform .highlight {
	color: #D0431D;
}

#enquiryform p {
	margin: 0 0 3px 0;
	clear: left;
}

#enquiryform h2 {
	margin-top: 0;
}

#enquiryform label {
	width: 100px;
	display: block;
	float: left;
	clear: left;
}

#enquiryform input {
	width: 290px !important;
	border: 1px solid #CCC;
	margin: 0;
	font-size: 1em !important;
	padding: 3px 4px !important;
	color: #333;
	background-color: #F5F5F5;
}

#enquiryform textarea {
	font-family: "Lucida Grande", "Trebuchet MS", Verdana, Arial, sans-serif;
	width: 290px;
	border: 1px solid #CCC;
	margin: 0;
	font-size: 1em;
	padding: 1px 4px;
	color: #333;
	background-color: #F5F5F5;
}

#enquiryform input:focus,
#enquiryform textarea:focus {
	border: 1px solid #666;
	color: #000;
	background-color: #FFF;
}

#enquiryform .send input {
	width: auto !important;
	height: auto !important;
	margin: 0;
	padding: 0 !important;
	border: none;
	float: right;
}

#enquiryform label.error {
	clear: left;
	color: #D0431D;
	width: auto;
	padding: 0 0 5px 100px;
	font-size: 11px;
}

.thankyou .intro {
	border-bottom: 1px solid #dbdbdb;
	padding-bottom: 20px;
	margin-bottom: 20px !important;
}

/* !FOOTER -------------------------------------------------------------- */

#footer {
	clear: both;
	width: 950px;
	padding: 40px 0 0 0;
	background: url(../images/footer_rule.gif) no-repeat 70px 0;
	margin-top: 40px;
	float: left;
}

#footer .contactinfo p {
	margin: 0 0 10px 70px;
}

#footer .contactinfo {
	float: left;
	width: 350px;
	background: url(../images/logo-footer.gif) no-repeat 36px 0;
	padding: 40px 0 0 0;
}

#footer .contactinfo p {
	margin-left: 70px;
}

#footer .legal {
	color: #999;
	float: right;
	margin-right: 10px;
	width: 580px;
}

#footer .legal p {
	font-size: 11px;
	margin: 0 0 10px 0;
}

#toplink {
	clear: both;
	float: right;
	background-color: #91B8D6;
	margin: 0;
}

#toplink a:link,
#toplink a:visited {
	background-color: #91B8D6;
	display: block;
	border: none;
	padding: 2px 8px;
	font-size: 12px;
	line-height: 20px;
	color: #FFF;
}

#toplink a:hover,
#toplink a:active {
	background-color: #003B73;
}
