.features-blue{
    color:#fff;
    background:linear-gradient(135deg,#084734,#b5d1e8);
    background-color:#184e8e;
    padding-bottom:30px
}
.features-blue p{
    color:rgba(255,255,255,.6)
}
.features-blue h2{
    font-weight:700;
    margin-bottom:40px;
    padding-top:40px;
    color:inherit
}
@media (max-width:767px){
    .features-blue{
        padding-bottom:10px
    }
    .features-blue h2{
        margin-bottom:25px;
        padding-top:25px;
        font-size:24px
    }
}
.features-blue .intro{
    font-size:16px;
    margin:0 auto 60px
}
.features-blue .item{
    min-height:100px;
    padding-left:80px;
    margin-bottom:40px
}
@media (max-width:767px){
    .features-blue .intro{
        margin-bottom:40px
    }
    .features-blue .item{
        min-height:0
    }
}
.features-blue .item .name{
    font-size:20px;
    font-weight:700;
    margin-top:0;
    margin-bottom:20px;
    color:inherit
}
.features-blue .item .description{
    font-size:15px;
    margin-bottom:0
}
.features-blue .item .icon{
    font-size:40px;
    color:#ffcc1e;
    float:left;
    margin-left:-65px
}
.highlight-clean{
    color:#313437;
    background-color:#fff;
    padding:90px 0;
    background-size:cover;
    background-repeat:no-repeat;
    background-position:center
}
.highlight-clean p{
    color:#cae6c0
}
.highlight-clean h1{
    font-weight:700;
    margin-bottom:25px;
    line-height:1.5;
    padding-top:0;
    margin-top:0;
    color:#cbc9c9;
    font-size: 30px;
}
.highlight-clean .intro{
    font-size:16px;
    max-width:500px;
    margin:0 auto 25px
}
.highlight-clean .buttons{
    text-align:center
}
.highlight-clean .buttons .btn{
    padding:16px 32px;
    margin:6px;
    border:none;
    background:0 0;
    box-shadow:none;
    text-shadow:none;
    opacity:.9;
    text-transform:uppercase;
    font-weight:700;
    font-size:13px;
    letter-spacing:.4px;
    line-height:1;
    outline:0
}
.highlight-clean .buttons .btn:hover{
    opacity:1
}
.highlight-clean .buttons .btn:active{
    transform:translateY(1px)
}
.highlight-clean .buttons .btn-primary{
    background-color:#055ada;
    color:#fff
}
.highlight-clean .buttons .btn-default{
    background-color:#e6e7ea;
    color:inherit
}
footer{
    background-color:#292c2f;
    box-shadow:0 1px 1px 0 rgba(0,0,0,.12);
    box-sizing:border-box;
    width:100%;
    text-align:left;
    font:700 16px sans-serif;
    padding:55px 50px;
    bottom:0;
    color:#fff
}
.social-links a,.thumbnail.product-box .list-group,.thumbnail.product-box .product-box-title{
    text-align:center
}
.footer-navigation h3{
    margin:0 0 20px;
    font:400 36px Cookie,cursive;
    color:#fff
}
.footer-navigation h3 a{
    text-decoration:none;
    color:#fff
}
.footer-navigation h3 span{
    color:#5383d3
}
.footer-navigation p.links a{
    color:#fff;
    text-decoration:none
}
.footer-navigation p.company-name{
    color:#8f9296;
    font-size:14px;
    font-weight:400;
    margin-top:20px
}
@media (max-width:767px){
    .footer-contacts{
        margin:30px 0
    }
}
.footer-contacts p{
    display:inline-block;
    color:#fff;
    vertical-align:middle
}
.footer-contacts p a{
    color:#5383d3;
    text-decoration:none
}
.fa.footer-contacts-icon{
    background-color:#33383b;
    color:#fff;
    font-size:18px;
    width:38px;
    height:38px;
    border-radius:50%;
    text-align:center;
    line-height:38px;
    margin:10px 15px 10px 0
}
span.new-line-span{
    display:block;
    font-weight:400;
    font-size:14px;
    line-height:2
}
.footer-about h4{
    display:block;
    color:#fff;
    font-size:14px;
    font-weight:700;
    margin-bottom:20px
}
.footer-about p{
    line-height:20px;
    color:#92999f;
    font-size:13px;
    font-weight:400;
    margin:0
}
div.social-links{
    margin-top:20px;
    color:#fff
}
.product-intro,.whyus-title{
    margin-top:30px
}
.social-links a{
    display:inline-block;
    width:35px;
    height:35px;
    cursor:pointer;
    background-color:#33383b;
    border-radius:2px;
    font-size:20px;
    color:#fff;
    line-height:35px;
    margin-right:5px;
    margin-bottom:5px
}
.navbar{
    min-height:60px;
    margin-bottom:21px;
    border:1px solid transparent
}
@media (min-width:768px){
    .navbar-nav>li>a{
        padding-top:20px;
        padding-bottom:20px
    }
    .testimonials-clean .item{
        height:220px
    }
}
#product,#whyus,.highlight-clean .container{
    padding-top:60px;
    padding-bottom:60px
}
.navbar.navbar-default.navbar-custom{
    border-radius:0;
    margin-bottom:0;
    font-family:ABeeZee
}
.highlight-clean .container{
    background-color:rgba(2,17,33,.74)
}
.list-group-item,.list-group-item:first-child{
    border:none
}
#product{
    background-color:#e6e7ea
}
.pacakge-title{
    margin-bottom:15px;
    font-weight:700
}
.product-intro,.whyus-intro,.whyus-title{
    margin-bottom:30px
}
.whyus-title{
    font-weight:700
}
.article-content{
    font-family:Roboto,sans-serif
}
.navbar-brand>img{
    padding:0;
    margin:-20px;
    border-radius:6px
}
.testimonials-clean{
    color:#313437;
    background-color:#eef4f7
}
.testimonials-clean p{
    color:#7d8285
}
.testimonials-clean h2{
    font-weight:700;
    margin-bottom:40px;
    padding-top:40px;
    color:inherit
}
@media (max-width:767px){
    .testimonials-clean h2{
        margin-bottom:25px;
        padding-top:25px;
        font-size:24px
    }
}
.testimonials-clean .intro{
    font-size:16px;
    max-width:500px;
    margin:0 auto
}
.testimonials-clean .intro p{
    margin-bottom:0
}
.testimonials-clean .people{
    padding:50px 0 20px
}
.testimonials-clean .item{
    margin-bottom:32px
}
.testimonials-clean .item .box{
    padding:30px;
    background-color:#fff;
    position:relative
}
.testimonials-clean .item .box:after{
    content:'';
    position:absolute;
    left:30px;
    bottom:-24px;
    width:0;
    height:0;
    border:15px solid transparent;
    border-width:12px 15px;
    border-top-color:#fff
}
.testimonials-clean .item .author{
    margin-top:28px;
    padding-left:25px
}
.testimonials-clean .item .name{
    font-weight:700;
    margin-bottom:2px;
    color:inherit
}
.testimonials-clean .item .title{
    font-size:13px;
    color:#9da9ae
}
.testimonials-clean .item .description{
    font-size:15px;
    margin-bottom:0
}
.testimonials-clean .item img{
    max-width:40px;
    float:left;
    margin-right:12px;
    margin-top:-5px
}
.product-price{
    font-size: 16px;
    text-align:center;
    font-family:sans-serif;
    font-weight:bold;
    color:#007a3d
}
.article-list .item{
    text-align:center;
    margin-bottom: 15px;
    margin-top: 15px;
    border: solid 1px #ddd;
    border-radius: 3px;
    padding: 5px;
}

