/* add blur to header background */
#ttd-header {
  backdrop-filter: blur(5px);
}

/*Header menu underline on hover */

:root {
	  --BottomOffset: -5px;
	  --LineHeight: 5px;
	  --LineColor: #f53163;
	}
	
	.ttd-menu ul.et-menu>li>a {
		position: relative;
		z-index: 50;
	}
	.ttd-menu ul.et-menu>li>a:before {
		position: absolute;
		content: '';
		display: block;
		z-index: -1;
		background: var(--LineColor);
		width: 0;
		height: var(--LineHeight);
		bottom: var(--BottomOffset);
		border-radius:var(--LineHeight);
		left: 50%;
		transition: 0.4s cubic-bezier(0.25, 0.1, 0.25, 1);
	}
	
	.ttd-menu ul.et-menu>li>a:hover:before {
		width: calc(100% + var(--LineHeight));
		left: calc(var(--LineHeight) / -2);
	}

/*style sub-menu */

#ttd-header ul.sub-menu a {
  text-transform: none;
  font-weight: 400;
}


/* Desktop Submenu styling */
@media (min-width:981px) {
	#ttd-header ul.sub-menu {
		border-style: solid;
		border-width: 2px;
		border-radius: 6px 6px 6px 6px;
		box-shadow: none;
		padding: 10px 0;
		width: 200px;
	}
	
	#ttd-header ul.sub-menu li {
		padding: 0;
		width:100%;
	}
	
	#ttd-header ul.sub-menu li a {
		width:100%;
		background:none;
		opacity:1;
		transition: all .3s linear;
	}
	#ttd-header ul.sub-menu li a:hover {
		padding-left:26px;
	}
}


/* Mobile Menu styling */
#ttd-header .et_mobile_menu {
  width: 80vw;
}

@media (max-width:600px) {
	#ttd-header .et_mobile_menu {
		width: 90vw;
	}
}

#ttd-header .et_mobile_menu a {
	background: none;
}
#ttd-header .opened .mobile_menu_bar::before {
	content: '\4d';
}