#tat {
    margin-bottom: 50px;
}
.wraptable p{
    margin-bottom: 0px;
}
#tat .col1 .col-md-6.text-left{
    /* padding-left:50px */
}
#tat .col1 .col-md-6.text-right{
    padding-right:45px;
}
.tlt{
    color: #33c9e8;
    font-size: 16px !important;
}
#tat .col1 .status{
    margin-top: 30px;
    /* margin-left: 20px; */
}

@media (max-width: 767px) {
    #tat .col1 .status{
        margin-left: 0;
    }
}

#tat .col1 .status ul{
    padding:0;
    list-style:none;
    display: block;
}

/*@media (min-width: 1024px) {
    #tat .col1 .status ul{
        margin-left: -35px;
    }
}*/

#tat .col1 .status ul li{
    float:left;
    text-align:center;
    width:20%
}

@media (max-width: 767px) {
    #tat .col1 .status ul li{
        float:none;
        text-align:center;
        width:100%
    }
}

#tat .col1 .status ul li .wrap{
    position:relative
}


#tat .col1 .status ul li .wrap:before{
    content:"";
    position:absolute;
    height:4px;
    background: #287ac2;
    top:20px;
    width:100%;
    z-index: -1;
    left:0;
}

@media (max-width: 767px) {
    #tat .col1 .status ul li .wrap:before{
        display: none;
    }
    #tat .col1 .status ul li .wrap{
        margin-top: 10px;
    }
}

#tat .col1 .status ul li .wrap span{
    display:inline-block;
    margin-top:60px;
    text-transform: uppercase;
    font-size: 16px;
    font-weight:400;
}
#tat .col1 .status ul li .wrap span:first-child{
    position:absolute;
    width:24px;
    height:24px;
    background:#778184;
    color:#fff;
    border-radius:50%;
    z-index: 1;
    top:10px;
    left:calc(50% - 12px);
    line-height:24px;
    font-size:12px;
    margin-top:0;
}
#tat .col1 .status ul li:first-child .wrap:before{
    width:50%;
    left:50%
}
#tat .col1 .status ul li:last-child .wrap:before{
    width:50%
}
#tat .col1 .status ul li:last-child .wrap span:first-child{
    /*width:44px;
    height:44px;
    border:3px solid #00bbe6;
    background:#fff;
    color:#00bbe6;
    line-height:37px;
    font-size:14px;
    top:0;
    left:calc(50% - 22px)*/
}
#tat .col1 .status ul li:last-child .wrap span:last-child{
    /*padding:5px 15px;
    background:#00bbe6;
    color:#fff;
    border-radius:3px;
    margin-top:55px*/
}
#tat .col2{
    border-left:1px solid #e8e8e8
}

@media (max-width: 767px) {
    #tat .col2 {
        border-left: none;
    }
}

#tat .col2 p{
    color: #2782de;
    font-size: 16px;
    font-weight: 600;
    margin: 0 0 20px;
}
.content_vandon{
    margin-bottom:10px  !important;
}
#tat .col2 span{
    margin-bottom:10px;
    /*display:block;*/
    color:#494949;
    font-size: 16px;
    font-weight:400;
}
#tat .col2>*:last-child{
    margin-bottom:0
}
#tat table.table{
    margin-top:45px;
    margin-bottom:0
}
#tat table.table tr:first-child td{
    text-align:center;
    background: #fbdb43;
    color:#3c3c3c;
}
#tat table.table tr td{
    font-size: 16px;
    font-weight:400;
    border-left: 1px solid #fff !important;
    border-bottom: 1px solid #fff;
    color: #fff;
    background: #0182ddc2;
    padding: 15px;
}
#tat table.table tr td:first-child{
    border-left:none;
    width:10%;
    text-align:center
}
#tat table.table tr td:first-child span{
    width:24px;
    height:24px;
    line-height:24px;
    color:#fff;
    font-size:12px;
    border-radius:50%;
    display:inline-block
}
#tat table.table tr td:first-child span#warning{
    background:#f7b037
}
#tat table.table tr td:nth-child(2){
    width:25%
}

