#page {

	overflow: hidden;

	width: 100%;

	height: 100%;

}



#page {	

	-webkit-overflow-scrolling: touch;

}



/* Menu Button */

.menu-button {

	position: absolute;

	top: 0px;

	left: 15px;

	background: none;

	border: none;

	display: inline-block;

	z-index: 10;

	font-size: 18px;

	color: #111;

	line-height: 40px;

}



/* Close Button */

.close-button {
	width: 25px; height: 25px;
	position: absolute;
	top: 5px;
	right: 25px;
	border: medium none;
	background: transparent;
	font-size: 0px;}

.close-button::before,
.close-button::after {

	background: #fff none repeat scroll 0 0;

	content: "";

	height: 75%;

	left: 49%;

	position: absolute;

	top: 3px;

	width: 2px;

}



.close-button::before {

	-webkit-transform: rotate(45deg);

	transform: rotate(45deg);

}



.close-button::after {

	-webkit-transform: rotate(-45deg);

	transform: rotate(-45deg);

}



/* Menu */
#off-canvas-title {
	/*color: #fff;
	font-size: 15px;
	font-weight: 500;
	height: 50px;
	line-height: 50px;
	padding: 0 25px;
	position: absolute;
	right: 0;
	text-transform: uppercase;
	top: 0;*/

	color: #fff;
    font-size: 16px;
    font-weight: 700;
    height: 35px;
    line-height: 35px;
    padding: 0 15px;
    /* position: absolute; */
    right: 0;
    text-transform: uppercase;
    top: 0;
    width: 100%;}



#off-canvas-menu {
	float: none;
	display: block;}

#off-canvas-menu ul.nav > li {
	position: relative;
	border-bottom: 1px solid #eee;
	display: block;
	float: none;
	margin: 0;}

#off-canvas-menu ul.nav > li > a {
	background: rgba(0, 0, 0, 0) none repeat scroll 0 0;
	border-radius: 0;
	color: #000;
	font-size: 14px;
	font-weight: 400;
	line-height:22px;
	padding: 10px 15px;
	text-transform: uppercase;}

#off-canvas-menu ul.nav > li > a > em {

	color: #111;

	float: right;

	font-size: 16px;

	height: 42px;

	width:42px;

	line-height: 42px;

	position: absolute;

	text-align: center;

	top: 0;

	right: 0;

	border-left:1px solid #eee;

}

#off-canvas-menu li.open .dropdown-menu {

	position: static;

	float: none;

	width: auto;

	margin-top: 0;

	background-color: transparent;

	border: 0;

	box-shadow: none;

	padding: 0;

	border-top:1px solid #eee;

}



#off-canvas-menu ul.nav li {

	border-bottom:1px solid #eee;

}

#off-canvas-menu ul.nav li ul a {

	font-size: 14px;

	text-transform: capitalize;

	padding: 10px 15px;

	line-height: 22px;

	position: relative;

	background:#fffbfb;

}

#off-canvas-menu ul.nav li ul a>em {

	width: 20px;

	line-height: 20px;

	display:block;

	text-align: center;

	position: absolute;

	right: 0;

	top: calc(50% - 10px);

}

#off-canvas-menu .mod-content {

	display: none;

}



/* Shown menu */



.menu-wrap {

	position: fixed;

	z-index: 10000;

	width: 0;

	opacity: 0;

	visibility: hidden;

	background: #f9f9f9;

	top: 0;

	bottom: 0;

	overflow-y:scroll;

	box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.2);

	left: -300px;

	transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

	-webkit-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

	-moz-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

	-ms-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

    -o-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

}



.show-menu .menu-wrap {

	width: 270px;

	opacity: 1;

	visibility: visible;

	box-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);

	left: 0;

	transition: right 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

	-webkit-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

	-moz-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

	-ms-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

    -o-transition: left 0.4s cubic-bezier(0.7, 0, 0.3, 1) 0s;

}