/*  Easy Rent a Boat by Capasecca CSS3 Ver. 1.0.0
    Copyright 1999 - 2024 JAM Studio
    Visit Us (https://www.jamstudio.it/)    */

/*  =====================================================
    =   Font utilizzati                                 =
    =   font-family: "Montserrat", sans-serif;          =
    =====================================================   */

/*  =====================================================
    =   PALETTE E TYPOGRAPHY                            =
    =====================================================   */
:root {
/*      --> Fonts sito                                      */
    --header-font   : "Montserrat", sans-serif;
    --text-font     : "Montserrat", sans-serif;
/*      --> Main Colors                                     */
    --main          : #002F6C;
    --main-c        : #0086D6;
    --main-l        : #59CBE8;
    --main-rgb      : 0,47,108;
    --main-c-rgb    : 0,134,214;
    --main-l-rgb    : 89,203,232;
    --contrast      : #F93822;
    --contrast-rgb  : 249,56,34;
/*      --> Greyscale                                       */
    --black         : #1F1F1F;
    --black-l       : #2B2B2B;
    --grey-d        : #595959;
    --grey          : #A4A4A4;
    --grey-c        : #C5C5C5;
    --grey-l        : #E5E5E5;
    --white-m       : #f5f5f5;
    --white         : #FFFFFF;
/*      --> System Colors                                   */
    --green         : #00C973;
    --yellow        : #FFD50A;
    --red           : #F6030C;
}
/*  =====================================================
    =   SCROLL BAR                                      =
    =====================================================   */
::-webkit-scrollbar { width: 8px; }
::-webkit-scrollbar-track { background: var(--white); box-shadow: none; border-radius: 0; }
::-webkit-scrollbar-thumb { background: var(--main); border: 0 solid transparent; border-radius: 0; background-clip: content-box; }
::-webkit-scrollbar-thumb:hover { background: var(--contrast); border: 0 solid transparent; background-clip: content-box; }
/*  =====================================================
    =   SETTING BASE PAGINA                             =
    =====================================================   */
html, body { height: 100vh; margin: 0; font-family: var(--text-font); color: var(--black); background-color: var(--white-m); }
html { scroll-padding-top: 7rem; }
img { max-width: 100%; max-height: 100%; width: auto; height: auto; }
/*      --> Typography                                      */
h1, h2, h3, h4, h5, h6 { font-family: var(--header-font); font-optical-sizing: auto; font-style: normal; }
p, li, a, th, td { text-decoration: none; font-optical-sizing: auto; font-style: normal; }
b, strong { font-weight: 700!important; }
a {color: var(--main-c); text-decoration: none;}
a:hover {color: var(--main-l); text-decoration: none;}
a:focus { outline: none; box-shadow: none; }
@media (max-width: 1199.98px) {
    html { scroll-padding-top: 6rem; }
}
@media (max-width: 575.98px) {
    p { font-size: .875rem; }
}
/*  =====================================================
    =   ICONS                                           =
    =====================================================   */
