/* Large desktops and laptops */
@media(max-width: 1440px) {
    .form-search-reservation {
        top: 23%;
    }
    .booking .numb {
        font-size: 20px;
    }
}

/* Large desktops and laptops */
@media (min-width: 1200px) {
    .nav-tabs.nav-justified>li>a {
        font-size: 16px;
    }
}


/* Landscape tablets and medium desktops */
@media (max-width: 1199px) {
    .accomodation-detail-passenger{ padding:15px 0; margin-bottom:15px; }
    .accomodation-detail-passenger .title{ padding-top:15px; padding-bottom:15px; }
    .your-details .payment-method .title,
    .your-details .additional-detail .title{ font-size:30px; padding-bottom:15px; }
    .your-details .payment-method .choose-pay{ padding-bottom:50px; }
    .your-details .payment-method .checkbox{ padding-bottom:10px; }
    .your-details .payment-method .col-1{ margin-bottom:30px; }
    .your-details .container-form-guest{ padding-bottom:15px; }
    .pickup-detail-passenger, 
    .dropoff-detail-passenger{ padding-bottom:25px; }
}

@media (min-width: 992px){
    .your-trip .col-4 .trans-note p{ max-width:70%; }
}

@media (min-width: 992px) and (max-width: 1199px) {
    .your-trip .col-4 .dropoff-text,
    .your-trip .col-4 .pickups-text{ width:145px; }
    .your-trip .col-4 .select-opt-area{ max-width:350px; width:100%; }
    .your-trip .col-4 .select-opt-hotel{ margin-left:145px; max-width:521px; width:100%; margin-top:-10px; }
    .your-trip .col-4 .ao-title,
    .your-trip .col-4 .rt-title{ float:none; padding-left:35px; padding-bottom:0; text-align:left; }
    .your-trip .col-4 .ao-content,
    .your-trip .col-4 .rt-content{ float:none; margin:0; padding-left:35px; }

    .your-details .your-detail-information .title{ font-size:30px; }
    .your-guest-detail .title{ padding-top:0; font-size:30px; }
    .your-guest-detail .form-passenger{ padding:15px 0; }
    .your-guest-detail .date{ padding-bottom:15px; }
    .your-guest-detail .container-form-guest .form-passenger:last-of-type{ padding:15px 0; }

    .form-search-reservation {
        top: 22.8%;
    }
    .nav-tabs.nav-justified>li>a {
        font-size: 16px;
    }
    .search-bar .container-edit-search a {
        padding-left: 50px;
    }
    .routes ul li {
        font-size: 12px;
    }
    .detail-information .passenger-result ul, .detail-information .transport-result ul {
        padding-left: 16px;
    }
    .detail-information .info-route, .detail-information .info-passenger, .detail-information .info-transport, .img-ship img {
        min-height: 145px;
    }
    .detail-information .container-result-first {
        min-height: 195px;
    }
    .detail-information .container-result-second {
        min-height: 195px;
    }
    .top-header .title {
        font-size: 26px;
    }
    .booking .booking-numb button,
    .booking .booking-numb a {
        font-size: 12px;
        width: 120px;
    }
    .booking .numb {
        font-size: 18px;
    }
    .your-guest-detail .side-detail-information .title {
        font-size: 30px;
    }
    .trip-detail .title, .passenger-details .title, .cancelation-request .title {
        font-size: 20px;
    }
    .your-trip .your-detail-trip .col-2, .your-trip .your-detail-trip .col-3 {
        min-height: 140px;
    }
    .your-trip .col-3 .price {
        min-height: 0;
    }
    .your-trip .promotion .text-promo {
        width: 70%;
    }
    .your-detail-information .side-login-information p.or {
        padding: 10% 10% 8% 10%
    }
    .your-trip .heading-route {
        padding-left: 15px;
    }
    .your-trip .heading-passenger, .your-trip .heading-transport, .your-trip .heading-rate {
        padding-left: 10px;
    }
}

@media (min-width: 768px){
    .your-trip .col-4 .trans-note p{ text-align: center; }
}

