html,body
{
    margin: 0;
    padding: 0;
}
body 
{
    font-family: Arial, Sans-Serif;
    font-size: 10pt;
    color: #333;
}
a
{
    color: #3366ff;
}
h3
{
    font-size: 12pt;
    margin: 12pt 0;
    padding: 0;
}
h4
{
    font-size: 10pt;
    margin: 10pt 0;
    padding: 0;
}

a:hover
{
    color: #6699ff;
}
div.clear-both
{
    clear: both;
}

div.header
{
    background: #3366ff url(/images/header-back.gif) left top repeat-x;
}
div.main
{
    background: #fff url(/images/header-shadow.gif) left top repeat-x;
    padding: 10px 0 0 0;
}
div.footer
{
    width: 850px;
    margin: 0 auto;
}

div.content
{
    width: 850px;
    margin: 0 auto;
}
div.main div.content
{
    width: 820px;
    padding: 0 15px;
}


/* Header */

div.header h1
{
    margin: 28px 0 0 0;
    padding: 0 0 0 7px;
    background: url(/images/logo.png) left top no-repeat;
    text-indent: -5000px;
    width: 377px;
    height: 67px;
    float: left;
}
    div.header h1 a
    {
        display: block;
        width: 100%;
        height: 100%;
    }

div.header div.top-nav
{
    margin: 0;
    padding: 0 15px 0 0;
    float: right;
    max-width: 400px;
}
    div.header div.top-nav div.top-nav-l
    {
        background: url(/images/topnav-l.png) left bottom no-repeat;
        height: 100%;
        float: left;
    }
    div.header div.top-nav div.top-nav-r
    {
        background: url(/images/topnav-r.png) right bottom no-repeat;
        height: 100%;
        float: left;
    }
    div.header div.top-nav div.top-nav-mid
    {
        background: url(/images/topnav-mid.png) left bottom repeat-x;
        height: 100%;
        float: left;
        margin: 0 9px 0 7px;
        padding: 0 10px 10px 10px;
    }

    div.header div.top-nav ul
    {
        list-style: none;
        margin: 0;
        padding: 0;
    }
        div.header div.top-nav ul li
        {
            float: left;
            margin: 0 0 0 10px;
            padding: 4px 0 4px 10px;
            text-transform: lowercase;
            background: url(/images/topnav-bullet.gif) left center no-repeat;
        }
        div.header div.top-nav ul li.first-child /* li:first-child */
        {
            background: none;
            margin-left: 0;
            padding-left: 0;
        }
            div.header div.top-nav ul li a
            {
                color: #ddd;
                text-decoration: none;
            }
            div.header div.top-nav ul li a:hover
            {
                color: #fff;
            }

div.header h2
{
    clear: right;
    margin: 23px 0 0 0;
    padding: 0 15px 0 0;
    float: right;
    background: url(/images/header-phone.png) left top no-repeat;
    text-indent: -5000px;
    width: 317px;
    height: 64px;
}

div.header div.main-nav
{
    clear: both;
    margin: 0;
    padding: 0 0 0 3px;
}
    div.header div.main-nav div.main-nav-l
    {
        background: url(/images/mainnav-l.png) left top no-repeat;
        height: 100%;
        float: left;
    }
    div.header div.main-nav div.main-nav-r
    {
        background: url(/images/mainnav-r.png) right top no-repeat;
        height: 100%;
        float: left;
    }
    div.header div.main-nav div.main-nav-mid
    {
        background: url(/images/mainnav-mid.png) left top repeat-x;
        height: 100%;
        float: left;
        margin: 0 13px 0 11px;
        padding: 6px 10px 0 10px;
    }
    div.header div.main-nav ul
    {
        list-style: none;
        margin: 0;
        padding: 0;
    }
        div.header div.main-nav ul li
        {
            float: left;
            margin: 0;
            padding: 4px 0 6px 20px;
            text-transform: uppercase;
            font-size: 9pt;
            font-weight: bold;
        }
        div.header div.main-nav ul li.first-child /* li:first-child */
        {
            background: none;
            margin-left: 0;
            padding-left: 0;
        }
            div.header div.main-nav ul li a
            {
                color: #ddd;
                text-decoration: none;
            }
            div.header div.main-nav ul li a:hover
            {
                color: #fff;
            }
            div.header div.main-nav ul li.selected a
            {
                color: #99ccff;
            }


