.clear {
	clear: both;
}
/***** Start of primary nav ******/
#menu-button {
	display: none;
}
nav.mobile {
	display: none;
}
nav.primary {display: block; position: relative; margin:0 0 0 auto; padding: 0;}
nav.primary ul {
	margin: 0;
	padding: 0;
	text-align: right;
	
	display:flex; flex-flow:row wrap; align-items:center; gap:15px;
}
nav.primary ul li {
	display: inline-block;
	margin: 0;
	list-style-type: none;
}
nav.primary ul li a {
	display: block; position: relative;
	
	margin: 0; padding: 10px 8px;
	
	font-size:18px; line-height:18px; font-weight: 700; text-decoration: none; text-align: center; text-transform: uppercase;
	
	color:var(--black) !important; font-family: "tonos", sans-serif; transition: .2s ease-in;
}

nav.primary ul li a span {font-weight:400;}


nav.primary ul li a::before {
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 4px;
	background:var(--black);
	-webkit-transform: scale3d(0, 1, 1);
	transform: scale3d(0, 1, 1);
	-webkit-transition: -webkit-transform 0.1s;
	transition: transform 0.1s;
	
}

nav.primary ul li a:hover::before {
	-webkit-transform: scale3d(1, 1, 1);
	transform: scale3d(1, 1, 1);
	-webkit-transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
	-webkit-transition-duration: 0.3s;
	transition-duration: 0.3s;
}




/* Appearance of the sub-level links */
nav.primary ul li li {width: auto;}
nav.primary ul li li a {padding:10px 5px; font-size: 16px; line-height:1.2; font-weight: 600; text-transform: none; text-align: left; color:var(--darkgray);}
nav.primary ul li li a:hover {padding-right:0; padding-left:10px; color:var(--darkgray); background: transparent;}
nav.primary ul li li a::before {content:""; position:absolute; z-index:5; opacity:0; top:10px; left:-3px; width:4px; height:13px; background:var(--black);transition: .5s ease-in-out;}
nav.primary ul li li a:hover::before {opacity: 1;}

nav.primary ul ul {display: none; position: absolute; min-width:200px; padding:12px 15px; background:var(--nearwhite); box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); }
nav.primary ul ul ul {position: absolute; left: 100%; top:0;}

/*nav.primary ul ul {display: none; position: absolute; min-width:200px; padding:12px 15px; background:var(--nearwhite); box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2); }
nav.primary ul ul ul {position: absolute; left:-100%; top:0;  min-width:200px; padding:0; background:var(--offwhite); box-shadow:none;}
nav.primary ul ul ul ul {position: relative; left:0; top:0; min-width:200px; padding:0; background:var(--offwhite);}*/

nav.primary ul li:hover>ul {display: block; z-index: 100; animation: fade-in-top 0.6s cubic-bezier(0.390, 0.575, 0.565, 1.000) both;}
nav.primary ul ul li {display: block; float: none; position: relative; margin: 0; padding-right: 15px;}



/******** Nav Resets ***************/
.child-plus {
	position: absolute; top: 50%; right:-3px; transform: translateY(-50%); font-size:20px; font-weight:400; color:var(--nearblack); 
}

nav.primary ul li li a .child-plus {right:-20px;}



/******** End of primary Nav ***************/
@media screen and (max-width: 1650px) {
	nav.primary ul li a {
		font-size: 15px;
	}
}

@media screen and (max-width: 1550px) {
	nav.primary ul {gap:10px;}
	nav.primary ul li a {padding: 10px 5px;}
}

