@font-face {
	font-family: 'Ionicons';
	src: url("/fonts/ionicons.eot");
	src: url("/fonts/ionicons?#iefix") format('embedded-opentype'),url("/fonts/ionicons.woff") format('woff')
}

#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a, #cssmenu #menu-button {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	position: relative;
	box-sizing: border-box;
	font-family: hypatia-sans-pro, sans-serif;
	font-weight: 600;
}

	#cssmenu:after, #cssmenu > ul:after {
		content: ".";
		display: block;
		clear: both;
		visibility: hidden;
		line-height: 0;
		height: 0;
	}

	#cssmenu #menu-button {
		display: none;
	}

#cssmenu {
	width: auto;
	line-height: 1;
	display: block;
}

	#cssmenu ul {
		display: flex;
		justify-content: space-between;
		align-content: center;
		margin: 0;
		transition: left 0ms linear;
	}

#cssmenu li {
	margin: 0;
	flex: 1;
	position: relative;
}
	#cssmenu ul li::after {
		display: block;
		content: '';
		background: var(--colWhite) url(/images/icons/diamond.svg) right center no-repeat;
		background-size: 4px 10px;
		width: 4px;
		height: 10px;
		position: absolute;
		right: 0;
		top: calc(50% - 5px)
	}
	#cssmenu ul li a {
		color: var(--colDark);
		background: var(--colWhite);
		font-size: 1rem;
		font-weight: 400;
		text-transform: uppercase;
		text-align: center;
		text-decoration: none;
		min-width: 100%;
		padding: 0.875rem 0 0.875rem 4px;
		border-bottom: 1px solid var(--colFeature);
		/*border-right: 1px solid var(--colPale);*/
		display: block;
		box-sizing: border-box;
		transition: color 0.2s ease-out, background-color 0.2s ease-out, border 0.2s ease-out, padding 0.2s ease-out;
	}
	#cssmenu ul li:last-child::after {
		display: none;
	}

	#cssmenu ul li > a:hover,
	#cssmenu ul li > a:focus,
	#cssmenu ul li:hover > a {
		color: var(--colFeatureDark);
		background: var(--colFeaturePaleSolid);
		border-bottom: 1px solid var(--colFeatureLightish);
		/*border-right: 1px solid var(--colFeaturePale)*/
	}

	#cssmenu ul li.active a {
		color: var(--colBlack);
		background: var(--colFeaturePaleSolid);
		border-bottom: 1px solid var(--colFeature);
	}
	#cssmenu ul li.active > a:hover,
	#cssmenu ul li.active > a:focus,
	#cssmenu ul li.active:hover > a {
		color: var(--colFeatureDark);
		background: var(--colFeaturePaleSolid);
		border-bottom: 1px solid var(--colFeatureLightish);
	}
	#cssmenu ul ul {
		display: block;
		position: absolute;
		min-width: 100%;
		top: 45px;
		left: -9999px;
		/*transition-delay: 100ms;*/
	}

	#cssmenu li:hover > ul {
		left: 0;
	}

#cssmenu.align-right li:hover > ul, #cssmenu li.align-right:hover > ul {
	right: 0;
}

	#cssmenu ul ul ul {
		margin-left: 100%;
		top: 0;
		transition-delay: 200ms;
	}

#cssmenu.align-right ul ul ul {
	margin-left: 0;
	margin-right: 100%;
}
#cssmenu ul ul li::after {
	display: none;
}
#cssmenu ul ul li a {
	font-size: 1rem;
	text-align: left;
	padding: 1rem;
	white-space: nowrap;
	display: block;
	min-width: 100%;
	width: auto;
	background: var(--colFeaturePaleSolid);
	text-decoration: none;
	text-transform: none;
	color: var(--colDark) !important;
	border-right: 1px solid var(--colFeatureLight);
	font-weight: 400;
	border-bottom: 1px solid var(--colFeatureLightish) !important;
	box-sizing: border-box;
}
	/*#cssmenu ul ul li:last-child a {
		border-bottom: none !important;
	}*/
	#cssmenu ul ul li.has-sub a {
		background-image: url(../images/icons/arrow-right.svg);
		background-repeat: no-repeat;
		background-position: calc(100% - 1rem) 50%;
		background-size: 8px 12px;
	}

	#cssmenu ul ul li:hover > a, #cssmenu ul ul li a:hover {
		color: var(--colDark);
		background-color: var(--colFeatureLightSolid);
		border-bottom: 1px solid var(--colFeatureLight);
		padding-left: 1.25rem;
	}

#cssmenu ul ul ul li a {
	background: var(--colFeatureLightSolid) !important;
	color: var(--colDark) !important;
	border-bottom: 1px solid var(--colFeatureLight);
}

	#cssmenu ul ul ul li:hover > a, #cssmenu ul ul ul li a:hover {
		background: var(--colFeatureLightSolid) !important;
		color: var(--colBlack) !important;
		border-bottom: 1px solid var(--colFeatureLight);
	}

