/* $Id: grid12-fluid.css,v 1.1.2.2 2010/04/08 07:02:59 sociotech Exp $ */ /* Layout - 16 column grid, fluid width, 20px gutters -------------------------------------------------------------- */ /* grid widths */ .grid12-1 {width: 8.33%;} .grid12-2 {width: 16.67%;} .grid12-3 {width: 25%;} .grid12-4 {width: 33.33%;} .grid12-5 {width: 41.67%;} .grid12-6 {width: 50%;} .grid12-7 {width: 58.33%;} .grid12-8 {width: 66.67%;} .grid12-9 {width: 75%;} .grid12-10 {width: 83.33%;} .grid12-11 {width: 91.67%;} .grid12-12 {width: 100%;} /* block indents */ .grid12-indent-1 {margin-left: 8.33%;} .grid12-indent-2 {margin-left: 16.67%;} .grid12-indent-3 {margin-left: 25%;} .grid12-indent-4 {margin-left: 33.33%;} .grid12-indent-5 {margin-left: 41.67%;} .grid12-indent-6 {margin-left: 50%;} .grid12-indent-7 {margin-left: 58.33%;} .grid12-indent-8 {margin-left: 66.67%;} .grid12-indent-9 {margin-left: 75%;} .grid12-indent-10 {margin-left: 83.33%;} .grid12-indent-11 {margin-left: 91.67%;} /* gutters (2 x margin) */ .block .inner { margin-left: 10px; margin-right: 10px; } /* page min width */ body, div.full-width { min-width: 780px; } /* row max-min width */ .row { max-width: 1320px; /* 960px + 360px */ min-width: 780px; /* 960px - 180px */ } /* allow nested rows to be smaller */ .row.nested { min-width: 0; } /* theme setting: set fluid grid width on top-level full-width elements */ .fluid-100 .full-width .grid12-16 {width: 100%;} .fluid-95 .full-width .grid12-16 {width: 95%;} .fluid-90 .full-width .grid12-16 {width: 90%;} .fluid-85 .full-width .grid12-16 {width: 85%;} /* now reset all nested full-width elements back to 100% */ #page .grid12-16 .grid12-16 {width: 100%;}