@media screen and (max-width: 1440px) {
	nav.primary {display: none;}
	.child-plus {right:8px;}
	#menu-button {
		order:3;
		display:inline-block;
		font-size: 24px;
		position: relative;
		line-height: 1;
		z-index: 1000;
		text-align: right;
		margin-right:40px;
	}
	#menu-button a {
		color:var(--black);
		text-decoration: none;
		font-weight: normal;
		text-align: left;
		font-weight: 600;
	}
	nav.mobile {
		display: block;
		position: fixed;
		text-align: left;
		top: 0;
		right: -260px;
		width: 260px;
		height: 100%;
		z-index: 1010;
		/* needs to be higher than #menu-button, adjust as needed */
		overflow: auto;
		
		background: rgb(255,255,255);
		background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(224,224,224,1) 100%);		
	}
	/* MENU HEADER SOCIAL MEDIA */
	nav.mobile .social-media {
		position: relative;
		text-decoration: none;
		display: inline-block;
		font-size: 16px;
		word-spacing: 13px;
		padding: 0 0 0 15px;
		color: #474747 !important;
	}
	nav.mobile .social-media a:link,
	nav.mobile .social-media a:visited {
		color: #474747;
		text-decoration: none;
	}
	nav.mobile .social-media a:hover,
	nav.mobile .social-media a:active {
		color: #000;
		text-decoration: underline;
	}
	.mobiletitle {
		font-size:12px; 
		padding-left: 20px;
		color: #8B8B8B;
	}
	/* MENU HEADER STYLES */
	nav.mobile .mobile_top {
		position: relative;
		display: block;
		padding: 0;
		margin: 15px 0 10px 0;
		/*margin:40px 0 10px 0;*/
		color: #999;
		font-size: 18px;
		font-weight: 400;
	}
	/* MENU CLOSE 'X' BUTTON */
	nav.mobile .menu-toggle {
		position: absolute;
		z-index:15; 
		padding: 3px 8px 3px;
		font-family: Arial, sans-serif;
		font-size: 24px;
		font-weight: bold;
		line-height: 1;
		background: #222;
		color: #999;
		text-decoration: none;
		top: -6px;
		/*top:-35px;*/
		right: 13px;
		cursor:pointer; 
	}
	nav.mobile .menu-toggle:hover {
		/* Menu close button on hoveer */
		color: #fff;
	}
	
	
	/* MENU LIST STYLE */
	nav.mobile ul {
		list-style: none;
		font-weight: 700;
		margin: 48px 0 0 0;
		padding: 0;
	}
	nav.mobile ul li {
		/*border-top: 1px solid #454545;
		border-bottom: 1px solid #151515;*/
		position: relative;
	}
	/* FIRST LEVEL */
	nav.mobile ul li a {
		position: relative;
		display: block;
		font-size: 16px;
		padding: 18px 10px 16px 15px;
		color: #000;
		text-decoration: none;
		/*border-left: 4px #333 solid;*/
		font-weight: 700;
		text-transform:uppercase;
		transition: 0.65s ease;
	}
	nav.mobile ul li a:hover {
		background: rgba(45, 45, 45, 0.4);
		color: #fff;
		border-left: 4px var(--crysteelred) solid;
	}
	
	.mobile li i {position: absolute; top: 23px; right:12px;}
	
	/* SECOND LEVEL */
	nav.mobile ul ul {margin-top: 0;}

	
	nav.mobile ul li li:last-child {
		border: none;
	}
	nav.mobile ul li li a {
		background: rgba(65, 65, 65, 0.25);
		/*background: white;*/
		position: relative;
		display: block;
		padding: 16px 10px 14px 25px;
		/*border-left: 4px #444 solid;*/
		font-weight:500;
		font-size: 14px;
		color:#000;
		text-decoration: none;

	}
	nav.mobile ul li li a:hover {
		background: rgba(65, 65, 65, 0.45);
	}
	/* THIRD LEVEL */
	nav.mobile ul li li li:last-child {
		border: none;
	}
	nav.mobile ul li li li a {
		background: rgba(65, 65, 65, 0.65);
		position: relative;
		display: block;
		padding: 10px 10px 10px 25px;
		color: #ccc;
		text-decoration: none;
		
		
	}
	nav.mobile ul li li li a:hover {
		background: rgba(65, 65, 65, 0.75);
	}
	/* FOURTH LEVEL */
	nav.mobile ul li li li li:last-child {
		border: none;
	}
	nav.mobile ul li li li li a {
		background: #777;
		position: relative;
		display: block;
		padding: 10px 10px 10px 25px;
		color: #ccc;
		text-decoration: none;
	}
	nav.mobile ul li li li li a:hover {
		background: rgba(85, 85, 85, 0.5);
	}
	nav.mobile ul li i.fas.fa-angle-down {

		font-size:.85em; 
		color:#555 !important;
		
		position:absolute;
		z-index: 12;
		display:block;
		cursor:pointer;
		top:0;
		right:0;
		width:auto;
		height:auto;
		padding: 17px 20px;
	}

	/* FONT AWESOME ICONS */
	nav.mobile ul li a .fa {
		width: 25px;
		font-weight: 100;
		padding: 8px 3px;
		margin: 0 6px 0 0;
		text-align: center;
		background: #292929;
		border-radius: 30px;
		text-shadow: 1px 1px 1px rgba(0, 0, 0, 0.3);
	}
	nav.mobile ul li .fa-chevron-down {
		color: #999;
	}
	.more {
		position: absolute;
		right: 5%;
	}
	.mobilefooterlogo {
		text-align: center;
		margin: 0 auto;
		transform: scale(0.9);
	}
}

}
@media screen and (max-width: 500px) {
	#menu-button {
		text-align: center;
	}
}
/* Hide the desktop menu item icons */
.primary li > i {
	display: none;
}
/* Position the mobile menu item icons */
.mobile li i {
	position: absolute;
	top: 13px;
}