/*
BASE (MOBILE) SIZE
	These are the mobile styles. It's what people see on their phones.
	Remember, keep it light: Speed is Important.
*/

/* typography */
html, form {
    height: 100%;
}

body {
    color: #666;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 1em;
    font-weight: 400;
    line-height: 1.2em;
    font-weight: normal;
    width:auto;
    height: 100%;
    min-height: 100%;
    z-index: 1;
}

#content {
    width:100%;
}

.clear {
    clear: both;
}

h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    line-height: 1.5em;
    margin: .45em 0;
    padding: 0;
}

h1, h2, h6 {
    text-transform: uppercase;
}

h2 {
    color: #D84E46;
    font-size: 1em !important;
    font-weight: 400;
}

input {
    font-family: 'Titillium Web', Arial, Helvetica, sans-serif;
    font-size: 1em;
    font-weight: 400;
}

/* links */
a, a:visited, a:active, a:hover {
    color: #333333;
}

    a:hover {
        text-decoration: none;
    }


/* Box sizing. Awesome thing. Read about it here: http://www.w3schools.com/cssref/css3_pr_box-sizing.asp */
* {
    box-sizing: border-box;
    -moz-box-sizing: border-box;
}

img {
    max-width: 100%;
}
/*Basic layout */

.errorlabel {
    color: #CC0000;
}

#container {
    max-width: 1400px;
    width: 100%;
    margin-left: auto;
    margin-right: auto; /*border: 1px solid #f4f4f4;*/
    position: absolute;
    min-height: 100%;
}

#innercontainer {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    b-order: 1px solid #f4f4f4;
}

#footeranchor {
    /*   position:absolute;      bottom:0;      width:100%*/
}

#footer {
    max-width: 100%;
    margin-top: 20px; /*height: 257px;*/
    position: relative;
    background-image: url('/Images/FooterBack.jpg');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}

    #footer img {
        width: 100%;
        height: auto;
    }

#footerinner {
    max-width: 100%;
    width: 100%;
    p-osition: absolute;
    top: 0; /*margin-left: auto;         margin-right: auto; z-index:10;         background-image: url('/images/footerback.jpg');         background-size: 100%;         background-repeat: no-repeat;         background-position: center;*/
    height: 100%;
}

#footerinnercontent {
    position: relative;
    margin-left: auto;
    margin-right: auto; /*border: 1px solid #ffffff;*/
    height: 100%;
    b-order: 1px solid #ffffff;
}

#footertop {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    height: 196px;
    color: #ffffff;
    font-size: 0.8em;
}

#footerbottom {
    width: 96%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    padding-top: 15px;
    padding-bottom: 5px;
    color: #ffffff; /*height:200px;*/
    font-size: 0.8em;
    font-weight: 300;
}

.footermenuholder {
    width: 46%;
    margin-right: 2%;
    float: left;
    padding: 0px;
}

#nortonseal {
    visibility: hidden;
    display: none;
    text-align: center;
}

#nortonsealphone {
  text-align:center;
}


ul.footermenu {
    color: #ffffff;
    list-style-type: none;
    margin-top: 10px;
    margin-left: 0px;
    padding: 0px;
}


    ul.footermenu li {
        margin-bottom: 10px;
        margin-left: 0px;
    }

    ul.footermenu a {
        color: #ffffff;
        text-decoration: none;
        font-size: 1.2em;
    }

/*
header stuff
*/

#header {
    width: 100%;
    min-height: 98px;
    b-order: 1px solid #000000;
    m-argin-bottom: 10px;
}

#headertop {
    height: 98px;
}

#logoholder {
    width: 60%;
}

    #logoholder img {
        max-width: 100%;
        height: auto;
        float: left;
        margin-top: 10px;
    }



#menuholder {
    display: none;
}

#menu {
    display: none;
}

#headeradvertholder {
    display: none;
}

#smallmenuholder {
    display: block;
    float: right;
    margin: 20px;
}

#littlemenu {
    height: 100%;
    width: 400px;
    position: absolute;
    right: -410px;
}

#littlemenuinner {
    height: 100%;
    width: 380px;
    background-color: #B6C40D;
    float: right;
}

#littlemenuclose {
    height: 20px;
    width: 20px;
    background-color: #B6C40D;
    float: left;
    margin-top: 80px;
}

ul.littlemenuitems {
    color: #ffffff;
    list-style-type: none;
    margin-top: 20px;
    margin-left: 0px;
    padding-left: 20px;
}


    ul.littlemenuitems li {
        margin-bottom: 10px;
        padding-bottom: 10px;
        margin-left: 0px;
        border-bottom: 1px solid #ffffff;
    }

    ul.littlemenuitems a {
        color: #ffffff;
        text-decoration: none;
        text-transform: uppercase;
    }

    ul.littlemenuitems .active li:hover {
        background-color: #9DA62A;
    }


