.menu {
	list-style: none;
	margin: 0;
	padding: 0;
}

@media(max-width: 545px){
	header {
		position: sticky !important;
		top: 0;
	}
}

.menu > li {
	position: relative;
}

.public-mega-menu {
	position: relative;
}

.menu li:hover > a {
	color: #884A83;
}

.menu-item-has-children > .sub-menu {
	background: #FFFFFF;
	padding: 2em 10.1em;
	grid-template-columns: repeat(2, 1fr);
	list-style: none;
	margin: 0;
}

.menu-item-has-children:hover > .sub-menu {
	display: grid;
}

.sub-menu li {
	list-style: none;
	margin: 0;
	padding: 0;
}

.sub-menu a {
	color: #884A83;
	text-decoration: none;
	font-size: 18px;
	font-weight: 500;
	padding: 3px;
	display: block;
}

.menu-item-has-children > .sub-menu {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.3s ease;
}

.menu-item-has-children:hover > .sub-menu {
	opacity: 1;
	visibility: visible;
}

.mega-menu > .sub-menu {
	position: absolute;
	left: 40%;
	width: 810px;
	padding: 20px;
	padding-top: 40px;
	margin-left: calc(-400px + 200px);
	box-shadow: 0 0 5px rgba(0,0,0,0.2);
	background: white;
	z-index: 50;
}

ul#menu-main-menu-1 > li > a {
	font-size: 18px;
	line-height: 1.2;
	display: inline-block;
}

header div.flex > a {
	font-size: 16px;
	line-height: 1.2;
}

ul#menu-main-menu-1 {
	gap: 20px;
}

header div.flex.items-center.gap-3 {
    flex-direction: column;
}

header .flex.items-center.gap-3 > a {
    width: 100%;
}

.visa-mega-menu .sub-menu {
	left: 20%;
}

.british-mega-menu .sub-menu {
	display: flex !important;
    flex-direction: column;
    width: 440px;
}

.visa-mega-menu .sub-menu {
	display: flex !important;
    flex-direction: column-reverse;
    width: 300px;
}

.visa-mega-menu .sub-menu li a {
	text-align: center;
}

nav .menu li a {
    font-size: 18px;
}

@media (max-width:768px){
	.menu {
		display: flex;
		flex-direction: column;
	}

	.menu-item-has-children:hover > .sub-menu {
		display: flex;
		flex-direction: column;
		gap: 0;
	}

	.sub-menu li a {
		line-height: 1.4;
		font-size: 16px;
	}

	a.custom-logo-link img {
		max-height: 80px;
		object-fit: contain;
	}

	header {
		box-shadow: 0 2px 5px rgba(0,0,0,0.1);
	}	
}


@media (max-width:1300px) and (min-width:1024px){
    nav .menu li a {
        font-size: 15px;
    }
    
    header {
        padding: 0 10px!important;
        width: 100%!important;
    }    
}