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

Title : 
Author : Chris Munn / chris.munn@gforces.co.uk / G-Forces Web Management Ltd

Type: Screen, Projection

Description : Screen and projection stylesheet for STA Graydon site

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

/* COMMON AND GLOBAL */
body { font:62.5%/1.6 verdana, arial, helvetica, sans-serif; margin:0; padding:0; background:#ffffff url(../images/layup/bodyBg.gif) repeat-x; color:#000000; text-align:center; }
/*  This font sizing is for standards based browsers (firefox, opera, mozilla) that can re-size text.  
Declaring the font size in pixels makes it more consistent across browsers. */
td, textarea, input, select { font:100% arial, verdana, helvetica, sans-serif; }
html>body td, html>body textarea, html>body input, html>body select { font-size:11px; }
/* some browsers don't inherit the font into tables or textareas! */

/* ----- IDS ----- */
#container { width:954px; margin: 5px auto 0px auto; text-align:left; font-size:110%; line-height: normal; }   
#printHeader { display:none;}

#header { height: 99px; position: relative; }
#header #logo { position: absolute; top: 15px; left: 0px; }
#header #contactDetails { position: absolute; top: 61px; right: 0px; }
#header #globalSelect { position: absolute; top: 8px; right: 0px; background: url(../images/layup/globalOfficesBg.gif) no-repeat top left; padding-left: 72px; height: 38px; width: 280px; }
#header #globalSelect label { position: relative; top: 9px; width: 90px; }
#header #globalSelect select { width: 187px; position: relative; top: 7px; }

/* ----- HOME JUMPS ----- */
#homeJumps { width: 954px; height: 478px; position: relative; margin-bottom: 15px; }
#homeJumps .homeJumpBox a { padding: 10px; color: #FFFFFF; text-decoration: none; font-weight: normal; display: block;  background: url(../images/layup/homeJumpBg.png); width: 178px; height: 91px; position: absolute; }
#homeJumps #homeJump1 a { top: 343px; left: 27px; }
#homeJumps #homeJump2 a { top: 343px; left: 262px; }
#homeJumps #homeJump3 a { top: 343px; left: 496px; }
#homeJumps #homeJump4 a { top: 343px; left: 731px; }
#homeJumps .homeJumpBox { position: relative; z-index: 99999999; }
#homeJumps #mainImage { position: absolute; z-index: 1; }
#homeJumps .homeJumpBox .boxTitle { display: block; font-size: 24px; padding-bottom: 5px; }
#homeJumps .homeJumpBox .boxText { display: block; padding-bottom: 3px; }
#homeJumps .homeJumpBox .boxMore { display: block; font-weight: bold; position: absolute; top: 92px; left: 10px; }
#homeJumps #videoDiv { width: 954px; height: 325px; background: #000; position: absolute; top: 0px; left: 0px; z-index: 999999; display: none; }
#homeJumps #videoDiv .btnClose { position: absolute; top: 10px; right: 10px; }
#homeJumps #videoDiv #theFlash { padding: 20px 20px 20px 230px; }

/* ----- MAIN COLUMN ----- */
#mainCol { background: url(../images/layup/dotsH.gif) repeat-x bottom left; margin: 0px 238px 15px 238px; padding-bottom: 10px; width:470px; }

/* ----- LEFT COLUMN ----- */
#leftCol { float: left; width: 222px; }
#leftCol #contactAddress { padding: 10px 0px 10px 0px; background: #006699; color: #FFF; margin-bottom: 15px; }
#leftCol #contactAddress a { color: #FFF; font-weight: normal; text-decoration: none; }
#leftCol #contactAddress .box { padding: 4px 5px 6px 5px; margin: 0px 10px 0px 10px; background: url(../images/layup/addressBorder.gif) repeat-x left bottom; }
#leftCol #contactAddress .title { font-size: 15px; font-weight: bold; }

/* ----- RIGHT COLUMN ----- */
#rightCol { float: right; width: 222px; margin-bottom: 15px; }
#rightCol #pageQuotation { padding: 20px 15px 20px 15px; background: #79c7f3; margin-top: 7px; color: #FFFFFF; font-size: 12px; font-weight: bold; text-align: justify; }
#rightCol #pageQuotation .quote { padding: 0px 0px 10px 0px; }
#rightCol #pageQuotation .quoteBy { text-align: left; font-size: 11px; font-weight: normal; }


/* ----- CMS IMAGE ----- */
.internalImage { float: right; margin: 0px 0px 15px 15px; }
.internalImage img {}

/* ----- LIST ----- */
#list {}
#list .listItem {}
#list .listItem a {}
#list .listItem .thumb {}
#list .listItem .thumb .frame {}
#list .listItem .title {}
#list .listItem .description {}
#list .listItem .btn {}

/* ----- BOX LIST ----- */
#boxList {}
#boxList .box {}
#boxList .box a {}
#boxList .box .thumb {}
#boxList .box .thumb .frame {}
#boxList .box .title {}

/* ----- GLOBAL CLASSES ----- */
.clear { clear:both; display: block; }
.clearSmall { clear: both; display: block; height: 0; line-height: 0; font-size: 0; }
.hide { display:none; }
.show { display:block; }
.printShow { display:none; }
.printHide { display:block; }
.float_left { float:left !important; }
.float_right { float:right !important; }
.align_left { text-align:left !important; }
.align_center { text-align:center !important; }
.align_right { text-align:right !important; }
.align_justify { text-align:justify !important; }
.align_bottom { vertical-align:bottom !important; }
.image_right { float:right; margin:0 0 15px 15px; }
.image_left { float:left; margin:0 15px 15px 0; }
.image_center { margin:0 auto; }
.hand { cursor:pointer; }
.seo {text-decoration:none;font-weight:normal;}
.ieLinkFix { background: url(../images/layup/ie6LinkFix.gif); }

/* ----- HEADINGS & PARAGRAPHS ----- */
h1, h2, h3, h4, h5, h6 { margin:0; padding:0 0 15px 0; font-size:100%; font-weight:bold;}
h1 { font-size: 16px; }

/* ----- TOP NAVIGATION ----- */
#primaryNav { margin: 0px 0px 15px 0px; position: relative; z-index: 99999; background: url(../images/layup/dotsH.gif) bottom left repeat-x;  padding-bottom: 15px; }
#primaryNav ul { list-style: none; margin: 0px; padding: 0px; width: 954px; height: 36px; background: #CFCFCF url(../images/layup/primaryNavBg.gif) no-repeat; }
#primaryNav li { padding: 0px; margin: 0px; float: left; background: url(../images/layup/navSpacer.gif) no-repeat top right; padding-top: 1px; }
#primaryNav li a { display: block; text-decoration: none; padding: 10px 33px 10px 33px; font-size: 12px; color: #000000; font-weight: normal; border-left: 1px solid #fff; }
#primaryNav li a.firstItem { border: none; }
#primaryNav li a.lastItem { background: url(../images/layup/navActive.gif) repeat-x top left; color: #FFF; font-weight: bold; }
#primaryNav li a:hover,
#primaryNav li.active a { background: url(../images/layup/navActive.gif) repeat-x top left; }

/* ----- SECONDARY NAVIGATION ----- */
#secondaryNav { margin-bottom: 15px; }
#secondaryNav ul { list-style: none; margin: 0; padding: 0; }
#secondaryNav li { background: #ecf7fd; font-size: 11px; float: left; width: 222px; }
#secondaryNav li a { display: block; font-weight: normal; text-decoration: none; border-bottom: 1px solid #bee4f9; padding: 8px 10px 8px 10px; float: left; width: 202px; }
#secondaryNav li.pageTitle { font-size: 14px; font-weight: bold; background: #79c7f3; margin-bottom: 3px; }
#secondaryNav li.pageTitle a { display: block; font-weight: bold; padding: 8px 10px 8px 10px; }
#secondaryNav li ul li a { padding: 8px 10px 8px 20px; width: 192px; }
#secondaryNav li.active a { background: #bfe4f9; }
#secondaryNav li.subPage a { background: #ecf7fd; }
#secondaryNav li a:hover { background: #bfe4f9; }

/* ----- DROPDOWN NAV ----- */
#primaryNav ul li  ul {	left: -999em; position: absolute; }
#primaryNav ul li:hover ul,
#primaryNav ul li.sfhover ul { left: auto; padding: 0px 0px 0px 0px; margin: 0px 0px 0px 0px; display: block; width: 200px; border-top: 1px solid #bbe0e3; }
#primaryNav ul li:hover ul li,
#primaryNav ul li.sfhover ul li { display: block; padding: 4px 0px 0px 0px;	margin: 0px; background: #FFFFFF; width: 200px; height: auto; border-bottom: 1px solid #bbe0e3;  }
#primaryNav ul li:hover ul li a,
#primaryNav ul li.sfhover ul li a {	padding: 0px 5px 5px 10px; margin: 0px; color: #000000; background: none; font-size: 13px; }
#primaryNav ul li:hover ul li a:hover,
#primaryNav ul li.sfhover ul li a:hover { padding: 0px 5px 5px 10px; margin: 0px; color: #000; background: none; }

/* ----- SITE MAP ----- */
#sitemap { list-style:none; margin:0 0 0 5px; padding:0;}
#sitemap ul { list-style:none;  margin:10px 0 0px 15px; padding:0;}
#sitemap li { background:url(../images/layup/bulletSitemap.gif) 0px 11px no-repeat; padding:6px 0 5px 15px;}

/* ----- BREADCRUMBS/PAGINATION/PAGE TOP AND BOTTOMS ----- */
#breadcrumbs { padding: 10px 0px 15px 0px; }
#breadcrumbs a { font-weight: normal; text-decoration: none; }
#pagination { float: right; }
#pagination a { padding: 0px 4px 0px 4px; text-decoration: none; }
#pagination a:hover { text-decoration: none; background:#000000; color:#FFFFFF; }
#pagination .active { text-decoration: none; background:#000000; color:#FFFFFF; }
#pagination span { display: block; float: left; padding: 0px 2px 0px 2px; }

/* ----- FOOTER ----- */
#footer {}
#footer .padding { background: url(../images/layup/dotsH.gif) repeat-x left top; padding-top: 5px;  }
#footer .padding p { line-height: 20px; }
#footer #footerLinks { width: 954px; background: url(../images/layup/footerBg.gif) no-repeat; margin-bottom: 15px; }
#footer #footerLinks .footerLinksBg { padding-bottom: 15px; }
#footer #footerLinks .footerBox { float: left; width: 186px; padding: 15px 45px 0px 8px; }
#footer #footerLinks .footerBox.first { padding: 15px 45px 0px 33px; }
#footer #footerLinks .footerBox.last { width: 186px; padding: 15px 0px 0px 0px; }
#footer #footerLinks .footerBox .boxTitle { font-weight: bold; }
#footer #footerLinks .footerBox ul { list-style: none; padding: 0px; margin: 0px; }
#footer #footerLinks .footerBox ul li { padding: 0px; margin: 0px; }
#footer #footerLinks .footerBox ul li a { color: #707070; text-decoration: none; }
#footer #footerLinks .footerBox ul li a:hover { color: #000000; text-decoration: underline; }


#footer .padding {}
#footer a { font-weight:normal; text-decoration:none;}
#footer a:hover { text-decoration:underline;}

/* ----- GLOBAL ----- */
img { display:block; border:0; }
p { padding:0 0 15px 0; margin:0; }
address { font-style:normal;}

/* ----- LINKS ----- */
a { color:#000000; font-weight:bold; text-decoration:underline;cursor:pointer; }
a:hover { text-decoration:none; }

/* ----- FORMS ----- */
form { padding:0; margin:0; }
fieldset { padding:0; margin:0; border:0px none; }
legend { padding:0; margin:0; display:none; }
label { display:block; width:260px; float:left; }
input, textarea { width:200px; font-size:11px !important;}
.required { color:#006699;}
.checkRadio { width:20px; position:relative; left:-7px;}
#frmContact { margin-bottom:15px;}
#frmContact p { padding:7px 0;}
#frmContact select { width:204px;}
#frmContact div { margin-bottom:10px;}
#submit { width:69px; height:25px; border:none; }
#frmSingleDebt .title { padding: 5px 10px 5px 10px; background: #BEE4F9; font-weight: bold; }
#frmSingleDebt form { width: 470px; }
#frmSingleDebt form label { width: 260px; }

/* ----- Prototype Validation ----- */
input.disabled { border: 1px solid #F2F2F2; background-color: #F2F2F2; }
input.validation-failed, textarea.validation-failed, select.validation-failed { border: 1px solid #4544e4; color : #FF3300; }
input.validation-passed, textarea.validation-passed, select.validation-passed { border: 1px solid #00CC00; color : #000; }
.validation-advice { margin: 5px 0; width:452px; padding: 5px; background-color: #79c7f3; color : #FFF; font-weight: bold; }

/* ----- TABLES ----- */
table { border-collapse:collapse; }
table p { padding:0px; }

/* ----- STOCK UPDATES FORM ----- */
#promoForm { padding:12px 0 0 19px; }
#promoForm .signupBoxes { margin-bottom:20px; margin-top:10px;}
#promoForm .signupBoxes label { float:left; width:450px; position:relative; top:4px;}
#promoForm .signupBoxes input { float:left; width: 14px; margin-right: 10px;}
#promoForm select { width:125px !important; margin-bottom: 10px; display:block; margin-right:15px;}
#promoForm .carSelects { padding-top:18px;}
#promoForm .submitButton { margin:5px 0 20px 0;}

/* ----- DOMTABS ----- */
.domTabs { padding-bottom: 30px; }
.domContent { border: 1px solid #333333; }
.dt1 { display: block; }

ul.domHeadings { padding: 0px; margin: 0px; list-style: none; }
ul.domHeadings li { float: left; }
ul.domHeadings li a { display: block; float: left; padding: 5px 10px 5px 10px; background: #000; color: #FFF; text-decoration: none; font-weight: bold; }
ul.domHeadings li a:hover, ul.domHeadings li.active a { background: #BCBCBC; color: #000; }

/* ----- RECAPTCHA DATA ----- */
/*recapture*/
#contactContainer #recaptcha_table div { margin: auto; }
.recaptchatable .recaptcha_image_cell, #recaptcha_table {background-color:#ffffff !important; //reCaptcha widget background color }
#recaptcha_table {   border-color: none !important;  }
#recaptcha_response_field {   border-color: none !important; background-color:#ffffff !important; }

/*recapture*/
#recaptcha_table div {margin: auto;}
.recaptchatable .recaptcha_image_cell, #recaptcha_table {background-color:#ffffff !important; //reCaptcha widget background color }
#recaptcha_table {   border-color: none !important;  }
 
/* Overwrite reCaptcha background images */
.recaptchatable .recaptcha_r1_c1 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll 0 -63px !important; }
.recaptchatable .recaptcha_r2_c1 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -18px 0 !important; }
.recaptchatable .recaptcha_r2_c2 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -27px 0 !important; }
.recaptchatable .recaptcha_r3_c1 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll 0 0 !important; }
.recaptchatable .recaptcha_r3_c2 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -18px -57px !important; }
.recaptchatable .recaptcha_r3_c3 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -9px 0 !important; }
.recaptchatable .recaptcha_r4_c1 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -43px 0 !important; }
.recaptchatable .recaptcha_r4_c2 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -36px 0 !important; }
.recaptchatable .recaptcha_r4_c4 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -214px 0 !important; }
.recaptchatable .recaptcha_r7_c1 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -43px -49px !important; }
.recaptchatable .recaptcha_r8_c1 { background:transparent url(../images/layup/recaptcha/sprite.png) no-repeat scroll -43px -49px !important; }
#recaptcha_reload, #recaptcha_switch_audio, #recaptcha_whatsthis, recaptcha_switch_img { display:none !important; }

/* Remove reCaptcha button images  */
#recaptcha_switch_img_btn #recaptcha_switch_img { display:none !important; }

/* Add user created button images */
#recaptcha_reload_btn { background:transparent url(../images/layup/recaptcha/refresh.png) no-repeat scroll 0 0 !important; display:block; height:17px; width:25px; }
#recaptcha_switch_audio_btn { background:transparent url(../images/layup/recaptcha/switch_audio.png) no-repeat scroll 0 0 !important; display:block; height:16px; width:25px; }
#recaptcha_switch_img_btn { background:transparent url(../images/layup/recaptcha/switch.png) no-repeat scroll 0 0 !important; display:block; height:16px; width:25px; }
#recaptcha_whatsthis_btn { background:transparent url(../images/layup/recaptcha/whats_this.png) no-repeat scroll 0 0 !important; display:block; height:16px; width:25px; }
.recaptcha_theme_red #recaptcha_response_field { border-color:#1c4488 !important; background-color:#ffffff !important; }