@media (max-width:767px){

}

.article-list .item .name{
    text-align:center;
    height: 40px;
    overflow-x: hidden;
    overflow-y: hidden;
    text-overflow: ellipsis;
    white-space: pre-wrap;
}
.article-list .item .name:hover{
    overflow-x: visible;
    overflow-y: visible;
    white-space: pre-line;
    height: auto;
}
.article-list .item .description{
    text-align:center;
    font-size:12px;
    height: 120px;
    overflow-x: hidden;
    overflow-y: hidden;
    text-overflow: ellipsis;
    white-space: pre-wrap;
}
.article-list .item .description:hover{
    overflow-x: hidden;
    overflow-y: visible;
    white-space: pre-line;
    height: 120px;
}

.article-list .item a:hover{
    text-decoration:none
}
.product-tab>li:nth-child(odd)>a{
    background-color: #27a1af;
    color: #FFF;
}
.product-tab>li:nth-child(even)>a{
    background-color: #3c9a5f;
    color: #FFF;
}
.product-tab>li:nth-child(odd).active>a,.product-tab>li:nth-child(even).active>a{
    background-color: #fff;
    color: #222222;
}
#sec-footer {
    min-height: 200px;
    background-color: #14213d;
    color: #bfd1e5;
    padding-top: 60px;
}
#sec-footer h4 {
    color: #fff;
    font-weight: 700;
     margin-bottom: 25px;
}
#footer-content{
    padding-bottom: 60px;
}
#sec-footer a {
     display: block;
    width: 100%;
    height: 30px;
    text-decoration: none;
}
.text-info {
     color: #5bc0de;
}
#copyright {
    padding-top: 15px;
    padding-bottom: 15px;
    display: block;
    margin-bottom: 0;
    background-color: #010d27;
    text-align: center;
    color: #9E9E9E;
}
.highlight-blue {
    color:#fff;
    background-color:#124971;
    padding:50px 0;
}
.highlight-blue p {
    color:#c4d5ef;
    line-height:1.5;
}
.highlight-blue h2 {
     font-weight:normal;
    margin-bottom:25px;
    line-height:1.5;
    padding-top:0;
     margin-top:0;
    color:inherit;
}
.highlight-blue .intro {
    font-size:16px;
    margin:0 auto 25px;
}
.highlight-blue .buttons {
    text-align:center;
}
.highlight-blue .buttons .btn {
    padding:16px 32px;
    margin:6px;
     border:none;
    background:#18bc9c;
    box-shadow:none;
    text-shadow:none;
    opacity:0.9;
    text-transform:uppercase;
    font-weight:bold;
    font-size:13px;
    letter-spacing:0.4px;
    line-height:1;
}
.highlight-blue .buttons .btn:hover {
    opacity:1;
}
.highlight-blue .buttons .btn:active {
    transform:translateY(1px);
}
.highlight-blue .buttons .btn-primary, .highlight-blue .buttons .btn-primary:active {
    border:2px solid rgba(255,255,255,0.7);
    border-radius:6px;
    color:#ebeff1;
    box-shadow:none;
    text-shadow:none;
    padding:14px 24px;
     background:transparent;
    transition:background-color 0.25s;
}
 @media (min-width:768px){
     .dropdown-submenu {
         position: relative;
    }
     .dropdown-submenu .dropdown-menu {
         top: 0;
         left: 100%;
         margin-top: -1px;
         width: 100%;
    }
     .caret-right{
         transform : rotate(-90deg) !important;
         display: inline-block;
    }
}
 @media (max-width:767px){
     .dropdown-submenu .dropdown-menu {
         margin-left: 15px;
    }
}
 .navbar-default .navbar-nav li a {
     font-size: 14px;
}
@media (min-width:768px){
  .modal-lg-custom{
    width: 90% !important;
  }

}
.panel-shadow, .box-shadow{
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.15);
  -moz-box-shadow: 0 5px 10px rgba(0,0,0,.15);
  box-shadow: 0 5px 10px rgba(0,0,0,.15);
}

