﻿
body {
}

a {
    color: #96451D
}

    a:hover {
        color: #96451D
    }

#InfoLinks li {
    padding: 6px;
}

label, select, button {
    vertical-align: middle;
}

.dropdownlist {
    display: block;
}

.form-group .control-label {
    text-align: left;
}

.ContactInformation input.form-control {
    max-width: none;
}

.ddl {
    width: 49%;
    display: inline;
    float: left;
}

.ddl-error-notification {
    float: left;
}

.panel-heading a:after {
    font-family: 'Glyphicons Halflings';
    content: "\e114";
    float: right;
    color: gray;
}

.panel-heading a.collapsed:after {
    content: "\e080";
}

.checkbox input[type="checkbox"] {
    margin-left: 0px;
}

input[type=date]::-webkit-inner-spin-button {
    -webkit-appearance: none;
    display: none;
}

.label-disabled {
    color: #aaa;
}

.border-rounded {
    border: 1px solid #ddd;
    border-radius: 4px;
}

legend {
    width: inherit;
    font-size: 14px;
    font-weight: bold;
}

.btn {
    border-style: solid;
    border-color: rgb(125, 125, 125);
    background-image: url(../images/nav-bg.png);
    background-size: contain;
    border-radius: 4px;
    font-weight: bold;
    color: rgb(100, 100, 100);
}

    .btn:hover {
        border-color: rgb(50, 50, 50);
    }

    .btn:active {
        outline: none;
    }

    .btn:focus {
        outline: none;
    }

.button-xlarge {
    font-size: 125%;
}

.next-button, .back-button {
    margin-left: 10px;
    margin-right: 10px;
    width: 35%;
    margin-bottom: 15px;
    border-radius: 5px;
    background: #f1e767; /* Old browsers */
    background: -moz-linear-gradient(top, #f1e767 0, #feb645 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f1e767), color-stop(100%,#feb645)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f1e767 0,#feb645 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f1e767 0,#feb645 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f1e767 0,#feb645 100%); /* IE10+ */
    background: linear-gradient(to bottom, #f1e767 0,#feb645 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645',GradientType=0 ); /* IE6-9 */
}

.button-pay {
    margin-left: 10px;
    margin-right: 10px;
    width: 100%;
    height: 100%;
    margin-bottom: 15px;
    border-radius: 5px;
    background: #f1e767; /* Old browsers */
    background: -moz-linear-gradient(top, #f1e767 0, #feb645 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f1e767), color-stop(100%,#feb645)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f1e767 0,#feb645 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f1e767 0,#feb645 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f1e767 0,#feb645 100%); /* IE10+ */
    background: linear-gradient(to bottom, #f1e767 0,#feb645 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645',GradientType=0 ); /* IE6-9 */
}

    .button-pay:hover {
        color: #000;
        border-color: #000;
    }

.button-pay-disable {
    background: #DCDCDC;
    border-color: #DCDCDC;
    border-radius: inherit;
    border-radius: 5px;
    padding: 0.5em 0;
    height: 40px;
    width: 100%;
}

.summary-price {
    background-color: #fff;
    padding-left: 12px;
    padding-right: 0px;
    margin-bottom: 0px;
}

    .summary-price h4 {
        margin-top: 2px;
    }

    .summary-price label {
        font-size: 14px;
    }

.label-info {
    font-size: 110%;
    background-color: rgba(110, 99, 74, 0.75);
}

#WebDiscount {
    border: darkgray solid 1px;
    border-radius: 4px;
    padding: 10px;
    margin-bottom: 15px;
    margin-top: 15px;
    /*-webkit-box-shadow: 6px 6px 24px -1px rgba(191,191,191,1);
    -moz-box-shadow: 6px 6px 24px -1px rgba(191,191,191,1);*/
    /*box-shadow: 6px 6px 24px -1px rgba(191,191,191,1);*/
    background-color: lightyellow;
}

#WebDiscountModal, #MilitaryDiscountModal, #ErrorModal, #PriceErrorModal {
    padding-left: 20px !important;
    padding-right: 20px !important;
    padding-top: 40px !important;
    text-align: center;
}

    #shopperApprovedModal .close,
    #WebDiscountModal .close,
    #MilitaryDiscountModal .close,
    #VinNotFoundModal .close,
    #PriceErrorModal .close,
    #ErrorModal .close,
    #BookingNotFoundModal .close,
    #BookingCancelledModal .close,
    #LoginFailedModal .close,
    #NoResultsModal .close,
    #NoVINResultsModal .close,
    #PasswordChangedModal .close,
    #PasswordSentModal .close,
    #InvalidDatesModal .close,
    #CutoffDatesModal .close {
        float: none;
    }

#EstimatedPrice {
    display: inline-block;
    white-space: normal;
    text-align: right;
}

