@charset "utf-8";
/* CSS Document */

/*------------------------------------------
Project Name : Travellia
Desgined By  : DesignsBridge
Developed By : Hassan;
Date         : 4/March/21;



-------------------------------------
        Table Of Index
-------------------------------------
1. Header css
2. Custom slider Css
3. slider Form Css
4. Properties Places Css
5. Services Css
6. Video Css
7. Porfolio Css
8. Packages Css
9. Support Css
10. Our Team Css
11. Blog Css
12. Newsletter Css 
13. Contact Css
14. footer Css
15. Page Css
16. Media Screen Css

------------------------------------------*/



/*********************************************
  base css
*********************************************/
@import url('https://fonts.googleapis.com/css?family=Poppins:200,300,400,500,600,700,800,900');

*{margin:0; padding:0;}
body{font-family: 'Open Sans', sans-serif;}
a{-webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;}
ul, ol{list-style:none;}
/* img{max-width:100%;} */
img{max-width:100%;}
h1, h2, h3, h4, h5, h6{ font-family: 'Poppins', sans-serif;}
h1{font-size:42px; font-weight:bold; color:#000; text-align:center; margin-bottom:60px; position:relative; text-transform:uppercase;}
h1:before{content:""; background:url(../images/underline.png) no-repeat; width:70px; height:8px; position:absolute; bottom:-22px; left:50%; margin-left:-40px;}
/* h1 span{color:hsl(22, 100%, 51%);} */
h1 span{color:#f82a06;}
p{font-size:14px; line-height:24px; color:#333;}
.title{text-align: center;}
.title h1{text-align:center; font-weight:bold; text-transform:uppercase; font-size:42px; color: #071c55;}
.readmore{text-align:left;}
.readmore a{text-decoration:none;
    background:#1317e4; font-size:14px; color:#fff;
    padding:12px 24px; text-transform: none; font-weight: bold;
    display:inline-block;
}
.readmore a:hover{background:#2a88bd;}




/*********************************************
  Header start
*********************************************/
.header{}
.logo{padding:10px 0px 5px 0px;}
.navbar-nav li{padding:23px 18px;}
.navbar-nav li:last-child{padding-right:0;}
.navbar{float: right; margin-top: 0px; padding: 0;}
.mr-auto, .mx-auto{margin-right:inherit !important;}
.navbar-brand{display:none;}
.navbar-default .navbar-nav>li:last-child{float:right; padding:0; margin-top:0; margin-left: 16px;}
.navbar-expand-lg .navbar-nav .nav-link{padding:0; color:#011847; font-weight: 600; font-size: 16px;} /***ubah font & warna navbar 14 to 16**/
.navbar-light .navbar-nav .active>.nav-link{color:#eb5803;} /***ubah warna aktif**/
.navbar-expand-lg .navbar-nav .nav-link:hover, .navbar-expand-lg .navbar-nav li:hover .nav-link{color: #f79605;} /***ubah warna hover**/
.header .col-md-9{padding-left:0;}
.navbar-collapse{padding-right:0;}
.sticky-wrapper .custom-navbar{width:100%; z-index:1000; -webkit-box-shadow: 0 2px 4px rgba(3,3,3,.11);
    -moz-box-shadow: 0 2px 4px rgba(3,3,3,.11);
    box-shadow: 0 2px 4px rgba(3,3,3,.11);}
.sticky .navbar-nav .nav-link, .sticky .navbar-nav .active>.nav-link{color: #011847;} /***ubah warna aktif jika text lain di aktif**/
.sticky{background: #fff; box-shadow: 0 0 10px rgb(0 0 0 / 13%);}
.header_phone{margin-left: 15px;}
.phonewrp {
    position: relative;
    display: inline-block;
    padding-left: 49px;
    margin-left: 20px;
}
.close-toggler{display: none;}
.navbar-light .navbar-toggler{display: none;}
.phonewrp:before {
    content: "";
    /**background: url(../images/wa.png) no-repeat top; /***icon wa***/
    background-size: cover;
    width: 36px;
    height: 36px;
    position: absolute;
    top: -2px;
    left: 0;
}
.phonewrp a {
    white-space: nowrap; /* Tambahkan ini agar text tidak memanjang kebawah*/
    text-decoration: none;
    font-size: 18px;
    color: #071c55;
    font-family: 'Montserrat', sans-serif;
    font-weight: 600;
}

.navbar-nav > li > a + i {
    display: none;
    position: absolute;
    right: 15px;
    top: 7px;
    font-size: 24px;
    cursor: pointer;
    color: #0b3c5d;
    background: #fff;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    z-index: 1000;
}
.header .submenu {
    position: absolute;
    background: #f5f7ff;
    box-shadow: 0 0 6px -3px;
    width: 230px;
    transform-origin: 0 0 0;
    transform: scaleY(0);
    transition: all 0.3s ease-in-out;
    z-index: 9;
    padding-left: 0;
    top: 100%;
    border: 1px solid #bba7ff; 
    padding: 0px;
}
.submenu li {
    padding: 0;
    border-bottom: 1px solid #ccbdff;
}
.submenu li a {
    font-weight: 500;
    font-size: 15px; 
    color: #1c1c1c;
    padding: 14px 22px !important;
    display: block;
    text-decoration: none;
}
.submenu li:last-child {
    padding-right: 0;
    border-bottom: none;
}
.header li:hover .submenu {
    transform: scaleY(1);
}
.submenu li a:hover {
    background: #071c55;
    color: #fff;
}



/*********************************************
    Custom slider options
**********************************************/
.tp-banner-container {
    position: relative;
    z-index: 1;
    padding: 0;
    width: 100%;
}
.tp-banner {
    position: relative;
    width: 100%;
}
/*tambahan agar nampak gelap gambar slider*/
.tp-banner li {
    position: relative;
}

.tp-banner li .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 1); /* Warna gelap dengan tingkat kegelapan disesuaikan di sini */
    pointer-events: none; /* Memastikan lapisan transparan tidak menghalangi interaksi dengan elemen di bawahnya */
}
/*end tambahan*/
.tp-caption {
    line-height:normal !important
}
.tp-caption a {
    color: inherit !important;
}
.tp-bullets.simplebullets.round .bullet {
    border: 3px #fff solid;
    border-radius: 50%;
    background-image: none !important;
}
.tparrows {
    width: auto !important;
    height: auto !important;
    background-image: none !important;
}
.tp-arr-allwrapper {
    margin: 0 10px;
    width: 50px;
    height: 60px;
    background: rgba(255,255,255,0.5);
}
.tp-arr-allwrapper:hover .tp-arr-iwrapper {
    color: #fff;
}
.tp-leftarrow .tp-arr-allwrapper {
}
.tp-rightarrow .tp-arr-allwrapper {
}
.tp-arr-iwrapper {
    color: #000;
    text-align: center;
    font-size: 30px;
    font-family: 'Font Awesome 5 Free'; font-weight: 600;
    line-height: 60px;
}
.tp-leftarrow .tp-arr-iwrapper {
}
.tp-leftarrow .tp-arr-iwrapper:before {
    content: "\f104";
}
.tp-rightarrow .tp-arr-iwrapper:before {
    content: "\f105";
}
.tp-rightarrow .tp-arr-iwrapper {
}
.slide-h1 {
    margin: 5px 0 !important;
    padding: 0 0 10px !important;
    padding-bottom: 5px !important;
    color: #444;
    text-transform: uppercase;
    font-weight: bold;
    font-size: 57px;
}
.slide-h2 {
    margin: 5px 0 !important;
    padding: 0 0 10px !important;
    padding-bottom: 5px !important;
    color: #555;
    font-weight: bold;
    font-size: 55px;
    line-height: 100%;
}
.big-font {
    text-transform: uppercase;
    font-weight: 800;
    font-size: 60px;
}
.large-desc {
    font-size: 16px;
}
.slide-h3 {
    color: #fff;
    font-size: 31px;
    line-height: 100%;
}
.slide-h3 span {
    text-transform: uppercase;
    font-weight: bold;
}
.slide-head {
    text-transform: uppercase;
    font-weight: 900;
    font-size: 30px;
}
.slide-desc {
    font-size: 22px;
    line-height: 150%;
}
.main-title {
    text-transform: uppercase;
    font-weight: 800;
    font-size: 70px;
}
.icon-cont {
    padding: 15px 40px;
    border-radius: 10px;
    text-align: center;
}
.icon-cont:after {
    position: absolute;
    bottom: -10px;
    left: 40%;
    z-index: 5;
    display: inline-block;
    width: 0;
    height: 0;
    border-width: 10px 10px 0 10px;
    border-style: solid;
    content: "";
}
.icon-cont i {
    margin-bottom: 10px;
    color: #fff;
    font-size: 50px;
}
.icon-cont span {
    display: block;
    padding: 0 0 5px;
    color: #fff;
    text-align: center;
    font-size: 18px;
}
a.wit-btn {
    background: #fff;
    color: #333 !important;
    text-transform: none;
}
.wit-line {
    width: 5%;
    height: 1px;
    background: #fff;
}
.vert-line {
    min-height: 270px;
    width: 1px;
    background: #fff;
}
.subTxt {
    text-transform: uppercase;
    font-weight: bold;
    font-size: 17px;
    color: #333;
}
.large-title {
    color: #222;
    font-size: 60px;
    font-weight: 800;
    text-transform: uppercase !important;
}
.large-light-title {
    color: #787878 !important;
    font-size: 70px;
    font-weight: lighter;
    text-transform: uppercase;
    letter-spacing:2px
}
.large-text {
    font-size: 20px;
    color: #000;
    font-weight: lighter;
}
.larger-text {
    font-size: 24px;
    font-weight: lighter;
    text-transform: uppercase;
}
.witTxt {
    color: #fff !important;
}
.light-font {
    font-weight: lighter !important;
    font-size: 50px;
}
.black-bg{
    background:rgba(0,0,0,.63);
    color:#a8a8a8;
    text-transform:none;
}
.lft-list {
    padding: 10px;
    font-size: 18px;
    color: #fff;
}
.wit-border {
    border: 1px #fff solid;
    padding: 15px 60px;
    color: #fff;
    font-size: 16px;
    text-transform: uppercase;
}
.rounded-bord {
    margin-right: 15px;
    border: 1px #fff solid;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    font-size: 13px;
    border-radius: 50%;
}
#vertical-ticker{
    height:120px;
    overflow:hidden;
}
#vertical-ticker li{
    padding:15px 20px;
    display:block;
    text-align:center;
}
.to-bottom i.fa{
    font-size: 30px;
    border:2px #a8a8a8 solid;
    padding:20px 22px;
    border-radius:50%;
    -webkit-animation: bounce 2s infinite linear;
    animation: bounce 2s infinite linear;
}

.slidertext_hover{font-size: 26px; color: #fff;font-weight: 650; letter-spacing: 5px;}
.slidertext2{color:#fff; font-size:25px; font-weight:600 !important; padding:15px 0; text-transform:none !important; font-family: 'Poppins', sans-serif; text-align:center;}
.slidertext3{color:#fff; font-size:22px; font-weight:600 !important; padding:15px 0; text-transform:inherit !important; font-family: 'Poppins', sans-serif; text-align:left; line-height:32px !important;}
.slidertext4 a{color:#000 !important; font-size:18px; font-weight:650; padding:20px 42px; border-radius:30px; text-transform:uppercase !important; text-align:center; background:none; font-family:'OpenSans', sans-serif; 
  
    border-radius: 0px;
    background-color: #fff;

    }
.tp-bannertimer{display: none;}

.slider_btn a{background: none !important; border: 1px solid #fff; color: #fff !important;}
.slider_btn a:hover{background: #f11b1c !important; border-color: #f11b1c;}

.slidertext4 i{padding-left:6px; font-size:24px;}

.slidertext4 a:hover{background: #071c55; color: #fff !important;}
a.slidebtn{background:#e76ba9; color:#fff !important; padding:15px 30px; font-size:16px; text-align:center; font-weight:normal !important; text-transform:none !important; display:inline-block; font-family:'OpenSans', sans-serif;}
a.slidebtn i{margin-left:10px;}


@-webkit-keyframes bounce {
    0% {
        transform:translateY(0%);
    }
    50% {
        transform:translateY(-30%);
    }
    100% {
        transform:translateY(0);
    }
}

/* Mozilla Firefox 15 below */
@-moz-keyframes bounce {
  0% {
        transform:translateY(0%);
    }
    50% {
        transform:translateY(-30%);
    }
    100% {
        transform:translateY(0);
    }
}

/* Opera 12.0 */
@-o-keyframes bounce {
    0% {
        transform:translateY(0%);
    }
    50% {
        transform:translateY(-30%);
    }
    100% {
        transform:translateY(0);
    }
}

/* W3, Opera 12+, Firefox 16+ */
@keyframes bounce {
    0% {
        transform:translateY(0%);
    }
    50% {
        transform:translateY(-30%);
    }
    100% {
        transform:translateY(0);
    }
}





/*********************************************
  slider Start
*********************************************/
.slider-wrap{background:url(../images/banner.jpg) no-repeat top; background-size:cover; padding:200px 0 160px 0;}
.sliderTxt h1{font-size:60px; color:#fff; font-weight:600; padding:0; margin:0; text-align:center}
.sliderTxt h1:before{display:none;}
.sliderTxt p{font-size:24px; text-align: center; line-height:24px; margin:0 auto; color:#fff; padding:5px 0;font-weight:300; max-width:780px;}
.form-wrap{width:820px; margin:0 auto; margin-top:15px; border-radius:5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; border: solid 12px rgba(255,255,255,.27);}
.input-group .form-control{border:none; font-size: 14px; font-weight:bold; border-radius:0px !important; height: 60px; position:relative; padding-left: 34px;}
.input-group .dropdown{height: 60px; width:100%; border: none; padding: 6px 12px; font-size: 14px; line-height: 1.42857143; color: #555; background-color: #fff; background-image: none;}
.input-btn{text-align:right;} 
.sbutn{background: #4361ff; border: none; cursor: pointer; padding: 18px 68px; text-transform: uppercase; font-size: 17px; color: #fff; border-radius:0px 5px  5px 0; font-weight: bold;}
.sbutn:hover{background:#333;}
.slider-wrap .input-group{border-right: 1px solid #ccc; width:100%;}
.form-wrap .col-lg-3{padding:0;}
.formWrp{padding:60px 0;}
.map-wrap iframe{margin-bottom:-5px;}
.slider-wrap .btn-block{border-radius: 0; height: 54px;  font-weight: bold; font-size: 14px; text-transform: uppercase;}
.input_icon{position:absolute; top: 19px; color: #bbb;
    left: 12px;
    z-index: 99;
    font-size: 16px;}



.item-search-menu ul li .active, .item-search-tabs-dark .item-search-menu ul li .active {
    background: hsl(49, 100%, 47%); /*ubah warna judul tab itenary*/
    color: #0a0a0a; /*ubah warna font judul tab itenary*/
    border-radius: 5px 5px 0 0;
    font-weight: bold;
}
.item-search-menu ul li a {
    padding: 10px 16px;
    color: #fff;
    text-align: center;
    letter-spacing: .5px; text-decoration: none;
    display: block;
    background: 0 0;
    margin: 1px 0px;
    border-radius: 5px 5px 0 0;
    font-weight: 400;
}
.item-search-menu ul li a:hover{background: hsl(49, 100%, 47%);} /*ubah warna tab itenary*/
.item-search-tabs .tab-content {
    background: hsl(49, 100%, 47%); /*ubah warna tab itenary*/
    padding: 38px;
    margin: -1px 5px 0 0;
    box-shadow: 0px 2px 16px rgb(0 0 0 / 17%);
    border-radius: 0px 0px 5px 5px;
}


.item-search-tabs .form-control {height: 54px; font-weight: bold; border-radius: 0; font-size: 14px; background-clip: inherit;}
.sliderForm-wrap{ 
    position: relative;}

.sliderForm-wrap .btn-secondary{border-radius: 0; height: 54px; background-color: #071c55; font-size: 18px;font-weight: 700;}
/* CSS untuk efek hover */
.sliderForm-wrap .btn-secondary:hover {
    background-color: #2a88bd; /* Sesuaikan warna latar hover sesuai kebutuhan */
    color: #fff; /* Sesuaikan warna teks hover sesuai kebutuhan */
}

.sliderForm-wrap .btn-third{border-radius: 0; height: 54px; background-color: #f17611; font-size: 18px;font-weight: 700;}
/* CSS untuk efek hover */
.sliderForm-wrap .btn-third:hover {
    background-color: #40aaf0; /* Sesuaikan warna latar hover sesuai kebutuhan */
    color: #fff; /* Sesuaikan warna teks hover sesuai kebutuhan */
}
.travel-content{margin-top: -46px; z-index: 100; position: relative;}
.lable_btn{margin-top: 41px;}
::-ms-input-placeholder { /* Edge 12-18 */
  color: #495057 !important;
  font-weight: bold;
}

::placeholder {
  color: #495057 !important;
  font-weight: bold;
}

.newform label{font-weight: bold; text-align: center; margin-bottom: 20px;}
.transectionWrp{background: #f3f3f3; padding: 50px; }
.info-table{background: #fff; padding: 40px; border-radius: 10px;}
.info-table .fa-arrow-alt-circle-down, .info-table .fa-trash-alt{font-size: 18px; color:#f82a06; padding-right: 6px;}
.info-table table tr td span{color: #f82a06; cursor: pointer;}
tfoot{background: #f8f8f8;}
.info-table .form-control{border: 1px solid #d7d7d7; width: 100%; padding-left: 20px; height: 50px;}
.info-table label{font-weight: bold;}
.checkout-btn{border: none; background: #071c55; color: #fff; padding:14px 30px; font-weight: bold; margin-top: 29px; width: 100%; cursor: pointer; border-radius: 0;}
.checkout-btn:hover{background: #2a88bd;}
.table-bordered td, .table-bordered th { 
    white-space: nowrap;
}
.formhidden,
.transectionWrp{display: none;}
.form-control:disabled, .form-control[readonly]{background: #fff;}
.roomsread{text-align: center;}


.berikut-wrap h3{font-size: 24px;}
.berikut-wrap ol{list-style: decimal; margin-left: 20px;}
.berikut-wrap ol li{font-size: 16px; margin-bottom: 8px;}

/********************************************
       == testimoni Start ==
********************************************/
.testimoni-wrap{padding: 60px 0; background: #f7f7f7;}
/********************************************
       == Properties Start ==
********************************************/
.property-wrap{padding: 60px 0; background: #f7f7f7;}
.property_box{background: #fff; padding: 18px; box-shadow:0 0 14px rgb(0 0 0 / 11%);}
.placesWrp li{margin: 15px;}
.propertyImg{overflow: hidden;}
.propertyImg img{width: 100%; -webkit-transform: scale(1);
  transform: scale(1); 
  -webkit-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;}
.property_box h3{margin-top: 10px; line-height: 24px; margin-bottom: 0;}
.property_box h3 a{text-decoration: none; font-size: 20px; color: #f82a06; font-weight: 700;}
/* .property_box h3 a:hover{color: #ffb900;} */
/*tambahan*/
.property_box h4{margin-top: 10px; line-height: 24px; position: absolute;
    top: -20px;
    right: 47px }
.property_box h4 a{text-decoration: none; font-size: 18px; color: #090452; font-weight: 600;}

/* .property_location i{padding-right: 6px; font-size: 14px; color: #b7b7b7;}
.property_location{font-size: 16px; color:#1a05d4;} */
.property_location {
    font-size: 16px;
    color: #1a05d4;
    display: flex;
    align-items: baseline;
    margin-top: 5px;
    margin-bottom: 5px;
}

.property_location i {
    margin-right: 5px;
    font-size: 14px;
    color: #8B4513;
}

.property_location span {
    flex-grow: 1;
}

/* .heart_info{display: flex; margin-top: 10px; justify-content: space-between;}
.heart_icon{margin-right: 5px;}
.heart_icon a{font-size: 14px; color: #a5a5a5; width: 30px; display: block; text-align: center; line-height: 30px; height: 30px; border: 1px solid #f0efef; background: #f9f9f9;} */
/*new*/
.heart_info {
    display: flex; 
    justify-content: space-between;
    flex-wrap: wrap; /* Menambahkan properti wrap */
}

.heart_icon {
    margin-right: 5px;
}

.heart_icon a {
    font-size: 14px;
    color: #a5a5a5;
    width: 30px;
    display: block;
    text-align: center;
    line-height: 30px;
    height: 30px;
    border: 1px solid #f0efef;
    background: #f9f9f9;
}


.property_price{font-size: 18px;  color: #f11b1c; font-weight: bold; margin-left: 15px;}
.propert_info{text-align: center; margin-top: 15px; border: 1px solid #efefef; padding: 7px;}
.propert_info h5{font-size: 12px; margin-bottom: 0; font-family: 'Open Sans', sans-serif; color: #000; margin-top: 5px;}
.propert_info ul li{position: relative;}
.propert_info ul li:before{content: ""; background: #efefef; width: 1px; height: 58px; position: absolute; top: -8px; left: 0;}
.propert_info ul li:first-child:before{display: none;}
.property_box:hover .propertyImg img{-webkit-transform: scale(1.1);
  transform: scale(1.1);}

.placesWrp .owl-dots{display: none;}
.property-wrap .owl-controls{margin-top: 20px; text-align: center;}

/*.faqs h4 a:after {
    content: "\f068";
    background: #ffb900;
     font-family: 'Font Awesome 5 Free';
    font-weight: bold;
    width: 30px;
    padding: 6px 0;
    color: #fff;
    position: absolute;
    left: 15px;
    top: 11px;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -webkit-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    line-height: 18px;
    border-radius: 50%;
}

 .faqs h4 a.collapsed:before {
    content: "\f067";
    background: #ffb900;
     font-family: 'Font Awesome 5 Free';
    font-weight: bold;
    width: 30px;
    padding: 6px 0;
    color: #fff;
    position: absolute;
    left: 15px;
    top: 11px;
    font-size: 16px;
    display: inline-block;
    text-align: center;
    transition: 0.3s ease-in;
    -moz-transition: 0.3s ease-in;
    -webkit-transition: 0.3s ease-in;
    -ms-transition: 0.3s ease-in;
    line-height: 18px;
    border-radius: 50%;
}

 .faqs h4 a.collapsed:after{display: none;} 
 
.collapse.show {
    display: block;
}
.panel-heading{position: relative;}*/



.page_content {
    position: relative;
    padding: 70px 0px;
}
.faq-accordion {
    margin: auto;
    position: relative;
    z-index: 1;
}
.faq-accordion .accordion {
    list-style-type: none;
    padding-left: 0;
    margin-bottom: 0;
}
.faq-accordion .accordion .accordion-item {
    border-radius: 5px;
    display: block; 
    border: none;
    background-color: #fff;
}
.faq-accordion .accordion .accordion-title { 
    color: #fff;
    text-decoration: none;
    position: relative;
    line-height: 26px; 
    font-size: 18px;
    font-weight: 500;
    cursor: pointer;
    background-color: #071c55;
    border-radius: 5px;
    z-index: 1;
        width: 30px;
    height: 30px;
    display: inline-block;
    text-align: center;
    line-height: 30px;
}
.faq-accordion .accordion .accordion-title:hover{background-color: #f11b1c;
    color: #fff; }
.faq-accordion .accordion .accordion-title i {
    
    font-size: 20px;
    -webkit-transition: all ease 0.5s;
    transition: all ease 0.5s;
}
.faq-accordion .accordion .accordion-title:focus{outline: none;}
.faq-accordion .accordion .accordion-title.active i::before {
    content: "\f068";
}
.faq-accordion .accordion .accordion-title.active i {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}

.faq-accordion .accordion .accordion-content {
    display: none; 
}
.faq-accordion .accordion .accordion-content.show {
    display: block;
}
.faq-accordion .accordion .accordion-content p{
    margin-bottom: 0;
    font-size: 16px; 
    line-height: 1.7;
}
.faq-accordion .accordion .accordion-title.active { 
    background-color: #f11b1c;
    color: #fff;
    border-bottom: 1px solid #bba070;
}
.faq-accordion .accordion .accordion-title{position: absolute;
    top: 0;
    right: 14px;
}



/*********************************************
    Services start
*********************************************/
.service-wrap{ padding: 60px 0 10px 0;
    overflow:hidden;     
}
.service-text h3{position:relative;}
.service-text h3:before{content:""; color: #071c55; font-weight: bold; background:#bababa; width:320px; height:2px; position:absolute; bottom:-18px; left:0;}
.service-text h5:before{content:""; color: #f82a06; font-weight: bold;font-size: 18px; }
.service-text p{font-size:16px; line-height:24px; color:#333; padding:30px 0 10px 0;}
.service-pic{position: relative;}
.service-pic:after {
    content: "";
    background: #071c55;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.2;
}
.service-block{
    width:68%;
    margin:0 auto;
}
.service-item-detail{
    position:relative;
}
.service-text{
    position:absolute;
    top:50%;
    right:75%;

    transform:translateY(-50%);
    -webkit-transform:translateY(-50%);
    width:400px;
    padding:40px;
    background:#fff;
    box-shadow:0px 0px 15px rgb(0 0 0 / 12%);
    overflow-y: auto; /* Tambahkan properti ini untuk mengaktifkan scroll vertikal jika kontennya lebih panjang dari area yang ditentukan */
    max-height: 450px; /* Tambahkan properti ini untuk menentukan tinggi maksimum sebelum muncul scrollbar */
}

.textwrp{
    padding: 0 140px;
    font-size: 18px; /* Sesuaikan ukuran font sesuai kebutuhan */
    color: #747171; /* Sesuaikan warna font sesuai kebutuhan */
    /*color: #5c5a5a; */
}
.service-wrap .owl-item .service-text{
    opacity:0;
}
.service-wrap .owl-item.center .service-text{
    opacity:1;
}
.service-wrap .owl-item{
    opacity:0.2;
}
.service-wrap .owl-item.center{
    z-index: 9;
    opacity:01;
}
.service-wrap .owl-carousel .owl-stage-outer{
    overflow: visible;
}
.service-wrap .owl-controls {
    position: absolute;
    bottom: 20px;
    left: 90px;
}

.owl-prev, .owl-next {
    width: 50px;
    height: 50px;
    line-height: 50px;
    margin-top: -15px;
    background: #f11b1c;
    font-size: 29px;
    color: #fff;
    text-align: center;
    display: inline-block;
    margin: 0 3px;
    position: static;
}

/*tambahan baru*/
.service-wrap .owl-carousel .owl-stage {
    transition: transform 1s ease; /* Adjust the duration (1s) to slow down the transition */
}

.service-wrap .owl-carousel:hover .owl-stage {
    transition-duration: 0.2s; /* Adjust the duration (0.2s) for the transition on hover */
}



/**********************************************
      Video Css
**********************************************/
.video-wrap{background:url(../images/video.jpg) no-repeat top; background-size:cover; padding:100px 0;}
.video-wrap p{font-size:24px; color:#fff; line-height:36px; text-align:center; padding:0 100px;}
.video-wrap h1{color: #fff;}
.video-wrap h1:before {
    background: url(../images/underline-white.png) no-repeat;
}
.playbtn {text-align:center; margin-top:80px; position:relative; margin-left: 0 !important;}
/* .playbtn:before{content:""; background:#fff; width:600px; height:2px; position:absolute; top:50%; left:50%; margin-left:-300px;} garis putih kiri kanan dari play button video*/
.playbtn:before { /* new hilangkan garis kiri kanan */
    content: "";
    background: #fff;
    height: 2px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -300px;
}
/*all size width & height kurangi 6*/
.playbtn a {
    box-sizing: content-box;
    display: inline-block;
    width: 26px;
    height: 38px;
    background: #fff;
    border-radius: 50%;
    padding: 16px 18px 16px 26px !important; /*kurangi 2*/
    position: relative;
    font-size: 34px;
}
.playbtn a:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 72px; /*kurangi 8*/
    height: 72px;
    background: #fff;
    border-radius: 50%;
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite;
}
.playbtn a span {
    display: inline-block;
    position: relative;
    z-index: 3;
    width: 0;
    height: 0;
    border-left: 26px solid #f11b1c;
    border-top: 16px solid transparent;
    border-bottom: 16px solid transparent;
}
.playbtn a:after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 72px; /*kurangi 8*/
    height: 72px;
    border-radius: 50%;
    -webkit-transition: all 200ms;
    transition: all 200ms;
}

/* playbtn untuk section video */
.playbtn-video {text-align:center; margin-top:80px; position:relative;}
.playbtn-video:before{content:""; background:#fff; width:600px; height:2px; position:absolute; top:50%; left:50%; margin-left:-300px;}
.playbtn-video a {
    box-sizing: content-box;
    display: inline-block;
    width: 32px;
    height: 44px;
    background: #fff;
    border-radius: 50%;
    padding: 18px 20px 18px 28px;
    position: relative;
}
.playbtn-video a:before {
    content: "";
    position: absolute;
    z-index: 0;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 80px;
    height: 80px;
    background: #fff;
    border-radius: 50%;
    -webkit-animation: pulse-border 1500ms ease-out infinite;
    animation: pulse-border 1500ms ease-out infinite;
}
.playbtn-video a span {
    display: inline-block;
    position: relative;
    z-index: 3;
    width: 0;
    height: 0;
    border-left: 32px solid #f11b1c;
    border-top: 22px solid transparent;
    border-bottom: 22px solid transparent;
}
.playbtn-video a:after {
    content: "";
    position: absolute;
    z-index: 1;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
    display: block;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    -webkit-transition: all 200ms;
    transition: all 200ms;
}


@-webkit-keyframes pulse-border {
 0% {
 -webkit-transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1);
 transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1);
 opacity:1;
}
 100% {
 -webkit-transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
 transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
 opacity:0;
}
}
 @keyframes pulse-border {
 0% {
 -webkit-transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1);
 transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1);
 opacity:1;
}
 100% {
 -webkit-transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
 transform:translateX(-50%) translateY(-50%) translateZ(0) scale(1.5);
 opacity:0;
}

 }




/*********************************************
  Porfolio wrap
*********************************************/
.porfolio-wrap{padding:200px 0 100px 0;}
.porfolio-wrap h1{margin-bottom:30px; margin-top:0;}
.portfolio-service li{margin-top:30px;}
.project-image{position:relative; overflow:hidden; display: inline-block; text-align:center; margin-top: 26px;}
.porfolio-wrap h3 a{text-decoration:none; color:#fff; font-size:24px;}
.portfolio-tags{color:#fff;}
.project-image:before{opacity: 0; visibility: hidden; position: absolute; content: ""; height: 100%; width: 100%; bottom: 100%; left: 0; right: 0; z-index: 3; background-image: -webkit-gradient(linear,0 0,0 100%,from(#cc8809),to(transparent)); background-image: -webkit-linear-gradient(transparent,#cc8809); background-image: -moz-linear-gradient(transparent,#cc8809),-moz-linear-gradient(transparent,#cc8809); background-image: -o-linear-gradient(transparent,#cc8809),-o-linear-gradient(transparent,#cc8809);  background-image: linear-gradient(transparent,#cc8809),linear-gradient(transparent,#cc8809); -moz-background-size: 100%; background-size: 100%; background-position: 0 0,100% 0;  background-repeat: no-repeat; -webkit-transition: all .3s ease-out; -moz-transition: all .3s ease-out; -ms-transition: all .3s ease-out; -o-transition: all .3s ease-out; transition: all .3s ease-out;}
.portfolio-service li:hover .builder{top:62% !important;}
.porfolio-wrap .owl-nav{position: absolute; bottom: -180px; margin-bottom: 80px; left: 0; width: 100%; text-align: center;} /* untuk posisi panah next bottom/top */
.porfolio-wrap .tab-content>.tab-pane{
    display: block;
    opacity: 0;
    visibility: hidden;
    height: 0;
    overflow: hidden;
}
.porfolio-wrap .tab-content>.tab-pane.fade.active{
    opacity: 1;
    visibility: visible;
    height: auto;
    overflow: visible;
}
.datepickWrp label {
    display: block;
    margin-bottom: 8px;
    font-size: 14px;
    color: #495057;
    position: absolute;
    top: 18px;
    left: 13px;
    background: #fff;
    font-weight: bold;
    width: 90%;
    z-index: 9;
}
.datepickWrp .datepicker_input:focus + label{display: none;}
.date-icon{position: absolute; top: 16px; right: 14px;}
.datepicker-dropdown{z-index: 999;}
.nav-tabs .nav-link{position: relative;
    display: inline-block;
    cursor: pointer;
    background: transparent;
    padding: 13px 18px;
    border-radius: 30px;
    font-weight: bold;
    font-size: 14px;
    color: #071c55;
    margin: 0 0px 5px 0;
    display: inline-block;
    border: 1px solid #b5c9ff;
    background: #f1f5ff;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}

.nav-tabs .nav-item.show .nav-link, .nav-tabs .nav-link.active{color: #fff;
    background: #071c55;
    border-color: #071c55;
}
.nav-tabs .nav-item{margin-right: 5px;}
.nav-tabs{border: none;}
.porfolio-wrap .filters {
    position: relative;
    text-align: center;
}
.clearfix {
    clear: both;
}
.porfolio-wrap .filters li {
    position: relative;
    display: inline-block;
    cursor: pointer;
    background: transparent;
    padding: 13px 18px;
    border-radius: 30px;
    font-weight: bold;
    font-size: 14px;
    color: #071c55;
    margin: 0 0px 5px 0;
    display: inline-block;
    border: 1px solid #b5c9ff;
    background: #f1f5ff;
    -webkit-transition: all 0.5s ease-out;
    -moz-transition: all 0.5s ease-out;
    -ms-transition: all 0.5s ease-out;
    -o-transition: all 0.5s ease-out;
    transition: all 0.5s ease-out;
}
.porfolio-wrap .filters li:hover, .porfolio-wrap .filters li.active {
    color: #fff;
    background: #071c55;
    border-color: #071c55;
}
.porfolio-wrap ul li {
    margin: 15px 0;
}
.porfolio-wrap .filters li .txt {
    position: relative;
    display: block;
    z-index: 1;
}


.portfolio-overley{display:none;}
.gallry_btn a{padding: 16px 36px; font-size: 16px;}

.portfolio-overley {z-index: 99;
    position: absolute;
    width: 100%;
    height: 100%;
    display: block;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    background: rgb(7 28 85 / 61%);
    text-align: center;
    -webkit-transform: scale(0);
    -moz-transform: scale(0);
    -o-transform: scale(0);
    transform: scale(0);
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}
.project-image{position: relative;}
.porfolio-wrap .image-link{
    position: absolute;
    right: 20px;
    top: 20px;
    width: 50px;
    height: 50px;
    color: #071c55;
    line-height: 50px;
    background: #fff;
    display: block;
    font-size: 16px;
    z-index: 1;
    text-align: center;
    border-radius: 100%;}

.project-image:hover .portfolio-overley {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
}
.porfolio-wrap .content { z-index: 1000;
    position: absolute;
    top:50%;
    left:0;
    margin-top: -40px;
    width:100%;
}
.project-image:before {
    content: "";
    border: 1px solid #FFF;
    position: absolute;
    top: 10px;
    left: 10px;
    bottom: 10px;
    right: 10px;
    z-index: 1;
}
.porfolio-wrap .content h3 a{text-decoration:none; color:#ffff;}
.porfolio-wrap .readmore{text-align: center; margin-top: 30px;}




/*********************************************
  Packages-wrap
*********************************************/
.package-wrap{background: url(../images/holiday.webp) no-repeat top; background-size: cover; padding: 60px 0 200px 0;}
.package-wrap .placesWrp{margin-bottom: -173px; margin-top: 80px;}
.package-wrap .owl-nav{position: absolute; bottom: -180px; margin-bottom: 80px; left: 0; width: 100%; text-align: center;} /* untuk posisi panah next bottom/top */
.package-wrap h1{color: #fff;}
.package-wrap h1:before{background: url(../images/underline-white.png) no-repeat;}
.package-wrap h2{color: #fff;}


/*********************************
        Support Css
*********************************/
.support-wrap{padding: 80px 10px 150px 0;text-align: center;}
/* .support_icon{background: #fff; border:1px solid #f11b1c; color: #f11b1c; font-size: 36px; width: 100px; height: 100px; display: inline-block; border-radius: 100%; text-align: center; line-height: 100px;} */
.support_icon{background: #fff; border:none;  color: #fff; font-size: 36px; width: 100px; height: 100px; display: inline-block; border-radius: 100%; text-align: center; line-height: 100px;}
.support_sec h3{font-size: 18px; color: #071c55; margin-top: 18px; text-transform: none; font-family: 'Open Sans', sans-serif; font-weight: bold; text-align: center;}
.support_sec h4{font-size: 16px; color: #f82a06; margin-top: 0px; position: static !important; text-transform: none; font-family: 'Open Sans', sans-serif; font-weight: normal; text-align: center;}
.support_sec p{font-size: 16px; color: #6b6b6b; margin-top: 10px; font-size: 16px; text-align: center;}  
.support-wrap .owl-nav{position: absolute; bottom: -180px; margin-bottom: 80px; left: 0; width: 100%; text-align: center;} /* untuk posisi panah next bottom/top */

.property_box .support_icon img {
    border-radius: 50%;
    max-width: 100%; /* Menggunakan max-width agar gambar tidak melebihi ukuran container */
    max-height: 100%; /* Menggunakan max-height agar gambar tidak melebihi ukuran container */
    width: auto; /* Menyesuaikan lebar gambar */
    height: auto; /* Menyesuaikan tinggi gambar */
    display: block; /* Mengatasi masalah margin auto pada beberapa browser */
    margin: auto; /* Menengahkan gambar */
}


/*********************************************
  Our Team Wrap start
*********************************************/
.team_wrap{padding:80px 0; background: #f7f7f7;}
.team_wrap .lower-content {
    position: relative;
    display: block;
    border: 1px solid #e8e8e8; background: #fff;
    padding: 25px;
    transition: all 500ms ease; text-align: center;
}
.team_wrap .lower-content h4{margin-bottom: 0;}
.team_wrap .lower-content h4 a{
    position: relative;
    display: block;
    font-size: 20px; color: #1c1c1c; text-decoration: none;
    line-height: 28px;
    font-weight: 700;
}
.team_wrap .inner-box{overflow: hidden;}
.team_wrap .image-box img{-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    transition: all 0.5s ease;}

.inner-box:hover img{-ms-transform: scale(1.2) rotate(5deg);
    -moz-transform: scale(1.2) rotate(5deg);
    -webkit-transform: scale(1.2) rotate(
5deg
);
    -o-transform: scale(1.2) rotate(5deg);
    transform: scale(1.2) rotate(
5deg
);
}

.team_wrap .lower-content .designation {
    position: relative;
    display: block;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    margin: 0px;
}
.team_wrap .lower-content .social-links {
    text-align: center; margin-top: 15px;

}
.team_wrap .lower-content .social-links li {
    position: relative;
    display: inline-block;
    margin: 0px 3px;
}
.team_wrap .lower-content .social-links li a {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 40px;
    line-height: 40px;
    border: 1px solid #cccccc;
    text-align: center;
    font-size: 12px;
    color: #999999;
}

.team_wrap .lower-content .social-links li:nth-child(1) a:hover{background: #3e578f; color: #fff; border-color: #3e578f;}
.team_wrap .lower-content .social-links li:nth-child(2) a:hover{background: #28a9e0; color: #fff; border-color: #28a9e0;}
.team_wrap .lower-content .social-links li:nth-child(3) a:hover{background: #da2d7b; color: #fff; border-color: #da2d7b;}


/*************************************************
  Blog css
*************************************************/
.blog-wrap{padding:60px 0}
.blog-meta ul {margin-bottom: 8px;
    list-style: none;
    overflow: hidden;
}
.blog-details {padding: 20px 30px; border: 1px solid #e8e8e8; min-height: 230px;}
.blog-meta ul li {display:inline-block; padding-right:6px;
    font-size: 14px;
    color: #000;
}
.blog-meta ul li a{text-decoration:none; color:#000;}
.blog-meta ul li i{font-size:16px; padding-right:5px; color:#2842cd;}
.blog-body h3{line-height:24px; margin-bottom: 12px;}
.blog-body h3 a{text-decoration:none;
    font-size: 18px; color:#000;
    font-weight: 600;
    margin: 0.72em 0 0.83em;
}
.blog-body h3 a:hover{color:#2842cd;}
.blog-body p{color: #6a6a6a;}

.blogImg:before, .blogImg:after{bottom: 15px;
    content: "";
    left: 15px;
    position: absolute;
    right: 15px;
    top: 15px;
    -webkit-transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    transition: opacity 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    -o-transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s;
    transition: opacity 0.35s ease 0s, transform 0.35s ease 0s, -webkit-transform 0.35s ease 0s;
    z-index: 9;
 
  }

  .blogImg:before{ border-bottom: 1px solid;
    border-top: 1px solid;
    -webkit-transform: scale(0, 1);
    -ms-transform: scale(0, 1);
    transform: scale(0, 1);
    border-color: #ffffff;}
    
.blogImg{position: relative;}
.blogWrp:hover .blogImg:before, .blogWrp:hover .blogImg:after{-webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);}

.blogWrp:hover {
    -webkit-box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.4);
    box-shadow: 0px 0px 25px 0px rgba(0, 0, 0, 0.4);
}

.blogImg:after{border-left: 1px solid;
    border-right: 1px solid;
    -webkit-transform: scale(1, 0);
    -ms-transform: scale(1, 0);
    border-color: #ffffff;
    transform: scale(1, 0);}





.mt30{margin-top: 30px;}
.single-blog.style-three {
    position: relative;
    overflow: hidden;
}
.single-blog.style-three .thumb {
    position: relative;
}
.single-blog.style-three .thumb img {
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}
.single-blog.style-three .thumb:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background:#071c55;
    z-index: 0;
    opacity: 0.6;
}
.single-blog.style-three .single-blog-details-wrap {
    position: absolute;
    left: 0;
    right: 0;
    top: 50%;
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    transform: translateY(-50%);
    margin-top: 40px;
    z-index: 2;
    overflow: hidden;
    -webkit-transition: all 0.6s ease;
    -moz-transition: all 0.6s ease;
    -o-transition: all 0.6s ease;
    transition: all 0.6s ease;
}
.single-blog.style-three .single-blog-details-wrap .single-blog-details {
    padding: 20px 25px;
}
.single-blog .tag {
    background: #01B9B7;
    padding: 0 6px 0 7px;
    height: 25px;
    line-height: 25px;
    color: #ffffff;
    font-size: 14px;
    border-radius: 2px;
}
.single-blog.style-three .single-blog-details-wrap .title, .single-blog.style-three .single-blog-details-wrap p {
    color: #ffffff;
}
.single-blog-details-wrap p{margin-bottom: 5px;}
.blog-wrap .readmore{text-align: center;}
.single-blog-details .readmore a {
    visibility: hidden;
    opacity: 0;
    margin-top: 22px; font-size: 14px;
    background: #f00; color: #fff; padding: 14px 27px; 
    -webkit-transition: all 0.4s ease;
    -moz-transition: all 0.4s ease;
    -o-transition: all 0.4s ease;
    transition: all 0.4s ease;
}

.blogfirst .single-blog-details{padding-left: 60px !important;}
.blogfirst .title{text-align: left;}
.blogfirst .single-blog-details-wrap{ transform: translateY(0%) !important;}
.blogfirst .readmore{text-align: left;}
.single-blog.style-three:hover .single-blog-details-wrap {
    margin-top: 0px;
}
.single-blog.style-three:hover .readmore a {
    visibility: visible;
    opacity: 1;
}
/*tambahan baru*/
.bogSec .single-blog .icon {
    text-align: center; /* Menyusun ikon ke center */
}

.bogSec .single-blog h3{
    font-size: 18px; color: #071c55; margin-top: 20px; text-transform: none; font-family: 'Open Sans', sans-serif; font-weight: bold; text-align: center; /* Menyusun "Address"  ke center */
}
.bogSec .single-blog h4{
    font-size: 16px; color: #f82a06; margin-top: 0px; text-transform: none; font-family: 'Open Sans', sans-serif; font-weight: normal; text-align: center; /* Menyusun "Address"  ke center */
}
.bogSec .single-blog p {
    text-align: center; /* Menyusun teks dan alamat ke kanan */
} 
.single-blog.style-three.blogfirst {
    height: 400px; /* Atur tinggi sesuai kebutuhan Anda */
}

/*end tambahan baru*/

/*---------------------------------------
   Newsletter
-----------------------------------------*/
.newsletter {
  background: hsl(49, 100%, 47%);
  padding: 20px 20px;
  max-width: 400px;
}
.newsletter h3 {
  margin: 0;
  font-size: 30px;
}
.newsletter h3, .newsletter p {
  color: #fff;
  margin: 0;
}
.newsletter .input-group {
  max-width: 400px;
  margin: 0 auto;
  height: 30px; /* Sesuaikan tinggi sesuai kebutuhan */
}
.newsletter .input-group:before {
  content: '\f0e0';
  font-family: 'Font Awesome 5 Free'; font-weight: 900;
  position: absolute;
  left: 20px;
  top: 12px;
  color: #ccc;
  font-size: 24px;
  z-index: 100
}
.newsletter .form-control {
  height: 30px; /* Sesuaikan tinggi sesuai input pd modal sesuai kebutuhan */
  padding: 17px 15px 17px 60px;
  font-size: 16px;
  border-radius: 0;
}
.newsletter .btn {
  background: #071c55;
  font-size: 16px;
  font-weight: 600;
  text-transform: none;
  padding: 16px 30px 17px 30px;
  cursor: pointer;
  border: none;
  color: #fff;
  border-radius: 0;
}


/*=============================
  Contact CSS
===============================*/
.contact .contact-bottom{
  margin:40px 0;
}
.contact .contact-info {
  text-align: left;
  position: relative;
  padding-left: 100px;
}
.contact .contact-info .icon {
  position: absolute;
  left: 0;
  top: 0;
  
}
.contact .contact-info .icon i {
  width: 70px;
  height: 70px;
  line-height: 70px;
  border: 1px solid #03369a;
  color:#03369a;
  font-size: 25px;
  border-radius: 100%;
  text-align: center;
}
.contact .contact-info h3 {
    font-size: 20px;
    font-weight: 700;
    margin: 0 0 5px;
}
.contact .contact-info a {
  color: #777;
}
.contact .contact-info p {
  color: #777;
  font-size: 15px; margin: 0;
}

.contact .contact-map #map{
  height:583px;
}
.contact .contact-head {
  overflow: hidden;
}

.contact .form-head .form-group:last-child{
  margin:0;
}
.contact .form-head .form-group input {
  height: 50px;
  width: 100%;
  padding-left: 15px;
  box-shadow: none;
  text-shadow: none;
  border: none;
  border: 1px solid #676767;
  background: none;
  color: #666666;
  font-size: 15px;
}
.contact .form-head .form-group input:hover,
.contact .form-head .form-group textarea:hover{
  padding-left:25px; -webkit-transition: all .3s ease; -moz-transition: all .3s ease; transition: all .3s ease;
}
.contact .form-head .form-group textarea {
  height: 192px;
  width: 100%;
  font-size: 15px;
  padding-left: 15px;
  padding-top: 18px;
  box-shadow: none;
  text-shadow: none;
  border: none;
  border: 1px solid #676767;
  color: #666666;
  background: none;
  resize: none;
}
.contact .form-head .form-group .button{
  margin-top:20px;
}
.contact .form-head .form-group button {
  color: #fff;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
.contact .form-head .form-group button:before{
  background:#f11b1c;
}
.contact .container-fluid{padding: 0;}
.contact .row{margin: 0;}
.contact .form{padding: 60px; background: #3c3737;}
.contact-head .row .col-lg-6{padding: 0;}
.contact .form-head .form-group button {
    color: #03369a;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.contact .button .btn {
    font-weight: bold;
    text-align: center;
    color: #03369a;
    display: inline-block;
    padding: 13px 32px;
  border-radius:0px;
    text-transform: uppercase;
    cursor: pointer;
    font-size: 14px;
    -webkit-transform: perspective(1px) translateZ(0);
    transform: perspective(1px) translateZ(0);
    overflow: hidden;
    position: relative;
    background: #fff;
    border: none;
    box-shadow: none;
    -webkit-transition: all 0.4S ease;
    -moz-transition: all 0.4S ease;
    transition: all 0.4S ease;
}

.contact .button .btn:hover{background: #03369a; color: #fff;}




/***********************************
 footer css
***********************************/
.footer-wrap{padding:40px 0; background: #eee; text-align: center;}
.copyright{color:#fff; margin-top:10px; color:#1a1a1a; font-size: 14px;}
.social-icons{list-style:none; margin-bottom:0;}
.social-icons li{display:inline-block; padding:0 3px;}
.social-icons li a{text-decoration:none; font-size:16px; width:30px; height:30px; display:block; border:1px solid#4267b2; text-align:center; line-height:30px; color:#4267b2;}
.social-icons li:nth-child(2) a{border:1px solid#2caae0; color:#2caae0;}
.social-icons li:nth-child(3) a{border:1px solid#e04e42; color:#e04e42;}
.social-icons li:nth-child(4) a{border:1px solid#0173b1; color:#0173b1;}
.social-icons li:nth-child(5) a{border:1px solid#f63c27; color:#f63c27;}
.social-icons li:nth-child(1) a:hover{background:#4267b2; color:#fff;}
.social-icons li:nth-child(1) a:hover{background:#4267b2; color:#fff;}
.social-icons li:nth-child(2) a:hover{background:#2caae0; color:#fff;}
.social-icons li:nth-child(3) a:hover{background:#e04e42; color:#fff;}
.social-icons li:nth-child(4) a:hover{background:#0173b1; color:#fff;}
.social-icons li:nth-child(5) a:hover{background:#f63c27; color:#fff;}

/***********************************
 page css
***********************************/
.scrollToTop{display:none;}
.page-scroll{position:fixed; bottom:20px; right:20px; z-index:1000;}
.page-scroll a{font-size:18px; color:#fff; background:#2842cd; width:40px; height:40px; text-align:center; line-height:39px; display:inline-block; border:1px solid #fff;}



/*****************************************
  media screen
*****************************************/

@media screen and (max-width: 1200px){
.navbar-default .navbar-nav>li>a{font-size:14px;}
.hoverForm{position:static; background:#7d7d7d;}
.sliderForm{float:none; width:auto;}
.formwrap{border:none; background:none;}
.slidertext_hover, .slidertext1, .slidertext2, .slidertext3, .slidertext4, .playbtn{margin-left: 60px !important;}
.slideForm .formwrap{background: rgba(0, 0, 0, 0.51);}
.navbar-expand-lg .navbar-nav .nav-link{font-size: 13px;}
.navbar-nav li{padding: 0 12px;}
.phonewrp a{font-size: 14px;}
.video-wrap p{font-size: 18px;}
.header .col-md-3{width:20%;}
.single-blog-details-wrap .title{font-size: 18px;}
.header .col-md-9{width:80%;}
.navbar-default .navbar-nav>li {padding:0px 6px;}
.item-search-tabs .form-control{font-size: 12px;}
.sticky{height:81px;}
.package-wrap .placesWrp{margin-top: 0;}
.service-wrap .title h1{margin-bottom: 40px;}
.textwrp{margin-bottom: 50px;}
.service-wrap .owl-controls{left: auto; right: 40px;}
.service-text {right: 65%;
    width: 370px;
}

}


@media screen and (max-width: 990px){
    .galleryTabs {
    display: flex;
    align-items: center;
    margin: 0;
    overflow: auto;
    flex-wrap: inherit;
    position: relative;
    white-space: nowrap;
}

    .navbar-nav > li > a + i {
    display: block;
}
.caret {
    display: none !important;
}
.navbar-nav li {
    position: relative;
}

.navbar-nav li:hover ul{display: none;}
.submenu {
    width: 100% !important;
    position: static !important;
    display: none;
    margin-left: 0;
    opacity: 1;
    visibility: visible;
    transform: scaleY(1);
}
.navbar-default .navbar-nav>li>a {padding: 18px 2px; font-size: 13px;} 
.header .col-sm-9{padding-left:0;}
.quote-wrap h2{text-align:center; margin-bottom:20px;} 
.navbar-expand-lg .navbar-nav .nav-link {
    font-size: 14px;
}
.playbtn a{width: 17px;
    height: 26px;
    padding: 16px 18px 16px 23px !important;
}
.playbtn a:before{width: 60px; height: 60px;}
.about-image{text-align:center; margin-top:30px;}
.serviceList li{margin-bottom:30px;}
.team_wrap{text-align:center;}
.service-text{right: auto; left: 0px;}
.social{margin-bottom:20px;}
.navbar-light .navbar-toggler{display: block;}
.service-text{position: static; -webkit-transform:translateY(0%); width: auto;}
.bogSec{display: flex; justify-content: space-between;}
.bogSec .mt30{margin-top: 0;}
.bogSec{margin-top: 15px;}
.bogSec .single-blog:first-child{margin-right: 15px;}
.textwrp, .video-wrap p{padding: 0;}
.sliderForm-wrap .form-group{margin-bottom: 5px !important;}
.playbtn{margin-top: 50px;}
.video-wrap{padding: 100px 0 80px 0;}
.worker-image{text-align:center;}
.blogfirst .title{font-size: 24px;}
.contact-form .button{margin-bottom:40px;}
.slider-wrap .readmore{margin-bottom:40px;}
.quote-wrap .quote-btn a{display:inline-block; margin-top:15px;}
.about-wrap h1{margin-top:25px;}
.banner-info{margin:0 !important;}
.videohover{top:0;}
.videoWrp{height: 400px;}
.videoWrp .hero-wrapper{height:400px;}
.header .col-md-3{width:100%;}
.header .col-md-9{width:100%;}
.navbar-nav{margin-top: 40px;}
.navbar-light .navbar-nav .active>.nav-link{color: #fff;}
.phonewrp{display: none;}
.navbar-default .navbar-nav>li{    padding: 0px 7px;}
.phone a{font-size: 22px;}
.navbar-default .navbar-nav>li:last-child{margin-top: -13px;}
.slider-wrap p{padding:0;}
.quote-wrap{text-align:center;}
.quote-wrap h2:before{left:50%; margin-left:-25px;}
.quote-wrap h2{margin-bottom:42px;}
.quote-wrap .quote-btn{margin-bottom:10px;}
.serviceList li{margin-top:30px;}

.navbar-default .navbar-nav>li{margin-top:0;}
.form-wrap {
    width: 100%;
}
.form-wrap .input-group {
    margin-bottom: 10px;
}
.sbutn {
    border-radius: 0px 0px 0px 0px;
    width: 100%;
}
.form-wrap .input-group .form-control{border-radius: 0;}
.top-menu, .topbar-wrap{text-align: center;}
.top-menu{margin-top: 15px; border-top: 1px solid #3e55d2;}
.navbar{float: none; padding: 0; margin: 0;}
.navbar-toggler{position: absolute; top: 20px; right: 20px;}
.navbar-expand-lg .navbar-nav .nav-link{padding: 10px 16px;}
.navbar-expand-lg .navbar-nav .nav-link:hover{background: #f79605; color: #fff !important;}
.navbar-expand-lg .navbar-nav .nav-link:hover, .navbar-expand-lg .navbar-nav li:hover .nav-link{background: #f79605; color: #fff !important;}
.navbar-nav li{padding: 0;}
.slider-wrap{padding: 100px 0 80px 0;}
.offer-icon{margin-bottom: 10px;}
.car_Wrp01{text-align: right;}
.offer-icon{display: inline-block;}
.get-bestoffer .offerTxt{padding: 0;}
.tab-contents{border: none;}
.feature-wrap .tabs .col-lg-3{padding-right: 15px;}
.feature-wrap .tabs .col-lg-9{padding-left: 15px;}
.blogImg img{width: 100%;}
.blog-details{min-height: inherit;}
.blogWrp{margin: 15px 0;}
.contact .contact-info{padding: 20px 0; text-align: center;}
.contact .contact-info .icon{position: static; margin-bottom: 10px; }
.videoWrp .sliderTxt{position: static;}
.video .formwrap{position: static;}
.video .formwrap{max-width: inherit;}
.video .slider-wrap{padding: 0;}
.hero-wrapper:before{top: 0;}
.service-wrap .owl-controls{top: -78px; width: 100%; text-align: center; right: auto; bottom: auto;}
.service-wrap .service-block{margin-top: 50px;}
.service-block{width:100%;}
.support_sec{margin: 15px 0;}
.support_sec p{font-size: 14px;}
.navbar-light .navbar-nav .nav-link {
    color: #fff;
}
.close-toggler {
    background: none;
    color: #fff;
    padding: 5px;
    border: none;
    margin-top: 10px;
    font-size: 24px;
    float: right;
    display: block;
}
.slidertext3{line-height: 20px !important;}
.navbar-collapse {
    position: fixed;
    top: 0px;
    bottom: 0;
    left: 100%;
    width: 60%;
    padding-right: 1rem;
    padding-left: 1rem;
    overflow-y: auto;
    visibility: hidden;
    background-color: rgba(0,0,0,0.8);
    transition: visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out;
    transition: transform .3s ease-in-out, visibility .3s ease-in-out, -webkit-transform .3s ease-in-out;
    z-index: 10000;
}
.navbar-collapse.show {
    visibility: visible;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
}
.video .formwrap{width:100%;}
.videoWrp .sliderTxt {
    padding-top: 139px;
}
}

@media screen and (max-width: 767px){
    .package-wrap .owl-nav{display: none;}
.top-text{text-align:center;}
.topbar-links{text-align:center; margin-top:5px;} 
.blogfirst .single-blog-details-wrap{top: 12% !important;}
.portfolio-service{text-align:center;}
.team_wrap{text-align:center;}
.playbtn:before{display: none;}
.slidertext3{line-height: 14px !important;}
.slidertext4 a{border: 1px solid #fff !important;}
.slider_btn{margin-right: 15px !important;}
.bogSec{display: block;}
.single-blog.style-three .thumb img{width: 100%;}
.slidertext_hover, .slidertext2, .slidertext3, .slidertext4{margin-top: -20px !important;}
.bogSec .single-blog:first-child{margin: 0;}
.bogSec .single-blog{margin-bottom: 15px !important;}
.navigationwrape{float: none;}
.navbar-default .navbar-nav>li>a{padding:14px 16px;}
.contact .form{padding: 30px;}
.service-image{display:inline-block;}
.about-service li{float:none; width:100%;}
.contact .contact-map #map{height: 300px;}
.copyright{text-align:center;}
.foot{text-align:center;}
.dropdown-menu{position:static; float:none; width:100%;}
.sliderTxt p{font-size:18px; line-height:20px;}
.navbar-default{background:#f7f7f7; border: 1px solid #eee; border-top:none;}
.icon-box{margin-top:10px;}
.slider-wrap h2 {font-size: 36px;}
.slider-wrap p {font-size: 14px; line-height:22px;}
.slider-wrap .readmore a{font-size:14px; padding: 12px 24px;}
.staticSlide h2{margin-top:0;}
.videoWrp{height:345px;}
.videoWrp .hero-wrapper{height:345px;}
.navbar-default .navbar-nav>li:last-child{float:left;}
.navbar-collapse{overflow:hidden;}
.navbar-collapse.in{overflow:hidden;}
.navbar-default .navbar-nav>li>a {
    padding: 10px 16px;
}
.social-icons{text-align:center; margin-top:15px;}
.slider-wrap h2 span{font-size: 54px;}
.navbar-default .navbar-nav>li>a:hover{background:#000; color:#fff;}
.phone{margin-left:15px;} 
.banner-info{padding:40px 0;}
.sticky{height:auto;}
.videoWrp .sliderTxt{padding-top: 120px;}
.slidertext2{font-size:42px !important;}
.navbar-default .navbar-nav>li{margin-top:0;}
.newsletter .form-control{font-size: 14px;}
.newsletter p{margin-bottom: 20px;}
.newsletter{text-align: center;}
.tab-button-outer {
    position: relative;
    z-index: 2;
    display: block !important;}
.tab-select-outer select{display: none;}
}

@media screen and (max-width:600px){
 .slidertext2{font-size:24px !important;}
 .slidertext3{font-size:10px !important;}
.slidertext3 span{font-size:10px !important;}
 .slidertext4 a{font-size:10px !important;}
}


@media screen and (max-width: 480px){.slider-wrap h2 span{font-size:36px;}
.portfolio-service{text-align:center;}
.playbtn a {
    width: 16px;
    height: 26px;
    padding: 13px 12px 2px 14px !important;
}
.playbtn a:before {
    width: 45px;
    height: 45px;
}
.sliderTxt h1{font-size:24px;}
.sliderTxt p{font-size:14px;}
.contact .contact-map #map{height: 200px;}
.title h1{font-size: 30px;}
.slider-wrap p {font-size: 12px; line-height:18px;}
.slider-wrap h2 {font-size: 24px;}
.slidertext3{font-size:9px !important; margin-top:-15px;}
.slidertext3 span{font-size:8px !important;}
.slidertext4 a{font-size:8px !important;}
.transectionWrp .d-flex{display: block !important;}
.info-table{padding: 15px;}
}

@media screen and (max-width: 424px){
 .slider-wrap p {font-size: 8px; line-height:14px; margin-top:5px;}
 .slider-wrap h2 {font-size: 18px;}
    .transectionWrp { 
    padding: 20px;
}
 
}

/***tambahan baru***/
/* Dropdown Container */
.dropdown {
    position: relative;
    display: inline-block;
    margin-left: 40px; /* Sesuaikan jarak dengan elemen lain (Contact) */
    z-index: 1000; /* Nilai z-indeks yang lebih tinggi dari banner */
}

/* Dropdown Button */
.dropdown button {
    background-color: #071c55;/*warna button*/
    color: white;
    padding: 10px;
    font-size: 16px;
    border: none;
    cursor: pointer;
}

/* Dropdown Menu */
.dropdown ul {
    list-style: none;
    padding: 0;
    margin: 0; 
    display: none;
        transform-origin: 0 0 0;
    transform: scaleY(0);
    transition: all 0.3s ease-in-out;
    top: 100%;
    position: absolute;
    background: #f5f7ff; /* Warna latar belakang untuk dropdown menu */
    min-width: 200px; /* Sesuaikan lebar sesuai kebutuhan */
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2);
    z-index: 1000; /* Nilai z-indeks yang lebih tinggi dari banner */
}

/* Dropdown Menu Item */
.dropdown li {
    padding: 0;
    text-decoration: none;
    display: block;
    color: #333; 
    white-space: normal;
    border-bottom: 1px solid #ccbdff;
}

/* Show the dropdown menu on hover */
.dropdown:hover ul {
    transform: scaleY(1);
    display: block;
}

/* Dropdown Menu Item Hover */
.dropdown li:hover {
    background-color: #ddd; /* Warna latar belakang saat dihover */
    color: #ec8b0b; /* Warna teks saat dihover */
}
.dropdown li a{padding: 10px 16px; }
.dropdown li a:hover{background: #071c54; color: #fff;}
/*tambahan play button di slide home*/
.tp-banner {
    display: flex;
    align-items: center;
}

.playbtn {
    margin-left: 300px; /* Ini akan memindahkan tombol play ke ujung kanan */
    margin-top: 10px; /* Anda bisa menyesuaikan jarak atas sesuai kebutuhan */

}
/*buat placeholder bold*/
.form-control::placeholder {
    font-weight: bold;
}
/*buat span bold*/
.current {
    font-weight: bold;
}
ul.list li.option {
    font-size: 14px; /* Sesuaikan dengan ukuran yang Anda inginkan pada list dropdown*/
}


.spacer {
    height: 20px; /* Sesuaikan ketinggian spacer sesuai kebutuhan */
}

.col-md-12 {
    margin-bottom: 20px; /* Sesuaikan margin bawah sesuai kebutuhan */
}

.input-group {
    margin-bottom: 10px; /* Sesuaikan margin bawah sesuai kebutuhan */
}
label {
    display: block;
    margin-bottom: 8px; /* Atur margin bawah sesuai kebutuhan */
    font-size: 14px; /* Atur ukuran font sesuai kebutuhan */
    color: #333; /* Atur warna teks sesuai kebutuhan */
  }
  
  /* Gaya label khusus pada elemen dengan class "newsletter" */
  .newsletter label {
    font-weight: bold; /* Atur ketebalan font sesuai kebutuhan */
  }

  /* CSS untuk mengurangi lebar modal */
.modal-content {
    max-width: 500px; /* Sesuaikan lebar maksimum sesuai kebutuhan */
    margin: auto; /* Untuk membuat modal terpusat di tengah halaman */
}

/* Gaya tambahan jika diperlukan */
.modal-body {
    padding: 20px; /* Sesuaikan padding sesuai kebutuhan */
}

/* Contoh mengurangi lebar modal secara spesifik untuk ID tertentu (misalnya, itenaryModal) */
#itenaryModal .modal-content {
    max-width: 500px; /* Sesuaikan lebar maksimum sesuai kebutuhan */
}

/* CSS untuk mengatur tata letak tombol */
.button button {
    height: 40px; /* Sesuaikan tinggi sesuai kebutuhan */
    display: flex;
    align-items: center;
    justify-content: center;
    text-transform: none; /* Menghilangkan transformasi huruf besar */
    transition: background-color 0.3s ease; /* Efek transisi untuk hover */
}

/* CSS untuk efek hover */
.button button:hover {
    background-color: #2a88bd; /* Sesuaikan warna latar hover sesuai kebutuhan */
    color: #fff; /* Sesuaikan warna teks hover sesuai kebutuhan */
}

/* CSS untuk jadwal itinerary */
.schedule-item {
    margin-bottom: 20px;
    display: flex;
    flex-wrap: wrap; /* Memastikan wrap pada kolom event */
}

.time {
    width: 120px;
    margin-right: 10px;
    color: #1749ec; /* Warna font untuk class time */
    font-weight: bold; /* Berat font untuk class time */
    font-size: 16px; /* Ukuran font untuk class time */
}

.event {
    flex-grow: 1;
    word-wrap: break-word;
    word-break: break-all;
    color: #6b6b6b;
}

h5 {
    color: #eb3a04; /* Warna font Days-1 */
    font-weight: bold; /* Berat font Days-1 */
    font-size: 18px; /* Ukuran font Days-1 */
}

::placeholder {
    font-weight: bold;
}








 



