@media all and (max-width: 1280px) and (min-width: 800px) {

    .main-thead-container .header {
        line-height: inherit;
    }
    #fleet-details-left .fleet-entry .form-group input {
      max-width:413px;
    }
    #fleet-details-right table .chk {
      width: 5.5%;
    } 
    #fleet-details-right table .pl {
      width: 8.5%;
    }
    #fleet-details-right table .rl {
      width: 8.5%;
    }
    #fleet-details-right table .vtt {
      width: 10.5%;
    }
    #fleet-details-right table .route {
      width: 30%;
    }
    #fleet-details-right table .sl {
      width: 6.5%;
    }
    #fleet-details-right table .t {
      width: 6.5%;
    }

    #sidebar-menu div.navigation-header a.menu-icon{
        display: block;
    }
    body.responsive #sidebar-menu{
        width: 50px;
    }
    body.responsive #main{
        margin-left: 50px;
    }
    body.responsive div.menu-title,
    body.responsive #sidebar-menu div.navigation-header .main-nav-title,
    body.responsive span.sub-title{
        display: none;
    }
    body.responsive .svg-icon{
        border: none;
        width: 50px;
        margin: 0;
    }
    body.responsive .svg-icon svg {
        width: 28px;
    }
    body.responsive #sidebar-menu ul#main-nav > li ul.sub li{
        padding: 0;
        margin: 0;
        height: 48px;
        line-height: 48px;
    }
    body.responsive #sidebar-menu ul#main-nav > li{
        padding:0; 
    }
    body.responsive #sidebar-menu ul#main-nav > li ul.sub .svg-icon svg{
        width: 26px;
    }
    body.responsive #sidebar-menu div.navigation-header{
        padding: 0 12px;
    }
    .body-container.login-page .form-control {
        float: left;
        width: 100%;
    }
    .form-control {
        float: left;
        width: 50%;
    }
    .form-horizontal .control-label {
        float: left;
        width: 40%;
        text-align: right;
    }
    .add-client-page .form-horizontal .client-name .control-label {
        width: 48%;
    }

    .add-client-page .col-lg-4.contact-person {
        width:50%;
        float: left;
    }
    .table-scroll thead {
        width: 100%;
    }
   
}

@media all and (max-width: 1024px) and (min-width: 768px) {
    .main-thead-container .header {
        height: 50px;
    }
    #VTT_Order_Number_Header{}
    #Collection_Location_Header{}
    #Delivery_Location_Header{}
    #Client_Header{}
    #Instruction_No_Header{}
    #Payment_Type_Header{}
    #Product_Header{}
    #Tariff_Header{}
    #Tons_Header{}
    #Total_Header{}
    #Comments_Header{}
    #Start_Date_Header{}
    #Approved_Header{}

    .col-lg-4 {
        width:100%
    }
    .col-lg-4.first-col{padding-left: 15px;}
    .col-lg-4.last-col{padding-right: 15px;}
    .contacts-container {
        float: left;
        width: 60%;
    }
    #sidebar-menu div.navigation-header a.menu-icon{
        display: block;
    }
    body.responsive #sidebar-menu{
        width: 50px;
    }
    body.responsive #main{
        margin-left: 50px;
    }
    #fleet-details-left .fleet-entry .form-group {
        width: 100%;
    }
    body.responsive div.menu-title,
    body.responsive #sidebar-menu div.navigation-header .main-nav-title,
    body.responsive span.sub-title{
        display: none;
    }
    body.responsive .svg-icon{
        border: none;
        width: 50px;
        margin: 0;
    }
    body.responsive .svg-icon svg {
        width: 28px;
    }
    body.responsive #sidebar-menu ul#main-nav > li ul.sub li{
        padding: 0;
        margin: 0;
        height: 48px;
        line-height: 48px;
    }
    body.responsive #sidebar-menu ul#main-nav > li{
        padding:0; 
    }
    body.responsive #sidebar-menu ul#main-nav > li ul.sub .svg-icon svg{
        width: 26px;
    }
    body.responsive #sidebar-menu div.navigation-header{
        padding: 0 12px;
    }
     #fleet-details-left .fleet-entry .form-group {
        float: left;
        margin-top: 10px;
        width: 100%;
    }
    #fleet-details-left .fleet-entry .form-group-nav {
        width: auto;
    }
    #fleet-details-left .fleet-entry span.truck-id {
        margin-left: 0;
        width: auto;
    }
    #fleet-details-left .fleet-entry span.truck-info {
        margin-left:0;
    }
    #fleet-details-left .fleet-entry .truck-info-container {
        float: left;
        width: 100%;
    }
    #fleet-details-left .fleet-entry-container {
        padding-right: 0;
    }
    #fleet-details-right table .vtt {
        width: 11%;
    }
    #fleet-details-right table .route {
        width: 27%;
        min-width: 142px;
    }
    .form-control {
        float: left;
        width: 50%;
    }
    .form-horizontal .control-label {
        float: left;
        width: 40%;
        text-align: right;
    }
}

