.elementor-kit-9{--e-global-color-primary:#6EC1E4;--e-global-color-secondary:#54595F;--e-global-color-text:#7A7A7A;--e-global-color-accent:#61CE70;--e-global-typography-primary-font-family:"Roboto";--e-global-typography-primary-font-weight:600;--e-global-typography-secondary-font-family:"Roboto Slab";--e-global-typography-secondary-font-weight:400;--e-global-typography-text-font-family:"Roboto";--e-global-typography-text-font-weight:400;--e-global-typography-accent-font-family:"Roboto";--e-global-typography-accent-font-weight:500;}.elementor-section.elementor-section-boxed > .elementor-container{max-width:1140px;}.e-con{--container-max-width:1140px;}.elementor-widget:not(:last-child){margin-block-end:20px;}.elementor-element{--widgets-spacing:20px 20px;--widgets-spacing-row:20px;--widgets-spacing-column:20px;}{}h1.entry-title{display:var(--page-title-display);}.elementor-kit-9 e-page-transition{background-color:#FFBC7D;}@media(max-width:1024px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:1024px;}.e-con{--container-max-width:1024px;}}@media(max-width:767px){.elementor-section.elementor-section-boxed > .elementor-container{max-width:767px;}.e-con{--container-max-width:767px;}}/* Start custom CSS *//* General animation styles */
.goyang-1 img {
    animation: goyang1 7s linear infinite;
}

.goyang-2 img {
    animation: goyang1 5s linear infinite;
}

.goyang-3 img {
    animation: goyang1 3s linear infinite;
}

.goyang-4 img {
    animation: goyang4 5s linear infinite;
}

.zoom-1 {
    transform: scale(1);
    -webkit-transform: scale(1);
    animation: zoom 3s infinite;
    -webkit-animation: zoom 3s infinite;
}

.zoom-2 img {
    transform: scale(1);
    -webkit-transform: scale(1);
    animation: zoom 2s infinite;
    -webkit-animation: zoom 2s infinite;
}

.naik-turun {
    animation: naikturun 2s linear infinite;
    -webkit-animation: naikturun 2s linear infinite;
}

/* Keyframes */
@-webkit-keyframes goyang1 {
    0% {
        -webkit-transform: rotate(0deg) scale(1);
        transform: rotate(0deg) scale(1);
    }
    50% {
        -webkit-transform: rotate(6deg) scale(1.18);
        transform: rotate(6deg) scale(1.18);
    }
    100% {
        -webkit-transform: rotate(0deg) scale(1);
        transform: rotate(0deg) scale(1);
    }
}

@keyframes goyang1 {
    0% {
        transform: rotate(0deg) scale(1);
    }
    50% {
        transform: rotate(6deg) scale(1.18);
    }
    100% {
        transform: rotate(0deg) scale(1);
    }
}

@-webkit-keyframes goyang4 {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    25% {
        -webkit-transform: rotate(-4deg);
        transform: rotate(-4deg);
    }
    75% {
        -webkit-transform: rotate(4deg);
        transform: rotate(4deg);
    }
    100% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
}

@keyframes goyang4 {
    0% {
        transform: rotate(0deg);
    }
    25% {
        transform: rotate(-4deg);
    }
    75% {
        transform: rotate(4deg);
    }
    100% {
        transform: rotate(0deg);
    }
}

@-webkit-keyframes zoom {
    0% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95);
    }
    60% {
        -webkit-transform: scale(1);
        transform: scale(1);
    }
    100% {
        -webkit-transform: scale(0.95);
        transform: scale(0.95);
    }
}

@keyframes zoom {
    0% {
        transform: scale(0.95);
    }
    60% {
        transform: scale(1);
    }
    100% {
        transform: scale(0.95);
    }
}

@-webkit-keyframes naikturun {
    0% {
        -webkit-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
    }
    50% {
        -webkit-transform: translate(0px, -10px);
        transform: translate(0px, -10px);
    }
    100% {
        -webkit-transform: translate(0px, 0px);
        transform: translate(0px, 0px);
    }
}

@keyframes naikturun {
    0% {
        transform: translate(0px, 0px);
    }
    50% {
        transform: translate(0px, -10px);
    }
    100% {
        transform: translate(0px, 0px);
    }
}

