﻿body {
    margin: 0px;
    padding: 0px;
    font-family:Arial, Helvetica, sans-serif;
}


@font-face {
    font-family: 'Poppins-Light';
    src: url('../font/Poppins-Light.eot'), url('../font/Poppins-Light.woff') format('woff'), url('../font/Poppins-Light.ttf') format('truetype'), url('../font/Poppins-Light.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins-Regular';
    src: url('../font/Poppins-Regular.eot'), url('../font/Poppins-Regular.woff') format('woff'), url('../font/Poppins-Regular.ttf') format('truetype'), url('../font/Poppins-Regular.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins-Medium';
    src: url('../font/Poppins-Medium.eot'), url('../font/Poppins-Medium.woff') format('woff'), url('../font/Poppins-Medium.ttf') format('truetype'), url('../font/Poppins-Medium.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins-SemiBold';
    src: url('../font/Poppins-SemiBold.eot'), url('../font/Poppins-SemiBold.woff') format('woff'), url('../font/Poppins-SemiBold.ttf') format('truetype'), url('../font/Poppins-SemiBold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Poppins-Bold';
    src: url('../font/Poppins-Bold.eot'), url('../font/Poppins-Bold.woff') format('woff'), url('../font/Poppins-Bold.ttf') format('truetype'), url('../font/Poppins-Bold.svg') format('svg');
    font-weight: normal;
    font-style: normal;
}



/*-----------------------------------------Scroller-----------------------------------------*/
#bottom {
    margin-top: 0px 0 0 0;
}
#bottom i{ color:60px; color:#0099FF; font-weight:bold;}
    #top a, #bottom a {
        color:#0099FF;
        font-size: 17px;
    }

.scrollertop {
    z-index: 100;
    margin-top: 190px;
    left: 48%;
    position: relative;
}

.scrollerbottom {
    float: right;
    right: 0px;
    z-index: 100;
    position: relative;
    margin-top: -7px;
}

/*-----------------------------------------Common Css-----------------------------------------*/
.space {
    margin-top: 10px;
}

.space1 {
    margin-top: 20px;
}

.space2 {
    margin-top: 30px;
}

.space3 {
    margin-top: 40px;
}

.space4 {
    margin-top: 50px;
}

.width {
    width: 100%;
}

.max {
    max-width: 100%;
}


.left {
    float: left;
}

.right {
    float: right;
}

.display {
    display: inline-block;
    width: 100%;
}

.padding {
    padding: 0px !important;
}

/*-----------------------------------------Header-----------------------------------------*/
.whatsap {
    position: fixed;
    bottom: 0px;
    left: 5px;
    z-index: 999;
}

.logo {
    float: left;
    margin-top: 45px;
    position:absolute;
    top: 5px;
    z-index: 99;
}

.loginbg {
    background-image: url(../images/loginbg.jpg);
    position: fixed;
    width: 100%;
    top: 0px;
    background-repeat: no-repeat;
    background-size: 100%;
    height: 100%;
}

/*----------------------------------------Body-----------------------------------------*/
.tag {
    font-family: Poppins-SemiBold;
    color: #01a8ee;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
    margin-top: 40px;
}

.title {
    font-family: Poppins-Regular;
    color: #222;
    font-size: 48px;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
}
.title i{font-size: 148px; color:#659cc8;}
    .title span {
        font-family: Poppins-SemiBold;
    }

.tubiao i{font-size: 148px; color:#659cc8;}

.index_about p {
    color: #555;
    font-size: 14px;
    letter-spacing: 1px;
    
    line-height: 1.6;
    margin-top: 5px;
	text-align:justify;text-justify:distribute-all-lines;text-align-last:left;
}


.knwbtn {
    margin-top: 40px;
    text-align: center;
}

    .knwbtn a {
        background-color: #07acff;
        padding: 10px 20px;
        font-family: Poppins-Regular;
        font-size: 14px;
        letter-spacing: 1px;
        color: #fff;
    }

        .knwbtn a i {
            color: #fff;
            margin-left: 5px;
			font-size: 20px;
			line-height:30px;
        }
		

            .knwbtn a i:hover {
                color: #07acff;
            }

        .knwbtn a:hover {
            background-color: #fff;
            color: #07acff;
            border: 2px solid #07acff;
        }

.divsec {
    margin-top: 40px;
    background-color: #fff;
    height: 5px;
    -webkit-box-shadow: 0px 5px 5px -2px rgba(0,0,0,0.75);
    -moz-box-shadow: 0px 5px 5px -2px rgba(0,0,0,0.75);
    box-shadow: 0px 5px 5px -2px rgba(0,0,0,0.75);
}

.txt1 {
    font-family: Poppins-SemiBold;
    color: #222;
    font-size: 24px;
    letter-spacing: 1px;
    text-align: center;
    margin-top: 5px;
}

.txt2 {
    font-family: Poppins-Regular;
    color: #555;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: center;
    line-height: 1.6;
    margin-top: 5px;
}

    .txt2 a {
        font-family: Poppins-SemiBold;
        color: #07acff;
    }

        .txt2 a:hover {
            color: #1a3b71;
        }

.bg1 {
    background-color: #004593;
    margin-top: 40px;
    padding-bottom: 30px;
}

.tag1 {
    font-family: Poppins-SemiBold;
    color: #01a8ee;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
    margin-top: 20px;
}

.title1 {
    font-family: Poppins-Regular;
    color: #fff;
    font-size: 48px;
    letter-spacing: 1px;
    text-align: center;
    text-transform: uppercase;
	margin-top:30px;
}

    .title1 span {
        font-family: Poppins-SemiBold;
    }

.circle1 {
    background-color: #fff;
    width: 60px;
    height: 60px;
    border-radius: 100px;
    margin-top: 30px;
}
.circle1 i{ font-size:43px; color:#01a8ee;}
.box1 {
    background-color: #fff;
    padding: 10px 10px;
    margin-top: -30px;
    border-radius: 5px;
}

.txt3 {
    font-family: Poppins-SemiBold;
    color: #01a8ee;
    font-size: 22px;
    letter-spacing: 1px;
    text-align: center;
    margin-top: 15px;
}

.txt4 {
    font-family: Poppins-Regular;
    color: #555;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: center;
    line-height: 1.6;
    margin-top: 5px;
}

.tag2 {
    font-family: Poppins-SemiBold;
    color: #01a8ee;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: left;
    text-transform: uppercase;
    margin-top: 40px;
}

.title2 {
    font-family: Poppins-Regular;
    color: #222;
    font-size: 48px;
    letter-spacing: 1px;
    text-align: left;
    text-transform: uppercase;
}

    .title2 span {
        font-family: Poppins-SemiBold;
    }

/*----------------------------------------Inner Body-----------------------------------------*/
.innerbg {
    background-image: url(../images/innerbg.png);
    height: 300px;
    background-repeat: no-repeat;
    background-size: 100%;
    margin-top: 145px;
}

.intitle {    
    color: #222;
    font-size: 30px;
    letter-spacing: 1px;
    text-align: left;
    
	margin-top:20px;
}

    .intitle span {
	font-weight:bold;
	       
    }

.intag {    
    color: #01a8ee;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: left;
    text-transform: uppercase;
    margin-top: 40px;
	font-weight:bold;
}

.ship {
    width: 380px;
    height: 137px;
    margin-top: 140px;
    position: relative;
    animation: myfirst 100s 2;
}

@keyframes myfirst {
    0% {
        left: 0px;
        top: 0px;
    }

    100% {
        left: 830px;
        top: 0px;
    }
}


/*----------------------------------------Footer-----------------------------------------*/
.ftrbg {
    background-image: url(../images/ftrbg.png);
    background-repeat: no-repeat;
    padding-top: 20px;
    margin-top: 20px;
    height: 350px;
    background-size: 100%;
}

.footebg {
    background-color: #000;
}

.copy {
    
    color: #fff;
    padding-top: 13px;
    font-size: 14px;
    letter-spacing: 1px;
    text-align: center;
}

.ftr1 {
    
    color: #fff;
    font-size: 25px;
    letter-spacing: 1px;
    text-align: left;
    margin-top: 20px;
}

.ftr2 {
   
    font-size: 14px;
    color: #fff;
    line-height: 2.1;
    margin-top: 10px;
    letter-spacing: 1px;
    text-align: left;
}
    .ftr2 i {
        color: #01a8ee;
        margin-right: 10px;
        font-size: 18px;
    }
.ftr3 {
    text-align: left;
    margin-top: 15px;
}

    .ftr3 a {
        
        font-size: 16px;
        color: #fff;
        letter-spacing: 1px;
    }

    .ftr3 i {
        color: #01a8ee;
        margin-right: 10px;
        font-size: 18px;
    }

    .ftr3 a:hover {
        color: #01a8ee;
    }

/*-----------------------------------------Thank You-----------------------------------------*/
.thankbg {
    background-color: #01a8ee;
    height: 657px;
    text-align: center;
}

.tanktit {
    font-family: Poppins-Bold;
    font-size: 70px;
    letter-spacing: 3px;
    color: #fff;
    padding-top: 100px;
}

.tanktxt {
    font-family: Poppins-Bold;
    text-transform: capitalize;
    color: #fff;
    letter-spacing: 2px;
    font-size: 20px;
    margin-top: 20px;
    line-height: 2.1;
}

    .tanktxt span {
        font-size: 26px;
    }

.thankbtn {
    text-align: center;
    margin-top: 60px;
}

    .thankbtn a {
        background-color: #fff;
        padding: 10px 20px;
        font-family: Poppins-Bold;
        color: #000;
        border-radius: 5px;
        letter-spacing: 1px;
        font-size: 20px;
    }

        .thankbtn a:hover {
            background-color: #01a8ee;
            border: #fff 3px solid;
            color: #fff;
        }

.thankcall {
    text-align: center;
    margin-top: 25px;
    font-size: 36px;
    color: #fff;
}

    .thankcall a {
        color: #fff;
        letter-spacing: 2px;
        font-family: Poppins-Bold;
        font-size: 36px;
    }

    .thankcall img {
        margin-top: -7px;
    }

/*-----------------------------------------Traccking-----------------------------------------*/
.trackingbtn {
    text-align: center;
    font-family: Poppins-SemiBold;
    font-size: 16px;
    margin-top: 14px;
    float: left;
}

    .trackingbtn a i {color: #fff;
    }
	.trackingbtn a:hover i {color: #fada05;}

    .trackingbtn a {
        background-color: #07acff;
        border: 2px solid #1a3b71;
        padding: 2px 10px;
        border-radius: 5px;
        color: #fff;
    }

        .trackingbtn a:hover {
            background-color: #1a3b71;
            color: #fada05;
            border: 2px solid #07acff;
        }

.logbox {
    background-color: #fff;
    margin-top: 20%;
    border-radius: 10px;
    float: left;
    width: 100%;
    -webkit-box-shadow: 0px 0px 14px -3px rgba(0,0,0,0.84);
    -moz-box-shadow: 0px 0px 14px -3px rgba(0,0,0,0.84);
    box-shadow: 0px 0px 14px -3px rgba(0,0,0,0.84);
}

.logtxt1 {
    color: #fff;
    letter-spacing: 1px;
    background-color: #1a3b71;
    padding: 10px 0px;
    font-family: Poppins-Regular;
    font-size: 22px;
}

.logform {
    padding: 10px 25px 10px 25px;
}

.logform-group {
    margin: 8px 0px;
}

.logform-control {
    background-color: #f7f6f6;
    border: 1px solid #d9d8d8;
    letter-spacing: 1px;
    border-radius: 2px;
    width: 98%;
    height: 45px;
    font-size: 12px;
    padding: 10px;
}

.logform-default {
    background-color: #00afd6;
    padding: 10px 20px;
    width: 100%;
    color: #fff;
    font-family: Poppins-SemiBold; letter-spacing:1px;
    font-size: 16px;
}

.regis-default {
    background-color: #ffd200;
    padding: 10px 20px;
    width: 100%;
    color: #1a3b71;
    font-family: Poppins-SemiBold;
    letter-spacing: 1px;
    font-size: 16px;
}
.logforgt {
    text-align: right;
    font-size: 12px;
}
.logforgt a{
    color: #e00909;
  
}

.logtable{margin-top:80px; background-color:#fff; border:1px solid #fff !important; }
    .logtable thead tr th {
        background-color: #14abee;
        color: #fff;
        font-family: Poppins-Regular;
        letter-spacing: 1px; font-size:15px;
    }
    .logtable tbody tr td {
        font-family: Poppins-Regular; font-size:14px;
        letter-spacing: 1px;
    }
.radio {
   
    position: relative;
    display: inline-block;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: normal;
    vertical-align: middle;
    cursor: pointer;
    color: #7e7d7d;
    font-size: 14px;
}
.radio label{padding-right:40px;padding-left: 10px;}
/*----------------------------------------Popup-----------------------------------------*/
.popup-btn {
    display: inline-block;
    width: 100%;
}

    .popup-btn:hover {
    }

.modal {
    display: none;
    overflow: hidden;
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1050;
    -webkit-overflow-scrolling: touch;
    outline: 0;
}

.modal-backdrop {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 1040;
    background-color: #000;
    pointer-events: none;
}

    .modal-backdrop.fade {
        opacity: 0;
        filter: alpha(opacity=0);
    }

.fade {
    opacity: 0;
    -webkit-transition: opacity 0.15s linear;
    -o-transition: opacity 0.15s linear;
    transition: opacity 0.15s linear;
}

    .fade.in {
        opacity: 1;
    }

.modal-backdrop.in {
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.modal-open {
    overflow: hidden;
}

    .modal-open .modal {
        overflow-x: hidden;
        overflow-y: auto;
        background-color: rgba(0,0,0,1);
        z-index: 99999;
    }

.modal-dialog {
    position: relative;
    width: auto;
}

.modal.fade .modal-dialog {
    -webkit-transform: translate(0, -25%);
    -ms-transform: translate(0, -25%);
    -o-transform: translate(0, -25%);
    transform: translate(0, -25%);
    -webkit-transition: -webkit-transform 0.3s ease-out;
    -moz-transition: -moz-transform 0.3s ease-out;
    -o-transition: -o-transform 0.3s ease-out;
    transition: transform 0.3s ease-out;
}

.modal.in .modal-dialog {
    -webkit-transform: translate(0, 0);
    -ms-transform: translate(0, 0);
    -o-transform: translate(0, 0);
    transform: translate(0, 0);
    transition-delay: 0.2s;
    width: 40%;
    margin-top: 0%;
}

.modal-content {
    position: relative;
}

.modal-body p {
    line-height: 28px;
}

.modal-header {
    padding: 5px;
    height: 83px !important;
}

    .modal-header:before,
    .modal-header:after,
    .modal-footer:before,
    .modal-footer:after {
        content: " ";
        display: table;
    }

    .modal-header:after,
    .modal-footer:after {
        clear: both;
    }

.motit {
    font-size: 28px;
    font-family: Poppins-SemiBold;
    text-align: center;
    color: #333;
    letter-spacing: 1px;
}

.close {
    float: right;
    font-size: 21px;
    font-weight: bold;
    line-height: 1;
    color: #000;
    text-shadow: 0 1px 0 #fff;
    opacity: 0.2;
    filter: alpha(opacity=20);
}

button.close {
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: 0;
    -webkit-appearance: none;
    font-family: inherit;
}

.close:hover,
.close:focus {
    color: #000;
    text-decoration: none;
    cursor: pointer;
    opacity: 0.5;
    filter: alpha(opacity=50);
}

.modal-body .close {
    top: 20%;
    right: -5%;
    /* margin-left: 0px; */
    position: absolute;
    z-index: 99;
    color: #fff;
    opacity: 1;
}

.modal-title {
    margin: 0;
    line-height: 1.42857143;
    color: inherit;
    font-size: 18px;
    font-weight: normal;
}

.modal-body {
    position: relative;
    width: 83%;
    padding: 0px !important;
    float: left;
    text-align: center;
}

#driver-terms-modal .modal-body {
    height: 600px;
    overflow: scroll;
}

.modal-footer {
    padding: 15px;
    text-align: right;
    border-top: 1px solid #e5e5e5;
}



.modal .btn-default {
    color: #fff;
    background-color: #1f8234;
}

    .modal .btn-default:hover {
        color: #333;
        background-color: #e6e6e6;
        border-color: #adadad;
        text-decoration: none;
    }

    .modal .btn-default:focus {
        color: #333;
        background-color: #e6e6e6;
        border-color: #8c8c8c;
    }

.modal .btn:active,
.modal .btn.active {
    outline: 0;
    background-image: none;
    -webkit-box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    box-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
}

    .modal .btn:focus,
    .modal .btn:active:focus,
    .modal .btn.active:focus,
    .modal .btn.focus,
    .modal .btn:active.focus,
    .modal .btn.active.focus {
        outline: 5px auto -webkit-focus-ring-color;
        outline-offset: -2px;
    }

.modal .btn-default:active,
.modal .btn-default.active,
.modal .open > .dropdown-toggle.btn-default {
    color: #333;
    background-color: #e6e6e6;
    border-color: #adadad;
}

.modal .btn-default:active,
.modal .btn-default.active,
.modal .open > .dropdown-toggle.btn-default {
    background-image: none;
}

@media (min-width: 768px) {
    .modal-dialog {
        width: 600px;
        margin: 30px auto;
    }

    .modal-content {
        -webkit-box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
        box-shadow: 0 5px 15px rgba(0, 0, 0, 0.5);
    }
}

/*--------------------------------logout-----------------*/

.logouttext {
    font-family: Poppins-Regular,Arial;
    font-size: 10.5px;
    color: #fff;
}
.logoutbtn {
    font-family: Poppins-Regular,Arial;
    background-color: #ffd200;
    border: 2px solid #1a3b71;
    padding: 2px;
    border-radius: 5px;
    color: #1a3b71;
    width: 93px;
}
 .logoutbtn:hover {
        background-color: #1a3b71;
        color: #fff;
        border: 2px solid #ffd200;
    }
.btn-primary {
    background-color: transparent !important;
    border: none !important;
    padding: 0px !important;
}

.dropdown {
    margin-top: 15px;
}

.dropdown-menu {
    margin: 16px 0 0 0px !important;
    border: none !important;
    border-radius: 0px !important;
    min-width: 202px !important;
    font-family: Poppins-Regular;
}
    .dropdown-menu > li > a {
        padding: 5px 10px !important; letter-spacing:1px;
    }







.dropbtn {
    margin-top: 5px;
    background-color: Transparent;
    border:none;
}

.dropdown {
    margin-top: 9px;
    
}

.dropdown-content {
    display: none;
    position: absolute;
    right: 0;
    background-color: white;
    min-width: 192px;
    box-shadow: 0px 0px 0px 0px rgba(0,0,0,0.2);
    z-index: 1;
    text-align: left;
    align-items: flex-end;
    margin-top: 0px;
}

    .dropdown-content a {
        color: black;
        padding: 10px 16px;
        text-decoration: none;
        display: block;
        
    }

.dropdown:hover .dropdown-content {
    display: block;
}




/*----------------------------------------Media-----------------------------------------*/
@media all and (max-width: 360px) and (min-width: 300px) {
    .resmenu ul {
        top: 8% !important;
    }
}

@media all and (max-width: 767px) {
    .ftrbg {
        background-size: cover;
        height: auto;
        padding-bottom: 20px;
    }

    .title {
        font-size: 30px;
    }

    .title1 {
        font-size: 30px;
    }

    .title2 {
        font-size: 30px;
    }

    .txt3 {
        font-size: 18px;
    }

    .txt1 {
        font-size: 20px;
    }

    #owlCarousel, .owl-stage-outer, .owl-stage, .owl-item-bg, .owl-item {
        height: 225px;
    }

    #owlCarousel {
        margin-top: 130px;
    }

    .slide-content {
        top: 14%;
        width: 90%;
        padding: 10px;
        right: -15%;
        height: 130px;
    }

        .slide-content h2 {
            font-size: 18px;
			
        }

        .slide-content p {
            font-size: 13px;
        }

    .intitle {
        font-size: 20px;
    }

    .innerbg {
        margin-top: 130px;
        height: 100px;
    }

    .ship {
        width: 100px;
        margin-top: 40px;
        height: 45px;
    }

    @keyframes myfirst {
        0% {
            left: 0px;
            top: 0px;
        }

        100% {
            left: 200px;
            top: 0px;
        }
    }

    .intag {
        margin-top: 10px;
    }

    .form-control {
        width: 100%;
    }

    .btn-default {
        width: 100%;
    }
    .loginbg{background-size:cover;}
}

@media all and (max-width: 1024px) and (min-width: 768px) {
    .ftrbg {
        background-size: cover;
        height: auto;
        padding-bottom: 20px;
    }

    .slide-content {
        top: 38%;
        width: 60%;
        padding: 10px;
        right: 22%;
        height: 160px;
    }

    .txt1 {
        font-size: 20px;
    }

    .resmenu ul {
        top: 5%;
    }

    .txt3 {
        font-size: 20px;
    }

    .ftr1 {
        font-size: 20px;
    }

    .ftr2 {
        font-size: 12px;
        line-height: 1.4;
    }

    .ftr3 {
        font-size: 15px;
    }

    .innerbg {
        margin-top: 130px;
        height: 150px;
    }
    .loginbg {
        background-size: cover;
    }
	.col-sm-12 i{ font-size:100px;}
}

@media all and (min-width: 768px) {
}