/* Portrait tablets and small desktops */
@media (min-width: 768px) and (max-width: 991px) {
    .container-form-select{ margin-bottom:10px; }
    .container-form-select:nth-child(3) .select2-container--default .select2-selection--single{ border-left-width:1px; }
    .container-form-select:nth-child(3),
    .container-form-select:nth-child(4){ margin-bottom:0; }
    .form-search-overlay.height-overlay { height:400px; }

    .your-trip .col-4 .dropoff-text,
    .your-trip .col-4 .pickups-text{ width:145px; }
    .your-trip .col-4 .select-opt-transport{ padding-left:150px; width:90%; margin-left:-145px; }
    .your-trip .col-4 .select-opt-area,
    .your-trip .col-4 .select-opt-hotel{ padding-left:150px; width:90%; padding-top:0; }
    .your-trip .col-4 .ao-title,
    .your-trip .col-4 .rt-title{ float:none; padding-left:23px; padding-bottom:0; text-align:left; }
    .your-trip .col-4 .ao-content,
    .your-trip .col-4 .rt-content{ float:none; margin:0; padding-left:23px; }

    .modal-dialog {
        width: 90%;
    }
    .nav-tabs.nav-justified>li>a {
        font-size: 16px;
    }
    .form-area form input {
        font-size: 14px;
    }
    .thank-you .paragraph {
        width: 80%;
    }
    .thank-you .cc-paragraph {
        max-width: 100%;
        width: 600px;
    }

    .thank-you .footer-link {
        width: 60%;
    }
    .search-bar .container-edit-search a {
        padding-left: 10px;
    }
    .flip-icon-result {
        height: 30px;
        background-size: 30px auto
    }
    .title-information .title {
        font-size: 26px;
    }
    .title-information .title-desc {
        font-size: 18px;
    }
    .routes ul li {
        font-size: 12px;
    }
    .detail-information .container-result-first {
        min-height: 0;
    }
    .detail-information .info-route, .detail-information .info-passenger, .detail-information .info-transport {
        min-height: 350px;
    }
    .img-ship img{
         min-height: 150px;
    }
    .detail-information .routes {
        padding-left: 10px;
    }
    .detail-information .passenger-result ul, .detail-information .transport-result ul {
        padding-left: 17px;
    }
    .detail-information .container-price-select {
        width: 100%;
        padding: 0;
        border-top: 1px solid rgb(198, 216, 220);
    }
    .detail-information .total-price, .detail-information .price, .detail-information .disc-price {
        width: 100%;
        display: inline-block;
        text-align: right;
        padding-right:20px;
    }
    .detail-information .opt-btn{ margin-bottom:20px; margin-right:20px; }
    .detail-information .closed-port-notif{ text-align:right; margin:10px 20px; }

    .detail-information .container-big-img .total-price, 
    .detail-information .container-big-img .price, 
    .detail-information .container-big-img .disc-price{
        text-align: center;
        padding-right: 0;
    }

    .detail-information .container-big-img .opt-btn{
        margin-right: auto;
    }

    .detail-information .btn-select, .detail-information .btn-selected {
        position: relative;
        left: 20px;
        bottom: 20px;
        display: inline-block;
        width: 20%;
        font-size: 14px;
    }
    .detail-information .border-price {
        border-left: none;
    }
    .detail-information .container-result-first {
        width: 100%;
    }
    .detail-information .container-result-second {
        width: 100%;
        min-height: 0;
    }
    .detail-information .container-price-select {
        top: 0;
        position: static;
    }
    .continue-reservation button {
        font-size: 16px;
        width: 45%;
    }
    .search-bar .container-edit-search {
        width: 13%;
        text-align:right;
    }
    .top-header .title {
        font-size: 24px;
    }
    .form-search-reservation {
        top: 22.5%;
    }
    .booking .booking-detail .text, .booking .booking-detail ul li {
        padding-left: 33px;
        font-weight: 700;
        font-size: 12px;
    }
    .booking .heading-route, .booking .heading-passenger, .booking .heading-pickup, .booking .heading-depart, .booking .heading-status {
        padding-left: 30px;
    }
    .booking .booking-numb button,
    .booking .booking-numb a {
        font-size: 12px;
        width: 120px;
    }
    .booking .numb {
        font-size: 16px;
    }
    .booking-details p.title {
        color: rgb(16, 163, 193);
        font-size: 12px;
        font-weight: 600;
    }
    .booking-details p, .trip-details p {
        font-size: 12px;
    }
    /*.total-all p.title, .total-all p.amount {
        right: 7%;
    }*/
    .your-guest-detail .side-detail-information .desc {
        font-size: 14px;
    }
    .your-guest-detail .side-detail-information ul {
        padding-left: 5px;
    }
    .your-guest-detail .side-detail-information .title {
        font-size: 26px;
        padding-bottom: 5px;
    }
    .trip-detail .title, .passenger-details .title, .cancelation-request .title {
        font-size: 20px;
    }
    .your-trip .your-detail-trip .col-2 {
        width: 100%;
        box-shadow: none;
        border-right: none;
    }
    .your-trip .your-detail-trip .col-3 {
        border-top: 1px solid rgb(198, 216, 220);
        width: 100%;
        padding-top: 10px;
        padding-bottom: 5px;
    }
    .your-trip .col-3 .price {
        min-height: auto;
        text-align: right;
    }
    .your-trip .col-3 .text {
        margin-top: 0;
        display: inline-block;
    }
    .your-trip .col-3 .price-text {
        display: inline-block;
    }
    .your-trip .your-detail-trip .col-2, .your-trip .your-detail-trip .col-3 {
        min-height: auto;
    }
    .your-trip .col-4 .pickup-text, .your-trip .col-4 .text {
        border-right: none;
    }
    .your-trip .continue-reservation button {
        font-size: 16px;
    }
    .transport-pickup-dropoff .pickup-transport input, .transport-pickup-dropoff .pickup-transport select {
        width: 90%;
        font-size: 12px;
    }
    .reservation-detail input, .reservation-detail select, .trip-detail input, .trip-detail select, .transport-pickup-dropoff select, .transport-pickup-dropoff input, .passenger-details input {
        font-size: 12px;
    }
    .your-details .payment-method button {
        font-size: 18px;
    }
    .your-trip .promotion .text-promo {
        width: 65%;
    }
    .your-detail-information .side-login-information p.or {
        padding: 10% 10% 10% 10%
    }
    .your-trip .heading-route {
        padding-left: 17px;
    }
    .your-trip .heading-passenger, .your-trip .heading-transport, .your-trip .heading-rate {
        padding-left: 10px;
    }
}


