/*
	jQuery.mmenu position extension CSS
*/

@import "../inc/variables";

// top
// bottom
.mm-menu.mm-top,
.mm-menu.mm-bottom
{
	width: 100%;
	min-width: 100%;
	max-width: 100%;
}

// right
.mm-menu.mm-right
{
	left: auto;
	right: 0;
}

// bottom
.mm-menu.mm-bottom
{
	top: auto;
	bottom: 0;
}

@include mm_sizing_right;



/*
	jQuery.mmenu z-position extension CSS
*/

// reset defaults
html.mm-front
{
	.mm-slideout
	{
		@include mm-webkit-prefix( 'transform', none !important );
		z-index: 0 !important;
	}
}

// styling
.mm-menu.mm-front
{
	z-index: 1;
	box-shadow: 0 0 15px rgba( 0, 0, 0, 0.5 );
}
html.mm-opened.mm-next .mm-page
{
	box-shadow: none;
}

// animations
.mm-menu
{
	&.mm-front,
	&.mm-next
	{
		-webkit-transition: -webkit-transform $mm_transitionDuration $mm_transitionFunction;
		-ms-transition: -ms-transform $mm_transitionDuration $mm_transitionFunction;
		transition: transform $mm_transitionDuration $mm_transitionFunction;

		@include mm-webkit-prefix( 'transform', translate( -100%, 0 ) );
		
		&.mm-right
		{
			@include mm-webkit-prefix( 'transform', translate( 100%, 0 ) );
		}
	}
	&.mm-front
	{
		&.mm-top
		{
			@include mm-webkit-prefix( 'transform', translate( 0, -100% ) );
		}
		&.mm-bottom
		{
			@include mm-webkit-prefix( 'transform', translate( 0, 100% ) );
		}
	}
}
html.mm-opening .mm-menu
{
	&.mm-front,
	&.mm-next
	{
		@include mm-webkit-prefix( 'transform', translate( 0, 0 ) );
	}
}

@include mm_sizing_zposition;