.hidden-sm { display: none; } .container { width: 90%; margin-left: auto; margin-right: auto; } @media only screen and (min-width: 33.75em) { .container { width: 80%; } } @media only screen and (min-width: 60em) { .container { width: 90%; max-width: 80rem; } } .row { position: relative; width: 100%; } .row [class^="col"] { float: left; margin: 0.5rem 2%; min-height: 0.125rem; } .row::after { content: ""; display: table; clear: both; } .col-1, .col-2, .col-3, .col-4, .col-5, .col-6, .col-7, .col-8, .col-9, .col-10, .col-11, .col-12 { width: 96%; } .col-1-sm { width: 4.3333333333%; } .col-2-sm { width: 12.6666666667%; } .col-3-sm { width: 21%; } .col-4-sm { width: 29.3333333333%; } .col-5-sm { width: 37.6666666667%; } .col-6-sm { width: 46%; } .col-7-sm { width: 54.3333333333%; } .col-8-sm { width: 62.6666666667%; } .col-9-sm { width: 71%; } .col-10-sm { width: 79.3333333333%; } .col-11-sm { width: 87.6666666667%; } .col-12-sm { width: 96%; } @media only screen and (min-width: 45em) { .col-1 { width: 4.3333333333%; } .col-2 { width: 12.6666666667%; } .col-3 { width: 21%; } .col-4 { width: 29.3333333333%; } .col-5 { width: 37.6666666667%; } .col-6 { width: 46%; } .col-7 { width: 54.3333333333%; } .col-8 { width: 62.6666666667%; } .col-9 { width: 71%; } .col-10 { width: 79.3333333333%; } .col-11 { width: 87.6666666667%; } .col-12 { width: 96%; } .hidden-sm { display: block; } } /*# sourceMappingURL=simple-grid.css.map */