* {
    margin: 0;
    padding: 0;
}

body {
    overflow-x: hidden;
    box-sizing: border-box;
    background-color: #e1eefd;
}

@font-face {
    font-family: librebaskerville;
    src: url(Libre_Baskerville/LibreBaskerville-Italic-VariableFont_wght.ttf);  
}

@font-face {
    font-family: montserrat_light;
    src: url(Montserrat/static/Montserrat-Light.ttf);  
}

@font-face {
    font-family: montserrat_medium;
    src: url(Montserrat/static/Montserrat-Medium.ttf);  
}

@font-face {
    font-family: montserrat_semibold;
    src: url(Montserrat/static/Montserrat-SemiBold.ttf);  
}

@font-face {
    font-family: montserrat_bold;
    src: url(Montserrat/static/Montserrat-Bold.ttf);  
}

@font-face {
    font-family: leaguespartan_bold;
    src: url(League_Spartan/static/LeagueSpartan-Bold.ttf);  
}

.loader-wrap {
    position: fixed;
    z-index: 1002;
    height: 100vh;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    background-color: #007bff;
}

/* TOP BAR */
.top-bar {
    position: fixed;
    top: 0;
    z-index: 1001;
    width: 100%;
    background-color: #192C54;
    color: #fff;
    padding: 10px;
}
.top-bar-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.top-bar-flex2 {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.top-bar p {
    margin-bottom: 0 !important;
}
.search-topbar {
    width: 20px;
}
.sosmed-topbar {
    display: flex;
    align-items: center;
    gap: .5rem;
    margin-top: -4px;
}
.sosmed-topbar img {
    width: 30px;
}
.tiktok {
    width: 25px;
}
.second-bar {
    position: fixed;
    top: 40px;
    z-index: 99;
    width: 100%;
    background-color: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(.2em);
    -webkit-backdrop-filter: blur(.2em);
    color: #000;
    transition: 500ms;
}
.left-topbar-brand img {
    width: 150px;
}
.right-topbar {
    display: flex;
    align-items: center;
    gap: 2rem;
}
.left-topbar {
    display: flex;
    align-items: center;
    gap: 2rem;
}   
.time-secondbar {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.adress-secondbar {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.time-secondbar p,
.adress-secondbar p {
    margin-bottom: 0 !important;
    font-size: 13px;
}
.time-secondbar img,
.adress-secondbar img {
    width: 40px;
}
.marquee {
    margin-top: 120px;
    color: #003169;
    padding: 10px 0;
    font-weight: 600;
    font-size: 32px;
    text-transform: capitalize;
}
@media (max-width: 991px) {
    .marquee {
        margin-top: 55px;
        font-size: 24px;
    }
}
.marquee__inner {
    display: flex;
    width: fit-content;
    flex: auto;
    flex-direction: row;
}
.marquee__part {
    display: flex;
    align-items: center;
    flex-shrink: 0;
}
.marquee__part p {
    margin-bottom: 0 !important;
    font-family: montserrat_bold;
}
.star {
    margin: 0 1em;
    display: flex;
    align-items: center;
}
.star img {
    width: 32px;
}
.time {
    display: flex;
    font-size: 12px;
    color: #eee;
    align-items: center;
    justify-content: flex-end;
    border-bottom: 1px solid #fff;
    border-right: 1px solid #fff;
    padding: 10px 20px;
}
.select {
    display: flex;
    color: var(--bs-light);
    align-items: center;
    gap: .5rem;
    transition: .2s;
    cursor: pointer;
}
.select a {
    text-decoration: none;
}
.caret {
    width: 0;
    height: 0;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 6px solid #fff;
    transition: .3s;
}
.caret-rotate {
    transform: rotate(180deg);
}
.menu  {
    position: absolute;
    z-index: 1000;
    top: 2rem;
    background-color: #ededed;
    width: 100%;
    text-align: center;
    border-radius: 5px;
    opacity: 0;
    visibility: hidden;
    transition: .2s;
}
.menu li {
    list-style: none;
    padding: 10px;
    margin-right: 0;
}
.menu li a {
    text-decoration: none;
    color: black;
}
.menu-open {
    display: block;
    opacity: 1;
    visibility: visible;
}
.select img {
    width: 30px;
}
.time-block h6,
.adress-secondbar h6 {
    font-family: montserrat_semibold;
    font-weight: 700;
    margin-bottom: 0 !important;
}
.time-blok p {
    font-family: montserrat_medium;
}
.selected {
    font-family: montserrat_semibold;
}
.selected2 {
    font-family: montserrat_semibold;
}
/* END TOP BAR */









/* NAVBAR */
.logo-bexsea img {
    width: 120px;
    margin-right: 1rem;
}
.header-navbar-contact {
    position: fixed;
    top: 60px;
    z-index: 1000;
    width: 100%;
    background-color: #ffffff;
}
.navbar__menu {
    display: flex;
    justify-content: space-between;
    align-items: center;
    /* height: 4.5rem; */
}
.navbar__menu ul {
    display: flex;
    align-items: center;
    list-style: none;
    margin-bottom: 0 !important;
    padding-left: 0 !important;
}
.navbar__menu ul li {
    list-style: none;
}
.navbar__menu a,
.navbar__menu p {
    text-decoration: none;
    transition: 0.3s;
    text-transform: capitalize;
    color: #003169;
    font-family: montserrat_semibold;
    width: fit-content;
}
.navbar__menu ul li p {
    font-family: montserrat_semibold;
}
.navbar__menu .nav__list .nav__link:hover {
    border-bottom: 2px solid #00a9ee;
}
.dropdown__menu- p {
    margin-bottom: 0 !important;
    line-height: 25px;
    font-family: montserrat_semibold;
    font-size: 16px;
    cursor: pointer;
    text-transform: capitalize;
}
.dropdown__menu- .text-dropdown-menu:hover {
    border-bottom: 2px solid #00a9ee;
}
.text-dropdown-menu {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .5rem;
    width: fit-content;
    margin: auto;
}
.text-dropdown-menu .arr-down {
    border-color: #003169;
}
.navbar__menu li {
    position: relative;
    margin-right: 30px;
}
.navbar-brand img {
    width: 150px;
}
.contact a {
    padding: 10px 40px;
    text-decoration: none;
    background-color: #00a9ee;
    border-radius: 10px;
    color: #fff;
    font-family: montserrat_bold;
}
.contact a:hover {
    color: #fff;
    background-color: #9747FF;
}
.title-megamenu-item h4 {
    margin-bottom: 20px;
    color: #003169;
}
.megamenu {
    position: absolute;
    width: fit-content;
    padding: 20px 30px;
    top: 2rem;
    left: 0;
    display: flex;
    gap: 2rem;
    text-align: left;
    background-color: #fff;
    border-radius: 15px;
    box-shadow: 0 23px 23px -21px rgba(0, 0, 0, 0.25);
    visibility: hidden;
    opacity: 0;
    transition: all 300ms ease-in-out;
    z-index: 99;
}
.megamenu .content {
    padding: 1rem 1rem;
    white-space: nowrap;
    display: block;
}
.content li {
    margin-right: 0;
}
.content .title-megamenu-item h4 {
    font-family: montserrat_semibold;
    font-weight: 700;
}
.content .megamenu__item .megamenu__link a {
    font-family: montserrat_medium;
    color: #003169;
    border-bottom: 0;
}
.content .megamenu__item .megamenu__link a:hover {
    color: #00A9EE;  
}
.header__megamenu {
    font-size: 17px;
    font-family: montserrat_semibold;
    margin-bottom: 16px;
}
.megamenu-item {
    display: flex;
    justify-content: center;
    align-items: center;
}
.megamenu__link {
    margin-bottom: 10px;
    display: flex;
    align-items: center;
    gap: .5rem;
}
.megamenu__link a {
    font-size: 15px;
    font-family: mySecondFont;
    color: #000;
}
.megamenu__link a:hover {
    color: #000;
}
.megamenu__link img {
    width: 30px;
}
.dropdown__menu- {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.dropdown__menu-:hover .megamenu {
    visibility: visible;
    opacity: 1;
}
.toggle__menu ,
.close__menu {
  display: none;
}
.navbar-responsive {
    display: none;
}
.contact {
    position: absolute;
    right: 15.8vw;
}
.sosmed-topbar2 {
    display: none;
}
.dropdown- {
    display: none;
}
/* END NAVBAR */






/* BANNER HOMEPAGE */
.hero-wrap {
    height: 100vh;
    position: relative;
    width: 100%;
    padding: 15rem 0;
}
.hero-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: -2;
    object-fit: cover;
}
.hero-wrap2 {
    height: 80vh;
    position: relative;
    width: 100%;
    padding-top: 15rem;
}
.hero-image2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 80vh;
    z-index: -2;
    object-fit: cover;;
}
.hero-image2 img {
    width: 100%;
    height: 80vh;
    object-fit: cover;
}
.hero-image3 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 537px;
    z-index: -2;
    object-fit: cover;
}
.hero-image3 img {
    width: 100%;
    height: 537px;
    object-fit: cover;
}
.hero-image video {
    width: 100%;
    height: 100vh;
    object-fit: cover;
}
.hero-image img {
    width: 100%;
    height: 100vh;
    object-fit: cover;
}
.descBanner {
    padding-top: 13rem;
}
.descBanner2 {
    padding-top: 11rem;
}
.banner-title {
    text-align: center;
    font-size: 50px;
    color: #fff;
    font-family: leaguespartan_bold;
}
.banner-description {
    text-align: center;
    font-size: 20px;
    color: #fff;
    font-family: montserrat_medium;
} 
/* END BANNER HOMPAGE */




/* OCEANARIUMTOURS */
.oceanariumtours {
    position: relative;
    width: 100%;
}
.shortcut-btn {
    width: fit-content;
    position: absolute;
    bottom: 10em;
    right: 2rem;
    z-index: 99;
}
@media (max-width: 1024px) {
    .shortcut-btn {
        bottom: -5rem;
        right: 50%;
        transform: translateX(50%);
    }
}
.btn-rounded {
    display: flex;
    flex-direction: column;
    justify-content: end;
    align-items: flex-end;
    gap: 0;
}
@media (max-width: 1024px) {
    .btn-rounded {
        display: flex;
        flex-direction: row;
        justify-content: center;
        align-items: center;
    }
}
.btn-rounded a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: fit-content;
    overflow: hidden;
    transition: border-radius .5s ease, padding .5s ease, background-color .5s ease;
    text-decoration: none;
    font-family: montserrat_bold;
    color: #003169;
    padding: 8px;
}
.btn-rounded a img {
    width: 60px;
    transition: width .5s ease;
}
.btn-rounded a p {
    margin-bottom: -5px;
    max-width: 0;
    overflow: hidden;
    white-space: nowrap;
    transition: max-width .5s ease, opacity .2s ease;
    font-family: leaguespartan_bold;
}
.btn-rounded a:hover p {
    max-width: 180px;
    margin-left: 10px;
}
.btn-rounded a:hover {
    border-radius: 50px;
    background-color: #fff;
    padding: 8px 16px;
}
.btn-rounded a:hover img {
    width: 30px;
}
.head-title-Oceanariumtours h2 {
    margin-bottom: 20px;
    color: #fff;
}
.image-banner-owl-oceanariumtours {
    position: relative;
}
.image-banner-owl-oceanariumtours img {
    height: 85dvh;
    object-fit: cover;
}
@media (max-width: 1200px) {
    .image-banner-owl-oceanariumtours img {
        height: 90dvh;
    }
}
@media (orientation: landscape) {
    .image-banner-owl-oceanariumtours img {
        min-height: 90dvh;
    }
}
.oceanarium-tours-image {
    position: relative;
}
.overlay-oceanariumtours {
    background-color: rgba(225, 238, 253, 0.8);
    position: absolute;
    bottom: 10rem;
    left: 0;
    padding: 40px;
    width: 831px;
    text-align: right;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
}
.overlay-oceanariumtours .top-lit-title h6 {
    color: #eff30a;
}
.overlay-oceanariumtours .desc-overlay-oceanariumtours h4 {
    color: #003169;
    font-size: 40px;
    font-family: leaguespartan_bold;
}
.overlay-oceanariumtours .desc-overlay-oceanariumtours p {
    color: #003169;
    font-size: 20px;
    font-family: montserrat_medium;
}
@media (max-width: 1440px) {

    .overlay-oceanariumtours .desc-overlay-oceanariumtours h4 {
        font-size: 32px;
    }
    .overlay-oceanariumtours .desc-overlay-oceanariumtours p {
        font-size: 15px;
    }
}
@media (max-width: 1200px) {
    .overlay-oceanariumtours .desc-overlay-oceanariumtours h4 {
        font-size: 22px;
    }
    .overlay-oceanariumtours .desc-overlay-oceanariumtours p {
        font-size: 13px;
    }
}
.overlay-oceanariumtours .btn-overlay-oceanariumtours {
    background-color: #00a9ee;
    width: fit-content; 
    padding: 7px 20px;
    border-radius: 10px;;
    transition: 500ms;
    margin-left: auto;
    margin-right: 8em;
}
.overlay-oceanariumtours .btn-overlay-oceanariumtours:hover {
    background-color: #9747FF;
}
.overlay-oceanariumtours .btn-overlay-oceanariumtours a {
    text-decoration: none;
    color: #fff;
}
.owl-oceanarium-tours .owl-item .image-chevron-oceanariumtours {
    width: 7px;
}
.btn-overlay-oceanariumtours {
    display: flex;
    align-items: center;
    gap: .5rem;
}

.owl-oceanarium-tours .owl-nav {
    position: absolute;
    z-index: 2;
    display: flex;
    justify-content: space-between;
    bottom: 11.6em;
    left: 43em;
}
.owl-oceanarium-tours .owl-nav button.owl-next {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1em;
    height: 1em;
    font-size: 50px;
    border-radius: 50%;
}
.owl-oceanarium-tours .owl-nav button.owl-next span {
    margin-bottom: 16px;
    margin-left: 2px;
    color: #003169;
}
.owl-oceanarium-tours .owl-nav button.owl-prev {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1em;
    height: 1em;
    font-size: 50px;
    border-radius: 50%;
}
.owl-oceanarium-tours .owl-nav button.owl-prev span {
    margin-bottom: 16px;
    margin-right: 2px;
    color: #003169;
}
@media (max-width: 1200px) {
    .overlay-oceanariumtours {
        width: 550px;
        padding: 20px;
        left: 0;
        bottom: 10rem;
    }
    .overlay-oceanariumtours .btn-overlay-oceanariumtours {
        margin-right: 6em;
    }
    .owl-oceanarium-tours .owl-nav {
        bottom: 10.7em;
        left: 28rem;
    }
    .owl-oceanarium-tours .owl-nav button.owl-prev,
    .owl-oceanarium-tours .owl-nav button.owl-next {
        font-size: 40px;
    }
}
@media (max-width: 768px) {
    .overlay-oceanariumtours {
        width: 80%;
        padding: 20px;
        left: 0;
        bottom: 7rem;
    }
    .overlay-oceanariumtours .btn-overlay-oceanariumtours {
        margin-right: 15vw;
    }
    .owl-oceanarium-tours .owl-nav {
        bottom: 7.6em;
        left: 65vw;
    }
    .owl-oceanarium-tours .owl-nav button.owl-prev,
    .owl-oceanarium-tours .owl-nav button.owl-next {
        font-size: 40px;
    }
}
@media (max-width: 576px) {
    .overlay-oceanariumtours .btn-overlay-oceanariumtours {
        margin-right: 20vw;
    }
    .owl-oceanarium-tours .owl-nav {
        left: 57vw;
    }
}
@media (max-width: 356px) {
    .owl-oceanarium-tours .owl-nav {
        bottom: 7.5em;
    }
    .btn-overlay-oceanariumtours {
        font-size: 12px;
    }
}
/* END OCEANARIUMTOURS */



/* ADDITIONAL EXPERIENCE */
.additional-experience {
    position: relative;
    padding: 10rem 0 15rem 0;
    display: flex;
    justify-content: center;
    gap: 2rem;
}
.additional-experience .left-grid {
    width: 370px;
}
@media (max-width: 1400px) {
    .additional-experience .left-grid {
        width: 300px;
    }
}
@media (max-width: 1200px) {
    .additional-experience .left-grid {
        width: 200px;
    }
}
.title-additional-exp h1 {
    font-family: librebaskerville;
    font-size: 52px;
    color: #003169;
    cursor: pointer;
}
.desc-additional-exp {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
}
.desc-additional-exp p {
    margin-bottom: 0 !important;
}
@media (max-width: 1400px) {
    .title-additional-exp h1 {
        font-size: 40px;
    }
    .desc-additional-exp {
        font-size: 18px;
    }
}
@media (max-width: 1200px) {
    .title-additional-exp h1 {
        font-size: 28px;
    }
    .desc-additional-exp {
        font-size: 15px;
    }
}
.arrow-right-additional-exp {
    transition: transform 300ms ease;
}
.title-additional-exp h1:hover .arrow-right-additional-exp {
    transform: translateX(10px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
.title-additional-exp h1:hover {
    color: #00A9EE;
}
.additional-experience .right-grid {
    flex: 1;
    min-width: 0;
}
.box-additional-exp {
    position: relative;
    width: 100%;
}
.box-additional-exp img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 12px;
}
.box-additional-exp .img-wave-additional-exp {
    width: 100%;
    height: auto;
    border-radius: 0;
    transition: bottom 320ms ease;
}
.image-box-additional-exp {
    position: relative;
    overflow: hidden;
}
.desc-box-additional-exp {
    position: absolute;
    max-height: 130px;
    bottom: 0;     
    width: 100%;
    overflow: hidden;
    transition: max-height 350ms ease, padding 350ms ease;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}
@media (max-width: 1399px) {
    .desc-box-additional-exp {
        max-height: 120px;
    }
}
@media (max-width: 1199px) {
    .desc-box-additional-exp {
        max-height: 100px;
    }
}
@media (max-width: 576px) {
    .desc-box-additional-exp {
        max-height: 90px;
    }
}
@media (max-width: 471px) {
    .desc-box-additional-exp {
        max-height: 85px;
    }
}
@media (max-width: 460px) {
    .desc-box-additional-exp {
        max-height: 75px;
    }
}
@media (max-width: 428px) {
    .desc-box-additional-exp {
        max-height: 120px;
    }
}
@media (max-width: 390px) {
    .desc-box-additional-exp {
        max-height: 100px;
    }
}
@media (max-width: 360px) {
    .desc-box-additional-exp {
        max-height: 90px;
    }
}
.desc-box-additional-exp .box-white {
    background-color: #fff;
    padding: 0 10px 100px 10px;
}
.desc-box-additional-exp h4 {
    font-family: leaguespartan_bold;
    font-size: 28px;
    color: #003169;
}
@media (max-width: 1400px) {
    .desc-box-additional-exp h4 {
        font-size: 25px;
    }
}
@media (max-width: 1200px) {
    .desc-box-additional-exp h4 {
        font-size: 22px;
    }
}
@media (max-width: 992px) {
    .desc-box-additional-exp h4 {
        font-size: 20px;
    }
}
@media (max-width: 507px) {
    .desc-box-additional-exp h4 {
        font-size: 18px;
    }
}
@media (max-width: 471px) {
    .desc-box-additional-exp h4 {
        font-size: 15px;
    }
}
@media (max-width: 428px) {
    .desc-box-additional-exp h4 {
        font-size: 25px;
    }
}
@media (max-width: 390px) {
    .desc-box-additional-exp h4 {
        font-size: 20px;
    }
}
.desc-box-additional-exp p {
    font-family: montserrat_medium;
    color: #003169;
}
.box-additional-exp:hover .desc-box-additional-exp {
    max-height: 250px;
}
.box-additional-exp:hover .img-wave-additional-exp {
    bottom: 100px;
}
/* END ADDITIONAL EXPERIENCE */



/* SHOW */
.showocean {
    padding-bottom: 20rem;
}
.flex-show {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
}
.box-title-show-ocean h1 {
    text-align: right;
    font-size: 58px;
    color: #003169;
    font-family: librebaskerville;
}
@media (max-width: 1002px) {
    .box-title-show-ocean h1 {
        font-size: 40px;
    }
}
.relative-show,
.relative-show2 {
    position: relative;
    padding: 8vw;
    background-color: #F4F9FF;
}
.bg-show,
.bg-show2 {
    position: absolute;
    top: 50%;
    left: 50%;
    z-index: 1;
    width: 45vw;
    transform: translate(-50%, -50%);
}
.splide__slide img {
    width: 100%;
    height: auto;
    object-fit: cover;
}
.btn-show-schedule {
    display: flex;
    justify-content: start;
    margin-top: 2rem;
}
.btn-show-schedule a {
    background-color: #00A9EE;
    width: fit-content;
    padding: 7px 20px;
    border-radius: 10px;
    transition: 500ms;
    text-decoration: none;
    color: #fff;
    font-family: montserrat_semibold;
    font-size: 16px;
}
.btn-show-schedule a:hover {
    background-color: #fff;
    color: #00A9EE;
}
.arrow-right-btn-show-schedule {
    transition: transform 300ms ease;
    margin-bottom: 3px;
    margin-left: 3px;
}
.btn-show-schedule a:hover .arrow-right-btn-show-schedule {
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
.show-splide .splide__arrow,
.show-splide2 .splide__arrow {
    background: #fff;
    border: 0;
    opacity: 1;
    width: 42px;
    height: 42px;
    top: 100%;
    transform: translateY(-50%);
}
.show-splide .splide__arrow--prev,
.show-splide2 .splide__arrow--prev {
    left: -2vw;
}
.show-splide .splide__arrow--next,
.show-splide2 .splide__arrow--next {
    right: -2vw;
}
.show-splide .splide__arrow svg,
.show-splide2 .splide__arrow svg {
    fill: #003169;
    width: 20px;
    stroke: #003169;
    stroke-width: 1.8px;
}
/* END SHOW */



/* EVENT */
.event {
    position: relative;
    padding-bottom: 10rem;
    display: flex;
    gap: 5rem;
    justify-content: center;
    width: 100%;
}   
@media (max-width: 992px) {
    .event {
        flex-direction: column;
        align-items: start;
        gap: 0;
    }
}
.title-event h1 {
    font-family: librebaskerville;
    font-size: 58px;
    color: #003169;
    cursor: pointer;
}
.desc-event p {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
}
.event .right-grid {
    display: flex;
    gap: .5rem;
}
.box-event {
    position: relative;
    max-width: 250px;
    height: auto;
    cursor: pointer;
}
.image-box-event img {
    width: 100%;
    height: 100%;
    border-radius: 12px;
}
.desc-box-event {
    position: absolute;
    width: 100%;
    height: 100%;
    bottom: 0;
    left: 0;
    text-align: center;
    background-color: rgba(255, 255, 255, 0.9);
    border-radius: 12px;
    padding: 20px;
    opacity: 0;
    transition: opacity 0.3s ease;
    overflow-y: auto;
}
.desc-box-event h4 {
    font-family: leaguespartan_bold;
    font-size: 22px;
    color: #003169;
}
.desc-box-event p {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 15px;
}
.box-event:hover .desc-box-event {
    opacity: 1;
}
.cta-ig-tiktok-event {
    margin-top : 2rem;
    color: #003169;
    font-family: montserrat_medium;
    font-size: 20px;
}
.cta-ig-tiktok-event a {
    color: #003169;
}
/* END EVENT */



/* REVIEW INFLUENCER */
.review-influencer {
    position: relative;
    padding-bottom: 25rem;
}
.title-review-influencer  h1 {
    font-family: librebaskerville;
    font-size: 58px;
    text-align: center;
    color: #003169;
    margin-bottom: 30px;
}
.review-influencer .container {
    padding-top: 10rem;
}
.background-white-review-influencer {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 600px;
    height: 600px;
    background-color: #fff;
    border-radius: 100%;
    z-index: -1;
}
.image-activies {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 1rem;
}
.name-activies {
    color: #fff;
    margin-bottom: 0 !important;
    color: #003169;
    font-family: montserrat_bold;
}
.image-activies img {
    object-fit: cover;
    width: 65px;
    height: 65px;
    border-radius: 50%;
}
.review-influencer-splide .splide__slide {
    text-align: center;
}
.activies-said {
    margin: 0 auto 5rem auto;
    width: 50%;
    color: #003169;
    font-size: 25px;
    font-family: montserrat_medium;
}
@media (max-width: 1280px) {
    .activies-said {
        font-size: 20px;
        width: 45%;
    }
}
@media (max-width: 767px) {
    .review-influencer .container {
        padding-top: 5rem;
    }       
    .activies-said {
        font-size: 20px;
        width: 100%;
    }
    .background-white-review-influencer {
        position: absolute;
        width: 400px;
        height: 400px;
        top: 40%;
        left: 50%;
        transform: translate(-50%, -50%);
    }
}
.review-influencer-splide .splide__arrow {
    background-color: transparent;
    opacity: 1;
}
.review-influencer-splide .splide__arrow svg {
    fill: #003169;
}
.review-influencer-splide .splide__arrow--next {
    right: 30rem;
}
.review-influencer-splide .splide__arrow--prev {
    left: 30rem;
}
.review-influencer-splide .splide__arrow {
    top: 90%;
}
.image-absolute-review-influencer {
    width: 300px;
    height: 400px;
    object-fit: cover;
    position: absolute;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    right: 0;
}
.image-absolute-review-influencer3 {
    position: absolute;
    width: 300px;
    height: 400px;
    object-fit: cover;
    border-radius: 20px;
    right: 8rem;
    top: 30%;
}
.image-absolute-review-influencer2 {
    width: 300px;
    height: 400px;
    object-fit: cover;
    position: absolute;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
    left: 0;
}
.image-absolute-review-influencer4 {
    position: absolute;
    width: 300px;
    height: 400px;
    object-fit: cover;
    border-radius: 20px;
    left: 8rem;
    top: 30%;
}
.fish {
    position: absolute;
    right: 12%;
    top: -9%;
}
.fish2 {
    position: absolute;
    left: 19%;
    top: 20%;
}
.fish3 {
    position: absolute;
    right: 30%;
    bottom: 25%;
}
.frog {
    position: absolute;
    left: 100px;
    top: -200px;
}
@media (max-width: 1440px) {
    .frog {
        top: -150px;
        width: 150px;
    }
}
@media (max-width: 1024px) {
    .frog {
        display: none;
    }
}
/* END REVIEW INFLUENCER */




/* TENANT */
.Tenantus {
    position: relative;
    padding-bottom: 10rem;
}
.title-tenantus h1 {
    position: relative;
    z-index: 1;
    color: #003169;
    font-size: 58px;
    text-align: center;
    margin-bottom: 50px;
    font-family: librebaskerville;
}
#main-carousel .splide__slide {
    text-align: center;
    color: #fff;
}
.title-main-carousel h1 {
    font-family: leaguespartan_bold;
    color: #003169;
}
#main-carousel .splide__slide p {
    margin: 1rem auto;
    font-family: montserrat_medium;
    color: #003169;
    width: 50%;
}
#thumbnail-carousel {
    position: relative;
    width: 60.3%;
    margin: auto;
    z-index: 7;
}
#thumbnail-carousel .splide__list {
    height: 280px;
    display: flex;
    align-items: center;
}
#thumbnail-carousel .splide__slide img {
    width: 200px;
    height: 200px;
    border-radius: 50%;
    object-fit: cover;
    margin-left: 20px;
}
#thumbnail-carousel .splide__slide {
    opacity: 0.6;
    transition: all 150ms;
    height: auto;
}
  
