@media only screen {
 	/*body{
 		border-top:10px solid  yellow  !important;
 	}*/

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

	  .grid-1,
	 .grid-10,
	 .grid-11,
	 .grid-12,
	 .grid-2,
	 .grid-3,
	 .grid-4,
	 .grid-5,
	 .grid-6,
	 .grid-7,
	 .grid-8,
	 .grid-9,
	 .grid-all,
	 .grid-half,
	 .grid-quarter,
	 .grid-third,
	 .grid-three-quarters,
	 .grid-two-thirds,
	 .grid-fifth,
	 .grid-whole {
		 margin: 0;
		 clear: none;
		 float: left;
		 -moz-box-sizing: border-box;
		 -webkit-box-sizing: border-box;
		 box-sizing: border-box;
	 }
	 .offset-0 {
		 margin-left: 0
	 }
	 .grid-1 {
		 width: 8.33333%
	 }
	 .offset-1 {
		 margin-left: 8.33333%
	 }
	 .grid-2 {
		 width: 16.66667%
	 }
	 .offset-2 {
		 margin-left: 16.66667%
	 }
	 .grid-fifth {
		 width: 20%;
	 }
	 .grid-3,
	 .grid-quarter {
		 width: 25%
	 }
	 .offset-3 {
		 margin-left: 25%
	 }
	 .grid-4,
	 .grid-third {
		 width: 33.33333%
	 }
	 .offset-4 {
		 margin-left: 33.33333%
	 }
	 .grid-5 {
		 width: 41.66667%
	 }
	 .offset-5 {
		 margin-left: 41.66667%
	 }
	 .grid-6,
	 .grid-half {
		 width: 50%
	 }
	 .offset-6 {
		 margin-left: 50%
	 }
	 .grid-7 {
		 width: 58.33333%
	 }
	 .offset-7 {
		 margin-left: 58.33333%
	 }
	 .grid-8,
	 .grid-two-thirds {
		 width: 66.66667%
	 }
	 .offset-8 {
		 margin-left: 66.66667%
	 }
	 .grid-9,
	 .grid-three-quarters {
		 width: 75%
	 }
	 .offset-9 {
		 margin-left: 75%
	 }
	 .grid-10 {
		 width: 83.33333%
	 }
	 .offset-10 {
		 margin-left: 83.33333%
	 }
	 .grid-11 {
		 width: 91.66667%
	 }
	 .offset-11 {
		 margin-left: 91.66667%
	 }
	 .grid-12,
	 .grid-whole {
		 width: 100%
	 }
	 .offset-12 {
		 margin-left: 100%
	 }
	 .padded {
		 padding: .5em
	 }
	 .padded-left {
		 padding-left: .5em
	 }
	 .padded-right {
		 padding-right: .5em
	 }
	 .padded-top {
		 padding-top: .5em
	 }
	 .padded-bottom {
		 padding-bottom: .5em
	 }
	 .padded-sides {
		 padding: 0 .5em
	 }
	 .padded-vertical {
		 padding: .5em 0
	 }
	 .padded-inner {
		 padding: 1em
	 }
	 .padded-inner-sides {
		 padding: 0 1em
	 }
	 .padded-reverse {
		 margin: 0 -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none;
	 }
	 .padded-reverse-all {
		 margin: -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none;
	 }
	 .flow-opposite {
		 float: right;
	 }
	 .center {
		 text-align: center;
	 }
	 .left {
		 text-align: left;
	 }
	 .right {
		 text-align: right;
	 }
	 .row {
		 margin: 0 -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none;
	 }
}

 @media only screen and  (max-width: 48em) {
 	/*body{
 		border-top:10px solid  cyan  !important;
 	}*/
	 .s-grid-1,
	 .s-grid-10,
	 .s-grid-11,
	 .s-grid-12,
	 .s-grid-2,
	 .s-grid-3,
	 .s-grid-4,
	 .s-grid-5,
	 .s-grid-6,
	 .s-grid-7,
	 .s-grid-8,
	 .s-grid-9,
	 .s-grid-all,
	 .s-grid-half,
	 .s-grid-quarter,
	 .s-grid-third,
	 .s-grid-three-quarters,
	 .s-grid-two-thirds,
	 .s-grid-whole {
		 margin: 0;
		 clear: none;
		 float: left;
		 -moz-box-sizing: border-box;
		 -webkit-box-sizing: border-box;
		 box-sizing: border-box;
	 }
	 .s-offset-0 {
		 margin-left: 0
	 }
	 .s-grid-1 {
		 width: 8.33333%
	 }
	 .s-offset-1 {
		 margin-left: 8.33333%
	 }
	 .s-grid-2 {
		 width: 16.66667%
	 }
	 .s-offset-2 {
		 margin-left: 16.66667%
	 }
	 .s-grid-3,
	 .s-grid-quarter {
		 width: 25%
	 }
	 .s-offset-3 {
		 margin-left: 25%
	 }
	 .s-grid-4,
	 .s-grid-third {
		 width: 33.33333%
	 }
	 .s-offset-4 {
		 margin-left: 33.33333%
	 }
	 .s-grid-5 {
		 width: 41.66667%
	 }
	 .s-offset-5 {
		 margin-left: 41.66667%
	 }
	 .s-grid-6,
	 .s-grid-half {
		 width: 50%
	 }
	 .s-offset-6 {
		 margin-left: 50%
	 }
	 .s-grid-7 {
		 width: 58.33333%
	 }
	 .s-offset-7 {
		 margin-left: 58.33333%
	 }
	 .s-grid-8,
	 .s-grid-two-thirds {
		 width: 66.66667%
	 }
	 .s-offset-8 {
		 margin-left: 66.66667%
	 }
	 .s-grid-9,
	 .s-grid-three-quarters {
		 width: 75%
	 }
	 .s-offset-9 {
		 margin-left: 75%
	 }
	 .s-grid-10 {
		 width: 83.33333%
	 }
	 .s-offset-10 {
		 margin-left: 83.33333%
	 }
	 .s-grid-11 {
		 width: 91.66667%
	 }
	 .s-offset-11 {
		 margin-left: 91.66667%
	 }
	 .s-grid-12,
	 .s-grid-whole {
		 width: 100%
	 }
	 .s-offset-12 {
		 margin-left: 100%
	 }
	 .s-padded {
		 padding: .5em
	 }
	 .s-padded-left {
		 padding-left: .5em
	 }
	 .s-padded-right {
		 padding-right: .5em
	 }
	 .s-padded-top {
		 padding-top: .5em
	 }
	 .s-padded-bottom {
		 padding-bottom: .5em
	 }
	 .s-padded-sides {
		 padding: 0 .5em
	 }
	 .s-padded-vertical {
		 padding: .5em 0
	 }
	 .s-padded-inner {
		 padding: 1em
	 }
	 .s-padded-inner-sides {
		 padding: 0 1em
	 }
	 .s-padded-reverse {
		 margin: 0 -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none
	 }
	 .s-padded-reverse-all {
		 margin: -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none
	 }
	 .s-flow-opposite {
		 float: right
	 }
	 .s-center {
		 text-align: center
	 }
	 .s-left {
		 text-align: left
	 }
	 .s-right {
		 text-align: right
	 }
	 .s-hidden {
		 display: none
	 }
 }

 @media (min-width: 48.065em) {
  	/*body{
 		border-top:10px solid  magenta  !important;
 	}*/
	 .m-grid-1,
	 .m-grid-10,
	 .m-grid-11,
	 .m-grid-12,
	 .m-grid-2,
	 .m-grid-3,
	 .m-grid-4,
	 .m-grid-5,
	 .m-grid-6,
	 .m-grid-7,
	 .m-grid-8,
	 .m-grid-9,
	 .m-grid-all,
	 .m-grid-half,
	 .m-grid-quarter,
	 .m-grid-third,
	 .m-grid-three-quarters,
	 .m-grid-two-thirds,
	 .m-grid-whole {
		 margin: 0;
		 clear: none;
		 float: left;
		 -moz-box-sizing: border-box;
		 -webkit-box-sizing: border-box;
		 box-sizing: border-box;
	 }
	 .m-offset-0 {
		 margin-left: 0
	 }
	 .m-grid-1 {
		 width: 8.33333%
	 }
	 .m-offset-1 {
		 margin-left: 8.33333%
	 }
	 .m-grid-2 {
		 width: 16.66667%
	 }
	 .m-offset-2 {
		 margin-left: 16.66667%
	 }
	 .m-grid-3,
	 .m-grid-quarter {
		 width: 25%
	 }
	 .m-offset-3 {
		 margin-left: 25%
	 }
	 .m-grid-4,
	 .m-grid-third {
		 width: 33.33333%
	 }
	 .m-offset-4 {
		 margin-left: 33.33333%
	 }
	 .m-grid-5 {
		 width: 41.66667%
	 }
	 .m-offset-5 {
		 margin-left: 41.66667%
	 }
	 .m-grid-6,
	 .m-grid-half {
		 width: 50%
	 }
	 .m-offset-6 {
		 margin-left: 50%
	 }
	 .m-grid-7 {
		 width: 58.33333%
	 }
	 .m-offset-7 {
		 margin-left: 58.33333%
	 }
	 .m-grid-8,
	 .m-grid-two-thirds {
		 width: 66.66667%
	 }
	 .m-offset-8 {
		 margin-left: 66.66667%
	 }
	 .m-grid-9,
	 .m-grid-three-quarters {
		 width: 75%
	 }
	 .m-offset-9 {
		 margin-left: 75%
	 }
	 .m-grid-10 {
		 width: 83.33333%
	 }
	 .m-offset-10 {
		 margin-left: 83.33333%
	 }
	 .m-grid-11 {
		 width: 91.66667%
	 }
	 .m-offset-11 {
		 margin-left: 91.66667%
	 }
	 .m-grid-12,
	 .m-grid-whole {
		 width: 100%
	 }
	 .m-offset-12 {
		 margin-left: 100%
	 }
	 .m-padded {
		 padding: .5em
	 }
	 .m-padded-left {
		 padding-left: .5em
	 }
	 .m-padded-right {
		 padding-right: .5em
	 }
	 .m-padded-top {
		 padding-top: .5em
	 }
	 .m-padded-bottom {
		 padding-bottom: .5em
	 }
	 .m-padded-sides {
		 padding: 0 .5em
	 }
	 .m-padded-vertical {
		 padding: .5em 0
	 }
	 .m-padded-inner {
		 padding: 1em
	 }
	 .m-padded-inner-sides {
		 padding: 0 1em
	 }
	 .m-padded-reverse {
		 margin: 0 -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none
	 }
	 .m-padded-reverse-all {
		 margin: -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none
	 }
	 .m-flow-opposite {
		 float: right
	 }
	 .m-center {
		 text-align: center
	 }
	 .m-left {
		 text-align: left
	 }
	 .m-right {
		 text-align: right
	 }
	 .m-hidden {
		 display: none
	 }
 }
 @media (min-width: 64.065em) {
   	/*body{
 		border-top:10px solid  purple  !important;
 	}*/
	 .l-grid-1,
	 .l-grid-10,
	 .l-grid-11,
	 .l-grid-12,
	 .l-grid-2,
	 .l-grid-3,
	 .l-grid-4,
	 .l-grid-5,
	 .l-grid-6,
	 .l-grid-7,
	 .l-grid-8,
	 .l-grid-9,
	 .l-grid-all,
	 .l-grid-half,
	 .l-grid-quarter,
	 .l-grid-third,
	 .l-grid-three-quarters,
	 .l-grid-two-thirds,
	 .l-grid-whole {
		 margin: 0;
		 clear: none;
		 float: left;
		 -moz-box-sizing: border-box;
		 -webkit-box-sizing: border-box;
		 box-sizing: border-box;
	 }
	 .l-offset-0 {
		 margin-left: 0
	 }
	 .l-grid-1 {
		 width: 8.33333%
	 }
	 .l-offset-1 {
		 margin-left: 8.33333%
	 }
	 .l-grid-2 {
		 width: 16.66667%
	 }
	 .l-offset-2 {
		 margin-left: 16.66667%
	 }
	 .l-grid-3,
	 .l-grid-quarter {
		 width: 25%
	 }
	 .l-offset-3 {
		 margin-left: 25%
	 }
	 .l-grid-4,
	 .l-grid-third {
		 width: 33.33333%
	 }
	 .l-offset-4 {
		 margin-left: 33.33333%
	 }
	 .l-grid-5 {
		 width: 41.66667%
	 }
	 .l-offset-5 {
		 margin-left: 41.66667%
	 }
	 .l-grid-6,
	 .l-grid-half {
		 width: 50%
	 }
	 .l-offset-6 {
		 margin-left: 50%
	 }
	 .l-grid-7 {
		 width: 58.33333%
	 }
	 .l-offset-7 {
		 margin-left: 58.33333%
	 }
	 .l-grid-8,
	 .l-grid-two-thirds {
		 width: 66.66667%
	 }
	 .l-offset-8 {
		 margin-left: 66.66667%
	 }
	 .l-grid-9,
	 .l-grid-three-quarters {
		 width: 75%
	 }
	 .l-offset-9 {
		 margin-left: 75%
	 }
	 .l-grid-10 {
		 width: 83.33333%
	 }
	 .l-offset-10 {
		 margin-left: 83.33333%
	 }
	 .l-grid-11 {
		 width: 91.66667%
	 }
	 .l-offset-11 {
		 margin-left: 91.66667%
	 }
	 .l-grid-12,
	 .l-grid-whole {
		 width: 100%
	 }
	 .l-offset-12 {
		 margin-left: 100%
	 }
	 .l-padded {
		 padding: .5em
	 }
	 .l-padded-left {
		 padding-left: .5em
	 }
	 .l-padded-right {
		 padding-right: .5em
	 }
	 .l-padded-top {
		 padding-top: .5em
	 }
	 .l-padded-bottom {
		 padding-bottom: .5em
	 }
	 .l-padded-sides {
		 padding: 0 .5em
	 }
	 .l-padded-vertical {
		 padding: .5em 0
	 }
	 .l-padded-inner {
		 padding: 1em
	 }
	 .l-padded-inner-sides {
		 padding: 0 1em
	 }
	 .l-padded-reverse {
		 margin: 0 -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none
	 }
	 .l-padded-reverse-all {
		 margin: -.5em;
		 width: auto;
		 box-sizing: content-box;
		 float: none
	 }
	 .l-flow-opposite {
		 float: right
	 }
	 .l-center {
		 text-align: center
	 }
	 .l-left {
		 text-align: left
	 }
	 .l-right {
		 text-align: right
	 }
	 .l-hidden {
		 display: none
	 }
	  .l-only {
		 display: block
	 }
 }