/*
	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";


// positioning and sizing
html, body
{
	height: 100% !important;
	overflow: auto !important;
}
body
{
	position: relative;
}
#mm-blocker
{
	display: none !important;
}
.mm-page
{
	box-shadow: none !important;
	background: inherit;
	width: 70% !important;
	min-height: 100% !important;
	height: auto !important;
	margin: 0 !important;
	left: 30% !important;
	top: 0 !important;
	position: relative !important;
	z-index: 1;

	@include vendor-prefix( "box-sizing", border-box );
}
.mm-menu
{
	position: fixed;
	z-index: 0;
	width: 30% !important;
	padding: 0;
	
	&.mm-top,
	&.mm-right,
	&.mm-bottom
	{
		top: 0 !important;
		right: auto !important;
		bottom: auto !important;
		left: 0 !important;
	}
	
	&:first-child,
	&.mm-current
	{
		display: block;
	}
}