#thumbnail-carousel .splide__slide.is-active {
    opacity: 1;
    transform: scale(1.2);
}
#thumbnail-carousel .splide__track--nav>.splide__list>.splide__slide.is-active {
    border: none;
}
#thumbnail-carousel .splide__arrow--prev,
#thumbnail-carousel .splide__arrow--next {
    display: none;
}
#main-carousel .splide__arrow--next {
    z-index: 7;
    right: 20rem;
}
#main-carousel .splide__arrow--prev {
    z-index: 7;
    left: 20rem;
}
#main-carousel .splide__arrow {
    top: -70%;
}
#main-carousel .splide__arrow {
    background-color: transparent;
    opacity: 1;
}
#main-carousel .splide__arrow svg {
    fill: #003169;
}
.grass35 {
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    transform: rotate(180deg);
    z-index: -1;
}
.location-tenants p {
    font-family: montserrat_medium;
    text-align: center;
    color: #003169;
}
.btn-find-out-more-tenants {
    display: flex;
    justify-content: center;
}
.btn-find-out-more-tenants a {
    text-decoration: none;
    padding: 10px 30px;
    background-color: #00A9EE;
    color: #fff;
    transition: all 300ms ease-in-out;
    border-radius: 10px;
    font-family: montserrat_semibold;
}
.btn-find-out-more-tenants:hover a {
    color: #00A9EE;
    background-color: #fff;
}
.btn-find-out-more-tenants:hover .arrow-btn-find-out-more-tenants {
    transition: transform 300ms ease;
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
/* END TENANT */



/* INFORMATION */
.new-information {
    position: relative;
    padding: 0 7rem 10rem 7rem;
}
.box-new-information {
    background-color: #F4F9FF;
    padding: 7rem 20px;
}
.title-new-information-mobile h1 {
    font-family: librebaskerville;
    font-size: 42px;
    color: #003169;
    cursor: pointer;
    width: 300px;
    display: none
}
.desc-new-information-mobile p {
    font-size: 14px;
    font-family: montserrat_medium;
    color: #003169;
    width: 200px;
    text-align: justify;
    margin-left: 10rem;
    margin-top: -2.9rem;
    display: none
}
@media (max-width: 1200px) {
    .box-new-information {
        padding: 40px 20px;
    }
}
@media (max-width: 767px) {
    .new-information {
        padding: 0 2rem 10rem 2rem;
    }
    .box-new-information {
        background-color: #F4F9FF;
        padding: 20px;
    }
}
@media (max-width: 390px) {
    .desc-new-information-mobile p {
        width: 150px;
    }
}
.new-information .left-grid {
    text-align: right;
}
@media (max-width: 1200px) {
    .title-new-information-mobile h1,
    .desc-new-information-mobile p {
        display: block
    }
    .new-information .left-grid {
        display: none;
    }
}
.left-grid .title-new-information h1 {
    font-family: librebaskerville;
    font-size: 58px;
    color: #003169;
    cursor: pointer;
}
.left-grid .desc-new-information p {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
}
.cta-news .latest-news {
    margin-bottom: 1rem;
}
.cta-news .latest-news a {
    font-family: montserrat_semibold;
    font-size: 20px;
    background-color: #00A9EE;
    padding: 7px 20px;
    border-radius: 10px;
    color: #fff;
    text-decoration: none;
}
.cta-news .latest-news a:hover {
    background-color: #fff;
    color: #00A9EE;
}
.cta-news .latest-news a:hover .arrow-right-latest-news {
    transition: transform 300ms ease;
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
.cta-news .conversation-stories a {
    font-family: montserrat_semibold;
    font-size: 20px;
    background-color: #00A9EE;
    padding: 7px 20px;
    border-radius: 10px;
    color: #fff;
    text-decoration: none;
    transition: all 300ms ease-in-out;
}
.cta-news .conversation-stories a:hover {
    background-color: #fff;
    color: #00A9EE;
}
.cta-news .conversation-stories a:hover .arrow-right-conversation-stories {
    transition: transform 300ms ease;
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
@media (max-width: 1400px) {
    .left-grid .title-new-information h1 {
        font-size: 40px;
    }
    .left-grid .desc-new-information p {
        font-size: 18px;
    }
    .cta-news .latest-news a {
        font-size: 16px;
    }
    .cta-news .conversation-stories a {
        font-size: 16px;
    }
}
.right-grid {
    height: auto;
}
.right-grid a {
    text-decoration: none;
}
.right-grid .title-news h1 {
    font-family: leaguespartan_bold;
    font-size: 38px;
    color: #003169;
}
.right-grid .desc-news p {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 20px;
}
@media (max-width: 1440px) {
    .right-grid .title-news h1 {
        font-size: 28px;
    }
    .right-grid .desc-news p {
        font-size: 15px;
    }
}
@media (max-width: 1200px) {
    .right-grid .title-news h1 {
        margin-top: 20px;
    }
}
@media (max-width: 767px) {
    .right-grid .title-news h1 {
        margin-top: 20px;
        font-size: 20px;
    }
    .right-grid .desc-news p {
        font-size: 15px;
    }
}
.right-grid .date-news p {
    color: #003169;
}
.right-grid .read-more-news a {
    text-decoration: none;
    color: #fff;
    font-family: montserrat_semibold;
    background-color: #00A9EE;
    padding: 7px 20px;
    border-radius: 10px;
    transition: all 300ms ease-in-out;
}
.right-grid .read-more-news a:hover {
    background-color: #fff;
    color: #00A9EE;
}
.right-grid .read-more-news a:hover .arrow-right-read-more-news {
    transition: transform 300ms ease;
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
.center-grid a img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 12px;
}
.snake {
    width: 400px;
    position: absolute;
    right: 0;
    top: -18rem;
    z-index: 1;
}
@media (max-width:992px) {
    .snake {
        display: none;
    }
}
.grass14 {
    width: 100%;
    top: 10%;
    position: absolute;
    left: -10%;
}
.grass15 {
    width: 100%;
    top: 10%;
    position: absolute;
    right: -15%;
}
.grass16 {
    z-index: -1;
    width: 125%;
    top: 35%;
    position: absolute;
    left: -10%;
}
.akar1 {
    top: 110%;
    left: -30%;
    width: 100%;
    height: 2000px;
    position: absolute;
    z-index: -1;
}
.akar2 {
    top: 110%;
    right: -40%;
    width: 100%;
    position: absolute;
    height: 2000px;
    z-index: -1;
}

/* END INFORMATION */




/* TICKETING */
.ticketing {
    position: relative;
    padding-bottom: 10rem;
}
.octopus-ticket {
    position: absolute;
    top: 10rem;
    left: 10rem;   
    width: 200px;
}
@media (max-width:1350px) {
    .octopus-ticket {
        left: 5rem;
        width: 150px;
    }
}
@media (max-width:1025px) {
    .octopus-ticket {
       display: none;
    }
}
.head-title-ticketing {
    position: relative;
    z-index: 2;
    text-align: center;
    margin-bottom: 50px;
    
}
.head-title-ticketing h1{
    font-size: 58px;
    font-family: librebaskerville;
    color: #003169;
}
.head-title-ticketing p {
    width: 50%;
    margin: auto;
    color: #003169;
    font-size: 20px;
}
.box-card-ticketing:nth-child(even) {
    margin-top: 3rem;
}
.card-ticketing-splide .splide__list,
.card-ticketing-splide2 .splide__list,
.card-ticketing-splide3 .splide__list {
    justify-content: center;
}
.card-ticketing-splide .splide__slide,
.card-ticketing-splide2 .splide__slide,
.card-ticketing-splide3 .splide__slide {
    max-width: 300px;
}
.card-ticketing {
    position: relative;
    width: 100%;
    height: auto;
}
.image-card-ticketing img {
    object-fit: cover;
    width: 100%;
    height: 455px;
    border-radius: 12px;
}
.desc-card-ticketing {
    padding: 20px;
}
.overlay-card-ticketing {
    position: absolute;
    width: 100%;
    bottom: 0;
    color: #fff;
}
/* .overlay-bg-card {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 12px;
    background: -moz-linear-gradient(top, rgb(0,0,0, 0) 0%,rgb(0,0,0, 0.2) 98%, rgb(0,0,0, 1) 100%);
    background: -webkit-linear-gradient(top, rgb(0,0, 0) 0%,rgb(0,0,0 0.2) 98%,rgb(0,0,0, 1) 100%);
    background: linear-gradient(to bottom, rgb(0,0,0, 0) 0%,rgb(0,0,0, 0.2) 98%,rgb(0,0,0, 1) 100%);
} */
.title-card {
    margin-bottom: 1rem;
}
.body-card-ticketing {
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px dotted #fff;
}
.body-card-ticketing p {
    margin-bottom: 0 !important;
}
.location-card-ticketing {
    display: flex;
    align-items: center;
    gap: .2rem;
}
.location-card-ticketing p {
    font-size: 12px;
}
.details {
    display: flex;
    align-items: center;
    gap: .5rem;
    text-decoration: none;
    color: #fff;
} 
.details:hover {
    color: #fff;
}
.details p {
    margin-bottom: 0 !important;
}
.details img {
    width: 20px;
} 
.link-buy-card-ticketing {
   margin-inline-start: auto ;
}
.link-buy-card-ticketing a {
    text-decoration: none;
    background-color: #99999b;
    padding: 7px 20px;
    border-radius: 20px;
    font-size: 13px;
    color: #fff;
    font-family: montserrat_bold;
}
.footer-card-ticketing {
    margin-top: 1rem;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.footer-card-ticketing p {
    font-size: 9px;
}
.details-card-ticketing {
    text-align: center;
    position: absolute;
    right: 15rem;
    top: 58%;
    transform: translateY(-50%);
}
@media (max-width: 1470px) {
    .details-card-ticketing {
        right: 5rem;
    }
}
@media (max-width: 1200px) {
    .details-card-ticketing {
        right: 20px;
    }
}
@media (max-width: 992px) {
    .details-card-ticketing {
       position: static;
       margin-top: 4rem;
    }
}
.details-card-ticketing a {
    text-decoration: none;
    padding: 10px 20px;
    background-color: #00A9EE;
    color: #fff;
    transition: all 300ms ease-in-out;
    border-radius: 10px;
    font-size: 16px;
    font-family: montserrat_semibold;
}
.details-card-ticketing a:hover {
    color: #00A9EE;
    background-color: #fff;
}
.details-card-ticketing a:hover .arrow-right-details-card-ticketing {
    transition: transform 300ms ease;
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
.fish4 {
    position: absolute;
    right: 5rem;
}
.fish5 {
    position: absolute;
    right: 19%;
    top: 20%;
}
.fish6 {
    position: absolute;
    top: -120%;
    left: 22%;
    z-index: -1;
}
.grass {
    position: absolute;
    object-fit: cover;
    width: 100%;
    bottom: -20%;
    z-index: -1;
}
.box-nav-ticketing {
    display: flex;
    width: fit-content;
    align-items: center;
    padding: 10px;
    justify-content: center;
    margin: 0 auto 2rem auto;
    border-radius: 15px;
    gap: .5rem;
    background-color: transparent;
}
@media (max-width: 360px) {
    .box-nav-ticketing {
        flex-direction: column;
    }
}
.box-nav-ticketing a {
    text-decoration: none;
    padding: 7px 50px;
    color: #003169;
    background-color: #fff;
    font-family: leaguespartan_bold;
    font-size: 20px;
    border-radius: 50px;
}
.box-nav-ticketing a:hover {
    background-color: #00A9EE;
    color: #fff;
    transition: all 200ms ease;
}
.box-nav-ticketing a.active {
    background-color: #00A9EE;
    color: #fff;
    transition: all 200ms ease;
}
.box-nav-ticketing p {
    margin-bottom: 0 !important;
}
.title-lityhide {
    text-align: center;
    color: #003169;
    font-family: montserrat_medium;
    font-size: 16px;
}
.blue-font {
    color: #192C54;
}
.lato-font h1 {
    font-family: montserrat_bold;
    font-weight: 700;
}
.lato-font h6 {
    font-family: montserrat_bold;
    font-weight: 700;
}
.grass33 {
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    transform: rotate(180deg);
    z-index: -1;
}
.fish9 {
    position: absolute;
    left: 10%;
    top: -20%;
}
.fish10 {
    position: absolute;
    right: 15%;
    top: -12%;
}
.link-buy-card-ticketing .bg-blue-ticket {
    background-color: #00A9EE;
    transition: all 300ms ease-in-out;
}
.link-buy-card-ticketing:hover .bg-blue-ticket {
    background-color: #fff;
    color: #00A9EE;
}
@media (max-width: 500px) {
    .card-ticketing-splide .splide__list,
    .card-ticketing-splide2 .splide__list,
    .card-ticketing-splide3 .splide__list {
        justify-content: start;
    }
}
/* END TICKETING */




 /* KLIEN OCEAN */
.klienOcean {
    position:relative;
    padding-bottom: 10rem;
}
.title-klienOcean {
    position: relative;
    text-align: center;
    margin-bottom: 58px;
    color: #003169;
    font-family: librebaskerville;
}
.title-klienOcean h2 {
    font-size: 50px;
}
.title-klienOcean h2 span {
    color: #16a9f8;
}
.Partner-splide .splide {
    position: relative;
    z-index: 1;
}
.klien-splide .splide__track {
    width: 70%;
    position: relative;
    margin: auto;
    z-index: 1;
}

.klien-splide .splide__slide {
    display: flex;
    align-items: center;
    justify-content: center;
}

.klien-splide .splide__list {
    height: 150px;
}

.klien-splide .splide__list img {
    width: 150px;
}
.treasure-client {
    position: absolute;
    top: 10%;
    right: 10px;
    width: 250px;
}
@media (max-width: 1440px) {
   .treasure-client {
        width: 150px;
    }
}
@media (max-width: 768px) {
    .treasure-client {
        display: none;
    }
}
/* END KLIEN OCEAN */





/* PARTNERSHIP */
.Partnership {
    position: relative;
    z-index: 1;
}
.Partnership .wave-partnerships {
    width: 100%;
}
.box-partnerships {
    background-color: #f3f8fe;
    padding: 0 0 10rem 0
}
.title-partnerships h1 {
    text-align: left;
    font-size: 48px;
    color: #003169;
    font-family: leaguespartan_bold;
    margin-bottom: 50px;
}
.desc-partnerships p {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
    text-align: left;
    margin-bottom: 0;    
}
.btn-partnerships {
    margin-top: 2rem;
}
.btn-partnerships a {
    text-decoration: none;
    background-color: #00A9EE;
    padding: 7px 20px;
    border-radius: 10px;
    color: #fff;
    font-family: montserrat_semibold;
    font-size: 20px;
    transition: all 300ms ease-in-out;
}
.btn-partnerships a:hover {
    background-color: #fff;
    color: #00A9EE;
}
.btn-partnerships a:hover .arrow-right-btn-partnerships {
    transition: transform 300ms ease;
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
@media (max-width: 768px) {
    .box-partnerships {
        padding: 2rem 0 10rem 0
    }
    .title-partnerships h1 {
        font-size: 32px;
        margin-bottom: 20px;
    }
    .desc-partnerships p {
        font-size: 15px;
    }
    .box-partnerships a {
        font-size: 15px;
    }
}
/* END PARTNERSHIP */




/* FOOTER */
footer {
    position: relative;
    z-index: 1;
    background: #003169;
    color: #fff;
    padding-top: 5rem;
}
.social-footer {
    margin-top: 2.5rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.5rem;
    margin-bottom: 3rem;
}
.social-footer-mobile {
    margin-top: 1.5rem;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: center;
    gap: 1.5rem;
    margin-bottom: 3rem;
    display: none;
}
.instagram,
.tiktok,
.facebook,
.youtube {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.instagram p,
.tiktok p,
.facebook p,
.youtube p {
    margin-bottom: 0 !important;
}
.copyright {
    margin-top: 3rem;
    font-family: montserrat_medium;
    font-size: 14px;
}
.items-navbar-footer a {
    text-decoration: none;
    color: #fff;
    line-height: 40px;
    font-family: montserrat_medium;
}
.items-navbar-footer a:hover {
    border-bottom: 2px solid #00A9EE;
}
.bg-darkline {
    background: #fff;
    width: 100%;
    height: 1px;
}
.brand-footer {
    display: flex;
    align-items: center;
    gap: 3rem;
}
.brand-footer-mobile {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1rem;
    margin-bottom: 1rem;
    display: none;
}
.brand-footer img {
    width: 200px;
}
.brand-footer-mobile img {
    width: 120px;
}
.place-footer {
    margin-bottom: 1rem;
}
.place-footer h4 {
    font-family: montserrat_bold;
    font-weight: 700;
}
.navbar-footer h4 {
    font-family: montserrat_bold;
    font-size: 20px;
}
.box-center {
    display: flex;
    justify-content: center;
}
.social-footer a {
    text-decoration: none;
    color: #fff;
}
.address-footer p {
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
    width: 58%;
}   
.corporate-footer {
    display: flex;
    align-items: end;
    justify-content: space-between;
    margin-bottom: 2rem;
}
.corporate-footer .left-grid {
    text-align: left;
}
.corporate-footer .left-grid p {
    margin-bottom: 0 !important;
    font-family: montserrat_bold;
}
.corporate-footer .left-grid span {
    font-family: montserrat_medium;
}
.corporate-footer .right-grid p {
    margin-bottom: 1rem !important;
    font-family: montserrat_bold;
    font-size: 16px;
}
.corporate-footer .right-grid a {
    text-decoration: none;
    color: #fff;
    background-color: #00A9EE;
    padding: 10px 20px;
    border-radius: 10px;
    font-family: montserrat_medium;
    font-size: 16px;
    transition: all 300ms ease-in-out;
}
.corporate-footer .right-grid a:hover {
    background-color: #fff;
    color: #00A9EE;
}
.about-us-footer a {
    text-decoration: none;
    color: #fff;
    font-family: montserrat_medium;
}
.about-us-footer a:hover {
   border-bottom: 2px solid #00A9EE;
}
/* END FOOTER */



/* PREMIUM PACKAGE */
.box-premium {
    text-align: center;
}
.desc-premium {
    color: #fff;
}
.desc-premium h1 {
    font-size: 50px;
}
.desc-premium p {
    font-size: 20px;
    font-family: montserrat_medium;
}
.premiumpackage {
    position: relative;
    padding: 5rem 0 10rem 0;
}
.title-premiumpackage h1 {
    text-align: left;
    font-size: 58px;
    margin-bottom: 20px;
    color: #003169;
    font-family: librebaskerville;
}
.title-premiumpackage p {
    text-align: left;
    font-size: 20px;
    color: #003169;
    margin-bottom: 50px;
    font-family: montserrat_medium;
    width: 80%;
}
.card-premiumpackage {
    background-color: #fff;
    border-radius: 20px;
    padding: 40px;
    height: 100%;
}
.title-card-premium h1 {
    font-family: leaguespartan_bold;
    color: #00A9EE;
}
.strength .amount-zone {
    font-family: montserrat_bold;
    font-size: 16px;
    color: #003169;
}
.strength p {
    color: #003169;
    font-family: montserrat_medium;
    font-size: 18px;
}
.desc-strength {
    display: flex;
    align-items: start;
    gap: 1rem;
    margin-bottom: 1rem;
}
.desc-strength .box-zone-detail {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: .5rem;
}
.desc-strength .zones-detail {
    margin-right: 5rem;
}
.desc-strength p {
    margin-bottom: 0 !important;
}
.desc-strength img {
    width: 35px;
}
.head-title-ticketing h1 {
    font-family: leaguespartan_bold;
    color: #003169;
    font-size: 58px;
}
.button-premium {
    display: flex;
    justify-content: center;
}
.button-premium  a {
    padding: 10px 50px;
    background-color: #82e8ff;
    color: #192C54;
    text-decoration: none;
    font-weight: 700;
    border-radius: 10px;
}
.fishbuntal {
    position: absolute;
    top: 200px;
    left: 100px;
    width: 400px;
}
.shark4 {
    position: absolute;
    top: 300px;
    right: 50px;
    width: 250px;
}
.grass-gray {
    position: absolute;
    bottom: 0;
    width: 100%;
    left: 0;
    z-index: -1;
}
.grass-gray-rotate {
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    z-index: -1;    
    transform: rotate(180deg);
}
.fish8 {
    position: absolute;
    top: 40px;
    right: 15%;
}
.button-premium .disabled {
    background-color: #dedede;
}
.snake2 {
    position: absolute;
    right: 0;
    bottom: 0;
}
.grass43 {
    position: absolute;
    height: 1300px;
    bottom: 0;
    left: 0;
    z-index: -3;
}
.grass44 {
    position: absolute;
    bottom: -2%;
    height: 1300px;
    left: 5%;
    z-index: -3;
}
.grass45 {
    position: absolute;
    z-index: -3;
    top: 30%;
    left: 7%;
}
.grass46 {
    position: absolute;
    z-index: -3;
    top: 0;
    left: 20%;
}
.grass47 {
    position: absolute;
    z-index: -3;
    top: 0;
    left: 0;
}
.grass48 {
    position: absolute;
    z-index: -3;
    top: -10%;
    left: 41%;
}
.grass49 {
    position: absolute;
    z-index: -3;
    bottom: -3%;
    right: 5%;
}
.grass50 {
    position: absolute;
    z-index: -3;
    bottom: -3%;
    right: 0;
}
.grass51 {
    position: absolute;
    top: -15%;
    right: 0;
    z-index: -3;
}
.bird8 {
    position: absolute;
    top: 5%;
    right: 20%;
}
.grass52 {
    position: absolute;
    width: 300px;
    bottom: -10%;
    z-index: -3;
    left: 7%;
}
.box-card-premium {
    position: relative;
}
.btn-absolute {
    position: absolute;
    bottom: 40px;
}
.explore-more {
    position: relative;
    padding: 0 0 5rem 0;
    display: flex;
    justify-content: center;
    gap: 2rem;
}
.explore-more .left-grid {
    width: 370px;
}
.title-explore-more h1 {
    font-family: leaguespartan_bold;
    font-size: 48px;
    color: #003169;
}
.explore-more .right-grid {
    display: flex;
    gap: 1rem;
}
.box-explore-more {
    position: relative;
    width: 300px;
    cursor: pointer;
}
.box-explore-more:hover .desc-box-explore-more {
    background-color: rgba(255, 255, 255, 0.2);
    transition: all 300ms ease;
}   
.box-explore-more img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    border-radius: 12px;
}
.box-explore-more .img-wave-explore-more {
    width: 100%;
    height: auto;
}
.image-box-explore-more {
    position: relative;
    overflow: hidden;
}
.desc-box-explore-more {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 12px;
}
.desc-box-explore-more h4 {
    font-family: leaguespartan_bold;
    font-size: 28px;
    color: #fff;
    text-align: center;
}
@media (max-width: 1482px) {
    .fishbuntal {
        width: 250px;
    }
    .shark4 {
        width: 150px;
    }
}
@media (max-width: 1400px) {
    .explore-more {
        display: block;
    }
    .explore-more .left-grid {
        width: 100%;
    }
    .explore-more .right-grid {
        justify-content: center;
        flex-wrap: wrap;
        gap: 1rem;
    }
    .explore-more .left-grid .title-explore-more h1 {
        text-align: center;
    }
}
@media (max-width: 1252px) {
    .fishbuntal {
        width: 200px;
        left: 20px;
    }
    .shark4 {
        width: 120px;
    }
}
@media (max-width: 991px) {
    .fishbuntal {
        display: none;
    }
    .shark4 {
        display: none;
    }
}
/* END PREMIUM PACKAGE */



/* PROMOTIONS */
.Promotions {
    position: relative;
    padding: 10rem 0 25rem 0;
}
.kerang {
    position: absolute;
    top: -5%;
    right: 10%;
    z-index: -1;
}
.image-promotions img {
    width: 100%;
    height: 490px;
    border-radius: 30px;
}
.box-promotions {
    display: flex;
    align-items: center;
}
.title-promotions h1 {
    font-family: leaguespartan_bold;
    font-size: 24px;
    color: #003169;
    margin-bottom: 20px;
}
.body-promotions p {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 16px;
}
.btn-detail-promotions a {
    display: inline-block;
    color: #003169;
    font-family: montserrat_semibold;
    transition: 250ms ease;
}
.btn-detail-promotions a:hover {
    color: #00A9EE;
}
.promotion-popup-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 16, 37, 0.65);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 20px;
}
.promotion-popup-overlay.is-active {
    display: flex;
}
.promotion-popup {
    width: 100%;
    max-width: 1050px;
    background: #e9ecef;
    color: #003169;
    border-radius: 0;
    position: relative;
    max-height: 92vh;
    overflow-y: auto;
}
.promotion-popup-header {
    background: #003169;
    color: #fff;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    padding: 16px 24px;
}
.promotion-popup-header h3 {
    margin: 0;
    font-family: leaguespartan_bold;
    font-size: 28px;
    line-height: 1.2;
}
.promotion-popup-body {
    display: grid;
    grid-template-columns: 40% 1fr;
    gap: 2.2rem;
    padding: 26px 24px 30px;
}
.promotion-popup-poster img {
    width: 100%;
    border-radius: 14px;
    object-fit: cover;
}
.promotion-popup-content h4 {
    font-size: 50px;
    margin-bottom: 8px;
    color: #060978;
    font-family: leaguespartan_bold;
}
.promotion-popup-content h5 {
    font-size: 36px;
    margin-bottom: 14px;
    color: #060978;
    font-family: leaguespartan_bold;
}
.promotion-popup-content ul {
    padding-left: 24px;
    margin-bottom: 14px;
}
.promotion-popup-content li {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 1.25;
    color: #171717;
}
.promotion-popup-content .popup-note {
    margin-bottom: 10px;
    font-size: 18px;
    line-height: 1.25;
    color: #222;
}
.promotion-popup-content .popup-important {
    margin-bottom: 0;
    font-size: 18px;
    line-height: 1.2;
    font-family: montserrat_semibold;
    color: #111;
}
.promotion-popup-close {
    border: none;
    background: transparent;
    font-size: 44px;
    line-height: 1;
    color: #fff;
    cursor: pointer;
    padding: 0;
}
body.no-scroll {
    overflow: hidden;
}
.footer-promotions a {
    text-decoration: none;
    padding: 10px 40px;
    background-color: #82E8FF;
    border-radius: 10px;
    color: #000;
    font-weight: 600;
}
.grass-gray-rotate2 {
    position: absolute;
    top: 0;
    width: 100%;
    left: 0;
    z-index: -1;    
    transform: rotate(180deg);
}
@media (max-width: 1400px) {
    .image-promotions img {
        height: 420px; 
    }   
}
@media (max-width: 1200px) {
    .image-promotions img {
        height: 350px; 
    }   
}
@media (max-width: 1024px) {
    .image-promotions img {
        height: 420px; 
    }   
}
@media (max-width: 991px) {
    .promotion-popup-header h3 {
        font-size: 26px;
    }
    .promotion-popup-body {
        grid-template-columns: 1fr;
        gap: 1.25rem;
    }
    .promotion-popup-content h4 {
        font-size: 34px;
    }
    .promotion-popup-content h5 {
        font-size: 26px;
    }
    .promotion-popup-content li,
    .promotion-popup-content .popup-note,
    .promotion-popup-content .popup-important {
        font-size: 18px;
    }
}
@media (max-width:768px) {
    .image-promotions {
        display: flex;
        justify-content: center;
    }
    .image-promotions img {
        width: 350px;
        height: auto;
        border-radius: 10px;
    }
}
@media (max-width: 575px) {
    .promotion-popup {
        max-height: 90vh;
    }
    .promotion-popup-header {
        padding: 12px 14px;
    }
    .promotion-popup-header h3 {
        font-size: 20px;
        line-height: 1.2;
    }
    .promotion-popup-close {
        font-size: 34px;
    }
    .promotion-popup-body {
        grid-template-columns: 1fr;
        gap: 1rem;
        padding: 14px;
    }
    .promotion-popup-content h4 {
        font-size: 30px;
    }
    .promotion-popup-content h5 {
        font-size: 22px;
    }
    .promotion-popup-content li,
    .promotion-popup-content .popup-note,
    .promotion-popup-content .popup-important {
        font-size: 16px;
    }
}

/* END PROMOTIONS */




/* ADDITIONAL EXPERIENCE DETAIL PAGE */
.additional-experience-detail {
    position: relative;
    padding: 10rem 0 15rem 0;
    display: flex;
    justify-content: center;
    gap: 2rem;
}
.additional-experience-detail .left-grid {
    height: 100%;
}
.title-additional-exp-detail h1 {
    font-family: librebaskerville;
    font-size: 42px;
    color: #003169;
}
.desc-additional-exp-detail {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
}
.notes-additional-experience-detail p {
    font-size: 17px;
    font-family: montserrat_medium;
    color: #003169;
}
.additional-experience-detail .right-grid {
    display: flex;
    gap: 1rem;
}
.box-additional-exp-detail {
    position: relative;
    width: 100%;
}
.box-additional-exp-detail img {
    width: 100%;
    height: 550px;
    object-fit: cover;
    border-radius: 12px;
}
.box-additional-exp-detail .img-wave-additional-exp-detail {
    width: 100%;
    height: auto;
    border-radius: 0;
    transition: bottom 320ms ease;
}
.image-box-additional-exp-detail {
    position: relative;
    overflow: hidden;
}
.desc-box-additional-exp-detail {
    position: absolute;
    max-height: 100%;
    bottom: 0;     
    width: 100%;
    overflow: hidden;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}
.desc-box-additional-exp-detail .box-white {
    background-color: #fff;
    padding: 12px 20px;
    transition: padding 350ms ease;
}
.desc-box-additional-exp-detail h4 {
    font-family: leaguespartan_bold;
    font-size: 28px;
    color: #003169;
    margin-bottom: 0;
}
.desc-box-additional-exp-detail p {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 14px;
}
.desc-box-additional-exp-detail .box-white > *:not(h4),
.desc-box-additional-exp-detail .btn-ticket-add-ons {
    max-height: 19px;
    overflow: hidden;
    margin: 0;
    transition: max-height 350ms ease, opacity 250ms ease;
}
.box-additional-exp-detail:hover .desc-box-additional-exp-detail .box-white {
    padding: 12px 20px 100px 20px;
}
.box-additional-exp-detail:hover .desc-box-additional-exp-detail .box-white > *:not(h4),
.box-additional-exp-detail:hover .desc-box-additional-exp-detail .btn-ticket-add-ons {
    max-height: 500px;
}
.box-additional-exp-detail:hover .img-wave-additional-exp-detail {
    bottom: 100px;
}
.btn-ticket-add-ons {
    position: absolute;
    width: 100%;
    padding: 20px;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: end;
    margin-top: 2rem;
    background-color: #fff;
    z-index: 2;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}   
.btn-ticket-add-ons a {
    text-decoration: none;
    padding: 10px 20px;
    background-color: #00A9EE;
    border-radius: 10px;
    color: #fff;
    font-weight: 600;
    font-size: 16px;
    transition: all 300ms ease-in-out;
}
.btn-ticket-add-ons a:hover {
    background-color: #fff;
    color: #00A9EE;
} 
.desc-box-additional-exp-detail .box-white .duration {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}  
.desc-box-additional-exp-detail .box-white .duration img {
    width: 20px;
    height: 20px;
}
.desc-box-additional-exp-detail .box-white .duration p {
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
    color: #003169;
    font-size: 14px;
}  
.desc-box-additional-exp-detail .box-white .prize {
    display: flex;
    align-items: center;
}  
.desc-box-additional-exp-detail .box-white .time {
    display: block;
    align-items: center;
    gap: .5rem;
} 
.desc-box-additional-exp-detail .box-white .time p {
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
    color: #003169;
    font-size: 14px;
} 
.desc-box-additional-exp-detail .box-white .prize img {
    width: 20px;
    height: 20px;
}
.desc-box-additional-exp-detail .box-white .prize p {
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
    color: #003169;
    font-size: 14px;
}   
.desc-box-additional-exp-detail .box-white .location {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}  
.desc-box-additional-exp-detail .box-white .location img {
    width: 20px;
    height: 20px;
}
.desc-box-additional-exp-detail .box-white .location p {
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
    color: #003169;
    font-size: 14px;
}
@media (max-width:1400px) {
    .title-additional-exp-detail h1 {
        font-size: 48px;
    }
    .desc-additional-exp-detail {
        font-size: 16px;
    }
    .notes-additional-experience-detail p {
        font-size: 16px;
    }
}  
@media (max-width:1200px) {
    .title-additional-exp-detail h1 {
        font-size: 38px;
    }
}  
/* END ADDITIONAL EXPERIENCE DETAIL PAGE */



/* SCHOOL PACKAGE */
.desc-schoolpackage h1 {
    font-family: leaguespartan_bold;
    font-size: 58px;
    color: #fff;
}
.desc-schoolpackage p {
    font-size: 24px;
    width: 80%;
    margin: 0 auto; 
}
.box-schoolpackage {
    text-align: center;
    color: #fff;
}
.SchoolPackage {
    position: relative;
    padding: 5rem 0;
}
.title-SchoolPackage h4 {
    color: #003961;
}
.title-SchoolPackage h1 {
    margin-bottom: 20px;
    color: #003961;
    font-family: librebaskerville;
    font-size: 58px;
}
.title-SchoolPackage p {
    text-align: justify;
    color: #003961;
    font-family: montserrat_medium;
    font-size: 20px;
}
.box-image-schoolpackage {
    position: relative;
}
.box-image-schoolpackage img {
    object-position: center top;
}
.box-image-schoolpackage .image-schoolpackage- {
    object-fit: cover;
    width: 100%;
    height: 385px;
    border-radius: 46px;
}
.box-image-schoolpackage .image-schoolpackage-2 {
    object-fit: cover;
    width: 100%;
    height: 485px;
    border-radius: 46px;
}
.box-image-schoolpackage .image-schoolpackage-3 {
    object-fit: cover;
    width: 100%;
    height: 385px;
    border-radius: 46px;
}
.mb-100 {
    margin-bottom: 5rem;
}
.iguana {
    position: absolute;
    right: -30px;
    top: -103px;
}
.contactus2 {
    position: relative;
    padding-bottom: 10rem;
}
.title-contactus2 {
    text-align: center;
    margin-bottom: 50px;
}
.title-contactus2 h1 {
    font-family: librebaskerville;
    font-size: 58px;
    color: #003961;
    margin-bottom: 30px;
}
.title-contactus2 p {
    color: #003961;
    font-family: montserrat_medium;
    font-size: 20px;
}
.box-contactus2 {
    position: relative;
    z-index: 3;
}
.desc-card-contactus2 {
    text-align: center;
}
.box-card-contactus2 {
    display: flex;
    justify-content: center;
    align-items: end;
}
.card-contactus2 a {
    text-decoration: none;
    color: #003961;
    font-family: montserrat_semibold;
}
.contactus3 {
    position: relative;
    padding-bottom: 10rem;
}
.title-contactus3 {
    text-align: left;
    margin-bottom: 30px;
}
.title-contactus3 h1 {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003961;
    margin-bottom: 30px;
}
.title-contactus3 p {
    color: #003961;
    font-family: montserrat_medium;
    font-size: 20px;
}
.box-contactus3 {
    position: relative;
    z-index: 3;
}
.desc-card-contactus3 {
    text-align: center;
}
.box-card-contactus3 {
    display: flex;
    justify-content: start;
    align-items: end;
}
.card-contactus3 a {
    text-decoration: none;
    color: #003961;
    font-family: montserrat_semibold;
}
.iguana2 {
    top: -10rem;
    position: absolute;
}
.grass18 {
    max-width: 100%;
    top: -5%;
    z-index: -1;
    position: absolute;
    left: 0;
}
.grass19 {
    max-width: 100%;
    top: 0;
    z-index: -1;
    position: absolute;
    left: 8%;
}
.grass20 {
    max-width: 100%;
    top: 0;
    z-index: -1;
    position: absolute;
    right: 5%;
}
.grass21 {
    max-width: 100%;
    top: 0;
    z-index: -1;
    position: absolute;
    right:0;
}
.grass22 {
    width: 100%;
    bottom: -15%;
    z-index: -1;
    position: absolute;
    left: -20%;
}
.grass23 {
    width: 100%;
    bottom: 0;
    z-index: -1;
    position: absolute;
    right: -10%;
}
.grass24 {
    display: none;
}
.grass25 {
    display: none;
}
.overlay-darkblue-bg-banner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background: -moz-linear-gradient(top, rgb(25,44,84, 0) 0%,rgb(25,44,84, 0.9) 98%, rgb(25,44,84, 1) 100%);
    background: -webkit-linear-gradient(top, rgb(25,44, 0) 0%,rgb(25,44,84 0.9) 98%,rgb(25,44,84, 1) 100%);
    background: linear-gradient(to bottom, rgb(25,44,84, 0) 0%,rgb(25,44,84, 0.9) 98%,rgb(25,44,84, 1) 100%);
}
.rectangle-darkblue {
    width: 100%;
}
.grass26 {
    position: absolute;
    z-index: -1;
    left: 10%;
}
.grass27 {
    position: absolute;
    top: -5%;
    z-index: -1;
    left: 6%;
}
.grass28 {
    position: absolute;
    top: -5%;
    z-index: -1;
    left: 30%;
}
.grass29 {
    position: absolute;
    top: -5%;
    z-index: -1;
    left: 45%;
}
.grass30 {
    position: absolute;
    top: -5%;
    z-index: -1;
    left: 65%;
}
.grass31 {
    position: absolute;
    top: -5%;
    z-index: -1;
    right: 0;
}
.bird4 {
    position: absolute;
    top: 25%;
    z-index: -1;
    left: 20%;
}
.bird5 {
    position: absolute;
    top: 40%;
    z-index: -1;
    right: 38%;
}
.bird6 {
    position: absolute;
    top: 55%;
    z-index: -1;
    right: 20%;
}
.bird7 {
    position: absolute;
    top: 60%;
    z-index: -1;
    right: 43%;
}
.grass32 {
    position: absolute;
    top: 50%;
    z-index: -1;
    left: 9%;
}
.Schoolpackage-slide {
    padding: 5rem 0;
}
.title-schoolpackage-slide {
    position: relative;
    text-align: center;
    
}
.title-schoolpackage-slide h1 {
    color: #003961;
    font-size: 58px;
    margin-bottom: 50px;
    font-family: librebaskerville;
}
.bunglon {
    position: absolute;
    left: -10%;
    top: -500%;
}
.bg-schoolpackage-slide {
    position: relative;
    overflow: hidden;
    border: .5px solid #003961;
    padding: 20px;
    border-radius: 10px;
    background-color: #003961;
}
.title-schoolpackage-program h5 {
    font-family: montserrat_bold;
    color: #fff;
}
.title-schoolpackage-program p {
    color: #fff;
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
}
.package-grade ul {
    padding-left: 0 !important;
}
.package-grade ul li {
    list-style: none;
    margin-bottom: 5px;
    height: 5.5rem;
    color: #000;
    background-color: #fff;
    border-radius: 5px;
    font-family: montserrat_medium;
    font-size: 14px;
}
.package-grade ul .bg-blue-package {
    background: #00A9EE;
    text-align: center;
    font-size: 20px;
    font-weight: 700;
    color: #fff;
    padding: 10px;
}
.package-centers li {
    display: flex;
    justify-content: center;
    align-items: center;
}
.package-centers li img {
    width: 40px;
}
.package-left li {
    display: flex;
    justify-content: left;
    align-items: center;
    padding-left: 10px;
    font-family: montserrat_medium;
}
.package-left .block-package {
    display: block;
}
.box-flex-package-program {
    display: flex;
    flex-wrap: wrap-reverse;
    justify-content: space-between;
    margin-bottom: 2rem;
}
.brand-package img {
    width: 200px;
}
.package-grade .disabled {
    background-color: #DEDEDE;
}
.grass65 {
    position: absolute;
    top: -10%;
    left: -10%;
    z-index: -1;
}
.grass66 {
    position: absolute;
    left: 27%;
    top: -15%;
    z-index: -1;
}
.grass67 {
    position: absolute;
    right: -15%;
    top: -10%;
    z-index: -1;
}
.why-bxsea .title {
    font-family: librebaskerville;
    color: #003961;
    font-size: 58px;
    margin-bottom: 20px;
}
.why-bxsea .number {
  font-weight: bold;
  color: #003961;
  margin-right: 10px;
  min-width: 20px;
}
.why-bxsea .content h4 {
  font-size: 20px;
  color: #003961;
  margin: 0 0 5px;
  font-family: montserrat_bold;
}
.why-bxsea .content p {
  font-size: 20px;
  color: #003961;
  margin: 0;
  line-height: 1.6;
  margin-bottom: 20px;
  font-family: montserrat_medium;
}
.what-included .title {
  font-family: librebaskerville;
  color: #003961;
  font-size: 58px;
}
.what-included .custom-card {
  border: none;
  border-radius: 12px;
  overflow: hidden;
  background-color: #f2f2f2;
}
.what-included .custom-card img {
  height: 300px;
  object-fit: cover;
}
.what-included .custom-card .card-body {
  padding: 20px;
}
.what-included .custom-card .card-title {
  font-weight: bold;
  color: #003961;
  font-size: 28px;
  font-family: leaguespartan_bold;
}
.what-included .custom-card .card-text {
  font-family: montserrat_medium;
  color: #003961;
  line-height: 1.6;
}
.teacher-said {
    padding: 10rem 0;
}
.image-teacher-said-box {
    position: relative;
}
.image-teacher-said-box .bullets {
    position: absolute;
    right: 0;
    top: -50%;
    translate: (-50%);
    background-color: #f3f3f3;
    border-radius: 20px;
    width: 400px;
    height: 400px;
    border-radius: 100%;
    z-index: -1;
}
.image-teacher-said-box img {
    width: 100%;
}
.teacher-said-box .title {
    font-family: librebaskerville;
    color: #003961;
    font-size: 58px;
    margin-bottom: 20px;
}
.teacher-said-box p {
    font-family: montserrat_medium;
    color: #003961;
    font-size: 18px;
    margin-left: 30px;
}
.teacher-said-box span {
    font-family: montserrat_medium;
    color: #003961;
    font-size: 20px;
}
.image-teacher-said-box-mobile img {
    display: none;
}
@media (max-width: 991px) {
    .image-teacher-said-box .bullets {
        display: none;
    }
    .image-teacher-said-box img {
        display: none;
    }
    .image-teacher-said-box-mobile {
        display: flex;
        gap: .5rem;
        align-items: center;
    }
    .image-teacher-said-box-mobile img {
        display: block;
        width: 50px;
    }
}
/* END SCHOOL PACKAGE */




/* ONCE IN A LIFETIME */
.Oncelifetime {
    position: relative;
    padding: 5rem 0;
}
.title-once {
    text-align: center;
}
.title-once h1 {
    font-family: librebaskerville;
    font-size: 58px;
    color: #003961;
}
.title-once p {
    font-size: 24px;
    font-family: montserrat_medium;
    color: #003961;
    margin-bottom: 50px;
}
.title-once a {
    padding: 10px 50px;
    border-radius: 10px;
    background-color: #82E8FF;
    color: #204280;
    text-decoration: none;
}
.image-once img {
    width: 100%;
    height: 350px;
    border-radius: 35px;
    object-fit: cover;
}
.image-once {
    position: relative;
}
.box-align {
    display: flex;
    align-items: center;
}
.box-align2 {
    display: flex;
    align-items: center;
    justify-content: end;
}
.desc-image-once h1 {
    font-size: 50px;
    color: #82E8FF;
}
.desc-image-once p {
    color: #fff;
}
.mb-200 {
    margin-bottom: 1.5rem;
}
.rectangle-darkblue2 {
    position: absolute;
    width: 100%;
    height: 25vh;
}
.grass34 {
    position: absolute;
    top: 0;
    left: -5%;
    width: 100%;
    z-index: -1;
}
.akar3 {
    position: absolute;
    left: -40%;
    top: 15%;
    z-index: -1;
}
.akar4 {
    position: absolute;
    right: -40%;
    top: 15%;
    z-index: -1;
}
.wave8 {
    z-index: 2;
    position: absolute;
    bottom: -40px;
}
.text-right {
    text-align: right;
}
.fish11 {
    position: absolute;
    right: 10%;
    bottom: 12%;
    z-index: 1;
}
.fish12 {
    width: 350px;
    position: absolute;
    left: 20%;
    top: 20%;
}
.event-section {
  background: #fff;
  padding: 3rem 5rem 5rem;
}
.owl-once .owl-dots {
    margin-top: 2rem;
}
.owl-once .owl-dot span {
    background: #c5d5e8 !important;
}
.owl-once .owl-dot.active span {
    background: #003961 !important;
}
.event-card {
  text-align: center;
  padding: 0 16px;
}
.event-card img {
  width: 100%;
  object-fit: cover;
  height: 300px;
  border-radius: 12px;
}
.event-card h3 {
  font-size: 28px;
  margin-top: 15px;
  font-family: librebaskerville;
  color: #003961;
}
.event-card p {
  font-size: 18px;
  color: #003961;
  margin-top: 10px;
  line-height: 1.6;
}
/* END ONCE A LIFETIME */





/* ONCE A LIFETIME RESPONSIVE */
@media (max-width: 1200px) {
    .event-section {
        padding: 3rem 3rem 5rem;
    }
    .title-once h1 {
        font-size: 46px;
    }
    .title-once p {
        font-size: 20px;
    }
    .event-card img {
        height: 260px;
    }
    .event-card h3 {
        font-size: 24px;
    }
    .event-card p {
        font-size: 16px;
    }
}

@media (max-width: 991px) {
    .Oncelifetime {
        padding: 4rem 0;
    }
    .event-section {
        padding: 2rem 2rem 4rem;
    }
    .title-once h1 {
        font-size: 36px;
    }
    .title-once p {
        font-size: 17px;
        margin-bottom: 35px;
    }
    .event-card img {
        height: 240px;
    }
    .event-card h3 {
        font-size: 22px;
    }
    .event-card p {
        font-size: 15px;
    }
}

@media (max-width: 767px) {
    .Oncelifetime {
        padding: 3rem 0;
    }
    .event-section {
        padding: 2rem 1rem 4rem;
    }
    .title-once h1 {
        font-size: 28px;
    }
    .title-once p {
        font-size: 15px;
        margin-bottom: 28px;
    }
    .event-card {
        padding: 0 8px;
    }
    .event-card img {
        height: 220px;
    }
    .event-card h3 {
        font-size: 20px;
    }
    .event-card p {
        font-size: 14px;
    }
}

@media (max-width: 575px) {
    .Oncelifetime {
        padding: 2.5rem 0;
    }
    .event-section {
        padding: 1.5rem 0.5rem 3rem;
    }
    .title-once h1 {
        font-size: 24px;
    }
    .title-once p {
        font-size: 13px;
        margin-bottom: 20px;
    }
    .event-card {
        padding: 0 4px;
    }
    .event-card img {
        height: 200px;
        border-radius: 10px;
    }
    .event-card h3 {
        font-size: 18px;
    }
    .event-card p {
        font-size: 13px;
        line-height: 1.5;
    }
    .owl-once .owl-dots {
        margin-top: 1.5rem;
    }
}

@media (max-width: 375px) {
    .title-once h1 {
        font-size: 20px;
    }
    .event-card img {
        height: 180px;
    }
    .event-card h3 {
        font-size: 16px;
    }
    .event-card p {
        font-size: 12px;
    }
}
/* END ONCE A LIFETIME RESPONSIVE */
/* END ONCE A LIFETIME */




/* MEMORIES SECTION */
.memories-section {
    background: #ddeeff;
    padding: 5rem 0;
    overflow: hidden;
}
.memories-title {
    font-family: leaguespartan_bold;
    font-size: 36px;
    color: #003169;
    text-align: center;
    letter-spacing: 2px;
    margin-bottom: 2rem;
    position: relative;
    z-index: 1;
}
.memories-carousel-wrap {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: center;
    gap: 20px;
}
.memories-wave {
    position: absolute;
    pointer-events: none;
    z-index: 2;
}
.memories-wave--top {
    top: -6vw;
    right: 0;
}
.memories-wave--top img,
.memories-wave--bottom img {
    width: 20vw;
    display: block;
}
.memories-wave--bottom {
    bottom: -3.5vw;
    left: -6vw;
}
.owl-memories {
    flex: 1;
    min-width: 0;
}
.memories-slide {
    width: 100%;
}
.memories-slide img {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    border-radius: 16px;
    display: block;
}
.memories-arrow {
    flex-shrink: 0;
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    width: 52px;
    transition: transform 0.2s;
}
.memories-arrow img {
    width: 100%;
    display: block;
}
.memories-arrow:hover {
    transform: scale(1.1);
}
@media (max-width: 767px) {
    .memories-arrow {
        width: 36px;
    }
    .memories-carousel-wrap {
        gap: 10px;
    }
    .memories-title {
        font-size: 24px;
    }
}
@media (max-width: 480px) {
    .memories-arrow {
        width: 28px;
    }
    .memories-carousel-wrap {
        gap: 6px;
    }
}
/* END MEMORIES SECTION */





/* MAIN JOURNEY */
.title-journey-zone h1 {
    font-family: librebaskerville;
    font-size: 58px;
    color: #003169;
}
.desc-journey-zone {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
}
.notes-journey-zone p {
    font-size: 17px;
    font-family: montserrat_medium;
    color: #003169;
}
.box-journey-zone {
    position: relative;
    width: 100%;
}
.box-journey-zone img {
    width: 100%;
    height: 550px;
    object-fit: cover;
    border-radius: 12px;
}
.box-journey-zone .img-wave-journey-zone {
    width: 100%;
    height: auto;
    border-radius: 0;
    transition: bottom 320ms ease;
}
.image-box-journey-zone {
    position: relative;
    overflow: hidden;
}
.desc-box-journey-zone {
    position: absolute;
    max-height: 100%;
    bottom: 0;     
    width: 100%;
    overflow: hidden;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}
.desc-box-journey-zone .box-white {
    background-color: #fff;
    padding: 12px 20px 50px 20px;
    transition: padding 350ms ease;
}
.desc-box-journey-zone h4 {
    font-family: leaguespartan_bold;
    font-size: 28px;
    color: #003169;
    margin-bottom: 0;
}
.desc-box-journey-zone p {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 14px;
}
.desc-box-journey-zone .box-white > *:not(h4):not(span),
.desc-box-journey-zone .btn-detail-journey-zone {
    max-height: 40px;
    overflow: hidden;
    margin: 0;
    transition: max-height 350ms ease, opacity 250ms ease;
}
.box-journey-zone:hover .desc-box-journey-zone .box-white {
    padding: 12px 20px 100px 20px;
}
.box-journey-zone:hover .desc-box-journey-zone .box-white > *:not(h4):not(span),
.box-journey-zone:hover .desc-box-journey-zone .btn-detail-journey-zone {
    max-height: 500px;
}
.box-journey-zone:hover .img-wave-journey-zone {
    bottom: 100px;
}
.btn-detail-journey-zone {
    position: absolute;
    width: 100%;
    padding: 20px;
    right: 0;
    bottom: 0;
    display: flex;
    justify-content: end;
    margin-top: 2rem;
    background-color: #fff;
    z-index: 2;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}   
.btn-detail-journey-zone a {
    text-decoration: none;
    background-color: #003961;
    padding: 9px 10px;
    border-radius: 100%;
    color: #fff;
    font-weight: 600;
    transition: all 300ms ease-in-out;
}
.btn-detail-journey-zone a img {
    width: 30px;
    height: 30px;    
    object-fit: none;
    margin-left: 4px;
}
.btn-detail-journey-zone a:hover {
    opacity: 0.8;
} 

.journey-zone-modal-overlay {
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 9999;
    display: none;
    align-items: center;
    justify-content: center;
    padding: 12px;
}
.journey-zone-modal-overlay.is-active {
    display: flex;
}
.journey-zone-modal {
    position: relative;
    width: 100%;
    max-width: 1120px;
    max-height: 95vh;
    overflow-y: auto;
    background: #f7f7f9;
    border-radius: 14px;
}
.img-border-corner {
    position: absolute;
    right: 0;
    top: 0;
}
.journey-zone-modal-header {
    background: #003169;
    color: #fff;
    padding: 16px 24px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}
.journey-zone-modal-header h3 {
    margin: 0;
    font-family: leaguespartan_bold;
    font-size: 24px;
}
.journey-zone-modal-close {
    border: none;
    background: transparent;
    color: #003169;
    font-size: 44px;
    line-height: 1;
    padding: 0;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 20px;
    z-index: 3;
}
.journey-zone-modal-body {
    padding: 40px;
}
.journey-zone-modal-intro {
    display: grid;
    grid-template-columns: 33% 1fr;
    gap: 2rem;
    margin-bottom: 20px;
}
.journey-zone-modal-intro-left h4 {
    margin: 0 0 6px;
    font-family: librebaskerville;
    color: #2aa3ee;
    font-size: 42px;
}
.journey-zone-modal-intro-left span {
    font-family: leaguespartan_bold;
    color: #003169;
    font-size: 20px;
}
.journey-zone-modal-intro-right p {
    margin: 0;
    font-family: montserrat_medium;
    color: #003169;
    font-size: 20px;
    line-height: 1.4;
}
.journey-zone-modal-find h5 {
    margin: 50px 0 -25px 130px;
    color: #003169;
    font-family: leaguespartan_bold;
    font-size: 22px;
}
.journey-zone-modal-find-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 24px;
}
.journey-zone-modal-find-card img {
    width: 100%;
    height: 260px;
    object-fit: cover;
    border-radius: 24px;
}
.journey-zone-modal-find-grid .journey-zone-modal-find-card:first-child img {
    margin-top: 32px;
}
.journey-zone-modal-find-card p {
    margin: 10px 0 0;
    text-align: center;
    color: #003169;
    font-family: leaguespartan_bold;
    font-size: 22px;
}
.box-journey-zone-additional {
    width: 320px;
}  

@media (max-width: 991px) {
    .journey-zone-modal-header h3 {
        font-size: 18px;
    }
    .journey-zone-modal-intro {
        grid-template-columns: 1fr;
        gap: 1rem;
    }
    .journey-zone-modal-intro-left h4 {
        font-size: 42px;
    }
    .journey-zone-modal-intro-left span {
        font-size: 30px;
    }
    .journey-zone-modal-intro-right p {
        font-size: 20px;
    }
    .journey-zone-modal-find h5 {
        font-size: 30px;
    }
    .journey-zone-modal-find-card img {
        height: 200px;
    }
}

@media (max-width: 575px) {
    .journey-zone-modal-header {
        padding: 12px 14px;
    }
    .journey-zone-modal-close {
        font-size: 34px;
    }
    .journey-zone-modal-body {
        padding: 14px;
    }
    .journey-zone-modal-intro-left h4 {
        font-size: 34px;
    }
    .journey-zone-modal-intro-left span {
        font-size: 22px;
    }
    .journey-zone-modal-intro-right p {
        font-size: 16px;
    }
    .journey-zone-modal-find h5 {
        font-size: 24px;
    }
    .journey-zone-modal-find-grid {
        grid-template-columns: 1fr;
        gap: 16px;
    }
    .journey-zone-modal-find-card img {
        height: 180px;
        border-radius: 16px;
    }
    .journey-zone-modal-find-card p {
        font-size: 18px;
    }
}
.explore-section {
  text-align: center;
}

.title {
  font-size: 28px;
  font-weight: 600;
  color: #1c355e;
  margin-bottom: 10px;
}

.subtitle {
  font-size: 14px;
  color: #1c355e;
  margin-bottom: 30px;
}

/* CARD */
.card {
  position: relative;
  margin: auto;
  border-radius: 12px;
  background: #fff;
  padding: 12px;
}

.card img {
  width: 100%;
  border-radius: 10px;
  display: block;
}
.explore-mainjourney-section {
    padding: 10rem 1rem;
    position: relative;
}
.explore-mainjourney-section .title {
    font-size: 58px;
    font-family: librebaskerville;
    color: #003169;
    text-align: center;
}
.explore-mainjourney-section .subtitle {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 20px;
    text-align: center;
}
/* INFO BOX */
.explore-mainjourney-section .info-box {
  position: absolute;
  bottom: 30px;
  left: 40px;
  background: #f2f4f7;
  padding: 20px 25px;
  border-radius: 10px;
  max-width: 500px;
  text-align: center;
}

.explore-mainjourney-section .info-box h3 {
  font-family: leaguespartan_bold;
  margin: 0;
  color: #003169;
  font-size: 40px;
}

.explore-mainjourney-section .info-box .zone {
  display: block;
  font-size: 20px;
  margin: 5px 0 10px;
  color: #003961;
  font-family: leaguespartan_bold;
}

.explore-mainjourney-section .info-box p {
  font-size: 20px;
  color: #003961;
  margin: 0;
  font-family: montserrat_medium;
}

/* BADGE */
.explore-mainjourney-section .badge {
  position: absolute;
  left: 30px;
  bottom: 350px;
  color: white;
  padding: 15px;
  border-radius: 50%;
  font-size: 12px;
  font-weight: bold;
  transform: translateX(-50%);
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
}

/* DOT */
.dot {
  position: absolute;
  top: 20px;
  right: 20px;
  width: 14px;
  height: 14px;
  background: white;
  border-radius: 50%;
}
.btn-load-more {
    display: block;
    margin: 2rem auto 0 auto;
    width: fit-content;
    padding: 10px 30px;
    background-color: #00A9EE;
    color: #fff;
    border-radius: 10px;
    text-decoration: none;
    font-weight: 600;
    transition: all 300ms ease-in-out;
    cursor: pointer;
}
.btn-load-more:hover {
    background-color: #fff;
    color: #00A9EE;
}
.additional-journey-zone {
    padding: 10rem 0 5rem 0;
    display: flex;
    justify-content: center;
    gap: 5rem;
}
.additional-journey-zone .right-grid {
    display: flex;
    gap: 5rem;
}
.additional-journey-zone .title p {
    font-size: 58px;
    font-family: leaguespartan_bold;
}

@media (max-width: 1400px) {
    .additional-journey-zone {
        gap: 3rem;
    }
} 
@media (max-width: 1200px) {
    .additional-journey-zone {
        gap: 2rem;
    }
    .additional-journey-zone .right-grid {
        gap: 2rem;
    }
}
@media (max-width: 1024px) {
    .additional-journey-zone {
        display: block;
    }
}

@media (max-width: 991px) {
    .explore-mainjourney-section .badge {
        width: 150px;
    }
    .explore-mainjourney-section .info-box {
        max-width: 300px;
    }
    .explore-mainjourney-section .info-box h3 {
        font-size: 22px;
    }
    .explore-mainjourney-section .info-box span {
        font-size: 12px;
    }
    .explore-mainjourney-section .info-box p {
        font-size: 12px;
    }
    .box-journey-zone-additional {
        width: 100%;
    }
}

@media (max-width: 768px) {
    .explore-mainjourney-section .badge {
        width: 100px;
    }
    .additional-journey-zone .right-grid {
        display: block;
    }
    .explore-mainjourney-section .card img {
        border-bottom-left-radius: 0;
        border-bottom-right-radius: 0;
        aspect-ratio: 16/9;
        height: auto;
    }
    .explore-mainjourney-section .info-box {
        position: static;
        background: #f2f4f7;
        padding: 20px 25px;
        border-top-left-radius: 0;  
        border-top-right-radius: 0;
        max-width: 100%;
        text-align: center;
    }
}

@media (max-width: 576px) {
    .explore-mainjourney-section .badge {
        display: none;
    }   
}
/* MAIN JOURNEY */




/* TENANT DETAIL */
.tenant {
    padding: 5rem 0;
}
/* END TENANT DETAIL */




/* JOURNEY */
.Journeyocean {
    padding-bottom: 5rem;
    position: relative;
    color: #fff;
}
.title-journey-ocean h1 {
    position: relative;
    z-index: 5;
    text-align: center;
    font-size: 50px;
    color: #82E8FF;
    margin-bottom: 50px;
}
.mySwiper {
    position: relative;
    z-index: 4;
    height: 800px;
}
.mySwiper img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    cursor: pointer;
}
.swiper-button-next::after {
    font-size: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.swiper-button-next {
    color: #000;
    background-color: #fff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
.swiper-button-prev::after {
    font-size: 25px;
    display: flex;
    align-items: center;
    justify-content: center;
}
.swiper-button-prev {
    color: #000;
    background-color: #fff;
    width: 50px;
    height: 50px;
    border-radius: 50%;
}
.wave2 {
    width: 100%;
    position: absolute;
    z-index: 5;
    top: -90px;
}
.wave3 {
    width: 100%;
    z-index: 5;
    position: absolute;
    bottom: -50px;
}
.wave4 {
    position: absolute;
    z-index: 5;
    left: 10%;
    top: 0;
}
.wave5 {
    position: absolute;
    z-index: 5;
    right: 0;
    top: 18%;
}
.wave6 {
    position: absolute;
    z-index: 5;
    right: 20%;
    bottom: 5%;
}
.wave7 {
    position: absolute;
    z-index: 7;
    left: 8%;
    bottom: 9%;
}
.shark {
    position: absolute;
    width: 400px;
    z-index: 7;
    top: 13%;
    right: 13%;
}
.happyall {
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #0b0c4f;
    width: 100%;
    height: 400px;
}
.happyall p {
    text-decoration: none;
}
.grass2 {
    max-width: 100%;
    position: absolute;
    left: -10%;
    top: 155rem;
}
.grass3 {
    max-width: 100%;
    position: absolute;
    left: 7%;
    top: 55rem;
}
.grass4 {
    z-index: 6;
    max-width: 100%;
    position: absolute;
    right: 0;
    top: 58rem;
}
.grass5 {
    max-width: 100%;
    position: absolute;
    right: 5%;
    top: 58rem;
}
.grass6 {
    max-width: 100%;
    position: absolute;
    top: 55rem;
    left: 0;
}
.grass7 {
    max-width: 100%;
    position: absolute;
    top: 155rem;
    right: 0;
}
.grass8 {
    z-index: 6;
    max-width: 100%;
    position: absolute;
    top: 0;
    left: 20%;
}
.grass9 {
    z-index: 6;
    max-width: 100%;
    position: absolute;
    top: 50rem;
    left: 25%;
}
.grass10 {
    max-width: 100%;
    position: absolute;
    top: 55rem;
    right: 0;
}
.grass11 {
    max-width: 100%;
    position: absolute;
    top: 50rem;
    left: 0;
}
.bird {
    z-index: 7;
    position: absolute;
    top: 100rem;
    right: 0;
}
.bird2 {
    z-index: 7;
    position: absolute;
    top: 65rem;
    right: 30%;
}
.bird3 {
    z-index: 7;
    position: absolute;
    top: 110rem;
    right: 5%;
}
.grass12 {
    position: absolute;
    top: 110rem;
    left: 5%;
}
.grass13 {
    position: absolute;
    top: 140rem;
    left: 10%;
}
.popup-template {
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 100;
    width: 65vw;
    height: fit-content;
    background-color: #e0e0e0;
    color: #000;
    border-radius: 20px;
    transform: translate(-50%, -50%);
    opacity: 0;
    visibility: hidden;
}
.popup-close img {
    width: 20px;
}
.popup-top {
    padding: 4rem;
}
.popup-top h1 {
    font-size: 50px;
    font-weight: bold;
    margin-bottom: 5px;
    color: #204280;
}
.popup-top p {
    font-size: 20px;
}
.popup-close {
    position: absolute;
    z-index: 100;
    top: 30px;
    right: 30px;
    cursor: pointer;
}
.overlay-bg-jouney-img {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.7);
    z-index: 99;
}
.image-journey {
    position: relative;
}
.overlay-image-journey {
    position: absolute;
    cursor: pointer;
    z-index: 8;
    left: 30px;
    bottom: 30px;
}
.overlay-image-journey2 {
    position: absolute;
    cursor: pointer;
    z-index: 8;
    left: 30px;
    top: 30px;
}
/* END JOURNEY */





/* TESTIMONI */
.howwehelp {
    position: relative;
    z-index: 1;
    color: #fff;
    padding-bottom: 10rem;
}

.title-reviews {
    margin-bottom: 2rem;
}
.title-reviews h1 {
    color: #82E8FF;
    font-size: 50px;
}
.image-cust {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 1rem;
}
.name-cust {
    color: #000;
}
.name-cust p {
    margin-bottom: 0 !important;
}
.rating img {
    width: 20px;
}
.image-cust .image-cust_ {
    object-fit: cover;
    width: 65px;
    height: 65px;
    border-radius: 50%;
}
.review-cust-splide .splide__slide {
    text-align: center;
}
.bg-white-review-cust {
    padding: 40px 5rem;
    background-color: #fff;
    border-radius: 15px;
}
.cust-said {
    color: #000;
    margin: 1rem auto;
    text-align: center;
}
.review-cust-splide .splide__arrow {
    background: none;
    opacity: 1;
}
.review-cust-splide .splide__arrow svg {
    fill: #7CE4FF;
}
.fox {
    position: absolute;
    bottom: -60px;
    right: 10%;
}
/* END TESTIMONI */









/* SOCIAL */
.Social {
    padding-bottom: 10rem;
    position: relative;
    z-index: 1;
    color: #fff;
}
.title-social h1 {
    color: #82E8FF;
    font-size: 50px;
}
.box-tourism-center {
    display: flex;
    align-items: center;
}
.card-tourism {
    position: relative;
    height: 500px;
}
.image-tourism video {
    height: 500px;
    width: 100%;
    border-radius: 5px;
}
.image-tourism img {
    height: 500px;
    width: 100%;
    object-fit: cover;
    border-radius: 5px;
}
.overlay-ig-tourism {
    position: absolute;
    top: 10px;
    right: 10px;
}
.instagram-bg-white {
    background-color: #fff;
    padding: 7px;
    border-radius: 50%;
}
.overlay-like-tourism {
    position: absolute;
    bottom: 15px;
    left: 15px;
    display: flex;
    align-items: center;
    gap: .5rem;
}
.overlay-like-tourism p,
.overlay-comment-tourism p {
    margin-bottom: 0 !important;
    color: #fff;
}
.overlay-comment-tourism {
    display: flex;
    align-items: center;
    gap: .5rem;
    position: absolute;
    bottom: 15px;
    right: 15px;
}
/* END SOCIAL */






/* PENGALAMAN MENARIK */
.Explore {
    padding-top: 10rem;
    padding-bottom: 5rem;
}
.title-explore h1 {
    font-size: 50px;
    text-align: center;
    color: #fff;
    margin-bottom: 50px;
}
.title-explore-lit h1 {
    font-size: 50px;
    color: #fff;
}
.desc-explore-lit p {
    font-size: 20px;
    color: #fff;
}
.image-experiences {
    width: 100%;
}
/* END PENGALAMAN MENARIK */





/* .Exploremore {
    padding-bottom: 10rem;
}
.card-exploremore img {
    object-fit: cover;
    border-radius: 20px;
}
.catergory-explore {
    margin-top: 1rem;
}
.catergory-explore h3 {
    margin-bottom: 1rem;
    color: #fff;
}
.catergory-explore a {
    text-decoration: none;
    color: #2facdd;
    padding: 7px 40px;
    border: 1px solid #2facdd;
    border-radius: 8px;
    transition: all 300ms ease-in-out;
}
.catergory-explore a:hover {
    color: #fff;
    background-color: #2facdd;
}
.height-shadow {
    padding-top: 10rem;
}
.header-partnership {
    color: #fff;
    text-align: center;
}
.header-partnership h1 {
    font-size: 64px;
    margin-bottom: 30px;
    color: #fff;
}
.Partnershipprogram {
    padding: 10rem 0;
}
.title-program {
    margin-bottom: 5rem;
}
.title-program h1 {
    text-align: center;
    font-size: 50px;
    margin-bottom: 30px;
    color: #fff;
}
.title-program h1 span {
    color: #19b0f5;
}
.title-program p {
    text-align: center;
    color: #fff;
}
.desc-program {
    display: flex;
    align-items: center;
    color: #fff;
}
.image-program {
    border-radius: 15px;
    object-fit: cover;
    height: 586px;
} */







/* PARTNERSHIP */
.Partnershipprogram2 {
    margin-top: -12rem;
    background-image: url(image/Rectangle\ 19383.png);
    background-size: cover;
    background-position: center;
    height: 600px;
    display: flex;
    align-items: center;
    color: #fff;
}
.image-program2 {
    display: flex;
    align-items: center;
}
.img-program2 {
    object-fit: cover;
    height: 457px;
    border-radius: 12px;
}
.desc-program2 {
    display: flex;
    align-items: center;
    color: #fff;
}
.Benefitprogram {
    padding: 10rem 0;
}
.title-benefit {
    text-align: center;
    margin-bottom: 30px;
}
.title-benefit h1 {
    font-size: 50px;
    color: #fff;
}
.title-benefit h1 span {
    color: #19b0f5;
}
.box-benefit {
    color: #fff;
}
/* END PARTNERSHIP */




/* JOIN US */
.JoinUs {
    padding-bottom: 10rem;
    color: #fff;
}
.title-join {
    text-align: center;
}
.title-join h1 {
    font-size: 50px;
    margin-bottom: 30px;
}
.title-join h1 span {
    color: #007bff;
}
.button-partnership {
    padding: 5px;
    border-radius: 5px;
    width: 100%;
    background-color: #19b0f5;
    border: 1px solid #19b0f5;
    color: #fff;
}
/* END JOIN US */


.overlay-bg-blue {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: linear-gradient(180deg, #19B0F5 -18.36%, rgba(25, 176, 245, 0) 35.57%);
}
.image-more img {
    width: 100%;
}
.line-more {
    width: 112px;
    height: 5px;
    background-color: #fff;
    border-radius: 3px;
}
.top-line {
    text-align: center;
}
.top-line p {
    margin-bottom: 0 !important;
    color: #fff;
}
.box-inner {
    text-align: center;
    color: #fff;
}
.box-inner-lit h1 {
    font-size: 49px;
    margin-bottom: 30px;
    color: #fff;
}
.box-inner-lit p {
    margin-bottom: 5rem;
}







/* .Visittenant {
    padding-bottom: 10rem;
}
.title-visit h1 {
    position: relative;
    font-size: 50px;
    margin-bottom: 50px;
    color: #fff;
}
.title-visit h1 img {
    position: absolute;
    top: -30px;
    left: 300px;
}
.image-visit img {
    width: 100%;
    object-fit: cover;
    height: 300px;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
    transform: scale(1);
    transition: all 300ms ease-in-out;
}
.title-card-visit {
    margin-bottom: 1rem;
}
.desc-card-visit {
    margin-bottom: 2rem;
}
.button-visit {
    width: 100%;
    padding: 5px 0;
    border: 1px solid #2592f6;
    transition: all 300ms ease-in-out;
}
.button-visit a {
    text-decoration: none;
    display: flex;
    justify-content: center;
}
.button-visit:hover {
    background-color: #2592f6;
}
.button-visit:hover a {
    color: #fff;
} 
.padding-card-visit {
    padding: 30px 20px;
}
.card-visittenant {
    border-radius: 20px;
    background-color: #f8f8f8;
    margin-bottom: 30px;
    cursor: pointer;
}
.image-visit {
    overflow: hidden;
    border-top-left-radius: 20px;
    border-top-right-radius: 20px;
}
.card-visittenant:hover img {
    transform: scale(1.1);
} */





/* MERCHANDISE */
.Merchandise {
    position: relative;
    padding: 5rem 0;
    color: #fff;
}
.title-merchandise {
    text-align: center;
    color: #fff;
    margin-bottom: 50px;
}
.title-merchandise h1 {
    font-size: 50px;
}
.title-merchandise2 {
    text-align: center;
    position: relative;
}
.title-merchandise2 h1 {
    color: #003169;
    font-size: 58px;
    text-align: center;
    font-family: leaguespartan_bold;
}
.title-merchandise2 p {
    color: #003169;
    font-size: 20px;
    margin-bottom: 30px;
    text-align: center;
    font-family: montserrat_medium;
}
.image-merchandise img {
    object-fit: cover;
    height: 320px;
    width: 100%;
    border-radius: 12px;
}
.image-merchandise {
    margin-bottom: 1rem;
}
#Filter {
    position: relative;
}
.title-merchan {
    color: #003169;
}
.title-merchan h3,
.color-merchan p,
.type-merchan p {
    font-family: montserrat_medium;
    font-size: 18px;
}
.color-merchan p {
    margin-bottom: 0 !important;
    color: #003169;
}
.box-category-merchan {
    display: none;
}
.category-merchan {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px;
    gap: .5rem;
    background: #fff;
    width: 200px;
    border-radius: 5px;
    cursor: pointer;
}
.category-merchan p {
    margin-bottom: 0 !important;
    color: #000;
}
.indicator-merchan {
    display: flex;
    justify-content: center;
}
.indicator-merchan-web {
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    margin: 0 auto;
    gap: 2rem;
    background-color: #fff;
    width: fit-content;
    color: #000;
    padding: 10px 20px;
    margin-bottom: 30px;
    border-radius: 10px;
}
.text-merchan-center {
    text-align: center;
    color: #003169;
    font-family: montserrat_medium;
}
.indicator-merchan-web a {
    padding: 7px 10px;
    border-radius: 10px;
    text-decoration: none;
    color: #003169;
    font-family: montserrat_medium;
}
.indicator-merchan-web a.active {
    background-color: #00A9EE;
    color: #fff;
}
.price-merchan {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.price-merchan p {
    margin-bottom: 0 !important;
}
.download-merchan {
    position: relative;
    text-align: center;
    z-index: 4;
    margin-top: 5rem;
}
.download-merchan .btn-more {
    padding: 10px 20px;
    border-radius: 50px;
    outline: none;
    border: none;
    background: #00A9EE;
    text-decoration: none;
    color: #fff;
    font-family: montserrat_bold
}
.indicator-merchan-web2 {
    display: none;
}
.kerang2 {
    width: 250px;
    position: absolute;
    right: 0;
    top: -40%;
}
/* END MERCHANDISE */






/* FAQ */
.FAQ {
    position: relative;
    padding: 5rem 0 10rem 0;
    color: #fff;
}
.title-faq {
    display: flex;
    align-items: end;
    justify-content: center;
    margin-bottom: 50px;
    gap: .5rem;
    color: #fff;
}

.title-faq h1 {
    font-size: 50px;
    margin-bottom: 0 !important;
    font-family: leaguespartan_bold;
}
.title-faq p {
   margin-bottom: 0 !important;
}
.faq {
    width: 100%;
    margin-top: 1rem;
    padding: 0 2rem 1rem 2rem;
    background: #003169;
    cursor: pointer;
    border-radius: 10px;
}
.question {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.answer {
    max-height: 0;
    overflow: hidden;
    transition: max-height .6s ease;
}
.answer p {
    padding-top: 1rem;
    line-height: 1.6;
    font-family: montserrat_medium;
}
.faq.active .answer {
    max-height: 600px;
}
.faq.active .arrow {
    transform: rotate(180deg);
}
.arrow {
    transition: transform .2s ease-in;
}
.border-bottom-blue {
    color: #cce169;
    border-bottom: 2px solid #cce169;
}
.header-question h4 {
    font-family: leaguespartan_bold;
}
.shark3 {
    width: 500px;
    position: absolute;
    right: 0;
    bottom: -50px;
}
.title-question h1 {
    margin-top: 4rem;
    color: #003169;
    text-transform: capitalize;
    font-family: leaguespartan_bold;
}
@media (max-width: 992px) {
    .shark3 {
        width: 300px;
        bottom: 0;
    }
}
/* END FAQ */




/* TENANT KAMI */
.hand {
    position: relative;
}
.hand-image {
    width: 100%;
    height: 610px;
    border-radius: 12px;
    object-fit: cover;
}
.overlay-barcode {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: -1;
    transition: all 200ms ease-in-out;
    cursor: pointer;
    background: rgba(255, 255, 255, 0.8);
    border-radius: 12px;
    overflow-y: auto;
}
.overlay-barcode img {
    width: 100%;
    height: 250px;
    border-top-left-radius: 12px;
    border-top-right-radius: 12px;
}
.box-overlay-barcode {
    padding: 20px;
}
.box-overlay-barcode h2 {
    color: #003169;
    font-family: leaguespartan_bold;
}
.box-overlay-barcode p {
    color: #003169;
    font-family: montserrat_medium;
}
.btn-detail-tenant {
    margin-top: 12px;
}
.btn-detail-tenant a {
    display: inline-block;
    padding: 8px 20px;
    background: #003169;
    color: #fff;
    text-decoration: none;
    border-radius: 8px;
    font-family: montserrat_medium;
    font-size: 14px;
    transition: background 0.2s;
}
.btn-detail-tenant a:hover {
    background: #00a9ee;
}

/* FODEGRAF POPUP */
.fodegraf-popup-overlay,
.tenant-popup-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 9998;
}
.fodegraf-popup-overlay.active,
.tenant-popup-overlay.active {
    display: block;
}
.fodegraf-popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background: #fff;
    border-radius: 16px;
    width: 90%;
    max-width: 540px;
    max-height: 90vh;
    overflow-y: auto;
    z-index: 9999;
    box-shadow: 0 20px 60px rgba(0,0,0,0.3);
    -webkit-overflow-scrolling: touch;
}
.fodegraf-popup.active {
    display: block;
}
.fodegraf-popup-header {
    background: #003169;
    color: #fff;
    padding: 20px 24px;
    border-radius: 16px 16px 0 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: sticky;
    top: 0;
    z-index: 1;
}
.fodegraf-popup-header h3 {
    font-family: leaguespartan_bold;
    font-size: 22px;
    margin: 0;
    color: #fff;
}
.fodegraf-popup-close {
    background: none;
    border: none;
    color: #fff;
    font-size: 20px;
    cursor: pointer;
    line-height: 1;
    padding: 0;
    transition: opacity 0.2s;
}
.fodegraf-popup-close:hover {
    opacity: 0.7;
}
.fodegraf-popup-body {
    padding: 24px;
}
.fodegraf-popup-intro {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 15px;
    margin-bottom: 20px;
    line-height: 1.6;
}
.fodegraf-popup-body h4 {
    font-family: leaguespartan_bold;
    color: #003169;
    font-size: 20px;
    margin-bottom: 12px;
}
.fodegraf-popup-body ul {
    list-style: none;
    padding: 0;
    margin-bottom: 20px;
}
.fodegraf-popup-body ul li {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 15px;
    padding: 6px 0 6px 16px;
    position: relative;
    line-height: 1.5;
}
.fodegraf-popup-body ul li::before {
    content: '•';
    position: absolute;
    left: 0;
    color: #003169;
}
.fodegraf-popup-note {
    font-family: montserrat_medium;
    font-size: 13px;
    color: #003169;
    font-weight: 700;
    line-height: 1.6;
    margin-bottom: 20px;
}
.fodegraf-popup-promos {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
}
.fodegraf-popup-promos img {
    width: 100%;
    border-radius: 8px;
    object-fit: cover;
}
@media (max-width: 480px) {
    .fodegraf-popup-header h3 {
        font-size: 18px;
    }
    .fodegraf-popup-body {
        padding: 16px;
    }
    .fodegraf-popup-promos {
        grid-template-columns: repeat(2, 1fr);
    }
}
/* END FODEGRAF POPUP */
.hand-image {
    cursor: pointer;
}
.hand:hover .overlay-barcode {
    opacity: 1;
    z-index: 1;
}
.desc-ooverlay-tenant {
    padding: 40px 20px;
}
.desc-ooverlay-tenant h2 {
    font-family: montserrat_bold;
    font-weight: 700;
}
/* END TENANT KAMI */






/* CONTACT US */
.Contactus {
    position: relative;
    color: #fff;
    padding: 5rem 0;
}
.title-contactus {
    text-align: center;
}
.title-contactus img {
    margin-bottom: 20px;
}
.title-contactus h1 {
    font-size: 50px;
    margin-bottom: 30px;
}
.title-contactus p {
    margin-bottom: 50px;
}
.bg-image-contact {
    position: relative;
    height: 537px;
}
.box-contact {
    display: flex;
    align-items: end;
    justify-content: center;
}
.box-card-contactus {
    display: flex;
    justify-content: end;
}
.box-card-contactus3 {
    display: flex;
    justify-content: start;
}
.overlay-desc-contactus {
    width: 80%;
}
.card-contactus a {
    color: #fff;
    text-decoration: none;
}
.overlay-hero-image3 {
    position: absolute;
    z-index: -1;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #19B0F5;
    opacity: .7;
}
.form-row input {
    width: 100%;
    height: 60px;
    outline: none;
    border-radius: 8px;
    border: 0;
    margin-top: 10px;
    background: #fff;
    padding-left: 20px;
}
.form-row textarea {
    width: 100%;
    height: 200px;
    outline: none;
    border-radius: 8px;
    border: 0;
    margin-top: 10px;
    padding-top: 10px;
    padding: 20px;
    background: #fff;
}
.form-row1 h5 {
    font-family: montserrat_bold;
    color: #003169;
}
.title-Contactus {
    margin-bottom: 50px;
}
.title-Contactus h1 {
    color:#003169;
    font-size: 58px;
    font-family: leaguespartan_bold;
}
.title-Contactus p {
    color:#003169;
    font-size: 20px;
    font-family: montserrat_medium;
}
.octopus {
    position: absolute;
    right: 2%;
    top: 0;
    width: 450px;
}
.octopus2 {
    top: 20%;
    position: absolute;
    right: 0;
    width: 450px;
}
.submit-message a {
    text-decoration: none;
    padding: 10px 20px;
    background-color: #FF3A93;
    color: #fff;
    font-family: montserrat_medium;
    border-radius: 10px;
}
/* END CONTACT US */






/* DETAILSCHOOL */
.title-detail-schoolpackage {
    position: relative;
    margin-bottom: 50px; 
}
.title-detail-schoolpackage h1 {
    font-size: 58px;
    text-align: left;
    color: #003169;
    font-family: librebaskerville;
}
.title-book-schoolpackage h1 {
    color: #82E8FF;
}
.Book-schoolpackage {
    position: relative;
    padding-bottom: 5rem;
}
.box-title-book-schoolpackage {
    display: flex;
    align-items: flex-end;
    color: #fff;
}
.box-booknow {
    padding: 2rem;
    background: linear-gradient(180deg, #45C5FF 0%, #0B0C4F 100%),
    linear-gradient(0deg, #FFFFFF, #FFFFFF);
    border: 4px solid #fff;
}
.box-desc-booknow {
    display: flex;
    align-items: center;
    gap: .5rem;
    color: #fff;
}
.box-desc-booknow p {
    margin-bottom: 0 !important;
}
.box-button-book-schoolpackage {
    display: flex;
    align-items: center;
    justify-content: end;
}
.button-book-schoolpackage a {
    padding: 10px 55px;
    background-color: #82e8ff;
    color:#204280;
    text-decoration: none;
    font-weight: 700;
    border-radius: 12px;
}
.image-school-package_ img {
    object-fit: cover;
    width: 100%;
    height: 300px;
    border: 4px solid #fff;
    margin-bottom: -50px;
    border-radius: 13px;
}
.fish7 {
    position: absolute;
    top: -15%;
    left: 10%;
}
.shark5 {
    position: absolute;
    right: 20%;
    top: 8%;
    z-index: 2;
}
.mb-400 {
    margin-top: 5.8rem;
}
/* END DETAIL SCHOOL */

/* WHATSNEW */
.latest-news-section {
    padding: 6rem 0;
}
.latest-news-section-box {
    background-color: #F4F9FF;
    padding: 40px 30px;
}
.latest-news-title {
    font-family: leaguespartan_bold;
    color: #003169;
    font-size: 32px;
    margin-bottom: 1.5rem;
}
.latest-news-feature {
    padding: 20px;
    display: grid;
    align-items: center;
    grid-template-columns: 430px 1fr;
    gap: 1.5rem;
    text-decoration: none;
}
.latest-news-feature-image img {
    width: 100%;
    aspect-ratio: 9/9;
    object-fit: cover;
    border-radius: 10px;
}
.latest-news-feature-content h3 {
    font-family: leaguespartan_bold;
    color: #003169;
    font-size: 32px;
    line-height: 1;
    margin-bottom: 8px;
}
.latest-news-feature-content p {
    font-family: montserrat_medium;
    color: #003169;
    margin-bottom: 12px;
}
.latest-news-feature-content span {
    font-family: montserrat_medium;
    font-size: 14px;
    color: #4e79aa;
}

.whats-hub-section {
    padding: 2rem 0 8rem;
}
.whats-hub-tabs {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-bottom: 2.5rem;
}
.whats-hub-tab {
    border: none;
    background: transparent;
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #6e8fb6;
    transition: all 250ms ease;
    padding: 0 8px;
}
.whats-hub-tab.is-active {
    color: #003169;
}

.whats-hub-panel {
    display: none;
}
.whats-hub-panel.is-active {
    display: block;
}

.whats-hub-toolbar {
    display: flex;
    justify-content: flex-end;
    gap: 10px;
    margin-bottom: 1rem;
}
.whats-hub-toolbar button {
    border: none;
    background: transparent;
    color: #4e79aa;
    font-family: montserrat_medium;
    font-size: 13px;
}

.whats-grid-small {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 18px;
}
.whats-card-small {
    text-decoration: none;
}
.whats-card-small img {
    aspect-ratio: 9/9;
    width: 100%;
    object-fit: cover;
    border-radius: 10px;
    margin-bottom: 8px;
}
.whats-card-small span {
    display: block;
    font-family: montserrat_medium;
    color: #4e79aa;
    font-size: 12px;
    margin-bottom: 6px;
}
.whats-card-small h4 {
    font-family: leaguespartan_bold;
    color: #003169;
    font-size: 23px;
    line-height: 1;
    margin: 0;
}

.whats-hub-button-wrap {
    margin-top: 1.5rem;
    text-align: center;
}
.whats-hub-button-wrap a {
    text-decoration: none;
    color: #fff;
    background: #00a9ee;
    border-radius: 999px;
    font-family: leaguespartan_bold;
    font-size: 14px;
    padding: 8px 22px;
}

.whats-conservation-intro {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 2rem;
    margin-bottom: 2rem;
}
.whats-conservation-intro p {
    font-family: montserrat_medium;
    color: #003169;
    font-size: 20px;
    line-height: 1.2;
}

.whats-grid-large {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
}
.whats-card-large {
    position: relative;
    border-radius: 16px;
    overflow: hidden;
    display: block;
}
.whats-card-large img {
    aspect-ratio: 9/9;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.whats-card-large::before {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to top, rgba(0, 29, 62, 0.75), rgba(0, 29, 62, 0.12));
}
.whats-card-large-overlay {
    position: absolute;
    left: 24px;
    right: 24px;
    bottom: 18px;
    z-index: 2;
}
.whats-card-large-overlay h4 {
    color: #fff;
    font-family: leaguespartan_bold;
    font-size: 20px;
    line-height: 1;
    margin-bottom: 6px;
}
.whats-card-large-overlay span {
    color: #fff;
    font-family: montserrat_medium;
}

@media (max-width: 991px) {
    .latest-news-feature {
        grid-template-columns: 1fr;
    }
    .whats-hub-tab {
        font-size: 40px;
    }
    .whats-grid-small {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
    .whats-conservation-intro,
    .whats-grid-large {
        grid-template-columns: 1fr;
    }
    .whats-card-large {
        min-height: 340px;
    }
}

@media (max-width: 575px) {
    .latest-news-section {
        padding: 3rem 0 1rem;
    }
    .latest-news-title {
        font-size: 24px;
    }
    .latest-news-feature-content h3 {
        font-size: 24px;
    }
    .whats-hub-tab {
        font-size: 32px;
    }
    .whats-grid-small {
        grid-template-columns: 1fr;
    }
}

.grass53 {
    position: absolute;
    left: 0;
    top: -10%;
    z-index: -1;
}
.grass54 {
    position: absolute;
    left: 7%;
    top: 0;
    z-index: -1;
}
.grass55 {
    position: absolute;
    top: 0;
    right: 0;
}
.grass56 {
    position: absolute;
    right: 5%;
    top: 20%;
    height: 1600px;
}
.grass57 {
    position: absolute;
    bottom: -65%;
    left: -5%;
    z-index: -1;
}
.grass58 {
    position: absolute;
    bottom: -65%;
    right: -5%;
    z-index: -1;
}
.grass59 {
    position: absolute;
    bottom: -10%;
    left: 10%;
    z-index: -1;
}
.grass60 {
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    transform: rotate(180deg);
}
.grass61 {
    position: absolute;
    top: 0;
    left: 23%;
    z-index: -1;
}
.grass62 {
    position: absolute;
    top: 0;
    left: 43%;
    z-index: -1;
}
.grass63 {
    position: absolute;
    top: 0;
    right: 0;
    z-index: -1;
}

.detail-news-page {
    background: #d8e5f5;
    padding: 5rem 0;
}
.detail-news-article {
    max-width: 760px;
    margin: 0 auto;
}
.detail-news-cover {
    display: block;
    aspect-ratio: 9/9;
    width: 500px;
    object-fit: cover;
    border-radius: 8px;
    margin: 0 auto 1.5rem;
}
.detail-news-title {
    font-family: leaguespartan_bold;
    color: #003169;
    font-size: 40px;
    line-height: 1;
    margin-bottom: 1rem;
}
.detail-news-meta {
    color: #3b6ea5;
    font-family: montserrat_medium;
    font-size: 20px;
    margin-bottom: 1.5rem;
}
.detail-news-content {
    border-top: 1px solid #9db7d6;
    border-bottom: 1px solid #9db7d6;
    padding: 1.5rem 0;
}
.detail-news-content p {
    color: #003169;
    font-family: montserrat_medium;
    font-size: 18px;
    line-height: 1.6;
    margin-bottom: 1rem;
}
.detail-news-inline-gallery {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
    margin: 1.2rem 0;
}
.detail-news-inline-gallery img {
    width: 100%;
    border-radius: 8px;
    height: 220px;
    object-fit: cover;
}

@media (max-width: 575px) {
    .detail-news-page {
        padding: 2.5rem 0;
    }
    .detail-news-article {
        max-width: 100%;
    }
    .detail-news-cover {
        width: 160px;
        height: 160px;
        margin-bottom: 1rem;
    }
    .detail-news-title {
        font-size: 22px;
        line-height: 1.2;
    }
    .detail-news-meta {
        font-size: 13px;
        margin-bottom: 1rem;
    }
    .detail-news-content {
        padding: 1rem 0;
    }
    .detail-news-content p {
        font-size: 12px;
        line-height: 1.45;
    }
    .detail-news-inline-gallery {
        gap: 8px;
        margin: 1rem 0;
    }
    .detail-news-inline-gallery img {
        height: 120px;
    }
}
.title-whats-new h1 {
    font-family: librebaskerville;
    font-size: 58px;
    color: #003169;
    text-align: left;
    margin-top: -60px;
}
/* END WHATNEW */








/* PLAN YOUR VISIT */
.floormap-journey {
    position: relative;
    padding: 5rem 0;
}
.title-floormap {
    position: relative;
    text-align: center;
    margin-bottom: 30px;
    z-index: 2;
}
.title-floormap h1 {
    color: #7BE3FF;
    font-size: 50px;
    margin-bottom: 30px;
}
.title-floormap h1 {
    position: relative;
}
.title-floormap p {
    color: #fff;
}
.title-floormap h1 img {
    position: absolute;
    right: 28%;
    top: -25px;
}
.owl-floormap {
    position: relative;
}
.owl-floormap .owl-item .image-curve {
    height: 465px;
    object-fit: cover;
}
.image-curve {
    height: 465px;
    object-fit: cover;
    border-radius: 12px;
}
.items-owl-floormap {
    position: relative;
}
.overlay-bg-images-owl-floormap {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: -moz-linear-gradient(top, rgba(0, 0, 0,0.2) 0%, rgba(0, 0, 0,0.2) 50%, rgba(0, 0, 0,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0,0.2) 0%,rgba(0, 0, 0,0.2) 50%,rgba(0, 0, 0,1) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0,0.2) 0%,rgba(0, 0, 0,0.2) 50%,rgba(0, 0, 0,1) 100%);
}
.overlay-desc-floormap {
    position: absolute;
    bottom: 25%;
    left: 10px;
    color: #fff;
}
.owl-floormap .owl-item .image-lit-floormap {
    width: 20px;
}
.location-floormap span,
.day-floormap span {
    color: #fff;
}
.detail-overlay-floomap {
    display: flex;
    gap: 3rem;
    margin-bottom: 2rem;
}
.location-floormap,
.day-floormap {
    display: flex;
    gap: .5rem;
    align-items: center;
}
.owl-floormap .owl-item .image-lit-chevron {
    width: 16px;
}
.button-detail-floormap {
    display: flex;
    align-items: center;
    gap: .5rem;
}
.button-detail-floormap a {
    text-decoration: none;
    color: #fff;
}
.grass17 {
    z-index: -3;
    left: 0;
    width: 100%;
    position: absolute;
    bottom: -10px;
}
.saltwater {
    bottom: -200px;
    position: absolute;
    left: 0;
}
.shark2 {
    bottom: -200px;
    position: absolute;
    right: 0;
}
.guide-acces {
    position: relative;
}
.guide {
    padding-bottom: 20rem;
    color: #fff;
}
.title-guide {
    text-align: center;
    margin-bottom: 50px;
    color: #fff;
}
.title-guide h1 {
    margin-bottom: 30px;
}
.align-image-end {
    display: flex;
    align-items: end;
}
.align-image-end img {
    width: 100%;
    object-fit: cover;
}
.align-image-end1 {
    height: 287px;
    border-radius: 12px;
}
.align-image-end2 {
    height: 318px;
    border-radius: 12px;
}
.align-left-center {
    display: flex;
    align-items: end;
}
.akar5 {
    position: absolute;
    left: -40%;
    top: -15%;
    z-index: -3;
}
.akar6 {
    position: absolute;
    right: -40%;
    top: -15%;
    z-index: -3;
}
.frog2 {
    position: absolute;
    right: 10%;
    top: 0;
    transform: rotateY(180deg);
}
/* END PLAN YOUR VISIT */







/* SCHEDULE */
.schedule {
    position: relative;
    padding: 5rem 0 5rem 0;
}
.title-schedule {
    width: 80%;
    color: #fff;
    margin-bottom: 3rem;
}
.title-schedule h2,
.tips-schedule h2 {
    color: #82E8FF;
}
.tips-schedule {
    color: #fff;
    width: 80%;
}
.tips-schedule {
    margin-bottom: 4rem;
}
.tips-schedule ul li {
    margin-bottom: 1rem;
    font-family: montserrat_medium;
}
.image-date- {
    background-color:#EFEFEF;
    padding: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 5px;
}
.bg-schedule {
    position: relative;
    padding: 20px;
    background-color: #fff;
    margin-bottom: 1rem;
    border-radius: 10px;
}
.bunga {
    position: absolute;
    right: -5%;
    width: 200px;
    top: -450%;
}
.royal-navy .calendar-sidebar {
    background: #E76D55;
    box-shadow: none;
}
.royal-navy tr.calendar-body .calendar-day .day.calendar-today {
    background-color: #E76D55;
}
.royal-navy .calendar-events {
    background: #fff;
}
.royal-navy #eventListToggler {
    background-color: #E76D55;
    box-shadow: none;
    z-index: 3;
}
.royal-navy .calendar-events {
    color: #000;
}
.royal-navy .calendar-events > .event-header > p {
    color: #000;
    font-family: montserrat_bold;
    font-size: 23px;
}
.royal-navy .event-container > .event-info > p {
    color: #000;
}
.box-month,
.box-year {
    color: #fff;
    font-family: montserrat_bold;
    cursor: pointer;
}
.box-month .form-control,
.box-year .form-control {
    outline: none;
    border: 0;
    font-family: montserrat_bold;
    background-color: #EFEFEF;
    padding: 10px;
}
.search-date {
    width: 100%;
    padding: 10px;
    font-family: montserrat_bold;
    border-radius: 5px;
    background-color: #EFEFEF;
    color: #000;
    border: none;
}
.royal-navy .event-container > .event-info > p.event-title > span {
    color: #EFEFEF;
    border: 0;
    border-radius: 15px;
    background-color: #E76D55;
}
.calendar-inner .calendar-table {
    font-family: montserrat_bold;
}
.calendar-sidebar > .month-list > .calendar-months {
    font-family: montserrat_bold;
}
.royal-navy th[colspan="7"] {
    color: #000;
}
.royal-navy th[colspan="7"]::after {
    display: none;
}
.calendar-sidebar > .calendar-year > p {
    margin: 0px;
    font-size: 20px;
    display: inline-block;
}
.calendar-sidebar > .calendar-year > button.icon-button {
    width: 10px;
    height: 10px;
}
.calendar-sidebar > .calendar-year > button.icon-button > span {
    border-right: 3px solid #fff;
    border-bottom: 3px solid #fff;
    width: 100%;
    height: 100%;
}
.royal-navy .calendar-sidebar > span#sidebarToggler {
    background-color: #E76D55;
    display: flex;
}
.royal-navy .event-container > .event-info > p {
    font-size: 16px;
}
.btn-schedule {
    margin: 80px 0;
    display: flex;
    justify-content: center; 
}
.btn-schedule a {
    text-decoration: none;
    border-radius: 10px;
    padding: 15px 20px;
    font-family: montserrat_medium; 
    font-size: 16px;
    background-color: #00A9EE;
    color: #fff;
}
.btn-schedule a:hover {
    background-color: #fff;
    color: #00A9EE;
    transition: all 300ms ease-in-out;
}  
.note-schedule {
    font-family: montserrat_medium;
    text-align: left;
    color: #003169;
    font-size: 20px;
    margin-bottom: 80px;
} 
.btn-schedule-more a {
    text-decoration: none;
    border-radius: 10px;
    font-family: montserrat_bold; 
    font-size: 20px;
    color: #003169;
}
.btn-schedule-more a img {
    width: 8px;
}   
.btn-schedule-more a:hover .arrow-right-btn-schedule-more  {
    transform: translateX(5px);
    transition: all 300ms ease-in-out;
} 

/* END SCHEDULE */









/* MAP OCEANARIUM */
.map-oceanarium {
    position: relative;
    padding: 10rem 0;
}
.desc-premium h1 {
    font-size: 50px;
}
.desc-premium p {
    font-size: 24px;
}
.grass17 {
    position: absolute;
    bottom: -10px;
    width: 100%;
}
.iguana3 {
    width: 400px;
    position: absolute;
    top: -6.5%;
    right: -5%;
}
.image-map-oceanarium {
    position: relative;
}
.image-map-oceanarium .bxsea-map {
    width: 100%;
}
.grass36 {
    bottom: 0;
    left: 0;
    height: 1400px;
    position: absolute;
    z-index: -3;
}
.grass37 {
    position: absolute;
    bottom: 0;
    left: 5%;
    height: 1200px;
    z-index: -3;
}
.grass38 {
    top: -10%;
    position: absolute;
    z-index: -3;
}
.grass39 {
    bottom: -5%;
    width: 100%;
    position: absolute;
    left: 0;
}
.grass40 {
    bottom: -5%;
    position: absolute;
    right: 3%;
    z-index: -3;
}
.grass41 {
    bottom: -5%;
    position: absolute;
    right: 0;
    z-index: -3;
}
.grass42 {
    width: 300px;
    bottom: 10%;
    position: absolute;
    left: 4%;
    z-index: 2;
}
.download-map {
    position: relative;
    text-align: center;
    z-index: 4;
    margin-top: 5rem;
}
.download-map a {
    padding: 15px 20px;
    border-radius: 12px;
    background: #00A9EE;
    text-decoration: none;
    color: #fff;
    font-family: montserrat_medium;
    font-size: 16px;
}
.download-map a:hover {
    background-color: #fff;
    color: #00A9EE;
    transition: all 300ms ease-in-out;
}
.download-map a:hover .arrow-download-map {
    filter: brightness(0) saturate(100%) invert(51%) sepia(23%) saturate(4582%) hue-rotate(165deg) brightness(97%) contrast(103%);
    transition: all 300ms ease-in-out;
}
/* END MAP OECANARIUM */





/* GUIDE */
.accessibility-guide {
    position: relative;
    padding: 5rem 0;
}
.accessibility-guide .title {
    color: #003169; 
    font-size: 58px;
    font-family: librebaskerville;
}
.accessibility-guide .desc {
    color: #003169;
    font-size: 20px;
    font-family: montserrat_medium;
    width: 50%;
    margin-bottom: 50px;
}
.accessibility-guide .sub-title {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003169;
}
.accessibility-guide .sub-desc {
    color: #003169;
    font-size: 20px;
    font-family: montserrat_medium;
    margin-bottom: 20px;
}
.accessibility-guide .card-custom img {
    width: 100%;
}
.accessibility-guide .card-custom p {
    color: #003169;
    font-size: 32px;
    font-family: leaguespartan_bold;
    text-align: center;
    background-color: #fff;
    padding: 10px 0 25px 0;
    border-bottom-left-radius: 12px;
    border-bottom-right-radius: 12px;
}
.accessibility-guide .note {
    color: #003169;
    font-size: 20px;
    font-family: montserrat_medium;
    margin: 20px 0 0 0;
}
@media (max-width: 1400px) {
    .accessibility-guide .desc {
        width: 55%;
    }
}
@media (max-width: 1200px) {
    .accessibility-guide .desc {
        width: 65%;
    }
}
@media (max-width: 991px) {
    .accessibility-guide .desc {
        width: 100%;
    }
}
/* END GUIDE */









.desc-banner {
    text-align: center;
    color: #fff;
    font-size: 24px;
}
.overlay-bg-images-buyticket {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    border-radius: 12px;
    background: -moz-linear-gradient(top, rgba(0, 0, 0,0.2) 0%, rgba(0, 0, 0,0.2) 50%, rgba(0, 0, 0,1) 100%);
    background: -webkit-linear-gradient(top, rgba(0, 0, 0,0.2) 0%,rgba(0, 0, 0,0.2) 50%,rgba(0, 0, 0,1) 100%);
    background: linear-gradient(to bottom, rgba(0, 0, 0,0.2) 0%,rgba(0, 0, 0,0.2) 50%,rgba(0, 0, 0,1) 100%);
}
.shadow-image-iframe {
    box-shadow: 0 23px 23px -21px rgba(0, 0, 0, 0.25);
}
.slider-items {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: -2;
}
.slider-items .slider-item {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    object-fit: cover;
    transition: all 300ms ease-in-out;
}
.slider-item {
    opacity: 0;
}

.slider-items2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: -2;
}
.slider-items2 .slider-item2 {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    object-fit: cover;
    transition: all 300ms ease-in-out;
}
.slider-item2 {
    opacity: 0;
}
.arr-down {
    width: 10px;
    height: 10px;
    border-top: 3px solid #fff;
    border-left: 3px solid #fff;
    transform: rotate(225deg);
    cursor: pointer;
    margin-bottom: 5px;
    transition: all 300ms ease-in-out;
}
.overlay-blue-bg-banner {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    background: -moz-linear-gradient(top, rgb(32,66,128, 0) 0%,rgb(32,66,128, 0.9) 98%, rgb(32,66,128, 1) 100%);
    background: -webkit-linear-gradient(top, rgb(32,66, 0) 0%,rgb(32,66,128 0.9) 98%,rgb(32,66,128, 1) 100%);
    background: linear-gradient(to bottom, rgb(32,66,128, 0) 0%,rgb(32,66,128, 0.9) 98%,rgb(32,66,128, 1) 100%);
}
.wave {
    position: absolute;
    top: 98%;
}






/* SHOW BXSea */
.ShowBXSea {
    position: relative;
    padding: 10rem 0;
}
.showbx-filter-tabs {
    display: flex;
    gap: 0;
    margin: 0 0 2rem;
    border-bottom: 2px solid #d0e4f5;
    justify-content: center;
}
.showbx-filter-tab {
    background: none;
    border: none;
    padding: 10px 22px;
    font-family: leaguespartan_bold;
    font-size: 15px;
    color: #8aaccc;
    cursor: pointer;
    position: relative;
    letter-spacing: 0.8px;
    transition: color 200ms ease;
    outline: none;
}
.showbx-filter-tab.active {
    color: #003169;
}
.showbx-filter-tab.active::after {
    content: '';
    position: absolute;
    bottom: -2px;
    left: 0;
    width: 100%;
    height: 3px;
    background: #003169;
    border-radius: 2px;
}
.showbx-card.showbx-hidden {
    display: none;
}
.showbx-card .hand {
    height: auto !important;
    width: 100%;
}
.showbx-card .hand-image {
    height: auto;
    aspect-ratio: 4/5;
}
.showbx-card[data-showbx="seapecial"] .hand-image {
    aspect-ratio: 16/9;
    height: auto;
}
.overlay-show {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    z-index: -1;
    transition: all 200ms ease-in-out;
    cursor: pointer;
    background: #fff;
    border-radius: 10px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
.desc-ooverlay-show {
    width: 100%;
    margin: auto 0;
}
.hand:hover .overlay-show {
    opacity: 1;
    z-index: 1;
}
.title-show {
    text-align: center;
}
.title-show h2 {
    font-size: 36px;
    font-family: leaguespartan_bold;
    color: #003169;
}
.desc-show {
    padding: 20px;
    text-align: center;
}
.paddingleft-show {
    padding-left: 6rem;
}
.desc-show p {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
}
.fox2 {
    position: absolute;
    top: -150%;
    left: 10%;
    z-index: 2;
}
.title-hand h1 {
    color: #003169;
    text-align: center;
    font-size: 30px;
    margin: 20px 0 30px 0;
    font-family: leaguespartan_bold;
}
.btn-show {
    display: flex;
    justify-content: center;
    margin-top: 2rem;
}
.btn-show a {
    background-color: #00A9EE;
    width: fit-content;
    padding: 7px 20px;
    border-radius: 10px;
    transition: 500ms;
    text-decoration: none;
    color: #fff;
    font-family: montserrat_semibold;
    font-size: 16px;
}
.btn-show a:hover {
    background-color: #fff;
    color: #00A9EE;
}
.arrow-right-btn-show {
    transition: transform 300ms ease;
    margin-bottom: 3px;
    margin-left: 3px;
}
.btn-show a:hover .arrow-right-btn-show {
    transform: translateX(5px);
    filter: brightness(0) saturate(100%) invert(58%) sepia(67%) saturate(5029%) hue-rotate(167deg) brightness(102%) contrast(102%);
}
/* END SHOW */


.explore-mainjourney-carousel .owl-stage-outer {
    border-radius: 12px;
}
.explore-mainjourney-carousel .owl-nav,
.explore-mainjourney-carousel .owl-dots {
    display: none;
}
.explore-mainjourney-carousel .card img {
    aspect-ratio: 16/9;
    height: auto;
    width: 100%;
    object-fit: cover;
}



/* ABOUTUS */
.custom-about {
    position: relative;
    padding: 5rem 0;
    background-image: url(/image/bxsea_image_bg_about_forest.png);
    background-size: cover;
    background-position-y: -600px;
    width: 100%;
}
.gurita-about {
    position: absolute;
    top: 10%;
    left: 0;
    z-index: 1;
}
/* TITLE */
.about-title {
  font-family: leaguespartan_bold;  
  font-size: 42px;
  color: #003169;
}

.about-desc {
  color: #003169;
  font-size: 20px;
  font-family: montserrat_medium;
}

/* CIRCLE */
.title-about-circle p {
    text-align: center;
    margin: 0 auto -50px auto;
    font-family: montserrat_medium;
    width: 300px;
    color: #003169;
    font-size: 20px;
}
.circle-box1 {
    display: flex;
    justify-content: end;
}
.circle-box2 {
    display: flex;
    justify-content: center;
}
.circle-box3 {
    display: flex;
    justify-content: start;
}
.circle-box4 {
    display: flex;
    justify-content: end;
}
.circle-box5 {
    display: flex;
    justify-content: start;
}
.circle-box6 {
    display: flex;
    justify-content: end;
}
.circle-box7 {
    display: flex;
    justify-content: start;
}
.circle1 {
  position: relative;
  width: 160px;
  height: 160px;
  background: #003169;
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 14px;
  margin: 0 -50px 0 0;
  font-family: montserrat_bold;
}
.circle1::before {
    content: '';
    position: absolute;
    top: -3.5px;
    left: -8px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background-color: #00A9EE;
    z-index: -1;
}
.circle2 {
  position: relative;
  margin-top: 100px;
  width: 160px;
  height: 160px;
  background: #003169;
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 14px;
  font-family: montserrat_bold;
}
.circle2::before {
    content: '';
    position: absolute;
    top: -3.5px;
    left: -8px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background-color: #00A9EE;
    z-index: -1;
}
.circle3 {
  position: relative;
  width: 160px;
  height: 160px;
  background: #003169;
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 14px;
  margin: 0 0 0 -30px;
  font-family: montserrat_bold;
}
.circle3::before {
    content: '';
    position: absolute;
    top: -3.5px;
    left: -8px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background-color: #00A9EE;
    z-index: -1;
}
.circle4 {
  position: relative;
  width: 160px;
  height: 160px;
  background: #003169;
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 14px;
  margin: -90px 0 0 0;
  font-family: montserrat_bold;
}
.circle4::before {
    content: '';
    position: absolute;
    top: -3.5px;
    left: -8px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background-color: #00A9EE;
    z-index: -1;
}
.circle5 {
  position: relative;
  width: 160px;
  height: 160px;
  background: #003169;
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 14px;
  margin: 0px 0 0 80px;
  font-family: montserrat_bold;
}
.circle5::before {
    content: '';
    position: absolute;
    top: -3.5px;
    left: -8px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background-color: #00A9EE;
    z-index: -1;
}
.circle6 {
  position: relative;
  width: 160px;
  height: 160px;
  background: #003169;
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 14px;
  margin: 0px 80px 0 0;
  font-family: montserrat_bold;
}
.circle6::before {
    content: '';
    position: absolute;
    top: -3.5px;
    left: -8px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background-color: #00A9EE;
    z-index: -1;
}
.circle7 {
    position: relative;
  width: 160px;
  height: 160px;
  background: #003169;
  color: #fff;
  border-radius: 50%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  font-size: 14px;
  margin: -90px 0 0 0;
  font-family: montserrat_bold;
}
.circle7::before {
    content: '';
    position: absolute;
    top: -3.5px;
    right: -2px;
    width: 170px;
    height: 170px;
    border-radius: 50%;
    background-color: #00A9EE;
    z-index: -1;
}

.circle span {
  font-size: 11px;
  opacity: 0.8;
}

/* GALLERY */
.gallery-img {
  border-radius: 12px;
  height: 250px;
  object-fit: cover;
  width: 100%;
}

/* TEXT BLOCK */
.about-text-block h4 {
  color: #003169;
  font-family: leaguespartan_bold;
  font-size: 32px;
}
.about-text-block p {
  font-size: 20px;
  color: #003169;
  font-family: montserrat_medium;
}
.about-button {
    margin-bottom: 50px;
}
.about-button a {
    text-decoration: none;
    color: #003169;
    font-family: montserrat_bold;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}
.about-button a:hover .arrow-right-about-button {
    transform: translateX(5px);
    transition: all 300ms ease-in-out;  
}
@media (max-width: 1628px) {
    .gurita-about {
       width: 350px;
    }
}
@media (max-width: 1290px) {
    .gurita-about {
       top: 15%;
    }
}
@media (max-width: 1200px) {
    .circle5 {
        margin: 0;
    }
    .circle6 {
        margin: 0;
    }
}
@media (max-width: 1090px) {
    .gurita-about {
       display: none;
    }
}
@media (max-width: 768px) {
    .circle-box1 {
        display: block;
    }
    .circle1 {
        margin: 10px auto;
    }
    .circle-box2 {
        display: block;
    }
    .circle2 {
        margin: 10px auto;
    }
    .circle-box3 {
        display: block;
    }
    .circle3 {
        margin: 10px auto;
    }
    .circle-box4 {
        display: block;
    }
    .circle4 {
        margin: 10px auto;
    }
    .circle-box5 {
        display: block;
    }
    .circle5 {
        margin: 10px auto;
    }
    .circle-box6 {
        display: block;
    }
    .circle6 {
        margin: 10px auto;
    }
    .circle-box7 {
        display: block;
    }
    .circle7 {
        margin: 10px auto;
    }
}
.about-card {
    position: relative;
    height: 100%;
}
.about-card p {
    position: absolute;
    font-size: 20px;
    color: #003169;
    font-family: montserrat_medium;
    padding: 20px;
    max-width: 300px;
    background-color: #fff;
    border-radius: 12px;
    bottom: -330px;
    right: 30px;
}
@media (max-width: 991px) {
    .about-card p {
        position: static;
        margin-top: 20px;
        max-width: 100%;
    }
}
/* END ABOUTUS */




/* PARTNERSHIP SECTION */
.meaningful-section {
  padding: 60px 0;
}

/* HEADER */
.header-section h2 {
    font-size: 48px;
    color: #003169;
    font-family: leaguespartan_bold;
}

.header-section p {
  font-size: 20px;
  color: #003169;
  font-family: montserrat_medium;
}

/* IMAGE */
.rounded-img {
  border-radius: 12px;
  height: 320px;
  object-fit: cover;
  width: 100%;
}

.partnership-section {
    background: #fff;
    padding: 5rem 0;
}

.partnership-box h5 {
    font-size: 48px;
    color: #003169;
    font-family: leaguespartan_bold;
}

/* CARD */
.card-partner {
  background: transparent;
  text-align: left;
}

.card-img {
  border-radius: 10px;
  height: 320px;
  width: 100%;
  object-fit: cover;
  margin-bottom: 10px;
}

.card-partner h6 {
    font-size: 28px;
    color: #003169;
    font-family: leaguespartan_bold;
}

.card-partner p {
  font-size: 20px;
  color: #003169;
  font-family: montserrat_medium;
}
/* END PARTNERSHIP */













/* SK */
.SK {
    position: relative;
    padding: 0 0 5rem 0;
}
.maxwidth {
    margin: auto;
    padding-top: 2rem;
    max-width: 750px;
    color: #003169;
    text-align: justify;
}
.footer-promotions a {
    font-weight: 700;
}
.royal-navy .calendar-events {
    color: #003169;
}
.evo-calendar {
    border-radius: 10px;
}
/* END SK */


/* detail blog */
.Detailblog {
    position: relative;
    padding: 0 0 5rem 0;
}
.title-detail-blog {
    color: #fff;
    text-align: center;
}
.maxwidth2 {
    margin: auto;
    max-width: 900px;
    color: #fff;
    text-align: justify;
    padding: 10rem 0;
}
/* detail blog */




@media screen and (max-width:992px) {


    /* NAVBAR */
    .header-navbar-contact {
        top: 0;
    }
    .top-bar {
        display: none;
    }
    .second-bar {
        display: none;
    }
    .megamenu {
        flex-direction: column;
        position: static;
        box-shadow: none;
        border-radius: 0;
        height: 0;
        max-width: 350px;
        overflow-x: hidden;
        gap: 0;
        padding: 0;
        background-color: #192c54;
    }
    .nav__list {
        position: absolute;
        width: 100%;
        left: -100%;
        top: 0;
        background-color: #192c54;
        flex-direction: column;
        overflow-x: hidden;
        display: block;
        transition: .3s;
        white-space: nowrap;
        padding-bottom: 40px;
    }
    .nav__list li {
        margin-bottom: 20px;
    }
    .nav__list .dropdown__menu- {
        display: block;
    }
    ul {
        padding-left: 0 !important;
    }
    .toggle__menu,
    .close__menu {
        display: block;
    }
    .toggle__menu {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 32px;
        height: 32px;
        background-color: #82e8ff;
        border-radius: 50%;
        cursor: pointer;
        margin-left: 10px;
    }
    .close__menu {
        display: flex;
        align-items: center;
        justify-content: center;
        margin: 1rem 1rem 1rem auto;
        width: 32px;
        height: 32px;
        background-color: #82e8ff;
        border-radius: 50%;
        cursor: pointer;
    }
    .nav__link {
        color: black;
    }
    .nav__link:hover {
        color: black;
    }
    .dropdown__menu-:hover .megamenu {
        height: 100%;
    }
    .navbar__menu a,
    .navbar__menu p {
        text-decoration: none;
        transition: 0.3s;
        text-transform: capitalize;
        color: #fff;
        font-family: montserrat_semibold;
    }
    .arr-down {
        border-color: #fff;
    }
    .contact {
        position: static;
        display: flex;
        justify-content: center;
        margin-bottom: 20px;
    }
    .title-megamenu-item h4 {
        font-size: 15px;
        margin-bottom: 10px;
        color: #fff;
    }
    .content li {
        padding-left: 10px;
        margin-bottom: 0 !important;
    }
    .navbar__menu a:hover {
        color: #fff;
    }
    .navbar__menu p:hover {
        color: #fff;
    }
    .text-dropdown-menu:hover p,
    .text-dropdown-menu:hover .arr-down {
        color: #fff;
        border-color: #fff;
    }
    .content .megamenu__item .megamenu__link a {
        font-family: montserrat_semibold;
        color: #fff;
    }
    .navbar-responsive {
        display: block;
    }
    .navbar-responsive img {
        width: 120px;
    }
    .sosmed-topbar2 {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 1rem;
    }
    .sosmed-topbar2 img {
        width: 20px;
        object-fit: cover;
    }
    .tiktok-img img {
        width: 17px;
    }
    .show__menu {
        left: 0;
    }
    .dropdown- {
        display: block;
        margin-inline-start: auto;
    }
    .menu2  {
        position: absolute;
        top: 3.5rem;
        background-color: #ededed;
        width: fit-content;
        text-align: center;
        border-radius: 5px;
        opacity: 0;
        padding: 0 10px;
        visibility: hidden;
        transition: .2s;
    }
    .menu2 li {
        list-style: none;
        padding: 10px;
        margin-right: 0;
    }
    .menu2 li a {
        text-decoration: none;
        color: #000;
    }
    .menu-open2 {
        display: block;
        opacity: 1;
        visibility: visible;
    }
    .select2 img {
        width: 20px;
    }
    .select2 img {
        width: 20px;
    }
    .select2 {
        display: flex;
        color: #fff;
        align-items: center;
        gap: .2rem;
        transition: .2s;
        cursor: pointer;
    }
    .select2 a {
        text-decoration: none;
    }
    .caret2 {
        width: 0;
        height: 0;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        border-top: 6px solid #fff;
        transition: .3s;
    }
    .caret-rotate2 {
        transform: rotate(180deg);
    }
    .text-dropdown-menu .arr-down {
        border-color: #fff;
    }
    .navbar__menu li {
        margin-right: 0;
    }
    /* END NAVBAR */
}




@media (max-width:767px) {

    .title-schedule {
        width: 100%;
        text-align: justify;
    }
    .tips-schedule {
        position: relative;
        z-index: 1;
        width: 100%;
        text-align: justify;
    }
    .swiper-button-next::after {
        font-size: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .swiper-button-next {
        color: #000;
        background-color: #fff;
        width: 40px;
        height: 40px;
        border-radius: 50%;
    }
    .swiper-button-prev::after {
        font-size: 20px;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .swiper-button-prev {
        color: #000;
        background-color: #fff;
        width: 40px;
        height: 40px;
        border-radius: 50%;
    }
    .mySwiper {
        width: 100%;
        height: 400px;
    }
    .bunglon {
        position: absolute;
        left: -10%;
        width: 250px;
        top: -240%;
        z-index: -1;
    }
    /* HOMEPAGE */
    .text-right br {
        display: none;
    }
    .descBanner {
        padding-top: 0;
    }
    .banner-title {
        font-size: 32px;
    }
    .banner-title br {
        display: none;
    }
    .image-absolute-review {
        display: none;
    }
    .fish {
        z-index: -1;
        width: 100px;
        top: -25%;
    }
    .fish2 {
        left: 10px;
        top: 35%;
    }
    .title-review-influencer h1 {
        font-size: 28px;
    }
    .review-influencer-splide .splide__arrow--next {
        right: 2rem;
    }
    .review-influencer-splide .splide__arrow--prev {
        left: 2rem;
    }
    .review-influencer-splide .splide__arrow {
        top: 86%;
    }
    .review-influencer {
        padding-bottom: 10rem;
    }
    .fish3 {
        width: 50px;
    }
    .fish4 {
        right: 0;
        top: 2rem;
        width: 50px;
    }
    .fish5 {
        width: 50px;
        right: 20px;
    }
    .fish6 {
        top: -45%;
        left: 0;
        width: 50px;
        z-index: -1;
    }
    .head-title-ticketing h1 {
        font-size: 32px;
    }
    .head-title-ticketing p {
        width: 100%;
    }
    .grass {
        bottom: -10px;
    }
    .title-journey-ocean h1 {
        font-size: 32px;
    }
    .title-journey-ocean h1 br {
        display: none;
    }
    .wave2 {
        top: 80px;
    }
    .wave3 {
        bottom: 70px;
    }
    .wave4 {
        top: 95px;
        width: 100px;
    }
    .wave5 {
        top: 130px;
        width: 80px;
    }
    .wave6 {
        width: 80px;
        right: 10%;
        bottom: 90px;
    }
    .wave7 {
        width: 100px;
        bottom: 100px;
        left: 15%;
    }
    .shark {
        width: 130px;
        top: 100px;
        right: 20%;
    }
    .Journeyocean {
        background-color: #182c53;
    }
    .overlay-image-journey {
        cursor: pointer;
        z-index: 8;
        left: 50%;
        bottom: 50%;
        transform: translate(-50%, -50%);
    }
    .overlay-image-journey2 {
        cursor: pointer;
        z-index: 8;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    .happyall {
        height: 300px;
    }
    .popup-template {
        width: 95vw;
        height: auto;
    }
    .popup-top {
        padding: 50px 20px 20px 20px;
    }
    .popup-top h1 {
        font-size: 28px;
    }
    .popup-top p {
        font-size: 15px;
    }
    .title-showocean h1 {
        font-size: 32px;
        margin-bottom: 2rem;
    }
    .grass2 {
       display: none;
    }
    .grass3 {
        display: none;
    }
    .grass4 {
       display: none;
    }
    .grass5 {
        top: 2rem;
        right: 0;
        height: 1750px;
    }
    .grass6 {
       top: 22rem;
       width: 100px;
       height: 1400px;
    }
    .grass7 {
       display: none;
    }
    .grass10 {
        width: 250px;
        top: 25rem;
        right: 0;
    }
    .grass11 {
        top: 25rem;
        transform: rotate(90deg);
        width: 200px;
        left: 12%;
    }
    .grass12 {
        width: 200px;
        top: 90rem;
        left: 12%;
    }
    .grass13 {
        display: none;
    }
    .grass14 {
        display: none;
    }
    .grass16 {
        display: none;
    }
    .bird {
        display: none;
    }
    .bird2 {
        display: none;
    }
    .bird3 {
        display: none;
    }
    .bird4 {
        display: none;
    }
    .bird5 {
        display: none;
    }
    .title-tenantus h1 {
        font-size: 32px;
        margin-bottom: 0;
    }
    #thumbnail-carousel {
        width: 90%;
    }
    #main-carousel {
        width: 100%;
    } 
    #main-carousel .splide__slide p {
        margin: 0 auto;
        width: 90%;
        text-align: center;
    }
    .Newinformation {
        padding: 5rem 0;
    }
    .title-newinformation {
        width: 100%;
    }
    .title-newinformation h1 {
        font-size: 32px;
    }
    .title-overlay-new h3 {
        font-size: 20px;
    }
    .date-new {
        font-size: 12px;
    }
    .desc-new {
        font-size: 13px;
    }
    .button-new a {
        font-size: 13px;
    }
    .title-klienOcean h2 {
        font-size: 32px;
    }
    .title-reviews h1 {
        font-size: 32px;
        text-align: center;
    }
    .title-reviews p {
        text-align: justify;
    }
    .image-cust {
        justify-content: center;
    }
    .bg-white-review-cust {
        padding: 20px;
    }
    .review-cust-splide .splide__arrow {
        width: 1.5em;
        height: 1.5em;
    }
    .review-cust-splide .splide__arrow--prev {
        left: 0;
    }
    .review-cust-splide .splide__arrow--next {
        right: 0;
    }
    .review-cust-splide .splide__arrow--prev svg {
        width: 15px;
    }
    .review-cust-splide .splide__arrow--next svg {
        width: 15px;
    }
    .fox {
        width: 150px;
        bottom: 30px;
        right: 0;
    }
    .title-social h1 {
        font-size: 32px;
        text-align: center;
    }
    .desc-tourism p {
        text-align: center;
    }
    .card-tourism {
        position: relative;
        width: 250px;
        height: 450px;
        margin-bottom: 1rem;
    }
    .image-tourism video {
        height: 450px;
        width: 100%;
    }
    .image-tourism img {
        height: 450px;
        width: 254px;
        object-fit: cover;
    }
    .overlay-ig-tourism img {
        width: 35px;
        object-fit: cover;
    }
    .overlay-like-tourism {
        gap: .2rem;
        font-size: 13px;
        bottom: 10px;
    }
    .overlay-comment-tourism {
        font-size: 13px;
        bottom: 10px;
    }
    .box-email {
        padding: 30px 20px;
        margin-bottom: 1rem;
    }
    .turtle {
        left: 20px;
        top: -11%;
        width: 150px;
    }
    .treasure {
        width: 120px;
        bottom: 60px;
        right: 0;
    }
    .image-partnership {
        background-color: #fff;
        padding: 30px 20px;
        border-radius: 10px;
    }
    .overlay-partnership a {
        padding: 10px 20px;
        font-size: 13px;
    }
    .brand-footer {
        gap: 1rem;
    }
    .brand-footer img {
        width: 120px;
        object-fit: cover;
    }
    footer .box-center {
        justify-content: flex-start;
    }
    .bg-darkline {
        height: .5px;
    }
    .akar1 {
        display: none;
    }
    .akar2 {
        display: none;
    }
    .box-new {
        left: 0;
        
    }
    .popup-close {
        right: 20px;
        top: 20px;
    }
    .popup-close img {
        width: 15px;
        object-fit: cover;
    }
    #main-carousel .splide__arrow {
        top: -5%;
    }
    #main-carousel .splide__arrow--prev {
        z-index: 7;
        left: 1rem;
    }
    #main-carousel .splide__arrow--next {
        z-index: 7;
        right: 1rem;
    }
    .link-buy-card-ticketing a {
        font-size: 10px;
    }
    .klien-splide .splide__track {
        width: 100%;
        z-index: 0;
    }
    .klien-splide .splide__list {
        height: 100px;
    }
    
    .klien-splide .splide__list img {
        width: 100px;
    }
    .star img {
        width: 20px;
    }
    .grass15 {
        width: 100%;
        top: 0;
        position: absolute;
        right: 0;
    }
    .grass16 {
        z-index: -1;
        width: 125%;
        top: 35%;
        position: absolute;
        left: 0;
    }
    .coming-soon {
        margin-top: 0 !important;
        height: 200px;
    }
    .coming-soon img {
        width: 120px;
    }
    .coming-soon h1 {
        font-size: 32px;
    }
    .logo-comingsoon {
        width: 120px;
    }
    /* END HOMEPAGE */



    /* TICKET FEE */
    .fish9 {
        width: 150px;
        top: -5%;
        left: 0;
    }
    .fish10 {
        width: 100px;
        top: -5%;
        right: 0;
    }
    .fish8 {
        z-index: -1;
        width: 100px;
        top: 6%;
    }
    .title-premiumpackage p br {
        display: none;
    }
    .title-premiumpackage h1 {
        font-size: 42px;
    }
    .title-floormap h1 {
        font-size: 42px;
    }
    .box-card-addons:nth-child(odd) {
        margin-top: 0;
    }
    .padding-banner {
        padding-top: 4rem;
    }
    /* END TICKET FEE */



    /* PROMOTIONS */
    .Promotions {
        padding: 10rem 0 5rem 0;
    }
    .kerang {
        width: 200px;
        right: 0;
        top: 0;
    }
    .padding-left-ul {
        margin-left: 1.5rem;
    }
    /* END PROMOTIONS */


    /* FAQ */
    .descBanner2 {
        padding-top: 5rem;
    }
    .header-question {
        width: 85%;
    }
    .header-question h4 {
        font-size: 15px;
    }
    .answer p {
        font-size: 14px;
    }
    /* END FAQ */


    /* ONCE */
    .desc-schoolpackage h1 {
        font-size: 32px;
    }
    .desc-schoolpackage h1 br {
        display: none;
    }
    .grass34 {
        top: 11rem;
        width: 100%;
        left: -5%;
        transform: rotate(180deg);
    }
    .akar3 {
        display: none;
    }
    .akar4 {
        display: none;
    }
    .title-once h1 {
        font-size: 32px;
    }
    .title-once h1 br {
        display: none;
    }
    .title-once p {
        font-size: 15px;
    }
    .desc-image-once h1 {
        font-size: 32px;
        text-align: left;
    }
    .desc-image-once p {
        text-align: left;
    }
    .fish11 {
        bottom: 24%;
        right: 0;
        width: 250px;
    }
    .fish12 {
        top: 15%;
        left: 55%;
        transform: rotateY(180deg);
        width: 200px;
        z-index: -1;
    }
    /* END ONCE */



    /* GUIDE */
    .desc-premium h1 {
        font-size: 42px;
    }
    .desc-premium p {
        font-size: 15px;
    }
    .desc-premium p br {
        display: none;
    }
    .title-guide h1 {
        font-size: 42px;
    }
    .title-guide p {
        font-size: 16px;
    }
    .frog2 {
        width: 100px;
        top: 2%;
        z-index: -1;
    }
    .image-guide {
        display: flex;
    }
    .desc-image-guide {
        margin-bottom: 3rem;
    }
    .desc-image-guide p {
        font-size: 16px;
    }
    .akar5 {
        display: none;
    }
    .akar6 {
        display: none;
    }
    /* END GUIDE */


    /* TENANTUS */
    .grass35 {
        top: 3rem;
        z-index: -2;
    }
    .shark5 {
        top: 7rem;
        right: 0;
        z-index: -1;
        width: 250px;
    }
    .box-card-tenant:nth-child(3n-1) {
        margin-top: 0 !important;
    }
    .hand-image {
        height: 500px;
    }
    /* END TENANT */



    /* MAP */
    .iguana3 {
        width: 120px;
    }
    .grass36 {
        display: none;

    }
    .grass37 {
        height: 920px;
        bottom: -1%;
        left: 0;
    }
    .grass40 {
        display: none;
    }
    .grass41 {
        height: 920px;
    }
    .grass38 {
        width: 320px;
        top: -30%;
    }
    .grass39 {
        bottom: -1%;
    }
    .grass42 {
        bottom: 0;
        width: 120px;
    }
    .download-map {
        margin-top: 3rem;
    }
    /* END MAP */


    /* SHOW */
    .fox2 {
       display: none;
    }
    /* END SHOW */


    /* PREMIUM PACKAGE */
    .title-premiumpackage h1 {
        font-size: 32px;
    }
    .snake2 {
        width: 200px;
    }
    .grass43 {
        display: none;
    }
    .grass44 {
        display: none;
    }
    .grass45 {
        display: none;
    }
    .grass46 {
        display: none;
    }
    .grass47 {
        display: none;
    }
    .grass48 {
        display: none;
    }
    .grass49 {
        display: none;
    }
    .grass50 {
        display: none;
    }
    .grass52 {
        width: 200px;
        bottom: -3%;
        left: -5%;
    }
    .bird8 {
        left: 20px;
        z-index: -1;
    }
    .box-card-premium {
        margin: 1rem auto;
    }
    /* END PREMIUM PACKAGE */



    /* CONTACT */
    .box-contact {
        display: flex;
    }
    .box-card-contactus {
        justify-content: center;
    }
    .box-card-contactus3 {
        justify-content: center;
    }
    .title-Contactus h1,
    .title-contactus2 h1 {
        font-size: 32px;
    }
    .octopus {
        width: 250px;
        z-index: -1;
        top: 5%;
    }
    .octopus2 {
        width: 250px;
        z-index: -1;
        top: 50rem;
    }
    /* END CONTACT */



    /* MERCHANDISE */
    .indicator-merchan-web {
        display: grid;
        text-align: center;
        gap: 0;
    }
    .title-merchandise2 {
        text-align: center;
    }
    .title-merchandise2 h1 {
        font-size: 32px;
        text-align: center;
    }
    .title-merchandise2 p br {
        display: none;
    }
    .kerang2 {
        top: -65%;
        right: -10%;
        width: 180px;
    }
    .bunga {
        position: absolute;
        right: -5%;
        width: 150px;
        top: -115%;
    }









    /* EXPERIENCES */
    .title-experiences h1 {
        font-size: 32px;
        color: #82E8FF;
        text-align: center;
    }
    .desc-experiences {
        text-align: center;
        color: #fff;
        font-size: 15px;
    }  
     /*END EXPERIENCES  */




     /* SCHOOL FIELD TRIP */
     .desc-schoolpackage p br {
        display: none;
     }
     .desc-schoolpackage p {
        font-size: 16px;
     }
     .iguana {
        display: none;
     }
     .grass18 {
        display: none;
    }
    .grass19 {
        width: 220px;
        height: 1200px;
        left: 0;
    }
    .grass20 {
       display: none;
    }
    .grass21 {
        right: 0;
        height: 1200px;
    }
    .grass22 {
        display: none;
    }
    .grass23 {
        left: 0;
        width: 100%;
        bottom: 118rem;
    }
    .grass26 {
        display: none;
    }
    .grass27 {
       right: 0;
       width: 100%;
       z-index: -3;
    }
    .grass28 {
        left: -20%;
        z-index: -3;
    }
    .grass29 {
        display: none;
    }
    .grass30 {
       display: none;
    }
    .grass31 {
        right: 0;
        top: 60rem;
    }
    .grass32 {
        display: none;
    }
    .brand-package {
        margin-bottom: 30px;
    }
    .title-schoolpackage-program h5 {
        font-size: 15px;
    }
    .program p {
        font-size: 14px;
    }
    .package-grade ul li {
        font-size: 12px;
        padding: 0 10px;
        height: 7rem;
    }
    .mb-400 {
        margin-top: 7.3rem;
    }
    .Schoolpackage-program-slide .splide__arrow {
        top: 50px;
    }
    .Schoolpackage-program-slide .splide__arrow--next {
        right: 0;
    }
    .Schoolpackage-program-slide .splide__arrow--prev {
        left: 0;
    }
    .box-image-schoolpackage img {
        width: 100%;
    }
    .box-align {
        justify-content: flex-start;
    }
    /* SCHOOLFIELD TRIP */

    .royal-navy.sidebar-hide .calendar-sidebar {
        display: none;
    }
    .calendar-events {
        width: 100%;
    }
    .mb-500 {
        margin-bottom: .5rem;
    }
    .box-month .form-control,
    .box-year .form-control {
        text-align: center;
    }
    .mb-500 {
        margin-bottom: .5rem;
    }
    .Aboutus {
        padding: 2rem 0 5rem 0;
    }
    .title-aboutus h1 {
        font-size: 32px;
    }
    .desc-aboutus {
        font-size: 16px;
        line-height: 1.6;
    }
    .gurita {
        display: none;
    }
    .Aboutus .mb-300 {
        margin-bottom: 1.5rem;
    }
    .desc-aboutus ul {
        margin-left: 1.2rem;
        display: block;
    }
    .text-none .text-576 {
        display: none;
    }
   
}


