/**
 * Summary: css file to implement custom color scheme 3
 */


/* Default and small screens */

/* Set background-color for social media menu icons */
.social-icons a {
	background-color: #393769 !important;
}


/* 1,000+ pixels */

@media screen and (min-width: 1000px) {

	/* Set background color of navigation bar */
	div.header-navigation-wrapper {
	    background-color: #393769;
	}

	/* Set background-color of navigation bar skew detail */
	div.header-navigation-wrapper:before {
	    background-color:#393769;
	}

	/* Set link hover underline color for top level of main navigation bar */
	ul.primary-menu > li > a:hover::after {
	    background-color: #febe10;
	}

	/* Style currently-active top menu item */
	ul.primary-menu li.current-menu-item > a::after {
	    background-color: #febe10;
	}

	/* Set background color of main navigation sub-menus */
	.primary-menu ul {
	    background: #302e59 !important;
	}

	/* Set color of main navigation sub-menu background 'arrow' details */
	.primary-menu ul::after {
	    border-bottom-color: #302e59 !important;
	}
	.primary-menu ul ul::after {
	    border-bottom-color: transparent !important;
	    border-left-color: #302e59 !important;
	}

	/* Set link hover color and active menu item color for main navigation sub-menus */
	ul.primary-menu ul li a:hover::after, ul.primary-menu ul li.current-menu-item::after {
	    content: "";
	    background-color: #fff;
	    position: absolute;
	    left: 1em;
	    right: 1em;
	    bottom: -0.1em;
	    height: 1px;
	    transform: skew(-30deg);
	}

}
