
/* === VANS BY MAIL CSS - last updated 05 April 2006 === */


/* --- GLOBALS --- */

* {margin: 0; padding: 0;}

html {margin: 0; padding: 0; width: 100%; height: 97%;}

h1,h2 {margin: 0; padding: 0; font-size: 0.1em;}

h3 {
font-size: 2.2em;
color: #001A29;
letter-spacing: -0.05em;
text-transform: lowercase;
font-weight: bold;
padding: 0.2em 0 0 0;
}

h4 {
top: -2em;
font-weight: bold;
font-size: 1.4em;
margin: 0 0 2em 66px;
}


body {
width: 100%;
height: 97%;
font-family: Verdana, Helvetica, Arial, sans-serif;
background-image: url(images/viewport_bg.gif);
background-repeat: repeat-x;
background-color: #B4BDC4;
font-size: 62.5%; /* This is [a] to unify cross-browser font displays, and [b] engineer it so that 1em==10px. Makes proportional sites easier! */
font-weight: normal;
color: #001A29;
}

.hide {
position: relative;
left: -2000px;
font-size: 0.1em;
}

.floatright {
float: right;
}

.floatleft {
float: left;
}

.cleared {
clear: both;
}

p {color: #001A29; font-size: 1.2em; padding: 1em; line-height: 1.4em;}

a {color: #f00; text-decoration: underline;}

.largeiconholder {
width: 60px;
height: 60px;
}

.smalliconholder {
width: 40px;
height: 40px;
}

.listingiconholder {
width: 25px;
height: 25px;
}




/* --- DIVs --- */

div#container {
width: 760px;
margin: 0 auto;
}

div#header {
height: 80px;
}

div#adspace-728 {
background-color: #001A29;
background-image: url(images/adspace_bg.gif);
background-repeat: repeat-y;
min-height: 1em;
max-height: 10em;
_height: 9.0em;
text-align: center;
}

div#adspace-468 {
background-color: #001A29;
background-image: url(images/adspace_bg.gif);
background-repeat: repeat-y;
min-height: 1em;
max-height: 10em;
text-align: left;
padding: 1.5em;
_margin: -2px 0 0 0; /* FIXES UNEXPLAINED IE BUG WHERE HEADER DIV IS 82px not 80 */
}

div#main {
background-color: #fff;
background-image: url(images/main_bg.gif);
background-repeat: repeat-y;
padding: 2em 1em;
}

div#content {
width: 480px;
}

div#side {
display: inline; /* FIXES IE 'DOUBLE FLOAT' BUG */
width: 244px;
text-align: center;
margin: 0 6px 0 0;
padding: 0;
}

div#search {
}

div.boxout-dark {
background-color: #4089A8;
width: 46em;
padding: 1em;
}

div.boxout-light {
background-color: #C3D8E0;
width: 46em;
padding: 1em;
}

div#footer {
background-image: url(images/footer_bg.gif);
background-repeat: no-repeat;
min-height:5em;
_height: 5em;
padding: 1.5em 0 0 6em;
}



/* --- HEADER --- */

h1 {
display: block;
width: 760px;
height: 80px;
background-image: url(images/header_grad.gif);
background-repeat: no-repeat;
padding: 0; margin: 0;
}



/* --- DIV: search --- */




div#search fieldset {
margin: 0 0 4em 0;
padding: 0;
border: 0 solid;
}

legend {
padding: 0;
margin: 0;
color: #fff;
font-size: 0.1em;
}

input,select {
background-color: #FFE07F;
border: 1px solid #CE6400;
display: inline;
font-size: 1.1em;
margin: 0 0.2em 0.6em 0.2em;
padding: 0;
width: 10em;
}

input {
width: 9.5em;
padding: 0.2em;
}

label {
display: block;
color: #CE6400;
font-size: 1em;
font-weight: bold;
text-align: right;
padding: 0 0.4em;
}

input.submit
{
border: 3px double #864100;
border-top-color: #CE6400;
border-left-color: #CE6400;
width: 10.2em;
padding: 0.1em;
background-image: url(images/input_bg.gif);
background-repeat: repeat-x;
font-weight: bold;
}

input.submit:active
{
border: 3px double #CE6400;
border-top-color: #864100;
border-left-color: #864100;
}

input.postcode {
width: 6em;
}


p.subh3 {
font-weight: bold;
font-size: 1.3em;
margin: -1em 0 0 0;
}



/* --- DIV: boxout-light --- */


div.boxout-light ul {
display: block;
padding: 1em 0;
margin: 1em 0 0 12px;
line-height: 1.6em;
list-style-type: none;
list-style-position: outside;
text-align: left;
}

div.boxout-light li {
display: block;
padding: 0 0 0.4em 20px;
margin: 0;
background-image:url(images/bullet_l.gif);
background-repeat: no-repeat;
font-size: 1.2em;
text-align: left;
}





/* --- DIV: boxout-dark --- */

div.boxout-dark h3 {
height: 60px;
background-image: url(images/h_rightarrow_60x60.gif);
background-repeat: no-repeat;
padding: 12px 0 0 66px;
}


/* --- DIV: boxout-contrast --- */

div.boxout-contrast h3 {
height: 60px;
background-image: url(images/h_rightarrow_60x60.gif);
background-repeat: no-repeat;
padding: 12px 0 0 66px;
}

h3.question {
background-image: url(images/h_question_l_40x40.gif);
}


/* --- DIV: side --- */

div#side p {
margin: 0; 
padding: 1em;
font-weight: bold;
}


div#main div#side a {
color: #fff;
font-size: 1.3em;
font-weight: bold;
text-align: right;
}

div#main div#side a:hover {
color: #FFC200;
}

div#side div.hr {
display: block;
width: 244px;
height: 16px;
background: #99C0D1 url(images/hr_side.gif) no-repeat scroll center;
padding: 0;
margin: 1.5em 0;
}

div#side div.hr hr {
  display: none;
}


div#side h3.contractvanhire {
background-image: url(images/contract_hire_header2.gif);
width: 244px;
height: 115px;
padding: 0;
margin: 0;
}


/* --- DIV: main --- */

.clause {
font-weight: normal;
font-size: 1em;
}

div#main a {
color: #CE6400;
}

div#main a:hover {
color: #FFC200;
}

div#main a:visited {
color: #000;
}

div#main table#listing-2col {
width: 100%;
border: 0 solid;
margin: 1em 0;
padding: 0;
}

div#main table#listing-2col td {
width: 50%;
border: 0 solid;
padding: 1em 0;
margin: 1em 0;
border-bottom-width: 1px;
border-color: #99C0D1;
}


div#main table#listing-2col h4 {
margin: 0;
padding: 0;
font-size: 1.3em;
color: #f00;
}

div#main table#listing-2col p {
padding: 0.3em 0.5em;
margin: 0 0 0 18px;
line-height: 1.3em;
font-size: 1.1em;
color: #CE6400;
}

div#main table#listing-2col p em {
font-weight: bold;
}

div#main table#listing-2col a {
font-weight: bold;
color: #001A29;
}

div#main table#listing-2col a:hover {
color: #99C0D1;
}

/* --- DIV: footer --- */

div#footer a {
color: #fff;
font-size: 1.1em;
}

div#footer ul,li {
display: inline;
text-align: center;
font-size: 1em;
}

div#footer li {
margin: 0 0.5em 0 0;
}

