/*// Extra small devices (portrait phones, less than 360px)*/

@media (min-width: 320px) and (max-width: 575px) {
    .navbar-mobile-first {
        height: 60px;
    }

    .rate-paket {
        margin-top: 0;
    }


    .navbar-mobile-login {
        background: #fff;
        margin-top: 0 !important;
    }

    /*navbar*/
    .navbar-login-second,
    .img-logo-small,
    .show-mobile {
        display: block !important;
    }

    .navbar-login-first,
    .img-logo-large,
    .navbar-mobile-right,
    /* .banner-large, */
    .mobile-price-detail-noshow,
    .tittle-noshow,
    .address-checkout,
    .checkout-detail,
    .VueCarousel-navigation,
    .display-bahasa,
    .navbar-show,
    .dropdown-search,
    .show-web {
        display: none !important;
    }

    #navbarLogo {
        position: fixed;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        background: #fff;
        z-index: 4;
    }

    .navbar-login-second {
        padding: 0;
    }

    .navbar-login-second {
        padding: 10px 5px;
        background: #fff;
        border: 1px solid #fff;
    }

    .nav-second {
        color: #000 !important;
        border-bottom: 1px solid #000;
        padding: 15px;
    }

    .img-navbar-active {
        width: 200px;
        padding: 5px 10px;
    }

    .icon-navbar-login {
        height: 80px;
        width: 80px;
        border-radius: 50%;
        position: relative;
        background: #fff;
        margin: 10px 25px;
    }

    .nav-second {
        color: #fff !important;
        padding: 15px;
        background: #19b5fe;
        border-bottom-color: #19b5fe;
        margin: 3px auto;
        width: 80%;
        text-align: center;
        box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06);
        -webkit-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06);
        -moz-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06);
        border-radius: 100px;
    }

    .navbar-light .navbar-nav .nav-link {
        color: #19b5fe;
        font-weight: bold;
    }

    .img-login-cicle {
        width: 100px;
        height: 100px;
        padding: 5px;
        background: #fff;
        /* margin: 50px auto !important; */
        margin: 0 auto !important;
        z-index: 2;
        position: relative;
        display: block;
        box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06) !important;
        -webkit-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06) !important;
        -moz-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06) !important;
    }

    .notif-buyer {
        position: relative;
        color: #fff;
        font-size: 15px;
        margin-top: 0;
    }

    .count-notif-buyer {
        height: 50px;
        width: 50px;
        top: 0;
        right: 20px;
        font-size: 30px;
        font-family: Poppins SemiBold;
    }

    .card-title-news-detail {
        margin-bottom: 2rem;
        margin-top: 1.5rem;
    }

    .link-notif {
        color: #fff;
    }

    .namauser {
        font-family: Poppins SemiBold;
        display: block;
        text-align: center;
        height: auto;
    }

    .namauser {
        font-size: 14px;
        margin-top: 0;
        padding: 0;
    }

    .namauser a {
        color: #fff;
    }

    .btn-logout {
        margin-top: 0px;
        background: #f2b400;
        padding: 10px;
        text-align: center;
        border-radius: 3px;
        margin-right: 25px;
    }

    .table-pemesanan {
        width: 100%;
    }

    .table-pemesanan h4 {
        margin-top: 0px;
    }

    .number-rating,
    .event-clock,
    .body-invoice label,
    .body-payment label,
    span.table-price-desc-2 {
        font-size: 8px;
    }

    .form-buyer,
    .form-buyer-area,
    .table-pemesanan,
    .badge-pill,
    .price-diskon-promo span,
    .modal-header-login,
    .statistic-paket-detail-company,
    .detail-profile[data-v-7b45c11e],
    .deskripsi-paket[data-v-b7ee87b0],
    .head-title[data-v-b7ee87b0],
    .sub-title[data-v-b7ee87b0],
    .modaltiket,
    .ket,
    .list-paket[data-v-a0899ede],
    .slider-price-right,
    table.table-price,
    .desc-tittle-table-checkout,
    .link-notif,
    #alert_kupon,
    .btn-link,
    .price-diskon-promo span,
    .price-promo span,
    .card-event-tittle,
    .event-month,
    .event-address,
    .date-detail-paket,
    .no-invoice,
    .news-date,
    .footer-card-news-detail,
    .news-terpopuler,
    .card-invoice,
    .body-invoice {
        font-size: 8px !important;
    }


    .list-unstyled li a,
    .icon-footer-about,
    .list-unstyled li.foot-about,
    .footer-copyright,
    .card-news,
    .title-paket-content,
    .btn-detail,
    .title-desc-paket-promo,
    .price-paket,
    .price-paket-promo,
    .icon-footer-about,
    .card-title-news-detail,
    a label.title-kategory,
    .choose,
    .price-filter-slider,
    .label-banner,
    .list-group-item,
    .news-detail-at,
    .btn-white,
    .subscribe-text span,
    .subscribe2-wrapper .subscribe-form input,
    .subscribe2-wrapper .subscribe-form input.btn-subscribe,
    .btn-logout,
    .card-login,
    .form-control-sm,
    .input-group-sm>.form-control,
    .input-group-sm>.input-group-prepend>.input-group-text,
    .input-group-sm>.input-group-append>.input-group-text,
    .input-group-sm>.input-group-prepend>.btn,
    .input-group-sm>.input-group-append>.btn,
    .content-kategori,
    .address-checkout,
    .register-checkout,
    .btn-save,
    .btn-facebook,
    .btn-google,
    .btn-twitter,
    .list-group-item,
    .icon-profile-detail,
    .label-icon-profile,
    .tab-body,
    .list-sub-menu-profile,
    /* .btn-sm, */
    .btn-group-sm>.btn,
    pre,
    .link-cateory,
    .breadcrumb-paket-detail,
    .table-detail-vendor,
    .desc-trip-info,
    .text-share,
    .title-vendorbypaket,
    .tabs-paket-detail,
    .rating-detail,
    .col-form-label-sm,
    .price-paket-sticky span,
    .gj-picker div[role="navigator"] div[role="period"],
    .gj-picker-bootstrap table tr td div,
    .gj-picker-bootstrap table tr th div,
    .gj-picker-bootstrap [role="header"] [role="date"],
    .form-mobile,
    .address-detail-company,
    .card-title-company-detail,
    .infinite-loading-container[data-v-46b21138],
    .chat-item[data-v-195b3b9c],
    .baris-logo[data-v-7b45c11e],
    .input-search span,
    .pemesanan[data-v-b7ee87b0],
    .grand-total[data-v-b7ee87b0],
    .harga-paket[data-v-b7ee87b0],
    .options[data-v-a0899ede],
    .modal-body,
    .table-checkout,
    .table-checkout-border,
    .card-body,
    .form-control,
    .share-news,
    p,
    .card-diskon,
    .number-input__input[data-v-016ae424],
    .theiaStickySidebar,
    .breadcrumb-paket-detail2,
    .card-pannel-body .custom-control-label,
    .table-checkout,
    .table-checkout tbody,
    .card-invoice h6,
    .card-invoice h5,
    .no-invoice h5,
    .icon-bottom-logo,
    .VueCarousel-navigation-prev[data-v-453ad8cd],
    .VueCarousel-navigation-next[data-v-453ad8cd],
    .title-paket-content h3,
    .navbar-login-second,
    .nav-second,
    .card-title-news,
    .title-paket,
    .custom-packages h3,
    .subscribe-text h4,
    .card-header-populer,
    .name-buyer,
    .card-title-filter h4,
    .table-pemesanan h4,
    .card-sorting,
    h3.tittle-paket,
    .btn-small-facebook,
    .btn-small-whatsapp,
    .btn-small-twitter,
    .btn-small-google-plus,
    h3.tittle-detail-paket,
    h4.tittle-paket,
    .title-company-detail,
    .count-price-detail-company,
    .head-sub[data-v-7b45c11e],
    #list-profile h3,
    .pemesanan h6,
    .optionsicon[data-v-a0899ede],
    .table-checkout-border tfoot,
    .pay-button,
    .duration-paket,
    .title-paket-content h5,
    span.price-table-diskon,
    .text-checkout-total {
        font-size: 12px !important;
    }

    .empty-stars:before,
    .full-stars:before,
    span.font-table {
        font-size: 20px !important;
    }

    h2.tittle-detail-paket,
    .gj-picker-bootstrap.datepicker [role="header"] [role="year"],
    .close,
    .nama-perusahaan h1,
    .card-checkout h4,
    .card-body-title-filter,
    .card-body-filter .custom-control-label-sm,
    .label-duration,
    .list-unstyled h5,
    .card-title-news-detail h4,
    .total-paket .form-control-sm {
        font-size: 16px !important;
    }

    .card-body-filter-scroll {
        overflow-y: auto;
        max-height: 580px;
        position: relative;
        overflow-x: hidden;
        display: block;
        padding-bottom: 3rem;
    }

    textarea.form-control-sm {
        height: 100px !important;
    }

    .custom-control-label::after,
    .custom-control-label::before {
        width: 20px;
        height: 20px;
    }

    .custom-radio .custom-control-label {
        padding: 10px 0;
    }

    .tittle-detail-paket {
        margin: 1rem 0;
        margin-top: 0;
    }

    .breadcrumb-paket-detail2 {
        position: relative;
        white-space: nowrap;
        overflow-x: auto;
        margin-top: 0rem;
    }

    .breadcrumb-paket-detail2 li.arrow {
        margin-right: 35px;
    }


    .breadcrumb-paket-detail2 li.arrow+li.arrow:after,
    .breadcrumb-paket-detail2 li.arrow+li.arrow:before {
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
        top: 0px;
    }

    .breadcrumb-paket-detail2 li.arrow+li.arrow:before {
        border-left: 5px solid #19b5fe;
        left: -19px;
    }

    .breadcrumb-paket-detail2 li.arrow+li.arrow:after {
        border-left: 5px solid #fff;
        left: -21px;
    }

    form.form-horizontal {
        width: 100%;
    }

    /* .tittle-banner h1{
        font-size: 70px;
    } */
    .event-day {
        font-size: 25px;
    }

    .event-date {
        padding: 5px;
    }

    .title-paket-content h5 {
        margin-bottom: 1rem !important;
    }

    .number-input__button[data-v-016ae424]::before {
        height: 3px !important;
        width: 50% !important;
    }

    .number-input__button[data-v-016ae424]::after {
        height: 40% !important;
        width: 3px !important;
    }

    .number-input--inline>input[data-v-016ae424] {
        width: 9.5rem !important;
        font-size: 16px !important;
        padding: 10px 0 !important;
    }

    .number-input__button[data-v-016ae424] {
        width: 2.5rem !important;
        height: auto;
    }

    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .number-input__input[data-v-016ae424] {
        padding: 0rem 0.25rem 0.25rem 1.25rem !important;
    }

    .card-filter {
        height: 740px;
        overflow-y: scroll;
    }

    .list-unstyled li a.icon-footer {
        font-size: 20px !important;
        padding: 0 5px;
    }

    .list-unstyled li {
        margin-bottom: 0;
    }

    .card-header-populer {
        border-bottom: 5px solid rgb(242, 180, 0);
    }

    .point-of-rate {
        font-size: 25px;
    }

    .menu-profile-buyer {
        display: none;
    }

    .card-title-banner {
        height: 150px;
    }

    .card-title-banner>.tittle-banner a,
    .card-paket-promo-large>.tittle-banner a {
        padding: 5% 10%;
    }

    .tittle-banner h1:before,
    .tittle-banner h1:after {
        width: 30px;
        height: 1px;
        margin: 0 10px;
    }

    .container {
        position: relative;
        display: block !important;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .navbar-mobile-first {
        z-index: 2;
        top: -1px;
        height: 60px;
        padding: 10px;
    }

    .navbar-mobile-first-1 {
        height: 60px;
    }

    .navbar-second {
        margin-top: 0px;
        font-size: 1rem;
        position: absolute;
    }

    .nav-mobile-second {
        margin-top: 0 !important;
        background: #fff;
        height: 100%;
        padding-top: 0;
    }

    .dropdown-category::before,
    .dropdown-category::after {
        left: 225px;
        margin: 0;
        top: -26px;
    }

    .dropdown-notif {
        position: fixed !important;
        left: 722px;
        top: 60px;
    }

    .dropdown-kategory {
        position: absolute;
        left: 160px;
        font-size: 35px;
        width: 260px;
        top: 15px;
        display: none;
    }

    .dropdown-kategory img {
        width: 55px;
    }

    .input-search img {
        width: 20px;
    }

    .dropdown-category {
        margin-top: 10px;
        margin-left: 0;
        width: 98%;
        padding: 15px;
        position: fixed !important;
        left: 10px;
    }

    .statistic-detail-company {
        width: 49%;
    }

    .nav-left {
        padding-left: 15px !important;
    }

    .menu-profile-buyer-fixed {
        background: #fff;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 2;
        -webkit-box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
        box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
    }

    .form-full {
        width: 73%;
        position: absolute;
        z-index: 1;
        top: 5px;
        left: 50px;
        font-size: 1rem;
    }

    .form-full-mobile {
        width: 60%;
    }

    .detail-profile[data-v-7b45c11e] {
        margin-bottom: 15px;
    }

    .input-group-search>.form-control:not(:first-child) {
        font-size: 12px !important;
    }

    li.nav-item {
        display: inline-block;
        padding: 0;
        font-size: 12px;
    }

    .img-logo,
    .icon-logo {
        z-index: 2;
        top: 15px;
    }

    .img-logo {
        position: absolute;
    }

    .icon-bottom-logo {
        position: fixed;
        z-index: 2;
        top: 20px;
        right: 15px;
        font-size: 20px !important;
    }

    .icon-logo {
        position: fixed;
        z-index: 2;
        top: 20px;
        left: 10px;
        width: 25px;
    }

    .img-icon-mobile {
        position: fixed;
        filter: grayscale(100%);
        opacity: .2;
        bottom: -90px;
        z-index: 0;
        width: 300px;
        left: -130px;
    }

    .icon-navbar-login {
        height: 80px;
        width: 80px;
        border-radius: 50%;
        position: relative;
        background: #19b5fe;
        margin: 10px 15px;
        padding: 15px;
    }

    .img-footer {
        width: 100px;
        height: auto !important;
        float: none;
        margin: 0 auto 20px auto;
    }

    .subscribe2-wrapper .subscribe-form input,
    .subscribe2-wrapper .subscribe-form input.btn-subscribe {
        height: 35px;
        border-radius: 50px;
    }

    .subscribe2-wrapper .subscribe-form input.btn-subscribe {
        padding: 10px 0;
    }

    .list-unstyled li.foot-about {
        padding-left: 1.5rem;
        position: relative;
        min-height: 1rem;
        width: 95%;
        vertical-align: middle;
        margin: auto;
        text-align: left;
    }

    .obj-center {
        display: block;
        margin-left: auto;
        margin-right: auto;
        top: 0;
        width: 100%;
        position: relative;
        left: 0;
        right: 0;
    }

    .mobile-category {
        flex: 0 0 25%;
        max-width: 25%;
    }

    pre {
        line-height: 1.5;
    }

    .mobile-category .card-icon-category {
        height: 80px;
    }

    .mobile-category .icon-category-dropdown,
    .VueCarousel-navigation-prev[data-v-453ad8cd],
    .VueCarousel-navigation-next[data-v-453ad8cd] {
        height: 60px;
        width: 60px;
    }

    .mobile-category .card-name-icon-category-dropdown {
        font-size: 20px;
        width: 150px;
        height: 60px;
    }

    .title-menu-check {
        font-size: 16px !important;
        font-weight: bold;
        border-bottom: 2px solid rgba(25, 181, 254, 1);
        padding-bottom: 10px;
    }

    .title-company-detail,
    .address-detail-company {
        text-align: center;
    }

    .count-price-detail-company {
        line-height: 1.5;
        font-size: 25px !important;
    }

    .share-detail-directory {
        padding-top: 0px !important;
        text-align: left !important;
    }

    .statistic-paket-detail-company {
        width: 100%;
        text-align: center;
    }

    h4.tittle-paket {
        margin-top: 40px;
    }

    .duration-detail {
        text-align: center;
        font-size: 50px;
        padding: 30px;
    }

    .main-mobile {
        padding: 0 10px !important;
    }

    .main-mobile-2 {
        padding: 0 !important;
    }

    .subscribe-area {
        padding: 15px 30px;
    }

    .card-diskon {
        width: 35px;
        height: 31px;
        left: 10px;
        font-size: 8px !important;
        padding: 7px 5px;
    }

    .card-diskon::before {
        height: 5px;
        width: 5px;
    }

    .price-diskon-promo,
    .price-promo {
        margin-top: -10px;
    }

    .card-event-body {
        height: auto;
    }

    .event-body {
        height: 60px;
        font-size: 8px;
    }

    /*kategory*/
    .icon-kategory {
        width: 50px;
        height: 50px;
        margin: 10px;
    }

    .card-custom-packages {
        height: 120px;
    }


    .news-detail-at {
        padding: 0 1rem;
    }

    .card-title-filter {
        font-size: 20px;
        padding: 5px 10px;
    }

    .navbar-toggler:not(:disabled):not(.disabled) {
        padding: 10px 15px !important;
    }

    .footer-copyright {
        text-align: center;
    }

    .duration-paket {
        right: 0px;
        top: 45px;
    }

    .card-body-title-filter {
        margin-bottom: 10px;
    }

    /* .paket-mobile .VueCarousel-inner{
        flex-basis: 380px !important;
        transform: translate(-560px, 0px) !important;
    } */

    /*paket card*/
    .card-tiket {
        margin-bottom: 150px;
    }

    .choose {
        text-align: left;
    }

    .card-paket {
        height: 200px;
    }

    .photos-paket {
        height: 100px;
    }

    .price-diskon-promo {
        margin-top: -5px;
        margin-bottom: 0px;
        line-height: 1;
    }

    .desc-paket-promo {
        height: 35px;
        padding: 5px;
    }

    .btn-heart input[type="checkbox"].heart-checkbox+label.heart-label {
        font-size: 18px;
    }

    .btn-heart input[type="checkbox"].heart-checkbox {
        width: 80px;
        height: 80px;
        border-radius: 50%;
    }

    .btn-heart-diskon .btn-heart {
        top: 5px;
    }

    .btn-heart {
        width: 30px;
        height: 30px;
        top: -1.25rem;
        padding: 5px 6px;
        right: 3px;
    }

    .title-village-promotion {
        width: 160px;
        font-size: 16px;
        height: 85px;
    }

    .card-paket-village {
        height: 100px;
    }

    .card-paket-village {
        height: 85px;
        width: 155px;
    }

    .title-custom-packages {
        margin-bottom: 20px;
    }

    .list-unstyled {
        text-align: center;
    }

    .news-detail-date {
        float: right;
        margin-bottom: 2rem;
    }

    .img-choose {
        width: 160px;
        height: 160px;
    }

    .uploadbannerclick {
        height: 120px !important;
    }

    .uploadbannerclick img {
        height: 100% !important;
        width: 100% !important;
        object-fit: cover;
    }

    .baris-logo {
        padding: 10px !important;
    }

    .nama-perusahaan {
        margin-top: 15px !important;
    }

    .sub-profile {
        margin: 20px 0 20px auto !important;
    }

    .col-logo {
        width: 100px;
        padding: 0;
        text-align: center;
        margin: 0 auto;
    }

    .logo img {
        object-fit: cover;
        width: 100%;
        height: 100%;
    }

    .card-sorting {
        white-space: nowrap;
        overflow: auto;
        position: relative;
    }

    #menuCheckout {
        position: fixed;
        z-index: 2;
        top: 0;
        background: #fff;
        width: 100%;
        height: 100%;
        left: 0;
    }

    .mobile-price-detail {
        padding: 10px 0;
        overflow-y: auto;
        height: 100%;
        position: relative;
    }

    .card-title-company-detail {
        height: auto;
        padding-bottom: 0px;
    }

    /* .badge-warning {
    margin-bottom: 100px;
} */

    .card-paket-diskon {
        height: 120px;
        width: 160px;
    }

    .card-paket-village {
        height: 85px;
        width: 155px;
    }

    .navbar-fixed-check {
        -webkit-box-shadow: 0 8px 8px rgba(0, 0, 0, 0.06);
        -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
    }

    /*grid*/
    .col-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .col-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        max-width: 83.33333%;
    }

    .col-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.666666%;
        flex: 0 0 66.666666%;
        max-width: 66.666666%;
    }

    .col-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }

    .col-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }

    .col-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-2-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }

    /*filter*/
    .filter-navbar {
        position: fixed;
        margin: 0 auto;
        bottom: 0;
        left: 0;
        right: 0;
        margin-top: -45px;
        z-index: 3;
    }

    #filter {
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        background: #fff;
        top: 0;
    }

    .filter-navbar {
        min-height: 0;
    }

    /*button*/
    .card-pannel-body .custom-control {
        padding-left: 2.5rem;
    }

    button.btn-filter[aria-expanded="true"] {
        position: fixed;
        border: 1px solid #19b5fe;
        z-index: 2;
        bottom: 1.2%;
        color: #fff;
        right: 0;
        transition: 1s;
        left: 0;
        margin: 0 auto;
        text-align: center;
        width: 96%;
        background: rgba(25, 181, 254, 1);
        padding: 25px;
        font-weight: bold;
        text-transform: uppercase;
        transition: 1s;
        display: block;
    }


    button.btn-logo[aria-expanded="true"] div.icon-logo {
        display: none;
    }

    button.btn-logo[aria-expanded="true"] div.icon-cross-logo {
        display: block;
        font-size: 30px;
        font-weight: bold;
        z-index: 5;
        position: fixed;
        right: 15px;
        top: 15px;
    }

    button.btn-filter[aria-expanded="true"] span::before {
        content: "CARI";
        font-size: 16px;
    }



    button.btn-filter[aria-expanded="false"] {
        position: absolute;
        top: -50px;
        transition: 1s;
        display: inline-block;
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        line-height: 1;
        border: 2.5px solid #ffffff;
        -webkit-font-smoothing: antialiased;
        box-shadow: rgba(0, 0, 0, 0.04) 0 2px 6px;
        padding: 5px 20px;
        border-radius: 50px;
        cursor: pointer;
        background: #fff;
        white-space: nowrap;
        -webkit-box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        -moz-box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        left: 0;
        right: 0;
        margin: 0 auto;
    }


    button.btn-check[aria-expanded="false"],
    .pay-button {
        background: #fff;
        position: fixed;
        color: #fff;
        width: 100%;
        right: 0;
        bottom: 0px;
        z-index: 1;
        padding: 15px !important;
        -webkit-box-shadow: 0 8px 8px rgba(0, 0, 0, 0.06);
        -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
        box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
    }

    button.btn-check[aria-expanded="false"] span {
        background: rgba(25, 181, 254, 1);
        display: block;
        position: relative;
        padding: 15px;
        border-radius: 5px;
    }

    button.btn-check[aria-expanded="true"] {
        position: fixed;
        z-index: 3;
        top: 5px;
        right: 0px;
    }

    button.btn-check[aria-expanded="true"] span::before {
        content: "X";
        font-size: 20px;
    }

    button.btn-check[aria-expanded="false"] span::before {
        content: "CHECKOUT";
        font-size: 16px;
    }

    button.btn-filter[aria-expanded="false"] span::before {
        content: "Filter \f0b0";
        font-size: 16px;
    }

    .vue-slider-dot {
        width: 15px !important;
        height: 15px !important;
    }

    .vue-slider {
        height: 10px;
    }

    .vue-slider-dot-handle {
        background-color: #19b5fe;
        border: 2px solid #19b5fe;
    }

    .btn-facebook,
    .btn-google,
    .btn-twitter {
        margin-bottom: 20px;
    }

    .btn-save {
        margin-bottom: 10px;
        padding: 5px 20px;
        width: auto !important;
    }

    input#foto_buyer,
    input#foto_identitas {
        width: 100%;
        font-size: 12px;
        margin-bottom: 1rem;
        text-align: center;
    }

    .card-body-filter .custom-control {
        min-height: 0;
        padding-left: 3rem;
        margin-bottom: 1rem;
    }

    .card-body-filter .custom-control-label::before,
    .card-body-filter .custom-control-label::after {
        height: 30px;
        width: 30px;
        border-radius: 5px;
    }

    .custom-radio .custom-control-label {
        padding: 10px 0;
    }

    .price-filter-slide {
        margin-bottom: 1rem;
    }

    .input-group-filter {
        font-size: 25px !important;
        background: #19b5fe;
        color: #fff;
        width: 130px;
    }

    .form-control-filter {
        font-size: 25px !important;
    }

    .card-img-news {
        height: 150px;
    }

    .news-terpopuler {
        padding: 5px 10px;
    }

    .card-news {
        height: 200px;
        padding: 5px 20px;
    }

    .form-sorting .form-control-sm {
        padding: 0.5rem 0.75rem;
        font-size: 2.25rem;
        line-height: 1.5;
        border-radius: 0.5rem;
    }

    .btn-sm,
    .btn-group-sm>.btn {
        padding: 5px 10px;
        font-size: 10px;
        width: 100%;
        margin-bottom: .5rem;
    }

    button.icon-menu-profile[aria-expanded="false"] {
        position: fixed;
        height: 150px;
        width: 150px;
        background: rgba(25, 181, 254, 1);
        border-radius: 50%;
        z-index: 1;
        bottom: 30px;
        right: 30px;
        font-size: 100px;
        color: #fff;
    }

    button.icon-menu-profile[aria-expanded="true"] {
        text-align: center;
        width: 100%;
        background: rgba(25, 181, 254, 1);
        font-size: 50px;
        color: #fff;
        padding: 15px;
    }

    .breadcrumb-paket-detail {
        white-space: nowrap;
        overflow: auto;
        display: -webkit-inline-box;
        width: 100%;
    }

    .btn-small-facebook,
    .btn-small-whatsapp,
    .btn-small-twitter,
    .btn-small-google-plus {
        width: 25px;
        height: 25px;
        padding: 0 10px;
        font-size: 25px !important;
    }

    .point-of-rating-detail {
        height: 10px;
    }

    .width-rating-empty,
    .width-rating-full {
        height: 10px;
        border-radius: 5px;
    }

    button .gj-icon {
        font-size: 15px !important;
        left: 10px !important;
    }

    .quantity-up,
    .quantity-down {
        font-size: 18px;
        width: 30px;
        height: 30px;
    }

    .gj-picker-bootstrap table tr td div,
    .gj-picker-bootstrap table tr th div {
        width: 30px;
        height: 30px;
        vertical-align: middle;
        display: table-cell;
    }

    .options[data-v-a0899ede] {
        left: -140px;
    }

    /*images*/
    .icon-invoice {
        width: 20px;
    }

    .img-inovice {
        width: 150px;
    }

    .img-paket[data-v-b7ee87b0],
    .tumb-paket[data-v-a0899ede] {
        height: 150px !important;
        margin-bottom: 20px;
    }

    .img-ulasan-belum-buyer,
    .img-pesan-buyer {
        width: auto;
        height: 150px;
        margin-bottom: 1rem;
    }

    .img-news-popular {
        height: 100px;
    }

    .icon-partner {
        width: 50px;
    }

    .card-paket-promo-large {
        height: 16vh;
    }

    .card-paket-promo-small {
        height: 8vh;
    }

    .img-first {
        width: 150px;
        height: 150px;
        margin: 0 auto;
        margin-bottom: 16px;
        border-radius: 50%;
    }

    .VueCarousel-dot[data-v-438fd353] {
        width: 10px !important;
        height: 10px !important;
        margin-bottom: 0;
    }

    .img-register {
        width: 200px;
        margin-bottom: 1rem;
    }

    .card-login {
        margin-top: 1rem;
    }

    .img-icon-sosmed {
        width: 10px;
        left: 20px;
    }

    .banner-search {
        height: 200px;
    }

    .img-menu-profile-buyer-fixed {
        background: #fff;
        margin: 5px auto;
        font-size: 20px;
    }

    .img-pesan-buyer {
        height: 150px;
    }

    .tabs-paket-detail .nav-link {
        padding: 5px;
    }

    .img-logo-vendorbypaket {
        width: 200px;
    }

    .img-detail-menu {
        height: 150px;
        width: auto;
        position: relative;
        overflow: hidden;
        display: block;
        margin-top: 15px;
        border-radius: 10px;
    }

    .gj-datepicker-bootstrap [role="right-icon"] button {
        width: 80px;
    }

    .gj-datepicker .form-control-sm {
        padding-left: 0;
    }

    .photos-detail-directory-in {
        width: 200px;
        height: 200px;
        margin-top: -160px;
        margin-bottom: 1rem;
    }

    .card-banner-travel-directory {
        height: 200px;
    }

    .img-detail-carousel,
    .img-detail-carousel-large {
        height: 25vh !important;
    }

    .img-detail-carousel-middle2 {
        height: 11.9vh !important;
    }

    .img-detail-carousel-middle {
        height: 15.35vh !important;
    }

    .img-detail-carousel-small {
        height: 8.45vh !important;
    }

    .card-comment::before {
        content: '';
        position: absolute;
        left: -20px;
        top: 10px;
        border-top: 10px solid transparent;
        border-right: 20px solid #f4f4f4;
        border-bottom: 10px solid transparent;
    }

    /* end images */
    /*table*/
    .desc-tittle-table-checkout {
        color: #888;
        margin-bottom: 2rem;
    }

    .table-checkout,
    .table-checkout-border {
        width: 100%;
    }

    .table-checkout-border th {
        font-family: "Poppins SemiBold";
        text-align: center;
        border-bottom: 2px solid #888;
    }

    .border-bottom-checkout {
        border-bottom: 2px solid #888;
    }

    .table-checkout-border td,
    .table-checkout-border th {
        padding: 0.25rem 0;
    }

    .table-checkout-border tfoot,
    .pay-button {
        font-family: "Poppins SemiBold";
    }

    .table-checkout-border tfoot td {
        border-top: 2px solid #888;
        border-bottom: 2px solid #888;
        font-size: 35px;
    }

    .table td,
    .table th {
        padding: 5px;
        vertical-align: top;
        border-top: 1px solid #dee2e6;
        width: 1% !important;
    }

    .kode-unik-invoice .arrow-bottom-invoice::after {
        bottom: -31px;
        font-size: 8px;
    }

    /*form*/
    .input-group-register-text {
        /* height: 60px; */
        width: 20px;
    }

    .input-form-register {
        padding-left: 22px !important;
    }

    .form-control-sm,
    .input-group-sm>.form-control,
    .input-group-sm>.input-group-prepend>.input-group-text,
    .input-group-sm>.input-group-append>.input-group-text,
    .input-group-sm>.input-group-prepend>.btn,
    .input-group-sm>.input-group-append>.btn {
        height: 30px !important;
    }

    textarea.form-control-sm {
        height: 100px !important;
    }

    .custom-control-label::after,
    .custom-control-label::before {
        width: 20px;
        height: 20px;
    }

    .custom-control {
        padding-left: 2.5rem;
    }

    .text-or {
        width: 35px !important;
        top: 0px;
    }

    .icon-profile-detail {
        flex: 0 0 10%;
    }

    .label-icon-profile {
        flex: 0 0 90%;
    }

    .form-buyer {
        height: 30px !important;
    }

    .custom-packages {
        padding: 20px 0;
    }

    .card-welcome h3 {
        font-size: 20px;
    }

    #chatra.chatra--side-bottom {
        bottom: 70px !important;
    }

    /* footer{
        display: none;
    } */

    /*modal*/
    .modal-dialog {
        max-width: 80%;
    }

}

