@media (min-width:1400px) {
    .container{max-width:1320px;}
}
@media (min-width:992px) {
    .header .navbar-expand-lg .navbar-nav{flex: 1 1;justify-content:space-between;}
    .header .navbar-expand-lg .navbar-collapse{margin-left: 50px;}
    .header .navbar-expand-lg{padding: 0px;}
    .header .navbar-brand{margin-left: 1rem;}
    .login-btn{position: relative;}
    .login-btn:after{position: absolute;top: 5px;left: -14%; height: 25px; width: 1px; background-color: #0e777d; content: ""; }
    #submitss .modal-dialog{max-width:900px;}
    #wire-info .modal-dialog{max-width:700px;}
    }
    
@media (max-width:1399px) {
    .header .navbar-brand img {width: 145px;}
    .header .navbar-brand{font-size: 0.9rem;}
    .login-btn:after{left: -6%;}
    .top-section{    padding: 30px 0px;}
    .section-heading{margin-bottom: 20px;font-size: 28px;}
    .box-item {padding: 24px;    flex: 0 0 242px;max-width: 242px;}
    .box-item .title {font-size: 16px;}
    .box-item .item-value {font-size: 26px;}
    .order-tab.nav-tabs .nav-link span{font-size: 16px;}
    .order-tab.nav-tabs .nav-link{height: 48px;    line-height: 48px;    min-width: 100px;}
    .order-tab.nav-tabs .nav-link:after{left: -16px;width: calc(100% + 32px);    height: 65px;}
    .order-tab.nav-tabs .nav-item{    padding: 0 12px;}
    table.dataTable{font-size:16px;}
    /*Detail*/
    .address-section .address-name {font-size: 20px;}
    .address-section .order-no {font-size: 24px;}

    
}
@media (max-width:1199px) { 
    .header .navbar-brand{    margin-left: 0;}
    .header .navbar-brand img {width: 120px;}
    .header .navbar-brand {font-size: 0.6rem;}
    .navbar-brand{    margin-right: 0.5rem;}
    .header .navbar-expand-lg .navbar-collapse {margin-left: 10px;}
    .notification-bar .bell-icon {height: 22px;width: 18px;}
    .notification-bar .nt-count{    width: 15px;height: 15px;line-height: 15px;    font-size: 8px;top: -3px;right: -7px;}
    .section-heading {margin-bottom:20px;font-size: 22px;}
    .top-section {padding: 24px 0px 30px 0;}
    .order-section-wrap .section-heading{font-size: 20px;}
    .home-icon{height: 20px;width: 21px;}
    .order-section-wrap .tab-content {margin-top: 20px;}
    .box-item {padding: 18px;}
    .order-section-wrap .table-wrap {margin-top: 10px;}
    table.dataTable {font-size: 12px;}
    .footer .footer-item .title{    font-size: 16px;}
    .box-item .title {font-size: 14px;margin-bottom: .2rem;}
    .box-item .item-value {font-size: 20px;}
    .box-item{flex: 0 0 200px;max-width: 200px;}
    .order-section {padding: 24px 0px;}
    .footer .footer-item .title:after{    top: calc(100% + 6px);}
    .footer .footer-item .title{margin-bottom: 30px;}
    .footer .footer-item a{    font-size: 14px;}
    .footer .footer-item ul li {padding-bottom: 8px;}
    .footer .footer-item ul.social-icon li a{width: 38px;height: 38px;    font-size: 18px;    line-height: 38px;}
    .footer .footer-item ul.location li {font-size: 14px;}
    .footer .footer-item ul.location li div {margin-left: 20px;line-height: 22px;}
    /*Detail*/
    .order-detail-top .row [class*="col-"] {min-height: 300px;}
    .map-demo img {height: 300px;}
    .order-detail-top {padding: 20px 0;}
    .order-status {padding: 30px 30px 90px 30px;}
    .order-satus-wrap [class^="order-status"] .label{font-size: 14px;    transform: translateX(-45%) translateY(62px);}
    .order-satus-wrap [class="order-status-6"] .label{    transform: translateX(-44px) translateY(62px);}
    .info-block .title {font-size: 20px;}
    .info-data div{font-size: 16px;}
    .action-btns .btn{font-size: 16px;  padding: 0.6rem .75rem;}
    .info-block{    padding: 20px; height:100%;}
    .address-section{min-height: 300px;height: 100%;}
}
 @media (max-width:991px){
    .header .navbar{padding: .2rem 0rem;}
    .header .navbar{position: relative;}
    .notification-bar {position: absolute;right: 0;top:10px;}
    .header .navbar-toggler{margin-right: 30px; padding:0px;}
    .header  .navbar-toggler-icon{line-height: 1.5;    border: 1px solid #414141;}
    .top-section {padding: 18px 0px 26px 0;}
    .header .navbar-expand-lg .navbar-collapse{margin-left: 0px;    margin-bottom: 10px;}
    .section-heading{font-size: 18px;}
    .header .navbar-expand-lg .navbar-nav .nav-link {background: #f9f9f9;padding: 6px;margin-bottom: 2px;}
    .box-item {padding: 12px;}
    .box-item .title {font-size: 12px;}
    .box-item .item-value {font-size: 16px;}
    .box-item {flex: 0 0 164px;max-width: 164px;}
    .order-tab.nav-tabs .nav-link{    min-width: 94px;}
    .order-tab.nav-tabs .nav-link span {font-size: 14px;}
    .order-tab.nav-tabs .nav-link {height: 34px;line-height: 34px;}
    .order-tab.nav-tabs .nav-link:after {left: -9px;width: calc(100% + 18px);height: 41px;}
    .order-tab.nav-tabs .nav-item {padding: 0 5px;}
    .order-section-wrap .section-heading {font-size: 16px;}
    .home-icon {height: 16px;width: 18px;margin-right: 6px;}
    .order-section-wrap .table thead th{vertical-align: middle;}
    .table.dataTable td, .table.dataTable th{padding: 0.4rem;}
    .footer .footer-item .title {font-size: 14px;}
    .footer .footer-item ul:not(.social-icon) li i {padding-right: 4px;}
    .footer .footer-item a {font-size: 12px;}
    .footer .footer-item .title {margin-bottom: 20px;}
    .footer .footer-item ul li {padding-bottom: 4px;}
    .footer .footer-item ul.social-icon li a {width: 32px;height: 32px;font-size: 14px;line-height: 32px;}
    .footer .footer-item ul.location li {font-size: 12px;}
    .footer .footer-item ul.location li div{    line-height: 18px;}
    /*Detail*/
    .map-order-wrap{padding: 5px;}
    .map-demo img {height: 190px;}
    .order-detail-top .row [class*="col-"] {min-height: 190px;}
    .map-order-wrap .row{margin-right: -4px;margin-left: -4px;}
    .map-order-wrap .row [class*="col-"]{padding-right: 4px;padding-left: 4px;}
    .tracking-order {padding: 10px 0px;}
    .order-status {padding: 24px 10px 80px 10px;}
    .order-satus-wrap {padding: 0 50px 0 36px;}
    .order-satus-wrap [class^="order-status"] .status-dot{    width: 16px;height: 16px;}
    .order-satus-wrap [class^="order-status"] .status-line{    margin-top: -9px;}
    .order-satus-wrap [class^="order-status"].active .status-dot.status-dot.p-stage:after{    width: 24px;height: 24px;}
    .order-satus-wrap [class^="order-status"] .label{transform: translateX(-45%) translateY(56px);}
    .order-satus-wrap [class="order-status-6"] .label {transform: translateX(-44px) translateY(56px);}
    .order-satus-wrap [class^="order-status"] .label{font-size: 12px;}
    .order-tab.nav-tabs .nav-link {min-width: 86px;}
    .info-block .title:after{    top: calc(100% + 10px);}
    .info-block .title {font-size: 18px;}
    .info-block {padding: 16px;}
    .info-data{    padding: 4px 0;}
    .info-data div {font-size: 14px;}
    .secure-service {padding: 14px 0 0 0;}
    .action-btns .btn{margin-right: 10px; margin-right: 0px; margin-bottom: 10px;}
    .secure-service h5{font-size: 18px;margin-bottom: 14px;}
    .contact-info-wrap{padding: 10px;}
    .action-btns{flex-direction: column;}
    #submitss .modal-dialog{max-width:700px;}
    #wire-info .modal-dialog{max-width:700px;}
    .task-body .task-info div{font-size: 16px;}
    .doc-items span{font-size: 16px;margin-top: 10px;}
    .doc-items a{margin-bottom: 10px;}
    .modal-header .modal-title {font-size: 20px;}
    .address-section{min-height: 190px; height: 100%;}
 }
 @media (max-width:767px){
    .section-heading {margin-bottom:16px;}
    .data-box-wrap{    flex-wrap: wrap;justify-content: space-around;}
    .box-item{    margin-bottom: 6px;}
    .top-section {padding: 18px 0px 20px 0;}
    .order-section-wrap .table-wrap{    overflow-y: scroll;}
    .footer .footer-item{margin-bottom: 20px;}
    .footer .footer-item .title:after {top: calc(100% + 3px);}
    .footer .footer-item .title {margin-bottom: 14px;}
    .footer .footer-item {margin-bottom: 26px;}
    .login-form .form-control {height: 48px;font-size: 16px;}
    .login-form .form-group label {font-size: 18px;}
    .login-form .form-group {margin-bottom: 1rem;}
    /*Detail Page*/
    .map-demo img{width: 100%;}
    .map-order-wrap .row [class*="col-"]:first-child{margin-top: 0px;}
    .map-order-wrap .row [class*="col-"]{margin-top:4px; margin-bottom: 4px;}
    .task-body .head-task-title div{font-size: 18px;}
    .task-body [class*="task"] div{padding: 10px 4px;}
    .task-name-wrap {padding: 10px 10px;}
    .task-info .btn {    font-size: 0.78rem;}
    .order-satus-wrap [class^="order-status"] .label{overflow: hidden; text-overflow: ellipsis; white-space: nowrap; display: inline-block;width: 75px;}
    .modal-body {padding: 1rem 2rem;}
    .modal .form-control {height: 46px;}
    .form-control{font-size: 16px;}
    .modal .form-group {margin-bottom: 18px;}
 }

@media (max-width:576px){
.footer .footer-items .row [class*="col-"]:last-child .footer-item{margin-bottom: 0px;}
.box-item{    margin-left: 2px;margin-right: 2px;}
.modal-body {padding: 1rem 1rem;}
.wire-opt{flex-direction: column;}
.wire-opt label{display:block;  text-align: center}
.text-center{font-size: 16px;}
.order-status {padding: 20px 10px 70px 10px;}
.order-satus-wrap {padding: 0 32px 0 24px;}
.contact-info .title {font-size: 16px;}
.task-body .head-task-title div {font-size: 14px;}
.task-body .task-info div {font-size:14px;}
.task-name-wrap{overflow: scroll;}
.task-body{width: 490px;}
.doc-items a {flex: 0 0 35%;}
/*Order Status*/
.order-satus-wrap [class^="order-status"]{width:100%; position: relative;}
.order-satus-wrap [class^="order-status"] .label{    transform: translateX(42px) translateY(23px);text-align: left; width:auto;}
.order-satus-wrap [class^="order-status"] .status-line .status-line-s{width: 2px;height: 100%;}
.order-satus-wrap [class^="order-status"] .status-line{    position: absolute;top: calc(100% + 6px);left: -4px;height: 100%;width: 2px;}
}
@media (max-width:480px){
    .header .navbar-brand img {width: 100px;}
    .order-tab.nav-tabs .nav-link:after{display:none;}
    .order-tab.nav-tabs .nav-link span{display:block;}
    .order-tab.nav-tabs .nav-link.active{    background: #5599a2;}
    .order-tab.nav-tabs .nav-link{height: 30px;line-height: 30px;background: #f9f9f9; margin-bottom: 2px;}
    .order-tab{padding:0px;    flex-wrap: wrap;flex: 0 0 auto;align-items: stretch;}
    .order-tab.nav-tabs .nav-item{width: 100%;}
        
}