#PriceMessage {
    text-align: right;
}

#PriceWarning {
    text-align: left;
}

#ServiceSummary label {
    padding-left: 0px;
}

#popover {
    background: none;
    border: none;
}

img#Military {
    float: left;
    width: 98px;
    height: 65px;
    margin-right: 15px;
    margin-top: 10px;
}

textarea#Modifications {
    max-width: none;
}

.row.form-group div {
    padding-left: 0px;
    padding-right: 0px;
}

.row.form-group input {
    width: 50%;
}

input#VIN, input#BookingNumber {
    border-top-right-radius: 0px;
    border-bottom-right-radius: 0px;
}

button#LookupVIN,
button#SubmitPOVTrackingRequest,
.DealerTracking button#SearchTop {
    padding-left: 2%;
    padding-right: 2%;
    border-top-left-radius: 0px;
    border-bottom-left-radius: 0px;
}

#VehicleInfo {
    margin-left: -30px;
    padding-left: 10px;
}

#VehicleMessage span {
    font-weight: normal;
}

.vehicle-info-label {
    padding: 0px;
}

.ScheduleInfo {
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 0px;
    padding-right: 0px;
}

    .ScheduleInfo p {
        color: black;
    }

#VehicleContainer {
    border: 1px solid #ddd;
    border-radius: 4px;
    padding-left: 5px;
    padding-bottom: 10px;
}

    #VehicleContainer label {
        padding-left: 15px;
    }

ul#VehicleList li {
    border: none;
    padding-top: 0px;
    padding-bottom: 0px;
}

.no-padding {
    padding: 0px;
}

.no-margin {
    margin: 0px;
}

.panel-title {
    font-weight: bold;
}

.table {
    margin-bottom: inherit;
}

    .table > tbody > tr > td {
        border-top: none;
    }

#RemoveVehicle {
    border-radius: 5px;
    background: none;
    border: none;
    color: rgba(100,0,0,0.8);
}

    #RemoveVehicle:hover {
        color: #C50000;
    }

div.order-summary {
    max-height: 190px;
    overflow-y: scroll;
    border: none;
    padding: 10px;
}

#PriceBreakdown .text-right {
    padding-right: 30px;
}

.vehicle-fee {
    text-indent: 20px;
}

.StateSelector {
    padding-left: 8px;
    margin-top: 0px !important;
    max-width: none !important;
}

.no-max-width {
    max-width: none;
}

.info-box {
    margin-top: 30px;
    padding: 8px;
    margin-left: auto;
    margin-right: auto;
    text-align: center;
}

    .info-box span {
        max-width: 500px;
        display: block;
        margin-left: auto;
        margin-right: auto;
    }

button.close {
    opacity: 0.5;
}

    button.close:hover {
        opacity: 0.7;
    }

/********************************/
/* styles for validation helpers */
.field-validation-error {
    color: #a94442;
    font-weight: bold;
}

.field-validation-valid {
    display: none;
}

input.input-validation-error {
    border: 1px solid #a94442;
}

input[type="checkbox"].input-validation-error {
    border: 0 none;
}

select.input-validation-error {
    border: 1px solid #a94442;
}

.validation-summary-errors {
}

.validation-summary-valid {
    display: none;
}

.testimonial {
    font-style: italic;
    color: #555;
    width: 100%;
    display: block;
    padding-top: 8px;
}

.testimonial-signature {
    font-weight: bold;
    color: #555;
    width: 100%;
    display: block;
    padding-bottom: 8px;
}

span#HorizontalScroll {
    margin-top: 30px;
    font-size: 22px;
    color: #333;
}