/* Breadcrumb Trail */

ul.breadcrumb
{
    list-style: none;
    margin: 0;
    padding: 5px 0 15px 0;
}
    ul.breadcrumb li
    {
        margin: 0;
        padding: 0;
        float: left;
        display: inline;
        background: url(/images/breadbrumb-bullet.gif) right center no-repeat;
        margin-right: 6px;
        padding-right: 12px;
        color: #3366ff;
        font-size: 8pt;
    }
    ul.breadcrumb li:last-child
    {
        background: none;
        margin-right: 0;
        padding-right: 0;
    }
        ul.breadcrumb li a
        {
            color: #3366ff;
        }
        ul.breadcrumb li a:hover
        {
            color: #6699ff;
        }


/* Generic Box */

div.box
{
    background: #fff url(/images/box-back-paleblue50.png) left bottom repeat-x;
    margin: 0;
    padding: 0;
}
    div.box div.box-tl, div.box div.box-br, div.box div.box-tr, div.box div.box-bl
    {
        background: url(/images/box.png) no-repeat;
        margin: 0;
        padding: 0;
        width: 100%;
        height: 100%;
    }
    div.box div.box-tl { background-position: left top; }
    div.box div.box-br { background-position: right bottom; }
    div.box div.box-tr { background-position: right top; }
    div.box div.box-bl { background-position: left bottom; }

    div.box div.box-content
    {
        margin: 0;
        padding: 0;
    }

/* Menu Box */

div.box.menu
{
    background: #99ccff url(/images/box-back-blue300.png) left bottom repeat-x;
}
    div.box.menu div.box-content
    {
        padding: 10px 25px;
    }


/* Footer */

div.footer div.box
{
    background: #99ccff url(/images/box-back-blue100.png) left bottom repeat-x;
    font-size: 8pt;
}
    div.footer div.box div.box-content
    {
        padding: 10px 0 0 0;
    }

div.footer div.footer-col1
{
    width: 310px;
    float: left;
    padding: 10px 0 0 20px;
}
    div.footer div.footer-col1 h5
    {
        background: url(/images/footer-logo.png) left top no-repeat;
        margin: 0;
        padding: 0;
        width: 284px;
        height: 52px;
        text-indent: -5000px;
    }
        div.footer div.footer-col1 h5 a
        {
            display: block;
            width: 100%;
            height: 100%;
        }
    div.footer div.footer-col1 p.copyright
    {
        margin: 20px 0 0 4px;
        color: #fff;
    }

div.footer div.footer-col2
{
    width: 490px;
    float: left;
    padding: 10px 0;
}
    div.footer div.footer-col2 ul
    {
        width: 160px;
        float: left;
        margin: 0;
        padding: 0;
        list-style: none;
    }
    div.footer div.footer-col2 ul li
    {
        margin: 0 0 4px 0;
        padding: 0;
        font-weight: bold;
    }
    div.footer div.footer-col2 ul li a
    {
        color: #000;
    }
    div.footer div.footer-col2 ul li ul
    {
        margin: 4px 0 0 0;
    }
    div.footer div.footer-col2 ul li ul li
    {
        margin: 0;
        list-style-type: square;
        list-style-position: inside;
        font-weight: normal;
        font-size: 7pt;
    }


/* Content */

div.col1
{
    width: 275px;
    float: left;
}
div.col2
{
    width: 500px;
    float: left;
    padding: 0 0 0 40px;
}

/* Page Headings */

