/* ===== MENU FIX ===== */
* {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

headnav {
  padding: 10px 20px 10px 20px;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 1;
  background:#FFFFFF;
}
headnav .logo {
  display: flex;
  align-items: center;
}
headnav .logo img {
  height: 60px;
  width: auto;
}
headnav .contact {
  display: flex;
  align-items: center;
}
headnav .contact img {
  height: 44px;
  width: auto;
}

nav {
  font-family: "Open Sans", Arial, Helvetica, sans-serif;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0px 15px 10px -15px #111;
  z-index: 1;
  background:#1b2e3d;
  margin-bottom: 13px;
}
nav .logo {
  display: flex;
  align-items: center;
}
nav .logo img {
  height: 70px;
  width: auto;
}
nav .contact {
  display: flex;
  align-items: center;
}
nav .contact img {
  height: 70px;
  width: auto;
}
nav .logo h1 {
  font-size: 1.1rem;
  background: linear-gradient(to right, #b927fc 0%, #2c64fc 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

nav ul {
  list-style: none;
  display: contents;

}
nav ul li {
  padding: 0px 10px;
}
nav ul li a {
  display: block;
  text-decoration: none;
  color: #ffffff;
  font-size: 14px;
  padding: 12px 19.7px;
}

nav ul li a:hover {
  color: #fff;
  background: #f15922;
}

.hamburger {
  display: none;
  cursor: pointer;
}

.hamburger .line {
  width: 25px;
  height: 1px;
  background-color: #1f1f1f;
  display: block;
  margin: 7px auto;
  transition: all 0.3s ease-in-out;
}
.hamburger-active {
  transition: all 0.3s ease-in-out;
  transition-delay: 0.6s;
  transform: rotate(45deg);
}

.hamburger-active .line:nth-child(2) {
  width: 0px;
}

.hamburger-active .line:nth-child(1),
.hamburger-active .line:nth-child(3) {
  transition-delay: 0.3s;
}

.hamburger-active .line:nth-child(1) {
  transform: translateY(12px);
}

.hamburger-active .line:nth-child(3) {
  transform: translateY(-5px) rotate(90deg);
}

.v3 {
  display: none;
}

.menubar {
  position: absolute;
  top: 0;
  left: -60%;
  display: flex;
  justify-content: left;
  align-items: flex-start;
  width: 50%;
  padding: 23% 0 0 2%;
  background: rgba(255, 255, 255);
  transition: transform 0.3s ease-in-out;
  z-index: 100;
height: 100vh; /* Use vh as a fallback for browsers that do not support Custom Properties */
  height: calc(var(--vh, 1vh) * 100);
}

.menubar.active {
  transform: translateX(235px); /* Geser menu ke kanan (ke dalam layar) */
}

.menubar ul {
  padding: 0;
  list-style: none;
}
.menubar ul li {
  margin-bottom: 15px;
}

.menubar ul li a {
  text-decoration: none;
  color: #4b4b4b;
  font-size: 13px;
  font-weight: 600;
  padding: 5px 10px;
  border-radius: 5px;
}

.menubar ul li a:hover {
  background-color: #f5f5f5;
}
@media screen and (max-width: 790px) {
  .v5 {
    display: none;
  }
  .v3 {
    display: block;
  }
  .hamburger {
    display: block;
  }
  nav ul {
    display: none;
  }
  nav .logo img {
    height: 60px;
  }
  nav .contact {
    display: none;
  }
  headnav .logo img {
    height: 50px;
  }
  headnav .contact {
    display: none;
  }

}

/* ===== GALERRY FIX ===== */
.gallery-container {
    background-color: #fff;
    color: #35373a;
    border-radius: 20px;
}

.tz-gallery {
    padding: 0;
}

.tz-gallery .lightbox img {
    width: 100%;
    margin-bottom: 30px;
    transition: 0.2s ease-in-out;
    box-shadow: 0 2px 3px rgba(0,0,0,0.2);
}


.tz-gallery .lightbox img:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 15px rgba(0,0,0,0.3);
}

.tz-gallery img {
    border-radius: 4px;
}

.baguetteBox-button {
    background-color: transparent !important;
}


@media(max-width: 768px) {
    body {
        padding: 0;
    }

    .container.gallery-container {
        border-radius: 0;
    }
}

html{font-family:'Open Sans',Arial,sans-serif}

/* HEADER LOCK */
.sticky-top{position:sticky;top:0;z-index:9999;min-height:110px;background:#fff}
headnav{display:flex;align-items:center;justify-content:space-between;min-height:110px}
.logo img{width:193px;height:60px}
.contact img{width:196px;height:44px}
.nav-wrapper{min-height:48px}

/* HERO */
#slides{aspect-ratio:1110/509;max-height:409px;overflow:hidden}
.carousel-inner,.carousel-item{height:100%}
.carousel-item img{width:100%;height:100%;}

/* IMAGE GLOBAL */
img{max-width:100%;height:auto;background:#fff}
.card-img-top{min-height:149px}

/* TESTIMONI */
.testimonial{min-height:220px;display:flex;align-items:center}

/* BRAND */
.v5,.v3{min-height:180px}
.sf-menu,.sf-menu *{margin:0;padding:0;list-style:none}.sf-menu li{position:relative}.sf-menu ul{position:absolute;display:none;top:100%;left:0;z-index:99}.sf-menu>li{float:left}.sf-menu li.sfHover>ul,.sf-menu li:hover>ul{display:block}.sf-menu a{display:block;position:relative}.sf-menu ul ul{top:0;left:100%}.sf-menu{float:left;margin-bottom:1em}.sf-menu ul{box-shadow:2px 2px 6px rgba(0,0,0,.2);min-width:12em}.sf-menu a{border-left:1px solid #fff;border-top:1px solid #dfeeff;border-top:1px solid rgba(255,255,255,.5);padding:.75em 1em;text-decoration:none;zoom:1}.sf-menu a{color:#13a}.sf-menu li{background:#bdd2ff;white-space:nowrap;-webkit-transition:background .2s;transition:background .2s}.sf-menu ul li{background:#aabde6}.sf-menu ul ul li{background:#9aaedb}.sf-menu li.sfHover,.sf-menu li:hover{background:#cfdeff;-webkit-transition:none;transition:none}.sf-arrows .sf-with-ul{padding-right:2.5em}.sf-arrows .sf-with-ul:after{content:'';position:absolute;top:50%;right:1em;margin-top:-3px;height:0;width:0;border:5px solid transparent;border-top-color:#dfeeff;border-top-color:rgba(255,255,255,.5)}.sf-arrows>.sfHover>.sf-with-ul:after,.sf-arrows>li:hover>.sf-with-ul:after,.sf-arrows>li>.sf-with-ul:focus:after{border-top-color:#fff}.sf-arrows ul .sf-with-ul:after{margin-top:-5px;margin-right:-3px;border-color:transparent;border-left-color:#dfeeff;border-left-color:rgba(255,255,255,.5)}.sf-arrows ul .sfHover>.sf-with-ul:after,.sf-arrows ul li:hover>.sf-with-ul:after,.sf-arrows ul li>.sf-with-ul:focus:after{border-left-color:#fff}

#baguetteBox-overlay{display:none;opacity:0;position:fixed;overflow:hidden;top:0;left:0;width:100%;height:100%;z-index:1000000;background-color:#222;background-color:rgba(0,0,0,.8);-webkit-transition:opacity .5s ease;transition:opacity .5s ease}#baguetteBox-overlay.visible{opacity:1}#baguetteBox-overlay .full-image{display:inline-block;position:relative;width:100%;height:100%;text-align:center}#baguetteBox-overlay .full-image figure{display:inline;margin:0;height:100%}#baguetteBox-overlay .full-image img{display:inline-block;width:auto;height:auto;max-height:100%;max-width:100%;vertical-align:middle;-moz-box-shadow:0 0 8px rgba(0,0,0,.6);box-shadow:0 0 8px rgba(0,0,0,.6)}#baguetteBox-overlay .full-image figcaption{display:block;position:absolute;bottom:0;width:100%;text-align:center;line-height:1.8;white-space:normal;color:#ccc;background-color:#000;background-color:rgba(0,0,0,.6);font-family:sans-serif}#baguetteBox-overlay .full-image:before{content:"";display:inline-block;height:50%;width:1px;margin-right:-1px}#baguetteBox-slider{position:absolute;left:0;top:0;height:100%;width:100%;white-space:nowrap;-webkit-transition:left .4s ease,-webkit-transform .4s ease;transition:left .4s ease,-webkit-transform .4s ease;transition:left .4s ease,transform .4s ease;transition:left .4s ease,transform .4s ease,-webkit-transform .4s ease,-moz-transform .4s ease}#baguetteBox-slider.bounce-from-right{-webkit-animation:bounceFromRight .4s ease-out;animation:bounceFromRight .4s ease-out}#baguetteBox-slider.bounce-from-left{-webkit-animation:bounceFromLeft .4s ease-out;animation:bounceFromLeft .4s ease-out}@-webkit-keyframes bounceFromRight{0%,100%{margin-left:0}50%{margin-left:-30px}}@keyframes bounceFromRight{0%,100%{margin-left:0}50%{margin-left:-30px}}@-webkit-keyframes bounceFromLeft{0%,100%{margin-left:0}50%{margin-left:30px}}@keyframes bounceFromLeft{0%,100%{margin-left:0}50%{margin-left:30px}}.baguetteBox-button#next-button,.baguetteBox-button#previous-button{top:50%;top:calc(50% - 30px);width:44px;height:60px}.baguetteBox-button{position:absolute;cursor:pointer;outline:0;padding:0;margin:0;border:0;-moz-border-radius:15%;border-radius:15%;background-color:#323232;background-color:rgba(50,50,50,.5);color:#ddd;font:1.6em sans-serif;-webkit-transition:background-color .4s ease;transition:background-color .4s ease}.baguetteBox-button:focus,.baguetteBox-button:hover{background-color:rgba(50,50,50,.9)}.baguetteBox-button#next-button{right:2%}.baguetteBox-button#previous-button{left:2%}.baguetteBox-button#close-button{top:20px;right:2%;right:calc(2% + 6px);width:30px;height:30px}.baguetteBox-button svg{position:absolute;left:0;top:0}.baguetteBox-spinner{width:40px;height:40px;display:inline-block;position:absolute;top:50%;left:50%;margin-top:-20px;margin-left:-20px}.baguetteBox-double-bounce1,.baguetteBox-double-bounce2{width:100%;height:100%;-moz-border-radius:50%;border-radius:50%;background-color:#fff;opacity:.6;position:absolute;top:0;left:0;-webkit-animation:bounce 2s infinite ease-in-out;animation:bounce 2s infinite ease-in-out}.baguetteBox-double-bounce2{-webkit-animation-delay:-1s;animation-delay:-1s}@-webkit-keyframes bounce{0%,100%{-webkit-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes bounce{0%,100%{-webkit-transform:scale(0);-moz-transform:scale(0);transform:scale(0)}50%{-webkit-transform:scale(1);-moz-transform:scale(1);transform:scale(1)}}