/* Landscape phones and portrait tablets */
@media (max-width: 767px) {
    .container-form-select{ margin-bottom:10px; }
    .container-form-select .select2-container--default .select2-selection--single{ border-left-width:1px !important; }
    .detail-information .container-add .col-md-12{ padding:0; }
    .form-search-overlay.height-overlay { height:560px; }
    .search-bar .container-edit-search { text-align:right; }

    .your-trip .col-4 .dropoff-text,
    .your-trip .col-4 .pickups-text{ width:145px; }
    .your-trip .col-4 .select-opt-transport{ padding-left:150px; width:90%; margin-left:-145px; }
    .your-trip .col-4 .select-opt-area,
    .your-trip .col-4 .select-opt-hotel{ padding-left:150px; width:90%; padding-top:0; }
    .your-trip .your-detail-trip .info-transport{ clear:both; }
    .your-trip .col-4 .ao-title,
    .your-trip .col-4 .rt-title{ float:none; padding-left:23px; padding-bottom:0; text-align:left; }
    .your-trip .col-4 .ao-content,
    .your-trip .col-4 .rt-content{ float:none; margin:0; padding-left:23px; }

    .nav-tabs.nav-justified>li>a {
        font-size: 16px;
        padding-left: 25px;
    }
    .nav-tabs.nav-justified {
        width: 100%;
        display: -webkit-box;
    }
    .nav-tabs.nav-justified>li {
        float: none;
        width: 50%;
    }
    .container-form-btn {
        width: 100%;
    }
    .check-availability-btn .container-form {
        width: 100%;
    }
    .destination-form {
        width: 100%;
    }
    .depart, .return {
        width: 50%;
    }
    .depart {
        padding-left: 0;
    }
    .adult-form, .child-form, .infant-form {
        width: 33.33%;
        margin: 0;
        padding: 0;
    }
    .adult-form, .child-form {
        padding-right: 2%;
    }
    .passengers-form .container-form {
        padding: 0;
        margin: 0;
    }
    .text-my-reservation p {
        font-size: 14px;
        text-align: justify;
    }
    .form-area {
        padding: 20px 20px 20px;
    }
    .form-area form input {
        font-size: 14px;
    }
    .way-form {
        font-size: 14px;
    }
    .top-header .search-header {
        padding-top: 28px;
    }
    .thank-you .paragraph {
        width: 80%;
    }
    .thank-you .cc-paragraph {
        max-width: 100%;
        width: 600px;
    }
    .thank-you .doku{ width:100%; }

    .thank-you .footer-link {
        width: 70%;
    }
    .search-bar .container-destination {
        width: 100%;
        padding-bottom: 10px;
    }
    .search-bar .container-passagers {
        width: 70%;
    }
    .search-bar .container-passagers p {
        text-align: left;
    }
    .search-bar .container-edit-search {
        width: 28%;
    }
    .search-bar .container-edit-search a {
        padding-left: 10px;
    }
    .flip-icon-result {
        height: 28px;
    }
    .search-bar .tiny-title {
        padding: 0;
    }
    .title-information .title {
        font-size: 24px;
    }
    .title-information .title-desc {
        font-size: 16px;
    }
    .routes ul li {
        font-size: 12px;
    }
    .detail-information .container-result-first {
        width: 100%;
    }
    .detail-information .container-result-second {
        width: 100%;
        min-height: 0;
        border-left: none;
    }
    .detail-information .container-price-select {
        top: 0;
        position: static;
    }
    .detail-information .container-price-select {
        width: 100%;
        padding: 0;
        border-top: 1px solid rgb(198, 216, 220);
    }
    .detail-information .total-price, 
    .detail-information .price, 
    .detail-information .disc-price {
        width: 100%;
        display: inline-block;
        text-align: right;
        padding-right:20px;
    }
    .detail-information .opt-btn{ float:right; margin-right:20px; margin-bottom:20px; }
    .detail-information .closed-port-notif{ clear:both; text-align:right; margin:10px 20px; }
    .detail-information .title span{ display:block; float:none; margin-top:5px; }

    .detail-information .btn-select, .detail-information .btn-selected {
        position: relative;
        left: 20px;
        bottom: 20px;
        display: inline-block;
        width: 30%;
    }
    .detail-information .heading-route {
        padding-left: 20px;
    }
    .detail-information .container-big-img .heading-route{
        padding: 0 40px;
    }
    .detail-information {
        padding-left: 15px;
        padding-right: 15px;
    }
    .detail-information .info-passenger, .detail-information .info-transport {
        width: 50%;
        min-height: 80px;
        border-top: 1px solid rgb(198, 216, 220);
    }
    .detail-information .info-route {
        width: 70%;
        border-right: none;
    }
    .detail-information .img-ship {
        width: 30%;
    }
    .detail-information .container-big-img .img-ship{
        width: 100%;
        float: none;
    }
    .detail-information .heading-passenger, .detail-information .heading-transport {
        padding-left: 15px;
    }
    .detail-information .border-price {
        border-left: none;
    }
    .detail-information .info-route, .img-ship img {
        height: 150px;
        min-height: 150px;
    }
    .detail-information .container-big-img .container-result-first,
    .detail-information .container-big-img .container-result-second{
        float: none;
    }
    .detail-information .container-big-img .info-route{
        background-position: 10px 20px;
        background-size: 20px auto;
        padding: 15px 0;
        min-height: auto;
        height: auto;
        margin: 0 auto;
        max-width: 300px;
        width: 100%;
        float: none;
    }
    .detail-information .container-big-img .opt-btn{
        margin: 10px auto 20px;
        float: none;
    }
    .detail-information .container-big-img .info-passenger, 
    .detail-information .container-big-img .info-transport{
        padding-top: 20px;
        width: 50%;
        float: left;
        margin: 0;
    }
    .detail-information .container-big-img .heading-passenger, 
    .detail-information .container-big-img .heading-transport{
        padding: 0;
    }
    .detail-information .container-big-img .container-price-select{
        padding: 10px 0;
    }
    .detail-information .container-big-img .total-price, 
    .detail-information .container-big-img .price, 
    .detail-information .container-big-img .disc-price{
        padding: 0;
        text-align: center;
    }

    .continue-reservation .container {
        padding-right: 15px;
        padding-left: 15px;
    }
    .continue-reservation button {
        font-size: 15px;
        width: 50%;
    }
    .top-header .title {
        font-size: 22px;
    }
    .form-search-reservation {
        top: 22%;
    }
    .booking {
        padding-left: 15px;
        padding-right: 15px;
    }
    .booking .booking-detail .text, .booking .booking-detail ul li {
        padding-left: 27px;
        padding-right: 5px;
        font-weight: 700;
        font-size: 12px;
    }
    .booking .heading-route, .booking .heading-passenger, .booking .heading-pickup, .booking .heading-depart, .booking .heading-status {
        padding-left: 27px;
    }
    .booking .booking-detail {
        display: inline-block;
    }
    .booking .booking-detail .route {
        width: 100%;
        border-bottom: 1px solid rgb(198, 216, 220);
    }
    .booking .booking-detail .passengers, .booking .booking-detail .pickup, .booking .booking-detail .departs, .booking .booking-detail .status {
        width: 50%;
    }
    .booking .booking-numb button,
    .booking .booking-numb a {
        font-size: 12px;
        width: 120px;
    }
    .booking .numb {
        font-size: 16px;
    }
    .booking .booking-detail .pickup, .booking .booking-detail .route {
        border-right: none;
    }
    .new-reservation {
        padding-left: 15px;
        padding-right: 15px;
    }
    .new-reservation .btn-select {
        font-size: 12px;
        width: 40%;
    }
    .new-reservation .add-feedback{ font-size:12px; }
    .modal-dialog {
        margin: 25px;
    }
    .trip-details .arrival p {
        text-align: right;
    }
    .booking-details p, .trip-details p {
        font-size: 12px;
    }
    .trip-details {
        display: inline-block;
    }
    .trip-details .departure, .trip-details .arrival {
        display: inline-block;
        width: 49%;
    }
    .trip-details .adults, .trip-details .childs, .trip-details .infants {
        display: inline-block;
        width: 25%;
        vertical-align: top;
    }
    .trip-details .sub-total {
        display: inline-block;
        width: 22%;
        vertical-align: top;
    }
    /*.total-all p.title, .total-all p.amount {
        right: 5%;
    }*/
    /*.transport-pickup-dropoff .pickup-transport {
        width: 100%;
        float: left;
    }
    .transport-pickup-dropoff .transport-fee {
        width: 100%;
        float: left;
    }*/
    .pickup-transport .col-1 {
        width: 35%;
    }
    .pickup-transport .col-2 {
        width: 65%;
    }
    .transport-fee p {
        text-align: right;
    }
    .pickup-transport .body {
        width: 32%;
    }
    .trip-details .sub-total {
        text-align: right;
    }
    .total-all p.amount {
        font-size: 22px;
    }
    .your-details .your-detail-information {
        border: none;
    }
    .your-detail-information .side-login-information {
        padding: 0;
        position: sticky;
    }
    .your-detail-information .side-login-information ul li img {
        width: 125px;
    }
    .your-detail-information .side-login-information {
        padding-top: 20px;
        top: 0;
    }
    .your-detail-information .side-login-information p.or {
        padding: 20px 20px 5px 20px;
        vertical-align: text-bottom;
        font-size: 22px;
    }
    .your-details .your-detail-information .col-1, 
    .your-details .your-detail-information .col-2, 
    .your-details .additional-detail .col-1, 
    .your-details .payment-method .col-1 {
        width: 100%;
        display: block;
    }
    .your-details .your-guest-detail .col-1 {
        width: 100%;
        margin-right: 0;
        margin-bottom: 30px;
        padding: 30px;
    }
    .trip-detail .title, .passenger-details .title, .cancelation-request .title {
        font-size: 16px;
    }
    .your-trip {
        padding-left: 15px;
        padding-right: 15px;
    }
    .your-trip .your-detail-trip .col-1 {
        display: flex;
    }
    .your-trip .your-detail-trip .col-2 {
        width: 100%;
        box-shadow: none;
    }
    .your-trip .your-detail-trip .info-route, .your-trip .your-detail-trip .info-passenger, .your-trip .your-detail-trip .info-transport, .your-detail-trip .info-rate {
        width: 50%;
    }
    .your-trip .your-detail-trip .col-2 {
        border-right: 0;
    }
    .your-trip .your-detail-trip .info-passenger {
        border-right: none;
    }
    .your-trip .your-detail-trip .col-3 {
        border-top: 1px solid rgb(198, 216, 220);
        width: 100%;
    }
    .your-trip .col-3 .price {
        min-height: auto;
        text-align: right;
        padding-top: 10px;
        padding-bottom: 5px;
    }
    .your-trip .col-3 .text {
        margin-top: 0;
        display: inline-block;
    }
    .your-trip .col-3 .price-text {
        display: inline-block;
    }
    .your-trip .heading-route, .your-trip .heading-passenger, .your-trip .heading-transport, .your-trip .heading-rate {
        padding-left: 15px;
    }
    .your-trip .your-detail-trip .title {
        font-size: 18px;
    }
    .your-trip .your-detail-trip .date {
        margin-top: 5px;
    }
    .your-trip .your-detail-trip .col-2, .your-trip .your-detail-trip .col-3 {
        min-height: auto;
    }
    .your-trip .col-4 .pickup-text, .your-trip .col-4 .text {
        border-right: none;
    }
    .your-trip .col-4 .select-opt-transport select, .your-trip .col-4 .select-opt-location select {
        width: 100%;
        font-size: 12px;
    }
    .your-trip .col-4 .dropoff-text {
        padding: 25px 5px 5px 20px;
    }
    .your-trip .description-total .total .text {
        width: 60%;
        font-size: 14px;
    }
    .your-trip .description-total .total .text-total {
        width: 40%;
        font-size: 20px;
    }
    .your-trip .description-total .subtotal .text,
    .your-trip .description-total .discount .text{
        width: 60%;
    }
    .your-trip .description-total .subtotal .text-total,
    .your-trip .description-total .discount .text-total{
        width: 40%;
    }

    .your-trip .continue-reservation button {
        font-size: 14px;
    }
    .reservation-detail input, .reservation-detail select, .trip-detail input, .trip-detail select, .transport-pickup-dropoff select, .transport-pickup-dropoff input, .passenger-details input {
        font-size: 12px;
    }
    .your-details .payment-method button {
        font-size: 16px;
    }
    .cancel-request .btn-select {
        width: 45%;
    }
    .your-trip .promotion .text-promo {
        width: 50%;
        text-align: left;
    }
    .code {
        width: 130px;
    }
    #term-condition .modal-dialog {
        max-width: 90%;
        width: 90%;
    }

    .person-detail-edit .col-1{ width:100%; float:none; display:block; }
    .person-detail-edit .col-2, .person-detail-edit .col-3, .person-detail-edit .col-4{ width:33.33%; float:left; display:block; padding-right:15px; }
    .person-detail-edit .col-4{ padding-right:0; }
    .person-detail-edit .col-1 input, .person-detail-edit .col-2 select, .person-detail-edit .col-3 input, .person-detail-edit .col-4 select{ width:100%; max-width:none; }
}