.icon { min-width: 1.25rem; height: 1.25rem; display: inline-block; }
.icon.white { background-color: var(--white); }
.icon.darkest { background-color: var(--black-l); }
.icon.dark { background-color: var(--grey-d); }
.icon.grey { background-color: var(--grey); }
.icon.main { background-color: var(--main); }
.icon.main-c { background-color: var(--main-c); }
.icon.main-l { background-color: var(--main-l); }
.icon.contrast { background-color: var(--contrast); }
.icon-xs { min-width: .75rem!important; height: .75rem!important; }
.icon-sm { min-width: 1rem!important; height: 1rem!important; }
.icon-md { min-width: 1.5rem!important; height: 1.5rem!important; }
.icon-lg { min-width: 2rem!important; height: 2rem!important; }
.icon-xl { min-width: 2.5rem!important; height: 2.5rem!important; }
.icon-xxl { min-width: 3rem!important; height: 3rem!important; }
.icon-big { min-width: 5rem!important; height: 5rem!important; }
/*      --> Icone Navigazione                               */
.ico-menu {
    -webkit-mask: url("../images/icons/nav-menu.svg") no-repeat center;
    mask: url("../images/icons/nav-menu.svg") no-repeat center;
}
.ico-close {
    -webkit-mask: url("../images/icons/nav-close.svg") no-repeat center;
    mask: url("../images/icons/nav-close.svg") no-repeat center;
}
.ico-home {
    -webkit-mask: url("../images/icons/nav-home.svg") no-repeat center;
    mask: url("../images/icons/nav-home.svg") no-repeat center;
}
.ico-plus {
    -webkit-mask: url("../images/icons/nav-plus.svg") no-repeat center;
    mask: url("../images/icons/nav-plus.svg") no-repeat center;
}
.ico-minus {
    -webkit-mask: url("../images/icons/nav-minus.svg") no-repeat center;
    mask: url("../images/icons/nav-minus.svg") no-repeat center;
}
.ico-search {
    -webkit-mask: url("../images/icons/nav-search.svg") no-repeat center;
    mask: url("../images/icons/nav-search.svg") no-repeat center;
}
.ico-chevron-y {
    -webkit-mask: url("../images/icons/nav-chevron-y.svg") no-repeat center;
    mask: url("../images/icons/nav-chevron-y.svg") no-repeat center;
}
.ico-chevron-x, .ico-chevron-x.left {
    -webkit-mask: url("../images/icons/nav-chevron-x.svg") no-repeat center;
    mask: url("../images/icons/nav-chevron-x.svg") no-repeat center;
}
.ico-chevron-x.left {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
}
/*      --> Icone Sistema                                   */
.ico-info {
    -webkit-mask: url("../images/icons/sys-info.svg") no-repeat center;
    mask: url("../images/icons/sys-info.svg") no-repeat center;
}
.ico-star {
    -webkit-mask: url("../images/icons/sys-star.svg") no-repeat center;
    mask: url("../images/icons/sys-star.svg") no-repeat center;
}
.ico-date {
    -webkit-mask: url("../images/icons/sys-date.svg") no-repeat center;
    mask: url("../images/icons/sys-date.svg") no-repeat center;
}
.ico-clock {
    -webkit-mask: url("../images/icons/sys-clock.svg") no-repeat center;
    mask: url("../images/icons/sys-clock.svg") no-repeat center;
}
.ico-cancel {
    -webkit-mask: url("../images/icons/sys-cancel.svg") no-repeat center;
    mask: url("../images/icons/sys-cancel.svg") no-repeat center;
}
.ico-boat {
    -webkit-mask: url("../images/icons/sys-boat.svg") no-repeat center;
    mask: url("../images/icons/sys-boat.svg") no-repeat center;
}
.ico-seaport {
    -webkit-mask: url("../images/icons/sys-seaport.svg") no-repeat center;
    mask: url("../images/icons/sys-seaport.svg") no-repeat center;
}
.ico-pax {
    -webkit-mask: url("../images/icons/sys-pax.svg") no-repeat center;
    mask: url("../images/icons/sys-pax.svg") no-repeat center;
}
/*      --> Icone Contatti e Social                         */
.ico-ind {
    -webkit-mask: url("../images/icons/contatti-indirizzo.svg") no-repeat center;
    mask: url("../images/icons/contatti-indirizzo.svg") no-repeat center;
}
.ico-mail {
    -webkit-mask: url("../images/icons/contatti-email.svg") no-repeat center;
    mask: url("../images/icons/contatti-email.svg") no-repeat center;
}
.ico-tel {
    -webkit-mask: url("../images/icons/contatti-telefono.svg") no-repeat center;
    mask: url("../images/icons/contatti-telefono.svg") no-repeat center;
}
.ico-whatsapp {
    -webkit-mask: url("../images/icons/contatti-whatsapp.svg") no-repeat center;
    mask: url("../images/icons/contatti-whatsapp.svg") no-repeat center;
}
.ico-facebook {
    -webkit-mask: url("../images/icons/social-facebook.svg") no-repeat center;
    mask: url("../images/icons/social-facebook.svg") no-repeat center;
}
.ico-instagram {
    -webkit-mask: url("../images/icons/social-instagram.svg") no-repeat center;
    mask: url("../images/icons/social-instagram.svg") no-repeat center;
}
/*      --> Icone Esiti                                     */
.ico-ok {
    -webkit-mask: url("../images/icons/esito-ok.svg") no-repeat center;
    mask: url("../images/icons/esito-ok.svg") no-repeat center;
}
.ico-ko {
    -webkit-mask: url("../images/icons/esito-ko.svg") no-repeat center;
    mask: url("../images/icons/esito-ko.svg") no-repeat center;
}
/*      --> Icone Pagamenti                                 */
.payments-icons { height: 2rem; }
.payments-icons-sm { height: 1.75rem; }
/*  =====================================================
    =   BUTTONS                                         =
    =====================================================   */
