*
	{
	-webkit-box-sizing: border-box;
		 -moz-box-sizing: border-box;
			  box-sizing: border-box;
	}

html 
	{
	/*overflow:hidden;*/
	height:100%;
    color: #222;
    font-size: 100%; /*1em;*/ /* use percent here allow use of em or percent on elements to resize */
    line-height: 1.1;
	
	font-family: sans-serif;
	}
	
body 
	{
	height:100%;
	padding:0;
	margin:0;
	/*overflow-y:scroll;*/
	/*font: 16px/26px Helvetica, Helvetica Neue, Arial;*/
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-direction: column;
	-moz-flex-direction: column;
	-ms-flex-direction: column;
	flex-direction: column;
	}
	
header
	{
	background: orange;
	border-bottom: 10px solid white;
	padding: 10px;
	-webkit-flex: 0 0 100px;
	-moz-flex: 0 0 100px;
	-ms-flex: 0 0 100px;
	flex: 0 0 100px;
	}
	
section
	{
	/*background:#eee;*/
	-webkit-flex: 1 0 auto;
	-moz-flex: 1 0 auto;
	-ms-flex: 1 0 auto;
	flex: 1 0 auto;
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: flex;
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
	}
	
nav 
	{
	background: orange;
	border-right: 10px solid white;
	padding: 10px;
	-webkit-flex: 0 0 200px;
	-moz-flex: 0 0 200px;
	-ms-flex: 0 0 200px;
	flex: 0 0 200px;
	-webkit-order: 1;
	-ms-flex-order: 1;
	order: 1;
	}
	
article 
	{
	background: white;
	border: 10px solid orange;
	padding: 10px;

/* scroll body */
/*height:400px;
overflow-y:scroll;*/


	-webkit-flex: 1;
	-moz-flex: 1;
	-ms-flex: 1;
	flex: 1;
	-webkit-order: 2;
	-ms-flex-order: 2;
	order: 2;
	}
	
aside
	{
	background: orange;
	border-left: 10px solid white;
	padding: 10px;
	-webkit-flex: 0 0 200px;
	-moz-flex: 0 0 200px;
	-ms-flex: 0 0 200px;
	flex: 0 0 200px;
	-webkit-order: 3;
	-ms-flex-order: 3;
	order: 3;
	}
	
footer
	{
	background: orange;
	border-top: 10px solid white;
	padding: 10px;
	-webkit-flex: 0 0 100px;
	-moz-flex: 0 0 100px;
	-ms-flex: 0 0 100px;
	flex: 0 0 100px;
	}
	
@media all and (max-width: 959px)
	{
	section
		{
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
		}
		
	nav 
		{
		border: none;
		-webkit-flex: 0 0 200px;
		-moz-flex: 0 0 200px;
		-ms-flex: 0 0 200px;
		flex: 0 0 200px;
		}
		
	aside
		{
		border: none;
		-webkit-flex: 0 0 150px;
		-moz-flex: 0 0 150px;
		-ms-flex: 0 0 150px;
		flex: 0 0 150px;
		}

	}