@media (max-width: 640px) {
    .thank-you{ min-height:0; }
    .thank-you{ padding-bottom:20px; }
    .thank-you .wrapper{ padding:20px 0 0; }

    .your-trip .col-4 .select-opt-transport,
    .your-trip .col-4 .select-opt-area,
    .your-trip .col-4 .select-opt-hotel{ width:95%; }
}


@media (max-width: 550px) {
    .depart, .return{ width:100%; }
    .form-search-overlay.height-overlay { height:630px; }
}

/* Portrait phones and smaller */
@media (max-width: 480px) {
    .your-trip .col-4 .area-text{ padding-bottom:0; }
    .your-trip .col-4 .notif-text{ clear:both; display:block; }
    .form-search-overlay.height-overlay { height:610px; }

    .your-trip .col-4 .dropoff-text,
    .your-trip .col-4 .pickups-text, 
    .your-trip .col-4 .ao-title{ width:100%; padding:17px 10px 0; }
    .your-trip .col-4 .ao-title{ text-align:left; float:none; }
    .your-trip .col-4 .ao-content{ float:none; margin:0; padding:15px; }
    .your-trip .col-4 .select-opt-transport{ padding-left:10px; padding-right:10px; width:100%; margin-left:0; }
    .your-trip .col-4 .select-opt-area,
    .your-trip .col-4 .select-opt-hotel{ padding-left:10px; padding-right:10px; width:100%; padding-top:0; }
    .your-trip .col-4 .select-opt-hotel{ padding-bottom:0; }
    .your-details .payment-method .checkbox label{ font-size:14px; }
    .pickup-detail-passenger .subtext,
    .dropoff-detail-passenger .subtext{ padding-left:0; }

    .your-trip .col-4 .ao-content ul li .row img{ float:none; width:100%; }
    .your-trip .col-4 .ao-content ul li .row img + .bx{ float:none; margin:0 0 20px; padding:0; }
    .your-trip .col-4 .ao-content ul li .row img + .bx a{ color:rgb(16, 163, 193); text-decoration:underline; }

    .nav-tabs.nav-justified>li>a {
        font-size: 14px;
        margin-bottom: 0;
    }
    .container-form-search-first {
        bottom: 10px;
    }
    .destination-form .container-form {
        width: 100%;
    }
    .destination-form .container-form-select {
        width: 100%;
        transition: 0.5s;
    }
    .destination-form button {
        margin-top: 1px;
        margin-bottom: 1px;
        border: none;
        width: 100%;
    }
    .form-area {
        padding: 10px;
    }
    .form-area form input {
        font-size: 14px;
    }
    .find-email {
        width: 100%;
        margin-bottom: 10px;
        padding-right: 0;
    }
    .find-booking {
        width: 100%;
    }
    .thank-you .title {
        font-size: 26px;
    }
    .thank-you .paragraph {
        width: 80%;
        font-size: 14px;
    }
    .thank-you .cc-paragraph {
        max-width: 100%;
        width: 600px;
    }
    .thank-you .doku{ width:100%; margin-top:0; }
    .thank-you .block-payment-type .option span{ width:49%; margin:0; }
    .thank-you .block-payment-type .option label{ margin:0 auto; }


    .thank-you .footer-link a {
        display: block;
        float: none;
        width: 100%;
        margin-top: 20px;
    }
    .thank-you .footer-link {
        width: 60%;
    }
    .thank-you .footer-link a {
        font-size: 14px;
    }
    .top-header .search-header {
        padding-top: 24px;
    }
    .search-bar .destination-name {
        font-size: 20px;
    }
    .flip-icon-result {
        height: 26px;
        background-size: 16px auto;
    }
    .search-bar .container-destination {
        padding-bottom: 10px;
    }
    .detail-information .heading-route, .detail-information .heading-passenger, .detail-information .heading-transport {
        padding-left: 25px;
    }
    .detail-information .total-price, .detail-information .price {
        width: 100%;
    }
    .detail-information .btn-select, .detail-information .btn-selected {
        width: 40%;
    }
    .continue-reservation button {
        width: 90%;
        float: none;
        margin: 0 auto;
    }
    .footer .transfer-method {
        width: 100%;
        display: block;
    }
    .top-header .title {
        font-size: 18px;
    }
    .form-search-reservation {
        top: 21.5%;
    }
    .new-reservation .btn-select {
        font-size: 12px;
        width:100%;
        margin-bottom:5px;
    }
    .new-reservation .add-feedback{ width:100%; margin-left:0; margin-bottom:40px; }
    .booking-details, .trip-details {
        display: block;
        width: 100%;
    }
    .booking-details .booked-by, .booking-details .booked-day, .booking-details .booked-source, .booking-details .booked-status {
        display: block;
        width: 100%;
        padding: 10px 0 0px;
    }
    .booking-details .booked-day p, .booking-details .booked-status p {
        text-align: left;
    }
    .booking-details p.title, .trip-details p.title {
        font-size: 12px;
    }
    .booking-details p, .trip-details p, .transport-pickup-dropoff p, .person-detail p {
        font-size: 12px;
    }
    .trip-details .departure, .trip-details .arrival {
        width: 50%;
        float: left;
    }
    .trip-details .adults, .trip-details .childs, .trip-details .infants{
        width: 33.33%;
        float: left;
    }
    .trip-details .infants{ text-align:right; }
    .trip-details .sub-total{ width:100%; }
    .modal-dialog .close-btn {
        position: absolute;
        top: -10px;
        right: -10px;
        width: 25px;
        height: 25px;
    }
    /*.transport-pickup-dropoff .pickup-transport {
        width: 100%;
        float: left;
    }
    .transport-pickup-dropoff .transport-fee {
        width: 100%;
        float: left;
    }*/
    .pickup-transport .body {
        width: 100%;
    }
    .pickup-transport .desc {
        width: 100%;
        display: block;
    }
    .person-detail .col-1 {
        width: 100%;
        display: block;
    }
    .person-detail .col-2, .person-detail .col-3, .person-detail .col-4 {
        width: 33.33%;
        display: inline-block;
    }

    .person-detail-edit .col-1{ width:100%; float:none; display:block; }
    .person-detail-edit .col-2, .person-detail-edit .col-3, .person-detail-edit .col-4{ width:100%; float:none; display:block; padding-right:0; }
    .person-detail-edit .col-2 select, .person-detail-edit .col-3 input, .person-detail-edit .col-4 select{ width:100%; max-width:none; }

    .total-all p.amount {
        font-size: 18px;
    }
    .side-login-information ul li img {
        width: 100px;
    }
    .your-detail-information .side-login-information {
        padding: 0;
        position: static;
    }
    .your-detail-information .side-login-information ul li img {
        width: 200px;
    }
    .your-detail-information .side-login-information p.or {
        font-size: 24px;
        width: 100%;
        display: block;
    }
    .trip-detail .title, .passenger-details .title, .cancelation-request .title {
        font-size: 18px;
    }
    .your-trip .your-detail-trip .info-route, .your-trip .your-detail-trip .info-passenger, .your-trip .your-detail-trip .info-transport, .your-trip .your-detail-trip .info-rate {
        width: 100%;
    }
    .your-trip .heading-passenger, .your-trip .heading-transport, .your-trip .heading-rate {
        padding-left: 22px;
    }
    .your-trip .heading-route {
        padding-left: 27px;
    }
    .your-trip .your-detail-trip .info-route, .your-trip .your-detail-trip .info-passenger, .your-trip .your-detail-trip .info-transport {
        min-height: 0;
    }
    .your-trip .your-detail-trip .title, .your-trip .your-detail-trip .date {
        width: 100%;
    }
    .your-trip .your-detail-trip .date {
        margin-top: 5px;
    }
    .your-trip .your-detail-trip .col-1 {
        display: inline-block;
    }
    .your-trip .your-detail-trip .title {
        padding: 10px 10px 0 10px;
    }
    .your-trip .your-detail-trip .date {
        text-align: left;
        padding: 0 10px 10px 10px;
    }
    .your-trip .your-detail-trip .info-route, .your-trip .your-detail-trip .info-transport {
        border-right: none;
    }
    .your-trip .col-4 .container-select-choose {
        margin-left: 0;
        margin-right: 0;
        margin: 0 auto;
        width: 100%;
        float: left;
    }
    .your-trip .col-4 .text {
        width: 100%;
    }
    .your-trip .col-4 .text-desc {
        width: 100%;
        text-align: right;
    }
    .your-trip .col-4 .pickup-desc {
        width: 100%;
        text-align: right;
        padding: 20px 20px;
    }
    .your-trip .description-total .total .text {
        width: 55%;
        font-size: 14px;
        text-align: left;
    }
    .your-trip .description-total .total .text-total {
        width: 45%;
        font-size: 20px;
    }
    .your-trip .description-total .subtotal .text,
    .your-trip .description-total .discount .text{
        width: 55%;
        text-align: left;
    }
    .your-trip .description-total .subtotal .text-total,
    .your-trip .description-total .discount .text-total{
        width: 45%;
    }
    .code {
        width: 150px;
    }
    .pickup-transport .col-1 {
        width: 100%;
    }
    .pickup-transport .col-2 {
        width: 100%;
    }
    .reservation-detail input, .reservation-detail select, .trip-detail input, .trip-detail select, .transport-pickup-dropoff select, .transport-pickup-dropoff input, .passenger-details input {
        width: 100%;
    }
    .your-details .payment-method button {
        font-size: 14px;
    }
    .cancel-request .btn-select {
        width: 65%;
    }
    .to, .rtn {
        border-left: 1px solid rgb(210, 210, 210) !important;
    }
    .from, .to {
        margin-bottom: 5px;
    }
    .your-guest-detail .title {
        font-size: 26px;
        padding-bottom: 15px;
    }
    .your-details .your-detail-information .title {
        font-size: 26px;
    }
    .your-details .your-detail-information .form-group {
        padding-left: 0;
    }
    .your-guest-detail .copy {
        margin-left: 0;
    }
    .your-guest-detail .route {
        padding-left: 0;
        font-size: 18px;
    }
    .your-guest-detail .date {
        padding-left: 0;
    }
    .your-guest-detail .head-form-passenger {
        padding-left: 0;
    }
    .your-guest-detail .form-group {
        padding-left: 0;
    }
    .pickup-detail-passenger .title {
        padding-left: 0;
    }
    .pickup-detail-passenger .text {
        padding-left: 0;
        padding-bottom: 15px;
    }
    .accomodation-detail-passenger .title {
        padding-left: 0;
    }
    .dropoff-detail-passenger .title {
        padding-left: 0;
    }
    .dropoff-detail-passenger .text {
        padding-left: 0;
    }
    .dropoff-detail-passenger .text-desc {
        padding-left: 0;
    }
    .your-details .payment-method .choose-pay {
        padding-left: 0;
    }
    .your-details .payment-method .checkbox {
        padding-left: 0;
    }
    .your-details .payment-method .title, .your-details .payment-method .grand-total, .your-details .payment-method .price {
        padding-left: 0;
    }
    .way-form p, .schedule-form p, .passengers-form p, .find-reservation p, .find-booking p {
        margin-bottom: 5px;
    }
    .detail-information .img-ship {
        width: 40%;
    }
    .detail-information .info-route {
        width: 60%;
        min-height:350px;
        height:fit-content;
    }
    .form-search-overlay .edit-search .close, .form-search-reservation .edit-search-reservation .close {
        background-position: center;
    }
    .your-trip .promotion{ padding-left:0; }
    .promotion .promo-code{ width:222px; margin:0 auto; }
    .your-trip .promotion .text-promo, .your-trip .promotion .promo-code {
        display: block;
        font-size: 12px;
        text-align: center;
        float: none;
    }
    .your-trip .promotion .text-promo {
        width: 100%;
        padding-bottom: 10px;
    }
}