/*Order form*/

#orderForm {
    width: 96%;
    margin: 0 2% 0 2%;
}

#orderformadditional {
    width: 96%;
    margin: 0 2% 0 2%;
}

.orderSections {
    padding-bottom: 10px;
    border-bottom: 2px solid #F4F4F4;
    margin-bottom: 10px;
    margin-top: 10px;
}


.orderCarInfo img {
    width: 100%;
    height: auto;
    margin-top: 10%;
}



.tdAlignLeft {
    width: 100%;
    float: left;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 5px;
}


.tdCCAlignLeft {
    text-align: left;
    width: 100%;
    float: left;
}

.tdAlignLeft2 {
    width: 51%;
    float: left;
    padding-top: 5px;
    padding-bottom: 5px;
    padding-right: 5px;
}


.tdCCAlignLeft2 {
    text-align: left;
    width: 50%;
    float: left;
}



.tdAlignLeftPostcodeLookup {
    width: 100%;
    float: left;
    padding: 5px;
}

.InputOrderForm {
    background-color: #E1E1E1;
    /*border: 0px solid #F4F4F4;*/
    border: 1px solid #b9c551;
    font-size: 1em;
    width: 100%;
    padding: 5px;
}

.inputOrderNotes {
    width: 100%;
}

.watermarked {
    background-color: #FFFFFF;
    color: #666666;
    border: 1px solid #b9c551;
    font-weight: bold;
    font-style: italic;
    font-size: 1em;
    width: 100%;
    padding: 5px;
}


.watermarkednotes {
    padding: 5px;
    width: 100%;
    background-color: #F4F4F4;
    color: #666666;
    border: 0px solid #F4F4F4;
    font-style: italic;
    font-size: 1em;
}

.orderInstructions {
    font-style: italic;
    color: #999999;
    margin-top: 10px;
    margin-bottom: 10px;
    width: 100%;
}



.postcodeLookupListBox {
    background-color: #F4F4F4;
    color: #666666;
    border: 0px solid #F4F4F4;
    font-style: italic;
    font-size: 1em;
    width: 540px;
    height: 120px;
    padding: 5px;
}


#orderCreditcard {
    float: left;
    width: 100%;
    position: relative;
}

.paddlock {
    padding-top: 11%;
    margin-top: 10px;
    background-image: url('/Images/Paddlock.png');
    background-repeat: no-repeat;
    background-size: cover;
    float: left;
    width: 11%;
}

#thawteseal {
    display: none;
}

#thawteseal2 {
    w-idth: 48%;
    p-osition: absolute;
    right: 0;
    top: 100px;
    clear:both;
    text-align:center;
}

.saveOrder {
    display: block;
    width: 115px;
    padding: 8px;
    color: #ffffff;
    background-color: #FF4300;
    text-transform: uppercase;
    text-align: center;
    float: right;
    margin-bottom: 10px;
}

a.saveOrder {
    text-decoration: none;
    font-weight: bold;
}

.errMessage {
    color: #CC0000;
}

.orderSections a {
    text-decoration: none;
    font-weight: normal;
    color: #FF9064;
}

    .orderSections a:hover {
        color: #c84e46;
    }

.orderCarInfo {
    padding-bottom: 15px;
    margin-bottom: 30px;
    position: relative;
}

.orderCarInfoShadow {
    position: absolute;
    height: 20px;
    bottom: 0px;
    width: 100%;
    background-repeat: no-repeat;
    background-image: url('/Images/OrderCarShadow.png');
    background-position: center;
}

.orderCarLabel {
    margin-bottom: 8px;
    color: #808080;
    font-size: 1em;
    font-weight: 600;
}

.orderCarText {
    margin-bottom: 8px;
    color: #000000;
    font-size: 1em;
    font-weight: 600;
}


/* page heads */

#pageheader {
    width: 100%; /*height: 75px;*/
    background-image: url('/Images/headimage_LG.jpg');
    background-position: center;
    background-size: cover;
}

#pageheaderinner {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 10px;
}


#pageheader h1 {
    margin: 0px;
    color: #ffffff;
    text-shadow: 2px 2px rgba(204,204,204,.5);
}

#carpageheader {
    font-size: 1.4em;
    margin-top: 5px !important;
    line-height: 1.1em;
    margin-left: 5px !important;
    padding-bottom: 15px;
}

#homepageheader {
    width: 100%;
    background-image: url('/Images/headimage_LG.jpg');
    background-position: center;
    padding-bottom: 15px;
}

#homepageheaderinner {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 10px;
}

