@media all and (min-width: 600px) {
	
	body { margin-top: 0; }	
	
	#header .buttonset {
		position: absolute;
		left: 20px;
		top: 1.5em;
	}
	
	#header h1 {
		font-size: 2em;
		line-height: 1em;
	}
	
	#main.login {
		max-width: 440px;
	}
	
	.off-canvas-navigation ul {
		margin: 0;
	}
	
	.off-canvas-navigation ul li {
		position: absolute;
		min-width: 1em;
		top: 12px;
		right: 20px;
	}
	
	.menu-button {
		display: none;
	}
	.sidebar-button {
		border: none;			
	}	
	.js #navigation {
		width: 30%;	
		margin-left: 0;
	}
	.js #main {
		width: 70%;
		float: left;
	}
	.js #sidebar {
		width: 30%;
	}				
	.active-sidebar #navigation {	
		margin-left: -100%;
	}
	.active-sidebar #main {
		margin-left: 0;
		width: 70%;
	}
	.active-sidebar #sidebar {	
		margin-right: -80%;
		width: 30%;
	}
	#main h1 {
		text-align: left;
	}				
}


@media all and (min-width: 1024px) {
	.page-title {text-align: center; font-size: 100px; margin-bottom: -.35em; padding: 0;}

	.off-canvas-navigation {
		display: none;
	}
	
	.js #navigation {
		width: 20%;	
		margin-left: 0;
		float: left;
	}

	.js #main {
		width: 60%;
	}

	.js #sidebar {
		width: 20%;	
		margin-right: 0;
		float: right;
	}	
	#main h1 {
		text-align: center;
	}				
}