@import url('reset-min.css');

/*---------------------------------------------
01. MAIN/DEFAULT ELEMENTS
---------------------------------------------*/
html{
background: #d7d7d7;
}

body {
font-family: arial, verdana;
font-size: 62.5%;
padding: 10px 0 0 0;
background: #ffffff url('/images/microsites/edebtrelief/bg-body.gif') left top repeat-y;
width: 896px;
margin: 0 auto;

}

.none {display:none !important;}

div.clear {clear:both; visibility: hidden; }

img{
display: block;
border: none;
}
img.floatleft{
float: left;
border: #b9c8cf 1px solid;
margin: 0 29px 20px 0;
}

img.floatleft1{
float: left;
border: none;
margin: 2px 6px 4px 2px;
}

a, a:visited{
color: #206aab;
text-decoration: underline;
}
a:hover, a:active{
color: #b40808;
}

h2{
margin: 0 0 5px 0;
padding: 10px 0 0 0;
font-size: 1.7em;
font-weight: normal;
line-height: 1em;
color: #1f6a8c;
}

h3{
margin: 0 0 4px 0;
font-size: 1.3em;
font-weight: bold;
color: #41616e;
line-height: 1.4em;
}

p{
margin: 0 0 .6em 0;
padding: 0;
font-size: 1.3em;
line-height: 1.5em;
}

p.smallcaps{
color: #435e6b;
font-size: 1.1em;
letter-spacing: 2px;
font-weight: bold;
text-transform: uppercase;
margin: 0;
}

p.slogan{
margin: -25px 0 0 0;
color: #435e6b;
font-size: 1.4em;
}

p a.more{
color: #b40808;
font-weight: bold;
padding: 0 5px 0 5px;
}

ul, ol{
margin: 0 0 10px 15px;
padding: 0 0 0 15px;
}

ul li, ol li{
font-size: 1.2em;
line-height: 1.2em;
}

ul li ul { margin: 0 0 0 15px; }
li li { font-size: 1em; }

/*---------------------------------------------
02. LAYOUT ELEMENTS
---------------------------------------------*/


#header {
width: 830px;
padding: 0 30px 0 29px;
text-align: left;
height: 1%;
}
#header:after{
display: block;
content: ".";
clear: left;
height: 0px;
visibility: hidden;
}

div.MainContent {
width: auto;
text-align: left;
padding: 7px 16px 0 28px;
height: 1%;
}
div.MainContent:after{
display: block;
content: ".";
clear: left;
height: 0px;
visibility: hidden;
}
#left {
width: 164px;
float: left;
}

#right {
width: 327px;
float: right;

}

div.middle {
width: 464px;
padding: 19px 12px 0 16px;
background: url('/images/bg_middle.gif') repeat-x;
float: left;
}

div.middlewide{
width: 628px;
padding: 36px 12px 0 16px;
background: url('/images/bg_middle.gif') repeat-x;
float: left;
}
div.middlewidenobg{
padding: 15px 0 0 0;
background: none;
}

div.superwide, div.superwideplain, div.superwidenobg, div.superwidenopadding{
padding: 12px 12px 0 0;
}

div.superwide { background: transparent; }

/*---------------------------------------------
03. HEADER & NAVIGATION ELEMENTS
---------------------------------------------*/

#header h5 a{
float: left;
height: 102px;
width: 252px;
text-indent: -8000em;
overflow: hidden;
background: transparent url('/images/microsites/edebtrelief/logo-edr.gif') 24px 24px no-repeat;
}

#header p.ctf{
padding: 60px 10px 0 0;
text-align: right;
text-transform: uppercase;
font-size: 1.7em;
color: #979797;
font-family: "Trebuchet MS","Arial narrow";
}

/* 03.01 Navigation bar */

#header ul.navigation,
#header ul.navigation li a span,
#header ul.navigation2,
#header ul.navigation2 li a span
{
list-style-type: none;
padding: 0;
margin: 0;
display: block;
text-indent: -8000px;
text-decoration: none;
font-size: .05em;
line-height: .05em;
height: 32px;
}

div.navigation_replacement{
clear: both;
text-indent: -5000em;
overflow: hidden;
background: url('/images/microsites/edebtrelief/nav_replace.gif') right top no-repeat;
height: 11px;
}

#header ul.navigation{
float: left;
width: 628px;
padding-left: 18px;
background: url('/images/bg_nav.gif') no-repeat;
}

