/* nav.css — self-hosted dropdown + mobile nav (replaces Weebly's site-wide menu framework) */

#navigation { position: relative; max-width: 1100px; margin: 0 auto; padding: 0 20px; }

#nav-toggle {
	display: none;
	background: none; border: 1px solid #d0d0d0; border-radius: 3px;
	font-size: 22px; line-height: 1; padding: 6px 12px; cursor: pointer;
	color: #484848;
}

.wsite-menu-default {
	list-style: none; margin: 0; padding: 0;
	display: flex; flex-wrap: wrap; justify-content: center;
}
.wsite-menu-item-wrap { position: relative; }
.wsite-menu-item-wrap > a.wsite-menu-item {
	display: block; padding: 10px 14px; font-family: 'Raleway', sans-serif;
	font-size: 13px; letter-spacing: .04em; text-transform: uppercase;
}
.wsite-menu-item-wrap:hover, .wsite-menu-item-wrap.wsite-nav-current {
	background-color: #f6f6f6;
}

.submenu-toggle { display: none; }

.wsite-menu-wrap {
	display: none;
	position: absolute; top: 100%; left: 0; z-index: 60;
	min-width: 240px; max-width: 320px;
	background: #fff; border: 1px solid #e2ded3; border-radius: 0 0 4px 4px;
	box-shadow: 0 8px 20px rgba(0,0,0,0.08);
	padding: 4px 0;
}
.wsite-menu-item-wrap:hover > .wsite-menu-wrap,
.wsite-menu-item-wrap.nav-open > .wsite-menu-wrap {
	display: block;
}
.wsite-menu { list-style: none; margin: 0; padding: 0; }
.wsite-menu-subitem-wrap { position: relative; }
.wsite-menu-subitem-wrap > a.wsite-menu-subitem {
	display: block; padding: 9px 16px; font-family: 'Open Sans', sans-serif;
	font-size: 13.5px; color: #484848; line-height: 1.35;
}
.wsite-menu-subitem-wrap:hover { background-color: #f6f6f6; }
.wsite-menu-subitem-wrap .wsite-menu-wrap { top: 0; left: 100%; }

@media screen and (max-width: 800px) {
	#nav-toggle { display: inline-block; margin: 10px 20px; }
	#navigation { padding: 0; }
	.wsite-menu-default {
		display: none; flex-direction: column; text-align: left;
		border-top: 1px solid #e2ded3;
	}
	.wsite-menu-default.nav-open { display: flex; }
	.wsite-menu-item-wrap { width: 100%; border-bottom: 1px solid #eee; }
	.wsite-menu-item-wrap > a.wsite-menu-item { padding: 14px 20px; }
	.submenu-toggle {
		display: block; position: absolute; right: 0; top: 0;
		width: 46px; height: 46px; border: none; background: none;
		font-size: 16px; cursor: pointer; color: #484848;
	}
	.wsite-menu-wrap {
		display: none; position: static; box-shadow: none; border: none;
		border-radius: 0; background: #fafafa; min-width: 0; max-width: none;
	}
	.wsite-menu-item-wrap.nav-open > .wsite-menu-wrap { display: block; }
	.wsite-menu-subitem-wrap .wsite-menu-wrap { padding-left: 12px; }
	.wsite-menu-subitem-wrap > a.wsite-menu-subitem { padding: 10px 24px; }
}