#homestrapline {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
    clear: both;
}

#homepageheader h1 {
    margin: 0px;
    color: #ffffff;
    /*20150907t-ext-shadow: 2px 2px rgba(204,204,204,.5);*/
    text-shadow: 2px 2px rgba(204,204,204,.5);
    font-size: 1.8em;
    line-height: 1.3em;
}


#homerequestquote {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    clear: both;
    color: #fff;
    text-align: center;
    background-color: rgb(221,69,2);
    background-color: rgba(221,69,2,0.77);
    padding-bottom: 10px;
}

    #homerequestquote h2 {
        font-size: 1.3em !important;
        text-transform: none;
        color: #ffffff;
        font-weight: normal;
        margin-top: 15px;
    }

#homerequestquoteinner {
    p-adding-top: 15px;
    margin-bottom: 10px;
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

#homedropdowns {
}

.homeSearchDll > select {
    background-position: center;
    font-size: 1.3em;
    color: #666666;
    width: 100%;
    height: 50px;
    padding: 5px;
    margin-bottom: 15px;
    border: 0 !important; /*Removes border*/
    -webkit-appearance: none; /*Removes default chrome and safari style*/
    -moz-appearance: none; /* Removes Default Firefox style*/
    /*background: #FFFFFF url(/images/ddlBack.png) repeat center;*/
    background: #FFFFFF url(/images/ddlArrow.png) no-repeat 100% center;
    text-indent: 0.01px; /* Removes default arrow from firefox*/
    text-overflow: ""; /*Removes default arrow from firefox*/ /*My custom style for fonts*/
    b-ox-shadow: inset 0 0 5px rgba(000,000,000, 0.5);
}

#homesearchSubmit {
    padding-top: 12px;
    padding-bottom: 12px;
    width: 130px;
    background: #FFFFFF url(/images/submitbuttonback.png) repeat 190px center;
    margin-bottom: 10px;
}

    #homesearchSubmit a {
        color: #ffffff;
        text-decoration: none;
        font-size: 1.2em;
        text-transform: uppercase;
    }


#homespecialoffer {
    width: 100%;
    margin: 0px;
    background-color: #3B3838;
}


/*Request quote */

#requestQuote {
    width: 100%;
    padding: 0px;
    margin: 0px;
}

    #requestQuote > img {
        max-width: 100%;
        margin: 0px;
        margin-top: -10px;
    }

#requestQuoteInner {
    width: 100%;
    background-color: #f4f4f4;
    padding: 24px;
    margin: 0px;
    b-order: 1px solid #000000;
    h-eight: 100%;
}

.requestQuoteFields {
    margin-bottom: 8px;
}

    .requestQuoteFields label {
        width: 100%;
        clear: right;
        color: #666666;
        text-transform: uppercase;
        font-size: 0.8em;
        margin-bottom: 5px;
    }
/*@media only screen and (min-width:768px)*/
.requestQuoteDll {
    width: 100%;
    clear: right;
    color: #666666;
    text-transform: uppercase;
    font-size: 0.8em;
    padding: 5px;
    height: 50px;
    border: 0 !important;
    -webkit-appearance: none;
    -moz-appearance: none;
    background: #FFFFFF url(/images/ddlArrow.png) no-repeat 100% center;
    text-indent: 0.01px;
    text-overflow: "";
    b-ox-shadow: inset 0 0 5px rgba(000, 000, 000, 0.5);
}


    .requestQuoteDll::-ms-expand {
        display: none;
    }


#stepsbox {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

#stepsboxInner1 {
    width: 100%;
    margin-top: 20px;
    d-isplay: table !important;
}

    #stepsboxInner1 h1 {
        text-transform: none;
        font-size: 1.1em;
        margin: 0px;
        line-height: 1em;
    }

#stepsboxInner2 {
    width: 100%;
    margin-top: 20px;
    font-style: italic;
}

.stepcontanier {
    width: 100%;
    height: 140px;
    f-loat: left;
    text-align: left;
    display: table-row !important;
    margin-bottom: 15px;
    /*border-bottom: 1px solid #f4f4f4;*/
}

.stepicon {
    width: 25%;
    height: 100%;
    f-loat: left;
    display: table-cell !important;
    vertical-align: middle;
}

    .stepicon img {
        width: 80%;
        height: auto;
    }

.steptext {
    w-idth: 65%;
    f-loat: left;
    margin-left: 4%;
    font-size: 0.8em;
    height: 100%;
    display: table-cell !important;
    vertical-align: middle;
    font-weight: 300;
}



/*Special Offers Panel*/

/*.so_item {
    h-eight: 505px;
    background-color: #3B3838; 
    width: 100%;
    color: #ffffff !important;
    position: relative;
    padding-bottom: 64px;
}*/