.btn { --bs-btn-font-family: var(--text-font); --bs-btn-focus-shadow-rgb: none; --bs-btn-active-shadow: none; --bs-btn-border-radius: .5rem; }
.btn-icon { min-width: 3rem; min-height: 3rem; --bs-btn-padding-x: 0.5rem; --bs-btn-padding-y: 0.5rem; --bs-btn-border-width: 0; --bs-btn-border-radius: .25rem; display: flex; align-items: center; justify-content: center; }
.btn-icon-sm { min-width: 2rem; min-height: 2rem; --bs-btn-padding-x: 0.25rem; --bs-btn-padding-y: 0.25rem; }
.btn-icon.menu, .btn-icon.back { --bs-btn-bg: var(--white-m); --bs-btn-hover-bg: var(--white-m); --bs-btn-active-bg: var(--white-m); --bs-btn-focus-bg: var(--white-m); --bs-btn-disabled-bg: var(--white-m); }
.btn-icon.menu .icon, .btn-icon.back .icon { background-color: var(--main); }
.btn-icon:hover.menu .icon, .btn-icon:hover.back .icon, .btn-icon:focus.back .icon { background-color: var(--main); }
.btn-icon:focus.menu .icon { background-color: var(--main); }
.btn-icon.whatsapp { min-width: 3.25rem; min-height: 3.25rem; --bs-btn-border-radius: 50rem; --bs-btn-bg: var(--green); --bs-btn-hover-bg: var(--green); --bs-btn-active-bg: var(--green); --bs-btn-focus-bg: var(--green); --bs-btn-disabled-bg: var(--green); }
.btn-icon.social { --bs-btn-border-radius: 50rem; --bs-btn-bg: var(--contrast); --bs-btn-hover-bg: var(--main-c); --bs-btn-active-bg: var(--main-c); --bs-btn-disabled-bg: var(--contrast); }
.btn-icon.social .icon { background-color: var(--white); }
.btn-icon.social:hover .icon, .btn-icon.social:active .icon, .btn-icon.social.active .icon { background-color: var(--white); }
.btn-info { --bs-btn-border-radius: .5rem; --bs-btn-bg: var(--grey-l); --bs-btn-hover-bg: var(--grey-c); --bs-btn-active-bg: var(--grey-c); --bs-btn-focus-bg: var(--grey-l); --bs-btn-disabled-bg: var(--grey-l); }
.btn-action {
    --bs-btn-color: var(--white);
    --bs-btn-bg: var(--contrast);
    --bs-btn-hover-color: var(--white);
    --bs-btn-hover-bg: var(--red);
    --bs-btn-active-color: var(--white);
    --bs-btn-active-bg: var(--red);
    --bs-btn-disabled-color: var(--white);
    --bs-btn-disabled-bg: var(--contrast);
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: .875rem;
    --bs-btn-font-size: 1.5rem;
    --bs-btn-font-weight: 600;
    --bs-btn-line-height: 1;
    white-space: nowrap;
}
.btn-more, .btn-more-sm {
    --bs-btn-color: var(--white);
    --bs-btn-bg: var(--main-c);
    --bs-btn-hover-color: var(--white);
    --bs-btn-hover-bg: var(--main-l);
    --bs-btn-active-color: var(--white);
    --bs-btn-active-bg: var(--main-l);
    --bs-btn-disabled-color: var(--white);
    --bs-btn-disabled-bg: var(--main-c);
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: .875rem;
    --bs-btn-font-size: 1.5rem;
    --bs-btn-font-weight: 600;
    --bs-btn-line-height: 1;
    white-space: nowrap;
}
.btn-more-sm {
	--bs-btn-border-radius: .25rem;
    --bs-btn-padding-x: .375rem;
    --bs-btn-padding-y: .25rem;
    --bs-btn-font-size: .75rem;
    --bs-btn-font-weight: 500;
}
.btn-submit {
    --bs-btn-color: var(--white);
    --bs-btn-bg: var(--main);
    --bs-btn-hover-color: var(--white);
    --bs-btn-hover-bg: var(--main-c);
    --bs-btn-active-color: var(--white);
    --bs-btn-active-bg: var(--main-c);
    --bs-btn-disabled-color: var(--white);
    --bs-btn-disabled-bg: var(--main);
    --bs-btn-padding-x: 1rem;
    --bs-btn-padding-y: .875rem;
    --bs-btn-font-size: 1.5rem;
    --bs-btn-font-weight: 600;
    --bs-btn-line-height: 1;
    white-space: nowrap;
}
/*      --> Lang Buttons                                    */
.btn-lang, .btn-lang:hover {
    height: 2rem;
    color: var(--white);
    font-size: 1.125rem;
    font-weight: 400;
    line-height: 1;
    text-decoration: none;
    text-transform: uppercase;
    white-space: nowrap;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn-lang-flag {
    width: 2rem;
    height: auto;
}
.btn-lang-icon {
    width: 1.5rem;
    height: 1.5rem;
    background-color: var(--white);
    -webkit-mask: url("../images/icons/nav-chevron-y.svg") no-repeat center;
    mask: url("../images/icons/nav-chevron-y.svg") no-repeat center;
    display: inline-block;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg);
    -webkit-transition: -webkit-transform .5s ease-in-out;
    transition: transform .5s ease-in-out;
}
.btn-lang:not(.show) .btn-lang-icon {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
}
#homepagebar.scrolled .btn-lang, #pagebar .btn-lang, #pagebar.scrolled .btn-lang, #homepagebar.scrolled .btn-lang:hover, #pagebar .btn-lang:hover, #pagebar.scrolled .btn-lang:hover { color: var(--main); }
#homepagebar.scrolled .btn-lang-icon, #pagebar .btn-lang-icon, #pagebar.scrolled .btn-lang-icon { background-color: var(--main); }
.lang-dropdown-menu {
    margin-top: .5rem!important;
    width: 100%;
    background-color: var(--white);
    left: auto;
    right: 0;
    border: 0;
    border-radius: .25rem;
}
.lang-dropdown-item {
    padding: .25rem;
    font-size: 1rem;
    font-weight: 400;
    color: var(--main);
    text-align: center;
    display: flex;
    align-items: center;
}
.lang-dropdown-flag {
    margin-left: .25rem;
    width: auto;
    height: 1.5rem;
}
.lang-dropdown-item:hover {
    color: var(--main);
    background-color: rgba(var(--main-c-rgb),.25);
}
.lang-dropdown-item.active, .lang-dropdown-item:active {
    color: var(--white);
    text-decoration: none;
    background-color: var(--main-l);
}
.btn-floating-container { position: fixed; left: .5rem; bottom: .25rem; z-index: 1030; }
.btn-floating-whatsapp {
    width: 4rem;
    height: 4rem;
    padding: .75rem;
    display: flex;
    color: var(--white);
    background-color: var(--green);
    border-radius: 50rem;
    box-shadow: 0 .5rem 1rem rgba(0,0,0,.15);
}
.btn-floating-whatsapp:hover {
    color: var(--white);
    background-color: var(--green);
}
.floating-note {
    margin-bottom: 0;
    margin-left: -.5rem;
    padding: .5rem .5rem .5rem 1rem;
    color: var(--grey-d);
    white-space: nowrap;
    line-height: 1;
    background-color: var(--grey-l);
    border-top-right-radius: .25rem;
    border-bottom-right-radius: .25rem;

}
/*      --> Bottoni Carousel Escursioni                     */
.btn-carousel {
    width: 3rem;
    height: 3rem;
    background-color: transparent;
    border-radius: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.btn-carousel.tour { height: 100%; background-color: rgba(245,245,245,0.5); }
.btn-carousel:hover { background-color: transparent; }
.btn-carousel.prev { left: -3rem; }
.btn-carousel.next { right: -3rem; }
.btn-carousel.tour.prev, .btn-carousel.boat.prev { left: 0; }
.btn-carousel.tour.next, .btn-carousel.boat.next { right: 0; }
@media (max-width: 1199.98px) {
    .btn-lang, .btn-lang:hover { color: var(--main); font-size: 1.25rem; background-color: var(--white-m); border-radius: .25rem; }
    .btn-lang-icon { background-color: var(--main); }
}
@media (max-width: 575.98px) {
    .lang-dropdown-menu {
        inset: 0px 0px auto auto!important;
        transform: translate(0px, 34px)!important;
    }
}
/*  =====================================================
    =   ELEMENTI COMUNI                                 =
    =====================================================   */
.mw-1920 { max-width: 1920px; }
.mw-1600 { max-width: 1600px; }
.mw-1400 { max-width: 1400px; }
.mw-1200 { max-width: 1200px; }
.mw-992 { max-width: 992px; }
.mw-960 { max-width: 960px; }
.mw-800 { max-width: 800px; }
.mw-768 { max-width: 768px; }
.mw-640 { max-width: 640px; }
.mw-576 { max-width: 576px; }
.mw-480 { max-width: 480px; }
.mw-360 { max-width: 360px; }
.mw-320 { max-width: 320px; }
.anchor-spacer { width: 100%; height: 4px; }
/*      --> Decosrazioni                                    */
.wave, .wave-sm {
    width: 20rem;
    height: 1.5rem;
    background-color: var(--main-l);
    --mask:
    radial-gradient(1.295rem at 50% calc(100% + 0.6rem),#0000 calc(99% - .25rem),#000 calc(101% - .25rem) 99%,#0000 101%) calc(50% - 2rem) calc(50% - 0.625rem + .5px)/4rem 1.25rem repeat-x,
    radial-gradient(1.295rem at 50% -0.6rem,#0000 calc(99% - .25rem),#000 calc(101% - .25rem) 99%,#0000 101%) 50% calc(50% + 0.625rem)/4rem 1.25rem repeat-x;
    -webkit-mask: var(--mask);
          mask: var(--mask);
}
.wave-sm { width: 12rem; height: 1.5rem; }
.wave.main, .wave-sm.main { background-color: var(--main); }
.wave.white, .wave-sm.white { background-color: var(--white); }
.wave.absolute-bottom { position: absolute; right: -8rem; bottom: -1rem; }
.wave.absolute-top { position: absolute; left: -8rem; top: -1rem; }
/*      --> Custom HR                                       */
.section-hr { margin: auto 0; border-top: 2px solid; opacity: 1 }
.section-hr.tin { border-top: 1px solid; }
.section-hr.white { color: var(--white); }
.section-hr.darkest { color: var(--grey-d); }
.section-hr.dark { color: var(--grey-d); }
.section-hr.grey { color: var(--grey-c); }
.section-hr.main { color: var(--main); }
.section-hr.main-c { color: var(--main-c); }
.section-hr.main-l { color: var(--main-l); }
.wave-hr {
    width: 8rem;
    height: 1rem;
    -webkit-mask: url("../images/deco/deco-wave.svg") no-repeat center;
    mask: url("../images/deco/deco-wave.svg") no-repeat center;
    display: inline-block;
}
.wave-hr-sm {
    width: 5.375rem;
    height: 1rem;
    -webkit-mask: url("../images/deco/deco-wave-sm.svg") no-repeat center;
    mask: url("../images/deco/deco-wave-sm.svg") no-repeat center;
    display: inline-block;
}
.wave-hr.main, .wave-hr-sm.main { background-color: var(--main); }
.wave-hr.white, .wave-hr-sm.white { background-color: var(--white); }
/*      --> Tipografia Header                               */
.section-title { margin-bottom: 0; font-weight: 400; line-height: 1; text-transform: uppercase; }
.section-title.main { color: var(--main); }
.section-title.white { color: var(--white); }
.section-title.alert { color: var(--red); }
.section-subtitle { font-size: 1.25rem; font-weight: 400; }
.section-subtitle.main-c { color: var(--main-c); }
.section-subtitle.contrast { color: var(--contrast); }
.page-container { background-color: var(--white); display: flex; flex-direction: column; }
@media (max-width: 575.98px) {
    .section-subtitle { font-size: 1rem; line-height: 1.25; }
}
/*  =====================================================
    =   HEADERS                                         =
    =====================================================   */
.homepage-header {
    height: 100%;
    max-height: 1080px;
    position: relative;
    overflow: hidden;
}
.homepage-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
}
.header-call-box {
    background-color: rgba(31,31,31,0.55);
    display: flex;
    flex-direction: column;
    --mask:
    radial-gradient(1.17rem at 50% calc(100% - 1.6rem),#000 99%,#0000 101%) calc(50% - 2rem) 0/4rem 100%,
    radial-gradient(1.17rem at 50% calc(100% + 0.6rem),#0000 99%,#000 101%) 50% calc(100% - 1rem)/4rem 100% repeat-x;
    -webkit-mask: var(--mask);
          mask: var(--mask);
}
.header-call {
    color: var(--white);
    font-weight: 900;
}
.page-header {
    padding-top: 6rem;
    width: 100%;
    position: relative;
    overflow: hidden;
}
.page-header-end {
    padding-top: 2rem;
    width: 100%;
    background-color: var(--white);
    --mask:
    radial-gradient(1.17rem at 50% 1.6rem,#000 99%,#0000 101%) calc(50% - 2rem) 0/4rem 100%,
    radial-gradient(1.17rem at 50% -0.6rem,#0000 99%,#000 101%) 50% 1rem/4rem 100% repeat-x;
    -webkit-mask: var(--mask);
          mask: var(--mask);
}
/*      --> Breadcrumb                                      */
.page-breadcrumb { font-size: 1rem; font-weight: 400; line-height: 1; text-transform: uppercase; }
.page-breadcrumb a { color: var(--main-c) }
.page-breadcrumb a:hover { color: var(--main-l) }
.page-breadcrumb .breadcrumb-item+.breadcrumb-item::before { color: var(--main-l); }
.page-breadcrumb .breadcrumb-item.active { color: var(--main); }
@media (min-width: 1920.98px) {
    .homepage-header { margin-top: 1.5rem; }
    .homepage-img { border-radius: 1.5rem;}
}
@media (max-width: 1199.98px) {
    .homepage-header { height: 60%; }
    .page-header { padding-top: 5rem; }
}
@media (max-width: 575.98px) {
    .homepage-header { height: 90%; }
    .page-breadcrumb { font-size: .875rem; }
}
/*  =====================================================
    =   NAVBAR                                          =
    =====================================================   */
.navbar-container {
    flex-direction: column;
    z-index: 1030;
    -webkit-transition: 200ms linear;
    -moz-transition: 200ms linear;
    -o-transition: 200ms linear;
    -ms-transition: 200ms linear;
    transition: 200ms linear;
    transition-property: padding, all;
}
#homepagebar.scrolled .navbar-container, #pagebar .navbar-container {
    padding: 0!important;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    -webkit-transition: 200ms linear;
    -moz-transition: 200ms linear;
    -o-transition: 200ms linear;
    -ms-transition: 200ms linear;
    transition: 200ms linear;
    transition-property: padding, all;
}
.page-navbar {
    width: 100%;
    min-height: 6rem;
    display: flex;
    flex-direction: column;
    background: rgba(var(--main-rgb), 0.50);
    box-shadow: 0 .25rem 2rem rgba(var(--main-rgb), 0.25);
    backdrop-filter: blur(.5rem);
    -webkit-backdrop-filter: blur(.5rem);
    border: 1px solid rgba(var(--main-rgb), 0.1);
    border-radius: 1rem;
    -webkit-transition: 200ms ease-in-out;
    -moz-transition: 200ms ease-in-out;
    -o-transition: 200ms ease-in-out;
    -ms-transition: 200ms ease-in-out;
    transition: 200ms ease-in-out;
    transition-property: all;
}
#homepagebar.scrolled .page-navbar, #pagebar .page-navbar, #pagebar.scrolled .page-navbar {
    background: var(--white);
    box-shadow: 0 .125rem .25rem rgba(var(--main-rgb), 0.125);
    backdrop-filter: blur(.5rem);
    -webkit-backdrop-filter: blur(.5rem);
    border: 0;
    border-radius: 0;
    -webkit-transition: 200ms ease-in-out;
    -moz-transition: 200ms ease-in-out;
    -o-transition: 200ms ease-in-out;
    -ms-transition: 200ms ease-in-out;
    transition: 200ms ease-in-out;
    transition-property: all;
}
.navbar-logo-white, .navbar-logo-color { width: 19rem; height: auto; }
#homepagebar.scrolled .navbar-logo-white, #pagebar .navbar-logo-white, #pagebar.scrolled .navbar-logo-white, #homepagebar .navbar-logo-color { display: none; }
#homepagebar.scrolled .navbar-logo-color, #pagebar .navbar-logo-color, #pagebar.scrolled .navbar-logo-color { display: inline-block; }
/*      --> Menu                                            */
.menu-link {
    padding: .5rem;
    color: var(--white);
    font-family: var(--header-font);
    font-size: 1.125rem;
    font-weight: 400;
    letter-spacing: .05em;
    line-height: 1;
    text-decoration: none;
    border: 1px solid transparent;
    border-radius: 0;
    display: flex;
    align-items: center;
    white-space: nowrap;
    -webkit-transition: 400ms ease;
    -moz-transition: 400ms ease;
    -o-transition: 400ms ease;
    -ms-transition: 400ms ease;
    transition: 400ms ease;
    transition-property: all;
}
.menu-link:hover {
    color: var(--white);
    text-decoration: none;
    border-bottom-color: var(--main-l);
    -webkit-transition: 500ms ease;
    -moz-transition: 500ms ease;
    -o-transition: 500ms ease;
    -ms-transition: 500ms ease;
    transition: 500ms ease;
    transition-property: all;
}
.menu-link.active, #homepagebar.scrolled .menu-link.active, #homepagebar.scrolled .menu-link:hover.active, #pagebar .menu-link.active, #pagebar .menu-link:hover.active { color: var(--main-l); font-weight: 500; box-shadow: none; }
.menu-link:focus { box-shadow: none; }
#homepagebar.scrolled .menu-link, #homepagebar.scrolled .menu-link:hover, #pagebar .menu-link, #pagebar .menu-link:hover {
    color: var(--main);
    -webkit-transition: 400ms linear;
    -moz-transition: 400ms linear;
    -o-transition: 400ms linear;
    -ms-transition: 400ms linear;
    transition: 400ms linear;
    transition-property: all;
}
.menu-header { background-color: var(--white); }
.menu-body { background-color: var(--white-m); }
@media (max-width: 1199.98px) {
    .page-navbar { min-height: 5rem; }
    .navbar-logo-white, .navbar-logo-color { width: 14.25rem; }
    .menu-link { font-size: 1.25rem; color: var(--main); border-bottom-color: var(--grey-l); }
    .menu-link:hover { color: var(--main); }
}
/*  =====================================================
    =   FOOTER                                          =
    =====================================================   */
.footer-container {
    font-size: .875rem;
    color: var(--main);
    background: rgb(245,245,245);
    background: -moz-linear-gradient(0deg, rgba(245,245,245,1) 0%, rgba(255,255,255,1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(245,245,245,1) 0%, rgba(255,255,255,1) 100%);
    background: linear-gradient(0deg, rgba(245,245,245,1) 0%, rgba(255,255,255,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f5f5f5",endColorstr="#ffffff",GradientType=1);
    display:flex;
    flex-direction: column;
}
.footer-logo {
    width: 24rem;
    height: auto;
}
.footer-info {
    width: 100%;
    color: var(--main);
}
.footer-info a {
    color: var(--main);
    font-weight: 400;
}
.footer-info a:hover {
    color: var(--main-c);
}
.footer-link {
    color: var(--main-c);
    font-weight: 500;
    text-decoration: none;
    white-space: nowrap;
}
.footer-link:hover {
    color: var(--contrast);
    text-decoration: none;
}
/*      --> Footer Bottom                                   */
.footer-bottom {
    background-color: var(--main-c);
}
.footer-bottom p {
    font-size: .875rem;
    color: var(--white);
}
.bookingbar-footer .footer-bottom {
    padding-bottom: 8rem!important;
}
/*      --> Firma                                           */
#jamstudio {
    width: auto;
    height: 1.625rem;
}
.logo-signature {
    fill: var(--white);
}
@media (min-width: 1920.98px) {
    .footer-container { padding-bottom: 1.5rem; }
    .footer-bottom { border-radius: 1rem;}
}
/*  =====================================================
    =   CARDS E BANNERS                                 =
    =====================================================   */
.card-tour {
    height: 100%;
    background-color: var(--white);
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}
.card-tour-img-frame {
    padding-top: 125%;
    position: relative;
}
.card-tour-img, .card-boat-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    position: absolute;
    top: 0;
}
.card-header { display: flex; align-items: center; }
.card-title { font-size: 2rem; color: var(--main); font-weight: 300; line-height: 1; text-transform: uppercase; }
.card-title i { color: var(--main-l); font-style: normal; }
.card-title.boat { color: var(--main-c); }
.card-description { font-size: .875rem; }
.card-pricetag { color: var(--contrast); display: flex; flex-direction: column; align-items: flex-end; }
.card-price { font-size: 1.5rem; font-weight: 600; }
.card-price small, .card-price-info { font-size: .75rem; font-weight: 500; text-transform: uppercase;}
.card-price small { color: var(--main-c); }
.card-boat {
    height: 100%;
    background-color: var(--white);
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
    position: relative;
}
.card-boat-img-frame {
    padding-top: 66.67%;
    position: relative;
    overflow: hidden;
    border-radius: .5rem .5rem 0 0;
}
.boat-spec {
    color: var(--main);
    background-color: var(--white-m);
    border-radius: 0 0 .5rem .5rem;
    --mask:
    radial-gradient(1.17rem at 50% 1.6rem,#000 99%,#0000 101%) calc(50% - 2rem) 0/4rem 100%,
    radial-gradient(1.17rem at 50% -0.6rem,#0000 99%,#000 101%) 50% 1rem/4rem 100% repeat-x;
    -webkit-mask: var(--mask);
          mask: var(--mask);
}
.boat-spec p>small { margin-top: auto; margin-bottom: 1px; font-size: .75rem; }
.spec-label { color: var(--main-c); text-transform: uppercase; }
/*      --> Carousel Testimonials                          */
.testimonials-header { overflow: hidden; }
.testimonials-card {
    width: 100%;
    max-width: 480px;
    color: var(--black-l);
    background: var(--white-m);
    border-radius: .5rem;
    display: flex;
    flex-direction: column;
}
.testimonials-name {
    font-family: var(--header-font);
    color: var(--main);
    font-weight: 400;
    font-variation-settings: "wdth" 100;
}
.testimonials-date {
    font-size: .875rem;
    color: var(--main-c);
}
@media (max-width: 991.98px) {
    .card-title { font-size: 1.5rem; }
    .card-price { font-size: 1.25rem; font-weight: 600; }
    .card-description { font-size: .75rem; }
}
@media (max-width: 767.98px) {
    .boat-spec p { font-size: .875rem; }
    .boat-spec p>small { margin-bottom: 0; }
}
@media (max-width: 575.98px) {
    .testimonials-card { max-width: 240px; }
    .testimonials-name { font-size: 1rem; }
    .testimonials-text { font-size: .75rem; }
}

/*  =====================================================
    =   FORMS CONTROLS + ELEMENTI                       =
    =====================================================   */
.form-container { background-color: var(--white-m); border-radius: .5rem; }
.contacts-form-label, .recap-form-label {
    font-family: var(--text-font);
    font-weight: 400;
    color: var(--grey-d)
}
.contacts-form-control {
    border-color: var(--grey-l);
    border-radius: .25rem;
}
.contacts-form-control:focus {
    border-color: var(--main-c);
    box-shadow: none;
}
.contacts-form-check {
    border-color: var(--grey-c);
}
.contacts-form-check.radio-btn { margin-top: 0; width: 1.5rem; height: 1.5rem; }
.contacts-form-check:focus {
    border-color: var(--main-c);
    box-shadow: none;
}
.contacts-form-check:checked {
    background-color: var(--contrast);
    border-color: var(--red);
}
.price-opt {
    margin-left: auto;
    color: var(--contrast);
    font-weight: 500;
    display: inline-block;
    position: absolute;
    bottom: .5rem;
    right: 2.5rem;
}
/*      --> Booking                                         */
.booking-card {
    width: 480px;
    background-color: var(--white);
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
}
.booking-price-box {
    color: var(--white);
    background-color: var(--contrast);
    border-radius: .5rem;
}
.booking-price-info { font-size: 1.125rem; font-weight: 500; line-height: 1; }
.booking-price { font-size: 2rem; font-weight: 600; line-height: 1; }
.booking-price small, .booking-price-note { font-size: .75rem; font-weight: 500; }
.booking-pax { margin-bottom: 0; line-height: 1; }
.booking-pax b { font-weight: 600!important; }
.booking-boat-select {
    --bs-list-group-color: var(--main-c);
    --bs-list-group-bg: transparent;
    --bs-list-group-item-padding-x: .5rem;
    --bs-list-group-item-padding-y: 1rem;
}
.booking-boat-select .list-group-item { display: flex; align-items: center; }
.boat-select-label { color: var(--main); text-transform: uppercase; line-height: 1; display: flex; flex-direction: column; }
.boat-select-note { color: var(--main-c); font-size: .75rem; line-height: 1; text-transform: none; display: block; }
.boat-select-price {margin-bottom: 0; color: var(--contrast); font-weight: 500; line-height: 1; }
.booking-total { color: var(--contrast); display: flex; justify-content: space-between; }
.booking-total-label { margin-bottom: 0; font-size: 1.5rem; font-weight: 500; }
.booking-total-price { margin-bottom: 0; font-weight: 600; }
.booking-notes { max-width: 480px; font-size: .875rem; line-height: 1.25; }
.booking-notes b { font-weight: 500!important; }
.booking-notes a { color: var(--contrast); font-weight: 600; }
.booking-notes a:hover { color: var(--red); }
.booking-cancel { color: var(--main); font-weight: 500; line-height: 1; display: flex; align-items: center; justify-content: center; }
.booking-cancel b { font-weight: 600!important; }
/*      --> Box Contatti                                    */
.contacts-card {
    width: 100%;
    height: 100%;
    max-height: 640px;
    font-size: 1rem;
    background-color: var(--white-m);
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.contacts-logo { width: auto; height: 6rem; }
.contacts-info { color: var(--grey-d); }
.contacts-info img {
    width: auto;
    height: 2rem;
}
.contacts-card-link {
    color: var(--main);
    font-weight: 400;
    text-decoration: none;
    background-color: transparent;
    border-radius: .5rem;
    display: flex;
    align-items: center;
}
.contacts-card-link:hover {
    color: var(--white);
    text-decoration: none;
    background-color: var(--contrast);
}
.contacts-card-link .contacts-card-icon {
    width: 1.5rem;
    height: 1.5rem;
    background-color: var(--contrast);
    display: inline-block;
}
.contacts-card-link:hover .contacts-card-icon {
    background-color: var(--white);
}
.contacts-img-container { margin-top: -28rem; }
/*      --> Checkout                                        */
.checkout-logo { width: 20rem; height: auto; }
.recap-form-label { font-size: .875rem; }
.recap-control-box {
    background-color: var(--white);
    border: 1px solid var(--grey-l);
    border-radius: .25rem;
    display: flex;
    align-items: center;
}
.recap-price-opt {
    margin-left: auto;
    color: var(--contrast);
    font-weight: 500;
    display: inline-block;
}
.recap-pay-box {
    color: var(--white);
    background-color: var(--contrast);
    border-radius: .5rem;
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
}
.recap-pay-label { margin-bottom: 0; font-size: 1.125rem; font-weight: 500; }
.recap-pay-price { margin-bottom: 0; font-weight: 600; line-height: 1; }
.checkout-pay-info { color: var(--white); background-color: var(--main-l); border-radius: .5rem; }
@media (max-width: 1199.98px) {
    .booking-total-label { font-size: 1.125rem; }
    .contacts-img-container { margin-top: -16rem; }
}
@media (max-width: 991.98px) {
    .booking-card, .booking-notes { width: 100%; max-width: 100%; }
}
@media (max-width: 575.98px) {
    .contacts-form-label { font-size: .875rem; }
    .booking-boat-select { --bs-list-group-item-padding-x: 0; --bs-list-group-item-padding-y: .5rem; }
    .boat-select-label { font-size: .75rem; }
    .boat-select-price { font-size: .75rem; }
    .contacts-img-container { margin-top: -7rem; }
}
/*  =====================================================
    =   ESITI                                           =
    =====================================================   */
.box-esito { border-radius: .5rem; line-height: 1.25; }
.title-esito { font-family: var(--text-font); font-weight: 500!important; }
.box-esito.ok { background-color: var(--green); }
.box-esito.ok .icon { background-color: var(--white); }
.box-esito.ok .title-esito, .box-esito.ok .text-esito { color: var(--white); }
.box-esito.ko { background-color: var(--yellow); }
.box-esito.ko .icon { background-color: var(--black-l); }
.box-esito.ko .title-esito, .box-esito.ko .text-esito { color: var(--black-l); }
/*  =====================================================
    =   HOMEPAGE                                        =
    =====================================================   */
.tours-section { background-color: var(--white-m); }
.fleet-section {
    color: var(--white);
    background-image: url('../images/homepage/fleet-bg.webp');
    background-size: cover;
    background-position: center top;
    background-repeat: no-repeat;
    background-color: var(--main);
    position: relative;
    overflow: hidden;
}
.fleet-start-col { padding-top: 90%; }
.boats-carousel-track { max-width: 480px; }
.services-section {
    background: rgb(255,255,255);
    background: -moz-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(245,245,245,1) 100%);
    background: -webkit-linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(245,245,245,1) 100%);
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(245,245,245,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#f5f5f5",GradientType=1);
    display: flex;
    flex-direction: column;
}
.mappa {
    padding-top: 65%;
    background-image: url('../images/homepage/mappa-golfo.svg');
    background-size: contain;
    background-position: right top;
    background-repeat: no-repeat;
}
.transfer-container {
    display: flex;
    flex-direction: column;
    position: relative;
}
.transfer-box-container {
    margin-top: -25%;
    margin-right: -20rem;
    max-width: 700px;
    display: flex;
    flex-direction: column;
    position: relative;
}
.transfer-box {
    color: var(--white);
    background-color: var(--main);
    border-radius: 0 0 1rem 1rem;
    --mask:
    radial-gradient(1.17rem at 50% 1.6rem,#000 99%,#0000 101%) calc(50% - 2rem) 0/4rem 100%,
    radial-gradient(1.17rem at 50% -0.6rem,#0000 99%,#000 101%) 50% 1rem/4rem 100% repeat-x;
    -webkit-mask: var(--mask);
          mask: var(--mask);
    display: flex;
    flex-direction: column;
}
.transfer-box-container .btn-more {
    margin-top: -1.75rem;
    z-index: +1;
}
.contacts-position {
    width: 100%;
    max-width: 768px;
    position: absolute;
}
.contacts-container {
    display: flex;
    flex-direction: column;
    position: relative;
    filter: drop-shadow(0 0.125rem 0.25rem rgba(0, 0, 0, 0.075));
}
.contacts-box {
    background-color: var(--white);
    display: flex;
    flex-direction: column;
    border-radius: 1rem 1rem 0 0;
    --mask:
    radial-gradient(1.17rem at 50% calc(100% - 1.6rem),#000 99%,#0000 101%) calc(50% - 2rem) 0/4rem 100%,
    radial-gradient(1.17rem at 50% calc(100% + 0.6rem),#0000 99%,#000 101%) 50% calc(100% - 1rem)/4rem 100% repeat-x;
    -webkit-mask: var(--mask);
          mask: var(--mask);
    filter:drop-shadow(0 2px 5px black);
}
@media (min-width: 1920.98px) {
    .fleet-section { border-radius: 1.5rem;}
}
@media (max-width: 1199.98px) {
    .boats-carousel-track { max-width:none; }
}
@media (max-width: 991.98px) {
    .fleet-section { background-image: url('../images/homepage/fleet-bg992.webp'); background-size: contain; background-position: center top; }
    .boats-carousel { align-self: center; }
    .boats-carousel-track { max-width:480px; }
    .transfer-box-container { margin-top: -25%; margin-right: -2rem; }
    .contacts-position { margin-bottom: -25%; position:relative; }
}
@media (max-width: 575.98px) {
    .boats-carousel-track { max-width:none; }
    .transfer-box-container { margin-right: -.5rem; }
}
/*  =====================================================
    =   SCHEDA TOUR                                     =
    =====================================================   */
.gallery-img { object-fit: cover; object-position: center; }
.gallery-img.square { width: 480px; height: 480px; }
.gallery-img.square-sm { width: 228px; height: 228px; }
.gallery-img.portrait { width: 320px; height: 480px; }
.gallery-img.wide { width: 430px; height: 228px; }
.gallery-img.landscape { width: 600px; height: 480px; }
.gallery-img.boat { width: 100%; height: auto; }
.boatmodal-carousel .splide__pagination__page.is-active { background: var(--main-l); opacity: 1; }
.tour-feature { margin-bottom: 0; color: var(--main); font-size: 1.125rem; font-weight: 600; line-height: 1; }
.tour-list {
    width: 100%;
    height: 100%;
    background-color: var(--white-m);
    border-radius: 1rem;
    display: flex;
    flex-direction: column;
}
.tour-list .list-group {
    --bs-list-group-color: var(--main);
    --bs-list-group-bg: transparent;
    --bs-list-group-item-padding-x: .5rem;
    --bs-list-group-item-padding-y: .25rem;
}
.tour-list-title { font-size: 1.25rem; font-weight: 400; line-height: 1; }
.tour-list-title.ok { color: var(--green); }
.tour-list-title.ko { color: var(--red); }
@media (max-width: 991.98px) {
    .gallery-img.square { width: 320px; height: 320px; }
    .gallery-img.square-sm { width: 152px; height: 152px; }
    .gallery-img.portrait { width: 213px; height: 320px; }
    .gallery-img.wide { width: 287px; height: 152px; }
    .gallery-img.landscape { width: 400px; height: 320px; }
}
@media (max-width: 575.98px) {
    .gallery-img.square, .gallery-img.square-sm, .gallery-img.portrait, .gallery-img.wide, .gallery-img.landscape { width: auto; height: auto; max-width: 398px;}
}
@media (max-width: 389.98px) {
    .gallery-img.wide { max-width: 328px;}
}
/*  =====================================================
    =   TRANSFER                                        =
    =====================================================   */
.transfer-image-container {
    margin-left: -48px;
    margin-right: -160px;
    --mask:
    radial-gradient(1.17rem at 50% calc(100% - 1.6rem),#000 99%,#0000 101%) calc(50% - 2rem) 0/4rem 100%,
    radial-gradient(1.17rem at 50% calc(100% + 0.6rem),#0000 99%,#000 101%) 50% calc(100% - 1rem)/4rem 100% repeat-x;
    -webkit-mask: var(--mask);
          mask: var(--mask);
}
.tansfer-image {
    width: 100%;
    height: auto;
}
@media (max-width: 1199.98px) {
    .transfer-image-container {
        margin-right: -48px;
    }
}
@media (max-width: 991.98px) {
    .transfer-image-container {
        margin-left: -16px;
        margin-right: -16px;
    }
}
@media (max-width: 575.98px) {
    .transfer-image-container {
        margin-left: -8px;
        margin-right: -8px;
    }
}
/*  ==========
    = Andrea =
    ==========   */
.grecaptcha-badge { visibility: hidden; }