h3
{
    border-bottom: dashed 1px #000;
    padding-bottom: 5px;
}
h3.about-us
{
    background: url(/images/about-us.png) left top no-repeat;
    width: 107px;
    height: 19px;
    text-indent: -5000px;
}
h3.contact-us
{
    background: url(/images/contact-us.png) left top no-repeat;
    width: 129px;
    height: 19px;
    text-indent: -5000px;
}
h3.terms-and-conditions
{
    background: url(/images/terms-and-conditions.png) left top no-repeat;
    width: 228px;
    height: 19px;
    text-indent: -5000px;
}
h3.news
{
    background: url(/images/news.png) left top no-repeat;
    width: 65px;
    height: 19px;
    text-indent: -5000px;
}

/* left menu */

div.menu
{
    width: 290px;
}
div.menu.wide
{
    width: 360px;
}
    div.menu ul
    {
        list-style: none;
        margin: 0;
        padding: 0;
    }
        div.menu ul li
        {
            margin: 0;
            padding: 0;
            line-height: 1.7;
        }
        div.menu ul li a
        {
            text-decoration: none;
            color: #000;
        }
        div.menu ul li a:hover
        {
            text-decoration: underline;
        }

    div.menu h3
    {
        border-bottom: dashed 1px #000;
        padding: 0 0 10px 0;
        margin: 10px 0 6px 0;
    }
    div.menu h3 a
    {
        display: block;
        width: 100%;
        height: 100%;
    }

    div.menu h3.menu-motorinsurance
    {
        background: url(/images/menu-motorinsurance.png) 1px top no-repeat;
        width: 187px;
        height: 19px;
        text-indent: -5000px;
    }
    div.menu h3.menu-homeinsurance
    {
        background: url(/images/menu-homeinsurance.png) 1px top no-repeat;
        width: 164px;
        height: 17px;
        text-indent: -5000px;
    }
    div.menu h3.menu-travelinsurance
    {
        background: url(/images/menu-travelinsurance.png) left top no-repeat;
        width: 170px;
        height: 17px;
        text-indent: -5000px;
        margin-bottom: 20px;
    }

    div.menu.wide h3.menu-motorinsurance
    {
        background: url(/images/menu-motorinsurance-arrows.png) 1px top no-repeat;
        width: 313px;
        height: 19px;
        text-indent: -5000px;
    }
    div.menu.wide h3.menu-homeinsurance
    {
        background: url(/images/menu-homeinsurance-arrows.png) 1px top no-repeat;
        width: 313px;
        height: 17px;
        text-indent: -5000px;
    }
    div.menu.wide h3.menu-travelinsurance
    {
        background: url(/images/menu-travelinsurance-arrows.png) left top no-repeat;
        width: 313px;
        height: 17px;
        text-indent: -5000px;
        margin-bottom: 20px;
    }

/* Left offer */

/* Save 30% Intro */

span.save30pc-narrow
{
    display: block;
    background: url(/images/save30pc-narrow.png) left top no-repeat;
    width: 269px;
    height: 115px;
    text-indent: -5000px;
    float: left;
    margin: 10px 0 0 10px;
    padding: 0;
    border: none;
}

/* Product Detail boxes */

div.box.product-detail
{
    font-size: 9pt;
}
div.box.product-detail h3
{
    margin-bottom: 8px;
    padding-bottom: 10px;
}
div.box.product-detail ul
{
    margin: 0;
    padding: 0;
    font-weight: bold;
    color: #333;
    list-style: none;
}
div.box.product-detail p
{
    width: 200px;
}

