/*

    DEVELOPED BY MIGUEL PETERSEN © 2025 - Ocean Life A/S

*/

/*********************************************************/

/*------------------------
    GLOBAL ADJUSTMENTS
------------------------*/
*{
    padding:0;
    margin:0;
}

/*-----------------
    Cookie Btn
-----------------*/
#CookiebotWidget :focus-visible, #CookiebotWidget:not(.CookiebotWidget-open) .Cookiebotwidget-logo{
    outline:none !important;
}

:root{
    /* Root Colors */
    --background: #001624;
    --gray-1: #111112;
    --white: white;
    --oceanlife-blue-1: #01131e;
    --black: black;
    --oceanlife-green: #00645C;
    --oceanlife-green2: #008E81;
    --oceanlife-green3: #acddd1;
    --oceanlife-darkgreen: #002e2a;
    --oceanlife-blue-2: #002e47;
    --oceanlife-blue-active: #00486e;
    --gray-4: #f4eeee;
    --gray-3: #e4e0dd;
    --primary-2: #01131e;
    --gray-2: #8a8a8a;
    --primary-3: #d2c0a6;
    --primary-4: #0c0916;
    --success: #24da78;
    --grey-very-light: #f7f7f7;
    --primary-1: #4d0f10;
    --info: #adeef8;
    --oceanlife-blue: #646ebd;
    --oceanlife-dark-blue: rgb(0, 24, 33);
    --oceanlife-dark-blue-hover: rgb(0, 37, 50);
    --oceanlife-dark-blue-2:#00080c;
    --oceanlife-dark-blue-2-hover:#00070a;
    --green:#2ab371;
}

/*-------------------------------
    SELECTING TEXT CUSTOM BG
-------------------------------*/
::-moz-selection { /* Code for Firefox */
    color:var(--white);
    background:var(--oceanlife-green) !important;
}

::selection {
    color:var(--white);
    background:var(--oceanlife-green) !important;
}

/*------------------------
    CUSTOM BACKGROUNDS
------------------------*/
.bg-oceanlife-green{
    background:var(--oceanlife-green) !important;
}

.bg-oceanlife-green-hover{
    background:initial !important;
}

.bg-oceanlife-green-hover:hover{
    background:var(--oceanlife-green) !important;
}

.bg-oceanlife-green2{
    background:var(--oceanlife-green2) !important;
}

.bg-oceanlife-green3{
    background:var(--oceanlife-green3) !important;
}

.bg-oceanlife-darkgreen{
    background:var(--oceanlife-darkgreen) !important;
}

.bg-oceanlife-blue-1{
    background:var(--oceanlife-blue-1) !important;
}

.bg-oceanlife-blue-2{
    background:var(--oceanlife-blue-2) !important;
}

.bg-oceanlife-dark-blue{
    background:var(--oceanlife-dark-blue) !important;
}

.bg-oceanlife-dark-blue-2{
    background:var(--oceanlife-dark-blue-2) !important;
}

.bg-oceanlife-dark-blue-2-hover{
    background:initial;
}

.bg-oceanlife-dark-blue-2-hover:hover{
    background:var(--oceanlife-dark-blue-2-hover);
}

.bg-primary-4{
    background:var(--primary-4);
}

.bg-white{
    background:var(--white);
}

.bg-white-hover{
    background:initial;
}

.bg-white-hover:hover{
    background:var(--white);
}

.bg-green{
    background:var(--green);
}

.bg-black{
    background:var(--black);
}

/*------------------------
     FONT ADJUSTMENTS
------------------------*/
/* TEXT ADJUSTMENTS */
.text-transform-capitalize{
    text-transform:capitalize !important;
}

.text-transform-uppercase{
    text-transform:uppercase !important;
}

.text-transform-lowercase{
    text-transform:lowercase !important;
}

.text-transform-none{
    text-transform:none !important;
}

.text-decoration-none{
    text-decoration:none !important;
}