.panel-shadow:hover, .box-shadow:hover{
  -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.50);
  -moz-box-shadow: 0 5px 40px rgba(0,0,0,.50);
  box-shadow: 0 5px 40px rgba(0,0,0,.50);
}
#accordion-opentrip .panel-title a{
  font-size: 24px;
  display: block;
  width: 100%;
  padding-top: 15px;
  padding-bottom: 15px;
  text-decoration: none;
}
#accordion-opentrip .panel-title a:hover{
  text-decoration: none;
}
#accordion-opentrip .panel-heading:hover{
  background-color: #2f7d00;
}
#accordion-opentrip .panel-title a i{
  color:#fff;
  display: inline-block;
  margin-right: 15px
}
#accordion-opentrip .panel-body{
  font-size: 12px;
}
.opentrip-accordion, .opentrip-price-box, .opentrip-lainnya-box{
  -webkit-box-shadow: 0 5px 40px rgba(0,0,0,.15);
  -moz-box-shadow: 0 5px 40px rgba(0,0,0,.15);
  box-shadow: 0 5px 40px rgba(0,0,0,.15);
}
.opentrip-price{
  font-family: sans-serif;
  font-size: 24px;
  font-weight: bold;
}

div.page-title{
    margin-bottom:15px;
}
div.page-title.bg1{
  background: #ff5c00;
  color:#fff
}
div.page-title.bg2{
  background: #ff5c00;
  color:#fff
}

.page-header{
  padding-top:30px;
  padding-bottom:30px;
  margin-bottom:30px;
}
.btn-read-article:hover{
  background: #0fb8ad;
  color:#fff;
  border-color: #0fb8ad;
}