.so_item {
    background-color: #3B3838;
    width: 100%;
    color: #ffffff !important;
    position: relative;
    padding-bottom: 100px;
}


.so_inner {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
}

.specialofferscontainer {
    width: 100%;
    background-color: #3B3838;
    color: #ffffff;
    height: 504px; /*padding:30px 30px 30px 30px;*/
}

/*.specialoffersheader {
    
    padding-top: 56px;
    padding-bottom: 20px;
}*/

.specialoffersheader {
    padding-top: 10px;
    padding-bottom: -8px;
}


.specialofferslink a {
    color: #62acc2; /*border:dotted 1px #62acc2;*/
}

.specialofferstitle {
    /* width: 100%;     padding-left: 10px;     border-top: solid 1px #CCCCCC;*/
    padding-top: 20px;
    font-size: 1.1em;
    margin-bottom: 15px;
    font-weight: 600;
    height: 60px;
}

.specialoffersdescription {
    /*width: 90%;     margin-left: 10px;*/
    margin-top: 20px;
    font-size: 0.85em;
    font-weight: 300;
    height: 130px;
}

    .specialoffersdescription a {
        text-decoration: none;
        color: #ff4406;
    }

.specialoffersprices {
    p-osition: absolute;
    bottom: 80px;
    width: 100%; /* width: 90%;     margin-left: 10px;     margin-right: auto;*/
    margin-top: 20px;
}

.specialofferslistprice {
    float: left;
    width: 82px;
    p-adding-left: 10px;
    height: 54px;
    padding-top: 7px;
}

.specialoffersofferprice {
    float: left; /*Background-Color:#62acc2;*/
    width: 169px;
    padding-left: 5px;
    padding-top: 7px;
    height: 57px;
    background-image: url('/images/blueArrowButton.png');
    background-size: 100%;
    margin-top: 22px;
    color: #000000;
    cursor: pointer;
}

.specialofferssave {
    b-order: dotted 1px #62acc2;
    padding-top: 18px;
    p-adding-bottom: 10px;
    background-color: #ff4300;
    text-align: center;
    text-transform: uppercase;
    font-size: 1.3em;
    position: absolute;
    width: 100%;
    b-ottom: -35px;
    height: 54px;
    margin-top: 30px;
}

/* Expertise scroller */

div.expertise_scroller {
    position: relative;
    overflow: hidden;
    width: 300px;
    height: 504px;
}

    div.expertise_scroller .items {
        width: 20000em;
        position: absolute;
    }

div.items div.item_wrapper {
    float: left;
    width: 305px;
    height: 504px;
    position: relative;
}

    div.items div.item_wrapper div.item_image {
        width: 260px;
        float: left;
    }

    div.items div.item_wrapper div.item_text {
        /*width:290px;*/
        width: 305px;
        float: right;
    }

div.expertise_navigation {
    position: absolute;
    top: 305px; /*left:334px;*/
    left: 200px;
}
/* position and dimensions of the navigator */

div.navi {
    margin: 8px 3px 0 3px;
    float: left;
}

/* items inside navigator */

.navi a {
    width: 10px;
    height: 10px;
    float: left;
    margin: 2px;
    background: url(../images/navigator.png) 0 0 no-repeat;
    display: block;
    font-size: 1px;
}

    /* mouseover state */

    .navi a:hover {
        background-position: 0 -10px;
    }

    /* active state (current page state) */

    .navi a.active {
        background-position: 0 -20px;
    }

a.browse {
    width: 31px;
    height: 31px;
    overflow: hidden;
    line-height: 120px;
    background-repeat: no-repeat;
    background-position: top left;
    display: block;
    cursor: pointer;
    float: left;
}

    a.browse.prev {
        background-image: url(../../images/prev.png);
    }

    a.browse.next {
        background-image: url(../../images/next.png);
    }


/* As seen in section */
#AsSeenIn {
    width: 100%; /* height: 300px; */
    padding-top: 20px;
    background-image: url('/images/AsSeenInBack.png');
    margin-top: 20px;
}

#AsSeenInInner {
    max-width: 1000px;
    margin-left: auto;
    margin-right: auto;
}

.boldTitle {
    font-size: 1.3em;
    font-weight: 400;
    margin: 0px;
}

.AsSeenInHolder {
    border: 1px dotted #ffffff;
    width: 45%; /*              12 % 6 across             18%; 4 across                          28%; 3 across            45% 2 across            */
    height: 50px;
    background-size: contain;
    background-repeat: no-repeat;
    -ms-background-position-x: 50%;
    -ms-background-position-y: 50%;
    background-position-x: 50%;
    background-position-y: 50%;
    float: left;
    margin: 2%;
}