#tat table.table tr td:nth-child(3){
    width:20%
}
#tat table.table tr td:last-child{
    width:45%
}

@media (max-width: 767px) {
    #tat table.table tr td:nth-child(2){
        width:10%;
    }
    #tat table.table tr td:last-child{
        width:10%
    }
}

#uliti h4.title{
    margin-top:0;
    font-family:"OpenSans-Semibold";
    font-size:15px;
    color:#01a0c5;
    margin-bottom:20px
}
#uliti div.shorttalk{
    color:#747474
}
#uliti .wrap{
    width:90%;
    margin:auto
}
#uliti .wrap h5{
    font-family:"OpenSans-Semibold";
    color:#212121;
    margin-top:30px;
    margin-bottom:30px
}
#uliti .wrap .item .col-md-2 span{
    width:50px;
    height:45px;
    line-height:45px;
    color:#fff;
    background:#01a0c5;
    font-size:20px;
    border-radius:4px;
    display:inline-block;
    cursor:pointer
}
.inputwrap{
    position:relative;
    border:1px solid #e8e8e8;
    border-radius:4px
}
.inputwrap .select{
    position:absolute;
    left:0;
    background:#e8e8e8;
    border:none;
    padding:10px 10px 10px 30px;
    outline:none;
    color:#797979;
    cursor:pointer;
    width:100px
}
.inputwrap .select span{
    margin-right:10px
}
.inputwrap .select ul{
    list-style:none;
    padding:0;
    position:absolute;
    top:100%;
    left:0;
    width:100%;
    margin:0;
    display:none;
    z-index:10
}
.inputwrap .select ul li{
    border:1px solid #dcdcdc;
    background:#fff;
    text-align:center;
    border-top:none;
    padding:14px 30px;
    cursor:pointer
}
.inputwrap .select ul li:hover{
    background:#01a0c5;
    color:#fff;
    border-color:#01a0c5
}
.inputwrap input{
    width:100%;
    padding:10px 10px 10px 120px;
    border:none;
    outline:none
}
#quotation{
    font-size:13px
}
#quotation .lang{
    position:relative;
    background:#505050;
    border-radius:4px
}
#quotation .lang .select{
    position:relative;
    background:none;
    width:auto;
    padding:10px;
    width:170px;
    height:40px
}
#quotation .lang .select span,#quotation .lang .select i{
    color:#fff
}
#quotation .lang .select i{
    position:absolute;
    right:0;
    width:40px;
    height:40px;
    top:0;
    line-height:40px;
    background:#363636
}
#quotation .lang .select li a{
    color:#797979
}
#quotation .lang .select li:hover a{
    color:#fff
}
#quotation h5.title{
    font-family:"OpenSans-Bold";
    color:#01a0c5
}
#quotation .row1{
    margin-top:20px
}
#quotation .row1 h5.title{
    padding-right:20px
}
#quotation .row1 .item{
    display:inline-block;
    width:100%;
    margin-bottom:5px
}
#quotation .row1 .item label{
    text-align:right;
    color:#5a5a5a;
    font-weight:500;
    margin-top:10px
}
#quotation .row1 .item input{
    border-radius:0;
    background:#edecec;
    border:none;
    outline:none;
    height:40px;
    width:100%
}
#quotation .row1 .item .input{
    position:relative
}
#quotation .row1 .item .input span{
    position:absolute;
    right:15px;
    top:0;
    width:40px;
    height:40px;
    color:#5a5a5a;
    line-height:40px;
    background:#dcdcdc;
    text-align:center;
    cursor:pointer
}
#quotation .row1 .item .input ul{
    list-style:none;
    padding:0;
    display:none;
    position:absolute;
    background:#fff;
    z-index:1
}
#quotation .row1 .item .input ul li{
    border:1px solid #dcdcdc;
    background:#fff;
    text-align:center;
    border-top:none;
    padding:14px 30px;
    cursor:pointer
}
#quotation .row1 .item .input ul li:hover{
    background:#01a0c5;
    color:#fff
}
#quotation .row1 .item .input.units span{
    right:0
}
#quotation .row1 .item .input.units .col-md-4:nth-child(2){
    border-left:1px solid #fff;
    border-right:1px solid #fff
}
#quotation .row1 .item .input.units input{
    padding-left:30px
}
#quotation table.table{
    margin-bottom:7px
}
#quotation table.table tr:first-child{
    background:#01a0c5
}
#quotation table.table tr:first-child td{
    color:#fff
}
#quotation table.table tr td{
    border:1px solid #dcdcdc;
    width:22.5%;
    text-align:center;
    color:#5a5a5a;
    vertical-align:middle
}
#quotation table.table tr td:first-child,#quotation table.table tr td:last-child{
    width:5%
}
#quotation table.table tr td input{
    border:1px solid #edecec;
    padding:10px;
    text-align:right;
    width:120px;
    margin-right:10px;
    border-radius:4px
}
#quotation table.table tr td:last-child{
    padding:0
}
#quotation table.table tr td:last-child span{
    display:inline-block;
    width:100%;
    color:#fff;
    height:28px;
    float:left;
    line-height:28px;
    cursor:pointer
}
#quotation table.table tr td:last-child span:first-child{
    background:#0694b5
}
#quotation table.table tr td:last-child span:last-child{
    background:#01a0c5
}
#quotation .btn{
    padding:10px 35px;
    background:#01a0c5;
    color:#fff;
    font-family:"OpenSans-Semibold"
}
#quotation .result{
    margin-top:40px
}
#quotation .result h5.title{
    margin-top:0;
    margin-bottom:15px
}
#quotation .result .wrap .col-md-12{
    padding-top:15px;
    padding-bottom:15px;
    font-family:"OpenSans-Semibold"
}
#quotation .result .wrap .col-md-12:first-child{
    background:#01a0c5;
    color:#fff
}
#quotation .result .wrap .col-md-12:last-child{
    border:1px solid #dcdcdc;
    border-top:none;
    color:#5a5a5a
}
#quotation .result .btn{
    margin-bottom:30px
}
#quotation #aboutweight .modal-dialog div{
    border:none;
    box-shadow:none
}
#quotation #aboutweight .modal-content{
    overflow:hidden;
    border-radius:10px
}
#quotation #aboutweight .modal-header{
    background:#01a0c5;
    color:#fff
}
#quotation #aboutweight .modal-header h4{
    font-size:18px;
    font-family:"OpenSans-Semibold"
}
#quotation #aboutweight .modal-header button{
    width:25px;
    height:25px;
    opacity:1;
    background:#fff;
    border-radius:50%;
    color:#01a0c5
}
#quotation #aboutweight .modal-body>.row{
    margin-left:-5px;
    margin-right:-5px
}
#quotation #aboutweight .modal-body form .form-group{
    display:inline-block;
    width:100%;
    float:left;
    margin-bottom:10px
}
#quotation #aboutweight .modal-body form .form-group:last-child{
    margin-bottom:0
}
#quotation #aboutweight .modal-body form .form-group>div{
    padding-left:5px;
    padding-right:5px
}
#quotation #aboutweight .modal-body form .form-group textarea{
    resize:none
}
#quotation #aboutweight .modal-footer{
    padding-top:0
}
#quotation #aboutweight .modal-footer .btn{
    width:100%
}