/*// Small devices (landscape phones, 576px and up)*/
@media (min-width: 576px) and (max-width: 767px) {

    .navbar-login-second,
    .img-logo-small,
    .show-mobile {
        display: block !important;
    }

    .img-logo-large,
    .navbar-mobile-right,
    .display-bahasa,
    .navbar-show,
    .show-web {
        display: none !important;
    }

    .navbar-login-first,
    .img-logo-large,
    .navbar-mobile-right,
    /* .banner-large, */
    .mobile-price-detail-noshow,
    .tittle-noshow,
    .address-checkout,
    .checkout-detail,
    .VueCarousel-navigation,
    .display-bahasa {
        display: none;
    }

    #navbarLogo {
        position: fixed;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        background: rgba(25, 181, 254, 1);
        z-index: 4;
    }

    .navbar-login-second {
        padding: 0;
    }

    .nav-second {
        color: #000 !important;
        border-bottom: 1px solid #000;
        padding: 15px;
    }

    .img-navbar-active {
        width: 200px;
        padding: 5px 10px;
    }

    .icon-navbar-login {
        height: 80px;
        width: 80px;
        border-radius: 50%;
        position: relative;
        background: #fff;
        margin: 10px 25px;
    }

    .navbar-light .navbar-nav .nav-link {
        color: #fff;
        font-weight: bold;
    }

    .img-login-cicle {
        width: 65px;
        height: 65px;
        padding: 3px;
        background: #fff;
        margin: 5px 30px !important;
    }

    .notif-buyer {
        position: relative;
        color: #fff;
        font-size: 15px;
        margin-top: 0;
    }

    .count-notif-buyer {
        height: 50px;
        width: 50px;
        top: 0;
        right: 20px;
        font-size: 30px;
        font-family: Poppins SemiBold;
    }

    .link-notif {
        color: #fff;
    }

    .namauser {
        font-family: Poppins SemiBold;
    }

    .namauser {
        font-size: 14px;
        margin-top: 0;
        padding: 0;
        padding-top: 1rem;
    }

    .namauser a {
        color: #fff;
    }

    .btn-logout {
        margin-top: 0px;
        background: #f2b400;
        padding: 10px;
        text-align: center;
        border-radius: 3px;
        margin-right: 25px;
    }

    .table-pemesanan {
        width: 100%;
    }

    .table-pemesanan h4 {
        margin-top: 0px;
    }

    .number-rating,
    .event-clock,
    .body-invoice label,
    .body-payment label {
        font-size: 8px;
    }

    .form-buyer,
    .form-buyer-area,
    .table-pemesanan,
    .badge-pill,
    .price-diskon-promo span,
    .modal-header-login,
    .statistic-paket-detail-company,
    .detail-profile[data-v-7b45c11e],
    .deskripsi-paket[data-v-b7ee87b0],
    .head-title[data-v-b7ee87b0],
    .sub-title[data-v-b7ee87b0],
    .modaltiket,
    .ket,
    .list-paket[data-v-a0899ede],
    .slider-price-right,
    table.table-price,
    .desc-tittle-table-checkout,
    .link-notif,
    #alert_kupon,
    .btn-link,
    .price-diskon-promo span,
    .price-promo span,
    .card-event-tittle,
    .event-month,
    .event-address,
    .date-detail-paket,
    .no-invoice,
    .card-invoice,
    .body-invoice {
        font-size: 25px !important;
    }

    .list-unstyled li a,
    .icon-footer-about,
    .list-unstyled li.foot-about,
    .footer-copyright,
    .card-news,
    .news-terpopuler,
    .title-paket-content,
    .btn-detail,
    .title-desc-paket-promo,
    .price-paket,
    .empty-stars:before,
    .full-stars:before,
    .price-paket-promo,
    .card-body-title-filter,
    .icon-footer-about,
    .card-title-news-detail,
    a label.title-kategory,
    .choose,
    .card-body-filter .custom-control-label-sm,
    .price-filter-slider,
    .news-date,
    .footer-card-news-detail,
    .label-banner,
    .list-group-item,
    .news-detail-at,
    .btn-white,
    .subscribe-text span,
    .subscribe2-wrapper .subscribe-form input,
    .subscribe2-wrapper .subscribe-form input.btn-subscribe,
    .btn-logout,
    .card-login,
    .form-control-sm,
    .input-group-sm>.form-control,
    .input-group-sm>.input-group-prepend>.input-group-text,
    .input-group-sm>.input-group-append>.input-group-text,
    .input-group-sm>.input-group-prepend>.btn,
    .input-group-sm>.input-group-append>.btn,
    .content-kategori,
    .address-checkout,
    .register-checkout,
    .btn-save,
    .btn-facebook,
    .btn-google,
    .btn-twitter,
    .list-group-item,
    .icon-profile-detail,
    .label-icon-profile,
    .tab-body,
    .list-sub-menu-profile,
    /* .btn-sm, */
    .btn-group-sm>.btn,
    pre,
    .link-cateory,
    .breadcrumb-paket-detail,
    .table-detail-vendor,
    .desc-trip-info,
    .text-share,
    .title-vendorbypaket,
    .tabs-paket-detail,
    .rating-detail,
    .col-form-label-sm,
    .price-paket-sticky span,
    .gj-picker div[role="navigator"] div[role="period"],
    .gj-picker-bootstrap table tr td div,
    .gj-picker-bootstrap table tr th div,
    .gj-picker-bootstrap [role="header"] [role="date"],
    .form-mobile,
    .address-detail-company,
    .card-title-company-detail,
    .infinite-loading-container[data-v-46b21138],
    .chat-item[data-v-195b3b9c],
    .baris-logo[data-v-7b45c11e],
    .input-search span,
    .pemesanan[data-v-b7ee87b0],
    .grand-total[data-v-b7ee87b0],
    .harga-paket[data-v-b7ee87b0],
    .options[data-v-a0899ede],
    .modal-body,
    .table-checkout,
    .table-checkout-border,
    .card-body,
    .form-control,
    .share-news,
    p,
    .card-diskon,
    .label-duration,
    .number-input__input[data-v-016ae424],
    .theiaStickySidebar,
    .breadcrumb-paket-detail2,
    .card-pannel-body .custom-control-label,
    .table-checkout,
    .table-checkout tbody,
    .card-invoice h6,
    .card-invoice h5,
    .no-invoice h5 {
        font-size: 30px !important;
    }

    .list-unstyled h5,
    .icon-bottom-logo,
    .VueCarousel-navigation-prev[data-v-453ad8cd],
    .VueCarousel-navigation-next[data-v-453ad8cd],
    .title-paket-content h3,
    .navbar-login-second,
    .nav-second,
    .card-title-news,
    .title-paket,
    .custom-packages h3,
    .subscribe-text h4,
    .card-header-populer,
    .name-buyer,
    .card-title-filter h4,
    .table-pemesanan h4,
    .card-sorting,
    h3.tittle-paket,
    .btn-small-facebook,
    .btn-small-whatsapp,
    .btn-small-twitter,
    .btn-small-google-plus,
    h3.tittle-detail-paket,
    h4.tittle-paket,
    .title-company-detail,
    .count-price-detail-company,
    .head-sub[data-v-7b45c11e],
    #list-profile h3,
    .pemesanan h6,
    .optionsicon[data-v-a0899ede],
    .table-checkout-border tfoot,
    .pay-button,
    .duration-paket,
    .title-paket-content h5,
    span.price-table-diskon,
    .text-checkout-total {
        font-size: 12px !important;
    }

    span.font-table {
        font-size: 20px !important;
    }

    h2.tittle-detail-paket,
    .gj-picker-bootstrap.datepicker [role="header"] [role="year"],
    .close,
    .nama-perusahaan h1,
    .card-checkout h4,
    .card-title-news-detail h4,
    .total-paket .form-control-sm {
        font-size: 16px !important;
    }

    .tittle-detail-paket {
        margin: 1rem 0;
        margin-top: 0;
    }

    .breadcrumb-paket-detail2 {
        position: relative;
        white-space: nowrap;
        overflow-x: auto;
        margin-top: 0rem;
    }

    .breadcrumb-paket-detail2 li.arrow {
        margin-right: 35px;
    }


    .breadcrumb-paket-detail2 li.arrow+li.arrow:after,
    .breadcrumb-paket-detail2 li.arrow+li.arrow:before {
        border-top: 5px solid transparent;
        border-bottom: 5px solid transparent;
        top: 0px;
    }

    .breadcrumb-paket-detail2 li.arrow+li.arrow:before {
        border-left: 5px solid #19b5fe;
        left: -19px;
    }

    .breadcrumb-paket-detail2 li.arrow+li.arrow:after {
        border-left: 5px solid #fff;
        left: -21px;
    }

    form.form-horizontal {
        width: 100%;
    }

    /* .tittle-banner h1{
        font-size: 70px;
    } */
    .event-day {
        font-size: 70px;
    }

    .title-paket-content h5 {
        margin-bottom: 1rem !important;
    }

    .number-input__button[data-v-016ae424]::before {
        height: 3px !important;
        width: 50% !important;
    }

    .number-input__button[data-v-016ae424]::after {
        height: 50% !important;
        width: 3px !important;
    }

    .number-input--inline>input[data-v-016ae424] {
        width: 7.5rem !important;
    }

    .number-input__button[data-v-016ae424] {
        width: 1.5rem !important;
        height: 22px;
    }

    input[type=number]::-webkit-inner-spin-button,
    input[type=number]::-webkit-outer-spin-button {
        -webkit-appearance: none;
        margin: 0;
    }

    .number-input__input[data-v-016ae424] {
        padding: 0rem 0.25rem 0.25rem 1.25rem !important;
    }

    .card-filter {
        height: 740px;
        overflow-y: scroll;
    }

    .list-unstyled li a.icon-footer {
        font-size: 20px !important;
        padding: 0 5px;
    }

    .list-unstyled li {
        margin-bottom: 0;
    }

    .card-header-populer {
        border-bottom: 5px solid rgb(242, 180, 0);
    }

    .point-of-rate {
        font-size: 25px;
    }

    .menu-profile-buyer {
        display: none;
    }

    .card-title-banner {
        height: 150px;
    }

    .card-title-banner>.tittle-banner a,
    .card-paket-promo-large>.tittle-banner a {
        padding: 5% 10%;
    }

    .tittle-banner h1:before,
    .tittle-banner h1:after {
        width: 30px;
        height: 1px;
        margin: 0 10px;
    }

    .container {
        position: relative;
        display: block !important;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .navbar-mobile-first {
        z-index: 2;
        top: -1px;
        height: 60px;
        padding: 10px;
    }

    .navbar-mobile-first-1 {
        height: 60px;
    }

    .navbar-second {
        margin-top: 0px;
    }

    .nav-mobile-second {
        margin-top: 0 !important;
        background: #fff;
        height: 100%;
    }

    .dropdown-category::before,
    .dropdown-category::after {
        left: 225px;
        margin: 0;
        top: -26px;
    }

    .dropdown-notif {
        position: fixed !important;
        left: 722px;
        top: 60px;
    }

    .dropdown-kategory {
        position: absolute;
        left: 160px;
        font-size: 35px;
        width: 260px;
        top: 15px;
        display: none;
    }

    .dropdown-kategory img {
        width: 55px;
    }

    .input-search img {
        width: 20px;
    }

    .dropdown-category {
        margin-top: 10px;
        margin-left: 0;
        width: 98%;
        padding: 15px;
        position: fixed !important;
        left: 10px;
    }

    .nav-left {
        padding-left: 15px !important;
    }

    .menu-profile-buyer-fixed {
        background: #fff;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 2;
        -webkit-box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
        box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
    }

    .form-full {
        width: 73%;
        position: absolute;
        z-index: 1;
        top: 5px;
        left: 50px;
        font-size: 1rem;
    }

    .form-full-mobile {
        width: 60%;
    }

    .navbar-mobile-login {
        background: #fff;
        margin-top: 0 !important;
    }

    .navbar-mobile-login {
        background: #fff;
        margin-top: 0 !important;
    }

    .detail-profile[data-v-7b45c11e] {
        margin-bottom: 15px;
    }

    .input-group-search>.form-control:not(:first-child) {
        font-size: 12px !important;
    }

    li.nav-item {
        display: inline-block;
        padding: 0;
        font-size: 12px;
    }

    .img-logo,
    .icon-logo {
        z-index: 2;
        top: 20px;
    }

    .img-logo {
        position: absolute;
    }

    .icon-bottom-logo {
        position: fixed;
        z-index: 2;
        top: 50px;
        left: 130px;
    }

    .icon-logo {
        position: fixed;
        z-index: 2;
        top: 30px;
        width: 40px;
        height: auto;
        margin-top: -5px;
    }

    .img-footer {
        width: 300px;
        height: auto;
        float: none;
        margin: 0 auto 20px auto;
    }

    .subscribe2-wrapper .subscribe-form input,
    .subscribe2-wrapper .subscribe-form input.btn-subscribe {
        height: 35px;
        border-radius: 50px;
    }

    .subscribe2-wrapper .subscribe-form input.btn-subscribe {
        padding: 10px 0;
    }

    .list-unstyled li.foot-about {
        padding-left: 1.5rem;
        position: relative;
        min-height: 1rem;
        width: 95%;
        vertical-align: middle;
        margin: auto;
        text-align: left;
    }

    .obj-center {
        display: block;
        margin-left: auto;
        margin-right: auto;
        top: 0;
        width: 100%;
        position: relative;
        left: 0;
        right: 0;
    }

    .mobile-category {
        flex: 0 0 25%;
        max-width: 25%;
    }

    pre {
        line-height: 1.5;
    }

    .mobile-category .card-icon-category {
        height: 80px;
    }

    .mobile-category .icon-category-dropdown,
    .VueCarousel-navigation-prev[data-v-453ad8cd],
    .VueCarousel-navigation-next[data-v-453ad8cd] {
        height: 60px;
        width: 60px;
    }

    .mobile-category .card-name-icon-category-dropdown {
        font-size: 20px;
        width: 150px;
        height: 60px;
    }

    .title-menu-check {
        font-size: 16px !important;
        font-weight: bold;
        border-bottom: 2px solid rgba(25, 181, 254, 1);
        padding-bottom: 10px;
    }

    .title-company-detail,
    .address-detail-company {
        text-align: center;
    }

    .count-price-detail-company {
        line-height: 1.5;
    }

    .share-detail-directory {
        padding-top: 0px !important;
    }

    .card-title-address-company {
        margin-bottom: 1rem;
    }

    .statistic-paket-detail-company {
        padding: 20px 10px;
        width: 200px;
    }

    h4.tittle-paket {
        margin-top: 40px;
    }

    .duration-detail {
        text-align: center;
        font-size: 50px;
        padding: 30px;
    }

    .main-mobile {
        padding: 0 30px !important;
    }

    .main-mobile-2 {
        padding: 0 !important;
    }

    .main-mobile-my {
        margin-top: 0 !important;
        margin-bottom: 0 !important;
    }

    .main-mobile-my-1 {
        margin-top: .5rem !important;
        margin-bottom: .5rem !important;
    }

    .main-mobile-mb-1 {
        margin-bottom: .5rem !important;
    }

    .subscribe-area {
        padding: 15px 30px;
    }

    .card-diskon {
        width: 35px;
        height: 31px;
        left: 10px;
        font-size: 8px !important;
        padding: 7px 5px;
    }

    .card-diskon::before {
        height: 5px;
        width: 5px;
    }

    .price-diskon-promo,
    .price-promo {
        margin-top: -10px;
    }

    .card-event-body {
        height: auto;
    }

    .event-body {
        height: 150px;
        font-size: 25px;
    }

    /*kategory*/
    .icon-kategory {
        width: 50px;
        height: 50px;
        margin: 10px;
    }

    .card-custom-packages {
        height: 120px;
    }

    .navbar-second {
        font-size: 1rem;
    }

    .news-detail-at {
        padding: 0 1rem;
    }

    .card-title-filter {
        font-size: 12px;
        padding: 0;
    }

    .footer-copyright {
        text-align: center;
    }

    .duration-paket {
        right: 0px;
        top: 45px;
    }

    .card-body-title-filter {
        margin-bottom: 1rem;
    }

    /* .paket-mobile .VueCarousel-inner{
        flex-basis: 380px !important;
        transform: translate(-560px, 0px) !important;
    } */

    /*paket card*/
    .card-tiket {
        margin-bottom: 150px;
    }

    .choose {
        text-align: left;
    }

    .card-paket {
        height: 170px;
    }

    .photos-paket {
        height: 100px;
    }

    .price-diskon-promo {
        margin-top: -5px;
        margin-bottom: 0px;
        line-height: 1;
    }

    .desc-paket-promo {
        height: 35px;
        padding: 5px;
    }

    .btn-heart input[type="checkbox"].heart-checkbox+label.heart-label {
        font-size: 18px;
    }

    .btn-heart input[type="checkbox"].heart-checkbox {
        width: 80px;
        height: 80px;
        border-radius: 50%;
    }

    .btn-heart-diskon .btn-heart {
        top: 5px;
    }

    .btn-heart {
        width: 30px;
        height: 30px;
        top: -1.25rem;
        padding: 5px 6px;
        right: 3px;
    }

    .title-village-promotion {
        width: 460px;
        font-size: 16px;
    }

    .card-paket-village,
    .title-village-promotion {
        height: 100px;
    }

    .title-custom-packages {
        margin-bottom: 20px;
    }

    .list-unstyled {
        text-align: center;
    }

    .news-detail-date {
        float: right;
        margin-bottom: 2rem;
    }

    .img-choose {
        width: 160px;
        height: 160px;
    }

    .card-sorting {
        white-space: nowrap;
        overflow: auto;
        position: relative;
    }

    #menuCheckout {
        position: fixed;
        z-index: 2;
        top: 0;
        background: #fff;
        width: 100%;
        height: 100%;
        left: 0;
    }

    .mobile-price-detail {
        padding: 10px 0;
    }

    .card-title-company-detail {
        height: auto;
        padding-bottom: 20px;
    }

    /* .badge-warning {
    margin-bottom: 100px;
} */

    /*grid*/
    .col-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .col-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        max-width: 83.33333%;
    }

    .col-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.666666%;
        flex: 0 0 66.666666%;
        max-width: 66.666666%;
    }

    .col-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }

    .col-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }

    .col-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-2-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }

    /*filter*/
    .filter-navbar {
        position: fixed;
        margin: 0 auto;
        bottom: 0;
        left: 0;
        right: 0;
        margin-top: -45px;
        z-index: 3;
    }

    #filter {
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        background: #fff;
        top: 0;
    }

    .filter-navbar {
        min-height: 0;
    }

    /*button*/
    .card-pannel-body .custom-control {
        padding-left: 2.5rem;
    }

    button.btn-filter[aria-expanded="true"] {
        float: right;
        z-index: 2;
        color: #000;
        right: 23px;
        transition: 1s;
        font-weight: bold;
        text-transform: uppercase;
        transition: 1s;
        top: 0;
        display: none;
    }

    button.btn-logo[aria-expanded="true"] div.icon-logo {
        display: none;
    }

    button.btn-logo[aria-expanded="true"] div.icon-cross-logo {
        display: block;
        font-size: 20px;
        font-weight: bold;
        z-index: 5;
        position: fixed;
        right: 40px;
        top: 40px;
    }

    button.btn-filter[aria-expanded="true"] span::before {
        content: "Cari";
        font-size: 30px;
    }

    button.btn-filter[aria-expanded="false"] {
        position: absolute;
        top: -35px;
        transition: 1s;
        display: inline-block;
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        line-height: 1;
        border: 2.5px solid #ffffff;
        -webkit-font-smoothing: antialiased;
        box-shadow: rgba(0, 0, 0, 0.04) 0 2px 6px;
        padding: 5px 20px;
        border-radius: 50px;
        cursor: pointer;
        background: #fff;
        white-space: nowrap;
        -webkit-box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        -moz-box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        left: 0;
        right: 0;
        margin: 0 auto;
    }

    button.btn-check[aria-expanded="false"],
    .pay-button {
        background: rgba(25, 181, 254, 1);
        position: fixed;
        width: 100%;
        color: #fff;
        left: 0;
        bottom: 0px;
        z-index: 1;
        width: 100%;
        padding: 15px !important;
    }

    button.btn-check[aria-expanded="true"] {
        position: fixed;
        z-index: 3;
        top: 5px;
        right: 0px;
    }

    button.btn-check[aria-expanded="true"] span::before {
        content: "X";
        font-size: 20px;
    }

    button.btn-check[aria-expanded="false"] span::before {
        content: "CHECKOUT";
        font-size: 16px;
    }

    button.btn-filter[aria-expanded="false"] span::before {
        content: "Filter \f0b0";
        font-size: 16px;
    }

    .vue-slider-dot {
        width: 55px !important;
        height: 60px !important;
    }

    .vue-slider {
        height: 10px;
    }

    .vue-slider-dot-handle {
        background-color: #19b5fe;
        border: 2px solid #19b5fe;
    }

    .btn-facebook,
    .btn-google,
    .btn-twitter {
        margin-bottom: 20px;
    }

    .btn-save {
        margin-bottom: 10px;
        padding: 5px 20px;
    }

    input#foto_buyer,
    input#foto_identitas {
        width: 100%;
        font-size: 12px;
        margin-bottom: 1rem;
        text-align: center;
    }

    .card-body-filter .custom-control {
        min-height: 3rem;
        padding-left: 3rem;
    }

    .card-body-filter .custom-control-label::before,
    .card-body-filter .custom-control-label::after {
        height: 30px;
        width: 30px;
    }

    .price-filter-slide {
        margin-bottom: 1rem;
    }

    .input-group-filter {
        font-size: 25px !important;
        background: #19b5fe;
        color: #fff;
        width: 130px;
    }

    .form-control-filter {
        font-size: 25px !important;
    }

    .card-img-news {
        height: 350px;
    }

    .news-terpopuler {
        padding: 5px 10px;
    }

    .card-news {
        height: 450px;
        padding: 5px 20px;
    }

    .form-sorting .form-control-sm {
        padding: 0.5rem 0.75rem;
        font-size: 2.25rem;
        line-height: 1.5;
        border-radius: 0.5rem;
    }

    .btn-sm,
    .btn-group-sm>.btn {
        padding: 5px 10px;
        font-size: 10px;
        width: 100%;
        margin-bottom: .5rem;
    }

    button.icon-menu-profile[aria-expanded="false"] {
        position: fixed;
        height: 150px;
        width: 150px;
        background: rgba(25, 181, 254, 1);
        border-radius: 50%;
        z-index: 1;
        bottom: 30px;
        right: 30px;
        font-size: 100px;
        color: #fff;
    }

    button.icon-menu-profile[aria-expanded="true"] {
        text-align: center;
        width: 100%;
        background: rgba(25, 181, 254, 1);
        font-size: 50px;
        color: #fff;
        padding: 15px;
    }

    .breadcrumb-paket-detail {
        white-space: nowrap;
        overflow: auto;
        display: -webkit-inline-box;
        width: 100%;
    }

    .btn-small-facebook,
    .btn-small-whatsapp,
    .btn-small-twitter,
    .btn-small-google-plus {
        width: 25px;
        height: 25px;
    }

    .point-of-rating-detail {
        height: 10px;
    }

    .width-rating-empty,
    .width-rating-full {
        height: 10px;
        border-radius: 5px;
    }

    button .gj-icon {
        font-size: 50px !important;
        left: 20px !important;
    }

    .quantity-up,
    .quantity-down {
        font-size: 18px;
        width: 30px;
        height: 30px;
    }

    .gj-picker-bootstrap table tr td div,
    .gj-picker-bootstrap table tr th div {
        width: 70px;
        height: 70px;
        vertical-align: middle;
        display: table-cell;
    }

    .options[data-v-a0899ede] {
        left: -140px;
    }

    /*images*/
    .icon-invoice {
        width: 20px;
    }

    .img-inovice {
        width: 150px;
    }

    .img-paket[data-v-b7ee87b0],
    .tumb-paket[data-v-a0899ede] {
        height: 150px !important;
        margin-bottom: 20px;
    }

    .paket-pemesanan {
        height: 150px !important;
        position: relative;
        display: block;
        overflow: hidden;
    }

    .paket-pemesanan img {
        height: 100%;
        width: 100%;
        object-fit: cover;

    }

    .img-ulasan-belum-buyer,
    .img-pesan-buyer {
        width: auto;
        height: 150px;
        margin-bottom: 1rem;
    }

    .img-news-popular {
        height: 250px;
    }

    .icon-partner {
        width: 50px;
    }

    .card-paket-promo-large {
        height: 16vh;
    }

    .card-paket-promo-small {
        height: 8vh;
    }

    .img-first {
        width: 150px;
        height: 150px;
        margin: 0 auto;
        margin-bottom: 16px;
        border-radius: 50%;
    }

    .VueCarousel-dot[data-v-438fd353] {
        width: 10px !important;
        height: 10px !important;
        margin-bottom: 0;
    }

    .img-register {
        width: 200px;
        margin-bottom: 1rem;
    }

    .card-login {
        margin-top: 1rem;
    }

    .img-icon-sosmed {
        width: 10px;
        left: 20px;
    }

    .banner-search {
        height: 200px;
    }

    .img-menu-profile-buyer-fixed {
        background: #fff;
        margin: 5px auto;
        font-size: 20px;
    }

    .img-pesan-buyer {
        height: 150px;
    }

    .tabs-paket-detail .nav-link {
        padding: 5px;
    }

    .img-logo-vendorbypaket {
        width: 200px;
    }

    .img-detail-menu {
        height: 150px;
        width: auto;
        position: relative;
        overflow: hidden;
        display: block;
        margin-top: 10px;
        border-radius: 10px;
    }

    .gj-datepicker-bootstrap [role="right-icon"] button {
        width: 80px;
    }

    .photos-detail-directory-in {
        width: 400px;
        height: 400px;
        margin-top: -250px;
        margin-bottom: 1rem;
    }

    .img-detail-carousel {
        height: 30vh;
    }

    /* end images */
    /*table*/
    .desc-tittle-table-checkout {
        color: #888;
        margin-bottom: 2rem;
    }

    .table-checkout,
    .table-checkout-border {
        width: 100%;
    }

    .table-checkout-border th {
        font-family: "Poppins SemiBold";
        text-align: center;
        border-bottom: 2px solid #888;
    }

    .border-bottom-checkout {
        border-bottom: 2px solid #888;
    }

    .table-checkout-border td,
    .table-checkout-border th {
        padding: 0.25rem 0;
    }

    .table-checkout-border tfoot,
    .pay-button {
        font-family: "Poppins SemiBold";
    }

    .table-checkout-border tfoot td {
        border-top: 2px solid #888;
        border-bottom: 2px solid #888;
        font-size: 35px;
    }

    /*form*/
    .input-group-register-text {
        /* height: 60px; */
        width: 20px;
    }

    .input-form-register {
        padding-left: 22px !important;
    }

    .form-control-sm,
    .input-group-sm>.form-control,
    .input-group-sm>.input-group-prepend>.input-group-text,
    .input-group-sm>.input-group-append>.input-group-text,
    .input-group-sm>.input-group-prepend>.btn,
    .input-group-sm>.input-group-append>.btn {
        height: 30px !important;
    }

    .custom-control-label::after,
    .custom-control-label::before {
        width: 40px;
        height: 40px;
    }

    .custom-control {
        padding-left: 2.5rem;
    }

    .text-or {
        width: 35px !important;
        top: 0px;
    }

    .icon-profile-detail {
        flex: 0 0 10%;
    }

    .label-icon-profile {
        flex: 0 0 90%;
    }

    .form-buyer {
        height: 30px !important;
    }

    /* footer{
        display: none;
    } */

    /*modal*/
    .modal-dialog {
        max-width: 80%;
    }
}