/* FONT CLASSES */
.font-heebo{
    font-family: 'Heebo',arial,tahoma,sans-serif !important;
}

.font-gantari{
    font-family: 'Gantari', sans-serif !important;
}

/* FONT WEIGHTS */
.fw-1{
    font-weight:100 !important;
}

.fw-2{
    font-weight:200 !important;
}

.fw-3{
    font-weight:300 !important;
}

.fw-4{
    font-weight:400 !important;
}

.fw-5{
    font-weight:500 !important;
}

.fw-6{
    font-weight:600 !important;
}

.fw-7{
    font-weight:700 !important;
}

.fw-8{
    font-weight:800 !important;
}

.fw-9{
    font-weight:900 !important;
}

/* Font Sizes */
.h1{
    font-size:6vw;
}

.h2{
    font-size:30px;
}

.h3{
    font-size:30px;
}

.h5{
    font-size:30px;
}

.h6{
    font-size:1.2rem;
}

/* Text Color */
.text-white{
    color:var(--white) !important;
}

.text-gray-1{
    color:var(--gray-1) !important;
}

.text-gray-2{
    color:var(--gray-2) !important;
}

.text-gray-3{
    color:var(--gray-3) !important;
}

.text-gray-4{
    color:var(--gray-4) !important;
}

.text-oceanlife-green{
    color:var(--oceanlife-green) !important;
}

/* Text Color Hover */
.text-oceanlife-green-hover{
    color:initial;
}

.text-oceanlife-green-hover:hover{
    color:var(--oceanlife-green2) !important;
}

.text-oceanlife-red-hover:hover{
    color:var(--oceanlife-green) !important;
    opacity:1 !important;
}

.text-oceanlife-blue-1{
    color:var(--oceanlife-blue-1) !important;
}

.text-oceanlife-blue-1-hover{
    color:initial;
}

.text-oceanlife-blue-1-hover:hover{
    color:var(--oceanlife-blue-2) !important;
}


/*----------------------------
    CUSTOM BUTTONS & INPUTS
----------------------------*/
.btn-white{
    background:var(--white) !important;
    color:var(--oceanlife-blue-1) !important;
    border:1px solid var(--white) !important;
}

.btn-white-hover{
    background:initial;
}

.btn-white-hover:hover{
    background:var(--white) !important;
    color:var(--oceanlife-blue-1) !important;
    border:1px solid var(--white) !important;
}

.btn-green-outline{
    background:none !important;
    border-radius:0 !important;
    padding:7px 25px !important;
    border:1px solid var(--oceanlife-green) !important;
}

.btn-green{
    background:var(--oceanlife-green) !important;
    color:var(--white) !important;
    border:0;
}

.btn-green:hover{
    background:var(--oceanlife-green2) !important;
}

.btn-green-hover{
    background:initial;
}

.btn-green-hover:hover{
    background:var(--oceanlife-green) !important;
    color:var(--white) !important;
    border:1px solid var(--oceanlife-green) !important;
}

.btn-oceanlife-blue-1{
    background:var(--oceanlife-blue-1) !important;
    color:var(--white) !important;
    border:1px solid var(--oceanlife-blue-1) !important;
}

.btn-oceanlife-blue-1-hover{
    background:initial;
}

.btn-oceanlife-blue-1-hover:hover{
    background:var(--oceanlife-blue-1) !important;
    color:var(--white) !important;
    border:1px solid var(--oceanlife-blue-1) !important;
}

.btn-oceanlife-dark-blue{
    background:var(--oceanlife-dark-blue) !important;
    color:var(--white) !important;
    border:1px solid var(--oceanlife-blue-1) !important;
}

.btn-oceanlife-dark-blue:hover{
    background:rgb(4, 13, 22) !important;
}

.btn-oceanlife-dark-blue-hover{
    background:initial;
}

.btn-oceanlife-dark-blue-hover:hover{
    background:var(--oceanlife-green) !important;
}

.btn-oceanlife-blue-1-outline{
    background:none !important;
    border-radius:0 !important;
    padding:7px 25px !important;
    border:1px solid #01131e3b !important;
}