@media (min-width:417px) and (max-width:475px) {
    .wave2 {
        top: 72px;
    }
    .wave3 {
        bottom: 72px;
    }
    .wave7 {
        bottom: 115px;
    }
    .popup-template {
        width: 95vw;
    }
    #thumbnail-carousel {
        width: 77%;
    }
    .floormap-journey .card-ticketing {
        width: 330px;
        margin: auto;
    }
    .floormap-journey .card-ticketing img {
        object-fit: cover;
    }
    /* .akar4 {
        left: -70%;
    }
    .akar6 {
        left: -70%;
    } */
    .fish12 {
        top: 13%;
    }
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .iguana3 {
        width: 140px;
    }
    .grass39 {
        bottom: -1%;
    }
    .fish6 {
        top: -45%;
        left: 0;
        width: 50px;
        z-index: -1;
    }
    .grass54 {
        height: 1100px;
        left: 0;
    }
    .grass56 {
        height: 1020px;
        right: 0;
        top: 0;
        z-index: -1;
    }
    .grass5 {
        height: 1800px;
    }
}


@media (min-width:476px) and (max-width:500px) {
    .wave2 {
        top: 65px;
    }
    .wave3 {
        bottom: 72px;
    }
    .wave7 {
        bottom: 120px;
    }
    .shark {
        top: 22%;
    }
    .popup-template {
        width: 95vw;
    }
    #thumbnail-carousel {
        width: 72%;
    }
    .floormap-journey .card-ticketing {
        width: 330px;
        margin: auto;
    }
    .floormap-journey .card-ticketing img {
        object-fit: cover;
    }
    /* .akar4 {
        left: -70%;
    } */
    .fish12 {
        top: 13%;
    }
    /* .akar6 {
        left: -70%;
    } */
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .iguana3 {
        width: 150px;
    }
    .grass39 {
        bottom: -1%;
    }
    .fish6 {
        left: 15px;
    }
    .grass54 {
        height: 1150px;
        left: 0;
    }
    .grass56 {
        height: 1070px;
        right: 0;
        top: 0;
        z-index: -1;
    }
}

