Menu with expanding underline under Menu Items

menu-underline.css

/* Underlines not on mobile - Change Menu name and background color to suit
 *

@media(min-width:768px) {
	#menu-primary-menu>li>a::after {
		content: '';
		position: absolute;
		background-color: #00778F;
		height: 2px;
		bottom: 2px;
		width: 30%;
		left: 35%;
		transform: scaleX(0);
		transition: 250ms ease-in-out;
	}

	#menu-primary-menu>li>a:hover:after {
		transform: scaleX(1);
	}

}