/*
Title:      	Master Styles (Main style sheet)
Author:     	Ben Usher Smith, ben@heehaw.co.uk
Updated:    	Thursday June 26th 2007
Notes:      	Hand-crafted by Heehaw Multimedia in Edinburgh, Scotland
Known issues:	None
*/

* {
	margin:0;
	padding:0}

body {
	background:#cacdd3 url(/images/generic/body_bg.gif) repeat-x;
	font:400 73.5% Verdana,Arial,Helvetica,sans-serif;
	text-align:center}
	
.clear {
	clear:both}

ul,
ol {
	list-style:none}

img {
	border:0}

a, a:link{text-decoration:none}
a:hover,
a:focus{
	color:#6b7894;
	outline:none}

sup{
	color:#c30;
	font-weight:800}

/* LINKS */
#content a,
#content a:link,
#content a:visited {
	padding:0 0 1px 0;
	color:#36c;
	text-decoration:none;
	border-bottom:1px solid #36c}

#content a:hover,
#content a:focus {
	padding:0;
	outline:none;
	border-bottom-width:2px}

#content a:focus {
	background:#ffc}


#wrapper{
	position:relative;
	background:url(/images/generic/wrapper_bg.gif) repeat-y 0 1200px;
	margin:0 auto;
	text-align:left;
	width:795px}

/* Header Section Styles */
#header{
	background:transparent url(/images/generic/header_bg.gif) no-repeat;
	padding:0 0 0 29px;
	/*width:810px;*/
	width:780px}

#header h1{
	background:transparent url(/images/generic/logo.gif) no-repeat;
	float:left;
	margin-left:5px;
	text-indent:-9999px;
	padding-bottom:14px}

#header h1 a{
	background:transparent url(/images/generic/logo.gif) no-repeat;
	display:block;
	width:233px;
	padding:72px 0 0 0;
	height:0;
	overflow:hidden}

/* Main Navigation Styles */
ul#pri-nav{
	display:block;
	padding:0 0 0 20px;
	width:752px}

ul#pri-nav li{
	float:left;
	height:26px;
	padding-right:2px;
	text-indent:-9999px}

ul#pri-nav li a{
	background-image:url(/images/buttons/buttons.gif);
	background-repeat:no-repeat;
	display:block;
	overflow:hidden;
	height:26px}

li#btn-pay_online a {
	width:92px;
	background-position:0 0}

li#btn-payment_methods a {
	width:139px;
	background-position:-94px 0}

li#btn-debtor_services a {
	width:127px;
	background-position:-235px 0}

li#btn-contact a {
	width:79px;
	background-position:-364px 0}

body#pay_online li#btn-pay_online a,
li#btn-pay_online a.active,
li#btn-pay_online a:hover,
li#btn-pay_online a:focus {background-position:0 -27px}

body#payment_methods #btn-payment_methods a,
li#btn-payment_methods a.active,
li#btn-payment_methods a:hover,
li#btn-payment_methods a:focus {background-position:-94px -27px}

body#debtor_services li#btn-debtor_services a,
li#btn-debtor_services a.active,
li#btn-debtor_services a:hover,
li#btn-debtor_services a:focus {background-position:-235px -27px}

body#contact li#btn-contact a,
li#btn-contact a.active,
li#btn-contact a:hover,
li#btn-contact a:focus {background-position:-364px -27px}

li#btn-pay_online a.active,
li#btn-payment_methods a.active,
li#btn-debtor_services a.active,
li#btn-contact a.active,
body#pay_online li#btn-pay_online a,
body#payment_methods #btn-payment_methods a,
body#debtor_services li#btn-debtor_services a,
body#contact li#btn-contact a {
	height:27px}

/* Secondary Navigation */
div#sec-nav-wrap{
	border-top:1px solid #415a7d;
	border-left:1px solid #e5e5e5;
	border-right:1px solid #e5e5e5;
	float:left;
	width:750px;
	margin:0 1px;
	background:#415a7d url(/images/generic/sec_nav_wrap_bg.gif) bottom left repeat-x}

ul#sec-nav{
	font-size:95%;
	list-style:none;
	padding:0;
	margin:0;
	float:left;
	background:#415a7d url(/images/generic/sec_nav_bg.gif) bottom left repeat-x;
	border-top:#404755 1px solid}

ul#sec-nav li{
	float:left;
	margin:0 1px 0 0;
	padding:0}

ul#sec-nav li a{
	background:#687c98 url(/images/generic/button_bg.gif) 50% bottom no-repeat;
	float:left;
	display:block;
	padding:0 0 6px 0;
	color:#fff;
	font-weight:800;
	text-decoration:none;
	text-align:center}

ul#sec-nav li a:hover{
	background:#687c98 url(/images/generic/button_bg_hover.gif) 50% bottom no-repeat}

