@media all and (max-width: 980px) {

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

	#et_mobile_nav_menu {
		display: none !important;
	}
	
	#top-menu-nav, #top-menu {
		display: block !important;
	}

.container.et_menu_container {
	width: 85% !important;
}

.logo_container {
	width: 75% !important;
	float:right;
	position: inherit !important;
	padding: 12px 0 !important;
}

.logo_container img {
	float: right !important;
}

span.logo_helper {
	display: none !important;
}

.burger {
	float: left;
	padding: 10px 10px 10px 0;
	height: 33px;
	margin-top: 16px;
	display: inline-block;
}
.burger li {
	width: 30px;
	height: 3px;
	background-color: #111;
	border-radius: 3px;
	margin: 6px 0;
}

.burger.open li {
	position: absolute;
	width: 40px;
	bottom: -25%;
}

.topbun, .bottombun {
	transition: width 0.2, transform 0.2s;
	-webkit-transition: width 0.2s, transform 0.2s;
	-moz-transition: width 0.2s, transform 0.2s;
	-o-transition: width 0.2s, transform 0.2s;
}

.patty {
	transition: opacity 0.2s, margin 0.2s;
	-webkit-transition: opacity 0.2s, margin 0.2s;
	-moz-transition: opacity 0.2s, margin 0.2s;
	-o-transition: opacity 0.2s, margin 0.2s;
}

.burger.open .topbun {
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
}

.burger.open .patty {
	margin-left: 4px;
	opacity: 0;
}

.burger.open .bottombun {
	transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
}
 
#main-header #et-top-navigation {
	position: fixed !important;
	left: 0;
	top: 0;
	width: 300px !important;
	padding: 0 !important;
	background-color: #2a2c31;
	overflow-y: scroll;
	-webkit-box-shadow: inset -1px 0px 3px 0px rgba(0, 0, 0, 0.5);
	-moz-box-shadow: inset -1px 0px 3px 0px rgba(0, 0, 0, 0.5);
	box-shadow: inset -1px 0px 3px 0px rgba(0, 0, 0, 0.5);
	height: 100% !important;
}

#main-header #et-top-navigation #top-menu {
	width: 100% !important;
}

#main-header #et-top-navigation #top-menu li {
	position: relative;
	display: block;
	text-align: left;
	line-height: 1em;
	padding-right: 0;
	border-bottom: 1px solid rgba(0,0,0,0.3);
}

#main-header #et-top-navigation #top-menu li a {
	color: #fff;
}

#main-header #et-top-navigation #top-menu > li > a, .et_header_style_centered #top-menu > li > a {
	padding: 2em 20px !important;
}

.show-sub-menu > .sub-menu {
	display: block !important;
}

#main-header #et-top-navigation #top-menu li li {
	position: relative;
	line-height: 2em;
	/*-webkit-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.25) !important;
	-moz-box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.25) !important;
	box-shadow: 0px -1px 0px 0px rgba(0, 0, 0, 0.25) !important;*/
	border-top: 1px solid rgba(0,0,0,0.4);
	border-bottom: none;
}

#top-menu-nav li ul {
	text-align: left;
	z-index: 9999;
	border: none;
	background: #25272b;
	position: inherit;
	width: auto ;
	display: none;
	padding: 0;
	box-shadow: inset -1px 0px 3px 0px rgba(0, 0, 0, 0.5);
	-webkit-box-shadow: inset -1px 0px 3px 0px rgba(0, 0, 0, 0.5);
}

#top-menu li li a {
	padding: 12px 20px !important;
	font-size: 14px;
}

#top-menu .menu-item-has-children > a:first-child::after {
	/*top: auto !important;
	right: 20px !important;*/
	display: none;
}