/*// Medium devices (tablets, 768px and up)*/
@media (min-width: 768px) and (max-width: 991px) {

    /* #chatra.chatra--pos-middle:not(.chatra--expanded) {
        width: 150px !important;
        height: 150px !important;
    } */
    .badger-accordion__header .js-badger-accordion-header .badger-toggle-indicator {
        font-size: 70px
    }

    /*navbar*/
    .navbar-login-second,
    .img-logo-small,
    .show-mobile {
        display: block !important;
    }

    .navbar-login-first,
    .img-logo-large,
    .navbar-mobile-right,
    /* .banner-large, */
    .mobile-price-detail-noshow,
    .tittle-noshow,
    .address-checkout,
    .checkout-detail,
    .VueCarousel-navigation,
    .display-bahasa,
    .navbar-show,
    .dropdown-search,
    .show-web {
        display: none !important;
    }

    .rate-paket {
        margin-top: 5px;
    }

    #navbarLogo {
        position: fixed;
        height: 100%;
        width: 100%;
        top: 0;
        left: 0;
        /* background: rgba(25, 181, 254, 1); */
        z-index: 4;
    }

    .navbar-login-second {
        padding: 25px;
        background: #fff;
        border: 1px solid #fff;
    }

    .nav-second {
        color: #fff !important;
        padding: 30px;
        background: #19b5fe;
        margin: 10px auto;
        width: 80%;
        text-align: center;
        box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06);
        -webkit-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06);
        -moz-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06);
        border-radius: 100px;
    }

    .img-navbar-active {
        width: 500px;
        padding: 25px 0;
    }

    .img-icon-mobile {
        position: fixed;
        filter: grayscale(100%);
        opacity: .2;
        bottom: -200px;
        z-index: 0;
        width: 800px;
        left: -400px;
    }

    .icon-navbar-login {
        height: 200px;
        width: 200px;
        border-radius: 50%;
        position: relative;
        background: #19b5fe;
        margin: 10px 50px;
        padding: 30px;
    }

    .navbar-light .navbar-nav .nav-link {
        color: #19b5fe;
        font-weight: bold;
        z-index: 2;
        position: relative;
    }

    .img-login-cicle {
        width: 250px;
        height: 250px;
        padding: 10px;
        background: #fff;
        /* margin: 50px auto !important; */
        margin: 0 auto !important;
        z-index: 2;
        position: relative;
        display: block;
        box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06) !important;
        -webkit-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06) !important;
        -moz-box-shadow: 0 16px 16px rgba(0, 0, 0, 0.06) !important;
    }

    .notif-buyer {
        color: rgba(0, 0, 0, .5);
        font-size: 60px;
        position: fixed;
        z-index: 2;
        right: 160px;
        top: 10px;
    }

    .count-notif-buyer {
        height: 50px;
        width: 50px;
        top: 0;
        right: 20px;
        font-size: 30px;
        font-family: Poppins SemiBold;
    }

    .link-notif {
        color: #fff;
    }

    .namauser {
        font-size: 40px;
        margin-top: 2rem;
        text-align: center;
        position: relative;
        padding: 0;
        height: auto;
        display: block;
    }

    .namauser a {
        color: #fff;
    }

    .btn-logout {
        margin-top: 30px;
        background: #f2b400;
        padding: 20px;
        text-align: center;
        border-radius: 10px;
        margin-right: 25px;
    }

    .table-pemesanan {
        width: 100%;
    }

    .table-pemesanan h4 {
        margin-top: 30px;
    }

    .number-rating,
    .event-clock,
    .body-invoice label,
    .body-payment label {
        font-size: 20px;
    }

    .form-buyer,
    .table-pemesanan,
    .badge-pill,
    .price-diskon-promo span,
    .modal-header-login,
    .statistic-paket-detail-company,
    .detail-profile[data-v-7b45c11e],
    .deskripsi-paket[data-v-b7ee87b0],
    .ket,
    .slider-price-right,
    table.table-price,
    .desc-tittle-table-checkout,
    .link-notif,
    #alert_kupon,
    .btn-link,
    .price-diskon-promo span,
    .price-promo span,
    .card-event-tittle,
    .event-month,
    .event-address,
    .no-invoice,
    .card-invoice,
    .body-invoice {
        font-size: 25px !important;
    }

    .list-unstyled li a,
    .icon-footer-about,
    .list-unstyled li.foot-about,
    .footer-copyright,
    .card-news,
    .news-terpopuler,
    .btn-detail,
    .title-desc-paket-promo,
    .price-paket,
    .price-paket-promo,
    .icon-footer-about,
    .card-title-news-detail,
    a label.title-kategory,
    .choose,
    .news-date,
    .footer-card-news-detail,
    .label-banner,
    .list-group-item,
    .news-detail-at,
    .btn-white,
    .subscribe-text span,
    .subscribe2-wrapper .subscribe-form input,
    .subscribe2-wrapper .subscribe-form input.btn-subscribe,
    .btn-logout,
    .content-kategori,
    .address-checkout,
    .btn-facebook,
    .btn-twitter,
    .list-group-item,
    .icon-profile-detail,
    .tab-body,
    .list-sub-menu-profile,
    /* .btn-sm, */
    .btn-group-sm>.btn,
    pre,
    .link-cateory,
    .breadcrumb-paket-detail,
    .table-detail-vendor,
    .desc-trip-info,
    .text-share,
    .title-vendorbypaket,
    .rating-detail,
    .price-paket-sticky span,
    .form-mobile,
    .address-detail-company,
    .card-title-company-detail,
    .infinite-loading-container[data-v-46b21138],
    .chat-item[data-v-195b3b9c],
    .baris-logo[data-v-7b45c11e],
    .pemesanan[data-v-b7ee87b0],
    .grand-total[data-v-b7ee87b0],
    .harga-paket[data-v-b7ee87b0],
    .options[data-v-a0899ede],
    .table-checkout,
    .table-checkout-border,
    .share-news,
    .card-diskon,
    .number-input__input[data-v-016ae424],
    .table-checkout,
    .ft-12,
    .card-invoice h6,
    .card-invoice h5,
    .tittle-modal span,
    .no-invoice h5,
    .success,
    .danger,
    button.toast-close-button,
    .toast-message,
    .toast-title,
    .new-paket,
    .table-card-info,
    .card-info,
    .date-expired {
        font-size: 25px !important;
    }

    .title-paket-content,
    .breadcrumb-paket-detail2,
    .label-icon-profile,
    .tabs-paket-detail,
    .col-form-label-sm,
    .card-address-directory {
        font-size: 30px !important;
    }

    .card-body,
    .btn-save,
    .register-checkout,
    .btn-google,
    .list-paket[data-v-a0899ede],
    .btn-outline-primary,
    .card-pannel-body .custom-control-label,
    .gj-picker div[role="navigator"] div[role="period"],
    .gj-picker-bootstrap table tr td div,
    .gj-picker-bootstrap table tr th div,
    .modaltiket,
    .table-checkout tbody,
    .gj-picker-bootstrap [role="header"] [role="date"],
    .date-detail-paket,
    .col-form-label,
    .head-title[data-v-b7ee87b0],
    .sub-title[data-v-b7ee87b0],
    .card-pannel-body table,
    .btn-facebook-login,
    .modal-body,
    .btn-sm,
    .select2-results__option[aria-selected],
    .btn-group-sm>.btn {
        font-size: 35px !important;
    }



    .list-unstyled h5,
    .VueCarousel-navigation-prev[data-v-453ad8cd],
    .VueCarousel-navigation-next[data-v-453ad8cd],
    .navbar-login-second,
    .nav-second,
    .card-title-news,
    .title-paket,
    .custom-packages h3,
    .subscribe-text h4,
    .card-header-populer,
    .name-buyer,
    .table-pemesanan h4,
    .card-sorting,
    h3.tittle-paket,
    h3.tittle-detail-paket,
    h4.tittle-paket,
    .title-company-detail,
    .count-price-detail-company,
    .head-sub[data-v-7b45c11e],
    #list-profile h3,
    .pemesanan h6,
    .optionsicon[data-v-a0899ede],
    .table-checkout-border tfoot,
    .pay-button,
    .duration-paket,
    .title-paket-content h5,
    span.price-table-diskon,
    .text-checkout-total,
    .label-duration,
    .price-filter-slider,
    input.form-control,
    input.form-control-sm,
    .card-login,
    .form-buyer-area,
    .theiaStickySidebar,
    .card-body-filter .custom-control-label-sm,
    .info-agent,
    .card-title-agent-directory {
        font-size: 40px !important;
    }

    .title-50,
    .modal-header {
        font-size: 50px;
    }

    h2.tittle-detail-paket,
    .gj-picker-bootstrap.datepicker [role="header"] [role="year"],
    .close,
    .nama-perusahaan h1,
    .card-checkout h4,
    .card-title-news-detail h4,
    .card-body-title-filter,
    .total-paket .form-control-sm,
    .card-title-filter h4,
    .empty-stars:before,
    .full-stars:before,
    .card-pannel-header h4,
    .input-search span,
    .title-paket-content h3 {
        font-size: 50px !important;
    }

    .icon-bottom-logo {
        font-size: 60px !important;
    }

    .status-bayar[data-v-b7ee87b0] {
        margin-bottom: 1rem;
    }

    .btn-small-facebook,
    .btn-small-whatsapp,
    .btn-small-twitter,
    .btn-small-google-plus {
        font-size: 80px !important;
        padding: 0 30px;
    }

    .gj-icon,
    .card-coming-soon p {
        font-size: 100px !important;
    }

    /* #chatra.chatra--pos-middle:not(.chatra--expanded) {
        width: 40px !important;
        height: 40px !important;
    } */
    p,
    p span,
    ul li span {
        line-height: 1.5 !important;
        font-size: 35px !important;
    }

    .cxlt-toastr-container>div {
        width: 100% !important;
        padding-left: 100px !important;
    }

    .price-filter-slider {
        margin: 2rem 0;
    }

    .toast-icon,
    .toast-icon img {
        height: 60px !important;
        width: 60px !important;
    }

    .title-news-detail p {
        font-size: 32px !important;
    }

    .card-title-news-detail {
        margin-top: 1.5rem;
    }

    .breadcrumb-paket-detail2 {
        position: relative;
        white-space: nowrap;
        overflow-x: auto;
        margin-top: 2rem;
    }

    .breadcrumb-paket-detail2 li.arrow {
        margin-right: 100px;
    }


    .breadcrumb-paket-detail2 li.arrow+li.arrow:after,
    .breadcrumb-paket-detail2 li.arrow+li.arrow:before {
        border-top: 15px solid transparent;
        border-bottom: 15px solid transparent;
        top: 5px;
    }

    .breadcrumb-paket-detail2 li.arrow+li.arrow:before {
        border-left: 15px solid #19b5fe;
        left: -60px;
    }

    .breadcrumb-paket-detail2 li.arrow+li.arrow:after {
        border-left: 15px solid #fff;
        left: -65px;
    }

    form.form-horizontal {
        width: 100%;
    }

    .tittle-banner h1 {
        font-size: 40px;
    }

    .event-day {
        font-size: 70px;
    }

    .title-paket-content h5 {
        margin-bottom: 3rem !important;
    }

    .number-input__button[data-v-016ae424]::before {
        height: 10px !important;
        width: 50% !important;
    }

    .number-input__button[data-v-016ae424]::after {
        height: 40% !important;
        width: 10px !important;
    }

    .number-input--inline>input[data-v-016ae424] {
        width: 25.5rem !important;
        font-size: 40px !important;
        padding: 2rem 0 !important;
        margin-bottom: 1rem;
        border-radius: 20px;
    }

    .number-input__button[data-v-016ae424] {
        width: 6.5rem !important;
    }

    .number-input__input[data-v-016ae424] {
        padding: .25rem 0.875rem !important;
    }

    .list-unstyled li a.icon-footer {
        font-size: 50px !important;
        padding: 10px;
    }

    .card-header-populer {
        border-bottom: 5px solid rgb(242, 180, 0);
    }

    .point-of-rate {
        font-size: 80px;
    }

    .menu-profile-buyer {
        display: none;
    }

    .card-title-banner {
        height: 400px;
    }

    .tittle-banner h1:before,
    .tittle-banner h1:after {
        width: 100px;
        height: 5px;
        margin: 0 20px;
    }

    .container {
        position: relative;
        display: block !important;
        width: 100%;
        max-width: 100%;
        overflow: hidden;
    }

    .navbar-mobile-first {
        z-index: 2;
        top: -1px;
        height: 130px;
    }

    .navbar-mobile-first-1 {
        height: 130px;
    }

    .navbar-second {
        margin-top: 80px;
    }

    .nav-mobile-second {
        margin-top: 0 !important;
        background: #fff;
        height: 100%;
        border: 1px solid #fff;
        padding-top: 4rem;
    }

    .dropdown-category::before,
    .dropdown-category::after {
        left: 225px;
        margin: 0;
        top: -26px;
    }

    .dropdown-notif {
        position: fixed !important;
        left: 722px;
        top: 60px;
    }

    .dropdown-kategory {
        position: absolute;
        left: 160px;
        font-size: 35px;
        width: 260px;
        top: 15px;
        display: none;
    }

    .dropdown-kategory img {
        width: 55px;
    }

    .input-search img {
        width: 70px;
        padding: 10px;
    }

    .dropdown-category {
        margin-top: 10px;
        margin-left: 0;
        width: 98%;
        padding: 15px;
        position: fixed !important;
        left: 10px;
    }

    .nav-left {
        padding-left: 25px !important;
    }

    .menu-profile-buyer-fixed {
        background: #fff;
        position: fixed;
        bottom: 0;
        left: 0;
        z-index: 2;
        -webkit-box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
        -moz-box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
        box-shadow: 0px -10px 31px -5px rgba(0, 0, 0, 0.1);
    }

    .form-full {
        width: 73%;
        position: absolute;
        z-index: 1;
        top: 15px;
        left: 125px;
        font-size: 1rem;
    }

    .form-full-mobile {
        width: 60%;
    }

    .navbar-mobile-login {
        background: #fff;
        margin-top: 0 !important;
    }

    .card-directory {
        height: 400px;
        margin-bottom: 1rem;
    }

    .card-img-directory {
        height: 250px;
        width: 250px;
        margin: auto;
        text-align: center;
        margin-top: -120px;
    }

    .card-title-agent-directory,
    .card-address-directory {
        padding-left: 20px;
    }

    .detail-profile[data-v-7b45c11e] {
        margin-bottom: 15px;
    }

    .input-group-search>.form-control:not(:first-child) {
        font-size: 30px !important;
        padding: 20px;
        padding-left: 6rem;
        border-radius: 15px;
    }

    li.nav-item {
        display: inline-block;
        /* padding: 0 10px; */
    }

    .navbar-light .navbar-nav .active>.nav-link {
        color: rgb(242, 180, 0) !important;
        font-weight: 600;
        text-shadow: -5px 5px 0px #fff, 0px 5px 0px #fff, 5px 5px 0px #fff, -5px -5px 0px #fff, 0px -5px 0px #fff, 5px -5px 0px #fff, -5px 0px 0px #fff, 5px 0px 0px #fff;
    }

    .img-logo,
    .icon-logo {
        z-index: 2;
        top: 20px;
    }

    .img-logo {
        position: absolute;
    }

    .icon-bottom-logo {
        position: fixed;
        z-index: 2;
        top: 35px;
        right: 50px;
        font-size: 50px;
    }

    .icon-logo {
        position: fixed;
        z-index: 2;
        top: 20px;
        padding: 10px;
    }

    .img-footer {
        width: 300px;
        height: auto;
        float: none;
        margin: 0 auto 20px auto;
    }

    .btn-icon-modal {
        height: 180px;
        width: 180px;
    }

    .subscribe2-wrapper .subscribe-form input,
    .subscribe2-wrapper .subscribe-form input.btn-subscribe {
        height: 80px;
        border-radius: 50px;
    }

    .list-unstyled li.foot-about {
        padding-left: 3.5rem;
        position: relative;
        min-height: 1rem;
        width: 95%;
        vertical-align: middle;
        margin: 0.25rem auto;
        text-align: left;
    }

    .obj-center {
        display: block;
        margin-left: auto;
        margin-right: auto;
        top: 0;
        width: 100%;
        position: relative;
        left: 0;
        right: 0;
    }

    .mobile-category {
        flex: 0 0 25%;
        max-width: 25%;
    }

    pre {
        line-height: 1.5;
    }

    .mobile-category .card-icon-category {
        height: 80px;
    }

    .mobile-category .icon-category-dropdown,
    .VueCarousel-navigation-prev[data-v-453ad8cd],
    .VueCarousel-navigation-next[data-v-453ad8cd] {
        height: 60px;
        width: 60px;
    }

    .mobile-category .card-name-icon-category-dropdown {
        font-size: 20px;
        width: 150px;
        height: 60px;
    }

    .title-menu-check {
        font-size: 40px !important;
        font-weight: bold;
        border-bottom: 2px solid rgba(25, 181, 254, 1);
        padding-bottom: 25px;
    }

    .title-company-detail,
    .address-detail-company {
        text-align: center;
    }

    .count-price-detail-company {
        line-height: 1.5;
    }

    .share-detail-directory {
        padding-top: 30px !important;
    }

    .card-title-address-company {
        margin-bottom: 1rem;
    }

    .statistic-paket-detail-company {
        padding: 20px 10px;
        width: 200px;
    }

    h4.tittle-paket {
        margin-top: 40px;
    }

    .duration-detail {
        text-align: center;
        font-size: 50px;
        padding: 30px;
    }

    .main-mobile {
        padding: 0 30px !important;
    }

    .main-mobile-2 {
        padding: 0 !important;
    }

    .subscribe-area {
        padding: 15px 30px;
    }

    .card-diskon {
        width: 82px;
        height: 90px;
        left: 25px;
    }

    .card-diskon::before {
        height: 16px;
        width: 18px;
    }

    .card-event-body {
        height: auto;
    }

    .event-body {
        height: 150px;
        font-size: 25px;
    }

    /*kategory*/
    .icon-kategory {
        width: 150px;
        height: 150px;
        /* padding: 20px 50px; */
    }

    .card-custom-packages {
        height: 350px;
    }

    .navbar-second {
        font-size: 1rem;
    }

    .news-detail-at {
        padding: 0 1rem;
    }

    .card-title-filter {
        font-size: 60px;
        font-weight: bold;
    }

    .footer-copyright {
        text-align: center;
        padding: 30px 0;
        /* background: #f4f4f4; */
        border-top: 1px solid;
        margin-top: 30px;
    }

    .duration-paket {
        right: 50px;
        top: 130px;
    }

    .card-body-title-filter {
        margin-bottom: 2.5rem;
    }

    /* .paket-mobile .VueCarousel-inner{
        flex-basis: 380px !important;
        transform: translate(-560px, 0px) !important;
    } */

    /*paket card*/
    .card-tiket {
        margin-bottom: 150px;
    }

    .choose {
        text-align: left;
    }

    .card-paket {
        height: 550px;
    }

    .body-paket {
        margin-top: 30px;
    }

    .photos-paket {
        height: 330px;
        border-radius: 20px;
        box-shadow: 0 19px 19px rgba(0, 0, 0, 0.06);
    }

    .price-diskon-promo {
        margin-top: 0;
        margin-bottom: 10px;
    }

    .desc-paket-promo {
        height: 130px;
    }

    .btn-heart input[type="checkbox"].heart-checkbox+label.heart-label {
        font-size: 55px;
    }

    .btn-heart input[type="checkbox"].heart-checkbox {
        width: 80px;
        height: 80px;
        border-radius: 50%;
    }

    .btn-heart-diskon .btn-heart {
        top: 40px;
    }

    .btn-heart {
        width: 80px;
        height: 80px;
        top: -3.25rem;
        padding: 16px 13px;
    }

    .title-village-promotion {
        width: 460px;
        font-size: 50px;
    }

    .card-paket-village,
    .title-village-promotion {
        height: 210px;
        border-radius: 10px;
    }

    .title-custom-packages {
        margin-bottom: 50px;
    }

    .list-unstyled {
        text-align: center;
    }

    .news-detail-date {
        float: right;
        margin-bottom: 2rem;
    }

    .img-choose {
        width: 160px;
        height: 160px;
    }

    .card-sorting {
        white-space: nowrap;
        overflow: auto;
        position: relative;
    }

    #menuCheckout {
        position: fixed;
        z-index: 2;
        top: 0;
        background: #fff;
        width: 100%;
        height: 100%;
        left: 0;
    }

    .mobile-price-detail {
        padding: 30px;
    }

    .card-title-company-detail {
        height: auto;
        padding-bottom: 20px;
    }

    /* .badge-warning {
        margin-bottom: 100px;
    } */

    /*grid*/
    .col-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }

    .col-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.33333%;
        flex: 0 0 83.33333%;
        max-width: 83.33333%;
    }

    .col-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.666666%;
        flex: 0 0 66.666666%;
        max-width: 66.666666%;
    }

    .col-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }

    .col-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }

    .col-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-2-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 20%;
        flex: 0 0 20%;
        max-width: 20%;
    }

    .col-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }

    /*filter*/
    .filter-navbar {
        position: fixed;
        margin: 0 auto;
        bottom: 0;
        left: 0;
        right: 0;
        margin-top: -45px;
        z-index: 3;
    }

    #filter {
        position: fixed;
        width: 100%;
        height: 100%;
        left: 0;
        background: #fff;
        top: 0;
    }

    .filter-navbar {
        min-height: 0;
    }

    /*button*/
    .card-pannel-body .custom-control {
        height: auto;
        border-radius: 15px;
        padding: 15px;
        padding-left: 6rem;
    }

    .img-bank {
        width: 200px;
    }

    .radio-checkout .custom-control-label::before,
    .radio-checkout .custom-control-label::after {
        left: -80px;
    }

    button.btn-filter[aria-expanded="true"] {
        position: fixed;
        /* border: 1px solid #19b5fe; */
        z-index: 2;
        bottom: 0;
        color: #fff;
        right: 0;
        transition: 1s;
        left: 0;
        margin: 0 auto;
        text-align: center;
        width: 100%;
        background: #fff;
        padding: 25px;
        font-weight: bold;
        text-transform: uppercase;
        transition: 1s;
        display: block;
    }

    button.btn-filter[aria-expanded="true"] span {
        background: rgba(25, 181, 254, 1);
        position: relative;
        display: block;
        width: 100%;
        padding: 30px;
        border-radius: 15px;
    }

    button.btn-logo[aria-expanded="true"] div.icon-logo {
        display: none;
    }

    button.btn-logo[aria-expanded="true"] div.icon-cross-logo {
        display: block;
        font-size: 60px;
        font-weight: bold;
        z-index: 5;
        position: fixed;
        right: 40px;
        top: 40px;
    }

    button.btn-filter[aria-expanded="true"] span::before {
        content: "Cari";
        font-size: 50px;
    }

    button.btn-filter[aria-expanded="false"] {
        position: absolute;
        bottom: 200px;
        transition: 1s;
        display: inline-block;
        font-family: FontAwesome;
        font-style: normal;
        font-weight: normal;
        line-height: 1;
        border: 2.5px solid #ffffff;
        -webkit-font-smoothing: antialiased;
        box-shadow: rgba(0, 0, 0, 0.04) 0 2px 6px;
        padding: 25px 50px;
        border-radius: 50px;
        cursor: pointer;
        background: #fff;
        white-space: nowrap;
        -webkit-box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        -moz-box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
        box-shadow: 0px 10px 26px -4px rgba(0, 0, 0, 0.59);
    }

    button.btn-filter-close {
        font-size: 60px;
    }

    /* button.btn-check[aria-expanded="false"],
    .pay-button {
        background: rgba(25, 181, 254, 1);
        position: fixed;
        width: 100%;
        color: #fff;
        left: 0;
        bottom: -10px;
        z-index: 1;
        width: 100%;
        padding: 40px !important;
    } */

    button.btn-check[aria-expanded="false"] span {
        padding: 15px;
        background: rgba(25, 181, 254, 1);
        position: relative;
        display: block;
        padding: 40px;
        border-radius: 15px;
    }

    button.btn-check[aria-expanded="false"] {
        background: #fff;
        position: fixed;
        width: 100%;
        color: #fff;
        left: 0;
        bottom: 9%;
        z-index: 1;
        width: 100%;
        padding: 40px !important;
    }

    button.btn-check[aria-expanded="true"] {
        position: fixed;
        z-index: 3;
        top: 30px;
        right: 30px;
    }

    button.btn-check[aria-expanded="true"] span::before {
        content: "X";
        font-size: 40px;
    }

    button.btn-check[aria-expanded="false"] span::before {
        content: "CHECKOUT";
        font-size: 40px;
    }

    button.btn-filter[aria-expanded="false"] span::before {
        content: "Filter \f0b0";
        font-size: 50px;
    }

    .vue-slider-dot {
        width: 55px !important;
        height: 65px !important;
    }

    .vue-slider {
        height: 10px !important;
    }

    .vue-slider-dot-handle {
        background-color: #19b5fe;
        border: 2px solid #19b5fe;
    }

    .btn-facebook,
    .btn-google,
    .btn-twitter {
        margin-bottom: 20px;
    }

    .btn-facebook-login,
    .btn-google {
        padding: 20px;
    }

    .btn-save,
    .btn-google,
    .btn-facebook-login {
        margin: 2rem 0;
        padding: 20px 40px;
        border-radius: 10px !important;
        text-transform: uppercase;
    }

    input#foto_buyer,
    input#foto_identitas {
        width: 50%;
        font-size: 35px;
        margin-bottom: 3rem;
    }

    .card-body-filter-scroll {
        position: relative;
        overflow-y: auto;
        max-height: 1600px;
        display: block;
        padding-bottom: 10rem;
    }

    .card-body-filter .custom-control {
        min-height: 0;
        padding-left: 7rem;
        margin-bottom: 2rem;
    }

    .card-body-filter .custom-control-label::before,
    .card-body-filter .custom-control-label::after {
        height: 80px;
        width: 80px;
        border-radius: 10px;
    }

    .price-filter-slide {
        margin-bottom: 1rem;
    }

    .input-group-filter {
        font-size: 25px !important;
        background: #19b5fe;
        color: #fff;
        width: 130px;
    }

    .form-control-filter {
        font-size: 25px !important;
    }

    .card-img-news {
        height: 350px;
    }

    .news-terpopuler {
        padding: 5px 10px;
    }

    .card-news {
        height: 450px;
        padding: 5px 20px;
    }

    .form-sorting .form-control-sm {
        padding: 0.5rem 0.75rem;
        font-size: 2.25rem;
        line-height: 1.5;
        border-radius: 0.5rem;
    }

    .btn-sm,
    .btn-group-sm>.btn {
        padding: 20px 40px;
    }

    button.icon-menu-profile[aria-expanded="false"] {
        position: fixed;
        height: 150px;
        width: 150px;
        background: rgba(25, 181, 254, 1);
        border-radius: 50%;
        z-index: 1;
        bottom: 30px;
        right: 30px;
        font-size: 100px;
        color: #fff;
    }

    button.icon-menu-profile[aria-expanded="true"] {
        text-align: center;
        width: 100%;
        background: rgba(25, 181, 254, 1);
        font-size: 50px;
        color: #fff;
        padding: 15px;
    }

    .breadcrumb-paket-detail {
        white-space: nowrap;
        overflow: auto;
        display: -webkit-inline-box;
        width: 100%;
    }

    .btn-small-facebook,
    .btn-small-whatsapp,
    .btn-small-twitter,
    .btn-small-google-plus {
        width: 60px;
        height: 60px;
    }

    .point-of-rating-detail {
        height: 25px;
    }


    .width-rating-empty,
    .width-rating-full {
        height: 25px;
        border-radius: 5px;
    }

    button .gj-icon {
        font-size: 50px !important;
        left: 20px !important;
    }

    .gj-picker-bootstrap table tr td div,
    .gj-picker-bootstrap table tr th div {
        width: 130px;
        height: 130px;
        vertical-align: middle;
        display: table-cell;
        text-align: center;
    }

    [type=year].gj-picker-bootstrap table tr td div,
    [type=decade].gj-picker-bootstrap table tr td div,
    [type=century].gj-picker-bootstrap table tr td div {
        height: 235px;
        width: 235px;
    }

    .options[data-v-a0899ede] {
        left: -140px;
    }

    /*images*/
    .img-card-directory-travel {
        height: 250px;
    }

    .img-detail-carousel,
    .img-detail-carousel-large {
        height: 24.25vh !important;
    }

    .img-detail-carousel-middle2 {
        height: 11.9vh !important;
    }

    .img-detail-carousel-middle {
        height: 15.35vh !important;
    }

    .img-detail-carousel-small {
        height: 8.45vh !important;
    }

    .card-img-event {
        height: 300px;
    }

    .icon-invoice {
        width: 70px;
    }

    .img-inovice {
        width: 400px;
    }

    .img-paket[data-v-b7ee87b0],
    .tumb-paket[data-v-a0899ede] {
        height: 400px !important;
        margin-bottom: 20px;
    }

    .img-ulasan-belum-buyer,
    .img-pesan-buyer {
        width: auto;
        height: 200px;
        margin-bottom: 1rem;
    }

    .img-news-popular {
        height: 250px;
    }

    .icon-partner {
        width: 150px;
    }

    .card-paket-promo-large {
        height: 16vh;
    }

    .card-paket-promo-small {
        height: 8vh;
    }

    .img-first {
        width: 400px;
        height: 400px;
        margin: 0 auto;
        margin-bottom: 16px;
        border-radius: 50%;
    }

    .VueCarousel-dot[data-v-438fd353] {
        width: 20px !important;
        height: 20px !important;
        margin-bottom: 0;
    }

    .img-register {
        width: 500px;
    }

    .img-icon-sosmed {
        width: 50px;
        left: 30px;
    }

    .banner-search {
        height: 200px;
    }

    .img-menu-profile-buyer-fixed {
        background: #fff;
        margin: 15px auto;
        font-size: 50px;
    }

    .img-pesan-buyer {
        height: 400px;
    }

    .img-logo-vendorbypaket {
        width: 200px;
    }

    .img-detail-menu {
        height: 300px;
        width: auto;
        position: relative;
        overflow: hidden;
        display: block;
        margin-top: 40px;
        border-radius: 10px;
    }

    .gj-datepicker-bootstrap [role="right-icon"] button {
        width: 80px;
    }

    .photos-detail-directory-in {
        width: 400px;
        height: 400px;
        margin-top: -250px;
        margin-bottom: 1rem;
    }

    .img-detail-carousel {
        height: 35vh;
    }

    /* end images */
    /*table*/
    .desc-tittle-table-checkout {
        color: #888;
        margin-bottom: 2rem;
    }

    .table-checkout,
    .table-checkout-border {
        width: 100%;
    }

    .table-checkout-border th {
        font-family: "Poppins SemiBold";
        text-align: center;
        border-bottom: 2px solid #888;
    }

    .border-bottom-checkout {
        border-bottom: 2px solid #888;
    }

    .table-checkout-border td,
    .table-checkout-border th {
        padding: 0.25rem 0;
    }

    .table-checkout-border tfoot,
    .pay-button {
        font-family: "Poppins SemiBold";
    }

    .table-checkout-border tfoot td {
        border-top: 2px solid #888;
        border-bottom: 2px solid #888;
        font-size: 35px;
    }

    .success,
    .danger {
        margin-top: -50px;
    }

    /*form*/
    .input-group-register-text {
        height: 60px;
        width: 60px;
    }

    .input-form-register {
        padding-left: 70px !important;
    }

    select.form-control-sm,
    input.form-control-sm,
    .form-buyer,
    .input-group-sm>.form-control,
    .input-group-sm>.input-group-prepend>.btn,
    .input-group-sm>.input-group-append>.btn,
    select.form-control:not([size]):not([multiple]),
    .select2-search--dropdown .select2-search__field,
    .select2-container--default .select2-selection--single {
        height: 6rem !important;
        border-radius: 10px !important;
        font-size: 35px !important;
        margin-bottom: 1.5rem;
    }

    select.form-control-sm,
    input.form-control-sm,
    .form-buyer,
    .input-group-sm>.input-group-prepend>.btn,
    .input-group-sm>.input-group-append>.btn,
    select.form-control:not([size]):not([multiple]),
    .select2-search--dropdown .select2-search__field,
    .select2-container--default .select2-selection--single {
        padding: 20px;
    }

    .input-group-sm>.form-control,
    .input-group-sm>.form-control,
    .input-group-sm>.input-group-prepend>.input-group-text,
    .input-group-sm>.input-group-append>.input-group-text {
        padding: 20px 20px 20px 15% !important;
    }

    .input-group-sm>.input-group-prepend>.input-group-text,
    .input-group-sm>.input-group-append>.input-group-text {
        top: 0;
        bottom: 50%;
        left: 35%;
        font-size: 40px !important;
        height: 6rem !important;
        border-radius: 10px !important;
        margin-bottom: 1.5rem;
    }

    .custom-checkbox .custom-control-label::before,
    .custom-control-label::after,
    .custom-control-label::before {
        width: 80px;
        height: 80px;
        border-radius: 10px;
    }

    .register-checkout {
        margin-top: 1rem;
        margin-left: 10%;
    }

    a.register-checkout {
        text-align: center;
        position: relative;
        margin-top: 2rem;
        float: right;
    }

    .custom-control {
        padding-left: 2.5rem;
    }

    textarea {
        height: 15vh !important;
        border-radius: 10px !important;
        font-size: 35px !important;
        margin-bottom: 1.5rem;
        color: #000 !important;
        padding: 20px !important;
        border-width: 2px !important;
    }

    .tumb-paket[data-v-a0899ede] {
        border-radius: 20px !important;
    }

    .outline-primary {
        border-radius: 10px;
    }

    .text-or {
        width: 85px;
        top: -25px;
        font-size: 35px;
    }

    .icon-profile-detail {
        flex: 0 0 10%;
    }

    .label-icon-profile {
        flex: 0 0 90%;
    }

    .gj-datepicker-bootstrap [role="right-icon"] button .gj-icon,
    .gj-datepicker-bootstrap [role="right-icon"] button .material-icons {
        top: 25px;
    }

    /* .form-buyer {
        height: 50px !important;
    } */

    option {
        font-size: 12px;
    }

    /* footer{
        display: none;
    } */

    /*modal*/
    .modal-dialog {
        max-width: 80%;
    }

    .quantity-up,
    .quantity-down {
        font-size: 65px;
        width: 100px;
        height: 100px;
    }

    .options {
        font-size: 35px;
        padding: 20px;
    }

    .tumb-paket {
        font-size: 15px;
    }

    .col-form-label {
        margin-bottom: .5rem;
    }

    .tab-body,
    .tab-body-whistlist {
        border-width: 2px;
        border-radius: 15px;
        padding: 40px;
    }

    .card-title-filter {
        border-bottom: 2px solid rgba(0, 0, 0, 0.125)
    }

    .card-pannel-body,
    .card-pannel-header {
        border-radius: 15px;
        margin-bottom: 2rem !important;
    }

    .radio-date-check {
        padding: 10px 20px;
        border-radius: 15px;
    }

    .radio-date-check .custom-radio .custom-control-input:checked~.custom-control-label::before {
        border-width: 5px;
    }

    .gj-modal .gj-picker-bootstrap,
    .gj-picker-bootstrap table,
    .gj-picker-bootstrap div[role=navigator] div:first-child,
    .gj-picker-bootstrap div[role=navigator] div:last-child {
        /* top: 0 !important; */
        /* left: 0 !important; */
        width: 100%;
    }

    .gj-picker-bootstrap div[role=navigator] {
        height: auto;
    }

    .gj-picker div[role=navigator] div[role=period] {
        padding: 30px 0;
    }

    .gj-picker-bootstrap [role=header] [role=date],
    .gj-picker-bootstrap.datepicker [role=header] [role=year] {
        text-align: center;
    }

    .img-vendor-detail {
        height: 400px;
        width: 400px;
        box-shadow: 0 8px 8px rgba(0, 0, 0, 0.06);
    }

    .card-coming-soon {
        padding: 50% 0;
    }

    .card-coming-soon h3 {
        font-size: 200px;
        margin-bottom: 10rem;
    }

    .modal-search .nav-tabs .nav-item {
        padding: 0;
    }

    .btn-tab {
        font-size: 50px;
        padding: 15px;
    }

    .btn-tab a {
        color: #000;
    }

    .modal-search h4 {
        font-size: 40px;
        text-align: center;
        margin: 1rem 0;
    }

    .select2-container--default .select2-results>.select2-results__options {
        max-height: 500px;
    }

    .select2-results__option {
        padding: 15px 20px;
    }
}

