.grid-all, .grid-1, .grid-2, .grid-3, .grid-quarter, .grid-4, .grid-third, .grid-5, .grid-6, .grid-half, .grid-7, .grid-8, .grid-two-thirds, .grid-9, .grid-three-quarters, .grid-10, .grid-11, .grid-12, .grid-whole { margin: 0; clear: none; float: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; *behavior: url(/boxsizing.htc); }
.grid-1 { width: 8.33333% }
.grid-2 { width: 16.66667% }
.grid-3, .grid-quarter { width: 25% }
.grid-4, .grid-third { width: 33.33333% }
.grid-5 { width: 41.66667% }
.grid-6, .grid-half { width: 50% }
.grid-7 { width: 58.33333% }
.grid-8, .grid-two-thirds { width: 66.66666% }
.grid-9, .grid-three-quarters { width: 75% }
.grid-10 { width: 83.33333% }
.grid-11 { width: 91.66667% }
.grid-12, .grid-whole { width: 100% }
.padded { padding: 0.5em }
.padded-left { padding-left: 0.5em }
.padded-right { padding-right: 0.5em }
.padded-top { padding-top: 0.5em }
.padded-bottom { padding-bottom: 0.5em }
.padded-dbl-bottom { padding-bottom: 1em }
.padded-sides { padding: 0 0.5em }
.padded-vertical { padding: 0.5em 0 }
.padded-inner { padding: 1em }
.padded-inner-sides { padding: 0 1em }
.padded-reverse { margin: 0 -0.5em; width: auto; box-sizing: content-box; float: none; }
.padded-reverse-all { margin: -0.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 -0.5em; width: auto; box-sizing: content-box; float: none; }

@media screen and (max-width: 480px) { 

    .s-grid-all, .s-grid-1, .s-grid-2, .s-grid-3, .s-grid-quarter, .s-grid-4, .s-grid-third, .s-grid-5, .s-grid-6, .s-grid-half, .s-grid-7, .s-grid-8, .s-grid-two-thirds, .s-grid-9, .s-grid-three-quarters, .s-grid-10, .s-grid-11, .s-grid-12, .s-grid-whole { margin: 0; clear: none; float: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; *behavior: url(/boxsizing.htc); }
    .s-grid-1 { width: 8.33333% }
    .s-grid-2 { width: 16.66667% }
    .s-grid-3, .s-grid-quarter { width: 25% }
    .s-grid-4, .s-grid-third { width: 33.33333% }
    .s-grid-5 { width: 41.66667% }
    .s-grid-6, .s-grid-half { width: 50% }
    .s-grid-7 { width: 58.33333% }
    .s-grid-8, .s-grid-two-thirds { width: 66.66667% }
    .s-grid-9, .s-grid-three-quarters { width: 75% }
    .s-grid-10 { width: 83.33333% }
    .s-grid-11 { width: 91.66667% }
    .s-grid-12, .s-grid-whole { width: 100% }
    .s-padded { padding: 0.5em }
    .s-padded-left { padding-left: 0.5em }
    .s-padded-right { padding-right: 0.5em }
    .s-padded-top { padding-top: 0.5em }
    .s-padded-bottom { padding-bottom: 0.5em }
    .s-padded-sides { padding: 0 0.5em }
    .s-padded-vertical { padding: 0.5em 0 }
    .s-padded-inner { padding: 1em }
    .s-padded-inner-sides { padding: 0 1em }
    .s-padded-reverse { margin: 0 -0.5em; width: auto; box-sizing: content-box; float: none; }
    .s-padded-reverse-all { margin: -0.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 screen and (min-width: 481px) and (max-width: 800px) { 
    .m-grid-all, .m-grid-1, .m-grid-2, .m-grid-3, .m-grid-quarter, .m-grid-4, .m-grid-third, .m-grid-5, .m-grid-6, .m-grid-half, .m-grid-7, .m-grid-8, .m-grid-two-thirds, .m-grid-9, .m-grid-three-quarters, .m-grid-10, .m-grid-11, .m-grid-12, .m-grid-whole { margin: 0; clear: none; float: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; *behavior: url(/boxsizing.htc); }
    .m-grid-1 { width: 8.33333% }
    .m-grid-2 { width: 16.66667% }
    .m-grid-3, .m-grid-quarter { width: 25% }
    .m-grid-4, .m-grid-third { width: 33.33333% }
    .m-grid-5 { width: 41.66667% }
    .m-grid-6, .m-grid-half { width: 50% }
    .m-grid-7 { width: 58.33333% }
    .m-grid-8, .m-grid-two-thirds { width: 66.66667% }
    .m-grid-9, .m-grid-three-quarters { width: 75% }
    .m-grid-10 { width: 83.33333% }
    .m-grid-11 { width: 91.66667% }
    .m-grid-12, .m-grid-whole { width: 100% }
    .m-padded { padding: 0.5em }
    .m-padded-left { padding-left: 0.5em }
    .m-padded-right { padding-right: 0.5em }
    .m-padded-top { padding-top: 0.5em }
    .m-padded-bottom { padding-bottom: 0.5em }
    .m-padded-sides { padding: 0 0.5em }
    .m-padded-vertical { padding: 0.5em 0 }
    .m-padded-inner { padding: 1em }
    .m-padded-inner-sides { padding: 0 1em }
    .m-padded-reverse { margin: 0 -0.5em; width: auto; box-sizing: content-box; float: none; }
    .m-padded-reverse-all { margin: -0.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 screen and (min-width: 801px) { 
    .l-grid-all, .l-grid-1, .l-grid-2, .l-grid-3, .l-grid-quarter, .l-grid-4, .l-grid-third, .l-grid-5, .l-grid-6, .l-grid-half, .l-grid-7, .l-grid-8, .l-grid-two-thirds, .l-grid-9, .l-grid-three-quarters, .l-grid-10, .l-grid-11, .l-grid-12, .l-grid-whole { margin: 0; clear: none; float: left; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; *behavior: url(/boxsizing.htc); }
    .l-grid-1 { width: 8.33333% }
    .l-grid-2 { width: 16.66667% }
    .l-grid-3, .l-grid-quarter { width: 25% }
    .l-grid-4, .l-grid-third { width: 33.33333% }
    .l-grid-5 { width: 41.66667% }
    .l-grid-6, .l-grid-half { width: 50% }
    .l-grid-7 { width: 58.33333% }
    .l-grid-8, .l-grid-two-thirds { width: 66.66667% }
    .l-grid-9, .l-grid-three-quarters { width: 75% }
    .l-grid-10 { width: 83.33333% }
    .l-grid-11 { width: 91.66667% }
    .l-grid-12, .l-grid-whole { width: 100% }
    .l-padded { padding: 0.5em }
    .l-padded-left { padding-left: 0.5em }
    .l-padded-right { padding-right: 0.5em }
    .l-padded-top { padding-top: 0.5em }
    .l-padded-bottom { padding-bottom: 0.5em }
    .l-padded-sides { padding: 0 0.5em }
    .l-padded-vertical { padding: 0.5em 0 }
    .l-padded-inner { padding: 1em }
    .l-padded-inner-sides { padding: 0 1em }
    .l-padded-reverse { margin: 0 -0.5em; width: auto; box-sizing: content-box; float: none; }
    .l-padded-reverse-all { margin: -0.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 }
 
}