@import url("nav.css");

/* GENERAL STYLES */

body {
	margin: 0 auto;
	padding: 0px;
	background: #FFF url(/images/general/background_01.jpg) no-repeat top;
	font: medium tahoma, arial, sans-serif;
	color: #000;
	}
	
p { font: 70%/1.6em tahoma, arial, sans-serif; }

p a { color: #000; text-decoration: underline; }
	
img { border: none; }

h1 { font: 100% tahoma, arial, sans-serif; color: #000; }
	
h2 { font: 80%/1.4em tahoma, arial, sans-serif; color: #666; }

#container {
	width: 950px;
	margin: 0 auto;
	padding: 0;
	background: #fff;
	}

/* content */

.content {
	position:relative;
	width: 862px; /*actual width 950*/
	height: 110px; /* DO NOT MAKE SHORTER AS IT CHOPS THE IMAGE */
	margin: 0 auto;
	padding: 0 10px 0 78px;
	background-color: transparent;
	}
		
.content ul {
	list-style: none;
	margin-top: 4px;
	padding: 0;
	}
	
.content ul li {
	border-bottom: 1px solid #cbcbcb;
	margin: 0;
	padding-top: 2px;
	padding-bottom: 5px;
	padding-left: 0;
	}

.content ul li a {
	text-decoration: none;
	color: #000;
	font: 70% tahoma, arial, sans-serif;
	}
	
.content a:hover { color: #df1546; }

.info_box {
	width: 267px;
	float: right;
	padding: 0;
	margin: 0;
	background-color: #FFF;
	}
	
.info_box p.disclaimer { color: #8e8e8e; }

.info_box_bl { background: url(/images/info-box/InfoBox-bl.gif) 0 100% no-repeat #cbcbcb; }

.info_box_br { background: url(/images/info-box/InfoBox-br.gif) 100% 100% no-repeat; }

.info_box_tl { background: url(/images/info-box/InfoBox-tl.gif) 0 0 no-repeat; }

.info_box_tr { background: url(/images/info-box/InfoBox-tr.gif) 100% 0 no-repeat; padding: 10px 12px; }

.info_box_tr_image { background: url(/images/info-box/InfoBox-tr.gif) 100% 0 no-repeat; padding: 10px 0 0 0}

.info_box_clear { font-size: 1px; height: 1px }


.info_box .hr {
	height: 1px;
	border: none;
	background: #666;
	margin: 2px 0 4px 0;
	padding: 0;
	}
	
.info_box ul .info {
	list-style: none;
	padding: 0;
	}
	
.info_box ul li {
	border-bottom: 1px solid #bab9b9;
	margin: 0;
	padding-bottom: 5px;
	padding-left: 0;
	}
	
.info_box ul li a {
	text-decoration: none;
	color: #000;
	font: 65% tahoma, arial, sans-serif;
	}
	
.info_box a:hover { color: #df1546; }

/* additional box */

.additional_box {
	width: 511px;
	margin: 0 0 1px 0;
	padding: 0;
	background-color: #FFF;
	}

.additional_box_bl { background: url(/images/info-box/AdditionalBox-bl.gif) 0 100% no-repeat #dadada; }

.additional_box_br { background: url(/images/info-box/AdditionalBox-br.gif) 100% 100% no-repeat; }

.additional_box_tl { background: url(/images/info-box/AdditionalBox-tl.gif) 0 0 no-repeat; }

.additional_box_tr { background: url(/images/info-box/AdditionalBox-tr.gif) 100% 0 no-repeat; padding: 5px 12px; }

.additional_box_clear { font-size: 1px; height: 1px; }

.additional_box h1 { font: 80% tahoma, arial, sans-serif; color: #b01038; }

/* table box */
	
#table {
	width: 267px;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: visible;
	background-color: #FFF;
	}
	
/* HEADING STYLES */
#table #table-heading { width: 267px; height: 100%; background-color: #cbcbcb; border-bottom: 1px solid #666; }

#table #table-heading .bl { background: transparent url(/images/info-box/Table-dark-break.gif) 0 100% no-repeat; }

#table #table-heading .br { background: url(/images/info-box/Table-dark-break.gif) 100% 100% no-repeat; }

#table #table-heading .tl { background: url(/images/info-box/Table-tl.gif) 0 0 no-repeat; }

#table #table-heading .tr { background: url(/images/info-box/Table-tr.gif) 100% 0 no-repeat; padding: 10px; }

/* CONTENT STYLES */
#table #table-content { width: 267px; height: 100%; overflow: visible; margin: 0; padding: 0; background: transparent url(/images/info-box/Table-background.gif) repeat-y; }

#table #table-content .bl { background: transparent url(/images/info-box/table-bl.gif) 0 100% no-repeat; }

#table #table-content .br { background: url(/images/info-box/Table-br.gif) 100% 100% no-repeat; }

#table #table-content .tl { background: url(/images/info-box/Table-light-break.gif) 0 0 no-repeat; }

#table #table-content .tr { background: url(/images/info-box/Table-dark-break.gif) 100% 0 no-repeat; padding: 5px 0px 5px 10px;}

#table #table-content .clear {font-size: 1px; height: 1px; background-color: #FFFFFF; }
	
/* ENTRY STYLES */
#table-content .entries {
	width: 257px;
	height: 100%;
	margin: 0;
	padding: 0;
	background: transparent; }
	
#table-content .entries .left-entry, #table-content .entries .right-entry {
	width: 110px;
	height: 100%;
	margin: 0;
	padding: 0;
	float: left;
	}
	
#table-content .entries .right-entry { width: 121px; float: right; padding-right: 5px; }
	
/* best buys table */

#bb-table {
	width: 100%;
	margin: 0;
	background-color: #FFFFFF;
	}
	
#bb-heading {
	width: 511px;
	height: 35px;
	padding: 10px 0;
	overflow: visible;
	font-weight: bold;
	background-color: #dadada;
	}
	
#bb-table #bb-heading .bb-entries {
	width: 126px;
	height: 35px;
	margin: 0;
	padding: 0;
	border-right: 1px solid #cbcbcb;
	overflow: hidden;
	display: inline;
	float: left;
	padding: 0;
	background-color: #dadada;
	}
	
#bb-table p { margin: 0 10px; padding: 0; }
	
#bb-table #bb-table-content {
	margin-top: 5px;
	padding: 0;
	background-color: #dadada;
	}

.bb-header {
	font-family: tahoma, arial, sans-serif;
	font-size:8pt;
	font-weight:bold;
	color: #000;
	background-color: #aaaaaa;
	vertical-align:top;
}

.bb-lightrow  {
    font-family: tahoma, arial, sans-serif;
    font-size :8pt;
	vertical-align:top;
	background-color: #eaeaea;
}

.bb-darkrow  
{
    font-family : tahoma, arial, sans-serif;
    font-size :8pt;
    color  : #000; 
    border-bottom : 1px solid #a2a2a2; 
	background-color: #dadada;
	vertical-align:top;
}



.row-white, .row-black {
	width: 511px;
	height: 100%;
	margin: 0;
	padding: 0;
	overflow: visible;
	color: #FFF;
	background-color: #dadada;
	border-bottom: 1px solid #bababa;
	}
	
.row-black { color: #000; border-bottom: 1px solid #a2a2a2; }

.row-white .dark-entry, .row-white .light-entry, .row-black .dark-entry, .row-black .light-entry  { width: 127px; height: 100%; padding: 2px; }

.row-white .dark-entry, .row-black .dark-entry { float: left; display:inline; background-color: #a2a2a2; }

.row-white .light-entry, .row-black .light-entry { float: left; display:inline; background-color: #bababa; }
	
#next { height: 15px; width: 100%; padding: 0px; background-color: #FFF; }

#next img { float: left; margin-right: 5px;}

#next p { float: left; margin-top: 5px;}
		
br { clear: both; }

/* HOME PAGE STYLES */

/* promo area */

#top-area {
	position:relative;
	z-index:10;
	-z-index:8;
	width: 862px; /* actual width 950 */
	height: 285px;
	margin: 0 auto;
	padding: 0 10px 0 78px;
	overflow: visible;
	background: #df1546 url(/images/general/top-area_background_01.jpg) no-repeat top;	
	}
	
#top-area #mortgages-promo, #homebuy-scheme-promo, #current-rates-promo {
	width: 272px;
	height: 250px;
	float: left;
	margin-top: 48px;
	margin-right: 23px;
	background: transparent no-repeat top;
	}
	
#current-rates-promo {
	width: 271px;
	margin-right: 0px;
	float: right;
	}	
	
/* top area links */

#top-area ul {
	list-style: none;
	padding: 0;
	margin: 8px 0 0 0;
	}
	
