ul.mega-menu{display: flex; justify-content: space-between; flex-direction: row; position: relative; width: 100%; }
ul.mega-menu > li{width: auto;}

ul.mega-menu > li:focus > a, ul.mega-menu > li:hover > a, ul.mega-menu > li:active > a{color: #ccc;}
ul.mega-menu > li > a{display: block; padding: 10px 0; font-size: 18px; text-transform: uppercase; letter-spacing: 2px;}

ul.mega-menu > li > ul{position: absolute; opacity: 0; transform: translateY(-10px); transform-origin: top; pointer-events: none; transition: ease all 0.3s; z-index: 1000; max-width: 600px;}

ul.mega-menu > li:not(.mega-dropdown){display: block; position: relative;}
ul.mega-menu > li:not(.mega-dropdown) > ul{flex-direction: column; background: #fff; width: 220px; padding: 10px 0; text-align: left; box-shadow: 0 0 8px 0 rgba(0,0,0,0.2);}
ul.mega-menu > li:not(.mega-dropdown) > ul > li > a{display: block; padding: 15px 20px; font-size: 18px; font-weight: 700; text-transform: uppercase; letter-spacing: 2px; color: #0A0C0D;}

ul.mega-menu > li.mega-dropdown > ul{gap: 15px; background: #f2f2f2; width: 100%; margin: auto; padding: 15px; border-top: 2px #1F51FF solid; box-shadow: 10px 10px 8px 0 rgba(42,42,42,0.18);}
ul.mega-menu > li.mega-dropdown > ul > li{width: calc(50% - 7.5px);}
ul.mega-menu > li.mega-dropdown > ul > li > a{display: block; background: #000; padding: 5px 10px; font-size: 18px; font-weight: 700; text-transform: uppercase;}
ul.mega-menu > li.mega-dropdown > ul > li > a:before{display: block; content: ""; position: relative; top: -5px; left: -10px; background-color: #f2f2f2; background-repeat: no-repeat; background-size: cover; background-position: center center; width: calc(100% + 20px); padding-bottom: 55%;}

ul.mega-menu > li:hover > ul{opacity: 1; pointer-events: auto; transform: translateY(0);}

ul.mega-menu > li.show-mobile{display: none;}

#cs-header .cta-btn{
	display: flex; gap: 10px;
}

/* MOBILE NAV */	

nav.mobile{display: none;}
#menu-button{display: none;}

@media screen and (max-width: 1660px){
	ul.mega-menu > li > a{font-size: 13px;}
	ul.mega-menu > li.social a:before{font-size: 13px;}
	
	#cs-header .cta-btn a{
		font-size: 13px;
	}
}
@media screen and (max-width: 1200px){
	ul.mega-menu > li.mega-dropdown > ul > li{width: calc(50% - 7.5px);}
}
@media screen and (max-width: 1100px){
	ul.mega-menu{display: none !important;}

	#menu-button{display: block; position: relative; width: 100%; font-size: 24px; line-height: 60px; text-align: right; z-index: 400;}
	#menu-button a{padding: 0 10px; font-weight: normal; text-decoration: none; color: #fff;}

	nav.mobile{display: block; position: fixed; top: 0; left: -100%; width: 100%; height: 100%; background: #0A0C0D; letter-spacing: 3px; z-index: 500; overflow: auto;}
	nav.mobile .mobile_top{display: flex; align-items: center; justify-content: flex-end; padding: 15px; padding-bottom: 0;}
	nav.mobile .menu-toggle{font-family: Arial, sans-serif; font-size: 28px; font-weight: bold; line-height: 1; color: #fff;}

	nav.mobile ul li.social{display: inline-block; width: fit-content;}
	nav.mobile ul li.social a:before{padding: 5px;}
	
	nav.mobile .click i{margin-left: auto;}
	nav.mobile .click .fa-angle-down:before{content: "\2b";}
	nav.mobile .click.active .fa-angle-down:before{content: "\f068";}

	nav.mobile ul{list-style: none; font-weight: 300; margin: 0; padding: 20px;}
	nav.mobile ul li{position: relative;}
	nav.mobile ul li a{ display: flex; align-items: center; position: relative; padding: 20px 0; font-size: 15px; text-transform: uppercase; text-decoration: none; text-align: left; letter-spacing: 2px; color: #fff;}
	
	nav.mobile ul ul{padding: 0;}
	nav.mobile ul ul li a{background: #444; osition: relative; display: block; padding: 20px 15px;}
	
	nav.mobile .mobile-contact strong{font-weight: 700;}
	nav.mobile .mobile-contact ul{padding: 10px 20px;}
	nav.mobile .mobile-contact ul li a{display: flex; align-items: center; gap: 0 8px; padding: 5px 0;}

	.nav-footer{display: block; position: relative; padding: 50px 0; font-size: 14px; text-transform: uppercase; text-align: center; color: #fff;}
}