/*
	jQuery.mmenu widescreen extension CSS
	
	To use on widescreens only, include it using a mediaquery:
	<link type="text/css" href="mmenu-widescreen.css" media="all and (min-width: 900px)"/>
*/

@import "../inc/variables";

$mm_ws_menuWidth: 0.3 !default;


// Positioning and sizing
html,
body,
html.mm-opened,
html.mm-opened body
{
	overflow: auto;
}
body
{
	padding-left: percentage( $mm_ws_menuWidth ) !important;
	position: relative;
}
#mm-blocker
{
	display: none !important;
}
.mm-page
{
	box-shadow: none !important;
	background: inherit;
	
	box-sizing: border-box;
	min-height: 100vh;
	height: auto !important;
	margin: 0 !important;
	position: relative !important;
	top: 0 !important;
	z-index: 1;
}
.mm-slideout
{
	@include mm-webkit-prefix( 'transform', none !important );
}
.mm-menu
{
	width: percentage( $mm_ws_menuWidth ) !important;
	min-width: none !important;
	max-width: none !important;

	z-index: 0;
	top: 0 !important;
	right: auto !important;
	bottom: auto !important;
	left: 0 !important;

	&:first-child,
	&.mm-current
	{
		display: block;
	}
}