@media screen and (max-width:768px){
    .container>.row{
        margin:0
    }
    #tat .col2{
        margin-bottom:45px
    }
    #quotation .row1{
        display:inline-block
    }
    #quotation table.table{
        margin-top:30px
    }
    #quotation table.table tr td input{
        width:70px
    }
}
@media screen and (max-width:736px){
    /*#tat table.table{
        min-width:1024px
    }*/
    .wraptable{
        overflow-x:scroll
    }
    #uliti .wrap h5{
        margin-bottom:15px
    }
    #uliti .wrap .item .col-md-2 span{
        margin-top:10px;
        margin-bottom:10px
    }
    #quotation table.table tr td input{
        margin-right:5px
    }
}
@media screen and (max-width:568px){
    #quotation .row1 .item .input.units input{
        padding-left:10px
    }
    #quotation .wrap{
        overflow-x:scroll
    }
    #quotation .wrap table{
        width:768px
    }
}
@media screen and (max-width:480px){
    #quotation .col-xs-6{
        width:100%
    }
    #quotation .row1 h5.title{
        text-align:left
    }
    #quotation .tabledetail>.btn{
        float:left !important;
        padding:10px 20px;
        margin-right:10px
    }
    #uliti .wrap{
        width:100%
    }
    #tat .col1 .col-md-6.text-right{
        padding-right:15px
    }
    #tat .col1 .col-md-6.text-left{
        padding-left:15px
    }
    #tat .col1 .status ul li{
        /*display:none*/
    }
    #tat .col1 .status ul li:last-child{
        display:block;
        width:100%
    }
    #tat .col1 .status ul li:last-child .wrap:before{
        width:100%
    }
}

