/*
  Extra Strength Responsive Grids
  Author & copyright (c) 2013: John Polacek
  Follow me on Twitter: @johnpolacek

  Dual MIT & GPL license

  Project Page: http://dfcb.github.com/extra-strength-responsive-grids
  Project Repo: https://github.com/dfcb/extra-strength-responsive-grids

  Note: box-sizing: border-box; is required for this solution.
  For more info, see the project page
*/

.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.66667%;}
.grid-9, .grid-three-quarters {width:75%;}
.grid-10 {width:83.33333%;}
.grid-11 {width:91.66667%;}
.grid-12, .grid-whole {width:100%;}

/* padding helper classes */
.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-sides {padding-left:0.5em;padding-right:0.5em;}
.padded-vertical {padding-top:0.5em;padding-bottom:0.5em;}

.padded-inner {padding:1em;}
.padded-inner-left {padding-left:1em;}
.padded-inner-right {padding-right:1em;}
.padded-inner-top {padding-top:1em;}
.padded-inner-bottom {padding-bottom:1em;}
.padded-inner-sides {padding-left:1em;padding-right:1em;}
.padded-inner-vertical {padding-top:1em;padding-bottom: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;}

.padded-inner-reverse {margin:0 -1em;width:auto;box-sizing:content-box;float:none;}
.padded-inner-reverse-all {margin:-1em;width:auto;box-sizing:content-box;float:none;}

.padded-none {padding:0;}

/* miscellaneous helper classes */
.flow {float:left;}
.flow-opposite {float:right;}
.flow-none {float:none;}
.center {text-align:center;}
.left {text-align:left;}
.right {text-align:right;}

/* For compatibility with Bootstrap (fixed), Foundation, etc. */
.row {margin:0 -0.5em;width:auto;box-sizing:content-box;float:none;}


@media (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%;}

  /* padding helper classes */
  .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-left:0.5em;padding-right:0.5em;}
  .s-padded-vertical {padding-top:0.5em;padding-bottom:0.5em;}

  .s-padded-inner {padding:1em;}
  .s-padded-inner-left {padding-left:1em;}
  .s-padded-inner-right {padding-right:1em;}
  .s-padded-inner-top {padding-top:1em;}
  .s-padded-inner-bottom {padding-bottom:1em;}
  .s-padded-inner-sides {padding-left:1em;padding-right:1em;}
  .s-padded-inner-vertical {padding-top:1em;padding-bottom: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-padded-inner-reverse {margin:0 -1em;width:auto;box-sizing:content-box;float:none;}
  .s-padded-inner-reverse-all {margin:-1em;width:auto;box-sizing:content-box;float:none;}

  .s-padded-none {padding:0;}

  /* miscellaneous helper classes */
  .s-flow {float:left;}
  .s-flow-opposite {float:right;}
  .s-flow-none {float:none;}
  .s-center {text-align:center;}
  .s-left {text-align:left;}
  .s-right {text-align:right;}
  .s-hidden {display:none;}
}

@media (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%;}
  
  /* padding helper classes */
  .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-left:0.5em;padding-right:0.5em;}
  .m-padded-vertical {padding-top:0.5em;padding-bottom:0.5em;}

  .m-padded-inner {padding:1em;}
  .m-padded-inner-left {padding-left:1em;}
  .m-padded-inner-right {padding-right:1em;}
  .m-padded-inner-top {padding-top:1em;}
  .m-padded-inner-bottom {padding-bottom:1em;}
  .m-padded-inner-sides {padding-left:1em;padding-right:1em;}
  .m-padded-inner-vertical {padding-top:1em;padding-bottom: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-padded-inner-reverse {margin:0 -1em;width:auto;box-sizing:content-box;float:none;}
  .m-padded-inner-reverse-all {margin:-1em;width:auto;box-sizing:content-box;float:none;}

  .m-padded-none {padding:0;}  

  /* miscellaneous helper classes */
  .m-flow {float:left;}
  .m-flow-opposite {float:right;}
  .m-flow-none {float:none;}
  .m-center {text-align:center;}
  .m-left {text-align:left;}
  .m-right {text-align:right;}
  .m-hidden {display:none;}
}

@media (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%;}

  /* padding helper classes */
  .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-left:0.5em;padding-right:0.5em;}
  .l-padded-vertical {padding-top:0.5em;padding-bottom:0.5em;}

  .l-padded-inner {padding:1em;}
  .l-padded-inner-left {padding-left:1em;}
  .l-padded-inner-right {padding-right:1em;}
  .l-padded-inner-top {padding-top:1em;}
  .l-padded-inner-bottom {padding-bottom:1em;}
  .l-padded-inner-sides {padding-left:1em;padding-right:1em}
  .l-padded-inner-vertical {padding-top:1em;padding-bottom: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-padded-inner-reverse {margin:0 -1em;width:auto;box-sizing:content-box;float:none;}
  .l-padded-inner-reverse-all {margin:-1em;width:auto;box-sizing:content-box;float:none;}

  .l-padded-none {padding:0;}

  /* miscellaneous helper classes */
  .l-flow {float:left;}
  .l-flow-opposite {float:right;}
  .l-flow-none {float:none;}
  .l-center {text-align:center;}
  .l-left {text-align:left;}
  .l-right {text-align:right;}
  .l-hidden {display:none;}
}