/* Your rules to style the menu in mobile view (collapsible mode) here... */

@media (min-width: 768px) {
	/* Switch to desktop layout
	-----------------------------------------------
	   These transform the menu tree from
	   collapsible to desktop (navbar + dropdowns)
	-----------------------------------------------*/
	/* start... (it's not recommended editing these rules) */
	.sm-mytheme ul {
		position: absolute;
		width: 12em;
	}
	.sm-mytheme li {
		float: left;
	}
	.sm-mytheme.sm-rtl li {
		float: right;
	}
	.sm-mytheme ul li,
	.sm-mytheme.sm-rtl ul li,
	.sm-mytheme.sm-vertical li {
		float: none;
	}
	.sm-mytheme a {
		white-space: nowrap;
	}
	.sm-mytheme ul a,
	.sm-mytheme.sm-vertical a {
		white-space: normal;
	}
	.sm-mytheme .sm-nowrap> li> a,
	.sm-mytheme .sm-nowrap> li>:not(ul) a {
		white-space: nowrap;
	}
	/* ...end */
	/* Your rules to style the menu in desktop view here... */
}

.main-menu-btn {
	position: relative;
	display: inline-block;
	width: 28px;
	height: 28px;
	text-indent: 28px;
	white-space: nowrap;
	overflow: hidden;
	cursor: pointer;
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}


/* hamburger icon */

.main-menu-btn-icon,
.main-menu-btn-icon:before,
.main-menu-btn-icon:after {
	position: absolute;
	top: 50%;
	left: 2px;
	height: 2px;
	width: 24px;
	background: #bbb;
	-webkit-transition: all 0.25s;
	transition: all 0.25s;
}

.main-menu-btn-icon:before {
	content: '';
	top: -7px;
	left: 0;
}

.main-menu-btn-icon:after {
	content: '';
	top: 7px;
	left: 0;
}


/* x icon */

#main-menu-state:checked~ .main-menu-btn .main-menu-btn-icon {
	height: 0;
	background: transparent;
}

#main-menu-state:checked~ .main-menu-btn .main-menu-btn-icon:before {
	top: 0;
	-webkit-transform: rotate(-45deg);
	transform: rotate(-45deg);
}

#main-menu-state:checked~ .main-menu-btn .main-menu-btn-icon:after {
	top: 0;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}


/* hide menu state checkbox (keep it visible to screen readers) */

#main-menu-state {
	position: absolute;
	width: 1px;
	height: 1px;
	margin: -1px;
	border: 0;
	padding: 0;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}


/* hide the menu in mobile view */

#main-menu-state:not(:checked)~ #main-menu {
	display: none;
}

#main-menu-state:checked~ #main-menu {
	display: block;
}

@media (min-width: 768px) {
	/* hide the button in desktop view */
	.main-menu-btn {
		position: absolute;
		top: -99999px;
	}
	/* always show the menu in desktop view */
	#main-menu-state:not(:checked)~ #main-menu {
		display: block;
	}
	}
}


/*
	ADD-ONS
*/
.sm:after {
	display: none !important;
}

#main-menu {
	/*position: fixed;*/
	z-index: 500;
	border-bottom: 4px solid #bfac02;
	text-transform: uppercase;
	/*background-color: #423c38;*/
	padding: 0px 3px 0 24px;
}

.menu-item {
	color: white;
	/*background: white;*/
	padding: 0.5em 16.99px;
}

.menu-item-sub {
	color: white!important;
	background: #bfac02;
	padding: 0.5em 1.5em;
}

.menu-item,
.menu-item-sub {
	font-size: 11px;
}

.menu-item-sub:hover,
.highlighted {
	background: #AD9C03!important;
	color: white!important;
}

.menu-item:hover,
.highlighted,
.menu-item:hover.highlighted {
	background: #bfac02!important;
	color: white!important;
}

.menu-item-sub.has-submenu:after {
	content: "\f0d7 ";
	display: inline-block;
	font: normal normal normal 14px/1 FontAwesome;
	font-size: inherit;
	text-rendering: auto;
	-webkit-font-smoothing: antialiased;
}

.content-container {
	/*padding-top: 113px;*/
	/*padding-top: 185px;*/
/*<<<<<<< HEAD*/
	/*padding-top: 170px;*/
	/*padding-top: 123px;*/
/*=======*/
	padding-top: 170px;
/*>>>>>>> new_website*/
}

@media (max-width: 997px) {
	.menu-item {
		padding: 5px 13px!important;
	}
	.content-container {
		/*padding-top: 155px!important;*/
		padding: 155px 10px 0 10px!important;
	}
}

@media (max-width: 930px) {
	.menu-item {
		padding: 5px 11px!important;
	}

}

@media (max-width: 890px) {
	.menu-item {
		padding: 5px 8px!important;
	}
}

@media (max-width: 860px) {
	.menu-item {
		padding: 5px 5px!important;
	}
}

@media (max-width: 781px) {
	.menu-item {
	.menu-item {
		padding: 5px 5px!important;
	}
}

@media (max-width: 767px) {
	.content-container {
		padding-top: 125px!important;
	}
}

@media (max-width: 736px) {

	.menu-item {
		font-size: 14px!important;
	}
	#main-menu {
		position: inherit;
	}
}