/*Home testimonials*/

#homeTestimonialsHolder {
    max-width: 1400px;
    height: 300px;
    width: 91.3%;
    margin-left: auto;
    margin-right: auto;
}

#homeTestimonialsHolderInner {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}


.homeTestimonialH2 {
    m-argin-bottom: 45px;
    color: #656565;
    text-transform: none;
    font-size: 1.6em;
}

#hometestimonial {
    width: 100%;
    float: left; /*m-argin-top: 30px;*/
}

#hometestimonialinner {
    width: 100%; /* h-eight: 259px;*/
    background-color: #00b3d3;
    position: relative;
    padding-bottom: 83.2%;
}
/*  #hometestimonialinner:after
        {
            content:'';
            height:90%;
        } */ .hometestimonialQuote {
    position: absolute;
    width: 20%;
    height: 20%;
    background-size: contain;
    background-repeat: no-repeat;
    -ms-background-position-x: 50%;
    -ms-background-position-y: 50%;
    background-position-x: 50%;
    background-position-y: 50%;
    float: left;
}

.HTQS {
    background-image: url('/images/bluequotestart.png');
    top: 0;
    left: 0;
}

.HTQE {
    background-image: url('/images/bluequoteend.png');
    bottom: 0;
    right: 0;
}

#hometestimonialspeech {
    width: 100%;
    padding-bottom: 16.0064103%;
    background-image: url('/images/testimonialspeech.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 5%;
}

#hometestimonialText {
    color: #ffffff;
    font-size: 1.1em;
    p-adding: 5%;
    z-index: 100;
    float: left;
    position: absolute;
    top: 10%;
    width: 85%;
    left: 10%;
    line-height: 1.4em;
}
/* Honest John Home*/ #homeHJ {
    width: 100%;
    float: left;
    margin-left: 0%;
    m-argin-top: 30px;
}

#homeHJInner {
    width: 100%;
    background-color: #003c6e;
    position: relative;
    padding-bottom: 83.2%;
}

#homeHJText {
    color: #ffffff;
    font-size: 1.1em;
    p-adding: 5%;
    z-index: 100;
    float: left;
    position: absolute;
    top: 10%;
    width: 90%;
    left: 10%;
    line-height: 1.4em;
}

#homeHJSeal {
    width: 50%;
    padding-bottom: 50%;
    background-image: url('/images/hatlogo.png');
    position: absolute;
    top: -7%;
    right: -4%;
    background-size: contain;
    background-repeat: no-repeat;
    -ms-background-position-x: 50%;
    -ms-background-position-y: 50%;
    background-position-x: 50%;
    background-position-y: 50%;
}


#HJtestimonialinner {
    padding-bottom: 67.2%;
}

.strongJohn {
    font-weight: bold;
}

/*Home advert*/ #homeAdvert {
    display: none;
    width: 100%;
    float: left;
    margin-left: 0%;
    m-argin-top: 30px;
}

#homeAdvertInner {
    width: 100%;
    background-color: #003c6e;
    position: relative;
    padding-bottom: 83.2%;
    background-image: url('/images/adHolder.png');
    background-size: cover;
}

.colourband {
    height: 5px;
    background-image: url('/images/colourband.png');
    background-size: cover;
}

/* buy a car */

#buyacarinner {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#carsList {
    width: 100%;
    margin-top: 25px;
    padding-left: 1%;
    padding-right: 1%;
}

#buyCarRefineSearch {
    width: 100%;
}

.extraInfo {
    width: 100%;
    padding: 0px;
    margin-bottom: 15px;
}

.extraInfoHead {
    width: 100%;
    padding: 10px;
    color: #ffffff;
    text-transform: uppercase;
    background-color: #47b1d1;
}

.extraInfoText {
    width: 100%;
    padding: 10px;
    color: #000000;
    text-transform: none;
    background-color: #deedf2;
    font-size: 0.75em;
}

.listVariant {
    width: 100%;
    padding-top: 8px;
    padding-bottom: 8px;
    float: left;
    font-size: 0.8em;
    border-top: solid 1px #f6f6f6;
    height: 45px;
}

    .listVariant a {
        text-decoration: none;
        color: #FF9064;
    }

        .listVariant a:hover {
            color: #c84e46;
        }

/*Quoting */
#displayPriceActions {
    width: 200px;
    float: left;
}

#displayPrice {
    border-top: 1px solid #f6f6f6;
    border-bottom: 1px solid #f6f6f6;
    padding-top: 20px;
    padding-bottom: 20px;
}

.displayPriceItem {
}

    .displayPriceItem label {
        float: left;
        width: 52%;
    }