.mobile-dropdown-toggle {
	font-family: "ETmodules";
	font-size: 20px;
	position: absolute;
	top: 0;
	right: 0;
	height: 100%;
	font-weight: 800;
	color: #fff;
	padding: 25px;
	line-height: 1em;
	border-left: 1px solid rgba(0,0,0,0.4);
	cursor: pointer;
	
	/*Block Text Selection */
	-webkit-user-select: none;  /* Chrome all / Safari all */
	-moz-user-select: none;     /* Firefox all */
	-ms-user-select: none;      /* IE 10+ */
	user-select: none;  
	
	/* Remove Blue Tap bg */
	-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.scrollblocker {
	height: 100%;
	width: 100%;
	overflow: hidden;
}

/* NAVIGATION ANNIMATION */
#et-top-navigation {
	
	/* starting point */

	-webkit-transform: translate3d(-300px,0,0);
	-moz-transform: translate3d(-300px,0,0);
	transform: translate3d(-300px,0,0);

}

/*Nav Expanding Open Effect*/
#et-top-navigation.open {
	-webkit-animation: slideIn .35s ease-in-out;
	-moz-animation: slideIn .35s ease-in-out;
	animation: slideIn .35s ease-in-out;
	
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes slideIn {
	0%       {
				-webkit-transform: translate3d(-300px,0,0);}
	100%  {
				-webkit-transform: translate3d(0,0,0);}
}
@-moz-keyframes slideIn {
	0%      {
				-moz-transform: translate3d(-300px,0,0);}
	100%  {
				-moz-transform: translate3d(0,0,0);}
}
@keyframes slideIn {
	0%      {
				transform: translate3d(-300px,0,0);}
	100%  {
				transform: translate3d(0,0,0);}
}

/*Nav Shrinking Closed Effect*/
#et-top-navigation.close {
	-webkit-animation: slideOut .3s ease-in-out;
	-moz-animation: slideOut .3s ease-in-out;
	animation: slideOut .3s ease-in-out;
	
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes slideOut {
	0%      {
				-webkit-transform: translate3d(0,0,0);}
	100%  {
				-webkit-transform: translate3d(-300px,0,0);}
}
@-moz-keyframes slideOut {
	0%      {
				-moz-transform: translate3d(0,0,0);}
	100%  {
				-moz-transform: translate3d(-300px,0,0);}
}
@keyframes slideOut {
	0%      {
				transform: translate3d(0,0,0);}
	100%  {
				transform: translate3d(-300px,0,0);}
}



/* CONTENT ANNIMATION */
.logo_container,
#navToggle,
#et-main-area {
	/* starting point */
	-webkit-transform: translate3d(0,0,0);
	-moz-transform: translate3d(0,0,0);
	transform: translate3d(0,0,0);
	z-index: 1;
}

/*Content Sliding Open Effect*/
/*header.open*/
.logo_container.open, #navToggle.open, #et-main-area.open {   
	-webkit-animation: open .35s ease-in-out;
	-moz-animation: open .35s ease-in-out;
	animation: open .35s ease-in-out;
	
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes open {
	0%      {-webkit-transform: translate3d(0,0,0);}
	100%  {-webkit-transform: translate3d(300px,0,0);}
}
@-moz-keyframes open {
	0%      {-moz-transform: translate3d(0,0,0);}
	100%  {-moz-transform: translate3d(300px,0,0);}
}
@keyframes open {
	0%      {transform: translate3d(0,0,0);}
	100%  {transform: translate3d(300px,0,0);}
}

/*Content Sliding Closed Effect*/
/*header.close,*/
.logo_container.close, #navToggle.close, #et-main-area.close {
	-webkit-animation: close .3s ease-in-out;
	-moz-animation: close .3s ease-in-out;
	animation: close .3s ease-in-out;
	
	-webkit-animation-fill-mode: forwards;
	animation-fill-mode: forwards;
}
@-webkit-keyframes close {
	0%      {-webkit-transform: translate3d(300px,0,0);}
	100%  {-webkit-transform: translate3d(0,0,0);}
}
@-moz-keyframes close {
	0%       {-moz-transform: translate3d(300px,0,0);}
	100%  {-moz-transform: translate3d(0,0,0);}
}
@keyframes close {
	0%       {transform: translate3d(300px,0,0);}
	100%  {transform: translate3d(0,0,0);}
}

}