ul#sec-nav li a:active,
ul#sec-nav li a.active{
	background:#b64848 url(/images/generic/button_bg_active.gif) 50% bottom no-repeat}

body.statement ul#sec-nav li#btn-statement a,
body.details ul#sec-nav li#btn-details a,
body.request ul#sec-nav li#btn-request a,
body.call ul#sec-nav li#btn-call a{
	background:#b64848 url(/images/generic/button_bg_active.gif) 50% bottom no-repeat}

body.statement ul#sec-nav li#btn-statement a span,
body.details ul#sec-nav li#btn-details a span,
body.request ul#sec-nav li#btn-request a span,
body.call ul#sec-nav li#btn-call a span{
	border:1px solid #9a0303}

ul#sec-nav li a span,
ul#sec-nav li a:active span{
	border:1px solid #415a7d;
	display:block;
	height:2.2em;
	line-height:2.2em;
	padding:0 15px 4px 35px;
	margin:0}

ul#sec-nav li a.active span{
	border:1px solid #9a0303}

#btn-statement a span {
	background:url(/images/icons/page_blue.gif) 15px 45% no-repeat}
#btn-update_details a span {
	background:url(/images/icons/user_blue.gif) 15px 45% no-repeat}
#btn-request_payment_book a span {
	background:url(/images/icons/book_blue.gif) 15px 45% no-repeat}
#btn-request_call_back a span {
	background:url(/images/icons/phone_blue.gif) 15px 45% no-repeat}

/* Login Box Styles */ 
#login{
	top:0;
	right:14px;
	width:198px;
	font-weight:800;
	margin:10px 10px 0 0;
	padding:0 20px 0 0;
	position:absolute;
	background:#f7f7f8 url(/images/icons/user_light.gif) no-repeat 97% 50%}

#login span{
	padding:0 5px 0 0;
	float:left;
	color:#96a1b5}

#login a{
	float:left;
	color:#900;
	display:block}

/* Footer */
#footer-nav a,
#footer-nav a:link,
#footer-nav a:visited{
	color:#fff;
	font-weight:800}

#footer-nav a:hover,
#footer-nav a:focus{
	border-bottom:#fff dotted 1px}
	
#footer_csa_logo {
	float: right;
	margin: -10px 0 0 0;
	padding: 0}

.footer_small_copy {
	font-size: 80%;
}

/* Content Section Styles */
#content{
	background:#fff url(/images/generic/content_bg.gif) no-repeat 50% 25px;
	border:none;
	margin-left:30px;
	width:752px}

body.generic #content{
	background:#fff url(/images/generic/generic_content_bg.gif) no-repeat 50% 1px;
	padding-top:25px}

body#pay_online #content{
	border:1px solid #adb5c4;
	width:750px;
	margin-left:29px;
	background:#fff url(/images/home/payonline_bg.jpg) no-repeat 0 0}

#content p,
#content ul{
	color:#333;
	line-height:1.5em;
	padding:0 30px 10px 30px}

#content #main_content p{
	padding:0 0 10px 0}

#head-col-1{
	background-color:#7a89a0;
	float:left;
	width:375px}

#head-col-2{
	background-color:#7a89a0;
	float:left;
	width:375px}

/* Progress Bar */
div#progress-wrap {
	float:left;
	width:752px;
	padding:0;
	margin:25px 0 0 0;
	display:block;
	border-top:#f6f6f6 solid 1px;
	background:#fdfdfd}

ol#progress {
	font-size:95%;
	padding:0;
	margin:0;
	float:left;
	background:fff}

ol#progress li {
	color:#959478;
	background:#f7f6f1 url(/images/progress/def_dbl.gif) right 50% no-repeat;
	float:left;
	padding:10px 15px 10px 0;
	display:block;
	margin:0}

ol#progress strong {
	background:#34b726 left 50% no-repeat;
	padding:10px 15px 10px 35px;
	color:#fff;
	font-weight:400}

ol#progress li.act-spl {
	background-image:url(/images/progress/act_spl.gif)}

ol#progress li.act-dbl {
	background-image:url(/images/progress/act_dbl.gif)}

ol#progress li.act-end {
	background-image:url(/images/progress/act_end.gif)}

ol#progress #stage-1 strong {
	background-image:url(/images/progress/act_1.gif)}

ol#progress #stage-2 strong {
	background-image:url(/images/progress/act_2.gif)}

ol#progress #stage-3 strong {
	background-image:url(/images/progress/act_3.gif)}

ol#progress #stage-1 span {
	padding:10px 15px 10px 35px;
	background:transparent url(/images/progress/def_1.gif) left 50% no-repeat}

ol#progress #stage-2 span {
	padding:10px 15px 10px 35px;
	background:transparent url(/images/progress/def_2.gif) left 50% no-repeat}