@import url(http://fonts.googleapis.com/css?family=Lato:300,400,700);

@font-face {
    font-weight: normal;
    font-style: normal;
    font-family: 'codropsicons';
    src: url('../fonts/codropsicons/codropsicons.eot');
    src: url('../fonts/codropsicons/codropsicons.eot?#iefix') format('embedded-opentype'), url('../fonts/codropsicons/codropsicons.woff') format('woff'), url('../fonts/codropsicons/codropsicons.ttf') format('truetype'), url('../fonts/codropsicons/codropsicons.svg#codropsicons') format('svg');
}


.clearfix:before,
.clearfix:after {
    content: '';
    display: table;
}

.clearfix:after {
    clear: both;
}

.wrap {
}

    .wrap > div {
        float: left;
        overflow: hidden;
        padding: 0 0 8em;
        height: 275px;
        width: 50%;
        text-align: center;
    }

        .wrap > div h2 {
            text-transform: uppercase;
            letter-spacing: 1px;
            margin: 0;
            padding: 4em 0 5em;
            font-size: 0.85em;
        }


/* Common styles and resets */

.dotstyle ul {
    position: relative;
    display: inline-block;
    margin: 0;
    padding: 0;
    list-style: none;
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.dotstyle li {
    position: relative;
    display: block;
    float: left;
    margin: 0 16px;
    width: 16px;
    height: 16px;
    cursor: pointer;
}

    .dotstyle li a {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        outline: none;
        border-radius: 50%;
        background-color: #6e634a;
        background-color: rgba(110, 99, 74, 0.5);
        text-indent: -999em; /* make the text accessible to screen readers */
        cursor: pointer;
        position: absolute;
    }

        .dotstyle li a:focus {
            outline: none;
        }

/* progress */

.dotstyle-progress li {
    border: 2px solid #6e634a;
    border-radius: 50%;
    z-index: 1;
    -webkit-transition: border-color 0.3s ease;
    -moz-transition: border-color 0.3s ease;
    -o-transition: border-color 0.3s ease;
    transition: border-color 0.3s ease;
}

    .dotstyle-progress li a {
        top: auto;
        bottom: 250%;
        left: 50%;
        visibility: hidden;
        padding: 0 10px;
        width: auto;
        height: auto;
        border-radius: 0;
        background-color: #6e634a;
        color: #fff;
        text-indent: 0;
        line-height: 1;
        padding: 5px;
        white-space: nowrap;
        opacity: 0;
        -webkit-transform: translateX(-50%) translateY(-50%);
        -moz-transform: translateX(-50%) translateY(-50%);
        -ms-transform: translateX(-50%) translateY(-50%);
        -o-transform: translateX(-50%) translateY(-50%);
        transform: translateX(-50%) translateY(-50%);
        -webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
        -moz-transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
        -o-transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
        transition: transform 0.3s ease, opacity 0.3s ease, visibility 0s 0.3s ease;
    }

        .dotstyle-progress li a::after { /* http: //cssarrowplease.com/ */
            position: absolute;
            left: 50%;
            margin-left: -10px;
            width: 0;
            height: 0;
            border: solid transparent;
            border-width: 10px;
            border-color: transparent;
            border-top-color: #6e634a;
            content: '';
            pointer-events: none;
            top: 99%;
            -webkit-backface-visibility: hidden;
            -moz-backface-visibility: hidden;
            backface-visibility: hidden;
            -webkit-transition: opacity 0.3s ease;
            -moz-transition: opacity 0.3s ease;
            -o-transition: opacity 0.3s ease;
            transition: opacity 0.3s ease;
        }

    .no-touch .dotstyle-progress li:hover a,
    .dotstyle-progress li.current a {
        background-color: #6e634a;
        z-index: 100;
        visibility: visible;
        opacity: 1;
        -moz-transform: translateX(-50%) translateY(0);
        -ms-transform: translateX(-50%) translateY(0);
        -o-transform: translateX(-50%) translateY(0);
        -webkit-transform: translateX(-50%) translateY(0);
        transform: translateX(-50%) translateY(0);
        -webkit-transition: -webkit-transform 0.3s ease, opacity 0.3s ease;
        -moz-transition: transform 0.3s ease, opacity 0.3s ease;
        -o-transition: transform 0.3s ease, opacity 0.3s ease;
        transition: transform 0.3s ease, opacity 0.3s ease;
    }



    .dotstyle-progress li.current {
        border-color: #6e634a;
        background-color: #6e634a;
    }

    .dotstyle-progress li:hover {
        z-index: 100;
    }

    .dotstyle-progress li a:hover,
    .dotstyle-progress li a:focus {
        background-color: #6e634a;
    }

.no-touch .dotstyle-progress ul:hover li.current a {
    opacity: 0.4;
}

.dotstyle-progress ul li.current:hover a {
    opacity: 1;
}

.dotstyle ul li.incomplete {
    cursor: default;
}

    .dotstyle ul li.incomplete a {
        border: solid;
        border-color: rgb(110, 99, 74);
        opacity: 0.5;
        background: none;
        cursor: default;
    }

/* Scale up Progress */

.dotstyle-scaleup li a {
    -webkit-transition: -webkit-transform 0.3s ease, background-color 0.3s ease;
    -moz-transition: transform 0.3s ease, background-color 0.3s ease;
    -o-transition: transform 0.3s ease, background-color 0.3s ease;
    transition: transform 0.3s ease, background-color 0.3s ease;
}

    .dotstyle-scaleup li a:hover,
    .dotstyle-scaleup li a:focus {
        background-color: #6e634a;
    }

.dotstyle-scaleup li.current a {
    background-color: #6e634a;
    -webkit-transform: scale(1.3);
    -moz-transform: scale(1.3);
    -ms-transform: scale(1.3);
    -o-transform: scale(1.3);
    transform: scale(1.3);
}

.flip-scroll-navigation {
    margin-top: 30px;
    font-size: 18px;
    padding: 0;
    text-align: right;
}

    .flip-scroll-navigation span {
        color: #555;
        cursor: pointer;
        padding-left: 5px;
        padding-right: 5px;
    }

        .flip-scroll-navigation span:hover {
            color: #000;
        }

        .flip-scroll-navigation span.disabled {
            color: #ccc;
            cursor: default;
        }

.flip-scroll-above {
    margin-top: 30px;
    display: table;
}

    .flip-scroll-above div {
        display: table-cell;
        float: none;
    }

/*Page-specific styles*/

.VehicleInformation .form-horizontal .form-group label {
    margin-top: 7px;
    padding-left: 0px;
    padding-right: 0px;
}

.VehicleInformation .checkbox label, .ContactInformation .checkbox label {
    margin-top: -2px;
}

.ContactInformation .row label {
    margin-top: 7px;
}

.OrderComplete #ShipAnotherVehicle button {
    margin-left: 15px;
    margin-right: 15px;
    width: 150px;
}

.ShipmentInformation table#VehicleDetails {
    width: 100%;
}

