body {
font-size : 62.5%;
font-family : Arial, Helvetica, sans-serif;
background : url(../../images/body.jpg) repeat-x top left;
}
body,img,ul,li {
border : none;
list-style : none;
margin : 0;
padding : 0;
}
/* 
================================================================== TEXT 
*/
h1 {
font-weight : normal;
margin : 5px 0;
padding : 0;
color : #3ca3b2;
font-size : 1.6em;
}
h2 {
font-weight : normal;
color : #3ca3b2;
font-size : 1.5em;
}
h3 {
font-weight : normal;
color : #3ca3b2;
font-size : 1.4em;
}
p {
color : #474646;
font-size : 1.2em;
}
a {
color : #3ca3b2;
}
a:hover {
text-decoration : none;
color : #227480;
}
#page p, #widePage p {
line-height : 16pt;
}
/* 
================================================================== LAYOUT 
*/
#center {
text-align : center;
background : url(../../images/width-bg.jpg) no-repeat top center;
padding : 7px 0 0 0;
}
#outerWrap {
width : 949px;
margin : 0 auto;
position : relative;
}
#inerWrap {
margin : 0 auto;
text-align : left;
}
#page li {
font-size : 1.2em;
color : #474646;
}
/* 
================================================================== HEADER 
*/
#header {
height : 100px;
margin : 0 auto;
}
.logo {
background:url(../../images/logo.png) no-repeat bottom center;
width:179px;
height:130px;
position:absolute;
left:-15px;
top:0;
z-index:10;
}
.logo a {
display : block;
width:179px;
height:130px;
}
#strapline {
font-size:1.8em;
position:absolute;
top:30px;
padding:0;
margin:0;
width:400px;
left:50%;
margin-left:-200px;
text-align:left;
color:#a2a0a0;
}
#strapline strong {
color:#72c2cd;
font-weight:normal;
}
/* 
================================================================== SUB NAVIGATION 
*/
#subNav {
float : right;
margin : 9px 10px 0 0;
font-size : 1.2em;
width : 280px;
}
.login {
background : #c0d542 url(../../images/login-bg-left.jpg) no-repeat;
padding-left : 10px;
}
.login ul {
padding : 0 10px 0 0;
margin : 0;
list-style : none;
height : 23px;
line-height : 23px;
background : url(../../images/login-bg-right.jpg) no-repeat right center;
}
.login ul li {
margin : 0;
padding : 0;
float : left;
font-weight : bold;
color : #fff;
}
.login ul li a {
padding : 0 10px;
font-weight : bold;
color : #fff;
text-decoration : none;
}
.login ul li a:hover {
color : #646262;
}
.login ul li img {
border : none;
margin : 0 3px;
display : block;
}
.login ul li a#logout {
background : url(../../images/login-exit.jpg) no-repeat right;
padding : 0 20px 0 20px;
color : #71820e;
}
.login ul li a#logout:hover {
color : #fff;
background : url(../../images/login-exit-white.jpg) no-repeat right;
}
.upgrade {
margin : 0;
padding : 0;
height : 20px;
line-height : 20px;
}
.upgrade ul {
margin : 0 23px 0 0;
padding : 0;
list-style : none;
}
.upgrade ul li {
margin : 0 1px 0 0;
padding : 0;
float : right;
}
.upgrade ul li a {
background : #c0d542 url(../../images/upgrade.jpg) no-repeat bottom;
color : #71820e;
text-align : center;
width : 115px;
height : 20px;
line-height : 20px;
display : block;
text-decoration : none;
border-top : 1px solid #aec13d;
}
.upgrade ul li a:hover {
color : #fff;
}
/* 
================================================================== MASTHEAD 
*/
#masthead {
margin : 25px auto 15px auto;
display : block;
clear:both;
width : 923px;
height:144px;
background:url(../../images/masthead-road.jpg) no-repeat center center;
position:relative;
}
#masthead #clickMe {
display:block; 
width : 923px; 
height:144px;
z-index:9999;
position:absolute;
top:0;
left:0;
}
#learnerPlates {
background:url(../../images/learnerPlates.png) no-repeat center center;
width:277px;
height:172px;
position:absolute;
bottom:0;
right:-20px;
}
#freeSignUp {
background:url(../../images/freeSignUp.png) no-repeat center center;
width:96px;
height:96px;
position:absolute;
top:-10px;
left:-10px;
}
#freeSignUp a {
width:96px;
height:96px;
display:block;
text-indent:-9999px;
}
/* 
================================================================== MAIN NAVIGATION 
*/
.navOuter {
padding-left : 5px;
width : 923px;
margin : 0 auto;
}
.navInner {
height : 31px;
padding : 0 0 0 120px;
position:relative;
}
#telephone_icon {
background:url(../../images/telephone_icon.png) no-repeat left center;
padding-left:45px;
position:absolute;
right:10px;
top:-5px;
height:42px;
line-height:42px;
z-index:9999;
color:#767676;
font-size:1.6em;
font-weight:bold;
}
.nav {
list-style : none;
margin : 0;
padding : 0;
height : 31px;
}
.nav li {
float : left;
}
.nav li a {
display : block;
padding : 7px 16px 9px 16px;
text-decoration : none;
font-weight : bold;
font-size : 1.2em;
color : #646262;
}
.nav li a:hover {
color : #fff;
}
/* 
================================================================== GREEN NAV 
*/
.greenOuter {
background : url(../../images/nav-green-lend-bg.jpg) no-repeat left;
}
.greenInner {
background : url(../../images/nav-green-bg.jpg) repeat-x left center;
}
.greenNav {
background : url(../../images/nav-green-rend-bg.jpg) no-repeat right;
}
.greenNav li a {
background : url(../../images/nav-green-brd-bg.jpg) no-repeat left;
}
.greenNav li a:hover {
background : url(../../images/nav-green-hover-bg.jpg) repeat-x left center;
}
/* 
================================================================== GREY NAV 
*/
.greyOuter {
background : url(../../images/nav-lend-bg.jpg) no-repeat left;
}
.greyInner {
background : url(../../images/nav-bg.jpg) repeat-x left center;
}
.greyNav {
background : url(../../images/nav-rend-bg.jpg) no-repeat right;
}
.greyNav li a {
background : url(../../images/nav-brd-bg.jpg) no-repeat left;
}
.greyNav li a:hover {
background : url(../../images/nav-hover-bg.jpg) repeat-x left center;
}
/* 
================================================================== CURRENT PAGE 
*/
body.b-home a#b-home, body.b-home a#b-home, body.b-about a#b-about, body.b-how a#b-how, body.b-theory a#b-theory, body.b-hazard a#b-hazard, body.b-contact a#b-contact {
background : url(../../images/nav-hover-bg.jpg) repeat-x left center;
color : #fff;
}
body.b-dashboard a#b-dashboard, body.b-practice-hazard a#b-practice-hazard, body.b-mock-hazard a#b-mock-hazard, body.b-practice-theory a#b-practice-theory, body.b-mock-theory a#b-mock-theory {
background : url(../../images/nav-green-hover-bg.jpg) repeat-x left center;
color : #fff;
}
/* 
================================================================== FOOTER 
*/
p#crowncopy {
margin : 10px 0 0 0;
padding : 13px 13px 0 13px;
color : #8d8d8d;
clear:both;
border-top : 1px solid #ccc;
}
#footer {
padding : 13px;
color : #8d8d8d;
display:block;
}
#footer li {
float : left;
font-size:1.1em;
border-right : 1px solid #ccc;
margin-right:7px;
padding-right:7px;
}
#footer li a {
text-decoration : none;
color : #8d8d8d;
}
li#magic span {
margin-right : -3px;
}
li#magic {
border:none;
margin-right:0;
padding-right:0;
}
#footer a {
color : #8d8d8d;
text-decoration : none;
}