#top-area ul li .hr {
	height: 1px;
	border: none;
	background: #8c0210;
	margin: 7px 0 5px 0;
	padding: 0;
	}

#top-area ul li a {
	margin-left: 12px;
	font: 70%/1.1em tahoma, arial, sans-serif;
	text-decoration: underline;
	color: #FFF;
	}
	
#top-area ul li a:hover {
	color: #000;
	}
	
/* content */	

.home { 
	padding-top: 85px;
	background: transparent url(/images/general/content_background_01.jpg) no-repeat top; 
	}

#welcome, #quick_links {
	position:relative;
	width: 324px;
	float: left;
	margin-right: 40px;
	padding: 10px 12px; 
	background-color: #FFF;
	}
	
#quick_links {
	width: 167px;
	margin-right: 40px;
	padding: 10px 0px;
	}
	
/* DETAIL PAGE STYLES */

body.detail {
	margin: 0 auto;
	padding: 0px;
	background: #FFF url(/images/general/background_02.jpg) no-repeat top;
	font: medium tahoma, arial, sans-serif;
	color: #000;
	}

/* header */

#header {
	width: 940px; /*actual size 950*/
	height: 53px; /*actual size 65*/
	margin: 0 auto;
	padding: 12px 10px 0 0;
	background: #FFF url(/images/general/background_header_01.jpg) no-repeat top;
	}
	