.opentrip-tab>li>a{
  padding-top: 15px;
  padding-bottom: 15px;
}
.opentrip-tab>li:nth-child(odd)>a{
    background-color: #2C7873;
    color: #FFF;
}
.opentrip-tab>li:nth-child(even)>a{
    background-color: #6FB98F;
    color: #FFF;
}
.opentrip-tab>li:nth-child(odd).active>a,
.opentrip-tab>li:nth-child(even).active>a{
    background-color: #FFF !important;
    color: #222222;
}
.navbar-default {
    background-color: #676767;
    border-color: transparent;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
    color: #ffffff;
    background-color: rgb(175, 104, 0);
}
.navbar-default .navbar-nav>li>a:hover, .navbar-default .navbar-nav>li>a:focus {
    color: #FFEB3B;
    background-color: transparent;
}
.navbar-default .navbar-nav>.active>a, .navbar-default .navbar-nav>.active>a:hover, .navbar-default .navbar-nav>.active>a:focus {
    color: #FFEB3B;
    background-color: rgb(175, 104, 0);
}
@media (min-width: 1200px)
{  
    .modal-lg{
        width: 80%;
    }
 }
 .header-fix {
    position: fixed!important;
    -webkit-transition: all .5s;
    transition: all .5s;
    padding: 5px!important;
    background: #676767;
}
header {
    position: absolute;
    width: 100%;
    z-index: 9999999;
    top: 0;
    padding: 0 0 20px;
}
 
 .header-contact {
    display: block;
    background-color: #170931;
    width: 100%;
    padding: 5px 0;
    text-align: right;
}
.header-contact a {
    color: #d6caca;
    border-right: solid #ddd 1px;
    padding-right: 5px;
}
.header-contact a:hover {
    color: #fff;
}
#sec-brand{
    padding-top:30px;
    padding-bottom:30px;
}
#sec-brand .brand-img{
    display:inline-block;
    height:120px;
    margin:15px;
}
.modal{
    z-index:9999999999999;
}
    
@media only screen and (min-width: 768px) {

  .dropdown.open > .dropdown-menu li a{
    color: #fff;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    text-overflow: ellipsis;
    overflow: hidden;
  }

  .header-fix .dropdown.open > .dropdown-menu {
    top: 65px !important;
  }

  .dropdown.open > .dropdown-menu{
    border-top: 2px;
    border-top-color: #5eff00;
    border-top-style: solid;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;

    display: grid;
    grid-template-columns: repeat(auto-fill,minmax(420px, 1fr));


    background-color: #1a242f;

    width: 1000px;
    height: 420px;

    margin-left: auto;
    margin-right: auto;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    top: 100px !important;
  }
}
#wc-phone-toggle {
  bottom: 64px;
  right: 0;
  margin-right: 5px;
  margin-bottom: 5px;
  display: block;
  position: fixed;
  z-index: 100000000;
  color: #fff;
  background-color: #248b98;
  width: 60px;
  text-align: center;
  padding: 15px;
  border-radius: 50%;
  -webkit-transition: right 0.5s;
  transition: right 0.5s;
}
#wc-phone-toggle.wc-phone-toggle-hide {
  right: -1000px;
  -webkit-transition: right 0.5s;
  transition: right 0.5s;
}
#wc-phone-container {
  position: fixed;
  width: 300px;
  bottom: -1000px;
  right: 15px;
  display: block;
  -webkit-transition: bottom 0.5s;
  transition: bottom 0.5s;
}
#wc-phone-container.wc-phone-container-show {
  bottom: 15px;
  -webkit-transition: bottom 0.5s;
  transition: bottom 0.5s;
}
#wc-phone-container .panel-body {
  padding: 0;
}
#wc-whatsapp-toggle {
  bottom: 0;
  right: 0;
  margin-right: 5px;
  margin-bottom: 5px;
  display: block;
  position: fixed;
  z-index: 100000000;
  color: #fff;
  background-color: #4ccf1b;
  width: 60px;
  text-align: center;
  padding: 15px;
  border-radius: 50%;
  -webkit-transition: right 0.5s;
  transition: right 0.5s;
}
#wc-whatsapp-toggle.wc-whatsapp-toggle-hide {
  right: -1000px;
  -webkit-transition: right 0.5s;
  transition: right 0.5s;
}
#wc-whatsapp-container {
  position: fixed;
  width: 300px;
  bottom: -1000px;
  right: 15px;
  display: block;
  -webkit-transition: bottom 0.5s;
  transition: bottom 0.5s;
}
#wc-whatsapp-container.wc-whatsapp-container-show {
  bottom: 15px;
  -webkit-transition: bottom 0.5s;
  transition: bottom 0.5s;
}
#wc-whatsapp-container .panel-body {
  padding: 0;
}
@media only screen and (min-width: 768px) {
  .dropdown.open > .dropdown-menu li a {
    color: #fff;
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    text-overflow: ellipsis;
    overflow: hidden;
  }
  .header-fix .dropdown.open > .dropdown-menu {
    top: 70px !important;
  }
  .dropdown.open > .dropdown-menu {
    border-top: 2px;
    border-top-color: #5eff00;
    border-top-style: solid;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    display: grid;
    grid-template-columns: auto auto auto;
    grid-template-rows: auto auto auto auto auto auto auto auto;
    grid-auto-flow: column;
    background-color: #1a242f;
    min-width: 300px !important;
    max-width: 900px !important;
    max-height: 420px !important;
    margin-left: auto;
    margin-right: auto;
    position: fixed !important;
    left: 0 !important;
    right: 0 !important;
    top: 95px !important;
  }
}