﻿/*	--------------------------------------------------
	:: Media queries
	-------------------------------------------------- */

.productDetails { max-width: 44%; min-width: 44%}
.productOverview .fieldset, 
.productOverview .bookletCopy { width:100%; }
.productOverview .policyPricing h3 { height:auto; }

.productOverview { width: 100%;}
#product_1,
#product_3,
#product_5 { min-height:500px; }

/* 1023px - Footer Nav Wrap */
@media screen and (max-width: 1023px) {
    #footer ul { padding:0; background:none; text-align:left; height:auto; line-height:1.5em; }
    #footer li { display:block; border-bottom:1px solid #999999; border-right:0; padding:8px 0; background: #dedede; /* Old browsers */
    background: -moz-linear-gradient(top, #dedede 0%, #ffffff 30%, #ffffff 69%, #dedede 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dedede), color-stop(30%,#ffffff), color-stop(69%,#ffffff), color-stop(100%,#dedede)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #dedede 0%,#ffffff 30%,#ffffff 69%,#dedede 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #dedede 0%,#ffffff 30%,#ffffff 69%,#dedede 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #dedede 0%,#ffffff 30%,#ffffff 69%,#dedede 100%); /* IE10+ */
    background: linear-gradient(to bottom, #dedede 0%,#ffffff 30%,#ffffff 69%,#dedede 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dedede', endColorstr='#dedede',GradientType=0 ); /* IE6-9 */ }
    #footer li a { margin:0 10px; }
    #opening-times li { background:none; border:0; line-height:1.5em; padding:0; }
    #footer #additional { display:block; }
    #footer li {margin-bottom: 0px; }

}

@media screen and (max-width:990px) 
{
    .wrapper {width:100%; padding-left:1.5%; padding-right:1.5%;}
    h1 { font-size:28px; margin-top:95px; }
    .progress-bar span { display:none; }
    .progress-bar li.current { width:40%; }
    .progress-bar li { width:15%; }
    .progress-bar .current span { display:inline; }

}

@media screen and (max-width: 960px) {
    #content { margin: 48px auto 0px auto; float:none }
    #sidebar { margin: 48px auto 0px auto; float:none; width:675px }
}

@media screen and (max-width: 710px) {
    #wrapper { max-width:675px; }
    #banner { height:170px; }
    #header { height:auto; float:none; text-align:center; }
    #header a { float:none; background:#001532; display:block; }
    h1 { clear:both; float:none; font-size:18px; margin:0 auto; padding:10px 0; background:#F3F3F3; }
    #titletext { background:url("/images/jaguar/extended-warranty_small.jpg") no-repeat scroll 0 0 #FFFFFF; height:13px; width:283px; }
    .progress-bar { margin-bottom:20px; }
    .progress-bar li.current { width:52%; }
    .progress-bar li { width:12%; }
    .progress-bar li a { margin:0; }
    .formFields { margin:0; width:100%; text-align:center; }
    .formFields p { padding-left:15px; }
    .formFields label { display:block; margin:0; padding-left:20px; position:relative; text-align:left; width:100%; }
    .formFields input[type="text"], .formFields input[type="password"] { float:none; width:calc(100% - 40px); }
    .formFields select { float:none; width:calc(100% - 40px); }
    .formFields.tripleFields div { text-align:center; width:33%; margin:0; }
    .formFields.tripleFields div input, .formFields.tripleFields div select { width:75%; }
    
    .formFields.tripleFields .sortcode-dash { display: none;}
    .formFields.tripleFields div { display: inline-block;width: 32% !important; }
    
    #noRegManualSelectLink, #manualSelectLink { padding:0 15px; width:auto; text-align:left; }
    #vehicleRegistrationLookup, #postcodeLookup { margin:0 auto 20px; }
    .button { width:95%; }     
    #back { position:relative; float:left; margin:20px 10px 10px; bottom:0; }
    .productOverview { width:100%; text-align:left; }
    .productOverview .bookletCopy p { display:none; }
    div.productOverview div.productDetails { float:none; min-height:0 !important; }
    .formFields.checkboxFields div { margin:0 0 0 15px; overflow:hidden; }
    .formFields.checkboxFields input { float:left; }
    .formFields.checkboxFields div label { margin:0 10px 10px 0; padding-left:10px; width:auto; }
    #personalSummary, #vehicleSummary { float:none; width:100%; }
    #productSummary ul { float:none !important; width:auto; }
    #productSummary .policyDetails { margin: 0 20px; }
    #purchaseByCard, #purchaseByDirectDebit { clear:both; float:none; margin:0 auto; width:95%; }
    .buttonOptions div { overflow:visible; }
    label.checkLabel { margin:0; width:auto !important; padding-left:10px !important; }
    #customerAcceptance { margin-left:0; }
    .totalCost { padding-left:15px; text-align:left; }
    .buttonOptions label { right:auto; margin:15px 0 5px; padding:0; text-align:center; clear:both; display:block; position:relative; width:100%; }
    .sortcode-dash { right:-2px; }
    #PayByDirectDebitForm .checkboxFields label { padding-left:15px; width:auto; margin:0 10px 10px 0; }
    #PayByDirectDebitForm .checkboxFields div { margin:0 0 0 15px; clear:both; }
    #PayByDirectDebitForm .checkboxFields input { margin:1px 0 10px; }
    .print { left:15px; bottom:0; margin-top:20px; position:relative; }
    #btnClose { margin-top:20px; }
    .receipt #productSummary ul { padding-right:20px; width:auto; }
    #ddInstalmentDetails { clear:both; margin-top:20px; width:100%; }
    #ddInstalmentDetails ul { text-align:right; }
    #ddBankDetails { width:100%; }
    #jagTemplate #text1, #jagTemplate #text2, #jagTemplate #text3, #faqList { width:auto ; }
    .dealer-account { padding:0 6px; }
    .dealer-logout, .dealer-welcome { padding:0 7px; }
    .dealer-details { font-size:10px; }

    .formFields.checkboxFields div label { height:26px; line-height:26px; }
    .formFields.checkboxFields div label input { top:-4px; position:relative; }

    
    #dd-intro, #dd-outro, #acceptanceSummary { overflow:auto;  display:none; bottom:0; height:95%; left:0; margin:0 auto; position:fixed; right:0; top:0; background:#FFF; width:65%; z-index:2; }
    #view-dd, #view-ddo, #view-as { display:block; overflow:auto; }
    #btnPrint { display:none !important; }
    .productDetails { max-width: none;}


    #content {width: 100%; }     
    #sidebar {width: 100%; margin-top:0;}
    #sidebar > .additional-info {text-decoration:underline; cursor:pointer; text-align:center;text-transform: uppercase;}
    #sidebar > .additional-info:hover {text-decoration:none; }
    #sidebar .links-and-contact {display:none;}
    #sidebar #links li { border-bottom: 1px solid #ebebeb; }
    #sidebar #links li a {font-size:14px; text-transform: uppercase; display: block;padding: 12px 10px 10px 22.5px; }
}

/* 320px */
@media screen and (max-width: 320px) {
    #wrapper { max-width:320px; }
    #banner { height:84px; }
    .formFields input[type="text"], .formFields input[type="password"] { width:278px; }
    .formFields select, .button, #noRegManualSelectLink, #manualSelectLink { width:290px; }
    .formFields label { padding-left:15px; }
    .purchaseButton .button { width:250px; }
}