.displayPriceCost {
    float: right;
    width: 200px;
    height: 30px;
    background-repeat: no-repeat;
}

.displayPriceActionsItem {
    padding: 5px; /* background-size: 100%;     width: 220px;     background-image: url('/images/quoteactionback.png');*/
    background-repeat: no-repeat;
    width: 190px;
    background-image: url('/images/quoteactionbackMb.png');
    text-transform: uppercase;
    font-size: 0.7em;
    margin-top: 3px;
}

.displaySpecialOfferButtons {
    float: right;
    width: 340px;
}

.displayPriceActionsItem a {
    text-decoration: none;
    color: #ffffff;
}

.quoteactions {
    padding: 5px;
    background-color: #dd4502;
    text-transform: uppercase;
    font-size: 0.8em;
    font-weight: bold;
    margin-top: 10px;
    float: left;
    text-align: center;
    padding-left: 10px;
    padding-right: 10px;
    margin-right: 25px;
}

    .quoteactions a {
        text-decoration: none;
        color: #ffffff;
    }
/*end quoting*/
#chooseoptionsinner {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#optionsform {
    width: 96%;
    margin-top: 25px;
    margin-left: auto;
    margin-right: auto;
}

#optionTypes {
}

.optHeader {
    width: 100%;
    padding: 5px;
    background-color: #cccccc;
    text-transform: uppercase;
    font-size: 0.9em;
    position: relative;
    margin-top: 10px;
    margin-bottom: 10px;
}

.optHeaderRight {
    position: absolute;
    right: 5px;
    top: 5px;
}

.optHeaderLeft {
    width: 50%;
}

.optionItem {
    font-size: 0.9em;
    border-bottom: 1px solid #f4f4f4;
}

.optItemChk {
    float: left;
    padding: 3px;
    width: 10%;
}

.optItemDesc {
    float: left;
    padding: 3px;
    cursor: pointer;
    width: 65%;
}

.optItemCost {
    float: right;
    padding: 3px;
    width: 20%;
    text-align: right;
}

#optionsCost {
    width: 100%;
    margin-top: 25px;
    margin-bottom: 15px;
    font-size: 0.8em;
}

.optionsCostItem {
}

    .optionsCostItem label {
        width: 48%;
        float: left;
        margin-bottom: 10px;
        padding-right: 2%;
    }

.optionsCostTB {
    width: 50%;
    float: right;
    background-color: #f4f4f4;
    margin-bottom: 10px;
    border: 0px;
    padding-left: 1%;
}

#getDiscountButton {
    display: block;
    width: 50%;
    padding: 8px;
    color: #ffffff;
    background-color: #FF4300;
    text-transform: uppercase;
    text-align: center;
    float: right;
}

    #getDiscountButton a {
        text-decoration: none;
        font-weight: bold;
        color: #ffffff;
    }

#buyCarSearch {
    float: none;
}

#userForm {
    width: 100%;
}

.userFormPreamble {
    margin-top: 10px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    border-bottom: 1px solid #f4f4f4;
}

.tdName {
    width: 100%;
    margin-bottom: 10px;
}

.tdAddress1 {
    width: 100%;
    margin-bottom: 10px;
}

.tdAddress2 {
    width: 100%;
    margin-bottom: 10px;
}

.tdAddress1i {
    width: 100%;
    /*margin-bottom: 10px;
     text-transform:uppercase;*/
    font-weight: bold;
}

.tdAddress2i {
    width: 100%;
    /*margin-bottom: 10px;*/
    text-transform: uppercase;
}

.InputTitle {
    width: 50px;
    margin-right: 5px;
    margin-bottom: 5px;
}

.InputFirstLastName {
    width: 100%;
    margin-right: 5px;
    margin-bottom: 5px;
    margin-top: 5px;
}

.InputPostcode {
    width: 100px;
    margin-right: 5px;
    margin-bottom: 5px; /*float:right;*/
}

.btnFindAddress {
    float: right;
    padding: 2px;
}

.FormCheckBox {
    width: 5%;
    padding: 1%;
    float: left;
}

.FormlabelWideText {
    width: 80%;
    margin-left: 10%;
    float: left;
}

.saveContinue {
    display: block;
    w-idth: 228px;
    padding: 8px;
    color: #ffffff;
    background-color: #FF4300;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
}

.saveContinue2 {
    /* display: block;
    w-idth: 228px;*/
    padding: 0px 8px 0px 8px;
    color: #ffffff;
    background-color: #FF4300;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
}

.saveContinue a {
    text-decoration: none;
    font-weight: bold;
    color: #ffffff;
}

/*General Copy pages*/

.generalPageInner {
    margin-top: 25px;
}