/* Custom, iPhone Retina */
@media only screen and (max-width: 320px) {
    .nav-tabs.nav-justified>li>a {
        font-size: 12px;
        margin-bottom: 0;
    }
    .destination-form p, .depart p, .return p, .child-form p, .adult-form p, .infant-form p {
        font-size: 12px;
    }
    .thank-you .paragraph {
        width: 90%;
        font-size: 12px;
    }
    .thank-you .cc-paragraph {
        max-width: 100%;
        width: 600px;
    }
    .thank-you .footer-link a {
        font-size: 12px;
    }
    .search-bar .destination-name {
        font-size: 16px;
    }
    .search-bar .container-passagers p {
        font-size: 12px;
    }
    .flip-icon-result {
        height: 20px;
    }
    .title-information .title {
        font-size: 18px;
    }
    .title-information .title-desc {
        font-size: 14px;
    }
    .search-bar .container-edit-search a {
        font-size: 12px;
    }
    .detail-information .total-price, .detail-information .price, .detail-information .disc-price {
        width: 100%;
        text-align: center;
        padding-right:0;
    }
    .detail-information .opt-btn{ float:none; margin-right:auto; }

    .detail-information .btn-select, .detail-information .btn-selected {
        width: 50%;
        text-align: center;
        display: block;
        left: 0;
    }
    .detail-information .img-ship, .detail-information .info-route {
        width: 100%;
    }
    .detail-information .heading-route {
        padding-left: 10%;
    }
    .continue-reservation button {
        margin: 0 auto;
        float: none;
        width: 100%;
    }
    .booking-details .booked-by, .booking-details .booked-day, .booking-details .booked-source, .booking-details .booked-status {
        display: block;
        width: 100%;
        padding: 0;
    }
    .booking-details p.title, .trip-details p.title {
        font-size: 10px;
    }
    .modal-dialog .close-btn {
        position: absolute;
        top: 10px;
        right: 10px;
        width: 25px;
        height: 25px;
    }
    .modal-dialog {
        width: 100%;
        margin: 0;
    }
    .trip-detail .title, .passenger-details .title, .cancelation-request .title {
        font-size: 16px;
    }
    .your-trip .description-total .total .text {
        width: 50%;
        font-size: 14px;
        text-align: left;
    }
    .your-trip .description-total .total .text-total {
        width: 50%;
        font-size: 18px;
    }
    .your-trip .description-total .subtotal .text,
    .your-trip .description-total .discount .text{
        width: 50%;
    }
    .your-trip .description-total .subtotal .text-total,
    .your-trip .description-total .discount .text-total{
        width: 50%;
    }
    .code {
        width: 60%;
    }
    .your-trip .continue-reservation button {
        width: 100%;
    }
    .form-search-overlay {
        top: 23%;
        bottom: 0;
    }
    #term-condition .modal-dialog {
        max-width: 100%;
        width: 100%;
    }
}