#header p { 
	float: right;
	color: #f4a8bd;
	font: 63%/1.6em tahoma, arial, sans-serif;
	}
	
#header p a { 
	color: #f4a8bd;
	}
	
/* content */
	
.detail {
	height: 100%;
	padding: 36px 10px 0 78px;
	margin: 0;
	background: #FFF url(/images/general/content_background_02.jpg) no-repeat top; 
	}

.column1_heading, .column2_heading {
	width: 488px;
	height: 30px; /* THIS AFFTECTS THE UNDERLINE @ THE TOP OF EACH COLUMN */
	float: left;
	padding-left: 12px;
	border-bottom: 1px solid #b31641;
	}
	
.column2_heading { width: 255px; margin: 0; }


#column1, #column2 {
	width: 500px;
	margin: 0 73px 0 0;
	float: left;
	background-color: transparent;
	}
	
#column2 {
	width: 267px;
	margin: 0px;
	float: right;
	}
	
		
.column_text { /* this is used for text ONLY columns */
	 margin: 0 12px; 
	 }

	
/* DEFAULT PAGE STYLES */


#intro_image {
	width: 512px;
	height: 236px;
	margin-top: 37px;
	margin-left: 80px;
	position: absolute;
	z-index: 2;
	background-color: transparent;
	}
	
#column1_imagery {
	width: 511px;
	margin-top: 194px;
	margin-right: 73px;
	padding: 0;
	float: left;
	background-color: transparent;
	}
	
#column1_imagery .hr {
	height: 1px;
	border: none;
	background-color: #b31641;
	margin-bottom: 15px;
	padding: 0;
	}
	
#column1_imagery .calculator-result {
	height: 1px;
	border: none;
	background-color: #e8e8e8;
	margin: 0;
	padding: 0;
	}
	

/* best buys full table */

table.best-buys { width: 511px; padding: 0px; border: none; font: 65% tahoma, arial, sans-serif;}

table.best-buys tr td { padding: 5px 12px; }