div.box.product-detail a
{
    text-decoration: none;
    color: #333;
}
div.box.product-detail a:hover
{
    text-decoration: underline;
}

    /* Motor Insurance */
    div.box.product-detail.motor-insurance
    {
        background: #fefefe url(/images/box-back-car-insurance.jpg) right bottom no-repeat;
    }
    div.box.product-detail.motor-insurance div.box-content
    {
        min-height: 110px;
        padding: 4px 10px 45px 18px;
        width: 300px;
    }
    div.box.product-detail.motor-insurance h3.car-insurance
    {
        background: url(/images/box-title-car-insurance-arrows.png) left top no-repeat;
        width: 200px;
        height: 19px;
        text-indent: -5000px;
    }
    div.box.product-detail.motor-insurance h3.fourbyfour-insurance
    {
        background: url(/images/box-title-4x4-insurance-arrows.png) left top no-repeat;
        width: 202px;
        height: 19px;
        text-indent: -5000px;
    }
    div.box.product-detail.motor-insurance h3.ladydriver-insurance
    {
        background: url(/images/box-title-ladydriver-insurance-arrows.png) left top no-repeat;
        width: 291px;
        height: 24px;
        text-indent: -5000px;
    }
    div.box.product-detail.motor-insurance h3.modifiedcar-insurance
    {
        background: url(/images/box-title-modifiedcar-insurance-arrows.png) left top no-repeat;
        width: 308px;
        height: 19px;
        text-indent: -5000px;
    }
    div.box.product-detail.motor-insurance h3.japaneseimport-insurance
    {
        background: url(/images/box-title-japaneseimport-insurance-arrows.png) left top no-repeat;
        width: 357px;
        height: 24px;
        text-indent: -5000px;
    }

    /* Bike insurance */
    div.box.product-detail.bike-insurance
    {
        background: #ffffff url(/images/box-back-bike-insurance.jpg) right bottom no-repeat;
    }
    div.box.product-detail.bike-insurance div.box-content
    {
        min-height: 150px;
        padding: 4px 10px 45px 18px;
        width: 300px;
    }
    div.box.product-detail.bike-insurance h3.motorbike-insurance
    {
        background: url(/images/box-title-motorbike-insurance-arrows.png) left top no-repeat;
        width: 278px;
        height: 19px;
        text-indent: -5000px;
    }

    /* Scooter/Moped insurance */
    div.box.product-detail.scooter-insurance
    {
        background: #ffffff url(/images/box-back-scooter-insurance.jpg) right bottom no-repeat;
    }
    div.box.product-detail.scooter-insurance div.box-content
    {
        min-height: 150px;
        padding: 4px 10px 45px 18px;
        width: 300px;
    }
    div.box.product-detail.scooter-insurance h3.scooter-insurance
    {
        background: url(/images/box-title-scooter-insurance-arrows.png) left top no-repeat;
        width: 249px;
        height: 19px;
        text-indent: -5000px;
    }
    div.box.product-detail.scooter-insurance h3.moped-insurance
    {
        background: url(/images/box-title-moped-insurance-arrows.png) left top no-repeat;
        width: 236px;
        height: 24px;
        text-indent: -5000px;
    }

    /* Van insurance */
    div.box.product-detail.van-insurance
    {
        background: #ffffff url(/images/box-back-van-insurance.jpg) right bottom no-repeat;
    }
    div.box.product-detail.van-insurance div.box-content
    {
        min-height: 150px;
        padding: 4px 10px 45px 18px;
        width: 300px;
    }
    div.box.product-detail.van-insurance h3.van-insurance
    {
        background: url(/images/box-title-van-insurance-arrows.png) left top no-repeat;
        width: 202px;
        height: 19px;
        text-indent: -5000px;
    }

    /* Pickup insurance */
    div.box.product-detail.pickup-insurance
    {
        background: #ffffff url(/images/box-back-pickup-insurance.jpg) right bottom no-repeat;
    }
    div.box.product-detail.pickup-insurance div.box-content
    {
        min-height: 150px;
        padding: 4px 10px 45px 18px;
        width: 300px;
    }
    div.box.product-detail.pickup-insurance h3.pickup-insurance
    {
        background: url(/images/box-title-pickup-insurance-arrows.png) left top no-repeat;
        width: 240px;
        height: 24px;
        text-indent: -5000px;
    }

    /* Home Insurance */
    div.box.product-detail.home-insurance
    {
        background: #91dbff url(/images/box-back-home-insurance.jpg) right bottom no-repeat;
    }
    div.box.product-detail.home-insurance div.box-content
    {
        min-height: 176px;
        padding: 4px 10px 10px 18px;
        width: 300px;
    }
    div.box.product-detail.home-insurance h3.home-insurance
    {
        background: url(/images/box-title-home-insurance-arrows.png) left top no-repeat;
        width: 223px;
        height: 19px;
        text-indent: -5000px;
    }

    /* Travel Insurance */
    div.box.product-detail.travel-insurance
    {
        background: #91dbff url(/images/box-back-travel-insurance.jpg) right bottom no-repeat;
    }
    div.box.product-detail.travel-insurance div.box-content
    {
        min-height: 176px;
        padding: 4px 10px 10px 18px;
        width: 300px;
    }
    div.box.product-detail.travel-insurance h3.travel-insurance
    {
        background: url(/images/box-title-travel-insurance-arrows.png) left top no-repeat;
        width: 230px;
        height: 19px;
        text-indent: -5000px;
    }