#header ul.navigation2{
float: left;
width: 349px;
background: url('/images/bg_nav2.gif') repeat-x;
}

#header ul.navigation li, #header ul.navigation li a, #header ul.navigation2 li, #header ul.navigation2 li a
{
display: block;
float: left;
text-decoration: none;
height: 32px;
border-bottom: 0px none;
}

#header ul.navigation li a{
position:relative;
padding-left:1px;
margin-left:-1px;
}

#header ul.navigation2 li.calc, #header ul.navigation2 li.calc a span{
background: url('/images/nav_calc.gif') no-repeat;
width: 134px;
}

#header ul.navigation2 li.loanoptions, #header ul.navigation2 li.loanoptions a span{
background: url('/images/nav_loanoptions.gif') no-repeat;
width: 137px;
}

/* shift the tab up by 32 pixels if it is either a, being hovered, or b, marked as active*/
#header ul.navigation li.active a span,
#header ul.navigation li a:hover span,
#header ul.navigation2 li.active a span,
#header ul.navigation2 li a:hover span
{
background-position: 0px -32px;
cursor:pointer;
}

#header ul.navigation li.active a,
#header ul.navigation li a:hover{
background: url('/images/bg_nav.gif') repeat-x;
}

h2.world, h2.books, h2.help{
font-size: 1.3em;
padding: 12px 0 25px 48px;
margin: 0 0 12px 0;
border-bottom: 1px solid #b9c8cf;
background: url("images/world.gif") left center no-repeat;
text-transform: uppercase;
}
h2.books{ background: url('/images/books.gif') no-repeat;}
h2.help { background: url('/images/help.gif') no-repeat;}

/*---------------------------------------------
04. CONTENT ELEMENTS
---------------------------------------------*/



div.middle ul, div.middlewide ul, div.superright ul, div.superright ul, #right ul.bullets, ul.calclist{
float: left;
list-style-type: none;
padding: 0;
margin: 0;
}

div.middle ul li, div.middlewide ul li, div.superright ul li, div.superright ul li, #right ul.bullets li, ul.calclist li{
padding: 0 0 3px 28px;
margin: 0;
background: url('/images/bullet_red.gif') left top no-repeat;
zoom: 1;
}

#right ul.bullets li { width: auto; }

div.middle ul li span, div.middlewide ul li span, #right ul.bullets li span{
background: url('/images/arrow_small.gif') no-repeat;
padding: 0 0 0 10px;
}

div.middleleft{
float: left;
width: 161px;
}

div.middleright{
float: left;
width: 455px;
position:static;
margin:0 0 15px 0;
}

div.middleright ul li{
width: 194px ;
}

div.middleright p{
width: 455px ;
}

div.middlesplit{
float: left;
width: 307px;

}

div.middlesplit ul li { width: 274px !important; }
div.middlesplitright { float: right; }

#newsletter_sm{
float: left;
height: 54px;
margin: 0;
width: 208px;
padding: 7px 8px 0 95px;
background: url('/images/bg_newsletter_sm.gif') no-repeat;
}

#newsletter h3, #newsletter_sm h3, div.fixedpanel h3{
font-size: 1.3em;
color: #9c0000;
line-height: 1em;
margin-bottom: 0;
font-weight: bold;
}

#newsletter p, #newsletter_sm p{
color: #41616e;
font-size: 1.1em !important;
line-height: 1em;
margin-bottom: 3px;
}

#newsletter input.email, #newsletter_sm input.email{
border: 1px solid #adabae;
padding: 2px;
width: 203px;
vertical-align: top;
font-size: 1em;
}

#newsletter_sm input.email { width: 103px; }

div.fixedpanel{
width: 289px;
padding: 7px 8px 0 8px;
background: url('/images/bg_panel.gif') no-repeat;
float: left;
height: 54px;
}

div.fixedpanel p, div.fixedpanel h3 { width: 289px !important; }
div.fixedpanel p { letter-spacing: -.05em; }

/* Right Column */

#right h3{
font-size: 1.2em;
margin-bottom: 2px;
clear:both;
font-weight: bold;
}

#right p{
}

#right p.date{
position: relative;
float:left;
clear:both;
z-index: 10;
color: #365867;
font-size: 1em;
border-bottom: 1px solid #b9c8cf;
padding:0;
width:100%;
margin-bottom: 10px;
}

#right p.rss{
border-top: 1px solid #b9c8cf;
padding: 10px 0 5px 0;
}

