/* ----------------------------------------------------------
File: stirling-house.css
Site: wwww.stirlinghouseessex.co.uk
Author: Simon Smith - Focus Advertising
Version: 1.0
--------------------------------------------------------------*/

/* Imports ------------------------------------------*/ 
@import url("resets.css");
@import url("highslide.css");

/* Body settings ------------------------------------------*/ 
body {
background-color: #fff;
text-align: center;
font: 62.5% Verdana, Tahoma, Arial, sans-serif;
}

html { overflow: scroll; }

/* Container ------------------------------------------*/ 
#wrap {
width: 950px;
margin: 20px auto;
text-align: left;
border: 1px solid #aaa;
}

/* Used in case UAs decide to render strong & em differently */
strong { font-weight: bold; font-style: normal; } 
em { font-style: italic; } 

/* Clear fix ----------------------------------------*/
#header:after, #nav:after, #wrap:after, #questions li:after, #questions ul.finance-options:after {
content: ".";
display: block;
height: 0;
clear: both;
visibility: hidden;
}

/* Heading  ------------------------------------------*/
#header {
background: url(../images/site/grey-gradiant.gif) repeat-x top left;
padding: 20px 0;
}

#header h1 a {
float: left;
background: url(../images/site/main-logo.gif) no-repeat top left;
width: 250px;
height: 100px;
text-indent: -9999em;
margin-left: 20px;
}

#header h2 a {
float: right;
background: url(../images/site/pensions.gif) no-repeat top left;
width: 330px;
height: 31px;
text-indent: -9999em;
margin: 62px 20px 0 0;
}

/* Nav  ------------------------------------------*/
#nav {
background: url(../images/site/nav-bg.gif) repeat-x top left;
padding: 14px 20px 0 20px;
}

#nav li {
float: left;
font: 1.4em Arial, sans-serif;
text-align: center;
text-transform: uppercase;
}

#nav li a {
display: block;
color: #000;
padding: 8px 12px 8px;
}

/* ------------ Active Tab */
#nav li.current { background: transparent url(../images/site/nav-active-right.gif) no-repeat top right; }

#nav li.current a {
background: transparent url(../images/site/nav-active-left.gif) no-repeat top left;
color: #fff;
}

/* Content  ------------------------------------------*/
#content {
float: right;
width: 615px;
padding: 18px 10px 10px;
line-height: 1.4;
}

#content h3 {
font-size: 1.6em;
margin: 8px 0 25px;
font-weight: normal;
}

#content h4 {
font-size: 1.4em;
font-weight: normal;
margin: 5px 0;
}

#content p {
font-size: 1.2em;
margin-bottom: 8px;
}

#content ul {
font-size: 1.1em;
line-height: 1.5;
margin-bottom: 15px;
}

#content ul li li {
margin: 0 0 7px 35px;
list-style-type: disc;
}

#content a { color: #4f6aa3; }
#content a:hover { color: #b15863; text-decoration: underline; }

#content ul.questions li {
background: transparent url(../images/site/bullet_red.gif) no-repeat 3px 3px;
font-size: 1.4em;
padding-left: 22px;
margin: 5px 0;
}

/* CSS Menu Switcher  ------------------------------------------*/
:root body > div #three-years,
:root body > div #payment-made,
:root body > div #employer-know,
:root body > div #pay-national,
:root body > div #whole-fund,
:root body > div #basic-pension,
:root body > div #involved, 
:root body > div #cost, 
:root body > div #worth,
:root body > div #step1,
:root body > div #step2,
:root body > div #step3,
:root body > div #step4 {
display: none;
}

:root body > div #three-years:target,
:root body > div #payment-made:target,
:root body > div #employer-know:target,
:root body > div #pay-national:target,
:root body > div #whole-fund:target,
:root body > div #basic-pension:target,
:root body > div #involved:target,
:root body > div #involved:target, 
:root body > div #cost:target, 
:root body > div #worth:target,
:root body > div #step1:target,
:root body > div #step2:target,
:root body > div #step3:target,
:root body > div #step4:target {
display: block;
}