/* Buttons */
a.get-a-quote-button
{
    display: block;
    background: url(/images/button-get-a-quote.png) left top no-repeat;
    width: 111px;
    height: 31px;
    text-indent: -5000px;
}

input.submit
{
    clear: both;
    float: left;
    width: 111px;
    height: 31px;
    background: url(/images/button-submit.png) left top no-repeat;
    text-indent: -5000px;
    margin: 0;
    border: 0;
    cursor: pointer;
}
input.send
{
    clear: both;
    float: left;
    width: 111px;
    height: 31px;
    background: url(/images/button-send.png) left top no-repeat;
    text-indent: -5000px;
    margin: 0;
    border: 0;
    cursor: pointer;
}
a.cancel
{
    display: block;
    float: left;
    width: 111px;
    height: 31px;
    background: url(/images/button-cancel.png) left top no-repeat;
    text-indent: -5000px;
    margin: 0 0 0 20px;
    border: 0;
}
a.accept
{
    display: block;
    width: 111px;
    height: 31px;
    background: url(/images/button-accept.png) left top no-repeat;
    float: left;
    text-indent: -5000px;
}
a.decline
{
    display: block;
    width: 111px;
    height: 31px;
    background: url(/images/button-decline.png) left top no-repeat;
    float: left;
    margin-right: 20px;
    text-indent: -5000px;
}

/* Form table */

table.form
{
    width: 100%;
}
    table.form th, table.form td
    {
        vertical-align: top;
    }
    table.form th
    {
        padding: 10px 10px 10px 0;
        text-align: left;
        font-weight: normal;
    }
    table.form td
    {
        padding: 10px 0;
    }



div.box.next-steps div.box-content
{
    padding: 0px 10px 4px 10px;
}
/*
    div.box.next-steps div.box-content ul
    {
        list-style: none;
        margin: 0;
        padding: 0;
    }
    div.box.next-steps div.box-content ul li
    {
        margin: 0 20px 0 0;
        padding: 0;
        float: left;
    }
*/
div.box.next-steps table
{
    width: 90%;
    margin: 0 auto;
}
div.box.next-steps table td
{
    text-align: center;
    vertical-align: middle;
}
div.box.next-steps table td a.get-a-quote-button
{
    margin: 4px auto 0 auto;
}


/* Existing Customers */

div.box.existing-customers
{
    width: 75%;
    background-image: url(/images/box-back-paleblue200.png);
    margin: 0 auto;
}
div.box.existing-customers h3.existing-customers
{
    background: url(/images/box-title-existingcustomers.png) left top no-repeat;
    width: 216px;
    height: 25px;
    text-indent: -5000px;
}
div.box.existing-customers div.box-content
{
    padding: 10px 50px;
}

/* Retrieve a Quote */

div.box.retrieve-a-quote
{
    width: 60%;
    background-image: url(/images/box-back-paleblue200.png);
    margin: 0 auto;
}
div.box.retrieve-a-quote h3.retrieve-a-quote
{
    background: url(/images/box-title-retrieveaquote.png) left top no-repeat;
    width: 186px;
    height: 24px;
    text-indent: -5000px;
}
div.box.retrieve-a-quote div.box-content
{
    padding: 10px 50px;
}