#right p.rss a{
background: url('/images/rss.gif') no-repeat;
height: 19px;
padding: 5px 0 5px 25px;
}

#right p.termsright{
border-top: 1px solid #b9c8cf;
padding: 10px 0 5px 0;
}

#right p.date span{
position: relative;
z-index: 20;
float: right;
clear:none;
background: #fff;
padding-left: 10px;
margin-bottom: -8px;
}

div.rightbox{
width: 327px;
padding-bottom: 6px;
margin-bottom: 20px;
background: url('/images/bg_right.gif') no-repeat bottom left;
}

div.rightbox h2{
padding: 15px 0 5px 20px;
margin: 0;
width: 307px;
line-height: 1em;
color: #335a01;
font-size: 1.3em;
}

div.rightbox h2.loancenter { background: url('/images/loancenter.gif') no-repeat; }
div.rightbox h2.rates { background: url('/images/rates.gif') no-repeat; }

div.rightbox ul.nav{
width: 305px;
float: left;
list-style-type: none;
padding: 0 10px 0 12px;
margin: 0;
}

div.rightbox ul.green{background: url('/images/bg_nav_green.gif') repeat-y;}
div.rightbox ul.yellow{background: url('/images/bg_nav_yellow.gif') repeat-y;}
div.rightbox ul.nav li { font-size: 1.1em; }

div.rightbox ul.nav li, div.rightbox ul.nav li a{
float: left;
line-height: 1em;
height: 23px;
margin: 0;
text-align: center;
}
div.rightbox ul.nav li a{
height: 17px;
padding: 5px 5px 0 5px;
float: left;
text-decoration: none;
}

div.rightbox ul.green li a{border-bottom: 1px solid #cbe1ae;}
div.rightbox ul.yellow li a{border-bottom: 1px solid #f9e260;}
div.rightbox ul.nav li.left, div.rightbox ul.nav li.left a { width: 76px; }
div.rightbox ul.green li.left, div.rightbox ul.green li.left a{background: url('/images/nav_left_green.gif') no-repeat;}
div.rightbox ul.yellow li.left, div.rightbox ul.yellow li.left a{background: url('/images/nav_left_yellow.gif') no-repeat;}
div.rightbox ul.nav li.left a { width: 66px; }
div.rightbox ul.nav li.right, div.rightbox ul.nav li.right a { width: 78px; }
div.rightbox ul.green li.right, div.rightbox ul.green li.right a{background: url('/images/nav_right_green.gif') no-repeat;}
div.rightbox ul.yellow li.right, div.rightbox ul.yellow li.right a{background: url('/images/nav_right_yellow.gif') no-repeat;}
div.rightbox ul.nav li.right a { width: 68px; }
div.rightbox ul.nav li.center, div.rightbox ul.nav li.center a { width: 75px; }
div.rightbox ul.green li.center, div.rightbox ul.green li.center a{background: url('/images/nav_center_green.gif') no-repeat;}
div.rightbox ul.yellow li.center, div.rightbox ul.yellow li.center a{background: url('/images/nav_center_yellow.gif') no-repeat;}
div.rightbox ul.nav li.center a { width: 65px; }
div.rightbox ul.nav li.small { width: 51px; }
div.rightbox ul.nav li.small a { width: 41px; }
div.rightbox ul.nav li.large { width: 102px; }
div.rightbox ul.nav li.large a { width: 92px; }

div.rightbox ul.nav li a.active,
div.rightbox ul.nav li a:hover{
border-bottom: 1px solid #fff;
color: #000;
background-position: 0px -22px;
}

div.rightbox_inner{
clear: both;
width: 304px;
padding: 10px 11px 0px 12px;
}

div.rightbox_inner h3{
color: #000;
margin-bottom: 6px;
padding: 0 12px 0 12px;
font-weight: bold;
}

div.rightbox_inner table{
margin-bottom: 12px;
width: 304px;
}

div.rightbox_inner table th, div.rightbox_inner table td{
font-size: 1.1em;
color: #435e6b;
padding: 5px 15px 5px 15px;
border-bottom: 1px solid #fff;
background: #f0f4f6;
}

div.rightbox_inner table th{
color: #435e6b;
background: #ced7dc;
font-weight: bold;
}

div.rightbox_inner p{
width: 304px !important;
font-size: 1em;
margin-bottom: 6px;
}

div.rightbox_inner p a { float: right; }


div.roundboxtop{
height: 8px;
width: 327px;
background: url('/images/bg_right_top.gif')left top no-repeat;
}
div.roundbox{
margin-bottom: 10px;
width: 327px;
background: url('/images/bg_right.gif') left bottom no-repeat;
height: 1%;
}
div.roundbox:after{
display: block;
content: ".";
clear: left;
height: 0px;
visibility: hidden;
}

div.roundboxinner, #right div.roundboxinner p, #right div.roundboxinner h3{
float: left;
width: 196px;
}

div.roundboxinner p{
font-size: 1.1em;
line-height: 1.3em;
}

div.roundbox span.calc{
height: 64px;
width: 106px;
float: left;
background: url('/images/calc.gif') no-repeat;
}

div.roundbox select{
border: 1px solid #adabae;
padding: 2px;
width: 164px;
vertical-align: top;
font-size: 1em;
margin: 5px 3px 3px 0;
}

div.roundbox2top{
height: 8px;
width: 307px;
background: url('/images/roundbox_top.gif') right top no-repeat;
}

div.roundbox2{
margin-bottom: 10px;
padding-bottom: 3px;
width: 307px;
background: url('/images/roundbox.gif') right bottom no-repeat;
height: 1%;
}
div.roundbox2:after, div.roundboxinner:after{
display: block;
content: ".";
clear: left;
height: 0px;
visibility: hidden;
}

div.roundbox2inner, div.middlewide div.roundbox2inner p{
width: 307px;
}

div.roundbox2inner p{
font-size: 1.1em;
line-height: 1.3em;
}

div.remortgage{background: url('/images/icon_remortgage.gif') 19px 0 no-repeat;}
div.cash{background: url('/images/icon_cash.gif') 19px 0 no-repeat;}

div.roundbox2inner h3{
padding-left: 174px;
margin-bottom: 10px;
width:auto;
}
div.roundbox2inner p{
margin-bottom: 2px;
}
div.roundbox2inner p span{
width: 169px;
padding-right: 5px;
text-align: right;
float: left;
}
div.roundbox2inner p select{
width: 123px;
padding: 2px;
border: 1px solid #dbdee3;
font-size: 1em;
}
div.roundbox2inner p.go{
padding-left: 174px;
margin: 0 0 4px 0;
width: auto !important;
}

/*---------------------------------------------
05. FOOTER ELEMENTS
---------------------------------------------*/
#footer{
border-bottom: #fff 1px solid;
margin: 1px 18px 0 18px;
color: #999;
padding-top:5px;
text-align: center;
}
#footer a{
color: #999;
text-decoration: none;
}