.input-oceanlife-green-outline{
    background:none !important;
    border-radius:0 !important;
    padding: 5px 10px !important;
    border:1px solid var(--oceanlife-green) !important;
    outline:none !important;
    box-shadow:none !important;
    transition:0.3s;
    -moz-transition:0.3s;
    -webkit-transition:0.3s;
    -ms-transition:0.3s;
    -o-transition:0.3s;
}

.input-oceanlife-blue-1-outline{
    background:none !important;
    border-radius:0 !important;
    padding: 5px 10px !important;
    border:1px solid #01131e3b !important;
    outline:none !important;
    box-shadow:none !important;
    transition:0.3s;
    -moz-transition:0.3s;
    -webkit-transition:0.3s;
    -ms-transition:0.3s;
    -o-transition:0.3s;
}

.input-oceanlife-blue-1-outline:hover{
    border:1px solid #01131ec0 !important;
}

.input-oceanlife-blue-1-outline:focus{
    border:1px solid var(--oceanlife-blue-1) !important;
}

.input-white-outline{
    background:rgba(0,0,0,0.1) !important;
    border-radius:0 !important;
    padding: 5px 10px !important;
    border:1px solid var(--white) !important;
    outline:none !important;
    box-shadow:none !important;
    color:var(--white) !important;
    transition:0.3s;
    -moz-transition:0.3s;
    -webkit-transition:0.3s;
    -ms-transition:0.3s;
    -o-transition:0.3s;
}

.input-white-outline:focus{
    background:rgba(0,0,0,0.4) !important;
}

.input-white-outline::placeholder{
    opacity:0.8;
    color:var(--white);
}

.input-green{
    background:var(--oceanlife-green) !important;
    border-radius:0 !important;
    padding: 5px 10px !important;
    border:none !important;
    outline:none !important;
    box-shadow:none !important;
    color:var(--white) !important;
    transition:0.3s;
    -moz-transition:0.3s;
    -webkit-transition:0.3s;
    -ms-transition:0.3s;
    -o-transition:0.3s;
    color:#FFFFFF;
}

.input-green:focus{
    background:var(--oceanlife-green) !important;
}

.input-green::placeholder{
    opacity:1;
    color:var(--white);
    -webkit-text-fill-color: #FFFFFF;
}




/*********************************************************/

body{
    background:var(--background);
    font-family:'Gantari',arial,tahoma,sans-serif;
}



/*--------------------
    TOP NAVIGATION
--------------------*/
/* PC NAV */
.mainnavigation{
    transition:0.3s;
    -moz-transition:0.3s;
    -webkit-transition:0.3s;
    -ms-transition:0.3s;
    -o-transition:0.3s;
    background:var(--oceanlife-blue-1);
    /*box-shadow:0 3px 10px rgba(0,0,0,0.2);*/
}

.nav_logo{
   width:225px;
}

.navbar-nav li a{
    font-weight:700;
    font-size:18px;
    text-shadow:none;
    text-transform:uppercase;
    text-align:left;
    display:block;
    padding-bottom:3px;
    border-bottom:2px solid rgba(255,255,255,0);
    padding-left:0 !important;
    padding-right:0 !important;
    letter-spacing:0.5px;
    margin-left:30px;
    color:var(--white);
}

.navbar-nav li:nth-child(1) a{
    margin-left:0 !important;
}

.navbar-nav li a:hover{
    color:var(--white);
    border-bottom:2px solid var(--oceanlife-green2);
}

.navbar-nav li a:active, .navbar-nav li a:focus{
    color:var(--white) !important;
}

.navbar-nav li .active{
    color:var(--white) !important;
    border-bottom:2px solid var(--oceanlife-green2);
}


/* BURGER NAV */
.navbar-toggler, .navbar-toggler:hover, .navbar-toggler:active, .navbar-toggler:focus{
    border:0 !important;
    outline:none !important;
    box-shadow:none;
}

