@charset "UTF-8";

/*flex-container 10-col grid*/
	.grid{max-width:83em;margin:0 auto;padding:0;
		display:-webkit-flex;
		display:-ms-flexbox;
		display:flex;}
/*flex item*/
	.grid>*{overflow:hidden;border:0;margin:0;padding:0 1rem;}/*generic flex item*/
	.gridEdge{padding:0}/*allows content of flex item to go edge-to-edge*/
@media screen and (min-width:750px) {
	/*grid for reference - delete when finished*/
	.grid{background-image:url(10col.png);background-repeat:repeat-y;background-position:center center;background-size:100%;}

	/*set max-width to the size of your column span*/
	.grid>*,.grid1{max-width:10%;
		-webkit-flex:1 1 auto;
		    -ms-flex:1 1 auto;
		        flex:1 1 auto;}
	.grid2{max-width:20%;
		-webkit-flex:2 1 auto;
		    -ms-flex:2 1 auto;
		        flex:2 1 auto;}
	.grid3{max-width:30%;
		-webkit-flex:3 1 auto;
		    -ms-flex:3 1 auto;
		        flex:3 1 auto;}
	.grid4{max-width:40%;
		-webkit-flex:4 1 auto;
		    -ms-flex:4 1 auto;
		        flex:4 1 auto;}
	.grid5{max-width:50%;
		-webkit-flex:5 1 auto;
		    -ms-flex:5 1 auto;
		        flex:5 1 auto;}
	.grid6{max-width:60%;
		-webkit-flex:6 1 auto;
		    -ms-flex:6 1 auto;
		        flex:6 1 auto;}
	.grid7{max-width:70%;
		-webkit-flex:7 1 auto;
		    -ms-flex:7 1 auto;
		        flex:7 1 auto;}
	.grid8{max-width:80%;
		-webkit-flex:8 1 auto;
		    -ms-flex:8 1 auto;
		        flex:8 1 auto;}
	.grid9{max-width:90%;
		-webkit-flex:9 1 auto;
		    -ms-flex:9 1 auto;
		        flex:9 1 auto;}
	.grid10{max-width:100%;
		-webkit-flex:10 1 auto;
		    -ms-flex:10 1 auto;
		        flex:10 1 auto;}

	.gridLeft1{margin-left: 10%}
	.gridLeft2{margin-left: 20%}
	.gridLeft3{margin-left: 30%}
	.gridLeft4{margin-left: 40%}
	.gridLeft5{margin-left: 50%}
	.gridLeft6{margin-left: 60%}
	.gridLeft7{margin-left: 70%}
	.gridLeft8{margin-left: 80%}
	.gridLeft9{margin-left: 90%}

	.gridRight1{margin-right: 10%}
	.gridRight2{margin-right: 20%}
	.gridRight3{margin-right: 30%}
	.gridRight4{margin-right: 40%}
	.gridRight5{margin-right: 50%}
	.gridRight6{margin-right: 60%}
	.gridRight7{margin-right: 70%}
	.gridRight8{margin-right: 80%}
	.gridRight9{margin-right: 90%}

	.order{
		-ms-flex-order:-1;
		 -webkit-order:-1;
		         order:-1;}

}
	
@media screen and (max-width:749px) {
	.grid{
		-ms-flex-direction:column;
		 -webkit-flex-flow:column;
		    flex-direction:column;}
	.grid>*{height:auto;
		-webkit-flex:1 1 auto;
		    -ms-flex:1 1 auto;
		        flex:1 1 auto;}
	.order{
		-ms-flex-order:1;
		 -webkit-order:1;
		         order:1;}
}