/* @import url(http://fonts.googleapis.com/css?family=Montserrat:400,700); */

#cssmenu{
	display: none;
}

@media all and (max-width: 500px),
only screen and (-webkit-min-device-pixel-ratio: 2) and (max-width: 500px),
only screen and (min--moz-device-pixel-ratio: 2) and (max-width: 500px),
only screen and (-o-min-device-pixel-ratio: 2/1) and (max-width: 500px),
only screen and (min-device-pixel-ratio: 2) and (max-width: 500px),
only screen and (min-resolution: 192dpi) and (max-width: 500px),
only screen and (min-resolution: 2dppx) and (max-width: 500px) {

/* Menu */

:root{
	--menu-color-primary: #e4dcd0;
	--menu-color-active: #977f68;
	--menu-color-overlay: #0004;
	--menu-btn-color: var(--menu-color-primary);
    --menu-header-size: 66px;
    --menu-btn-inset: 13px;
	--menu-btn-line-thickness: 2px;
}

#cssmenu,
#cssmenu ul,
#cssmenu ul li,
#cssmenu ul li a,
#cssmenu #menu-button {
	margin: 0;
	padding: 0;
	border: 0;
	list-style: none;
	line-height: 1;
	display: block;
	position: relative;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
#cssmenu{
	position: fixed;
    z-index: 9999999;
	width: auto;
	height: auto;
	min-height: var(--menu-header-size);
	top: 0;
	right: 0;
	bottom: auto;
	left: 0;
/* 	font-family: Montserrat, sans-serif; */
    font-family: "iskra",sans-serif;
    font-size: 20px;
    color: #e4dcd0;
	background: #31190c;
    background-image: url('../images/woodgrain-horizontal.jpg');
    background-position: top left;
    background-repeat: no-repeat;
    background-size: 100% auto;
	margin: 0 auto;
	text-align: left;
    box-shadow: inset 1000px 0px 0px 0px var(--menu-color-overlay), 0px 0px 15px 7px rgba(0, 0, 0, 0.7);
}
/* 
#cssmenu:after,
#cssmenu > ul:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
*/
#cssmenu > ul{
	position:relative;
	margin: var(--menu-header-size) auto 0 auto;
	background: var(--menu-color-primary);
	width: 100%;
	display: none;
	z-index: 100;
}
#cssmenu > ul li{
	display: inline-block;
    box-shadow: inset 0px -1px 0px 0px var(--menu-color-overlay);
	width: 100%;
}
#cssmenu > ul li a {
	margin-top: 0px;
	padding: 1em;
	text-decoration: none;
	color: #000000;
	font-weight: 700;
    text-transform: capitalize;
	width: 100%;
	transition: 0s;
}
/*
#cssmenu > ul li a:hover,
#cssmenu > ul li a:focus,
#cssmenu > ul li a:active {}
*/
#cssmenu > ul.open:after{
    content: '';
    position: fixed;
    z-index: -1;
    top: var(--menu-header-size);
/*     bottom: 0; */
	height: 110vh;
    right: 0;
    left: 0;
	background: var(--menu-color-primary);
}
#cssmenu #menu-button {
/* 	--menu-btn-color: var(--menu-color-active); */
    display: block;
    position: absolute;
    right: var(--menu-btn-inset);
    top: var(--menu-btn-inset);
    height: calc(var(--menu-header-size) - (var(--menu-btn-inset) * 2));
    width: calc(var(--menu-header-size) - (var(--menu-btn-inset) * 2));
    border: var(--menu-btn-line-thickness) solid var(--menu-btn-color);
    border-radius: 15%;
    color: var(--menu-btn-color);
    cursor: pointer;
    font-size: 12px;
    text-transform: uppercase;
    font-weight: 700;
}
#cssmenu #menu-button:before,
#cssmenu #menu-button:after{
    content: '';
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 24px;
}
#cssmenu #menu-button:before {
    height: var(--menu-btn-line-thickness);
    background: var(--menu-btn-color);
}
#cssmenu #menu-button:after {
    height: 16px;
    border-top: var(--menu-btn-line-thickness) solid var(--menu-btn-color);
    border-bottom: var(--menu-btn-line-thickness) solid var(--menu-btn-color);
}
#cssmenu #menu-button.menu-opened{
	--menu-btn-color: var(--menu-color-active);
}
#cssmenu #menu-button.menu-opened:before,
#cssmenu #menu-button.menu-opened:after{
    width: 19px;
    background: var(--menu-btn-color);
}
#cssmenu #menu-button.menu-opened:before {
    -webkit-transform: translate(-50%, -50%) rotate(-45deg);
    transform: translate(-50%, -50%) rotate(-45deg);
}
#cssmenu #menu-button.menu-opened:after {
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    border: 0;
    height: var(--menu-btn-line-thickness);
}

/* Overwrite main styles */
#sidebarwrapper, #sidebarfix{
	box-shadow: none;
    position: fixed;
    z-index: 10000000;
    top: 0;
    left: 0;
    width: auto;
    min-width: 0;
}
#menuarea{
    background: none !important;
    padding: 0;
}
#logo{
    margin: 0 auto;
    padding: 0;
    max-width: 100%;
    text-align: left;
}
#logo a{
	display: inline-block;
}
#logo img {
    width: auto;
    max-width: 100%;
    max-height: var(--menu-header-size);
    padding: 2px 5px;
    vertical-align: middle;
}
#content{
	margin-top: var(--menu-header-size);
}

}