/*// Large devices (desktops, 992px and up)*/
@media (min-width: 992px) and (max-width: 1199px) {

    .navbar-login-second,
    .img-logo-small,
    .icon-bottom-logo,
    .navbar-mobile-login,
    /* .banner-small, */
    .menu-profile-buyer-fixed,
    .menu-bar-checkout,
    .mobile-price-detail-body,
    .tittle-show,
    .card-detail-checkout,
    .icon-logo,
    .navbar-fixed-check,
    .notif-buyer-mobile,
    .logout-mobile,
    .show-mobile {
        display: none !important;
    }


    #navbarLogo {
        display: block !important;
    }
}

/*// Extra large devices (large desktops, 1200px and up)*/
@media (min-width: 1200px) and (max-width: 1366px) {
    .nav-head {
        padding-right: 1.25rem !important;
        padding-left: 1.25rem !important;
        white-space: nowrap;
        font-weight: 600;
        font-size: 12px;
    }

    .container {
        max-width: 1100px;
    }

    #navbarLogo {
        display: block !important;
    }

    .navbar-login-second,
    .img-logo-small,
    .icon-bottom-logo,
    .navbar-mobile-login,
    .banner-small,
    .menu-profile-buyer-fixed,
    .menu-bar-checkout,
    .mobile-price-detail-body,
    .tittle-show,
    .card-detail-checkout,
    .icon-logo,
    .navbar-fixed-check,
    .notif-buyer-mobile,
    .logout-mobile,
    .show-mobile {
        display: none !important;
    }
}

@media (min-width: 1367px) and (max-width: 5000px) {
    .top-bar {
        margin-top: -688px;
    }

    .navbar-expand-lg .navbar-nav .nav-link {
        white-space: nowrap;
    }

    .card-paket-promo-large {
        height: 28vh;
    }

    .nav-head {
        padding-right: 1.25rem !important;
        padding-left: 1.25rem !important;
        white-space: nowrap;
        font-weight: 600;
        font-size: 13px;
    }

    #navbarLogo {
        display: block !important;
    }

    .navbar-login-second,
    .img-logo-small,
    .icon-bottom-logo,
    .navbar-mobile-login,
    .banner-small,
    .menu-profile-buyer-fixed,
    .menu-bar-checkout,
    .mobile-price-detail-body,
    .tittle-show,
    .card-detail-checkout,
    .icon-logo,
    .navbar-fixed-check,
    .notif-buyer-mobile,
    .logout-mobile,
    .show-mobile {
        display: none !important;
    }
}