body {
	 font-family: 'Nunito', sans-serif;
	 background: #fff;
	 padding: 0;
	 margin: 0;
}
 *, *:before, *:after {
	 -webkit-box-sizing: border-box;
	 -moz-box-sizing: border-box;
	 box-sizing: border-box;
}
 nav ul, nav li {
	 list-style: none;
	 padding: 0;
	 margin: 0;
}
 nav a {
	 display: block;
	 text-decoration: none;
}
 nav a:hover, nav a:visited {
	 text-decoration: none;
}

/**************
***************
***************
				Overlay
***************
***************
***************/
.overlay.active
{
	position: fixed;
	  background: #464646b8;
	  left: 0;
	  right: 0;
	  height: 100hv;
	  z-index: 990;
	  bottom: 0;
	  top: 0;
	  transition: .5s;
}


/**************
***************
***************
				Display      Mobile / Desktop
***************
***************
***************/
.d-none--desktop,.d-none--mobile
{
	display:none;
}

@media (min-width: 992px) {	
	.d-none--mobile
	{
		display:block;
	}
}

@media (max-width: 991px) {	
	.d-none--desktop
	{
		display:block;
	}
}

/**************
***************
***************
				Mobile Menu Toggler
***************
***************
***************/
.toggle_menu {
	cursor: pointer;
	position: relative;
	display: none;
	height: 50px;
	visibility: visible;
	width: 50px;
	z-index: 980;
	float: right;
	border: 1px solid #999;
	border-radius: 10px;
	margin-bottom: 20px;
	margin-top: 20px;
}


.toggle_menu:hover span:before {
	top: -7px;
}

.toggle_menu:hover span:after {
	top: 7px;
}

.toggle_menu span,
.toggle_menu span:before,
.toggle_menu span:after {
	background-color: #8c8c8c;
	content: "";
	display: block;
	height: 2px;
	left: 0;
	position: relative;
	-webkit-transition: all 0.2s ease-in-out 0s;
	transition: all 0.2s ease-in-out 0s;
	width: 24px;
}

.toggle_menu span {
	left: 12px;
	margin-top: 0px;
	top: 50%;
}


.toggle_menu span:before {
	top: -6px;
}

.toggle_menu span:after {
	top: 6px;
}

@media (max-width: 991px) {	
	.toggle_menu {
		display: block;
	}

	.toggle_menu.mobile-active {
		background-color: #44425A;
		border: none;
		left: auto;
		margin: 0;
		position: fixed;
		right: 0;
		top: 0;
		z-index: 3000;
	}

	.toggle_menu.mobile-active:after {
		color: #fff;
		content: "\f00d";
		font-family: 'Font Awesome 5 Free';
		font-weight: 900;
		font-size: 30px;
		left: 0;
		position: absolute;
		right: 0;
		text-align: center;
		top: 50%;
		-webkit-transform: translateY(-50%);
		-ms-transform: translateY(-50%);
		transform: translateY(-50%);
	}

	.toggle_menu.mobile-active span {
		display: none;
	}
}


/**************
***************
***************
				GLOBAL Menu Styles 
***************
***************
***************/
 .menu-bar {
	 background: #ffffff;
	 display: flex;
	 z-index:999;
	 text-transform: uppercase;
}
 li.menu-item > a {
	 padding: 10px 10px;
	 /*background: #ffffff;*/
	 color: #44425A;
	 transition: background .2s, color .2s;
	 position: relative;
	 z-index: 1;
}
 li.menu-item.menu-item-has-children> a {
	 padding-right: 30px;
}
 li.menu-item.menu-item-has-children> a:after {
	 content: "\f054";
	 font-family: "Font Awesome 5 Free";
	  font-weight: 900;
	 background-size: 14px;
	 width: 14px;
	 height: 14px;
	 font-size: 12px;
	 position: absolute;
	 right: 10px;
	 top: 44%;
	 transform: translateY(-50%);
}
 .mega-menu-header {
	 font-size: 1.2em;
	 text-transform: uppercase;
	 font-weight: bold;
	 color: #1c396e;
}

 .sub-menu {
	background: #ffffff;
	z-index: 10;
	flex-direction: column;
}