#generalcontainer {
    width: 91.3%;
    margin-left: auto;
    margin-right: auto; /*padding-left: 1%;     padding-right: 1%;*/
}

#generalCopy {
    width: 100%;
    float: left;
}

#generalExtra {
    width: 100%;
    float: right;
}

/*Special Offers page*/

.specialoffer {
    width: 100%;
    padding: 10px;
    background-color: #f4f4f4;
    border-top: 1px solid #b9c551;
    border-right: 1px solid #b9c551;
    border-left: 1px solid #b9c551;
    border-bottom: 1px solid #b9c551;
}

.specialofferchosen {
    margin-top: 20px;
    m-argin-bottom: 20px;
    border-bottom: 3px solid red;
    border-top: 3px solid red;
    background-color: #f4f4f4;
}

.specialofferdescription {
    margin-bottom: 20px;
    font-size: 0.8em;
}

.sp_ourprice {
    font-size: 1.5em;
    color: #ffffff;
    font-weight: bold;
}

.specialOfferPrices {
    width: 100%; /*float: left;*/
}

.specialofferlistprice {
    float: left;
    width: 82px;
    padding-left: 10px;
    height: 44px;
    padding-top: 7px;
    margin-top: 22px;
}

.specialOfferPricesRight {
    float: right;
    margin-left: 5px;
}

.specialofferoffersaving {
    f-loat: left;
    height: 30px;
    w-idth: 82px;
    background-color: #ff4300;
    p-adding-left: 10px;
    p-osition: absolute;
    b-ottom: 0;
    color: #ffffff;
    text-align: center;
    padding: 5px;
    font-size: 1.1em;
    margin-bottom: 20px;
}

.specialofflink {
    float: right; /*  padding: 20px 30px 0px 0px;*/
    padding: 5px 30px 5px 5px;
}

.soSlider {
    /*width: 305px;*/
    margin-left: auto;
    margin-right: auto;
}

.RequestQuote {
    /*width: 305px;*/
    margin-left: auto;
    margin-right: auto;
}

/*Credentials page*/

#credentialsCopy {
    width: 100%;
    margin-top: 25px;
}

#HJcredentials {
    width: 100%;
    float: left;
    margin-top: 10px;
}

#HJcredentialsinner {
    width: 100%; /*h-eight: 259px;*/
    background-color: #00b3d3;
    position: relative;
    padding: 0% 0% 195% 0%;
}

#HJcredentialsspeech {
    width: 100%;
    padding-bottom: 1%;
    background-image: url('/images/testimonialspeech.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: 5%;
}

#saysHonestJohn {
    color: #00b3d3; /*font-weight: bold;*/
    font-style: italic;
    margin-left: 30%;
    padding-top: 25px;
    font-size: 1em;
}

#credentialsNav {
    float: right;
    width: 312px;
    padding-top: 10%;
    /*display:none;*/
}

.credentialsNavUL {
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}

#credentialsNavMb {
    float: right;
    width: 312px;
    padding-top: 5%;
}
/*#credentialsNavULMb
{
    list-style-type: none;
    padding: 0px;
    margin: 0px;
}*/
.credentialsNavUL a {
    text-decoration: none;
    color: #666666;
}

.credentialsNavUL li {
    list-style-type: none;
    display: block;
    background-color: #f4f4f4;
    padding: 10px;
    text-transform: uppercase;
    border-bottom: 1px solid #cccccc;
}

    .credentialsNavUL li:hover {
        background-color: #b9c331;
        color: #ffffff;
    }

li.CredentialsNavSelected {
    background-color: #b9c331 !important;
    color: #ffffff;
}

    li.CredentialsNavSelected > a {
        color: #ffffff !important;
    }

#HJSealCredentials {
    width: 100%;
    float: right;
    background-image: url('/images/HATLogo.png');
    background-size: contain;
    background-repeat: no-repeat;
    padding-top: 100%;
    margin-top: 50px;
}

#results {
    margin-top: 30px;
}

#moredata {
    width: 100%;
    background-color: #f4f4f4;
    border: 1px solid #cccccc;
    padding: 10px;
    text-align: center;
    cursor: pointer;
}

.OCCopy {
    margin-bottom: 25px;
}

.OCSource {
    /*font-weight:bold;*/
    margin-top: 10px;
    font-style: italic;
}

/*Contact page*/

.ContactCopy {
    width: 50%;
    float: left;
}

.ContactCopyright {
    width: 100%;
    float: left; /*padding-right:1%;*/
}

#map_canvas {
    width: 98%; /*float: right;*/
    height: 365px;
}

#directions_panel {
    width: 98%;
}