@media (min-width:501px) and (max-width:550px) {
    .title-journey-ocean h1 br {
        display: block;
    }
    .wave2 {
        top: 57px;
    }
    .wave3 {
        bottom: 62px;
    }
    .wave7 {
        bottom: 120px;
    }
    .shark {
        top: 22%;
    }
    .wave6 {
        bottom: 92px;
    }
    .popup-template {
        width: 95vw;
    }
    #thumbnail-carousel {
        width: 69%;
    }
    .floormap-journey .card-ticketing {
        width: 330px;
        margin: auto;
    }
    .floormap-journey .card-ticketing img {
        object-fit: cover;
    }
    /* .akar4 {
        left: -70%;
    } */
    .fish12 {
        top: 13%;
    }
    /* .akar6 {
        height: 3500px;
        top: -10%;
        left: -70%;
    } */
    .grass23 {
        bottom: 110rem;
    }
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .iguana3 {
        width: 160px;
    }
    .grass39 {
        bottom: -2%;
    }
    .fish6 {
        left: 25px;
    }
    .grass54 {
        height: 1150px;
        left: 0;
    }
    .grass56 {
        height: 1090px;
        right: 0;
        top: 0;
        z-index: -1;
    }
    .kerang2 {
        top: -80%;
        right: -5%;
        width: 180px;
    }
}

