html, body
{
    margin: 0;
    padding: 0;
}
body
{
    font: 12px/1.5em Arial, Helvetica, sans-serif;
    color: #000;
    background-color: #fff;
}
td{font-size: 12px;}
h1{
    font: 36px Arial, Helvetica, sans-serif;
}
h2
{
    font: 26px Arial, Helvetica, sans-serif;
    line-height: 1.3em;
    margin: 0 0 .5em;
}
h3
{
    font: bold 16px Arial, Helvetica, sans-serif;
    margin: .3em 0;
    color: #16569A;
}
h2 span{font-size: 16px; font-style: italic;}
h4
{
    font-size: 1em;
    margin: 0;
}
p{margin: 0 0 1em;}
a,
a:link,
a:visited{color: #4BB040;}
a:hover,
a:active{}
a img{border: none;}
ul{list-style-type: square;}
li{line-height: 1.5em;}
ol li{margin-bottom: .8em;}
form{margin: 0;}
fieldset{padding: 0;}
hr
{
    border: none;
    height: 1px;
    background-color: #ccc;
    color: #ccc;
}
abbr:hover{cursor: help;}

/* ~~~ === POSITIONING SELECTORS ============================================================= ~~~ */
#wrapper
{
    position: relative;
    margin: 10px;
    min-width: 946px;
}

/* ~~~ === MAIN HEADER ======================================================================== ~~~ */
#masthead
{
    height: 114px;
    background: #ebebeb url(../images/masthead_bg.gif) repeat-x 0 0;
}
    #masthead h1
    {
        width: 143px;
        height: 88px;
        background: url(../images/logo.gif) no-repeat 0 0;
        margin: 0;
    }
    #masthead h1 a span{display: none;}
    #auctionTime
    {
        position: absolute;
        top: 12px;
        left: 166px;
        list-style-type: none;
        margin: 0;
        padding: 0;
    }
    #auctionTime li
    {
        float: left;
        display: inline;
        line-height: 1.3em;
        margin-right: 16px;
    }
    #auctionTime li span{color: #16569A; font-weight: bold;}
    #auctionTime li.auction
    {
        background: url(../images/hammer.gif) no-repeat 0 0;
        padding-left: 30px;
    }
    #auctionTime li.auction span{font-size: 18px;}
    #auctionTime li.time
    {
        background: url(../images/clock.gif) no-repeat 0 0;
        padding: 2px 0 0 30px;
    }
    #auctionTime li.location
    {
        background: url(../images/crossmarker.gif) no-repeat 0 0;
        padding: 2px 0 0 30px;
    }
    #carSearch
    {
        position: absolute;
        top: 24px;
        left: 386px;
        margin: 0;
    }


/* ~~~ === MAIN NAVIGATION ====================================================================== ~~~ */
#menu
{
    position: absolute;
    top: 54px;
    left: 142px;
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#menu li
{
    float: left;
    display: inline;
    margin-right: 1px;
}
#menu li a
{
    display: block;
    float: left;
    line-height: 34px;
    background: url(../images/tab_right.gif) no-repeat 100% 0;
    text-decoration: none;
    color: #fff;
    font-size: 11px;
    padding: 0 14px 0 0;
}
#menu li a span
{
    display: block;
    background: url(../images/tab_left.gif) no-repeat 0 0;
    padding-left: 14px;
}
#menu li.active a,
#menu li.active a:hover{background-position: 100% -68px;}
#menu li a:hover{background-position: 100% -34px;}
#menu li.active a span,
#menu li.active a:hover span{background-position: 0 -68px;}
#menu li a:hover span{background-position: 0 -34px;}
#content
{
    margin: 16px 329px 0 32px;
    min-height: 620px;
    padding-bottom: 2em;
}

/* ~~~ === MAIN CONTENT AREA ==================================================================================== ~~~ */
#content li{margin: .5em 0;}
#rightcol
{
    width: 283px;
    position: absolute;
    top:132px;
    right: 0;
    background: transparent url(../images/vertical_dashed_line.gif) repeat-y 0 0;
    font-size: 11px;
}
    #rightcol h3
    {
        background-color: #4BB040;
        color: #fff;
        padding: 4px 12px;
        margin: 0;
    }
    #rightcol hr{width: 266px; margin: 0 0 1em;}
    #rightcol div.copy{margin: 12px 0  0 16px;}

/* ~~~ === FOOTER ================================================================================================== ~~~ */
#footer
{
    clear: both;
    background-color: #ebebeb;
    height: 76px;
    font-size: 11px;
    color: #3F3F3F;
}
    #footer h3
    {
        float: left;
        font: 42px/76px Arial, Helvetica, sans-serif;
        color: #16569A;
        margin: 0;
        padding-left: 33px;
    }
    #footer dl
    {
        float: right;
        display: inline;
        margin: 4px 80px 0 0;
    }
    #footer dl dt{font-weight: bold; line-height: 1.1em;}
    #footer dl dd{margin: 0; line-height: 1.3em;}

    p.copyright
    {
        font-size: 11px;
        color: #3F3F3F;
        background-color: #ebebeb;
        margin-top: 4px;
        padding-left: 33px;
        line-height: 34px;
    }


/* ~~~ TABLES ~~~ */
table.openingHours{margin: 0 0 1em;}
    table.openingHours caption
    {
        text-align: left;
        font-weight: bold;
    }
    table.openingHours th
    {
        text-align: left;
        padding: 2px 4px 2px 0;
        color: #16569A;
    }
    table.openingHours thead th{color: #000;}
    table.openingHours td
    {
        padding: 2px 4px;
        color: #16569A;
    }
        table.openingHours td span{color: #000;}

/* ~~~ CAR LISTINGS PAGE RESULTS TABLE ~~~ */
#listings #content{ margin: 16px 32px 0 32px;}
#listings #rightcol{display: none;}
table.recordstable
{
    width: 100%;
    text-align: center;
}
    table.recordstable thead th
    {
        font-weight: bold;
        padding: 2px;
        color: #16569A;
    }
    table.recordstable thead th a
    {
        text-transform: uppercase;
        color:#16569A;
    }
    table.recordstable tbody td{padding: 4px;}
    table.recordstable thead th.left,
    table.recordstable tbody td.left{text-align: left;}
    table.recordstable tbody tr{background-color: #EBEBEB;}
    table.recordstable tbody tr.even{background-color: #FCFCFC;}
    table.recordstable tbody tr.over{background-color: #D4D3D3;}

/* ~~~ CAR DETAILS PAGE ~~~ */
#photo div.noImage
{
    width: 250px;
    height: 188px;
    line-height: 188px;
    border: 8px solid #ebebeb;
    color: #16569A;
    text-align: center;
    font-weight: bold;
}
#photo span.noThumbImage
{
    display: block;
    width: 90px;
    height: 68px;
    border: 8px solid #ebebeb;
    color: #16569A;
    text-align: center;
    line-height: 68px;
}

#carDetail{margin: 0 464px 0 0 ;}
#carDetail table
{
    border-collapse: collapse;
    width: 100%;
}
#carDetail table th
{
    text-align: left; 
    width: 1%; 
    white-space: nowrap;
}
#carDetail table th,
#carDetail table td
{
    padding: 4px;
    border-bottom: 1px solid #ccc;
}
#pagination
{
    clear: both;
    padding-top: 24px;
}
#pagination p.previous{float: left;}
#pagination p.next
{
    float: right;
    text-align: right;
}
#pagination p.previous a,
#pagination p.next a
{
    text-decoration: none;
    font-weight: bold;
}
#pagination p.previous a:hover,
#pagination p.next a:hover{text-decoration: underline;}

/* ~~~ === CAR DETAIL PHOTOS === ~~~ */
#carPhotosContainer
{
    width: 442px;
    float: right;
}
#photo img
{
    display: block;
    padding: 8px;
    border: 1px solid #ccc;
}
#photoCarousel
{
    margin-left: 17px;
}
#photoCarouselContainer
{
    position: relative;
}
#photoCarouselContainer a.prev
{
    position: absolute;
    top: 35px;
    left: 0;
    display: block;    
    width: 16px;
    height: 16px;
    background: url(../images/icons/control_rewind.gif) no-repeat 0 0;
    text-indent: -9999em;
    outline: none;
}
#photoCarouselContainer a.next
{
    position: absolute;
    top: 35px;
    right: 0;
    display: block;
    width: 16px;
    height: 16px;
    background: url(../images/icons/control_fastforward.gif) no-repeat 0 0;
    text-indent: -9999em;
    outline: none;
}
/* ~~~ === CAR DETAIL THUMBS === ~~~ */
#carThumbs
{
    list-style-type: none;
    margin: 0;
    padding: 0;
}
#carThumbs li
{
    float: left;
}
#carThumbs a
{
    display: block;
    width: 90px;
    height: 67px;
    float: left;
    background-color: #fff;
    padding: 4px;
    border: 1px solid #ccc;
    margin: 0 1px;
}

/* ~~~ === CAR DETAIL ====== ~~~ */
#listingDetail
{
    text-align: center;
    font-size: 18px;
}
#listingDetail p.dealer{margin: 0;}
#listingDetail p.completedBy{font-size: 12px; margin: 0;}
#listingDetail p.buyToday
{
    font-size: 26px;
    line-height: 1.3em;
}


/* ~~~ === FORMS ====================================================== ~~~ */
table.formtable
{
    border: 1px solid #EBEBEB;
    margin: 1em auto;
}
table.formtable thead th,
table.formtable tbody th.rowHeader
{
    background-color: #ebebeb;
    color: #16569A;
    padding: 4px 13px;
    text-align: left;
}
table.formtable tbody th
{
    color: #4BB040;
    text-align: left;
    padding: 2px 4px 2px 46px;
    width: 1%;
    white-space: nowrap;
}
table.formtable tbody th label span
{
    font: 11px Arial, Helvetica, sans-serif;
}
table.formtable tbody td.padTop,
table.formtable tbody th.padTop{padding-top: 12px;}
table.formtable tbody td.padBottom,
table.formtable tbody th.padBottom{padding-bottom:12px;}

table.formtable tbody td{padding: 4px 46px 4px 4px}
table.formtable tbody td p
{
    margin: 0;
    line-height: 1em;
    font-size: 11px;
}
table.formtable tbody td.disclaimer{padding: 1em;}
table.formtable tbody td.disclaimer p
{
    margin: 0 0 1em;
    line-height: 1.3em;
}
table.formtable tbody td p input{vertical-align: middle;}
table.formtable tfoot td{padding: 4px 4px 16px 0;}
.input,
.isEmail
{
    font: 12px Arial, Helvetica, sans-serif;
    border: 1px solid #A3A3A3;
    background-color: #F2F2F2;
}
.input:focus,
.isEmail:focus
{
    font: 12px Arial, Helvetica, sans-serif;
    border: 1px solid #A3A3A3;
    background-color: #fff;
}
.invalid
{
    border: 1px solid red;
    background-color: #FDEBEB;
}
.button
{
    font: bold 12px Arial, Helvetica, sans-serif;
    background-color: #ebebeb;
    color: #005797;
}

/* ~~~ FAQS LIST ~~~ */
ol.faqs{margin: 1em 0 0;}
ol.faqs li span
{
    color: #16569A;
    font-weight: bold;
}
ol.faqs li{margin-bottom: .8em;}

/* ~~~ ==== CONTACT & ENQUIRIES PAGE =================================== ~~~ */
dl.contact dt{font-weight: bold;}
dl.contact dd{margin: 0;}
ul.contact
{
    list-style-type: none;
    margin: 1em 0;
    padding: 0;
}
#contactLeft
{
    width: 160px;
    position: absolute;
    top: 168px;
    left: 40px;
}
#contactRight
{
    padding-top: 1em;
    margin: 0 0 0 184px;
}
#contactRight table.formtable{margin: 0 auto 1em;}


/* ~~~ === CHRISTMAS HOURS ======================================= ~~~ */
#feastiveHours
{
    border: 3px double #5C89B8;
    float: left;
    padding: 1em 0;
    margin: 0 0 1em;
    background: #ebebeb url(../images/xmas_holly.gif) no-repeat 99% 100%;
}
#feastiveHours h2
{
    margin: 0 12px;
}
#feastiveHours table.openingHours
{
    float: left;
    margin: 1em 1em 0;
}
#tableRight{float: right;}

/* ~~~ === JOB OPPORTUNITY =============================================== ~~~ */
#opportunity
{
    border: 3px double #16569A;
    background-color: #EBEBEB;
    padding: 12px;
    width: 400px;
    margin-bottom: 1em;
}
#opportunity p{margin: 0 0 8px;}

#modalOverlay 
{
  background-color:#000;
}

#modalContainer 
{
    position: relative;
    height:341px;
    width:529px;
    left:50%;
    top:17%;
    margin-left:-264px;
}
#popup
{
    background: #fff url(../images/auction.jpg) no-repeat 0 0;
    height: 341px;
    text-align: center;
    color: #005797;
}
#popup h1
{
    position: absolute;
    top: 112px;
    left: 0;
    width: 100%;
    font: bold 36px/1.3em Arial, Helvetica, sans-serif;
    text-align: center;
    color: #000;
}
#close
{
    position: absolute;
    top: 12px;
    right: 12px;
}

/* ~~~ === SIGN BOXES =================================== ~~~ */
div.signbox
{
    width: 16em;
    padding: 12px;
    background-color: #16569A;
    border: 2px solid #5C89B8;
    margin-bottom: 1em;
}
div.signbox h3
{
    font: 18px Arial, Helvetica, sans-serif;
    color: #fff; 
    margin: 0;
}

/* ~~~ === CLASSES ============================== ~~~ */
.clear{clear: both;}
img.border{border: 8px solid #ebebeb;}
a:hover img.border{border: 8px solid #CDCDCD;}
.boldblue
{
    color: #16569A;
    font-weight: bold;
}
.img-right
{
    float: right;
    margin: 0 0 4px 12px;
}

/* ~~~ === PHOTO ====================================================================== ~~~ */


dl {float:left;text-align:center;}

dt,dd {width:100px;float:left;}

dt {margin-bottom:4em;}/* vertical space between the images */

dd {margin:90px 0 0 -20.5em;}

img {vertical-align:bottom;border:0;}