/*<meta />*/

@media only screen and (max-width: 1px)
{
	/* Off canvas layout CSS/JS provided by or adapted from work by Jason Weaver and Luke Wroblewski Requires globals.css grid.css */

	body.off-canvas
	{
		padding: 0;
		margin: 0;
	}

	.container
	{
		width: 100%;
	}

	.row
	{
		overflow: hidden;
	}

	.row .row
	{
		overflow: visible;
	}

	.paneled .container
	{
		overflow: hidden;
	}

	.paneled .row
	{
		width: 100%;
	}

	:before[role="main"]
	{
		/*content: " ";*/
		position: absolute;
		z-index: -1;
		top: 0;
		left: -100%;
		width: 100%;
		height: 100%;
	}

	.right-layout :before[role="main"]
	{
		/*content: " ";*/
		position: absolute;
		z-index: -1;
		top: 0;
		left: 100%;
		width: 100%;
		height: 100%;
	}

	[role="complementary"],
	[role="main"]
	{
		width: 100%;
		padding: 0 15px;
		display: block;
		position: relative;
		-webkit-transition: 0.25s all ease-in;
		-moz-transition: 0.25s all ease-in;
		-o-transition: 0.25s all ease-in;
		transition: 0.25s all ease-in;
	}

	.paneled [role="main"]
	{
		padding: 0;
	}

	.page-panel
	{
		width: 100%;
		padding: 0 15px;
		-webkit-transition: 0.3s margin ease-in-out;
		-moz-transition: 0.3s margin ease-in-out;
		-o-transition: 0.3s margin ease-in-out;
		transition: 0.3s margin ease-in-out;
		background: #fff;
	}

	#switchPanels
	{
		margin: 0 -15px;
	}

	.hide-extras [role="complementary"]
	{
		display: block;
	}

	#topMenu[role="navigation"]
	{
		-webkit-transition: 0.25s all ease-in;
		-moz-transition: 0.25s all ease-in;
		-o-transition: 0.25s all ease-in;
		transition: 0.25s all ease-in;
	}

	#topMenu[role="navigation"] ul
	{
		margin-top: 0;
	}

	[role="complementary"]
	{
		margin-left: -100%;
		width: 80%;
		float: left;
		z-index: 2;
	}

	[role="main"]
	{
		margin-left: 0;
		float: right;
		position: relative;
	}

	.paneled [role="main"]
	{
		background: #fff;
		width: 500%;
		overflow: hidden;
		float: none;
		position: relative;
		left: 0;
		-webkit-transition: 0.15s all ease-in;
		-moz-transition: 0.15s all ease-in;
		-o-transition: 0.15s all ease-in;
		transition: 0.15s all ease-in;
	}

	.page-panel
	{
		min-height: 400px;
		float: left;
		margin: 0;
		width: 20%;
	}

	.active [role="complementary"]
	{
		margin-left: 0;
	}

	.active [role="main"]
	{
		margin-right: -80%;
	}

	.right-layout .active [role="main"]
	{
		margin-right: 80%;
	}

	.active-menu #topMenu[role="navigation"]
	{
		margin-top: 0 !important;
	}

	menu-button,
	.sidebar-button
	{
		display: none;
	}

	[role="complementary"]
	{
		width: 20%;
		margin-left: -100%;
		float: left;
		padding: 0 15px;
	}

	.right-layout [role="complementary"]
	{
		width: 20%;
		margin-left: 200%;
		float: left;
		padding: 0 15px;
	}

	[role="main"]
	{
		width: 80%;
		padding: 0 15px;
	}

	.paneled [role="main"]
	{
		width: 100%;
		padding: 0;
		background: #f4f4f4;
		left: 0 !important;
	}

	.page-panel
	{
		display: block;
		min-height: 800px;
		float: none;
		margin: 0;
		width: 100%;
		background: #f4f4f4;
	}

	.hide-extras [role="main"]
	{
		width: 80%;
	}

	.hide-extras [role="complementary"]
	{
		display: none;
	}

	#topMenu[role="navigation"]
	{
		display: none;
	}
}