/*

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-customer_services a {

	width:138px;

	background-position:-235px 0}



li#btn-contact a {

	width:79px;

	background-position:-375px 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#customer_services li#btn-customer_services a,

li#btn-customer_services a.active,

li#btn-customer_services a:hover,

li#btn-customer_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:-375px -27px}



li#btn-pay_online a.active,

li#btn-payment_methods a.active,

li#btn-customer_services a.active,

li#btn-contact a.active,

body#pay_online li#btn-pay_online a,

body#payment_methods #btn-payment_methods a,

body#customer_services li#btn-customer_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:752px;

	margin:0px;

	background:#415a7d url(/images/generic/sec_nav_wrap_bg.gif) bottom left repeat-x;

	overflow: hidden;

}



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

	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 11px 2px 10px;

	margin:0}



ul#sec-nav li a.active span{

	border:1px solid #9a0303}



/*#btn-statement a span {

	background:url(/images/icons/page_blue.gif) 4px 45% no-repeat}

#btn-update_details a span {

	background:url(/images/icons/user_blue.gif) 4px 45% no-repeat}

#btn-request_payment_book a span {

	background:url(/images/icons/book_blue.gif) 4px 45% no-repeat}

#btn-request_call_back a span {

	background:url(/images/icons/phone_blue.gif) 4px 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

}



#income_and_expenditure fieldset{

	border:1px solid #415A7D;

	margin:30px;

	padding:10px 30px;

}



#income_and_expenditure form fieldset:first-child{

	margin-top:0px;

}



#income_and_expenditure fieldset.two-col dt.label_box{

    width: 172px !important;

	text-align:right;

}



#income_and_expenditure fieldset span.field{

    margin: 1px 206px 5px 10px !important;

}



#income_and_expenditure fieldset.two-col span.field{

    margin: 2px 0px 5px 10px !important;

    padding: 4px !important;

    width: 102px !important;

}



#income_and_expenditure fieldset.two-col dl{

	float:left;

	width:300px;

}



#income_and_expenditure fieldset.two-col dl.two{

	margin-right:0px;

}



#income_and_expenditure fieldset.no-border{

	border:none;

	padding:0px;

}



#income_and_expenditure th.name{width: 412px;}

#income_and_expenditure td.name input{width: 378px;}

#income_and_expenditure th.balance{width:107px;}





#income_and_expenditure legend {

    clear: both;

    font-weight: bold;

    padding: 0 10px;

}



#income_and_expenditure select{

	margin-left:0px;

}



#income_and_expenditure legend img{

	margin: 0px !important;

}



.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}

.value_field {

	float: none;

	margin: 0px;

	width: 80px;

	color:#596989;

	padding:4px;

	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}



#content p.info {

	padding: 20px 0px;

}



.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}



#content a.submitlike_link {

	cursor:pointer;

	outline:none;

	color:#fff;

	font:bold 1.3em 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;

	float: left;

	display: block;

}



/* 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 h3 {

	margin: 25px 0px 15px;

	clear:both;

}



#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 135px;

	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;

}

#login-box legend {
	display: none;
}