#footer a:active, #footer a:hover{
color: #b40808;
text-decoration: none;
}

#footer p{
font-size: 1em;
padding: 4px 0 0 0;

}

#footer .disclaimer{
margin: 0 auto 5px auto;
background: url('/images/microsites/edebtrelief/bg-form-text.png') right bottom no-repeat;

}

#footer .disclaimer p{
padding: 12px 12px 10px 12px;
width:auto;
text-align:left;
background: url('/images/microsites/edebtrelief/bg-form-text-top.png') left top no-repeat;
}
#footer ul, ul#footer ul li{

list-style-type: none;
padding: 0;
margin: 0;
}
#footer ul li{
display: inline;
font-size: 1em;
padding: 0 9px 0 9px;
}

/** Disclaimer Article **/
#disclaimerArticle{
clear: both;
font-size: 0.9em;
color: grey;
padding: 0 4px;
text-align:left;
color: #9c9c9c;
}

p strong,p b{
font-weight: bold;
}


/***Ripped Stuff From Form CSS, As its overriding is causing light wide to go screwy***/

div.superintro1 h1.text,h3.getstarted, h3,.sectionHeader h3 ,.go button span, #formtext h2 {
color: #001675;
}

#customercare #buttonGroup{
clear: both;

padding: 0 0 32px 352px;
}

#customercare #buttonGroup input{
border: #dbdee3 1px solid;
background: #dbdee3;
color: #334455;
font-size: 1.8em;
font-weight: bold;
padding: 2px 6px;
cursor: pointer;
text-transform: uppercase;
}

#customercare #cc_thankyou{
padding: 20px 0;
font-weight: bold;
text-align: center;
font-size: 1.35em;
}

#customercare:after,.formSection:after{
display: block;
content: ".";
clear: both;
height: 0px;
visibility: hidden;
}