@media all and (max-width: 800px) {
    .main-thead-container .header {
        line-height: inherit;
    }
    #VTT_Order_Number_Header{}
    #Collection_Location_Header{}
    #Delivery_Location_Header{}
    #Client_Header{}
    #Instruction_No_Header{}
    #Payment_Type_Header{}
    #Product_Header{}
    #Tariff_Header{}
    #Tons_Header{}
    #Total_Header{}
    #Comments_Header{}
    #Start_Date_Header{}
    #Approved_Header{}
    .add-client-page .col-lg-4.contact-person {
        width:50%;
        float: left;
    }
    .col-lg-8.submit-container {
        width:100%;
    }
    .col-lg-5.client-name {
        width: 50%;
    }
    .add-client-page .form-horizontal .client-name .control-label {
        width: 40%;
    }
    #fleet-details-left .fleet-entry .form-group {
        float: left;
        margin-top: 10px;
        width: 100%;
    }
    #fleet-details-left .fleet-entry .form-group-nav {
        width: auto;
    }
    #fleet-details-left .fleet-entry span.truck-id {
        margin-left: 0;
        width: auto;
    }
    #fleet-details-left .fleet-entry span.truck-info {
        margin-left:0;
    }
    #fleet-details-left .fleet-entry .truck-info-container {
        float: left;
        width: 100%;
    }
    #fleet-details-left .fleet-entry-container {
        padding-right: 0;
    }
    .form-control {
        float: left;
        width: 50%;
    }
    .form-horizontal .control-label {
        float: left;
        width: 40%;
        text-align: right;
    }
    #fleet-details-left .fleet-entry .form-group input {
      max-width:300px;
    }
}
@media all and (max-width: 768px) {
    .fix-search .main-thead-container {
        display:none;
    }

    #VTT_Order_Number_Header{}
    #Collection_Location_Header{}
    #Delivery_Location_Header{}
    #Client_Header{}
    #Instruction_No_Header{}
    #Payment_Type_Header{}
    #Product_Header{}
    #Tariff_Header{}
    #Tons_Header{}
    #Total_Header{}
    #Comments_Header{}
    #Start_Date_Header{}
    #Approved_Header{}

    #fleet-details-left .fleet-entry .form-group input {
      max-width:284px;
    }
    .col-lg-8.submit-container {
        width:100%;
    }
    .col-lg-5.client-name {
        width: 50%;
    }
    .add-client-page .form-horizontal .client-name .control-label {
        width: 40%;
    }
    #fleet-details-right table .vtt {
        width: 11%;
    }
    #fleet-details-right table .route {
        width: 27%;
    } 
    #fleet-table input[type="text"] {
        padding: 0 4px;
        max-width: 35px;
    }
    #fleet-details-right tbody td {
        padding: 1px 5px;
    }
    .inline-text.top-info-nav .date-select .form-control {
        width: 57%;
    }
    .inline-text.top-info-nav .date-select {
        width: 32%;
    }
    .inline-text.top-info-nav .total-loads input {
        width: 28px;
    }
    .inline-text.top-info-nav .top-admin-nav button, .inline-text.top-info-nav .top-admin-nav a {
        font-size: 14px;
        padding: 3px;
    }
    #header-container .right-header-details .nav {
        margin:0;
    }
    #header-container .right-header-details .nav > li {
        float: left;
    }
    .form-control {
        float: left;
        width: 50%;
    }
    .form-horizontal .control-label {
        float: left;
        width: 40%;
        text-align: right;
    }
}