#affiliates {
display:block;
padding:13px;
clear:both;
}
#affiliates li {
float : left;
}
table.choose {
margin : 20px 0;
font-size : 1.1em;
border : 1px solid #ccc;
background : #fff;
}
table.choose th {
background : url(../../images/table.jpg) repeat-x center left;
}
/* 
================================================================== LOGIN 
*/
#loginWrap {
float : left;
width : 47%;
padding : 10px;
margin-top : 15px;
}
#loginWrap p {
font-size : 1.2em;
text-align : center;
}
#login {
margin : 17px;
font-size : 1.2em;
color : #666;
padding : 10px;
}
#login legend {
padding-right : 5px;
}
#login label {
width : 120px;
float : left;
text-align : right;
padding-right : 10px;
}
#login input {
margin : 0 0 5px 0;
width : 168px;
}
#login input#submit {
margin : 10px 0 10px 110px;
background : url(../../images/buttons/next.jpg) top;
border : none;
width : 178px;
height : 39px;
color : #b6c9cd;
padding : 0 0 10px 10px;
text-align : left;
font-weight : bold;
cursor : pointer;
}
#login input#submit:hover {
color : #c0d542;
background-position : bottom;
}
/* 
================================================================== TELL A FRIEND 
*/
#tellaFriend {
margin : 17px;
font-size : 1.2em;
color : #666;
padding : 10px;
border:1px solid #3ca3b2;
color:#3ca3b2;
}
#tellaFriend legend {
padding-right : 5px;
}
#tellaFriend label {
width : 120px;
float : left;
text-align : right;
padding-right : 10px;
color:#474646;
}
#tellaFriend input {
margin : 0 0 5px 0;
width : 168px;
}
#tellaFriend input#submit {
margin : 10px 0 10px 130px;
background : url(../../images/buttons/next.jpg) top;
border : none;
width : 178px;
height : 39px;
color : #b6c9cd;
padding : 0 0 10px 10px;
text-align : left;
font-weight : bold;
cursor : pointer;
}
#tellaFriend input#submit:hover {
color : #c0d542;
background-position : bottom;
}
/* 
================================================================== CONTACT FORM 
*/
#contact {
margin : 17px;
font-size : 1.2em;
color : #666;
padding : 10px;
border:1px solid #3ca3b2;
color:#3ca3b2;
}
#contact legend {
padding-right : 5px;
}
#contact label {
width : 120px;
float : left;
text-align : right;
padding-right : 10px;
color:#474646;
}
#contact input {
margin : 0 0 5px 0;
width : 168px;
}
#contact input#submit {
margin : 10px 0 10px 130px;
background: url(../../images/green-button.gif) top;
border : none;
width : 113px;
height : 21px;
color : #fff;
padding : 0 0 2px 10px;
text-align : left;
cursor : pointer;
}
#contact input#submit:hover {
color : #0e4c56;
background-position : bottom;
}
/* 
================================================================== GENERAL FIELDSET 
*/
#general {
margin : 17px;
font-size : 1.2em;
color : #666;
padding : 10px;
border:1px solid #3ca3b2;
color:#3ca3b2;
}
#general legend {
padding-right : 5px;
}
#general label {
width : 120px;
float : left;
text-align : right;
padding-right : 10px;
color:#474646;
}
#general input {
margin : 0 0 5px 0;
width : 168px;
}
#general input#submit {
margin : 10px 0 10px 130px;
background : url(../../images/buttons/next.jpg) top;
border : none;
width : 178px;
height : 39px;
color : #b6c9cd;
padding : 0 0 10px 10px;
text-align : left;
font-weight : bold;
cursor : pointer;
}
#general input#submit:hover {
color : #c0d542;
background-position : bottom;
}
/* 
================================================================== REGISTER 
*/
#registerWrap {
float : right;
width : 47%;
padding : 10px;
margin-top : 15px;
}
#registerWrap p {
font-size : 1.2em;
text-align : center;
}
#registerWrap legend {
padding-right : 5px;
}
#register {
margin : 17px;
font-size : 1.2em;
color : #666;
padding : 10px;
}
#register label {
width : 140px;
float : left;
text-align : right;
padding-right : 10px;
}
#register input {
margin : 0 0 5px 0;
}
#register input#submit {
margin : 10px 0 10px 150px;
background : url(../../images/buttons/next.jpg) top;
border : none;
width : 178px;
height : 39px;
color : #b6c9cd;
padding : 0 0 10px 10px;
text-align : left;
font-weight : bold;
cursor : pointer;
}
#register input#submit:hover {
color : #c0d542;
background-position : bottom;
}
/* 
================================================================== DIRECTORY 
*/
#directory {
margin : 17px 0;
font-size : 1.2em;
color : #666;
padding : 10px;
border:1px solid #3ca3b2;
color:#3ca3b2;
}
#directory label {
width : 140px;
float : left;
text-align : right;
padding-right : 10px;
line-height : 20px;
color:#474646;
}
#directory input {
margin : 0 0 5px 0;
}
#directory input#submit {
margin : 10px 0 10px 150px;
background : url(../../images/buttons/next.jpg) top;
border : none;
width : 178px;
height : 39px;
color : #b6c9cd;
padding : 0 0 10px 10px;
text-align : left;
font-weight : bold;
cursor : pointer;
}
#directory input#submit:hover {
color : #c0d542;
background-position : bottom;
}
/* 
================================================================== GENERAL TEST 
*/
#generateTest {
margin : 10px;
padding : 10px;
border:1px solid #3ca3b2;
color:#3ca3b2;
font-size:1.2em;
}
#generateTest p {
font-size:1.1em;
}
#generateTest label {
width : 190px;
float : left;
text-align : right;
padding-right : 10px;
font-size : 1.1em;
color:#474646;
}
#generateTest input {
margin : 0 0 5px 0;
}
#generateTest input#submit {
margin : 10px 0 10px 185px;
background : url(../../images/buttons/next.jpg) top;
border : none;
width : 178px;
height : 39px;
color : #b6c9cd;
padding : 0 0 10px 10px;
text-align : left;
font-weight : bold;
cursor : pointer;
}
#generateTest input#submit:hover {
color : #c0d542;
background-position : bottom;
}
input#submitForm {
margin : 10px;
background : url(../../images/buttons/next.jpg) top;
border : none;
width : 178px;
height : 39px;
color : #b6c9cd;
padding : 0 0 10px 10px;
text-align : left;
font-weight : bold;
cursor : pointer;
}
input#submitForm:hover {
color : #c0d542;
background-position : bottom;
}
/* 
================================================================== LINKS 
*/
#links {
font-size : 1.2em;
color : #474646;
}
#links a {
color : #474646;
}
#links a:hover {
text-decoration : none;
}
/* 
================================================================== GENERAL  
*/
.floatRight {
float : right;
}
.clear {
clear : both;
}
.error {
color : red;
font-weight : bold;
padding : 0 17px;
}
a.greenButton {
background: url(../../images/green-button.gif) top;
width : 113px;
height : 21px;
line-height:21px;
text-indent:5px;
color : #fff;
display:block;
text-decoration:none;
}
a.greenButton:hover {
color:#0e4c56;
}
ul.greenList li {
list-style-image:url(../../images/li.gif);
margin-left:15px;
}
/* 
================================================================== FORMS  
*/
fieldset.contact {}