.ShipmentInformation .table-container {
    border-radius: 4px;
    background-color: rgba(200,200,200,0.3);
    overflow: hidden;
    padding-left: 5px;
}

.ShipmentInformation td, .ShipmentInformation th {
    padding: 2px;
}

.ShipmentInformation tr:not(:last-child), .ShipmentInformation thead tr {
    border-bottom: 1px solid white;
}

.ShipmentInformation h4 {
    margin-top: 30px;
}

.ShipmentInformation button#TerminalLocations {
    margin-left: auto;
    margin-right: auto;
    display: block;
}

.EnterShipment input#BookingNumber, .ShipmentInformation input#BookingNumber {
    font-weight: bold;
}

.DealerTracking label, .VesselSchedule label {
    text-transform: uppercase;
}

.DealerTracking .modal-body label {
    text-transform: none;
}

.DealerTracking input,
.DealerTracking select,
.VesselSchedule input,
.VesselSchedule select {
    background-color: #eeeeee;
    border-radius: 1px;
    font-weight: bold;
    max-width: none;
    padding-left: 7px;
    padding-right: 7px;
}

.DealerTracking a {
    color: black;
}

.DealerTracking h3 {
    color: #555;
}

.DealerTracking .panel {
    border: none;
}

.DealerTracking .panel-heading {
    padding-left: 0px;
    background: none;
}

    .DealerTracking .panel-heading a, .DealerTracking label.control-label {
        color: #555;
    }

        .DealerTracking .panel-heading a:after {
            font-family: 'Glyphicons Halflings';
            content: "\2212";
            float: right;
            color: #555;
        }

        .DealerTracking .panel-heading a.collapsed:after {
            content: "\002b";
        }

.DealerTracking select {
    margin-top: 0px;
}

.DealerTracking span#HorizontalScroll {
    margin-top: 12px;
}

.DealerTrackingResults,
#VesselScheduleSearchResults {
    background-color: rgb(238,238,238);
}

    .DealerTrackingResults th,
    .DealerTrackingResults td,
    #VesselScheduleSearchResults th,
    #VesselScheduleSearchResults td {
        padding: 4px;
    }

    .DealerTrackingResults tr,
    #VesselScheduleSearchResults tr {
        border-bottom: 1px solid white;
    }

.DealerTracking #VehicleInformationModal .modal-header {
    background-color: #eee;
}

.DealerTracking #VehicleInformationModal table {
    width: 100%;
}