@media (min-width:551px) and (max-width:600px) {
    .title-journey-ocean h1 br {
        display: block;
    }
    .grass23 {
        bottom: 110rem;
    }
    .wave2 {
        top: 50px;
    }
    .wave3 {
        bottom: 57px;
    }
    .wave7 {
        bottom: 120px;
    }
    .shark {
        top: 22%;
    }
    .wave6 {
        bottom: 92px;
    }
    .popup-template {
        width: 95vw;
    }
    #thumbnail-carousel {
        width: 62%;
    }
    .floormap-journey .card-ticketing {
        width: 330px;
        margin: auto;
    }
    .floormap-journey .card-ticketing img {
        object-fit: cover;
    }
    /* .akar4 {
        left: -70%;
    } */
    .fish12 {
        top: 13%;
    }
    /* .akar6 {
        height: 3500px;
        top: -10%;
        left: -70%;
    } */
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .iguana3 {
        width: 175px;
    }
    .grass39 {
        bottom: -2%;
    }
    .fish6 {
        left: 45px;
    }
    .grass54 {
        height: 1150px;
        left: 0;
    }
    .grass56 {
        height: 1120px;
        right: 0;
        top: 0;
        z-index: -1;
    }
    .kerang2 {
        top: -80%;
        right: -5%;
        width: 180px;
    }
}