div.box.retrieve-a-quote label
{
    clear: both;
    display: block;
    float: left;
    width: 170px;
    font-weight: bold;
    font-size: 9pt;
    text-align: right;
}
div.box.retrieve-a-quote input, div.box.retrieve-a-quote select
{
    float: left;
    margin: 0 0 4px 10px;
}
div.box.retrieve-a-quote input.text
{
    width: 180px;
}


/* Icons */

div.icon
{
    float: right;
    background: center bottom no-repeat;
    width: 128px;
    height: 96px;
    margin: 0;
    padding: 0;
}
div.icon.car
{
    background-image: url(/images/icon-car.png);
}
div.icon.motorbike
{
    background-image: url(/images/icon-motorbike.png);
}
div.icon.performancecar
{
    background-image: url(/images/icon-performancecar.png);
}
div.icon.executive-car
{
    background-image: url(/images/icon-executive-car.png);
}
div.icon.moped
{
    background-image: url(/images/icon-moped.png);
}
div.icon.scooter
{
    background-image: url(/images/icon-scooter.png);
}
div.icon.pickup
{
    background-image: url(/images/icon-pickup.png);
}
div.icon.modifiedcar
{
    background-image: url(/images/icon-modifiedcar.png);
}

div.icon.travel
{
    background-image: url(/images/icon-travel.png);
}
div.icon.home
{
    background-image: url(/images/icon-home.png);
}
div.icon.van
{
    background-image: url(/images/icon-van.png);
}
div.icon.fourbyfour
{
    background-image: url(/images/icon-4x4.png);
}
div.icon.ladydriver
{
    background-image: url(/images/icon-ladydriver.png);
}
div.icon.japaneseimport
{
    background-image: url(/images/icon-japaneseimport.png);
}
div.icon.executivecar
{
    background-image: url(/images/icon-executivecar.png);
}


/* Motor Insurance */

ul.motor-insurance
{
    list-style: none;
    margin: 0;
    padding: 0;
}
ul.motor-insurance li.van-insurance, ul.motor-insurance li.bike-insurance
{
    float: left;
}
ul.motor-insurance div.box.product-detail.motor-insurance
{
    width: 500px;
}
ul.motor-insurance div.box.van-insurance
{
    float: left;
    width: 244px;
    margin: 0 10px 0 0;
    display: inline;
}
ul.motor-insurance div.box.bike-insurance
{
    float: left;
    width: 244px;
    margin: 0;
    display: inline;
}
ul.motor-insurance div.box.van-insurance div.box-content, ul.motor-insurance div.box.bike-insurance div.box-content
{
    padding: 15px 0 5px 15px;
}

ul.motor-insurance div.box.van-insurance h3, ul.motor-insurance div.box.bike-insurance h3
{
    background: left top no-repeat;
    text-indent: -5000px;
    width: 210px;
    height: 16px;
    margin: 0;
    padding: 0;
}
ul.motor-insurance h3 a
{
    display: block;
    width: 100%;
    height: 100%;
}
ul.motor-insurance div.box.van-insurance h3.van-insurance
{
    background-image: url(/images/box-van-insurance.png);
}
ul.motor-insurance div.box.bike-insurance h3.bike-insurance
{
    background-image: url(/images/box-bike-insurance.png);
}

ul.motor-insurance div.icon
{
    width: 110px;
}
ul.motor-insurance div.icon.van
{
    background-image: url(/images/icon-van2.png);
}

/* Quote Form */

iframe
{
    border: none;
}
div.box.quote-form
{
    width: 90%;
    background: #fff;
    margin: 0 auto;
}
div.box.quote-form div.box-content
{
    padding: 2px 3px 4px 0;
}

/* Existing Customers */

span.validator
{
    margin: 0;
    padding: 0 5px;
    color: #000;
    background: #ff9;
}
div.validation-summary
{
    margin: 0;
    padding: 10px;
    color: #000;
    background: #ff9;
}