.dirButton {
    display: block;
    width: 100%;
    padding: 8px;
    color: #ffffff;
    background-color: #FF4300;
    text-transform: uppercase;
    text-align: center;
    float: left;
    margin-bottom: 10px;
}

    .dirButton a {
        text-decoration: none;
        font-weight: bold;
        color: #ffffff;
    }

.dirInput {
    width: 100%;
    background-color: #f4f4f4;
    border: 0px;
    margin-top: 10px;
    margin-bottom: 10px;
}

.clearmobile {
    clear: both;
}

/*Order page*/

#orderContainer {
    width: 100%;
    margin-left: auto;
    margin-right: auto;
}

#orderExtra {
    float: right;
    width: 100%;
}

.rbl_tax input[type="radio"] {
    width: auto;
    padding: 10px;
    margin-bottom: 20px;
}

.rbl_tax label {
    display: inline;
    padding: 10px;
    margin-bottom: 20px;
}

.rqShadow {
    width: 100%;
    margin-top: -10px;
}

/*Quote Guarantee*/
.quoteGuarantees {
    /*width: 305px; */
    margin-left: auto;
    margin-right: auto;
}

.quoteGuaranteesInner {
    width: 100%;
    background-color: #f4f4f4;
    margin: 0px;
}

.quoteGuaranteesText {
    border-bottom: solid 1px #ffffff;
    padding: 10px 15px 10px 24px;
    display: table;
}

.quoteGuaranteesTexts {
    /*float:left;*/
    display: table-cell;
    width: 80%;
    font-size: 0.7em;
    padding: 0px;
}

.quoteGuaranteesImage {
    width: 20%; /*float:right;*/
    display: table-cell;
    vertical-align: middle;
}

/*SEO pages*/

#SEOListingInner {
    width: 95%;
    margin-left: auto;
    margin-right: auto; /*padding-top: 25px;*/
    padding: 25px 5px 0px 5px;
}

#SEOListingItems {
    padding-top: 25px;
    border-top: 1px solid #f4f4f4;
}

    #SEOListingItems h1 {
        font-size: 1.5em;
    }

.SEOItem {
    width: 98%;
    vertical-align: top; /*height: 35px;*/
    background-image: url('/images/SEOArrow.png');
    background-position: 100%;
    background-repeat: no-repeat;
    display: inline-block;
    zoom: 1;
    background-color: #f4f4f4;
    padding: 8px 8px 8px 8px;
    margin-bottom: auto;
    margin-bottom: 10px; /*display:inline;*/
    font-size: 1 em;
}

.SEOItemPad {
    width: 24.5%;
    vertical-align: top;
    height: 35px; /*background-image: url('/images/SEOArrow.png');*/
    background-position: 100%;
    background-repeat: no-repeat;
    display: inline-block;
    zoom: 1; /*background-color: #f4f4f4;*/
    padding: 8px;
    margin-bottom: 10px;
}


.SEOStretch {
    text-align: justify;
    -ms-text-justify: distribute-all-lines;
    text-justify: distribute-all-lines;
}

.SEOItem a {
    text-decoration: none;
    text-transform: capitalize;
    color: #666666;
}

.surveyQuestion {
    /*border:solid 1px #666;*/
    padding: 1px;
    margin: 1px;
    background-color: #f4f4f4;
}

#opc_input {
    width: 48%;
    border: 1px solid #b9c551;
    font-weight: bold;
    padding: 5px;
    /*padding-right:1%;*/
}


.gridrow {
    color: #666 !important;
    text-transform: uppercase;
    width: 10px;
}


.sycUserDetails {
}


.CHB_RadioButtons label {
    margin-left: 10px;
    margin-right: 10px;
}

.SOCH_Mileage {
    h-eight: 35px;
    padding: 5px;
    vertical-align: central;
}

.SOCH_Cost {
    vertical-align: central;
    float: left;
    margin-right: 10px;
}

.SOCH_MileageP {
    background-color: #ffffff;
}

.SOCH_MileageB {
    background-color: #cccccc;
    c-olor: #000000;
}

.CH_ChoicesLabel {
    w-idth: 15%;
    f-loat: left;
}

.CH_ChoicesDDL {
    w-idth: 15%;
    f-loat: left;
}

.CH_description {
}

.CH_Choices {
    background-color: #9da62a;
    padding: 5px;
}

.displayCHSpecialOfferButtons {
    width: 100%;
}

.CHspecialofflink {
    width: 130px;
}

.submitSYCQ {
    display: block;
    w-idth: 115px;
    padding: 8px;
    color: #ffffff;
    background-color: #FF4300;
    text-transform: uppercase;
    text-align: center;
    text-decoration: none;
    margin-bottom: 10px;
}

a.saveOrder {
    text-decoration: none;
    font-weight: bold;
}