@media (min-width:576px) and (max-width:768px) {
    .grass23 {
        bottom: 110rem;
    }
    .title-showocean h1 {
        margin-bottom: 3rem;
    }
    .box-new {
        background-color: transparent;
    }
    /* .akar2 {
        left: -80%;
    } */
    .grass5 {
        top: -10%;
    }
    .floormap-journey .card-ticketing {
        width: 330px;
        margin: auto;
    }
    .floormap-journey .card-ticketing img {
        object-fit: cover;
    }
    /* .akar4 {
        left: -70%;
    } */
    .fish12 {
        top: 13%;
    }
    /* .akar6 {
        height: 3500px;
        top: -10%;
        left: -70%;
    } */
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .iguana3 {
        width: 175px;
    }
    .grass39 {
        bottom: -2%;
    }
    .card-tourism {
        position: relative;
        height: 450px;
        margin-bottom: 1rem;
    }
    .image-tourism video {
        height: 450px;
        width: 100%;
    }
    .image-tourism img {
        height: 450px;
        width: 254px;
        object-fit: cover;
    }
    .fish6 {
        left: 40px;
    }
    .grass54 {
        height: 1150px;
        left: 0;
    }
    .grass56 {
        height: 1120px;
        right: 0;
        top: 0;
        z-index: -1;
    }
    .grass5 {
        height: 1850px;
    }
    .kerang2 {
        top: -80%;
        right: -5%;
        width: 180px;
    }
    .bunga {
        position: absolute;
        right: -5%;
        width: 150px;
        top: -200%;
    }
    
}

@media (min-width:601px) and (max-width:650px) {
    .title-journey-ocean h1 br {
        display: block;
    }
    .wave2 {
        top: 45px;
    }
    .wave3 {
        bottom: 48px;
    }
    .wave7 {
        bottom: 120px;
    }
    .shark {
        top: 23%;
    }
    .wave6 {
        bottom: 92px;
    }
    .journey-splide img {
        height: 300px;
        width: 400px;
        object-fit: cover;
    }
    .popup-template {
        width: 90vw;
    }
    .title-showocean h1 {
        margin-bottom: 3rem;
    }
    #thumbnail-carousel {
        width: 74%;
    }
    .popup-template {
        width: 95vw;
    }
    /* .akar4 {
        left: -70%;
    }
    .akar6 {
        height: 3500px;
        top: -10%;
        left: -70%;
    } */
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .grass6 {
        top: 25rem;
    }
    .frog {
        top: 20%;
        width: 120px;
        left: 17%;
    }
    .turtle {
        left: 0;
        top: -5%;
    }
}

@media (min-width:651px) and (max-width:700px) {
    .title-journey-ocean h1 br {
        display: block;
    }
    .wave2 {
        top: 35px;
    }
    .wave3 {
        bottom: 35px;
    }
    .wave5 {
        top: 145px;
    }
    .wave7 {
        bottom: 120px;
    }
    .shark {
        width: 200px;
        top: 17%;
        right: 10%;
    }
    .wave6 {
        bottom: 87px;
    }
    .journey-splide img {
        height: 300px;
        width: 400px;
        object-fit: cover;
    }
    .popup-template {
        width: 80vw;
    }
    .title-showocean h1 {
        margin-bottom: 3rem;
    }
    #thumbnail-carousel {
        width: 68%;
    }
    .popup-template {
        width: 95vw;
    }
    /* .akar4 {
        left: -70%;
    } */
    .fish12 {
        top: 13%;
    }
    /* .akar6 {
        height: 3500px;
        top: -10%;
        left: -70%;
    } */
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .grass6 {
        height: 1600px;
    }
    .turtle {
        left: 10px;
        top: -5%;
    }
    .kerang2 {
        top: -80%;
        right: -5%;
        width: 180px;
    }
}

@media (min-width:671px) and (max-width:700px) {
    .grass6 {
        height: 1600px;
    }
    .turtle {
        left: 25px;
        top: -5%;
    }
}

@media (min-width:701px) and (max-width:768px) {
    .title-journey-ocean h1 br {
        display: block;
    }
    .wave2 {
        top: 25px;
    }
    .wave3 {
        bottom: 25px;
    }
    .wave5 {
        top: 145px;
    }
    .wave7 {
        bottom: 120px;
    }
    .shark {
        width: 200px;
        top: 17%;
        right: 10%;
    }
    .wave6 {
        bottom: 83px;
    }
    .journey-splide img {
        height: 300px;
        width: 400px;
        object-fit: cover;
    }
    .popup-template {
        width: 80vw;
    }
    .title-showocean h1 {
        margin-bottom: 3rem;
    }
    #thumbnail-carousel {
        width: 64%;
    }
    #thumbnail-carousel .splide__list {
        text-align: right;
    }
    .popup-template {
        width: 95vw;
    }
    /* .akar4 {
        left: -70%;
    } */
    .fish12 {
        top: 13%;
    }
    /* .akar6 {
        height: 3500px;
        top: -10%;
        left: -70%;
    } */
    .hand {
        width: 370px;
        height: 530px;
        margin: auto;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .grass6 {
        height: 1600px;
    }
    .turtle {
        left: 45px;
        top: -5%;
    }
    .grass5 {
        height: 1900px;
    }
    .kerang2 {
        top: -80%;
        right: -5%;
        width: 180px;
    }
}

@media (min-width:500px) and (max-width:768px) {

    .link-buy-card-ticketing a {
        font-size: 12px;
    }
    .details p {
        font-size: 12px;
    }
    .footer-card-ticketing p {
        font-size: 8px;
    }
    .footer-card-ticketing a {
        padding: 10px;
        font-size: 11px;
    }
  
}

@media (min-width:768px) and (max-width:768px) {
    #thumbnail-carousel {
        width: 49%;
    }
    /* .akar2 {
        top: 95%;
        left: -60%;
    } */
    .title-showocean h1 {
        margin-bottom: 4rem;
    }
    #thumbnail-carousel {
        width: 60%;
    }
}


@media (min-width:768px) and (max-width:991px) {

    .calendar-events {
        width: 360px;
        padding: 70px 10px 60px 10px;
        padding-left: 50px;
    }
    .title-overlay-new h3 {
        font-size: 20px;
    }
    .box-image-lit h3 {
        font-size: 20px;
    }
    .overlay-image-latest-big h3 {
        font-size: 20px;
    }
    .text-576 {
        font-size: 13px;
    }
    .sidebar-hide .calendar-inner {
        max-width: calc(100% - 360px);
    }
    .bunglon {
        position: absolute;
        left: -10%;
        width: 250px;
        top: -400%;
    }
    /* HOMEPAGE */
    .box-align {
        justify-content: flex-start;
    }
    .image-absolute-review {
        display: none;
    }
    .banner-title {
        font-size: 48px;
    }
    .banner-title br {
        display: none;
    }
    .title-review-influencer h1 {
        font-size: 42px;
    }
    .fish {
        right: 10px;
    }
    .fish3 {
        left: 30%;
        bottom: 25%;
    }
    .fish5 {
        width: 100px;
        right: 10px;
    }
    .fish6 {
        width: 90px;
        top: -95%;
        left: 6%;
    }
    .review-influencer-splide .splide__arrow--prev {
        left: 10rem;
    }
    .review-influencer-splide .splide__arrow--next {
        right: 10rem;
    }
    .head-title-ticketing h1 {
        font-size: 42px;
    }
    .head-title-ticketing p {
        width: 80%;
    }
    .grass {
        bottom: -26%;
    }
    .wave2 {
        top: 70px;
    }
    .wave3 {
        bottom: 70px;
    }
    .wave4 {
        top: 85px;
        width: 300px;
    }
    .wave5 {
        top: 170px;
        width: 200px;
    }
    .wave6 {
        width: 180px;
        right: 15%;
        bottom: 115px;
    }
    .wave7 {
        width: 250px;
        bottom: 140px;
        left: 7%;
    }
    .shark {
        width: 300px;
        top: 90px;
        right: 20%;
    }
    .title-journey-ocean h1 {
        font-size: 42px;
    }
    .title-showocean h1 {
        margin-bottom: 4rem;
        font-size: 42px;
    }
    #thumbnail-carousel {
        width: 59%;
    }
    .title-tenantus h1 {
        font-size: 42px;
    }
    #thumbnail-carousel {
        width: 92%;
    }
    #main-carousel .splide__arrow {
        top: 20%;
    }
    #main-carousel .splide__arrow--prev {
        z-index: 7;
        left: 1rem;
    }
    #main-carousel .splide__arrow--next {
        z-index: 7;
        right: 1rem;
    }
    #main-carousel .splide__slide p {
        width: 80%;
    }
    .title-newinformation {
        width: 80%;
    }
    .fox {
        width: 200px;
        bottom: 15px;
    }
    .title-reviews {
        text-align: center;
    }
    .title-reviews h1 {
        font-size: 42px;
    }
    .title-social {
        text-align: center;
    }
    .title-social h1 {
        font-size: 42px;
    }
    .title-klienOcean h2 {
        font-size: 42px;
    }
    .desc-tourism {
        text-align: center;
    }
    .turtle {
        left: 5%;
    }
    .brand-footer {
        gap: 1rem;
    }
    .brand-footer img {
        width: 120px;
        object-fit: cover;
    }
    footer .box-center {
        justify-content: flex-start;
    }
    .bg-darkline {
        height: .5px;
    }
    .box-email {
        margin-bottom: 1rem;
    }
    .grass2 {
        top: 40rem;
     }
     .grass3 {
        top: 55rem;
        width: 250px;
        height: 1900px;
     }
     .grass4 {
        display: none;
     }
     .grass5 {
        top: 50rem;
        right: 0;
     }
     .grass6 {
        top: 52rem;
        width: 100px;
        height: 1900px;
     }
     .grass7 {
        display: none;
     }
     .grass10 {
         width: 250px;
         top: 55rem;
         right: 0;
     }
     .grass11 {
         top: 55rem;
         transform: rotate(90deg);
         width: 200px;
         left: 12%;
     }
     .grass12 {
         width: 200px;
         top: 140rem;
         left: 12%;
     }
     .grass13 {
         display: none;
     }
     .grass14 {
        top: 20%;
     }
     .grass15 {
        top: 20%;
     }
     .grass16 {
         top: 85rem;
     }
     .bird {
         display: none;
     }
     .bird2 {
         display: none;
     }
     .bird3 {
         display: none;
     }
     .bird4 {
         display: none;
     }
     .bird5 {
         display: none;
     }
     .akar1 {
        display: none;
     }
     .akar2 {
        display: none;
     }
     .popup-template {
        width: 95vw;
    }
    .desc-new p {
        display: none;
    }
    .card-tourism {
        position: relative;
        height: 450px;
        margin-bottom: 1rem;
    }
    .image-tourism video {
        height: 450px;
        width: 100%;
    }
    .image-tourism img {
        height: 450px;
        width: 100%;
        object-fit: cover;
    }
    .overlay-like-tourism {
        font-size: 13px;
    }
    .overlay-like-tourism img {
        width: 13px;
    }
    .overlay-comment-tourism {
        font-size: 13px;
    }
    .overlay-comment-tourism img {
        width: 13px;
    }
    .turtle {
        width: 230px;
        left: 0;
    }
    /* END HOME PAGE */


     /* TICKET FEE */
     .lato-font h1 {
        font-size: 28px;
     }
    .fish9 {
        width: 200px;
        top: -9%;
        left: 0;
    }
    .fish10 {
        width: 150px;
        top: -9%;
        right: 0;
    }
    .fish8 {
        z-index: -1;
        width: 100px;
        top: 6%;
    }
    .title-premiumpackage h1 {
        font-size: 48px;
    }
    .title-floormap h1 {
        font-size: 48px;
    }
    .floormap-journey .mb-200 {
        margin-bottom: 0 !important;
    }
    .padding-banner {
        padding-top: 17rem;
    }
    /* END TICKET FEE */



    /* PROMOTIONS */
    .Promotions {
        padding: 10rem 0 5rem 0;
    }
    .kerang {
        width: 300px;
        right: 0;
        top: 0;
        z-index: -1;
    }
    .padding-left-ul {
        margin-left: 1.5rem;
    }
    /* END PROMOTIONS */


    /* FAQ */
    .header-question {
        width: 85%;
    }
    .header-question h4 {
        font-size: 15px;
    }
    .answer p {
        font-size: 14px;
    }
    /* END FAQ */



    /* ONCE */
    .desc-schoolpackage h1 {
        font-size: 32px;
    }
    .desc-schoolpackage h1 br {
        display: none;
    }
    .grass34 {
        top: 11rem;
        width: 100%;
        left: -5%;
        transform: rotate(180deg);
    }
    .akar3 {
        display: none;
    }
    .akar4 {
        display: none;
    }
    .title-once h1 {
        font-size: 32px;
    }
    .title-once h1 br {
        display: none;
    }
    .title-once p {
        font-size: 15px;
    }
    .desc-image-once h1 {
        font-size: 32px;
        text-align: left;
    }
    .desc-image-once p {
        text-align: left;
    }
    .fish11 {
        bottom: 22%;
        right: 10%;
        width: 350px;
    }
    .fish12 {
        top: 15%;
        left: 55%;
        transform: rotateY(180deg);
        width: 200px;
        z-index: -1;
    }
    /* END ONCE */



    /* GUIDE */
    .desc-premium h1 {
        font-size: 42px;
    }
    .desc-premium p {
        font-size: 15px;
    }
    .desc-premium p br {
        display: none;
    }
    .title-guide h1 {
        font-size: 42px;
    }
    .title-guide p {
        font-size: 16px;
    }
    .frog2 {
        width: 100px;
        top: 2%;
        z-index: -1;
    }
    .image-guide {
        display: flex;
    }
    .desc-image-guide {
        margin-bottom: 0 !important;
    }
    .desc-image-guide p {
        font-size: 15px;
    }
    .frog2 {
        top: 10px;
        z-index: 1;
        width: 200px;
        right: 0;
    }
    /* END GUIDE */



    /* TENANTUS */
    .grass35 {
        top: 3rem;
        z-index: -2;
    }
    .shark5 {
        top: 7rem;
        right: 8%;
        z-index: 2;
        width: 350px;
    }
    .hand {
        height: 500px;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    .box-card-tenant:nth-child(3n-1) {
        margin-top: 0 !important;
    }
    /* END TENANT */


    /* MAP */
    .iguana3 {
        width: 220px;
    }
    .grass36 {
        left: 0;
        height: 920px;
    }
    .grass37 {
        height: 920px;
        bottom: -1%;
        left: 8%;
    }
    .grass40 {
        right: 5%;
    }
    .grass41 {
        height: 920px;
    }
    .grass38 {
        width: 350px;
        left: 20px;
        top: -20%;
    }
    .grass39 {
        bottom: -2%;
    }
    .grass42 {
        bottom: 0;
        width: 220px;
        left: 10%;
        z-index: -1;
    }
    .download-map {
        margin-top: 3rem;
    }
    /* END MAP */


    /* SHOW */
    .fox2 {
        position: absolute;
        width: 150px;
        top: -23%;
        left: -10px;
        z-index: 2;
    }
    .title-show {
        padding: 40px 20px 20px 20px;
    }
    .box-show {
        margin: 1rem auto;
    }
    .akar5 {
        display: none;
    }
    .akar6 {
        display: none;
    }
    /* END SHOW */


    /* PREMIUM PACKAGE */
    .title-premiumpackage h1 {
        font-size: 32px;
    }
    .snake2 {
        width: 200px;
    }
    .grass43 {
        display: none;
    }
    .grass44 {
        left: 0;
        height: 2000px;
    }
    .grass45 {
        display: none;
    }
    .grass46 {
        left: 0;
    }
    .grass47 {
        display: none;
    }
    .grass48 {
        display: none;
    }
    .grass49 {
        right: 0;
    }
    .grass50 {
        display: none;
    }
    .grass52 {
       left: 5%;
    }
    .bird8 {
        display: none;
    }
    .box-card-premium {
        margin: 1rem auto;
    }
    /* END PREMIUM PACKAGE */



    /* CONTACT */
    .title-Contactus h1,
    .title-contactus2 h1 {
        font-size: 32px;
    }
    .octopus {
        width: 350px;
        z-index: -1;
        top: -50px;
    }
    .octopus2 {
        width: 350px;
        z-index: -1;
        top: 40rem;
    }
    /* END CONTACT */








     /* EXPERIENCES */
    .title-experiences h1 {
        font-size: 42px;
        color: #82E8FF;
        text-align: center;
    }
    .desc-experiences {
        text-align: center;
        color: #fff;
        font-size: 17px;
    }  
     /*END EXPERIENCES  */




      /* SCHOOL FIELD TRIP */
      .desc-schoolpackage p br {
        display: none;
     }
     .desc-schoolpackage p {
        font-size: 16px;
     }
     .iguana {
        display: none;
     }
     .grass18 {
        left: 0;
        height: 1400px;
    }
    .grass19 {
        width: 220px;
        height: 1200px;
        left: 12%;
    }
    .grass20 {
       right: 5%;
       height: 1300px;
    }
    .grass21 {
        top: 0;
        right: 0;
        height: 1300px;
    }
    .grass22 {
        right: 0;
        width: 100%;
        bottom: 90rem;
    }
    .grass23 {
        right: 0;
        width: 100%;
        bottom: 95rem;
    }
    .grass26 {
        display: none;
    }
    .grass27 {
       right: 0;
       width: 100%;
       z-index: -3;
    }
    .grass28 {
        left: -20%;
        z-index: -3;
    }
    .grass29 {
        display: none;
    }
    .grass30 {
       display: none;
    }
    .grass31 {
        right: 0;
        top: 0;
    }
    .grass32 {
        display: none;
    }
    .brand-package {
        margin-bottom: 30px;
    }
    .title-schoolpackage-program h5 {
        font-size: 15px;
    }
    .program p {
        font-size: 14px;
    }
    .package-grade ul li {
        font-size: 12px;
        padding: 0 10px;
        height: 7rem;
    }
    .mb-400 {
        margin-top: 7.3rem;
    }
    .Schoolpackage-program-slide .splide__arrow {
        top: 50px;
    }
    .Schoolpackage-program-slide .splide__arrow--next {
        right: 0;
    }
    .Schoolpackage-program-slide .splide__arrow--prev {
        left: 0;
    }
    .box-image-schoolpackage img {
        width: 100%;
        object-fit: cover;
        border-radius: 40px;
    }
    .box-image-schoolpackage2 img {
        width: 100%;
        height: 300px;
        object-fit: cover;
        border-radius: 40px;
    }
    .package-grade .package-centers .bg-blue-package {
        font-size: 17px;
    }
    /*END SCHOOL PACKAGE */


    /* MERCHANDISE */
    .title-merchandise2 p br {
        display: none;
    }
    .indicator-merchan-web {
        gap: 0;
    }
    .kerang2 {
        right: -12%;
    }
    /* END MERCHANDISE */

    .royal-navy.sidebar-hide .calendar-sidebar {
        display: none;
    }
    .desc-aboutus {
        font-size: 16px;
        line-height: 1.6;
    }
    .gurita {
        top: -50%;
        width: 350px;
        left: 80%;
        transform: rotateY(180deg);
    }
    .Aboutus .mb-300 {
        margin-bottom: 1.5rem;
    }
    .grass57 {
        bottom: 50%;
    }
}

@media (min-width:769px) and (max-width:800px) {
    .fish12 {
        top: 11%;
    }
    /* .akar4 {
        left: -30%;
    }
    .akar5 {
        left: -40%;
    }
    .akar6 {
        right: -30%;
    } */
    .turtle {
        width: 230px;
        left: 0rem;
    }
}

@media (min-width:800px) and (max-width:820px) {
    #thumbnail-carousel {
        width: 89%;
    }
    .fish12 {
        top: 11%;
    }
    /* .akar4 {
        left: -30%;
    }
    .akar5 {
        left: -40%;
    }
    .akar6 {
        right: -30%;
    } */
}

@media (min-width:821px) and (max-width:850px) {
    #thumbnail-carousel {
        width: 88%;
    }
    .fish12 {
        top: 11%;
    }
    /* .akar4 {
        left: -30%;
    }
    .akar5 {
        left: -40%;
    }
    .akar6 {
        right: -30%;
    } */
}

@media (min-width:851px) and (max-width:900px) {
    #thumbnail-carousel {
        width: 88%;
    }
    .fish12 {
        top: 11%;
    }
}

@media (min-width:901px) and (max-width:920px) {
    .wave7 {
        left: 10%;
        bottom: 160px;
    }
    .wave5 {
        top: 180px;
    }
    #thumbnail-carousel {
        width: 80%;
    }
    .fish12 {
        top: 11%;
    }
}

@media (min-width:921px) and (max-width:940px) {
    .wave7 {
        left: 10%;
        bottom: 160px;
    }
    .wave5 {
        top: 190px;
    }
    .wave4 {
        top: 95px;
    }
    .wave6 {
        bottom: 120px;
    }
    .wave7 {
        bottom: 175px;
        left: 12%;
    }
    #thumbnail-carousel {
        width: 78%;
    }
    .fish12 {
        top: 11%;
    }
}


@media (min-width:941px) and (max-width:960px) {
    .wave7 {
        left: 10%;
        bottom: 160px;
    }
    .wave5 {
        top: 190px;
    }
    .wave4 {
        top: 95px;
    }
    .wave6 {
        bottom: 120px;
    }
    .wave7 {
        bottom: 175px;
        left: 12%;
    }
    #thumbnail-carousel {
        width: 76%;
    }
    .fish12 {
        top: 11%;
    }
    .shark {
        top: 10%;
    }
}


@media (min-width:961px) and (max-width:980px) {
    .wave7 {
        left: 10%;
        bottom: 160px;
    }
    .wave5 {
        top: 190px;
    }
    .wave4 {
        top: 95px;
    }
    .wave6 {
        bottom: 120px;
    }
    .wave7 {
        bottom: 175px;
        left: 12%;
    }
    #thumbnail-carousel {
        width: 76%;
    }
    .fish12 {
        top: 11%;
    }
    .shark {
        top: 11%;
    }
}


@media (min-width:981px) and (max-width:992px) {
    .wave7 {
        left: 10%;
        bottom: 160px;
    }
    .wave5 {
        top: 190px;
    }
    .wave4 {
        top: 95px;
    }
    .wave6 {
        bottom: 120px;
    }
    .wave7 {
        bottom: 175px;
        left: 12%;
    }
    #thumbnail-carousel {
        width: 73%;
    }
    .fish12 {
        top: 11%;
    }
    .shark {
        top: 120px;
    }
    .turtle {
        width: 230px;
        left: 0rem;
        top: -18%;
    }
    .treasure {
        width: 180px;
        right: 0;
    }
}

@media (min-width:992px) and (max-width:992px) {
    .wave7 {
        left: 10%;
        bottom: 160px;
    }
    .wave5 {
        top: 190px;
    }
    .wave4 {
        top: 95px;
    }
    .wave6 {
        bottom: 120px;
    }
    .wave7 {
        bottom: 175px;
        left: 12%;
    }
    #thumbnail-carousel {
        width: 73%;
    }
    .fish12 {
        top: 11%;
    }
}


@media (min-width:992px) and (max-width:1024px) {

    .calendar-events {
        width: 360px;
        padding: 70px 10px 60px 10px;
        padding-left: 50px;
    }
    .title-overlay-new h3 {
        font-size: 20px;
    }
    .sidebar-hide .calendar-inner {
        max-width: calc(100% - 360px);
    }
    .bunglon {
        position: absolute;
        left: -10%;
        width: 250px;
        top: -300%;
    }
    /* HOMEPAGE */
    .descBanner {
        padding-top: 5rem;
    }
    .image-absolute-review {
        display: none;
    }
    .banner-title {
        font-size: 48px;
    }
    .title-review-influencer h1 {
        font-size: 42px;
    }
    .fish {
        right: 10px;
    }
    .fish3 {
        left: 30%;
        bottom: 25%;
    }
    .fish5 {
        width: 100px;
        right: 10px;
    }
    .fish6 {
        width: 90px;
        top: -95%;
        left: 15%;
    }
    .review-influencer-splide .splide__arrow--prev {
        left: 16rem;
    }
    .review-influencer-splide .splide__arrow--next {
        right: 16rem;
    }
    .head-title-ticketing h1 {
        font-size: 42px;
    }
    .head-title-ticketing p {
        width: 80%;
    }
    .grass {
        bottom: -26%;
    }
    .wave2 {
        top: 50px;
    }
    .wave3 {
        bottom: 50px;
    }
    .wave4 {
        top: 85px;
        width: 300px;
    }
    .wave5 {
        top: 170px;
        width: 250px;
    }
    .wave6 {
        width: 200px;
        right: 15%;
        bottom: 100px;
    }
    .wave7 {
        width: 300px;
        bottom: 140px;
        left: 10%;
    }
    .shark {
        width: 350px;
        top: 80px;
        right: 20%;
    }
    .title-journey-ocean h1 {
        font-size: 48px;
    }
    .title-showocean h1 {
        margin-bottom: 5rem;
        font-size: 48px;
    }
    #thumbnail-carousel {
        width: 59%;
    }
    .title-tenantus h1 {
        font-size: 42px;
    }
    #thumbnail-carousel {
        width: 71.5%;
    }
    #main-carousel .splide__arrow {
        top: 20%;
    }
    #main-carousel .splide__arrow--prev {
        z-index: 7;
        left: 1rem;
    }
    #main-carousel .splide__arrow--next {
        z-index: 7;
        right: 1rem;
    }
    #main-carousel .splide__slide p {
        width: 80%;
    }
    .title-newinformation {
        width: 80%;
    }
    .fox {
        width: 200px;
        bottom: 25px;
        right: 10px;
    }
    .title-reviews {
        text-align: center;
    }
    .title-reviews h1 {
        font-size: 48px;
    }
    .title-social {
        text-align: center;
    }
    .title-social h1 {
        font-size: 48px;
    }
    .title-klienOcean h2 {
        font-size: 48px;
    }
    .desc-tourism {
        text-align: center;
    }
    .turtle {
        width: 230px;
        left: 0rem;
        top: -18%;
    }
    .brand-footer {
        gap: 1rem;
    }
    .brand-footer img {
        width: 120px;
        object-fit: cover;
    }
    footer .box-center {
        justify-content: flex-start;
    }
    .bg-darkline {
        height: .5px;
    }
    .box-email {
        margin-bottom: 1rem;
    }
    .grass2 {
        top: 40rem;
     }
     .grass3 {
        top: 55rem;
        width: 250px;
        height: 1900px;
     }
     .grass4 {
        display: none;
     }
     .grass5 {
        top: 50rem;
        right: 0;
     }
     .grass6 {
        top: 55rem;
        width: 100px;
        height: 1900px;
     }
     .grass7 {
        display: none;
     }
     .grass10 {
         width: 250px;
         top: 55rem;
         right: 0;
     }
     .grass11 {
         top: 55rem;
         transform: rotate(90deg);
         width: 200px;
         left: 12%;
     }
     .grass12 {
         width: 200px;
         top: 140rem;
         left: 12%;
     }
     .grass13 {
         display: none;
     }
     .grass16 {
         top: 35rem;
     }
     .bird {
         display: none;
     }
     .bird2 {
         width: 90px;
         top: 110rem;
         right: 10%;
     }
     .bird3 {
         width: 90px;
         top: 67rem;
         left: 20%;
     }
     .bird4 {
         display: none;
     }
     .bird5 {
         display: none;
     }
     .akar1 {
        left: -40%;
        top: 90%;
        width: 100%;
     }
     .akar2 {
        right: -60%;
        top: 90%;
        width: 100%;
     }
     .head-title-ticketing h1 {
        font-size: 48px;
     }
     .title-review-influencer h1 {
        font-size: 48px;
     }
     .title-newinformation h1 {
        font-size: 48px;
     }
     .title-reviews h1 {
        text-align: left;
        font-size: 48px;
     }
     .title-reviews p {
        text-align: left;
     }
     .image-cust {
        justify-content: center;
     }
     .bg-white-review-cust {
        padding: 20px;
        background-color: #fff;
        border-radius: 15px;
    }
    .review-cust-splide .splide__arrow--next {
        right: 0;
    }
    .review-cust-splide .splide__arrow--prev {
        left: 0;
    }
    .card-tourism {
        position: relative;
        height: 385px;
        margin-bottom: 1rem;
    }
    .image-tourism video {
        height: 100%;
        width: 100%;
    }
    .image-tourism img {
        height: 385px;
        width: 254px;
        object-fit: cover;
    }
    .overlay-like-tourism {
        font-size: 12px;
    }
    .overlay-like-tourism img {
        width: 12px;
    }
    .overlay-comment-tourism {
        font-size: 12px;
    }
    .overlay-comment-tourism img {
        width: 12px;
    }
    .title-social h1 {
        font-size: 48px;
        text-align: left;
    }
    .desc-tourism {
        text-align: left;
    }
    .treasure {
        width: 150px;
        right: 0;
        bottom: 30px;
    }
    /* END HOME PAGE */


    /* TICKET FEE */
    .lato-font h1 {
        font-size: 28px;
     }
    .fish9 {
        width: 200px;
        top: -9%;
        left: 0;
    }
    .fish10 {
        width: 150px;
        top: -9%;
        right: 0;
    }
    .fish8 {
        z-index: -1;
        width: 100px;
        top: 9%;
    }
    .title-premiumpackage h1 {
        font-size: 48px;
    }
    .title-floormap h1 {
        font-size: 48px;
    }
    .floormap-journey .mb-200 {
        margin-bottom: 0 !important;
    }
    .padding-banner {
        padding-top: 17rem;
    }
    .lato-font h1 {
        font-size: 28px;
    }
    .lato-font h6 {
        font-size: 13px;
    }
    .card-premiumpackage {
        height: 100%;
    }
    .Premiumpakcage .mb-200 {
        margin-bottom: 0 !important;
    }
    .floormap-journey .card-ticketing {
        width: 330px;
    }
    .floormap-journey .card-ticketing img {
        object-fit: cover;
    }
    .box-card-addons:nth-child(odd) {
        display: flex;
        justify-content: end;
    }
    /* END TICKET FEE */


    /* PROMOTIONS */
    .Promotions {
        padding: 10rem 0 5rem 0;
    }
    .kerang {
        width: 200px;
        right: 0;
        top: 0;
    }
    /* END PROMOTIONS */


    /* ONCE */
    .akar3 {
        top: 9rem;
        left: -80%;
    }
    .akar4 {
        top: 9rem;
        right: -80%;
    }
    /* END ONCE */


    /* GUIDE */
    .desc-premium h1 {
        font-size: 42px;
    }
    .desc-premium p {
        font-size: 15px;
    }
    .desc-premium p br {
        display: none;
    }
    .title-guide h1 {
        font-size: 42px;
    }
    .title-guide p {
        font-size: 16px;
    }
    .frog2 {
        width: 100px;
        top: 2%;
        z-index: -1;
    }
    .image-guide {
        display: flex;
    }
    .desc-image-guide {
        margin-bottom: 0 !important;
    }
    .desc-image-guide p {
        font-size: 15px;
    }
    .frog2 {
        top: 10px;
        z-index: 1;
        width: 200px;
        right: 0;
    }
    .akar5 {
        left: -20%;
    }
    .akar6 {
        right: -10%;
    }
    /* END GUIDE */



    /* GUIDE */
    .desc-premium h1 {
        font-size: 42px;
    }
    .desc-premium p {
        font-size: 15px;
    }
    .desc-premium p br {
        display: none;
    }
    .title-guide h1 {
        font-size: 42px;
    }
    .title-guide p {
        font-size: 16px;
    }
    .frog2 {
        width: 100px;
        top: 2%;
        z-index: -1;
    }
    .image-guide {
        display: flex;
    }
    .desc-image-guide {
        margin-bottom: 0 !important;
    }
    .desc-image-guide p {
        font-size: 15px;
    }
    .frog2 {
        top: 10px;
        z-index: 1;
        width: 200px;
        right: 0;
    }
    .akar5 {
        left: -20%;
    }
    .akar6 {
        right: -10%;
    }
    /* END GUIDE */



    /* TENANTUS */
    .grass35 {
        top: 10rem;
        z-index: -2;
    }
    .shark5 {
        top: 10rem;
        right: 8%;
        z-index: 2;
        width: 350px;
    }
    .hand {
        height: 450px;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    /* END TENANT */



     /* MAP */
     .iguana3 {
        width: 320px;
    }
    .grass36 {
        left: 0;
        height: 1000px;
    }
    .grass37 {
        height: 1000px;
        bottom: -1%;
        left: 8%;
    }
    .grass40 {
        right: 5%;
    }
    .grass41 {
        height: 1300px;
    }
    .grass38 {
        width: 400px;
        left: 20px;
        top: -15%;
    }
    .grass39 {
        bottom: -2%;
    }
    .grass42 {
        bottom: 0;
        width: 220px;
        left: 10%;
        z-index: -1;
    }
    .download-map {
        margin-top: 3rem;
    }
    /* END MAP */


    /* SHOW */
    .fox2 {
        position: absolute;
        width: 150px;
        top: -23%;
        left: 10%;
        z-index: 2;
    }
    .title-show {
        padding: 40px 20px 20px 20px;
    }
    .box-show {
        margin: 1rem auto;
    }
    .paddingleft-show {
        padding-left: 0 !important;
    }
    /* END SHOW */


    /* PREMIUM PACKAGE */
    .title-premiumpackage h1 {
        font-size: 32px;
    }
    .snake2 {
        width: 200px;
    }
    .grass43 {
        display: none;
    }
    .grass44 {
        left: 0;
        height: 2000px;
    }
    .grass45 {
        display: none;
    }
    .grass46 {
        left: 0;
    }
    .grass47 {
        display: none;
    }
    .grass48 {
        display: none;
    }
    .grass49 {
        right: 0;
    }
    .grass50 {
        display: none;
    }
    .grass52 {
       left: 5%;
    }
    .bird8 {
        top: 10rem;
        right: 32%;
        width: 100px;
        z-index: -1;
    }
    .box-card-premium {
        margin: 1rem auto;
    }
    /* END PREMIUM PACKAGE */


    /* CONTACT */
    .title-Contactus h1,
    .title-contactus2 h1 {
        font-size: 42px;
    }
    .octopus {
        width: 350px;
        right: 0;
        z-index: -1;
        top: -50px;
    }
    .octopus2 {
        width: 350px;
        z-index: -1;
        top: 25rem;
    }
    /* END CONTACT */







     /* EXPERIENCES */
    .title-experiences h1 {
        font-size: 42px;
        color: #82E8FF;
    }
    .desc-experiences {
        color: #fff;
        font-size: 15px;
    } 
    .grass32 {
        top: 70rem;
        left: 15%;
        width: 400px;
    } 
    .indicator-merchan-web {
        gap: 0;
    }
    .kerang2 {
        z-index: -1;
    }
    .text-right br {
        display: none;
    }
     /*END EXPERIENCES  */


     .desc-aboutus {
        font-size: 16px;
        line-height: 1.6;
    }

    .box-image-schoolpackage .image-schoolpackage-2 {
        height: 385px;
    }
}