/* Sadam animations */
.sadam {
    animation: Flhdr 3s infinite ease-in-out alternate;
    -webkit-animation: Flhdr 3s infinite ease-in-out alternate;
    transform-origin: bottom;
    -webkit-transform-origin: bottom;
}

@-webkit-keyframes Flhdr {
    from {
        -webkit-transform: rotate(5deg) scale(1);
        transform: rotate(5deg) scale(1);
    }
    to {
        -webkit-transform: rotate(-5deg) scale(1.05);
        transform: rotate(-5deg) scale(1.05);
    }
}

@keyframes Flhdr {
    from {
        transform: rotate(5deg) scale(1);
    }
    to {
        transform: rotate(-5deg) scale(1.05);
    }
}

.sadam1 {
    animation: Flhdr1 2s infinite ease-in-out alternate;
    -webkit-animation: Flhdr1 2s infinite ease-in-out alternate;
    transform-origin: bottom;
    -webkit-transform-origin: bottom;
}

@-webkit-keyframes Flhdr1 {
    from {
        -webkit-transform: rotate(5deg) scale(1);
        transform: rotate(5deg) scale(1);
    }
    to {
        -webkit-transform: rotate(-5deg) scale(1.05);
        transform: rotate(-5deg) scale(1.05);
    }
}

@keyframes Flhdr1 {
    from {
        transform: rotate(5deg) scale(1);
    }
    to {
        transform: rotate(-5deg) scale(1.05);
    }
}

.sadam2 {
    animation: Flhdr2 4s infinite ease-in-out alternate;
    -webkit-animation: Flhdr2 4s infinite ease-in-out alternate;
    transform-origin: bottom;
    -webkit-transform-origin: bottom;
}

@-webkit-keyframes Flhdr2 {
    from {
        -webkit-transform: rotate(5deg) scale(1);
        transform: rotate(5deg) scale(1);
    }
    to {
        -webkit-transform: rotate(-5deg) scale(1.05);
        transform: rotate(-5deg) scale(1.05);
    }
}

@keyframes Flhdr2 {
    from {
        transform: rotate(5deg) scale(1);
    }
    to {
        transform: rotate(-5deg) scale(1.05);
    }
}

.sadamwayang1 {
    animation: wayanGR 3s infinite linear alternate;
    -webkit-animation: wayanGR 3s infinite linear alternate;
    transform-origin: bottom;
    -webkit-transform-origin: bottom;
}

@-webkit-keyframes wayanGR {
    from {
        -webkit-transform: rotate(-20deg);
        transform: rotate(-20deg);
    }
    to {
        -webkit-transform: rotate(-40deg);
        transform: rotate(-40deg);
    }
}

@keyframes wayanGR {
    from {
        transform: rotate(-20deg);
    }
    to {
        transform: rotate(-40deg);
    }
}

.sadamwayang2 {
    animation: wayanGL 3s infinite linear alternate;
    -webkit-animation: wayanGL 3s infinite linear alternate;
    transform-origin: bottom;
    -webkit-transform-origin: bottom;
}

@-webkit-keyframes wayanGL {
    from {
        -webkit-transform: rotate(20deg);
        transform: rotate(20deg);
    }
    to {
        -webkit-transform: rotate(40deg);
        transform: rotate(40deg);
    }
}

@keyframes wayanGL {
    from {
        transform: rotate(20deg);
    }
    to {
        transform: rotate(40deg);
    }
}


/* Background text */
.bgtext {
    background: url(https://untukmudigital.s3.ap-southeast-1.amazonaws.com/wp-content/uploads/2024/12/20165350/8c7dd922ad4d.webp) 0 0 / contain repeat;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: black; /* Fallback untuk browser tanpa dukungan */
}

.icon-wrapper {
  position: relative; /* Membuat posisi tooltip relatif ke ikon */
  display: inline-block;
}

.icon-wrapper .tooltip {
  position: absolute;
  top: 50%;
  left: 120%; /* Tooltip muncul di kanan ikon */
  transform: translateY(-50%);
  background-color: #4f4f4f; /* Warna background tooltip */
  color: white;
  padding: 5px 10px;
  border-radius: 4px;
  font-size: 14px;
  white-space: nowrap;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.3s ease-in-out;
  z-index: 10;
}

.icon-wrapper:hover .tooltip {
  opacity: 1;
  visibility: visible;
  animation: fadeOut 3s forwards;
}

@keyframes fadeOut {
  0%, 90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    visibility: hidden;
  }
}/* End custom CSS */