.menu {
    display: block;
    margin: 20px 0px 0px 0px;
    padding: 0;
}
.menu>li {
	display: inline-block;
	position: relative;
	z-index: 100;
	vertical-align: top
}
.menu li:first-child {
	margin-left: 0
}
#mainmenu .menu>li:last-child {
	border: none
}
div.nav-item ul li a {
    color: #000;
    padding-top: 10px;
    padding-bottom: 10px;
}
.menu>li>a {
	padding: 13px 10px;
	display: block;
	color: #333;
	transition: all .2s ease-in-out 0s
}
.menu ul {
	visibility: hidden;
	opacity: 0;
		margin: 0;
	padding: 0;
	width: 220px;
	position: absolute;
	left: 0;
	background: #856d47;
	z-index: 99;
	transform: translate(0, 20px);
	transition: all .2s ease-out;
	box-shadow: 4px 4px 15px rgba(0, 0, 0, .2);
	top: calc(100% - 0px);
	font-size: 14px
}
.menu ul ul:after,
.menu ul:after {
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none
}
.menu ul:after {
	top: -24px;
    left: 30%;
    border: solid transparent;
    border-color: rgba(255, 255, 255, 0);
    border-top-color: #856d47;
    border-width: 12px;
    margin-left: -10px;
    transform: rotate(180deg);
}
.menu ul li {
	display: block;
	float: none;
	background: 0 0;
	margin: 0;
	padding: 0;
	text-align: left;
	border-bottom: 1px solid #ddd;
	text-transform: none;
	position: relative
}
.menu ul li:last-child {
	border: none
}
.menu ul li a {
	font-weight: 400;
	display: block;
	background: #856d47;
	padding: 7px 15px
}
.menu li:hover>ul {
	visibility: visible;
	opacity: 1;
	transform: translate(0, 0)
}
li.dropdown:hover>ul {
    display: block;
    opacity: 1;
    visibility: visible;
	transform: translate(0, 0)
}
.dropdown li a{
	padding: 12px 10px !important;
}
.menu ul ul {
	left: 100%;
	top: 0;
	visibility: hidden;
	opacity: 0;
	transform: translate(20px, 20px);
	transition: all .2s ease-out
}
.menu ul ul:after {
	display: none
}
.menu li>ul ul:hover {
	visibility: visible;
	opacity: 1;
	transform: translate(0, 0)
}

@media all and (min-width: 992px) {
	.sub-menu {
		font-size: 14px;
		column-count: 4;
		column-gap: 5px
	}
	.sub-menu li {
		-webkit-column-break-inside: avoid;
		page-break-inside: avoid;
		break-inside: avoid;
		position: relative
	}
	.sub-menu ul {
		background: 0 0;
		display: none;
		position: relative;
		opacity: 1!important;
		transform: translate(0, 0)!important;
		visibility: visible!important;
		width: 100%;
		box-shadow: none
	}
	.sub-menu .subopen {
		display: block;
		left: 0
	}
	.menu ul li a:hover,
	.menu ul li:hover>a {
		color: #fff
	}
	.fa-plus {
		position: absolute;
		right: 0;
		top: 0;
		padding: 9px;
		background: #ddd;
		width: 30px
	}
	.submenu_cols {
		width: 250px;
		display: none;
		border-left: 1px solid #eee;
		z-index: -1;
		position: absolute;
		left: 249px;
		top: 0;
		width: 20px;
		height: 100%;
		background: #fff;
		width: calc(100% - 250px);
		background-repeat: no-repeat;
		background-position: bottom right;
		overflow-y: auto
	}
	.submenu_cols:after {
		content: '';
		clear: both;
		display: block
	}
	.sub-menu .drop {
		width: 250px
	}
}
@media all and (min-width: 992px) {
	.menu li a:hover,
	.menu li:hover>a {
		color: #fff;
		background-color: #000
	}
	.menu ul li a:hover,
	.menu ul li:hover>a {
		background: #856d47;
		color: #fff
	}
}
@media all and (max-width: 991px) {
	.menu li,
	.navbtn {
		display: block
	}
	.menu>li>a {
		padding: 10px 13px
	}
	.menu li {
		border-bottom: 1px solid #ccc
	}
}