table.best-buys tr.headings { border-bottom: 1px solid #dadada; font-weight: bold; }

table.best-buys tr.gaps td { background-color: #fff; height: 5px; }

table.best-buys tr.white td { color: #FFF; }

table.best-buys td { border: none; background-color: #CBCBCB; vertical-align: middle; padding: 0; }

table.best-buys td.dark { background-color: #8e8e8e;}

table.best-buys td.d-gray { background-color: #a2a2a2;}

table.best-buys td.light { background-color: #cbcbcb; }

table.best-buys td.l-gray { background-color: #b7b7b7; }

/*MORTGAGES-CALCULATOR*/

.calculator { 
	width: 365px;   
	height: 100%; 
	margin: 0; 
	}

.calculator label, #costs label { 
	margin: 0; 
	float: left; 
	color: #000; 
	font-size: x-small; 
	line-height: 1.6em;
	}
	
#costs label { margin-left: 12px; }

.calculator .enter {
	width: 100px;
	margin-bottom: 5px;
	float: right;
	border: 1px solid #CCCCCC;
	}
	
#calculator-table { width: 511px; background-color:#ccc; font: x-small tahoma, arial sans-serif; text-align: center; }
	 
#calculator-table .dark-column { background-color: #999; }

#calculator-table .total-heading, #calculator-table .total-figures { text-align: center; background-color: #fff; }

#calculator-table .total-figures { color: #7d0624; font-weight: bold; }

#borrowing-potential {
	width: 487px; 
	height: 20px; 
	margin: 5px 0 10px 12px;
	}
	
#borrowing-potential p { float: left; }

	
#borrowing-potential .result {
	width: 85px;
	height: 20px;
	margin-top: 10px;
	margin-left: 10px;
	padding: 0;
	position: relative;
	float: left;
	display: inline;
	font: 80%/0em; 
	font-weight: bold;
	background-color: #FFF;
	}
	
#borrowing-potential .result p { display: inline; font: 80%/0em; font-weight: bold; margin: 0; }

#costs { 
	width: 240px; 
	height: 100%; 
	margin-bottom: 5px;
	float: left; 
	}

#costs .enter{
	width: 100px;
	margin-left: 15px;
	float: right;
	border: 1px solid #CCCCCC;
	}
	
#costs .results {
	width: 100px;
	height: 100%;
	margin-left: 15px;
	float: right;
	font: 80%/0em; 
	}
	
#costs .results p { font: 80%/0em; margin: 0; }
	
#costs .row { width: 234px; height: 20px; padding: 3px; margin-bottom: 2px; }


#estimated-costs { 
	width: 215px; 
	height: 100%; 
	margin: 15px 12px 10px 13px;
	float: left;
	background-color: #CCC; 
	text-align: center;
	font-size: 65%; 
	}

#estimated-costs .hr { height: 1px; border: none; background: #666; margin: 5px 0 4px 0; padding: 0; }

#estimated-costs #estimation { 
	width: 180px;
	height: 100%;
	margin-top: 15px;
	padding-top: 12px;
	padding-bottom: 25px;
	font-size: 150%;
	}
	
	
/* footer */

#footer_sec1, #footer_sec2 {
	border-top: 1px solid #cbcbcb;
	margin-top: 39px;
	margin-right: 10px;
	float: right;
	width: 850px;
	padding: 0 0 0 12px;
	background-color: #FFF;
	}
	
#footer_sec2 {
	padding-top: 4px;
	margin-top: 25px;
	}
		
#footer_sec1 p, #footer_sec2 p {
	color: #909090;
	display: inline;
	}
	
#footer_sec1 a {
	color: #909090;
	text-decoration: underline;
	} 
	
#footer_sec1 a:hover {
	color: #000;
	}
	
/*Enquiry - step 1 - 5*/ /*see ie-styles*/

#form-bg {width: 745px; padding-bottom: 50px;background-color:#dadada;}
.row, .row2 {width:745px; padding:10px 10px 10px 5px; font: 70%/1.6em tahoma, arial, sans-serif; }
.row {border-top: 1px solid white;}
.text {width:700px; margin:20px 10px 10px 0px; padding:10px; font: 70%/1.6em tahoma, arial, sans-serif;}
.question {float:left; display:inline; width:300px; padding: 0px 30px 5px 5px;}
.option, .option2, .option3  {float:left; display:inline; padding-bottom: 5px;}
.option {width:200px;}
.option2 {width:350px; text-align:center;}
.option3 {width:55px;}
.spacer {float:left;width:38px;}
.dropdown, .dropdown2 {font: 8pt tahoma, arial, sans-serif; padding:2px;}
.dropdown {width: 155px;}
.dropdown2 {width: 50px;}
.step-title {margin-left:11px;}
#steps-img {
background: #dadada url(/images/general/steps/steps-bg.gif) no-repeat;
	width: 752px;
	height:68px;
	margin-top: 37px;
	margin-left: 80px;
	position: absolute;
	z-index:20;
	background-color: transparent;
	}
#formBox {
	width: 511px;
	margin-top: 20px;
	margin-right: 73px;
	padding: 0;
	float: left;
	background-color: transparent;
	}
.boxLength 
{
    width :150px; 
	font: small tahoma, arial, sans-serif;
}

.furtherDetails, .expenses {float:left; display:inline; width:170px; padding: 0px 10px 5px 5px;}
.furtherDetails { text-align:center;}
.expenses {text-align:right;}
.formButton {margin: 10px 0px 0px 685px;}