.navbar-toggler-icon{
    background-image:url('../img/icons/burger-light.svg');
}

.offcanvas{
    background:var(--white) !important;
}

.btn-close{
    opacity:1 !important;
}

.burgernav .navbar-nav li:nth-child(1) a{
    margin-left:30px !important;
}

.burgernav .navbar-nav li a{
    font-size:1.75rem;
    border-bottom:0;
    color:var(--oceanlife-blue-1);
}

.burgernav .navbar-nav li a:hover{
    border-bottom:0;
    color:var(--oceanlife-blue-2);
}

.connect a i{
    font-size:40px !important;
}


/*--------------------
      HEROBANNER
--------------------*/
.herobanner{
    width:100%;
    height:550px;
    float:left;
    background:var(--oceanlife-blue-2);
}

.herobanner_img{
    width:100%;
    height:100%;
    background-position:center !important;
    background-repeat:no-repeat;
    background-size:cover !important;
}

.herobanner_nav{
    width:100%;
    height:120px;
    background:var(--gray-3);
    border-bottom-left-radius:50px;
    border-bottom-right-radius:50px;
}

.herobanner_nav nav ul li a{
    border-bottom:none !important;
    text-transform:capitalize;
    display:block;
    width:140px;
    height:100%;
    position:relative;
    text-align:center;
}

.herobanner_nav nav ul li a:nth-child(1){
    padding-left:0;
    margin-left:0;
}

.herobanner_nav nav ul li a:hover > img{
    height:70px;
    margin-top:-10px;
}

.herobanner_nav nav ul li a img{
    height:60px;
    margin-bottom:5px;
}

.herobanner_nav nav ul li a p{
    top:70px;
    padding-bottom:8px;
}

.herobanner_nav nav ul li a:hover > p{
    font-size:18px;
    bottom:-74px;
    border-bottom:4px solid var(--oceanlife-green);
}

/* HEROBANNER MOBILE NAV */
.herobanner_mobile_nav img{
    height:60px;
    width:100%;
}

.herobanner_mobile_nav a{
    font-size:20px;
    padding:20px 0;
    display:block;
}




/*--------------------
    CHARTER SEARCH
--------------------*/
.chartersearch{
    box-shadow:0 3px 10px rgba(0,0,0,0.2);
}





/*--------------------
    BRANDS WE COVER
--------------------*/
.brandswecover img{
    height:180px;
}



/*--------------------
        BASES
--------------------*/
.bases .card-img-overlay{
    display:flex;
    flex-direction:column;
    justify-content:end;
}

.bases .card-img-overlay .btn{
    right:20px;
    bottom:20px;
}

.bases h2{
    font-size:50px !important;
}





/*--------------------
        EXPLORE
--------------------*/
.explore .card-img-overlay{
    display:flex;
    flex-direction:column;
    justify-content:end;
}

.explore .card-img-overlay .btn{
    right:20px;
    bottom:20px;
}

.explore h2{
    font-size:50px !important;
}

.explore .card{
    overflow:hidden !important;
}

.explore .card img{
    transition:transform 3s ease;
}

.explore .card:hover > img{
    transform:scale(1.2) !important;
}




/*--------------------
     EASY BOOKING
--------------------*/
.easybooking{
    border-radius:25px;
}

.easybooking img{
    width:50%;
}

.easybooking ul li{
    padding-top:10px;
}




/*-----------------------
   QUESTIONS & ANSWERS
-----------------------*/
.questionsandanswers h6{
    font-size:20px;
    color:var(--white)
}

.questionsandanswers button i{
    font-size:30px;
    font-weight:bold;
    color:var(--oceanlife-green);
    transition:0.3s;
    -moz-transition:0.3s;
    -ms-transition:0.3s;
    -o-transition:0.3s;
    -webkit-transition:0.3s;
    transform: rotate(0deg);    
    -moz-transform: rotate(0deg);    
    -ms-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -webkit-transform: rotate(0deg); 
}

.questionsandanswers button:hover > i{
    color:var(--oceanlife-green2);
}

