/* Flexnav Base Styles */
.flexnav {
	margin: 0 auto;
	max-height: 0;
	max-width: 40%;
	overflow: hidden;
	position: absolute;
	right: 0;
	top: 76px;
	transform-style: preserve-3d;
	transition: none 0s ease 0s ;
	width: 100%;
	background-color: rgba(255,255,255,1); }
@media all and (max-width: 568px) { 
    .flexnav { max-width: 100%; }
}
.flexnav.opacity {
    opacity: 0; }
.flexnav.flexnav-show {
	overflow: scroll;
	max-height: 2000px;
	opacity: 1;
	z-index:999;
	-webkit-transition: all .5s ease-in-out;
	-moz-transition: all .5s ease-in-out;
	-ms-transition: all .5s ease-in-out;
	transition: all .5s ease-in-out; }
.flexnav li {
    font-size: 100%;
    position: relative;
    overflow: hidden;
	display:block; }
.flexnav li a {
    position: relative;
    display: block;
    padding: .96em 50px .96em .96em;
    z-index: 2;
    overflow: hidden;
    color: #513422;
	text-transform:uppercase;
	font-weight:700;
	text-decoration:none;
    border-bottom: solid 1px #513422; }
.flexnav li ul {
    width: 100%; }
.flexnav li ul li {
	font-size: 100%;
	position: relative;
	overflow: hidden; }
.flexnav li ul.flexnav-show li {
    overflow: visible; }
.flexnav li ul li a {
	display: block;
	background-color:rgba(0, 0, 0, 1);
	padding-left:40px;
	text-transform:uppercase;
	font-size:12px; }
.flexnav ul li ul li a {
	background-color:rgba(255, 255, 255, 0.8); }
.flexnav ul li ul li ul li a {
	background-color:rgba(255, 255, 255, 0.8); }
.flexnav .touch-button {
    position: absolute;
    z-index: 999;
    top: 0;
    right: 0;
    width: 50px;
    height: 100%;
    display: inline-block;
    background: rgba(255, 255, 255, 0.2);
    text-align: center; }
.flexnav .touch-button:hover {
	cursor: pointer; }
.flexnav .touch-button .navicon {
	position: relative;
	top: 1.4em;
	font-size: 12px;
	color: #666; }
.menu-button {
	color: #fff;
	cursor: pointer;
	display: block;
	float: right;
	height: 40px;
	position: relative;
	width: 40px; }
.menu-button .touch-button {
    background: transparent;
    position: absolute;
    z-index: 999;
    top: 0;
    right: 0;
    width: 100%;
    height: 100%;
    display: inline-block;
}
.menu-button .touch-button::after,
.flexnav li .touch-button::after {
	color: #513422;
	font-family: "Font Awesome 5 Pro";
	font-size: 18px;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	width: 14px;
	top: 50%;
	transform: translateY(-50%); }
.menu-button .touch-button::after {
	content: "\f0c9"; }
.flexnav li .touch-button::after {
	content: "\f078";
	color: #666666;
	font-size:14px; }
.flexnav li .touch-button.active::after {
	top: 20px; }
@media all and (min-width: 1060px) {
	.flexnav { overflow: visible; display:none; }
	.flexnav.opacity { opacity: 1; }
	.flexnav li {
		position: relative;
		list-style: none;
		float: left;
		display: block;
		background-color: #a6a6a2;
		overflow: visible;
		width: 20%; }
	.flexnav li a {
		border-left: 1px solid #acaca1;
		border-bottom: none; }
	.flexnav li > ul {
		position: absolute;
		top: auto;
		left: 0; }
	.flexnav li > ul li {
		width: 100%; }
	.flexnav li ul li > ul {
		margin-left: 100%;
		top: 0; }
	.flexnav li ul li a {
		border-bottom: none; }
	.flexnav li ul.open {
		display: block;
		opacity: 1;
		visibility: visible;
		z-index: 1; }
	.flexnav li ul.open li {
		overflow: visible;
		max-height: 100px; }
	.flexnav li ul.open ul.open {
		margin-left: 100%;
		top: 0; }
	.menu-button {
		display: none; }
}