.elementor-2 .elementor-element.elementor-element-1b58b371{--display:flex;--min-height:50vh;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--overlay-opacity:0.5;--overlay-mix-blend-mode:darken;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2 .elementor-element.elementor-element-1b58b371:not(.elementor-motion-effects-element-type-background), .elementor-2 .elementor-element.elementor-element-1b58b371 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-image:url("https://vivaglamglobal.com/wp-content/uploads/2025/03/VVG-Woman-with-glases.avif");background-position:center center;background-repeat:no-repeat;background-size:cover;}.elementor-2 .elementor-element.elementor-element-1b58b371::before, .elementor-2 .elementor-element.elementor-element-1b58b371 > .elementor-background-video-container::before, .elementor-2 .elementor-element.elementor-element-1b58b371 > .e-con-inner > .elementor-background-video-container::before, .elementor-2 .elementor-element.elementor-element-1b58b371 > .elementor-background-slideshow::before, .elementor-2 .elementor-element.elementor-element-1b58b371 > .e-con-inner > .elementor-background-slideshow::before, .elementor-2 .elementor-element.elementor-element-1b58b371 > .elementor-motion-effects-container > .elementor-motion-effects-layer::before{background-color:transparent;--background-overlay:'';background-image:linear-gradient(3.142rad, #42082C 40%, #000000 60%);}.elementor-2 .elementor-element.elementor-element-2669c8ad{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-end;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-2 .elementor-element.elementor-element-4986fe3f{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-end;--align-items:center;}.elementor-2 .elementor-element.elementor-element-746a43b7{border-style:none;text-align:center;}.elementor-2 .elementor-element.elementor-element-746a43b7 .elementor-heading-title{font-size:50px;text-decoration:underline;letter-spacing:5px;text-shadow:0px 0px 10px rgba(0,0,0,0.3);color:#FFFCFC;}.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu .elementor-item{font-size:12px;font-weight:600;text-transform:uppercase;font-style:normal;text-decoration:none;letter-spacing:2px;}.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu--main .elementor-item{color:var( --e-global-color-e8049a1 );fill:var( --e-global-color-e8049a1 );padding-left:10px;padding-right:10px;padding-top:0px;padding-bottom:0px;}.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu--main .elementor-item:hover,
					.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu--main .elementor-item.elementor-item-active,
					.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu--main .elementor-item.highlighted,
					.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu--main .elementor-item:focus{color:var( --e-global-color-e8049a1 );fill:var( --e-global-color-e8049a1 );}.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu--main .elementor-item.elementor-item-active{color:var( --e-global-color-e8049a1 );}.elementor-2 .elementor-element.elementor-element-461658a{--e-nav-menu-horizontal-menu-item-margin:calc( 10px / 2 );}.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu--main:not(.elementor-nav-menu--layout-horizontal) .elementor-nav-menu > li:not(:last-child){margin-bottom:10px;}.elementor-2 .elementor-element.elementor-element-6f5f10ad{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--padding-top:3%;--padding-bottom:3%;--padding-left:0%;--padding-right:0%;}.elementor-2 .elementor-element.elementor-element-2d0f3218{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-2 .elementor-element.elementor-element-a897635{--grid-columns:3;--grid-row-gap:34px;--grid-column-gap:34px;}.elementor-2 .elementor-element.elementor-element-216c7ebd{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--z-index:1;}body.elementor-page-2:not(.elementor-motion-effects-element-type-background), body.elementor-page-2 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:#FFFFFF;}@media(max-width:1024px){.elementor-2 .elementor-element.elementor-element-a897635{--grid-columns:1;}}@media(max-width:767px){.elementor-2 .elementor-element.elementor-element-1b58b371{--min-height:30vh;}.elementor-2 .elementor-element.elementor-element-746a43b7{padding:0px 0px 0px 0px;}.elementor-2 .elementor-element.elementor-element-746a43b7 .elementor-heading-title{font-size:50px;}.elementor-2 .elementor-element.elementor-element-461658a .elementor-nav-menu .elementor-item{font-size:14px;}.elementor-2 .elementor-element.elementor-element-a897635{--grid-columns:1;}}@media(min-width:768px){.elementor-2 .elementor-element.elementor-element-2d0f3218{--width:75%;}.elementor-2 .elementor-element.elementor-element-216c7ebd{--width:25%;}}@media(min-width:1025px){.elementor-2 .elementor-element.elementor-element-1b58b371:not(.elementor-motion-effects-element-type-background), .elementor-2 .elementor-element.elementor-element-1b58b371 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-attachment:fixed;}}/* Start custom CSS for nav-menu, class: .elementor-element-461658a */<script>

/* Code from https://element.how/elementor-horizontal-scroll-navigation-menu/
* Version 1.0
* Copyright 2023 Element.How
*/

document.addEventListener('DOMContentLoaded', function () {

let scrollableNavigations = document.querySelectorAll('.horizontalNav .elementor-nav-menu'), svgIcon;

/* delete this line if you don't want arrows, or change the <svg> markup to your own to have your left pointing icon */
svgIcon = `<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M13.939 4.939L6.879 12l7.06 7.061l2.122-2.122L11.121 12l4.94-4.939z" /></svg>`;

scrollableNavigations.forEach((scrollableNavigation) => {

let navigationItems = Array.from(scrollableNavigation.querySelectorAll('.menu-item')).filter(e => e.parentElement.closest('.menu-item') == null);
let activeNavigationItemIndex = navigationItems.findIndex((navigationItem) => navigationItem.classList.contains('current-menu-item'));

scrollableNavigation.style.scrollBehavior = "smooth";

navigationItems.forEach((navigationItem, i) => {

let scrollToPosition = (navigationItem.getBoundingClientRect().left + navigationItem.offsetWidth / 2) - (window.innerWidth / 2);
navigationItem.addEventListener('click', function () {
scrollableNavigation.scrollTo(scrollToPosition, 0);
});
if (i === activeNavigationItemIndex) scrollableNavigation.scrollTo(scrollToPosition, 0);

updateMask(scrollableNavigation);

});

scrollableNavigation.addEventListener('scroll', function () {
updateMask(scrollableNavigation);
});

let navContainer = scrollableNavigation.parentElement;
let navWidth = navContainer.offsetWidth;

/* add class if can't scroll */
if (scrollableNavigation.scrollWidth <= scrollableNavigation.offsetWidth) {
navContainer.classList.add('no-scroll');
}

/* on resize */
let windowWidth = window.innerWidth;
window.addEventListener('resize', function () {
if (windowWidth === window.innerWidth) return;
navWidth = navContainer.offsetWidth;
if (scrollableNavigation.scrollWidth <= scrollableNavigation.offsetWidth) {
navContainer.classList.add('no-scroll');
} else {
navContainer.classList.remove('no-scroll');
}
});

if (svgIcon) {

navContainer.insertAdjacentHTML('afterBegin', `<button class="scrl-button scrollable-navigation scrollable-navigation-left">${svgIcon}<span class="sr-only">Scroll left</span></button>`);
navContainer.insertAdjacentHTML('afterBegin', `<button class="scrl-button scrollable-navigation scrollable-navigation-right">${svgIcon}<span class="sr-only">Scroll right</span></button>`);
navContainer.querySelector('.scrollable-navigation-left').addEventListener('click', function () {
scrollableNavigation.scrollBy(navWidth * -0.78, 0);
});
navContainer.querySelector('.scrollable-navigation-right').addEventListener('click', function () {
scrollableNavigation.scrollBy(navWidth * 0.78, 0);
});
}
});

function updateMask(scrollableNavigation) {
const maxScroll = scrollableNavigation.scrollWidth - scrollableNavigation.clientWidth;
const currentScroll = scrollableNavigation.scrollLeft;

if (currentScroll > 8) {
scrollableNavigation.parentElement.classList.add('show-left-mask');
} else {
scrollableNavigation.parentElement.classList.remove('show-left-mask');
}

if (currentScroll < maxScroll - 8) {
scrollableNavigation.parentElement.classList.add('show-right-mask');
} else {
scrollableNavigation.parentElement.classList.remove('show-right-mask');
}
}

});
</script>
<style>
.horizontalNav {
--nav-padding: 0 20px; /* set to 0 if you don't use the SVG arrows, 0 20px if you use them */
--nav-item-margin: 0 6px; /* spacing between nav items */
--nav-item-padding: 8px 16px;
--nav-item-border-radius: 30px;
--nav-item-font-weight: 700;
--nav-item-font-size: 1rem;
--nav-item-bg-color: #cecece;
--nav-item-color: #444444;
--nav-item-hover-bg-color: #b0b0b0; /* background color on hover */
--nav-item-hover-color: #333333; /* text color on hover */
--nav-item-active-bg-color: #444444; /* active background color */
--nav-item-active-color: #ffffff; /* active text color */
--tab-style-border: 0px solid #888888; /* to add a tab style border, change to 2px */
--nav-gradient-width: 60px; /* width of gradients */
--nav-gradient-color: #ffffff; /* color of gradients */
--scrollable-navigation-width: 30px;
}

.horizontalNav {
border-bottom: var(--tab-style-border);
}

.horizontalNav .elementor-nav-menu.elementor-nav-menu.elementor-nav-menu {
overflow-x: auto;
display: flex;
flex-wrap: nowrap;
justify-content: start;
position: relative;
padding: var(--nav-padding);
}

.horizontalNav .elementor-nav-menu>.menu-item {
white-space: nowrap;
margin: var(--nav-item-margin);
}

.horizontalNav .elementor-nav-menu>.menu-item>.elementor-item {
padding: var(--nav-item-padding);
background-color: var(--nav-item-bg-color);
border-radius: var(--nav-item-border-radius);
color: var(--nav-item-color);
font-weight: var(--nav-item-font-weight);
font-size: var(--nav-item-font-size);
}

/* styles of nav items on hover */
.horizontalNav .elementor-nav-menu>.menu-item>.elementor-item:hover {
background-color: var(--nav-item-hover-bg-color);
color: var(--nav-item-hover-color);
}

/* styles of active nav item */
.horizontalNav .elementor-nav-menu>.menu-item>.elementor-item.elementor-item-active {
background-color: var(--nav-item-active-bg-color);
color: var(--nav-item-active-color);
border-top: var(--tab-style-border);
border-left: var(--tab-style-border);
border-right: var(--tab-style-border);
}

/* SVG arrows */
.horizontalNav .scrl-button.scrl-button.scrl-button.scrl-button.scrl-button {
background: none;
outline: none;
border: none;
padding: 0;
margin: 0;
}

.horizontalNav .scrl-button.scrl-button.scrl-button.scrl-button.scrl-button:focus-visible {
outline: auto;
}

.horizontalNav .scrollable-navigation {
position: absolute;
height: 100%;
left: 0;
width: var(--scrollable-navigation-width);
display: grid;
place-content: center;
z-index: 7;
}

.horizontalNav .scrollable-navigation-right {
left: initial;
right: 0;
}

.horizontalNav .scrollable-navigation svg {
width: var(--scrollable-navigation-width);
height: var(--scrollable-navigation-width);
}

.horizontalNav .scrollable-navigation-right svg {
transform: rotate(180deg);
}

.horizontalNav .elementor-nav-menu__container:not(.show-right-mask) .scrollable-navigation-right,
.horizontalNav .elementor-nav-menu__container:not(.show-left-mask) .scrollable-navigation-left {
opacity: 0.4;
pointer-events: none;
}

/* hide the svg arrows from 800px viewport and up, adjust as you need */
@media (min-width: 800px) {
.horizontalNav .scrl-button {
display: none;
}
}

/* END OF SVG arrows */

/* gradients on each side when it is possible to scroll more */
.horizontalNav .elementor-nav-menu__container {
position: relative;
}

.horizontalNav .elementor-nav-menu__container::before,
.horizontalNav .elementor-nav-menu__container::after {
content: "";
position: absolute;
width: var(--nav-gradient-width);
top: 0;
bottom: 0;
transform: scaleX(0);
background: linear-gradient(to right, var(--nav-gradient-color), transparent);
transition: transform 0.4s ease-in-out;
z-index: 4;
pointer-events: none;
}

.horizontalNav .elementor-nav-menu__container::before {
left: -2px;
transform-origin: 0 50%;
}

.horizontalNav .elementor-nav-menu__container::after {
right: -2px;
transform-origin: 100% 50%;
background: linear-gradient(to left, var(--nav-gradient-color), transparent);
}

.horizontalNav .elementor-nav-menu__container.show-left-mask::before,
.horizontalNav .elementor-nav-menu__container.show-right-mask::after {
transform: scaleX(1);
}

/* END OF gradients on each side when it is possible to scroll more */

/* remove the scroll bar */
.horizontalNav .elementor-nav-menu::-webkit-scrollbar {
display: none;
}

/* screen reader only styles */
.sr-only {
border: 0;
clip: rect(0,0,0,0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
width: 1px;
}
</style>/* End custom CSS */