﻿/* Rules specific to extra small devices (less than 768px) */
@media (max-width: 767px) {

    .btn-block, input#OriginZipCode, input#DestinationZipCode {
        max-width: none;
        margin-top: 5px;
    }

    .navigation-buttons {
        margin-right: -15px;
        margin-left: -15px;
    }

    #EstimatedPrice {
        margin-right: -15px;
        padding-left: 10px;
        max-width: 210px;
    }

    #ActiveMilitary {
        margin-left: -12px;
        margin-top: 10px !important;
    }

    #divMilitaryCheckBox{
        margin-top: -7px;
    }
   
    .form-control.col-xs-9 {
        max-width: none;
        width: 75%;
    }

    .form-control.col-xs-12 {
        max-width: none;
    }

    #VehicleInfo {
        width: 110%;
        max-width: none;
    }

    .vehicle-info-label {
        max-width: 100px;
    }

    .ContactInformation .checkbox, .ContactInformation .panel-group {
        padding-left: 0px;
        padding-right: 0px;
    }

    .table, fieldset {
        font-size: smaller;
    }

    #CreditCardFrame {
        height: 880px;
    }

    .OrderComplete #ShipAnotherVehicle button {
        width: 112px;
        padding-left: 1%;
        padding-right: 1%;
        margin-left: 1%;
        margin-right: 1%;
    }

    .ShipmentInformation .table-header {
        width: 130px;
    }

    .ShipmentInformation #KeyDates .table-header {
        width: 200px;
    }

    .ShipmentInformation #RequiredDocuments .table-header {
        width: 200px;
    }

    .ShipmentInformation table:not(:last-child) tr {
        border-bottom: 1px solid white !important;
    }

    .DealerTracking, .VesselSchedule {
        padding: 0;
    }

    .DealerTracking button#ExportToExcel,
    .VesselSchedule button#ExportToPDF {
        margin-left: 0;
    }

    .flip-scroll-above .text-center{
        font-size: 12px;
    }

    .flip-scroll-above .flip-scroll-navigation span {
        padding: 0px;
    }

     #ServiceSummary {float: left}

    #shopApp {
        margin-left: calc((100% - 440px)/2);
    }
}
@media (max-width: 620px) {
    #shopApp {
         margin-left: calc((100% - 440px)/2);
    }
}

@media (max-width: 460px) {
    #shopApp {
         margin-left: calc((100% - 280px)/2);
    }
}

@media (max-width: 400px) {
    #shopApp {
         margin-left: calc((100% - 260px)/2);
    }
}

@media (max-width: 360px) {
    #shopApp {
         margin-left: calc((100% - 240px)/2);
    }
}

@media (max-width: 320px) {
    #shopApp {
         margin-left: calc((100% - 200px)/2);
    }
    #BBBReview {
        margin-left: 90px;
    }
}