@media screen and (max-width: 700px), (max-height: 500px) {
    .cc-wrapper {
        flex-wrap: wrap;
        flex-direction: column;
    }
}
@media screen and (max-width: 576px) {
    .card-form {
        margin: 0 auto;
    }
}
@media screen and (max-width: 480px) {
    .card-form__inner {
        padding: 25px;
        padding-top: 165px;
    }
    .card-form__row {
        flex-wrap: wrap;
    }
    .card-form__col {
        margin-right: 0;
        flex: unset;
        width: 100%;
        margin-bottom: 20px;
    }
    .card-form__col:last-child {
        margin-bottom: 0;
    }
    .card-form__col.-cvv {
        max-width: initial;
    }
    .card-form__button {
        margin-top: 10px;
    }
    .card-item {
        max-width: 310px;
        height: 220px;
        width: 90%;
    }
    .card-item__top {
        margin-bottom: 25px;
    }
    .card-item__chip {
        width: 50px;
    }
    .card-item__type {
        height: 40px;
        max-width: 90px;
    }
    .card-item__info {
        padding: 10px;
    }
    .card-item__holder {
        font-size: 12px;
        margin-bottom: 5px;
    }
    .card-item__wrapper {
        padding: 20px 10px;
    }
    .card-item__name {
        font-size: 16px;
    }
    .card-item__number {
        font-size: 21px;
        margin-bottom: 15px;
        padding: 10px 10px;
    }
    .card-item__numberItem {
        width: 13px;
    }
    .card-item__numberItem.-active {
        width: 16px;
    }
    .card-item__date {
        font-size: 16px;
    }
    .card-item__dateTitle {
        font-size: 12px;
        padding-bottom: 5px;
    }
    .card-item__band {
        margin-top: 20px;
    }
    .card-item__cvvBand {
        height: 40px;
        margin-bottom: 20px;
    }
    .card-list {
        margin-bottom: -120px;
    }
}

@media screen and (max-width: 360px) {
    .card-form__inner {
        padding: 15px;
        padding-top: 165px;
    }
    .card-item {
        height: 180px;
    }
    .card-item__top {
        margin-bottom: 15px;
    }
    .card-item__chip {
        width: 40px;
    }
    .card-item__type {
        height: 30px;
    }
    .card-item__number {
        font-size: 19px;
        margin-bottom: 10px;
        padding: 10px 10px;
    }
    .card-item__numberItem {
        width: 12px;
    }
    .card-item__numberItem.-active {
        width: 8px;
    }
    .card-item__band {
        height: 40px;
        margin-top: 10px;
    }
    .card-item__cvv {
        padding: 10px 15px;
    }
    .card-item__cvvBand {
        margin-bottom: 15px;
    }
}