@media (min-width:1025px) and (max-width:1200px) {

    /* HOMEPAGE */
    .text-right br {
        display: none;
    }
    .descBanner {
        padding-top: 5rem;
    }
    .image-absolute-review img {
        width: 180px;
        height: 290px;
    }
    .banner-title {
        font-size: 50px;
    }
    .title-review-influencer h1 {
        font-size: 42px;
    }
    .fish {
        top: -15%;
        right: 90px;
    }
    .fish3 {
        right: 30%;
        bottom: 25%;
    }
    .fish5 {
        width: 100px;
        top: 25%;
        right: 15%;
    }
    .fish6 {
        width: 90px;
        top: -95%;
        left: 15%;
    }
    .review-influencer-splide .splide__arrow {
        top: 89%;
    }
    .review-influencer-splide .splide__arrow--prev {
        left: 18rem;
    }
    .review-influencer-splide .splide__arrow--next {
        right: 18rem;
    }
    .head-title-ticketing h1 {
        font-size: 42px;
    }
    .head-title-ticketing p {
        width: 80%;
    }
    .grass {
        bottom: -26%;
    }
    .wave2 {
        top: 40px;
    }
    .wave3 {
        bottom: 50px;
    }
    .wave4 {
        top: 85px;
        width: 300px;
    }
    .wave5 {
        top: 170px;
        width: 250px;
    }
    .wave6 {
        width: 200px;
        right: 15%;
        bottom: 100px;
    }
    .wave7 {
        width: 300px;
        bottom: 145px;
        left: 12%;
    }
    .shark {
        width: 350px;
        top: 80px;
        right: 20%;
    }
    .title-journey-ocean h1 {
        font-size: 48px;
    }
    .title-showocean h1 {
        margin-bottom: 5rem;
        font-size: 48px;
    }
    #thumbnail-carousel {
        width: 70%;
    }
    .title-tenantus h1 {
        font-size: 42px;
    }
    #main-carousel .splide__arrow {
        top: -40%;
    }
    #main-carousel .splide__arrow--prev {
        z-index: 7;
        left: 7rem;
    }
    #main-carousel .splide__arrow--next {
        z-index: 7;
        right: 7rem;
    }
    #main-carousel .splide__slide p {
        width: 80%;
    }
    .title-newinformation {
        width: 80%;
    }
    .fox {
        width: 200px;
        bottom: 25px;
        right: 9%;
    }
    .title-reviews {
        text-align: center;
    }
    .title-reviews h1 {
        font-size: 48px;
    }
    .title-social {
        text-align: center;
    }
    .title-social h1 {
        font-size: 48px;
    }
    .title-klienOcean h2 {
        font-size: 48px;
    }
    .desc-tourism {
        text-align: center;
    }
    .turtle {
        width: 230px;
        left: 0;
    }
    .brand-footer {
        gap: 1rem;
    }
    .brand-footer img {
        width: 120px;
        object-fit: cover;
    }
    footer .box-center {
        justify-content: flex-start;
    }
    .bg-darkline {
        height: .5px;
    }
    .box-email {
        margin-bottom: 1rem;
    }
    .grass2 {
        top: 35rem;
     }
     .grass3 {
        top: 60rem;
        width: 250px;
        height: 1900px;
     }
     .grass4 {
        top: 55rem;
        width: 90px;
        height: 1900px;
        right: 5%;
        z-index: -1;
     }
     .grass5 {
        top: 50rem;
        right: 0;
     }
     .grass6 {
        top: 60rem;
        width: 100px;
        height: 1900px;
     }
     .grass7 {
        display: none;
     }
     .grass10 {
         width: 250px;
         top: 55rem;
         right: 0;
     }
     .grass11 {
         top: 55rem;
         transform: rotate(90deg);
         width: 200px;
         left: 12%;
     }
     .grass12 {
         width: 250px;
         top: 137rem;
         left: 10%;
     }
     .grass13 {
        width: 250px;
        top: 155rem;
        left: 10%;
     }
     .grass16 {
         top: 35rem;
     }
     .bird {
         display: none;
     }
     .bird2 {
         width: 90px;
         top: 114rem;
         right: 12%;
     }
     .bird3 {
         width: 90px;
         top: 67rem;
         right: 20%;
     }
     .bird4 {
         display: none;
     }
     .bird5 {
         display: none;
     }
     .akar1 {
        left: -40%;
        top: 95%;
        width: 100%;
     }
     .akar2 {
        right: -50%;
        top: 95%;
        width: 100%;
     }
     .head-title-ticketing h1 {
        font-size: 48px;
     }
     .title-review-influencer h1 {
        font-size: 48px;
     }
     .title-newinformation h1 {
        font-size: 48px;
     }
     .title-reviews h1 {
        text-align: left;
        font-size: 48px;
     }
     .title-reviews p {
        text-align: left;
     }
     .image-cust {
        justify-content: center;
     }
     .bg-white-review-cust {
        padding: 20px;
        background-color: #fff;
        border-radius: 15px;
    }
    .review-cust-splide .splide__arrow--next {
        right: 0;
    }
    .review-cust-splide .splide__arrow--prev {
        left: 0;
    }
    .card-tourism {
        position: relative;
        height: 385px;
        margin-bottom: 1rem;
    }
    .image-tourism video {
        height: 100%;
        width: 100%;
    }
    .image-tourism img {
        height: 385px;
        width: 254px;
        object-fit: cover;
    }
    .overlay-like-tourism {
        font-size: 12px;
    }
    .overlay-like-tourism img {
        width: 12px;
    }
    .overlay-comment-tourism {
        font-size: 12px;
    }
    .overlay-comment-tourism img {
        width: 12px;
    }
    .title-social h1 {
        font-size: 48px;
        text-align: left;
    }
    .desc-tourism {
        text-align: left;
    }
    .treasure {
        width: 150px;
        right: 40px;
        bottom: 30px;
    }
    .popup-template {
        width: 95vw;
    }
    .turtle {
        width: 230px;
        left: 0rem;
        top: -18%;
    }
    .bunglon {
        position: absolute;
        left: -10%;
        width: 250px;
        top: -300%;
    }
    /* END HOME PAGE */


     /* TICKET FEE */
     .lato-font h1 {
        font-size: 28px;
     }
     .lato-font h6 {
        font-size: 15px;
     }
    .fish9 {
        width: 200px;
        top: -9%;
        left: 0;
    }
    .fish10 {
        width: 150px;
        top: -9%;
        right: 0;
    }
    .fish8 {
        z-index: -1;
        width: 100px;
        top: 9%;
    }
    .title-premiumpackage h1 {
        font-size: 48px;
    }
    .title-floormap h1 {
        font-size: 48px;
    }
    .floormap-journey .mb-200 {
        margin-bottom: 0 !important;
    }
    .padding-banner {
        padding-top: 17rem;
    }
    .Premiumpackage .mb-200 {
        margin-bottom: 0 !important;
    }
    .floormap-journey .card-ticketing {
        width: 330px;
    }
    .floormap-journey .card-ticketing img {
        object-fit: cover;
    }
    .box-card-addons:nth-child(odd) {
        display: flex;
        justify-content: end;
    }
    /* END TICKET FEE */


    /* PROMOTIONS */
    .Promotions {
        padding: 10rem 0 5rem 0;
    }
    .kerang {
        width: 200px;
        right: 0;
        top: 0;
    }
    /* END PROMOTIONS */


    /* FAQ */
    .descBanner2 {
        padding-top: 5rem;
    }
    .header-question {
        width: 85%;
    }
    .header-question h4 {
        font-size: 15px;
    }
    .answer p {
        font-size: 14px;
    }
    /* END FAQ */



    /* ONCE */
    .akar3 {
        top: 9rem;
        left: -80%;
    }
    .akar4 {
        top: 9rem;
        right: -80%;
    }
    .fish11 {
        bottom: 19%;
        right: 4%;
        width: 350px;
    }
    /* END ONCE */


       /* GUIDE */
       .desc-premium h1 {
        font-size: 42px;
    }
    .desc-premium p {
        font-size: 15px;
    }
    .desc-premium p br {
        display: none;
    }
    .title-guide h1 {
        font-size: 42px;
    }
    .title-guide p {
        font-size: 16px;
    }
    .frog2 {
        width: 100px;
        top: 2%;
        z-index: -1;
    }
    .image-guide {
        display: flex;
    }
    .desc-image-guide {
        margin-bottom: 0 !important;
    }
    .desc-image-guide p {
        font-size: 15px;
    }
    .frog2 {
        top: 10px;
        z-index: 1;
        width: 200px;
        right: 0;
    }
    .akar5 {
        left: -20%;
    }
    .akar6 {
        right: -20%;
    }
    /* END GUIDE */



    /* TENANTUS */
    .grass35 {
        top: 10rem;
        z-index: -2;
    }
    .shark5 {
        top: 10rem;
        right: 15%;
        z-index: 2;
        width: 400px;
    }
    .hand {
        height: 450px;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    /* END TENANT */


    /* MAP */
    .iguana3 {
        width: 320px;
    }
    .grass36 {
        left: 0;
        height: 1500px;
    }
    .grass37 {
        height: 1000px;
        bottom: -1%;
        left: 8%;
    }
    .grass40 {
        right: 5%;
    }
    .grass41 {
        height: 1300px;
    }
    .grass38 {
        width: 400px;
        left: 20px;
        top: -15%;
    }
    .grass39 {
        bottom: -2%;
    }
    .grass42 {
        bottom: 0;
        width: 220px;
        left: 10%;
        z-index: -1;
    }
    .download-map {
        margin-top: 3rem;
    }
    /* END MAP */



    /* SHOW */
    .fox2 {
        position: absolute;
        width: 150px;
        top: -23%;
        left: 10%;
        z-index: 2;
    }
    .title-show {
        padding: 40px 20px 20px 20px;
    }
    .title-show h2 {
        font-size: 28px;
    }
    .box-show {
        margin: 1rem auto;
    }
    .paddingleft-show {
        padding-left: 0 !important;
    }
    /* END SHOW */



    /* PREMIUM PACKAGE */
    .title-premiumpackage h1 {
        font-size: 32px;
    }
    .snake2 {
        width: 200px;
    }
    .grass43 {
        display: none;
    }
    .grass44 {
        left: 0;
        height: 2000px;
    }
    .grass45 {
        display: none;
    }
    .grass46 {
        left: 0;
    }
    .grass47 {
        display: none;
    }
    .grass48 {
        display: none;
    }
    .grass49 {
        right: 0;
    }
    .grass50 {
        display: none;
    }
    .grass52 {
       left: 5%;
    }
    .bird8 {
        top: 10rem;
        right: 32%;
        width: 100px;
        z-index: -1;
    }
    .box-card-premium {
        margin: 1rem auto;
    }
    /* END PREMIUM PACKAGE */



    /* CONTACT */
    .title-Contactus h1,
    .title-contactus2 h1 {
        font-size: 48px;
    }
    .octopus {
        width: 350px;
        right: 0;
        z-index: -1;
        top: -50px;
    }
    .octopus2 {
        width: 350px;
        z-index: -1;
        top: 25rem;
    }
    /* END CONTACT */







      /* EXPERIENCES */
    .title-experiences h1 {
        font-size: 42px;
        color: #82E8FF;
    }
    .desc-experiences {
        color: #fff;
        font-size: 15px;
    }  
     /*END EXPERIENCES  */



      /* MERCHANDISE */
    .title-merchandise2 p br {
        display: none;
    }
    .indicator-merchan-web {
        gap: 0;
    }
    .kerang2 {
        right: -12%;
        z-index: -1;
    }
    /* END MERCHANDISE */

    .desc-aboutus {
        font-size: 16px;
        line-height: 1.6;
    }

    .box-image-schoolpackage .image-schoolpackage-2 {
        height: 385px;
    }
    .grass32 {
        top: 70%;
    }

}

@media (min-width:1131px) and (max-width:1200px) {
    #thumbnail-carousel {
        width: 63%;
    }

}

@media (min-width:1168px) and (max-width:1200px) {
    .wave5 {
        top: 190px;
    }
    .wave7 {
        bottom: 160px;
    }
    .akar5 {
        left: -10%;
    }
    .akar6 {
        right: -5%;
    }
    .shark {
        width: 350px;
        top: 100px;
        right: 20%;
    }
}

@media (min-width:1201px) and (max-width:1440px) {
        /* HOMEPAGE */
        .descBanner {
            padding-top: 7rem;
        }
        .title-overlay-new h3 {
            font-size: 20px;
        }
        .box-image-lit h3 {
            font-size: 20px;
        }
        .text-576 {
            font-size: 13px;
        }
        .desc-new p {
            font-size: 13px;
        }
        .image-absolute-review img {
            width: 230px;
            height: 330px;
        }
        .banner-title {
            font-size: 50px;
        }
        .title-review-influencer h1 {
            font-size: 42px;
        }
        .fish {
            top: -15%;
            right: 90px;
        }
        .fish3 {
            right: 30%;
            bottom: 25%;
        }
        .fish5 {
            width: 100px;
            top: 25%;
            right: 15%;
        }
        .fish6 {
            width: 90px;
            top: -95%;
            left: 20%;
        }
        .review-influencer-splide .splide__arrow {
            top: 89%;
        }
        .review-influencer-splide .splide__arrow--prev {
            left: 27rem;
        }
        .review-influencer-splide .splide__arrow--next {
            right: 27rem;
        }
        .head-title-ticketing h1 {
            font-size: 42px;
        }
        .head-title-ticketing p {
            width: 80%;
        }
        .grass {
            bottom: -26%;
        }
        .wave2 {
            top: 20px;
        }
        .wave3 {
            bottom: 20px;
        }
        .wave4 {
            top: 85px;
            width: 300px;
        }
        .wave5 {
            top: 170px;
            width: 250px;
        }
        .wave6 {
            width: 200px;
            right: 15%;
            bottom: 85px;
        }
        .wave7 {
            width: 300px;
            bottom: 145px;
            left: 12%;
        }
        .shark {
            width: 350px;
            top: 100px;
            right: 20%;
        }
        .title-journey-ocean h1 {
            font-size: 48px;
        }
        .title-showocean h1 {
            margin-bottom: 5rem;
            font-size: 48px;
        }
        .title-tenantus h1 {
            font-size: 42px;
        }
        #main-carousel .splide__arrow {
            top: -60%;
        }
        #main-carousel .splide__arrow--prev {
            z-index: 7;
            left: 15rem;
        }
        #main-carousel .splide__arrow--next {
            z-index: 7;
            right: 15rem;
        }
        #main-carousel .splide__slide p {
            width: 80%;
        }
        .title-newinformation {
            width: 80%;
        }
        .fox {
            width: 200px;
            bottom: 10px;
            right: 3%;
        }
        .title-reviews {
            text-align: center;
        }
        .title-reviews h1 {
            font-size: 48px;
        }
        .title-social {
            text-align: center;
        }
        .title-social h1 {
            font-size: 48px;
        }
        .title-klienOcean h2 {
            font-size: 48px;
        }
        .desc-tourism {
            text-align: center;
        }
        .turtle {
            width: 200px;
            left: 0rem;
            top: -10%;
        }
        .brand-footer {
            gap: 1rem;
        }
        .brand-footer img {
            width: 120px;
            object-fit: cover;
        }
        footer .box-center {
            justify-content: flex-start;
        }
        .bg-darkline {
            height: .5px;
        }
        .box-email {
            margin-bottom: 1rem;
        }
        .grass2 {
            top: 35rem;
         }
         .grass3 {
            top: 60rem;
            width: 250px;
            height: 1900px;
         }
         .grass4 {
            top: 55rem;
            width: 90px;
            height: 1900px;
            right: 5%;
            z-index: -1;
         }
         .grass5 {
            top: 50rem;
            right: 0;
         }
         .grass6 {
            top: 65rem;
            width: 150px;
            height: 1900px;
         }
         .grass7 {
            display: none;
         }
         .grass10 {
             width: 250px;
             top: 55rem;
             right: 0;
         }
         .grass11 {
             top: 55rem;
             transform: rotate(90deg);
             width: 200px;
             left: 12%;
         }
         .grass12 {
             width: 250px;
             top: 137rem;
             left: 10%;
         }
         .grass13 {
            width: 250px;
            top: 155rem;
            left: 10%;
         }
         .grass16 {
             top: 35rem;
         }
         .bird {
             display: none;
         }
         .bird2 {
             width: 90px;
             top: 114rem;
             right: 12%;
         }
         .bird3 {
             width: 90px;
             top: 67rem;
             right: 20%;
         }
         .bird4 {
            width: 90px;
            top: 114rem;
         }
         .bird5 {
             display: none;
         }
         .akar1 {
            left: -40%;
            top: 110%;
            width: 100%;
         }
         .akar2 {
            right: -20%;
            top: 110%;
            width: 100%;
         }
         .head-title-ticketing h1 {
            font-size: 48px;
         }
         .title-review-influencer h1 {
            font-size: 48px;
         }
         .title-newinformation h1 {
            font-size: 48px;
         }
         .title-reviews h1 {
            text-align: left;
            font-size: 48px;
         }
         .title-reviews p {
            text-align: left;
         }
         .image-cust {
            justify-content: start;
         }
         .bg-white-review-cust {
            padding: 40px 4rem;
            background-color: #fff;
            border-radius: 15px;
        }
        .review-cust-splide .splide__arrow--next {
            right: 0;
        }
        .review-cust-splide .splide__arrow--prev {
            left: 0;
        }
        .card-tourism {
            position: relative;
            height: 465px;
            margin-bottom: 1rem;
        }
        .image-tourism video {
            height: 100%;
            width: 100%;
        }
        .image-tourism img {
            height: 465px;
            width: 254px;
            object-fit: cover;
        }
        .overlay-like-tourism {
            font-size: 12px;
        }
        .overlay-like-tourism img {
            width: 12px;
        }
        .overlay-comment-tourism {
            font-size: 12px;
        }
        .overlay-comment-tourism img {
            width: 12px;
        }
        .title-social h1 {
            font-size: 48px;
            text-align: left;
        }
        .desc-tourism {
            text-align: left;
        }
        .treasure {
            width: 150px;
            right: 40px;
            bottom: 30px;
        }
        #thumbnail-carousel {
            width: 59.5%;
        }
        .popup-template {
            width: 70vw;
        }
        .shark {
            width: 350px;
            top: 100px;
            right: 20%;
        }
        #main-carousel .splide__arrow {
            top: -45%;
        }
        #main-carousel .splide__arrow--next {
            right: 11rem;
        }
        #main-carousel .splide__arrow--prev {
            left: 11rem;
        }
        /* END HOME PAGE */


        /* TICKET FEE */
        .lato-font h1 {
            font-size: 32px;
         }
    .fish9 {
        width: 200px;
        top: -9%;
        left: 0;
    }
    .fish10 {
        width: 150px;
        top: -9%;
        right: 0;
    }
    .fish8 {
        z-index: -1;
        width: 100px;
        top: 9%;
    }
    .title-premiumpackage h1 {
        font-size: 48px;
    }
    .title-floormap h1 {
        font-size: 48px;
    }
    .floormap-journey .mb-200 {
        margin-bottom: 0 !important;
    }
    .padding-banner {
        padding-top: 10rem;
    }
    .Premiumpackage .mb-200 {
        margin-bottom: 0 !important;
    }
    /* END TICKET FEE */


    /* PROMOTIONS */
    .kerang {
        width: 350px;
        right: 0;
        top: 0;
        z-index: -1;
    }
    /* END PROMOTIONS */


      /* FAQ */
    .header-question {
        width: 85%;
    }
    .header-question h4 {
        font-size: 20px;
    }
    .answer p {
        font-size: 15px;
    }
    /* END FAQ */


     /* ONCE */
     .akar3 {
        top: 10rem;
        left: -70%;
    }
    .akar4 {
        top: 10rem;
        right: -70%;
    }
    .fish11 {
        bottom: 19%;
        right: 4%;
        width: 350px;
    }
    /* END ONCE */

    
    /* GUIDE */
    .akar5 {
        left: -70%;
    }
    .akar6 {
        right: -70%;
    }
    /* END GUIDE */   


    /* TENANTUS */
    .grass35 {
        top: 10rem;
        z-index: -2;
    }
    .shark5 {
        top: 10rem;
        right: 15%;
        z-index: 2;
        width: 400px;
    }
    .hand {
        height: 500px;
    }
    .hand-image {
        width: 100%;
        height: 100%;
    }
    /* END TENANT */


    /* MAP */
    .iguana3 {
        width: 370px;
    }
    .grass36 {
        left: 0;
        height: 1500px;
    }
    .grass37 {
        height: 1000px;
        bottom: -1%;
        left: 8%;
    }
    .grass40 {
        right: 5%;
    }
    .grass41 {
        height: 1500px;
    }
    .grass38 {
        width: 400px;
        left: 20px;
        top: -15%;
    }
    .grass39 {
        bottom: -2%;
    }
    .grass42 {
        bottom: 0;
        width: 320px;
        left: 10%;
        z-index: -1;
    }
    .download-map {
        margin-top: 3rem;
    }
    /* END MAP */



    /* SHOW */
    .fox2 {
        position: absolute;
        width: 250px;
        top: -150%;
        left: 6%;
        z-index: 2;
    }
    .title-show {
        padding: 40px 20px 20px 20px;
    }
    .box-show {
        margin: 1rem auto;
    }
    /* END SHOW */


    /* PREMIUM PACKAGE */
    .title-premiumpackage h1 {
        font-size: 32px;
    }
    .snake2 {
        width: 200px;
    }
    .grass43 {
        left: 0;
    }
    .grass44 {
        left: 10%;
        height: 2000px;
    }
    .grass45 {
        display: none;
    }
    .grass46 {
        left: 0;
    }
    .grass49 {
        right: 0;
    }
    .grass50 {
        right: 5%;
    }
    .grass52 {
       left: 15%;
    }
    .bird8 {
        top: 10rem;
        right: 32%;
        width: 100px;
        z-index: -1;
    }
    .box-card-premium {
        margin: 1rem auto;
    }
    /* END PREMIUM PACKAGE */


    /* CONTACT */
    .title-Contactus h1,
    .title-contactus2 h1 {
        font-size: 48px;
    }
    .octopus {
        width: 400px;
        right: 0;
        z-index: -1;
        top: -100px;
    }
    .octopus2 {
        width: 400px;
        z-index: -1;
        top: 25rem;
    }
    /* END CONTACT */







      /* EXPERIENCES */
    .title-experiences h1 {
        font-size: 42px;
        color: #82E8FF;
    }
    .desc-experiences {
        color: #fff;
        font-size: 17px;
    }  
    .grass32 {
        top: 70rem;
        left: 15%;
        width: 400px;
    } 
    .kerang2 {
        right: -10%;
        z-index: -1;
    }
     /*END EXPERIENCES  */


     .bunglon {
        position: absolute;
        left: -5%;
        width: 320px;
        top: -400%;
    }
    .desc-aboutus {
        font-size: 18px;
        line-height: 1.6;
    }


    

}
@media (min-width:1300px) and (max-width:1440px) {
    .shark {
        top: 120px;
    }
}

@media (min-width:1280px) and (max-width:1350px) {
    .wave5 {
        top: 190px;
    }
    .akar3 {
        top: 10rem;
        left: -50%;
    }
    .akar4 {
        top: 10rem;
        right: -50%;
    }
    .akar5 {
        left: -65%;
    }
    .akar6 {
        right: -65%;
    }
    #thumbnail-carousel {
        width: 56%;
    }
}
@media (min-width:1351px) and (max-width:1440px) {
    .wave2 {
        top: 0;
    }
    .wave3 {
        bottom: 10px;
    }
    .wave4 {
        top: 70px;
        left: 12%;
        width: 350px;
    }
    .wave5 {
        top: 190px;
    }
    .wave7 {
        width: 350px;
        left: 13%;
        bottom: 145px;
    }
    .kerang {
        width: 400px;
        right: 10%;
        top: 0;
        z-index: -1;
    }
    .akar3 {
        top: 10rem;
        left: -50%;
    }
    .akar4 {
        top: 10rem;
        right: -50%;
    }
    .akar5 {
        left: -60%;
    }
    .akar6 {
        right: -60%;
    }
    #thumbnail-carousel {
        width: 53.5%;
    }
}
@media (min-width:1400px) and (max-width:1440px) {

    
    .hand {
        height: 600px;
    }
    .iguana3 {
        width: 390px;
    }
    .fox2 {
        position: absolute;
        top: -150%;
        left: 12%;
        z-index: 2;
    }
    .title-show {
        padding: 4rem 20px 20px 20px;
    }
    .box-show {
        margin: 1rem auto;
    }
    .fish6 {
        width: 90px;
        top: -115%;
        left: 24%;
    }
    .shark {
        top: 130px;
    }
    #thumbnail-carousel {
        width: 50%;
    }
    .card-tourism {
        position: relative;
        height: 545px;
        margin-bottom: 1rem;
    }
    .image-tourism video {
        height: 100%;
        width: 100%;
    }
    .image-tourism img {
        height: 545px;
        width: 306px;
        object-fit: cover;
    }
    .grass57 {
        width: 100%;
        left: -5%;
        bottom: -50%;
    }
    .grass58 {
        width: 100%;
        right: -5%;
        bottom: -50%;
    }
}

@media (min-width:1440px) and (max-width:1440px) {
    .fish8 {
        top: 13%;
        right: 20%;
    }
    .fish9 {
        width: 250px;
    }
    .akar3 {
        top: 10rem;
        left: -50%;
    }
    .akar4 {
        top: 10rem;
        right: -50%;
    }
    .akar5 {
        left: -55%;
    }
    .akar6 {
        right: -55%;
    }
    .turtle {
        width: 230px;
        left: 4rem;
        top: -10%;
    }
   
}

@media (min-width:1441px) and (max-width:1628px) {
    /* HOMEPAGE */
    .descBanner {
        padding-top: 7rem;
    }
    .title-overlay-new h3 {
        font-size: 26px;
    }
    .image-absolute-review img {
        width: 230px;
        height: 330px;
    }
    .banner-title {
        font-size: 50px;
    }
    .title-review-influencer h1 {
        font-size: 42px;
    }
    .fish {
        top: -15%;
        right: 90px;
    }
    .fish3 {
        right: 30%;
        bottom: 25%;
    }
    .fish5 {
        width: 100px;
        top: 25%;
        right: 15%;
    }
    .fish6 {
        width: 90px;
        top: -115%;
        left: 24%;
    }
    .review-influencer-splide .splide__arrow {
        top: 89%;
    }
    .review-influencer-splide .splide__arrow--prev {
        left: 27rem;
    }
    .review-influencer-splide .splide__arrow--next {
        right: 27rem;
    }
    .head-title-ticketing h1 {
        font-size: 42px;
    }
    .head-title-ticketing p {
        width: 80%;
    }
    .grass {
        bottom: -26%;
    }
    .wave2 {
        top: -30px;
    }
    .wave3 {
        bottom: -30px;
    }
    .wave4 {
        top: 55px;
        width: 350px;
    }
    .wave5 {
        top: 170px;
        width: 250px;
    }
    .wave6 {
        width: 250px;
        right: 15%;
        bottom: 50px;
    }
    .wave7 {
        width: 350px;
        bottom: 125px;
        left: 12%;
    }
    .shark {
        width: 350px;
        top: 140px;
        right: 19%;
    }
    .title-journey-ocean h1 {
        font-size: 48px;
    }
    .title-showocean h1 {
        margin-bottom: 5rem;
        font-size: 48px;
    }
    .title-tenantus h1 {
        font-size: 42px;
    }
    #main-carousel .splide__arrow {
        top: -60%;
    }
    #main-carousel .splide__arrow--prev {
        z-index: 7;
        left: 15rem;
    }
    #main-carousel .splide__arrow--next {
        z-index: 7;
        right: 15rem;
    }
    #main-carousel .splide__slide p {
        width: 80%;
    }
    .title-newinformation {
        width: 80%;
    }
    .fox {
        width: 200px;
        bottom: 10px;
        right: 3%;
    }
    .title-reviews {
        text-align: center;
    }
    .title-reviews h1 {
        font-size: 48px;
    }
    .title-social {
        text-align: center;
    }
    .title-social h1 {
        font-size: 48px;
    }
    .title-klienOcean h2 {
        font-size: 48px;
    }
    .desc-tourism {
        text-align: center;
    }
    .turtle {
        width: 250px;
        left: 6rem;
        top: -10%;
    }
    .brand-footer {
        gap: 1rem;
    }
    .brand-footer img {
        width: 120px;
        object-fit: cover;
    }
    footer .box-center {
        justify-content: flex-start;
    }
    .bg-darkline {
        height: .5px;
    }
    .box-email {
        margin-bottom: 1rem;
    }
    .grass2 {
        top: 35rem;
     }
     .grass3 {
        top: 60rem;
        width: 250px;
        height: 1900px;
     }
     .grass4 {
        top: 55rem;
        width: 90px;
        height: 1900px;
        right: 5%;
        z-index: -1;
     }
     .grass5 {
        top: 50rem;
        right: 0;
     }
     .grass6 {
        top: 65rem;
        width: 150px;
        height: 1900px;
     }
     .grass7 {
        display: none;
     }
     .grass10 {
         width: 250px;
         top: 55rem;
         right: 0;
     }
     .grass11 {
         top: 55rem;
         transform: rotate(90deg);
         width: 200px;
         left: 12%;
     }
     .grass12 {
         width: 250px;
         top: 137rem;
         left: 10%;
     }
     .grass13 {
        width: 250px;
        top: 155rem;
        left: 10%;
     }
     .grass16 {
         top: 35rem;
     }
     .bird {
         display: none;
     }
     .bird2 {
         width: 90px;
         top: 114rem;
         right: 12%;
     }
     .bird3 {
         width: 90px;
         top: 67rem;
         right: 20%;
     }
     .bird4 {
        width: 90px;
        top: 114rem;
     }
     .bird5 {
         display: none;
     }
     .akar1 {
        left: -40%;
        top: 110%;
        width: 100%;
     }
     .akar2 {
        right: -20%;
        top: 110%;
        width: 100%;
     }
     .head-title-ticketing h1 {
        font-size: 48px;
     }
     .title-review-influencer h1 {
        font-size: 48px;
     }
     .title-newinformation h1 {
        font-size: 48px;
     }
     .title-reviews h1 {
        text-align: left;
        font-size: 48px;
     }
     .title-reviews p {
        text-align: left;
     }
     .image-cust {
        justify-content: start;
     }
     .bg-white-review-cust {
        padding: 40px 4rem;
        background-color: #fff;
        border-radius: 15px;
    }
    .review-cust-splide .splide__arrow--next {
        right: 0;
    }
    .review-cust-splide .splide__arrow--prev {
        left: 0;
    }
    .card-tourism {
        position: relative;
        height: 545px;
        margin-bottom: 1rem;
    }
    .image-tourism video {
        height: 100%;
        width: 100%;
    }
    .image-tourism img {
        height: 545px;
        width: 306px;
        object-fit: cover;
    }
    .overlay-like-tourism {
        font-size: 12px;
    }
    .overlay-like-tourism img {
        width: 12px;
    }
    .overlay-comment-tourism {
        font-size: 12px;
    }
    .overlay-comment-tourism img {
        width: 12px;
    }
    .title-social h1 {
        font-size: 48px;
        text-align: left;
    }
    .desc-tourism {
        text-align: left;
    }
    .treasure {
        width: 150px;
        right: 40px;
        bottom: 30px;
    }
    #thumbnail-carousel {
        width: 44.5%;
    }
    /* END HOME PAGE */


    /* TICKET FEE */
    .fish8 {
        z-index: -1;
        top: 13%;
        right: 20%;
    }
    .fish9 {
        left: 0;
        width: 300px;
    }
    .fish10 {
        right: 0;
    }
    .Premiumpackage .mb-200 {
        margin-bottom: 0 !important;
    }
    /* END TICKET FEE */



    /* ONCE */
    .fish11 {
        bottom: 15%;
        right: 4%;
        width: 500px;
    }
    /* END ONCE */


    /* GUIDE */
    .akar5 {
        left: -55%;
    }
    .akar6 {
        right: -55%;
    }
    /* END GUIDE */



    /* MAP */
    .iguana3 {
        width: 390px;
    }
    .grass36 {
        left: 0;
        height: 1500px;
    }
    .grass37 {
        height: 1000px;
        bottom: -1%;
        left: 8%;
    }
    .grass40 {
        right: 5%;
    }
    .grass41 {
        height: 1300px;
    }
    .grass38 {
        width: 400px;
        left: 20px;
        top: -15%;
    }
    .grass39 {
        bottom: -2%;
    }
    .grass42 {
        bottom: 0;
        width: 320px;
        left: 10%;
        z-index: -1;
    }
    .download-map {
        margin-top: 3rem;
    }
    /* END MAP */


    /* PREMIUM PACKAGE */
    .snake2 {
        width: 250px;
    }
    /* END PREMIUM PACKAGE */


    /* CONTACT */
    .title-Contactus h1,
    .title-contactus2 h1 {
        font-size: 48px;
    }
    .octopus {
        width: 400px;
        right: 0;
        z-index: -1;
        top: -100px;
    }
    .octopus2 {
        width: 400px;
        z-index: -1;
        top: 21rem;
    }
    /* END CONTACT */

}


