|
- /*
- Variable Grid System.
- Learn more ~ http://www.spry-soft.com/grids/
- Based on 960 Grid System - http://960.gs/
-
- Licensed under GPL and MIT.
- */
-
-
- /* Containers
- ----------------------------------------------------------------------------------------------------*/
- .container_12 {
- margin-left: auto;
- margin-right: auto;
- width: 756px;
- }
-
- /* Grid >> Global
- ----------------------------------------------------------------------------------------------------*/
-
- .grid_1,
- .grid_2,
- .grid_3,
- .grid_4,
- .grid_5,
- .grid_6,
- .grid_7,
- .grid_8,
- .grid_9,
- .grid_10,
- .grid_11,
- .grid_12 {
- display:inline;
- float: left;
- position: relative;
- margin-left: 20px;
- margin-right: 20px;
- }
-
- /* Grid >> Children (Alpha ~ First, Omega ~ Last)
- ----------------------------------------------------------------------------------------------------*/
-
- .alpha {
- margin-left: 0;
- }
-
- .omega {
- margin-right: 0;
- }
-
- /* Grid >> 12 Columns
- ----------------------------------------------------------------------------------------------------*/
-
- .container_12 .grid_1 {
- width:23px;
- }
-
- .container_12 .grid_2 {
- width:86px;
- }
-
- .container_12 .grid_3 {
- width:149px;
- }
-
- .container_12 .grid_4 {
- width:212px;
- }
-
- .container_12 .grid_5 {
- width:275px;
- }
-
- .container_12 .grid_6 {
- width:338px;
- }
-
- .container_12 .grid_7 {
- width:401px;
- }
-
- .container_12 .grid_8 {
- width:464px;
- }
-
- .container_12 .grid_9 {
- width:527px;
- }
-
- .container_12 .grid_10 {
- width:590px;
- }
-
- .container_12 .grid_11 {
- width:653px;
- }
-
- .container_12 .grid_12 {
- width:716px;
- }
-
-
-
- /* Prefix Extra Space >> 12 Columns
- ----------------------------------------------------------------------------------------------------*/
-
- .container_12 .prefix_1 {
- padding-left:63px;
- }
-
- .container_12 .prefix_2 {
- padding-left:126px;
- }
-
- .container_12 .prefix_3 {
- padding-left:189px;
- }
-
- .container_12 .prefix_4 {
- padding-left:252px;
- }
-
- .container_12 .prefix_5 {
- padding-left:315px;
- }
-
- .container_12 .prefix_6 {
- padding-left:378px;
- }
-
- .container_12 .prefix_7 {
- padding-left:441px;
- }
-
- .container_12 .prefix_8 {
- padding-left:504px;
- }
-
- .container_12 .prefix_9 {
- padding-left:567px;
- }
-
- .container_12 .prefix_10 {
- padding-left:630px;
- }
-
- .container_12 .prefix_11 {
- padding-left:693px;
- }
-
-
-
- /* Suffix Extra Space >> 12 Columns
- ----------------------------------------------------------------------------------------------------*/
-
- .container_12 .suffix_1 {
- padding-right:63px;
- }
-
- .container_12 .suffix_2 {
- padding-right:126px;
- }
-
- .container_12 .suffix_3 {
- padding-right:189px;
- }
-
- .container_12 .suffix_4 {
- padding-right:252px;
- }
-
- .container_12 .suffix_5 {
- padding-right:315px;
- }
-
- .container_12 .suffix_6 {
- padding-right:378px;
- }
-
- .container_12 .suffix_7 {
- padding-right:441px;
- }
-
- .container_12 .suffix_8 {
- padding-right:504px;
- }
-
- .container_12 .suffix_9 {
- padding-right:567px;
- }
-
- .container_12 .suffix_10 {
- padding-right:630px;
- }
-
- .container_12 .suffix_11 {
- padding-right:693px;
- }
-
-
-
- /* Push Space >> 12 Columns
- ----------------------------------------------------------------------------------------------------*/
-
- .container_12 .push_1 {
- left:63px;
- }
-
- .container_12 .push_2 {
- left:126px;
- }
-
- .container_12 .push_3 {
- left:189px;
- }
-
- .container_12 .push_4 {
- left:252px;
- }
-
- .container_12 .push_5 {
- left:315px;
- }
-
- .container_12 .push_6 {
- left:378px;
- }
-
- .container_12 .push_7 {
- left:441px;
- }
-
- .container_12 .push_8 {
- left:504px;
- }
-
- .container_12 .push_9 {
- left:567px;
- }
-
- .container_12 .push_10 {
- left:630px;
- }
-
- .container_12 .push_11 {
- left:693px;
- }
-
-
-
- /* Pull Space >> 12 Columns
- ----------------------------------------------------------------------------------------------------*/
-
- .container_12 .pull_1 {
- left:-63px;
- }
-
- .container_12 .pull_2 {
- left:-126px;
- }
-
- .container_12 .pull_3 {
- left:-189px;
- }
-
- .container_12 .pull_4 {
- left:-252px;
- }
-
- .container_12 .pull_5 {
- left:-315px;
- }
-
- .container_12 .pull_6 {
- left:-378px;
- }
-
- .container_12 .pull_7 {
- left:-441px;
- }
-
- .container_12 .pull_8 {
- left:-504px;
- }
-
- .container_12 .pull_9 {
- left:-567px;
- }
-
- .container_12 .pull_10 {
- left:-630px;
- }
-
- .container_12 .pull_11 {
- left:-693px;
- }
-
-
-
-
- /* Clear Floated Elements
- ----------------------------------------------------------------------------------------------------*/
-
- /* http://sonspring.com/journal/clearing-floats */
-
- .clear {
- clear: both;
- display: block;
- overflow: hidden;
- visibility: hidden;
- width: 0;
- height: 0;
- }
-
- /* http://perishablepress.com/press/2008/02/05/lessons-learned-concerning-the-clearfix-css-hack */
-
- .clearfix:after {
- clear: both;
- content: ' ';
- display: block;
- font-size: 0;
- line-height: 0;
- visibility: hidden;
- width: 0;
- height: 0;
- }
-
- .clearfix {
- display: inline-block;
- }
-
- * html .clearfix {
- height: 1%;
- }
-
- .clearfix {
- display: block;
- }
|