/* FAQ  ------------------------------------------*/
#content h3.faq-header {
background: transparent url(../images/site/faq.gif) no-repeat 3px 4px;
padding-left: 24px;
}

#content .box-hide h4 {
font-weight: normal;
margin: 15px 0;
}

ul#links a { color: #405aaf; }

ul#links a:hover {
color: #6077c0;
text-decoration: underline;
}

ul#links {
font-size: 1.6em;
margin: 15px 0 30px;
padding-bottom: 30px;
border-bottom: 2px solid #ccc;
}

/* Example  ------------------------------------------*/
#content ul.example-detail { margin: 20px 0; }

#content ul.example-detail li {
background: transparent url(../images/site/bullet_red.gif) no-repeat 3px 3px;
font-size: 1.2em;
padding-left: 22px;
margin: 5px 0;
}

#content ul ul li.seperate {
list-style-type: none;
margin: 15px 0 0 42px;
}

/* Contact Us  ------------------------------------------*/
#contact label {
font-size: 1.1em;
display: block;
margin: 14px 0 2px;
}

#contact textarea {
width: 400px;
height: 250px;
padding: 5px;
}

#contact #submit { margin: 25px 0 15px; }
#contact span.random { padding-left: 15px; letter-spacing: 0.8px; font-size: 1.1em; }
#contact p.error { font-weight: bold; }

#contact p.wrong {
background: transparent url(../images/site/cross.gif) no-repeat 3px 1px;
padding-left: 24px;
color: #a60c0c;
}

#content h4.success {
background: transparent url(../images/site/tick.gif) no-repeat 3px 2px;
padding-left: 24px;
margin-bottom: 25px;
}

dl.results { font-size: 1.2em; }

dl.results dt {
margin-bottom: 2px;
font-weight: bold;
}

dl.results dd { margin-bottom: 12px; }

/* Questionnaire  ------------------------------------------*/
#questions { font-size: 1.1em; }

#questions legend {
font-size: 1.4em;
font-weight: bold;
padding: 5px 0 20px;
}

#questions label {
clear: both; 
float: left;
width: 200px;
display: block;
margin-right: 10px;
}

#questions input { clear: right; }

#questions li {
border-bottom: 1px solid #ddd;
margin: 8px 0;
padding: 10px 0;
}

#questions li ul li {
border: none;
list-style-type: none;
}

#questions li.radio span { margin-left: 15px; }

/* ------------ Date drop downs */
#questions li.dates select { margin-right: 10px; }

/* ------------ Pound sign */
#questions li.earnings span { margin-right: 5px; }
#questions li.earnings input { width: 80px; }

/* ------------ Postcode */
#questions li.postcode input { width: 70px; }

/* ------------ Years & months */
#questions li.duration input {
width: 25px;
margin-right: 10px;
}

/* ------------ Finance checkboxes */
#questions ul.finance-options li {
margin: 0;
float: left;
width: 200px;
font-size: 1em;
}

/* ------------ Error message */
#questions span.error {
color: red;
margin-left: 8px;
}

/* ------------ Warning colours */
#questions li.low {
background-color: #b0e094;
padding: 4px;
}

#questions li.medium {
background-color: #e09b2f;
padding: 4px;
}

#questions li.high {
background-color: #de4623;
padding: 4px;
}

#questions li.radio p.info {
font-size: 0.85em;
margin-top: 10px;
}

/* Calculator  ------------------------------------------*/
#calculator { padding: 25px 15px;  }

#calculator h1 {
background: transparent url(../images/site/calculator.gif) no-repeat -2px 4px;
width: 200px;
font-size: 1.4em;
padding-left: 8px;
letter-spacing: 0.8px;
margin: 0 auto 25px;
font-weight: normal;
}

#calculator li {
margin: 10px 0;
padding: 5px 5px 12px 5px;
border-bottom: 1px solid #ddd;
}

