/* Switch to the menu based on viewport */
@media only screen and (max-width: 1400px){
    .vv-navigation--desktop { display: none }
}
@media only screen and (min-width: 1401px){
    .vv-navigation--mobile { display: none }
}


/* 
 * Desktop navigation 
*/
.vv-navigation--desktop .et-menu {
    display: flex;
    gap: 20px;
}
.vv-navigation--desktop ul.et-menu .menu-item,
.vv-navigation--desktop ul.et-menu .menu-item a { padding: 0 }
.vv-navigation--desktop .menu-item a:hover { color: #AB47BC !important }

/* Desktop navigation Booking button */
.vv-navigation--desktop .menu-item:last-child a{
    background-color: #673BB5;
    border-radius: 100vw;
    color: #ffffff !important;
    font-family: 'DM Sans - bold', open-sans;
    padding: 20px 30px !important;
    line-height: 1.5em;
}
.vv-navigation--desktop .menu-item:last-child a:hover {
    background-color: #181B84;
    font-style: italic;
    opacity: 1;
}
.vv-navigation--desktop .menu-item:last-child svg { margin-left: 5px }
.vv-navigation--desktop .et_pb_menu__wrap { justify-content: flex-end !important }


/* 
 * Tablet navigation 
*/
.vv-navigation--mobile .et_pb_menu__wrap { justify-content: center }
.vv-navigation--mobile .et_mobile_menu .menu-item:last-child { display: none !important }
.vv-navigation--mobile .et_pb_menu ul.et_mobile_menu {
    border: unset;
    background-color: #673BB5 !important;
}
.vv-navigation--mobile .menu-item a:hover { color: #AB47BC !important }

/*
 * Mobile navigation
*/
.vv-navigation--mobile .mobile_nav .vv-mobile-menu__header {
    display: flex;
    align-items: center;
    margin: 25px 5% 40px 5%;
    gap: 20px;
}

/* Style the mobile menu as an overlay */
.vv-navigation--mobile .mobile_nav .et_mobile_menu {
    border: none;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    background: #673BB5 !important;
    z-index: 99999;
    width: 100%;
    display: none;
    overflow-y: auto;
}

/* Displaying the menu items vertically and styled */
.vv-navigation--mobile .mobile_nav .et_mobile_menu {
    list-style-type: none;
    padding: 0;
    text-align: center;
}
.vv-navigation--mobile .et_mobile_menu li { margin-bottom: 25px }
.vv-navigation--mobile .et_pb_menu .mobile_nav .menu-item a {
    padding:0;
    color: #ffffff !important;
    text-align: center;
    font-family: 'DM Sans - Regular',sans-serif;
    font-size: 20px;
    border: unset;
}
.vv-navigation--mobile .mobile_nav ul li.current-menu-item a{ color: #ffffff !important }
.vv-navigation--mobile .mobile_nav .et_mobile_menu a:hover {
    background: transparent;
    opacity: 1;
    text-decoration: underline;
}

/* Booking button */
.vv-navigation--mobile .vv-mobile-menu__header a.vv-mobile-menu__cta {
    display: flex;
    align-items: center;
    gap: 5px;
}
.vv-navigation--mobile .vv-mobile-menu__header a.vv-mobile-menu__cta {
    padding: 10px 20px !important;
    border-radius: 100vw;
    background-color: #ffffff;
    color: #673BB5 !important;
    font-family: 'DM Sans - Bold', sans-serif !important;
    font-size: 20px;
}
.vv-navigation--mobile .vv-mobile-menu__header a.vv-mobile-menu__cta:hover {
    background-color: #181B84 !important;
    color: #ffffff !important;
    font-style: italic;
    text-decoration: unset !important;
}
#vv-primary-menu li.vv-primary-menu__button>a {
    color: #ffffff !important;
}



/* Close button for the mobile menu */
.vv-navigation--mobile .vv-mobile-menu__header>div:last-child {
    font-size: 20px;
    color: #fff;
    cursor: pointer;
    margin-left: auto;
}