@media (min-width:1550px) and (max-width:1628px) {
    .wave5 {
        top: 195px;
    }
    .turtle {
        left: 4rem;
    }
}

@media (min-width:1601px) and (max-width:1628px) {
    .wave7 {
        width: 370px;
        left: 15%;
    }
}


@media (min-width:1629px) and (max-width:1728px) {

    .descBanner {
        padding-top: 6rem;
    }
    .fish6 {
        width: 100px;
        top: -100%;
        left: 23%;
    }
    .grass56 {
        top: 20%;
    }
    .wave2 {
        top: -50px;
    }
    .wave3 {
        bottom: -30px;
    }
    .wave7 {
        bottom: 90px;
        left: 7%;
    }
    #thumbnail-carousel {
        width: 44%;
    }
    #main-carousel .splide__arrow--next {
        right: 22rem;
    }
    #main-carousel .splide__arrow--prev {
        left: 22rem;
    }
    .fish11 {
        bottom: 15%;
        right: 4%;
        width: 500px;
    }
    .grass42 {
        bottom: 0;
        width: 390px;
        left: 5%;
        z-index: -1;
    }
    .grass40 {
        right: 5%;
    }
    .title-Contactus h1,
    .title-contactus2 h1 {
        font-size: 48px;
    }
    .octopus {
        width: 400px;
        right: 0;
        z-index: -1;
        top: -100px;
    }
    .octopus2 {
        width: 400px;
        z-index: -1;
        top: 21rem;
    }
    #thumbnail-carousel {
        width: 42.5%;
    }
    .turtle {
        left: 8rem;
    }
    .grass32 {
        top: 60rem;
        left: 13%;
    } 
    .title-overlay-new h3 {
        font-size: 20px;
    }
    .box-image-lit h3 {
        font-size: 20px;
    }
    .overlay-image-latest-big h3 {
        font-size: 20px;
    }
    .text-576 {
        font-size: 14px;
    }
}

@media (min-width:1729px) and (max-width:1828px) {

    .descBanner {
        padding-top: 6rem;
    }
    .fish6 {
        top: -125%;
        left: 22%;
    }
    .wave2 {
        top: -50px;
    }
    .wave3 {
        bottom: -30px;
    }
    .wave7 {
        bottom: 90px;
        left: 7%;
    }
    #thumbnail-carousel {
        width: 41%;
    }
    #main-carousel .splide__arrow--prev {
        z-index: 7;
        left: 25rem;
    }
    #main-carousel .splide__arrow--next {
        z-index: 7;
        right: 25rem;
    }
    .fish11 {
        bottom: 15%;
        right: 4%;
        width: 500px;
    }
    .octopus {
        width: 400px;
    }
    .octopus2 {
        width: 400px;
    }
    .turtle {
        left: 10rem;
    }
}

@media (min-width:1780px) and (max-width:1829px) {
    .wave4 {
        top: 15px;
    }
    .wave7 {
        bottom: 95px;
    }
    .octopus {
        width: 400px;
    }
    .octopus2 {
        width: 400px;
    }
    .turtle {
        left: 13rem;
    }
}

@media (min-width:1830px) and (max-width:2000px) {
    .turtle {
        left: 13rem;
    }
}

@media (min-width:1629px) and (max-width:2200px) {
    .Premiumpackage .mb-200 {
        margin-bottom: 0 !important;
    }
    .fish11 {
        bottom: 15%;
        width: 500px;
    }
}

@media (max-width:576px) {
    .contactus2 .col-sm-4 {
        flex: 0 0 auto;
    }
    .showbx-filter-tab {
        padding: 10px 14px;
        font-size: 13px;
    }
    .Schoolpackage-slide .col-sm-6 {
        flex: 0 0 auto;
        width: 50%;
    }
    .image-latest-lit {
        height: 300px;
    }
    .image-lay-overlay img {
        height: 300px;
    }
    .grass57 {
        bottom: 175%;
    }
    .box-new-whats {
        position: relative;
    }
    .box-new-whats2 {
        position: relative;
    }
    .box-new-whats3 {
        position: relative;
    }
    .box-image-lit {
        position: absolute;
        padding: 0 30px;
        bottom: 20px;
        z-index: 2;
    }
    .box-image-lit .text-576 {
        display: none;
    }
    .overlay-image-latest-big .text-576 {
        display: none;
    }
    .box-image-lit .date-whats {
        display: block
    }

}

@media (min-width:461px) {
    .desc-card-contactus2 br {
        display: none;
    }
}

@media (max-width:340px) {
    .desc-card-contactus2 br {
        display: none;
    }
}


@media (min-width:768px) and (max-height:750px) {
    .descBanner {
        padding-top: 5rem;
        padding-bottom: 5rem;
    }
    .descBanner2 {
        padding-top: 5rem;
    }
    .SchoolPackage {
        padding: 15rem 0 5rem 0;
    }
    .Journeyutama {
        padding-top: 15rem;
    }
    .ShowBXSea {
        padding: 15rem 0 10rem 0;
    }
    .desc-premium {
        position: relative;
        z-index: 2;
    }
    .schedule {
        padding: 15rem 0 15rem 0;
    }
    .map-oceanarium {
        padding: 15rem 0 10rem 0;
    }
    .guide-acces {
        padding: 20rem 0 5rem 0;
    }
    .frog2 {
        top: 20%;
    }
    .Merchandise {
        padding-top: 15rem;
    }
    .FAQ {
        padding: 10rem 0 10rem 0;
    }
    .Contactus {
        padding-top: 15rem;
    }
    .octopus {
        top: 0;
    }
    .octopus2 {
        top: 40rem;
    }
    .desc-schoolpackage {
        position: relative;
        z-index: 2;
    }
    .Oncelifetime {
        padding: 10rem 0 5rem 0;
    }
    .Aboutus {
        padding: 8rem 0 10rem 0;
    }
}

@media (min-width:439px) and (max-width:650px) {

    .title-showocean h1 {
        margin-bottom: 4rem;
    }

}

@media (min-width:651px) and (max-width:767px) {

    .title-showocean h1 {
        margin-bottom: 5rem;
    }

}

.premiun-package-flex {
    display: flex;
    justify-content: center;
}
.navbar-scroll {
    transform: translateY(-60px);
    transition: 300ms;
}
/* .top-bar-bottom {
    top: 60px;
}
.second-bar-bottom {
    top: 100px;
}
.header-navbar-contact-bottom {
    top: 165px;
} */

/* =========================================
   VISITOR INFORMATION PAGE
   ========================================= */

/* ----- Welcome Section ----- */
.vi-welcome-section {
    padding: 80px 0;
}
.vi-welcome-eyebrow {
    font-size: 13px;
    font-weight: 700;
    letter-spacing: 2px;
    color: #0057B8;
    text-transform: uppercase;
    margin-bottom: 10px;
}
.vi-welcome-title {
    font-family: librebaskerville;
    font-size: 58px;
    color: #003169;
    margin-bottom: 20px;
    line-height: 1.2;
}
.vi-welcome-desc {
    font-size: 20px;
    line-height: 1.8;
    color: #003169;
    margin-bottom: 32px;
}
.vi-welcome-btn {
    display: inline-block;
    background: linear-gradient(90deg, #003169, #0057B8);
    color: #fff;
    padding: 14px 32px;
    border-radius: 50px;
    font-size: 15px;
    font-weight: 600;
    text-decoration: none;
    transition: opacity 0.2s;
}
.vi-welcome-btn:hover {
    opacity: 0.85;
    color: #fff;
}
/* Hours Card */
.vi-hours-card {
    background: #F4F9FF;
    border-radius: 20px;
    box-shadow: 0 8px 32px rgba(0,49,105,0.12);
    padding: 36px 32px;
    border-left: 5px solid #0057B8;
}
.vi-hours-title {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003169;
}
.vi-hours-desc {
    font-family: montserrat_medium;
    font-size: 16px;
    line-height: 1.8;
    color: #003169;
    margin-bottom: 24px;    
}
.vi-grid-image-top-sections .vi-grid-image-item img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    border-radius: 16px;
}
.vi-hours-row {
    display: flex;
    gap: 10px;
    align-items: center;
    margin-bottom: 5px;
    padding-left: 20px;
}
.vi-hours-icon {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: #EEF4FF;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #0057B8;
    font-size: 16px;
    flex-shrink: 0;
    margin-top: 2px;
}
.vi-hours-day {
    font-size: 16px;
    color: #003169;
    font-family: montserrat_medium;
    margin: 0 0 2px;
}
.vi-hours-time {
    font-size: 16px;
    font-family: montserrat_bold;
    color: #003169;
    margin: 0 0 2px;
}
.vi-hours-time-light {
    font-size: 16px;
    font-family: montserrat_light;
    color: #003169;
    margin: 0 0 2px;
}

/* ----- Section Title ----- */
.vi-section-title {
    font-family: librebaskerville, serif;
    font-size: 58px;
    color: #003169;
    text-align: center;
    margin-bottom: 48px;
}
.vi-section-title--light {
    color: #003169;
}

/* ----- Know Before You Arrive ----- */
.vi-know-section {
    padding: 72px 0;
}
.vi-know-card {
    background: #fff;
    border-radius: 16px;
    padding: 36px 20px;
    text-align: center;
    box-shadow: 0 4px 20px rgba(0,49,105,0.08);
    height: 100%;
    transition: transform 0.2s, box-shadow 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
}
.vi-know-card:hover {
    transform: translateY(-4px);
    box-shadow: 0 10px 32px rgba(0,49,105,0.14);
}
.vi-know-icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0 auto 18px;
    color: #fff;
    font-size: 26px;
}
.vi-know-card h4 {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003169;
}
.vi-know-card p {
    font-size: 20px;
    font-family: montserrat_medium;
    color: #003169;
    margin: 0;
    line-height: 1.5;
}

/* ----- Learn & Conserve Section ----- */
.vi-learn-section {
    position: relative;
}
.vi-learn-subtitle {
    text-align: center;
    color: rgba(255,255,255,0.8);
    font-size: 20px;
    margin: -32px auto 48px;
    line-height: 1.7;
    color: #003169;
}
.vi-learn-carousel .owl-stage {
    padding-bottom: 8px;
}  
.vi-learn-card {
    background: #fff;
    border-radius: 16px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0,0,0,0.18);
    height: 100%;
}
.vi-learn-card-image {
    height: 400px;
    overflow: hidden;
}
.vi-learn-card-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.4s;
}
.vi-learn-card:hover .vi-learn-card-image img {
    transform: scale(1.05);
}
.vi-learn-card-body {
    padding: 24px;
    min-height: 300px;
}
.vi-learn-card-body span {
    font-size: 14px;
    color: #003169;
    margin-bottom: 8px;
}
.vi-learn-card-body h4 {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003169;
}
.vi-learn-card-body p {
    font-size: 20px;
    color: #003169;
    line-height: 1.7;
    margin: 0;
}
/* Carousel nav buttons */
.vi-carousel-nav {
    width: 44px;
    height: 44px;
    border-radius: 50%;
    background: rgba(255,255,255,0.2);
    border: 2px solid rgba(255,255,255,0.5);
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    transition: background 0.2s;
}
.vi-carousel-nav:hover {
    background: rgba(255,255,255,0.4);
}
.vi-learn-carousel {
    position: relative;
}
.vi-learn-carousel .owl-nav {
    position: absolute;
    top: 40%;
    left: 0;
    right: 0;
    transform: translateY(-50%);
    display: flex !important;
    justify-content: space-between;
    pointer-events: none;
    margin: 0 -20px;
}
.vi-learn-carousel .owl-nav button {
    pointer-events: all;
    width: 44px;
    height: 44px;
    border-radius: 50% !important;
    background: #003169 !important;
    border: none !important;
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: background 0.2s;
    opacity: 1 !important;
}
.vi-learn-carousel .owl-nav button.disabled {
    opacity: 0.4 !important;
    pointer-events: none;
}
.vi-learn-carousel .owl-nav button:hover {
    background: #00a9ee !important;
}
.vi-learn-carousel .owl-nav button span {
    color: #fff;
    font-size: 24px;
    line-height: 1;
    margin-bottom: 8px;
    margin-left: 2px;
}
.vi-learn-carousel .owl-nav button:focus {
    outline: none;
}
@media (max-width: 767px) {
    .vi-learn-carousel .owl-nav {
        position: static;
        transform: none;
        margin: 16px 0 0;
        justify-content: center;
        gap: 16px;
    }
}
.vi-learn-carousel .owl-dots {
    margin-top: 28px;
    text-align: center;
}
.vi-learn-carousel .owl-dots .owl-dot span {
    background: rgba(255,255,255,0.4) !important;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    transition: background 0.2s, width 0.2s;
}
.vi-learn-carousel .owl-dots .owl-dot.active span {
    background: #fff !important;
    width: 28px;
    border-radius: 5px;
}

/* ----- Visitor Guide Section ----- */
.vi-guide-section {
    padding: 80px 0;
}
.vi-guide-tabs {
    display: flex;
    gap: 12px;
    flex-wrap: wrap;
    margin-bottom: 40px;
    justify-content: center;
}
.vi-guide-tab {
    padding: 12px 28px;
    border: 0;
    border-radius: 50px;
    background: #fff;
    color: #003169;
    font-size: 20px;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.2s;
    font-family: leaguespartan_bold;
}
.vi-guide-tab:hover {
    background: #00A9EE;
    color: #fff;
}
.vi-guide-tab.active {
    background: #00A9EE;
    border-color: transparent;
    color: #fff;
}
/* Guide Panels */
.vi-guide-panel {
    display: none;
}
.vi-guide-panel.active {
    display: block;
    animation: viFadeIn 0.3s ease;
}
@keyframes viFadeIn {
    from { opacity: 0; transform: translateY(8px); }
    to   { opacity: 1; transform: translateY(0); }
}
/* Info Box */
.vi-guide-info-box {
    padding-left: 32px;
    display: flex;
    align-items: center;
    gap: 14px;
}
.vi-guide-info-icon {
    width: 56px;
    height: 56px;
    color: #fff;
    font-size: 22px;
    margin-bottom: 20px;
}
.vi-guide-panel span {
    font-size: 16px;
    color: #003169;
    font-family: montserrat_light;
}
.vi-guide-panel h5 {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003169;
}
.vi-guide-info-box > p {
    font-size: 14px;
    color: #888;
}
.vi-guide-location p {
    color: #003169;
    line-height: 1.8;
    margin: 0 !important;
    font-family: montserrat_medium; 
}
.vi-guide-address {
    color: #003169;
    line-height: 1.8;
    margin: 0 !important;
    font-family: montserrat_medium; 
}
.vi-guide-link {
    display: inline-block;
    margin-top: 12px;
    color: #0057B8;
    font-weight: 600;
    font-size: 14px;
    text-decoration: none;
}
.vi-guide-link:hover {
    text-decoration: underline;
    color: #003169;
}
.vi-guide-title {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003169;
    margin-bottom: 0 !important;
}
.vi-guide-desc {
    font-size: 16px;
    color: #003169;
    line-height: 1.8;
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
}
.vi-guide-button {
    margin-bottom: 24px;
}
.vi-guide-button a {
    display: inline-flex;
    align-items: center;
    gap: 8px; 
}
.vi-guide-button a,
.vi-guide-button a .arrow-right-vi-guide-button {
    text-decoration: none;
    color: #00A9EE;
    font-family: montserrat_bold;
    transition: transform 0.2s;
}
.vi-guide-button a:hover .arrow-right-vi-guide-button {
    transform: translateX(4px);
}
.custom-guide-text .guide-title {
    font-family: leaguespartan_bold;
    font-size: 32px;
    color: #003169;
}
.custom-guide-text .guide-desc {
    font-size: 16px;
    color: #003169;
    line-height: 1.8;
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
}
.custom-guide-text .guide-list {
    font-size: 16px;
    color: #003169;
    line-height: 1.8;
    margin-bottom: 0 !important;
    font-family: montserrat_medium;
}

/* App Box special */
.vi-guide-app-box {
    background: linear-gradient(135deg, #003169, #0057B8);
    border-top: none;
}
.vi-guide-app-box h5,
.vi-guide-app-desc {
    color: #fff !important;
}
.vi-guide-app-icon {
    background: rgba(255,255,255,0.2) !important;
}
.vi-guide-app-badges {
    display: flex;
    flex-wrap: wrap;
    margin-top: 24px;
    gap: 12px;
}

/* ----- Accordion ----- */
.vi-accordion {
    overflow: hidden;
    border: 1px solid #E2EAF8;
}
.vi-accordion-item {
    margin-bottom: 10px;
    background: #fff;
    border-radius: 12px;
}
.vi-accordion-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px 24px;
    cursor: pointer;
    transition: background 0.2s;
    user-select: none;
}
.vi-accordion-header span {
    font-size: 22px;
    font-family: leaguespartan_bold;
    color: #003169;
    letter-spacing: 0.5px;
}
.vi-accordion-icon {
    color: #0057B8;
    font-size: 14px;
    transition: transform 0.3s;
    flex-shrink: 0;
}
.vi-accordion-body {
    max-height: 0;
    overflow: hidden;
    transition: max-height 0.35s ease;
    background: #fff;
    border-radius: 12px;
}
.vi-accordion-body .bybus {
    width: 100%;
    object-fit: cover;
    border-radius: 8px;
}
.vi-accordion-padding {
    padding: 4px 24px 16px;
}
.vi-accordion-padding ol li,
.vi-accordion-padding ul li {
    font-family: montserrat_medium;
    color: #003169;
    line-height: 1.8;
}
.vi-accordion-body .vi-accordion-padding .grid-image {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}
.vi-accordion-body .vi-accordion-padding .grid-image img {
    object-fit: contain;
    border-radius: 8px;
}
.vi-accordion-body p {
    font-family: montserrat_medium;
    color: #003169;
    line-height: 1.8;
    margin-bottom: 0;
}
.vi-accordion-body a {
    display: inline-block;
    margin: 0 24px 20px;
}

/* ----- Responsive ----- */
@media (max-width: 991px) {
    .vi-welcome-title {
        font-size: 32px;
    }
    .vi-hours-card {
        margin-top: 0;
    }
    .vi-learn-card-image {
        height: 180px;
    }
    .vi-section-title {
        font-size: 28px;
    }
}
@media (max-width: 767px) {
    .vi-welcome-section {
        padding: 56px 0;
    }
    .vi-welcome-title {
        font-size: 28px;
    }
    .vi-welcome-desc {
        font-size: 15px;
    }
    .vi-learn-section {
        padding: 56px 0;
    }
    .vi-guide-section {
        padding: 56px 0;
    }
    .vi-guide-tabs {
        gap: 8px;
    }
    .vi-guide-tab {
        padding: 10px 18px;
        font-size: 14px;
    }
    .vi-accordion-header {
        padding: 16px 18px;
    }
    .vi-accordion-body p {
        padding: 4px 18px 14px;
    }
}

@media (max-width: 576px) {
    .vi-accordion-body .vi-accordion-padding .grid-image img:first-child {
        width: 100%;
    }
}
/* END VISITOR INFORMATION */





/* =========================================
   SHOW SPECTACULAR FILTER TABS
   ========================================= */
.show-filter-tabs {
    display: none;
}
/* END SHOW SPECTACULAR FILTER TABS */





/* =========================================
   FOOTER MOBILE ACCORDION
   ========================================= */
@media (max-width: 991px) {
    /* Reorder columns so accordions appear first */
    footer .row {
        display: flex;
        flex-wrap: wrap;
    }
    footer .row > .col-lg-6 {
        order: 4;
    }
    footer .row > :nth-child(2) {
        order: 1;
    }
    footer .row > :nth-child(3) {
        order: 2;
    }
    footer .row > :nth-child(4) {
        order: 3;
    }
    footer .row > .col-lg-12 {
        order: 5;
    }
    footer .row > .bg-darkline {
        order: 6;
    }
    footer .row > .copyright {
        order: 7;
    }
    /* Accordion layout */
    footer .box-center {
        justify-content: flex-start;
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-left: 0;
        padding-right: 0;
    }
    footer .navbar-footer {
        width: 100%;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
        padding: 14px;
    }
    footer .navbar-footer h4 {
        display: flex;
        justify-content: space-between;
        align-items: center;
        cursor: pointer;
        user-select: none;
        margin-bottom: 0;
        font-size: 16px;
    }
    footer .navbar-footer h4::after {
        content: '';
        display: inline-block;
        width: 9px;
        height: 9px;
        border-right: 2px solid #fff;
        border-bottom: 2px solid #fff;
        transform: rotate(45deg);
        transition: transform 300ms ease;
        flex-shrink: 0;
        margin-right: 4px;
        margin-bottom: 3px;
    }
    footer .navbar-footer.open h4::after {
        transform: rotate(-135deg);
        margin-bottom: -3px;
    }
    footer .navbar-footer .items-navbar-footer {
        overflow: hidden;
        max-height: 0;
        opacity: 0;
        transition: max-height 350ms ease, opacity 300ms ease;
    }
    footer .navbar-footer.open .items-navbar-footer {
        max-height: 220px;
        opacity: 1;
    }
    /* About Us styling */
    footer .col-lg-6 {
        width: 100% !important;
        max-width: 100% !important;
        flex: 0 0 100% !important;
        padding-top: 16px;
    }
    footer .social-footer {
        margin-top: 0;
        margin-bottom: 1.5rem;
    }
    footer .social-footer-mobile {
        display: flex;
    }
    footer .address-footer p {
        width: 100%;
    }
    footer .corporate-footer {
        flex-direction: column;
        align-items: start;
        gap: 1.5rem;
    }
    footer .brand-footer {
        gap: 1.5rem;
    }
    footer .brand-footer-mobile {
        display: flex;
    }
    footer .brand-footer img {
        width: 140px;
    }
    footer .social-footer {
        display: none;
    }
    footer .brand-footer {
        display: none;
    }
    footer .corporate-footer .right-grid {
        margin: auto;
    }
}
/* END FOOTER MOBILE ACCORDION */





/* =========================================
   SHOW SPECTACULAR MOBILE FILTER
   ========================================= */
@media (max-width: 767px) {
    .showocean {
        padding-bottom: 5rem;
    }
    .flex-show {
        flex-direction: column;
    }
    .box-title-show-ocean h1 {
        text-align: center;
        font-size: 36px;
    }
    .show-filter-tabs {
        display: flex;
        gap: 0;
        margin: 1.2rem 0 0;
        border-bottom: 2px solid #d0e4f5;
        justify-content: center;
    }
    .show-filter-tab {
        background: none;
        border: none;
        padding: 10px 22px;
        font-family: leaguespartan_bold;
        font-size: 13px;
        color: #8aaccc;
        cursor: pointer;
        position: relative;
        letter-spacing: 0.8px;
        transition: color 200ms ease;
        outline: none;
    }
    .show-filter-tab.active {
        color: #003169;
    }
    .show-filter-tab.active::after {
        content: '';
        position: absolute;
        bottom: -2px;
        left: 0;
        width: 100%;
        height: 3px;
        background: #003169;
        border-radius: 2px;
    }
    .relative-show,
    .relative-show2 {
        padding: 17vw;
    }
    .bg-show,
    .bg-show2 {
        width: 90vw;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
    /* Default: show regular panel, hide sea-pecial */
    .flex-show .box-title-show-ocean:last-child .relative-show2 {
        display: none;
    }
    .flex-show .box-title-show-ocean:last-child .relative-show2.show-active {
        display: block;
    }
    .flex-show .box-title-show-ocean:first-child .relative-show.show-hidden {
        display: none;
    }
    .btn-show-schedule {
        justify-content: center;
    }
    .show-splide .splide__arrow--prev,
    .show-splide2 .splide__arrow--prev {
        left: -10px;
    }
    .show-splide .splide__arrow--next,
    .show-splide2 .splide__arrow--next {
        right: -10px;
    }
}
/* END SHOW SPECTACULAR MOBILE FILTER */



/* ADDITIONAL EXPERIENCE CAROUSEL */
.owl-additional-exp .owl-dots {
    text-align: center;
    margin-top: 1.5rem;
}
.owl-additional-exp .owl-dot span {
    width: 10px;
    height: 10px;
    background: #cce8f8;
    border-radius: 50%;
    display: inline-block;
    margin: 0 4px;
    transition: background 300ms ease;
}
.owl-additional-exp .owl-dot.active span {
    background: #00A9EE;
}
@media (max-width: 991px) {
    .additional-experience {
        flex-direction: column;
        padding: 8rem 1.5rem 6rem;
        overflow: hidden;
    }
    .additional-experience .left-grid {
        width: 100%;
    }
    .additional-experience .right-grid {
        width: 100%;
    }
    .owl-additional-exp .owl-stage-outer {
        overflow: visible;
    }
    .box-additional-exp img {
        height: 320px;
    }
    .title-additional-exp h1 {
        font-size: 40px;
    }
    .desc-additional-exp {
        font-size: 16px;
    }
}
@media (max-width: 575px) {
    .additional-experience {
        padding: 8rem 1.2rem 5rem;
    }
    .additional-experience .right-grid {
        padding-right: 50px;
    }
    .box-additional-exp img {
        height: 280px;
    }
    .title-additional-exp h1 {
        font-size: 32px;
    }
}
@media (max-width: 428px) {
    .additional-experience .right-grid {
        padding-right: 100px;
    }
    .box-additional-exp img {
        height: 400px;
    }
}
@media (max-width: 390px) {
    .box-additional-exp img {
        height: 340px;
    }
}
@media (max-width: 360px) {
    .box-additional-exp img {
        height: 320px;
    }
}
/* END ADDITIONAL EXPERIENCE CAROUSEL */




/* EVENT MOBILE */
@media (max-width: 767px) {
    .event {
        flex-direction: column;
        padding: 4rem 1.5rem 6rem;
        gap: 0;
    }
    .event .left-grid {
        width: 100%;
    }
    .title-event h1 {
        font-size: 36px;
    }
    .desc-event p {
        font-size: 16px;
    }
    .event .right-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.75rem;
    }
    .box-event {
        width: 100%;
    }
    .image-box-event img {
        height: 220px;
        object-fit: cover;
    }
    .cta-ig-tiktok-event {
        font-size: 14px;
        margin-top: 1.5rem;
    }
}
/* END EVENT MOBILE */




/* TENANT MOBILE */
@media (max-width: 767px) {
    .Tenantus {
        padding-bottom: 5rem;
    }
    #main-carousel {
        display: none;
    }
    .btn-find-out-more-tenants {
        display: none;
    }
    #thumbnail-carousel {
        width: 100%;
        margin: 0 auto;
        padding: 2rem 1.5rem;
    }
    #thumbnail-carousel .splide__track {
        overflow: visible !important;
    }
    #thumbnail-carousel .splide__list {
        width: 100% !important;
        display: flex !important;
        flex-wrap: wrap !important;
        height: auto !important;
        justify-content: center;
        gap: 1.2rem;
        transform: none !important;
    }
    #thumbnail-carousel .splide__slide {
        width: calc(50% - 3rem) !important;
        opacity: 1 !important;
        transform: none !important;
        height: auto !important;
    }
    #thumbnail-carousel .splide__slide.is-active {
        transform: none !important;
    }
    #thumbnail-carousel .splide__slide img {
        width: 140px;
        height: 140px;
        margin-left: 0;
    }
    #thumbnail-carousel .splide__arrows {
        display: none !important;
    }
}
/* END TENANT MOBILE */


/* =========================================
   SEARCH POPUP
   ========================================= */
.search-popup-overlay {
    position: fixed;
    inset: 0;
    z-index: 99999;
    background: rgba(225, 238, 253, 0.97);
    display: flex;
    align-items: flex-start;
    justify-content: center;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s ease, visibility 0.3s ease;
    overflow-y: auto;
}

.search-popup-overlay.active {
    opacity: 1;
    visibility: visible;
}

.search-popup-container {
    width: 100%;
    max-width: 780px;
    padding: 4rem 1.5rem 2rem;
    position: relative;
}

.search-popup-close {
    position: fixed;
    top: 1.2rem;
    right: 1.5rem;
    background: none;
    border: none;
    font-size: 1.6rem;
    color: #333;
    cursor: pointer;
    z-index: 100000;
    line-height: 1;
    padding: 0.3rem 0.5rem;
}

.search-popup-close:hover {
    color: #007bff;
}

.search-popup-inner {
    width: 100%;
}

.search-popup-bar {
    display: flex;
    align-items: center;
    gap: 0;
    background: #fff;
    border-radius: 6px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0,0,0,0.08);
    margin-bottom: 2rem;
}

.search-popup-input {
    flex: 1;
    border: none;
    outline: none;
    padding: 0.85rem 1.2rem;
    font-size: 1rem;
    font-family: montserrat_medium, sans-serif;
    background: transparent;
    color: #333;
}

.search-popup-btn {
    background: #f74b8a;
    color: #fff;
    border: none;
    padding: 0.85rem 1.6rem;
    font-size: 1rem;
    font-family: montserrat_semibold, sans-serif;
    cursor: pointer;
    transition: background 0.2s;
    white-space: nowrap;
}

.search-popup-btn:hover {
    background: #d6306e;
}

.search-popup-results-title {
    font-family: montserrat_semibold, sans-serif;
    font-size: 1.15rem;
    color: #1a1a2e;
    margin-bottom: 1.2rem;
}

.search-result-card {
    display: flex;
    gap: 1.2rem;
    background: #fff;
    border-radius: 10px;
    margin-bottom: 1rem;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0,0,0,0.07);
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.2s;
}

.search-result-card:hover {
    box-shadow: 0 4px 18px rgba(0,0,0,0.13);
}

.search-result-thumb {
    width: 210px;
    min-width: 210px;
    height: 130px;
    object-fit: cover;
    background: #cde;
    flex-shrink: 0;
}

.search-result-thumb img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.search-result-body {
    padding: 1rem 1rem 1rem 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 0.3rem;
}

.search-result-breadcrumb {
    font-size: 0.78rem;
    color: #666;
    font-family: montserrat_light, sans-serif;
}

.search-result-title {
    font-size: 1.1rem;
    font-family: montserrat_semibold, sans-serif;
    color: #1a1a2e;
    margin: 0;
}

.search-result-desc {
    font-size: 0.88rem;
    color: #555;
    font-family: montserrat_light, sans-serif;
    line-height: 1.5;
    margin: 0;
}

.search-no-results {
    text-align: center;
    color: #888;
    font-family: montserrat_light, sans-serif;
    padding: 2rem 0;
}

.search-popup-pagination {
    display: flex;
    justify-content: center;
    gap: 0.4rem;
    margin-top: 1.5rem;
    flex-wrap: wrap;
}

.search-page-btn {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: none;
    background: #fff;
    color: #333;
    font-family: montserrat_semibold, sans-serif;
    font-size: 0.95rem;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
    display: flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 1px 5px rgba(0,0,0,0.08);
}

.search-page-btn.active,
.search-page-btn:hover {
    background: #007bff;
    color: #fff;
}

@media (max-width: 600px) {
    .search-result-card {
        flex-direction: column;
    }
    .search-result-thumb {
        width: 100%;
        min-width: unset;
        height: 160px;
    }
    .search-result-body {
        padding: 0.8rem;
    }
}
/* END SEARCH POPUP */