#calculator label {
clear: both; 
float: left;
width: 100px;
display: block;
margin-right: 10px;
}

#calculator input {
width: 100px;
clear: right;
border: 1px solid #aaa;
padding: 2px;
}

#calculator input:focus { border: 1px solid #0f457d; }
#calculator label.total { color: #d87a85; }

#calculator a {
color: #555;
background-color: #eee;
border: 1px solid #aaa;
font-size: 0.9em;
padding: 5px 10px;
margin: 20px auto 0;
width: 60px;
display: block;
}

#calculator a:hover {
color: #0f457d;
background-color: #cfe4fa;
border: 1px solid #0f457d;
}

/* Sidebar  ------------------------------------------*/
#sidebar {
float: left;
width: 285px;
padding: 30px 0 0 20px;
}

#sidebar li {
width: 280px;
margin-bottom: 22px;
text-align: center;
height: 110px;
}

#sidebar li h3 {
font-size: 2.1em;
padding: 10px 10px 5px 10px;
font-weight: normal;
}

#sidebar li h3 a {
width: 100%;
color: #fff;
display: block;
padding: 10px 0;
}

#sidebar li h3 a:hover { color: #cbe5f9; }
#sidebar img { margin: 30px 0 45px; }

/* ------------ Top sidebox */
#sidebar li.shaded {
color: #fff;
background: transparent url(../images/site/box-gradiant.gif) no-repeat center left;
}

#sidebar li.shaded h3 a { background: transparent url(../images/site/arrow-right.gif) no-repeat 15px 17px; }
#sidebar li.shaded p { font-size: 1.2em; }

/* ------------ Bottom sidebox */
#sidebar li.box {
color: #fff;
background: transparent url(../images/site/box-gradiant-light.gif) no-repeat center left;
}

#sidebar li.box h3 a { background: transparent url(../images/site/arrow-right.gif) no-repeat 17px 17px; }

#sidebar li.box p {
width: 200px;
font-size: 1.1em;
margin: 0 auto;
}

/* ------------ Gold sidebox (homepage only) */
#sidebar li.gold {
color: #000;
background: transparent url(../images/site/box-gradiant-gold.gif) no-repeat center left;
}

#sidebar li.gold h3 a {
background: transparent url(../images/site/arrow-right.gif) no-repeat 17px 17px; 
color: #000;
}

#sidebar li.gold h3 a:hover { color: #555; }

#sidebar li.gold p {
width: 200px;
font-size: 1.1em;
margin: 0 auto;
}

/* ------------ Additional sidebox */
#sidebar li.age {
color: #fff;
background: transparent url(../images/site/box-gradiant-light.gif) no-repeat center left;
}

#sidebar li.age h3 a { 
background: transparent url(../images/site/arrow-right.gif) no-repeat 8px 12px; 
font-size: 0.7em;
}

#sidebar li.age p {
width: 200px;
font-size: 1.1em;
margin: 0 auto;
}

/* ------------ Paypal link */
#sidebar li.paypal {
color: #000;
background: transparent url(../images/site/box-gradiant-lightgr.gif) no-repeat center left;
}

#sidebar li.paypal h3 { 
background: transparent url(../images/site/arrow-right.gif) no-repeat 8px 12px; 
font-size: 1.8em;
margin: 10px 0 -10px;
}

/* Blockquote  ------------------------------------------*/
#footer {
margin: 0 30px;
clear: both;
border-top: 2px solid #ccc;
}

#footer p.dyk {

line-height: 1.6;
margin: 0 auto;
padding: 25px 25px 25px;
font-size: 1.6em;
color: #101010;
font-weight: bold;
text-align: center;
background-color:#e9c365;
}

#footer p.footerDetails {
	font-size:8px;
}



#footer p { margin: 10px 25px; }

.disclosure {
font-size: 1.4em;
}

#footer a { color: #4f6aa3; }
#footer a:hover { color: #b15863; text-decoration: underline; }

#footer p.footlinks {float:right;}