#cssmenu ul ul li.has-sub:hover > a::after {
	border-color: #ffffff;
}
@media only screen and (min-width: 881px) and (max-width: 959px) {
	#cssmenu ul ul {
		top: 43px;
	}
}
@media only screen and (max-width: 880px) {
	#cssmenu, #cssmenu ul, #cssmenu ul li, #cssmenu ul li a, #cssmenu #menu-button {
		margin: 0;
		padding: 0;
		border: 0;
		list-style: none;
		line-height: 1;
		position: relative;
		box-sizing: border-box;
	}

		#cssmenu:after, #cssmenu > ul:after {
			content: ".";
			display: block;
			clear: both;
			visibility: hidden;
			line-height: 0;
			height: 0;
		}

	#cssmenu {
		width: 100%;
		position: relative;
		margin-top: 0;
		top: 0;
		font-size: 1em;
	}

		#cssmenu ul {
			width: 100%;
			display: none;
			float: none !important;
			position: relative;
			margin-top: 0;
			margin-bottom: 1rem;
		}

			#cssmenu ul li, #cssmenu ul ul li {
				width: 100%;
				height: auto;
				float: none;
				display: block;
			}
				#cssmenu ul li::after {
					display: none
				}
		#cssmenu > ul > li > a {
			border: none;
			text-align: left;
			text-decoration: none;
			border-bottom: 1px solid var(--colLight);
		}
			#cssmenu > ul > li:last-child > a {
				border-bottom: none;
			}
		#cssmenu ul li a,
		#cssmenu ul ul li a {
			display: block;
			line-height: 22px;
			min-width: auto;
			width: 100%;
			padding: 0.75rem;
			/*background: #000;*/
		}

		#cssmenu ul ul li.has-sub a {
			background-image: none;
		}

		/*#cssmenu > ul > li:hover > a, #cssmenu > ul > li.active > a {
			background: #fff;
			color: #111;
			border-bottom: 1px solid #777;
		}*/

		#cssmenu > ul > li {
			float: none;
			display: block;
		}

		#cssmenu ul ul {
			display: none;
		}
		#cssmenu ul ul li a {
			text-decoration: none;
			border-right: none;
			border-bottom: 1px solid var(--colLight);
			margin-bottom: 0;
			border-radius: 0;
			-moz-border-radius: 0;
			-webkit-border-radius: 0;
			box-sizing: border-box;
		}

			/*#cssmenu ul ul li:last-child a {
				border-bottom: 1px solid var(--colLight) !important;
			}*/

		#cssmenu ul ul li:hover > a, #cssmenu ul ul li a:hover {
			color: #111;
			background: #f1f1f1;
		}

		#cssmenu ul ul ul li a {
			padding-left: 20px;
		}

		#cssmenu ul ul, #cssmenu ul ul ul {
			position: relative;
			top: 0;
			left: 0;
			right: auto;
			width: 100%;
			margin: 0;
			border-top: none;
		}

			#cssmenu ul ul ul li a {
				background: #fff;
				color: #333;
			}

				#cssmenu ul ul ul li:hover > a, #cssmenu ul ul ul li a:hover {
					background: #ddd;
					color: #222;
				}

			#cssmenu > ul > li.has-sub > a::after, #cssmenu ul ul li.has-sub > a::after {
				display: none;
			}

	#menu-line {
		display: none;
	}

	#cssmenu #menu-button {
		display: block !important;
		padding: 15px 0;
		color: #000;
		cursor: pointer;
		width: 24px;
		position: absolute;
		top: -7rem;
		right: 0;
	}

		#cssmenu #menu-button::after {
			content: '';
			position: absolute;
			top: 8px;
			right: 0;
			display: block;
			width: 24px;
			height: 3px;
			background: var(--colBlack);
			-webkit-transition: all 0.2s ease-out;
			-moz-transition: all 0.2s ease-out;
			-o-transition: all 0.2s ease-out;
			transition: all 0.2s ease-out;
		}

		#cssmenu #menu-button::before {
			content: '';
			position: absolute;
			top: 15px;
			right: 0;
			display: block;
			width: 24px;
			height: 4px;
			border-top: 3px solid var(--colBlack);
			border-bottom: 3px solid var(--colBlack);
			-webkit-transition: all 0.2s ease-out;
			-moz-transition: all 0.2s ease-out;
			-o-transition: all 0.2s ease-out;
			transition: all 0.2s ease-out;
		}

		#cssmenu #menu-button.menu-opened::after {
			top: 15px;
			right: 0;
			transform: rotate(225deg);
		}

		#cssmenu #menu-button.menu-opened::before {
			top: 15px;
			transform: rotate(-225deg);
			display: block;
			width: 24px;
			height: 3px;
			background: var(--colBlack);
			border: none;
		}

	#cssmenu .submenu-button {
		position: absolute;
		z-index: 10;
		right: 0;
		top: 0;
		display: block;
		border-left: 1px solid var(--colLight);
		height: 48px;
		width: 48px;
		cursor: pointer;
	}

		#cssmenu .submenu-button::after {
			content: '';
			position: absolute;
			top: 19px;
			left: 24px;
			display: block;
			width: 1px;
			height: 11px;
			background: #777;
			z-index: 99;
		}

		#cssmenu .submenu-button::before {
			content: '';
			position: absolute;
			left: 19px;
			top: 24px;
			display: block;
			width: 11px;
			height: 1px;
			background: #777;
			z-index: 99;
		}

		#cssmenu .submenu-button.submenu-opened:before {
			background: #777;
		}

		#cssmenu .submenu-button.submenu-opened:after {
			display: none;
		}
}
html {
	visibility: visible;
	opacity: 1;
}