#qa .card, #qa .card-body{
    background:none !important;
    color:var(--white) !important;
}


/*-----------------------
   QUESTIONS & ANSWERS
-----------------------*/
.footer h4{
    color:var(--white) !important;
}

.footer ul li{
    color:var(--white) !important;
}

.footer ul li a{
    color:var(--white) !important;
}

.footer ul li a:hover{
    color:var(--oceanlife-green2) !important;
}




/*--------------------
    CSS ANIMATIONS
--------------------*/
.footer a:hover > i{
    color:var(--oceanlife-green2);
}

.footer i{
    color:var(--white);
    font-size:40px;
}









/*--------------------
    CSS ANIMATIONS
--------------------*/
.smoothanimation01{
    transition:0.1s;
    -moz-transition:0.1s;
    -webkit-transition:0.1s;
    -ms-transition:0.1s;
    -o-transition:0.1s;
}

.smoothanimation02{
    transition:0.2s;
    -moz-transition:0.2s;
    -webkit-transition:0.2s;
    -ms-transition:0.2s;
    -o-transition:0.2s;
}

.smoothanimation03{
    transition:0.3s;
    -moz-transition:0.3s;
    -webkit-transition:0.3s;
    -ms-transition:0.3s;
    -o-transition:0.3s;
}

.icon-animation-grow{
    font-size:inherit;
}

.icon-animation-grow:hover{
    font-size:105%;
}



/*-------------------
    MEDIA QUERIES
-------------------*/
@media (max-width: 575.98px) /* SM */
{
    .burgernav .navbar-nav li a{
        font-size:2.5rem;
        border-bottom:0;
        height:50px;
    }

    .herobanner_img{
        background-position:center !important;
    }

    .easybooking{
        border-radius:0 !important;
    }

    .nav_logo{
        width:225px;
    }
    
}

@media (max-width: 767.98px) /* MD */
{
    .h1{
        font-size:15vw;
    }

    .h3{
        font-size:30px;
    }

    .news_thumbnail_box{
        max-height:inherit !important;
    }

    .event_thumbnail_box{
        max-height:inherit !important;
    }

    .herobanner{
        height:200px;
    }

    .herobanner_img{
        background-position:center !important;
    }

    .easybooking img{
        width:75% !important;
        border-radius:none;
    }

    .easybooking h2{
        font-size:40px;
    }

    .easybooking h6{
        font-size:25px;
    }

    .easybooking ul li{
        font-size:18px;
    }

    .easybooking h4{
        font-size:25px;
    }

    .footer h4{
        font-size:30px;
    }

    .footer ul li{
        font-size:20px;
    }

}

@media (max-width: 991.98px) /* LG */
{
    .h2{
        font-size:14vw;
    }

    .footer-social-icon{
        font-size:40px;
    }

    .herobanner{
        height:300px;
    }

    .herobanner_img{
        background-position:center !important;
    }

    .herobanner_nav nav ul li a{
        width:120px;
    }

    .brandswecover img{
        height:80px;
    }

    .explore .display-6{
        font-size:30px !important;
    }

    .explore .card-text{
        font-size:10px !important;
    }

    .easybooking img{
        width:50% !important;
    }

    .navbar-nav li a{
        color:var(--oceanlife-blue-1) !important;
    }

    .navbar-nav li a.active{
        color:var(--oceanlife-green) !important;
    }

    .navbar-nav li a:hover{
        color:var(--oceanlife-green) !important;
    }

    .navbar-nav li a:active, .navbar-nav li a:focus{
        color:var(--oceanlife-green) !important;
    }
}

@media (max-width: 1199.98px) /* XL */
{
    .easybooking img{
        width:25%;
    }
}

@media (max-width: 1399.98px) /* XXL */
{
    .herobanner_nav{
        border-bottom-left-radius:0px !important;
        border-bottom-right-radius:0px !important;
    }

    .easybooking img{
        width:75%;
        border-radius:none;
    }
}