.DealerTracking #VehicleInformationModal .table-title {
    display: block;
    padding-top: 20px;
    padding-bottom: 10px;
    font-weight: bold;
}

.DealerTracking #VehicleInformationModal .table-header {
    width: 25%;
}

.DealerTracking #VehicleInformationModal .modal-content {
    max-height: 500px;
    overflow: auto;
}

.DealerTracking table#StatusSummary {
    font-size: 12px;
    width: 100%;
}

    .DealerTracking table#StatusSummary thead {
        border-bottom: 1px solid black;
    }

    .DealerTracking table#StatusSummary th, .DealerTracking table#StatusSummary td {
        padding-left: 3px;
        padding-right: 3px;
    }

    .DealerTracking table#StatusSummary tbody td:not(:first-child) {
        border-left: 1px solid #999;
    }

    .DealerTracking table#StatusSummary tbody tr:not(:first-child) {
        border-top: 1px solid #999;
    }

.DealerTracking #ResetPasswordError {
    margin-top: 10px;
    display: block;
    color: darkred;
    font-weight: bold;
}

.DealerTracking #DealerTrackingResultsHeader th,
.DealerTracking #DealerTrackingResults th {
    white-space: nowrap;
}

.DealerTracking button#ExportToExcel,
.VesselSchedule button#ExportToPDF {
    margin-left: 30px;
}

.DealerTracking input[type="date"] {
    -webkit-appearance: none;
    padding-top: 0px;
}

.VesselSchedule #VesselScheduleSearchResults .RowCutoffDatesLabel {
    cursor: pointer;
}

    .VesselSchedule #VesselScheduleSearchResults .RowCutoffDatesLabel:hover {
        text-decoration: underline;
    }

.VesselSchedule #CutoffSummary {
    width: 100%;
}

.VesselSchedule .btn {
    margin-top: 20px;
    width: 100%;
}

.VesselSchedule th, .VesselSchedule th a {
    color: black;
}


.ui-dialog-osx {
    -moz-border-radius: 10px 10px 10px 10px;
    -webkit-border-radius: 10px 10px 10px 10px;
    border-radius: 10px 10px 10px 10px;
    border-width: 14px 0px 30px 0px;
    font-family: Arial, Helvetica, sans-serif;
    background-color: navajowhite;
    opacity: 1.0;
}


.ui-dialog {
    opacity: 1.0;
    background-color: ActiveBorder;
    border-radius: 10px 10px 10px 10px;
}



#shopperApprovedModal {
    padding-left: 2px !important;
    padding-right: 2px !important;
    padding-top: 20px !important;
    padding-bottom: 50px !important;
    text-align: center;
}


.ui-dialog-titlebar.ui-widget-header button {
    background-image: url(../Content/images/ui-icons_888888_256x240.png);
    float: right;
    margin-left: 10px;
    margin-right: 30px;
    margin-top: 10px;
    margin-bottom: 20px;
    border-radius: 5px;
    height: 40px;
    width: 100px;
    background: #f1e767; /* Old browsers */
    background: -moz-linear-gradient(top, #f1e767 0, #feb645 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0,#f1e767), color-stop(100%,#feb645)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top, #f1e767 0,#feb645 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top, #f1e767 0,#feb645 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top, #f1e767 0,#feb645 100%); /* IE10+ */
    background: linear-gradient(to bottom, #f1e767 0,#feb645 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f1e767', endColorstr='#feb645',GradientType=0 ); /* IE6-9 */
    font-weight: 600;
}

.dialogWithDropShadow {
    position: absolute;
    -webkit-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    -moz-box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.5);
    background-color: white;
    opacity: 1.0 !important;
    filter: Alpha(Opacity=90) !important;
    z-index: 10001;
}

#overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: #000;
    filter: alpha(opacity=98);
    -moz-opacity: 0.98;
    -khtml-opacity: 0.98;
    opacity: 0.98;
    z-index: 10000;
}


.cards {
    list-style: none;
    text-align: center;
}

    .cards LABEL {
        vertical-align: middle;
    }

    .cards li {
        display: inline;
        margin: 0 0 0 4.25em;
        padding: 0;
    }

    .cards > div {
        padding: 0px;
    }

    .cards div img {
        height: 30px;
        width: 48px;
    }

.box {
    margin-top: 5px;
}

#CreditCardExpirationMonth.ddl {
    margin-right: 1%;
}

#CreditCardExpirationYear.ddl {
    margin-left: 1%;
}