ol#progress #stage-3 span {
	padding:10px 15px 10px 35px;
	background:transparent url(/images/progress/def_3.gif) left 50% no-repeat}

ol#progress li.end {
	background-image:url(/images/progress/def_end.gif)}

/* Footer Section Styles */
#footer{
	background:url(/images/generic/footer_bottom.gif) no-repeat  50% 102%;
	height:105px;
	margin-left:15px}

#footer-nav{
	background:#404858 url(/images/generic/partners.gif) no-repeat 93% 50%;
	color:#fff;
	height:55px;
	margin:0 0 0 14px;
	padding:25px 0 0 0;
	width:752px}

#footer-nav p{
	background:#404858;
	width:431px;
	padding:5px 0 0 20px}
/*
select {
	font-size:150%}
*/
.test p:first-letter{
	padding-top:5px;
	float:left;
	color:#333;
	font-size:3em}

fieldset,
#main_content {
	padding:0 30px;
	border:none}

legend {
	display:none}

.field {
	color:#596989;
	width:200px;
	padding:4px;
	float:left;
	margin:2px 270px 5px 10px;
	border:1px #c9ccd2 solid;
	background:#fff url(/images/generic/field.gif) 0 0 no-repeat}

span.field {
	color:#596989;
	width:200px;
	padding:4px;
	float:left;
	margin:2px 270px 5px 10px;
	border:none;
	background:none}

.date {
	color:#596989;
	width:120px;
	padding:4px;
	margin:2px 270px 5px 10px;
	float:left;
	border:1px #c9ccd2 solid;
	background:#fff url(/images/generic/field.gif) 0 0 no-repeat}

#submit {
	cursor:pointer;
	outline:none;
	color:#fff;
	font:bold 1.5em Verdana, Arial, Helvetica, sans-serif;
	padding:4px 15px;
	margin:5px 0 10px 0;
	background:#08c408 url(/images/generic/submit_bg.gif) bottom left repeat-x;
	border:1px solid #269126}

/* Self-clearing floats */
#pri-nav:after,
#sec-nav-wrap:after,
#login:after,
#content:after,
#progress-wrap:after {
	content:"."; 
    display:block; 
    height:0; 
    clear:both; 
    visibility:hidden}

#content h2 {
	margin:0 30px}

#content .lrg-title img {
	margin:10px 0}

#content .sml-title img {
	padding:0 0 0;
	margin:0 0 15px 0}

#content p.errors {
	margin:0 30px 10px 30px;
	padding:15px;
	background:#ffc url(/images/generic/warning_bg.gif) 0 0 repeat-x;
	border:1px solid #cc9;
	font-weight:800;
	font-size:140%;
	color:#c90}

#content p.errors span {
	color:#c60;
	background:#ffc url(/images/icons/warning.gif) 0 50% no-repeat;
	padding-left:25px}

#content dt.label_box {
	float:left;
	width:200px}

#content label.label_txt img,
#content span.label_txt img {
	margin-top:7px}

#content small#ssm {
	color:#999;
	float:left;
	width:200px}

body#pay_online #content dt.label_box {
	float:left;
	width:120px}

body#pay_online #content span.label_txt_white img {
	margin-top:15px}

body#pay_online #content ul {
	padding:15px 0 15px 20px}

body#pay_online #content li {
	padding:0 0 5px 10px;
	background:url(/images/generic/bullet.gif) 0 50% no-repeat}


body#pay_online .field {
	color:#596989;
	width:140px;
	padding:4px;
	margin:-25px 0 0 120px;
	border:1px #c9ccd2 solid;
	background:#fff url(/images/generic/field.gif) 0 0 no-repeat}

#two-col-1{
	padding:0;
	float:left;
	margin:1px 0 0 0;
	width:376px}

#two-col-1 p{
	padding:15px 30px 0 30px}

#two-col-2{
	background:#fff url(/images/generic/phone_woman.gif) bottom right no-repeat;
	padding:0;
	border-left:1px solid #adb5c4;
	margin:1px 0 0 375px}

img.cards{
	padding:0 0 10px 0;
	margin:0 0 0 55px}

#login-box{
	padding:90px 0 10px 0;
	margin:0}

#login-box form{
	width:374px}
	
/* Gordon Hacks */
#iframe_wrapper {
	text-align:center;
}

.payment_include {
	height:465px;
	width:700px;
}

#payment_inline_content {
	background:#fff url(/images/generic/content_bg.gif) no-repeat scroll 50% -8px;
	height:465px;
	width:700px;
	text-align:left;
}

#payment_inline_content h2 {
	padding: 10px 0 10px 0;
}

#payment_inline_content p {
	color:#333;
	line-height:1.5em;
	padding:0 30px 10px 0;
}