#tat .col1 .status .act .active {
    width: 44px !important;
    height: 44px !important;
    border: 3px solid #287ac2 !important;
    background: #fff !important;
    color: #287ac2 !important;
    line-height: 37px !important;
    font-size: 14px !important;
    top: 0 !important;
    left: calc(50% - 22px) !important;
}

#tat .col1 .status .act .txt-active {
    padding: 5px 15px !important;
    background: #287ac2 !important;
    color: #fff !important;
    border-radius: 3px !important;
    margin-top: 55px !important;
}

#home {
    text-align: center;
    margin: 106px 0 !important;
}

#home #search-form {
    text-align: center;
}

.clearfix {
    clear: both;
}


#home {
    text-align: center;
    margin: auto;
}

#home form {
    text-align: center;
    width: 50%;
    margin: auto;
}

@media (max-width: 767px) {
    #home form {
        width: 90%;
    }
}

#home .caption-title {
    font-size: 22px;
    font-weight: bold;
    color: #00bbe6;
    text-transform: uppercase;
}
#home .desc {
    font-weight: bold;
    font-size: 16px;
    color: #888686;
}

#home form .locale-flag {
    width: 60px;
    background: #FFF;
    cursor: pointer;
}

#home form input {
    height: 40px;
    box-shadow: 0 1px 2px #EEE;
    border-radius: 7px 0 0 7px;
    cursor: pointer;
}

#home form .btn-check {
    border-left: 0;
    background: #32bbe6;
    color: #FFF;
    font-weight: bold;
    padding: 6px 17px;
    cursor: pointer;
    text-transform: uppercase;
}

#tat table.table tr td span {
    background: #287ac2;
}

#tat table.table tr td span.active {
    background: #FFF;
    color: #287ac2;
}

@media (min-width: 1200px) {
    #tat .col1 .status {
        margin-left: -33px;
    }
}


@media (max-width: 767px) {
    .wraptable {
        overflow: hidden;
    }

    #tat table.table {
        width: 100% !important;
    }

    #tat table.table tr td:first-child {
        display: none;
    }

    #tat table.table tr td {
        border-left: 0;
        text-align: center;
        width: 33% !important;
        font-size: 12px;
    }

    #tat table.table tr td:nth-child(2n+2) {
        text-align: left;
    }

    #tat .col1 .status {
        display: none;
    }

    .tracking-status {
        margin-top: 20px;
        display: block !important;
    }

    #tat table.table {
        margin-top: 20px;
    }
}

#tat .col1 .status ul li.stt-active-change .wrap .active {
    background: #287ac2;
}