/**************
***************
***************
				DESKTOP Menu Styles
***************
***************
***************/
 @media all and (min-width: 991px) {
	 .nav {
		 /*margin-top: 50px;*/
		 background: #ffffff;
		 display: flex;
	}
	 .nav > nav {
		 max-width: 900px;
		 margin: 0 auto;
	}
	.menu li.menu-item.menu-item-has-children> ul {
		 display: none;
		 border: 1px solid #44425A;
		border-radius: 5px 5px;	
		box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
	}
	 .menu-bar {
		 position: relative;
	}
	
	 .menu-bar > li {
		 position: relative;
	}
	
	 .menu-bar > li.menu-item.menu-item-has-children>a:after {
		 /*background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1397521/arrowBottom.svg#accent');*/
		 content: "\f078";
	}
	.menu-bar > li.menu-item.menu-item-has-children>a:hover:after {
		 /*background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1397521/arrowBottom.svg#light');*/
		 		 content: "\f078";
		  
	}
	 .menu-bar > li.menu-item.menu-item-has-children>a:focus ~ ul {
		 display: flex;
		 transform-origin: top;
		 animation: dropdown .2s ease-out;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul:hover {
		 display: flex;
	}
	 .menu-bar > li.menu-item.menu-item-has-children:focus-within > ul {
		 display: flex;
	}
	/*.menu-bar > li.menu-item.menu-item-has-children>a:focus, .menu-bar > li.menu-item.menu-item-has-children:focus-within, .menu-bar > li:hover > a {
		 background: #177E89;
		 color: #ffffff;
	}*/

	
	
	 .menu-bar > li.menu-item.menu-item-has-children>a:focus:after, .menu-bar > li.menu-item.menu-item-has-children:focus-within > a:after/*, .menu-bar > li:hover > a:after*/ {
		 /*background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1397521/arrowTop.svg#light');*/
		 content: "\f077";
	}
	
	.sub-menu li > a, .sub-menu li.menu-item.menu-item-has-children > a
	{
		padding-left:30px;
	}
	
	.menu-bar > li > ul  > li > a {
		 padding-left:30px;
		 transition: color 0.5s;
	}
	
	.menu-bar > li > a
	{
		font-weight: 700;
		font-size: 1.2rem;
		color: #2862ac;
		margin: 6px 10px;
	}
	
	.menu-bar > li > a:hover
	{
		color: #1c396e;
	}
	
	 .sub-menu:hover {
		 display: flex;
	}
	 .sub-menu a:hover {
		 background: tint(#177E89,85%);
		 color: #1c396e;
	}
	 .sub-menu{
		 position: absolute;
		 top: 100%;
		 left: 0;
	}
	
	.sub-menu > li {
		 /*width: 33.333333333333%;*/
		 width: 300px;
	}
	
	 .sub-menu > li.menu-item.menu-item-has-children> ul {
		 /*left: 33.333333333333%;
		 width: 33.333333333333%;*/
		 left: 100%;
		 width: 100%;
	}
	 .sub-menu > li.menu-item.menu-item-has-children> ul ul {
		 width: 100%;
		 left: 100%;
	}
	 .sub-menu li.menu-item.menu-item-has-children:hover > ul {
		 display: block;
		 transform-origin: left;
		 animation: flyout .2s ease-out;
	}
	 .sub-menu li.menu-item.menu-item-has-children:focus-within > ul {
		 display: block;
	}
	 .sub-menu li.menu-item.menu-item-has-children:hover > a, .sub-menu li:hover > a, .sub-menu li.menu-item.menu-item-has-children:focus-within > a, .sub-menu li:focus-within > a {
		 background: tint(#177E89,85%);
		 color: #5686dc;
	}
	
		
	/****   Hover-underline-animation START  ***/
	.sub-menu li > a, .sub-menu li.menu-item.menu-item-has-children > a
	{
		display: inline-block;
		position: relative;
	}
	
	.sub-menu li > a::before, .sub-menu li.menu-item.menu-item-has-children > a::before
	{
		content: '';
		position: absolute;
		width: 100px;
		transform: scaleX(0);
		height: 2px;
		bottom: 0;
		left: 30px;
		background-color: #2862ac;
		transition: transform 0.25s;
		transform-origin: bottom left;
		top:initial;
	}
	
	.sub-menu li > a:hover::before, .sub-menu li.menu-item.menu-item-has-children > a:hover::before
	{
		transform: scaleX(1);
		transform-origin: bottom left;
	}
	
	/****   Hover-underline-animation END  ***/

	.sub-menu li.menu-item.menu-item-has-children > a::after
	{
		content: "\f054";
		font-family: "Font Awesome 5 Free";
		font-weight: 900;
		background-size: 14px;
		width: 14px;
		height: 14px;
		font-size: 12px;
		position: absolute;
		left: 10px;
		top: 44%;
	}

	
	 .sub-menu li.menu-item.menu-item-has-children> ul, .sub-menu li.menu-item.menu-item-has-children>a {
		 border-left: 1px solid #f0f0f0;
	}
	 .sub-menu li.menu-item.menu-item-has-children> ul:hover, .sub-menu li.menu-item.menu-item-has-children>a:hover {
		 display: block;
	}
	 .sub-menu li.menu-item.menu-item-has-children
	{
		position:relative;
	}
	
	.sub-menu li.menu-item.menu-item-has-children> ul {
		 position: absolute;
		 top: -10px;
	}
	 .mega-menu--flat > * {
		 flex: 1;
	}
	 .mobile-menu-trigger, .mobile-menu-header, .mobile-menu-back-item {
		 display: none;
	}
}


/**************
***************
***************
				MOBILE Menu Styles
***************
***************
***************/

 @media all and (max-width: 990px) {
	 .nav {
		 padding: 20px;
	}
	
	.nav ul
	{
		background: #1a375a;
	}
	
	 .mobile-menu-trigger, .mobile-menu-header, .mobile-menu-back-item {
		 display: block;
	}
	 .mobile-menu-trigger {
		 background: #177E89;
		 color: #ffffff;
		 border: 0;
		 padding: 10px;
		 font-size: 1.2em;
		 border-radius: 4px;
	}
	 .mobile-menu-header {
		 order: -1;
		 background: #fff;
		 border-bottom: 1px solid #999;
		 
	}
	 .mobile-menu-header a {
		 padding: 16px 30px;
		 color: #44425A;
		 visibility: visible;
		 font-size: 20px;
	}
	
	li.menu-item > a{
		border-bottom: 1px solid #dadada;
		font-size: 1.4rem;
		font-weight: 700;
		color: #fff;
	}
	
	li.menu-item > a:hover{
		color: #86c8c8;
	}
	
	 .menu-bar {
		 flex-direction: column;
		 position: fixed;
		 top: 0;
		 left: -100%;
		 height: 100vh;
		 width: 350px;
		 max-width: 350px;
		 max-width: 90%;
		 overflow-x: hidden;
		 transition: left .3s;
		 box-shadow: 1px 0px 2px 0px rgba(0,0,0,0.25);
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul {
		 display: flex;
		 flex-direction: column;
		 background: #2862ac;
		 position: absolute;
		 left: 100%;
		 top: 0;
		 max-height: 200vh;
		 /*width: 100%;*/
		 width: 320px;
		 transition: left .3s;
		border-left: 3px solid white;
		border-bottom: 2px solid white;	
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul > li.menu-item.menu-item-has-children>a {
		 font-size: 1.2em;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul > li.menu-item.menu-item-has-children> ul a {
		 padding-left: 40px;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul > li.menu-item.menu-item-has-children> ul > li.menu-item.menu-item-has-children> ul a {
		 padding-left: 80px;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul li.menu-item.menu-item-has-children>a {
		 color: #fff;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul li.menu-item.menu-item-has-children>a:after {
		 content: "\f078";
		 font-family: "Font Awesome 5 Free";
		 font-weight: 700;
		 background: none;
		 font-size: 0.75em;
		 height: 20px;
		 line-height: 1;
	}
	 .menu-bar li.menu-item.menu-item-has-children> ul li.menu-item.menu-item-has-children> ul {
		 max-height: 0px;
		 transform-origin: top;
		 transform: scaleY(0);
		 transition: max-height .1s;
	}
	 .mega-menu-content {
		 padding: 20px 25px;
	}
	 .mobile-menu-back-item {
		 order: -1;
		 border-bottom: 1px solid #999;
	}
	 .mobile-menu-back-item a {
		 background: tint(grey,70%);
		 color: #2a2a2a !important;
		 max-height: calc(1.4em + 40px);
		 margin-top: calc(0px - (1.4em + 40px));
		 pointer-events: none;
		 padding: 20px 20px !important;
		border-bottom:none;
	}
	 .mobile-menu-back-item a:before {
		 content: "";
		 width: 14px;
		 height: 12px;
		 background-image: url('https://s3-us-west-2.amazonaws.com/s.cdpn.io/1397521/arrowLeft.svg#default');
		 background-size: 14px;
		 margin-right: 10px;
		 display: inline-block;
	}
	
	.mobile-menu-trigger:focus ~ ul {
		 left: 0;
	}
	
	/** Rewrite **/
	
	.menu-bar.active {
		 left: 0;
	}
	/*.menu-bar:hover, .menu-bar:focus-within {
		 left: 0;
	}*/
	
	 .menu-bar > li.menu-item.menu-item-has-children>a:focus ~ ul {
		 left: 30px;
	}
	
	 .menu-bar > li.menu-item.menu-item-has-children> ul {
		 margin-top: calc(1.4em + 40px);
	}
	
	 .menu-bar > li.menu-item.menu-item-has-children> ul:hover, .menu-bar > li.menu-item.menu-item-has-children> ul:focus-within {
		 left: 30px;
	}
	
	/*  Menu shadow  */
	.menu-bar > li.menu-item.menu-item-has-children>a:focus ~ ul,.menu-bar > li.menu-item.menu-item-has-children> ul:hover, .menu-bar > li.menu-item.menu-item-has-children> ul:focus-within 
	{
		/*box-shadow: -3px 3px 5px #c8c8c8;*/
	}
	
	/*  Hover sub menu item */
	/*
	.sub-menu li.menu-item.menu-item-has-children:hover > a, .sub-menu li:hover > a, .sub-menu li.menu-item.menu-item-has-children:focus-within > a, .sub-menu li:focus-within > a {
		 color: #86c8c8;
	}/**/
	
	 .menu-bar > li.menu-item.menu-item-has-children> ul li.menu-item.menu-item-has-children>a:focus ~ ul {
		 max-height: 1500px;
		 animation: dropdown .3s forwards;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul li.menu-item.menu-item-has-children:focus-within > ul {
		 max-height: 1500px;
		 transform: scaleY(1);
	}
	 .menu-bar > li:focus-within ~ .mobile-menu-header a {
		 visibility: hidden;
	}
}
 @media all and (max-width: 990px) and (hover: none) {
	 .mobile-menu-trigger:hover ~ ul {
		 left: 0;
	}
	 .menu-bar > li.menu-item.menu-item-has-children>a:hover ~ ul {
		 left: 30px;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul:hover {
		 left: 30px;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul li.menu-item.menu-item-has-children>a:hover ~ ul {
		 max-height: 1500px;
		 animation: dropdown .3s forwards;
	}
	 .menu-bar > li.menu-item.menu-item-has-children> ul li.menu-item.menu-item-has-children> ul:hover {
		 max-height: 1500px;
		 transform: scaleY(1);
	}
	 .menu-bar > li:hover ~ .mobile-menu-header a {
		 visibility: hidden;
	}
	
	 .menu-bar > li.menu-item.menu-item-has-children>a:focus ~ ul {
		 left: 30px;
	}
	
	/*  Menu shadow  */
	.menu-bar > li.menu-item.menu-item-has-children>a:hover ~ ul,.menu-bar > li.menu-item.menu-item-has-children> ul:hover,.menu-bar > li.menu-item.menu-item-has-children>a:focus ~ ul{
		/*box-shadow: -3px 3px 5px #c8c8c8;*/
	}
}
 @keyframes dropdown {
	 0% {
		 opacity: 0;
		 transform: scaleY(0);
	}
	 50% {
		 opacity: 1;
	}
	 100% {
		 transform: scaleY(1);
	}
}
 @keyframes flyout {
	 0% {
		 opacity: 0;
		 transform: scaleX(0);
	}
	 100% {
		 opacity: 1;
		 transform: scaleX(1);
	}
}