Skip to content
This repository

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
Browse code

Upgrade 960.gs to latest version

  • Loading branch information...
commit d8618327448e6043f09ae64091634ccaa6a3d6f1 1 parent ea0c7eb
acidvertigo authored October 21, 2011
2  catalog/ext/960gs/960_16_col_rtl.css
@@ -46,7 +46,7 @@ body {
46 46
 .grid_15,
47 47
 .grid_16 {
48 48
   display: inline;
49  
-  float: left;
  49
+  float: right;
50 50
   margin-right: 10px;
51 51
   margin-left: 10px;
52 52
 }
621  catalog/ext/960gs/960_24_col_rtl.css
... ...
@@ -0,0 +1,621 @@
  1
+/*
  2
+  960 Grid System ~ Core CSS.
  3
+  Learn more ~ http://960.gs/
  4
+
  5
+  Licensed under GPL and MIT.
  6
+*/
  7
+
  8
+/*
  9
+  Forces backgrounds to span full width,
  10
+  even if there is horizontal scrolling.
  11
+  Increase this if your layout is wider.
  12
+
  13
+  Note: IE6 works fine without this fix.
  14
+*/
  15
+
  16
+body {
  17
+  min-width: 960px;
  18
+}
  19
+
  20
+/* `Container
  21
+----------------------------------------------------------------------------------------------------*/
  22
+
  23
+.container_24 {
  24
+  margin-right: auto;
  25
+  margin-left: auto;
  26
+  width: 960px;
  27
+}
  28
+
  29
+/* `Grid >> Global
  30
+----------------------------------------------------------------------------------------------------*/
  31
+
  32
+.grid_1,
  33
+.grid_2,
  34
+.grid_3,
  35
+.grid_4,
  36
+.grid_5,
  37
+.grid_6,
  38
+.grid_7,
  39
+.grid_8,
  40
+.grid_9,
  41
+.grid_10,
  42
+.grid_11,
  43
+.grid_12,
  44
+.grid_13,
  45
+.grid_14,
  46
+.grid_15,
  47
+.grid_16,
  48
+.grid_17,
  49
+.grid_18,
  50
+.grid_19,
  51
+.grid_20,
  52
+.grid_21,
  53
+.grid_22,
  54
+.grid_23,
  55
+.grid_24 {
  56
+  display: inline;
  57
+  float: right;
  58
+  margin-right: 5px;
  59
+  margin-left: 5px;
  60
+}
  61
+
  62
+.push_1, .pull_1,
  63
+.push_2, .pull_2,
  64
+.push_3, .pull_3,
  65
+.push_4, .pull_4,
  66
+.push_5, .pull_5,
  67
+.push_6, .pull_6,
  68
+.push_7, .pull_7,
  69
+.push_8, .pull_8,
  70
+.push_9, .pull_9,
  71
+.push_10, .pull_10,
  72
+.push_11, .pull_11,
  73
+.push_12, .pull_12,
  74
+.push_13, .pull_13,
  75
+.push_14, .pull_14,
  76
+.push_15, .pull_15,
  77
+.push_16, .pull_16,
  78
+.push_17, .pull_17,
  79
+.push_18, .pull_18,
  80
+.push_19, .pull_19,
  81
+.push_20, .pull_20,
  82
+.push_21, .pull_21,
  83
+.push_22, .pull_22,
  84
+.push_23, .pull_23 {
  85
+  position: relative;
  86
+}
  87
+
  88
+/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
  89
+----------------------------------------------------------------------------------------------------*/
  90
+
  91
+.alpha {
  92
+  margin-right: 0;
  93
+}
  94
+
  95
+.omega {
  96
+  margin-left: 0;
  97
+}
  98
+
  99
+/* `Grid >> 24 Columns
  100
+----------------------------------------------------------------------------------------------------*/
  101
+
  102
+.container_24 .grid_1 {
  103
+  width: 30px;
  104
+}
  105
+
  106
+.container_24 .grid_2 {
  107
+  width: 70px;
  108
+}
  109
+
  110
+.container_24 .grid_3 {
  111
+  width: 110px;
  112
+}
  113
+
  114
+.container_24 .grid_4 {
  115
+  width: 150px;
  116
+}
  117
+
  118
+.container_24 .grid_5 {
  119
+  width: 190px;
  120
+}
  121
+
  122
+.container_24 .grid_6 {
  123
+  width: 230px;
  124
+}
  125
+
  126
+.container_24 .grid_7 {
  127
+  width: 270px;
  128
+}
  129
+
  130
+.container_24 .grid_8 {
  131
+  width: 310px;
  132
+}
  133
+
  134
+.container_24 .grid_9 {
  135
+  width: 350px;
  136
+}
  137
+
  138
+.container_24 .grid_10 {
  139
+  width: 390px;
  140
+}
  141
+
  142
+.container_24 .grid_11 {
  143
+  width: 430px;
  144
+}
  145
+
  146
+.container_24 .grid_12 {
  147
+  width: 470px;
  148
+}
  149
+
  150
+.container_24 .grid_13 {
  151
+  width: 510px;
  152
+}
  153
+
  154
+.container_24 .grid_14 {
  155
+  width: 550px;
  156
+}
  157
+
  158
+.container_24 .grid_15 {
  159
+  width: 590px;
  160
+}
  161
+
  162
+.container_24 .grid_16 {
  163
+  width: 630px;
  164
+}
  165
+
  166
+.container_24 .grid_17 {
  167
+  width: 670px;
  168
+}
  169
+
  170
+.container_24 .grid_18 {
  171
+  width: 710px;
  172
+}
  173
+
  174
+.container_24 .grid_19 {
  175
+  width: 750px;
  176
+}
  177
+
  178
+.container_24 .grid_20 {
  179
+  width: 790px;
  180
+}
  181
+
  182
+.container_24 .grid_21 {
  183
+  width: 830px;
  184
+}
  185
+
  186
+.container_24 .grid_22 {
  187
+  width: 870px;
  188
+}
  189
+
  190
+.container_24 .grid_23 {
  191
+  width: 910px;
  192
+}
  193
+
  194
+.container_24 .grid_24 {
  195
+  width: 950px;
  196
+}
  197
+
  198
+/* `Prefix Extra Space >> 24 Columns
  199
+----------------------------------------------------------------------------------------------------*/
  200
+
  201
+.container_24 .prefix_1 {
  202
+  padding-right: 40px;
  203
+}
  204
+
  205
+.container_24 .prefix_2 {
  206
+  padding-right: 80px;
  207
+}
  208
+
  209
+.container_24 .prefix_3 {
  210
+  padding-right: 120px;
  211
+}
  212
+
  213
+.container_24 .prefix_4 {
  214
+  padding-right: 160px;
  215
+}
  216
+
  217
+.container_24 .prefix_5 {
  218
+  padding-right: 200px;
  219
+}
  220
+
  221
+.container_24 .prefix_6 {
  222
+  padding-right: 240px;
  223
+}
  224
+
  225
+.container_24 .prefix_7 {
  226
+  padding-right: 280px;
  227
+}
  228
+
  229
+.container_24 .prefix_8 {
  230
+  padding-right: 320px;
  231
+}
  232
+
  233
+.container_24 .prefix_9 {
  234
+  padding-right: 360px;
  235
+}
  236
+
  237
+.container_24 .prefix_10 {
  238
+  padding-right: 400px;
  239
+}
  240
+
  241
+.container_24 .prefix_11 {
  242
+  padding-right: 440px;
  243
+}
  244
+
  245
+.container_24 .prefix_12 {
  246
+  padding-right: 480px;
  247
+}
  248
+
  249
+.container_24 .prefix_13 {
  250
+  padding-right: 520px;
  251
+}
  252
+
  253
+.container_24 .prefix_14 {
  254
+  padding-right: 560px;
  255
+}
  256
+
  257
+.container_24 .prefix_15 {
  258
+  padding-right: 600px;
  259
+}
  260
+
  261
+.container_24 .prefix_16 {
  262
+  padding-right: 640px;
  263
+}
  264
+
  265
+.container_24 .prefix_17 {
  266
+  padding-right: 680px;
  267
+}
  268
+
  269
+.container_24 .prefix_18 {
  270
+  padding-right: 720px;
  271
+}
  272
+
  273
+.container_24 .prefix_19 {
  274
+  padding-right: 760px;
  275
+}
  276
+
  277
+.container_24 .prefix_20 {
  278
+  padding-right: 800px;
  279
+}
  280
+
  281
+.container_24 .prefix_21 {
  282
+  padding-right: 840px;
  283
+}
  284
+
  285
+.container_24 .prefix_22 {
  286
+  padding-right: 880px;
  287
+}
  288
+
  289
+.container_24 .prefix_23 {
  290
+  padding-right: 920px;
  291
+}
  292
+
  293
+/* `Suffix Extra Space >> 24 Columns
  294
+----------------------------------------------------------------------------------------------------*/
  295
+
  296
+.container_24 .suffix_1 {
  297
+  padding-left: 40px;
  298
+}
  299
+
  300
+.container_24 .suffix_2 {
  301
+  padding-left: 80px;
  302
+}
  303
+
  304
+.container_24 .suffix_3 {
  305
+  padding-left: 120px;
  306
+}
  307
+
  308
+.container_24 .suffix_4 {
  309
+  padding-left: 160px;
  310
+}
  311
+
  312
+.container_24 .suffix_5 {
  313
+  padding-left: 200px;
  314
+}
  315
+
  316
+.container_24 .suffix_6 {
  317
+  padding-left: 240px;
  318
+}
  319
+
  320
+.container_24 .suffix_7 {
  321
+  padding-left: 280px;
  322
+}
  323
+
  324
+.container_24 .suffix_8 {
  325
+  padding-left: 320px;
  326
+}
  327
+
  328
+.container_24 .suffix_9 {
  329
+  padding-left: 360px;
  330
+}
  331
+
  332
+.container_24 .suffix_10 {
  333
+  padding-left: 400px;
  334
+}
  335
+
  336
+.container_24 .suffix_11 {
  337
+  padding-left: 440px;
  338
+}
  339
+
  340
+.container_24 .suffix_12 {
  341
+  padding-left: 480px;
  342
+}
  343
+
  344
+.container_24 .suffix_13 {
  345
+  padding-left: 520px;
  346
+}
  347
+
  348
+.container_24 .suffix_14 {
  349
+  padding-left: 560px;
  350
+}
  351
+
  352
+.container_24 .suffix_15 {
  353
+  padding-left: 600px;
  354
+}
  355
+
  356
+.container_24 .suffix_16 {
  357
+  padding-left: 640px;
  358
+}
  359
+
  360
+.container_24 .suffix_17 {
  361
+  padding-left: 680px;
  362
+}
  363
+
  364
+.container_24 .suffix_18 {
  365
+  padding-left: 720px;
  366
+}
  367
+
  368
+.container_24 .suffix_19 {
  369
+  padding-left: 760px;
  370
+}
  371
+
  372
+.container_24 .suffix_20 {
  373
+  padding-left: 800px;
  374
+}
  375
+
  376
+.container_24 .suffix_21 {
  377
+  padding-left: 840px;
  378
+}
  379
+
  380
+.container_24 .suffix_22 {
  381
+  padding-left: 880px;
  382
+}
  383
+
  384
+.container_24 .suffix_23 {
  385
+  padding-left: 920px;
  386
+}
  387
+
  388
+/* `Push Space >> 24 Columns
  389
+----------------------------------------------------------------------------------------------------*/
  390
+
  391
+.container_24 .push_1 {
  392
+  right: 40px;
  393
+}
  394
+
  395
+.container_24 .push_2 {
  396
+  right: 80px;
  397
+}
  398
+
  399
+.container_24 .push_3 {
  400
+  right: 120px;
  401
+}
  402
+
  403
+.container_24 .push_4 {
  404
+  right: 160px;
  405
+}
  406
+
  407
+.container_24 .push_5 {
  408
+  right: 200px;
  409
+}
  410
+
  411
+.container_24 .push_6 {
  412
+  right: 240px;
  413
+}
  414
+
  415
+.container_24 .push_7 {
  416
+  right: 280px;
  417
+}
  418
+
  419
+.container_24 .push_8 {
  420
+  right: 320px;
  421
+}
  422
+
  423
+.container_24 .push_9 {
  424
+  right: 360px;
  425
+}
  426
+
  427
+.container_24 .push_10 {
  428
+  right: 400px;
  429
+}
  430
+
  431
+.container_24 .push_11 {
  432
+  right: 440px;
  433
+}
  434
+
  435
+.container_24 .push_12 {
  436
+  right: 480px;
  437
+}
  438
+
  439
+.container_24 .push_13 {
  440
+  right: 520px;
  441
+}
  442
+
  443
+.container_24 .push_14 {
  444
+  right: 560px;
  445
+}
  446
+
  447
+.container_24 .push_15 {
  448
+  right: 600px;
  449
+}
  450
+
  451
+.container_24 .push_16 {
  452
+  right: 640px;
  453
+}
  454
+
  455
+.container_24 .push_17 {
  456
+  right: 680px;
  457
+}
  458
+
  459
+.container_24 .push_18 {
  460
+  right: 720px;
  461
+}
  462
+
  463
+.container_24 .push_19 {
  464
+  right: 760px;
  465
+}
  466
+
  467
+.container_24 .push_20 {
  468
+  right: 800px;
  469
+}
  470
+
  471
+.container_24 .push_21 {
  472
+  right: 840px;
  473
+}
  474
+
  475
+.container_24 .push_22 {
  476
+  right: 880px;
  477
+}
  478
+
  479
+.container_24 .push_23 {
  480
+  right: 920px;
  481
+}
  482
+
  483
+/* `Pull Space >> 24 Columns
  484
+----------------------------------------------------------------------------------------------------*/
  485
+
  486
+.container_24 .pull_1 {
  487
+  right: -40px;
  488
+}
  489
+
  490
+.container_24 .pull_2 {
  491
+  right: -80px;
  492
+}
  493
+
  494
+.container_24 .pull_3 {
  495
+  right: -120px;
  496
+}
  497
+
  498
+.container_24 .pull_4 {
  499
+  right: -160px;
  500
+}
  501
+
  502
+.container_24 .pull_5 {
  503
+  right: -200px;
  504
+}
  505
+
  506
+.container_24 .pull_6 {
  507
+  right: -240px;
  508
+}
  509
+
  510
+.container_24 .pull_7 {
  511
+  right: -280px;
  512
+}
  513
+
  514
+.container_24 .pull_8 {
  515
+  right: -320px;
  516
+}
  517
+
  518
+.container_24 .pull_9 {
  519
+  right: -360px;
  520
+}
  521
+
  522
+.container_24 .pull_10 {
  523
+  right: -400px;
  524
+}
  525
+
  526
+.container_24 .pull_11 {
  527
+  right: -440px;
  528
+}
  529
+
  530
+.container_24 .pull_12 {
  531
+  right: -480px;
  532
+}
  533
+
  534
+.container_24 .pull_13 {
  535
+  right: -520px;
  536
+}
  537
+
  538
+.container_24 .pull_14 {
  539
+  right: -560px;
  540
+}
  541
+
  542
+.container_24 .pull_15 {
  543
+  right: -600px;
  544
+}
  545
+
  546
+.container_24 .pull_16 {
  547
+  right: -640px;
  548
+}
  549
+
  550
+.container_24 .pull_17 {
  551
+  right: -680px;
  552
+}
  553
+
  554
+.container_24 .pull_18 {
  555
+  right: -720px;
  556
+}
  557
+
  558
+.container_24 .pull_19 {
  559
+  right: -760px;
  560
+}
  561
+
  562
+.container_24 .pull_20 {
  563
+  right: -800px;
  564
+}
  565
+
  566
+.container_24 .pull_21 {
  567
+  right: -840px;
  568
+}
  569
+
  570
+.container_24 .pull_22 {
  571
+  right: -880px;
  572
+}
  573
+
  574
+.container_24 .pull_23 {
  575
+  right: -920px;
  576
+}
  577
+
  578
+/* `Clear Floated Elements
  579
+----------------------------------------------------------------------------------------------------*/
  580
+
  581
+/* http://sonspring.com/journal/clearing-floats */
  582
+
  583
+.clear {
  584
+  clear: both;
  585
+  display: block;
  586
+  overflow: hidden;
  587
+  visibility: hidden;
  588
+  width: 0;
  589
+  height: 0;
  590
+}
  591
+
  592
+/* http://www.yuiblog.com/blog/2010/09/27/clearfix-reloaded-overflowhidden-demystified */
  593
+
  594
+.clearfix:before,
  595
+.clearfix:after,
  596
+.container_24:before,
  597
+.container_24:after {
  598
+  content: '.';
  599
+  display: block;
  600
+  overflow: hidden;
  601
+  visibility: hidden;
  602
+  font-size: 0;
  603
+  line-height: 0;
  604
+  width: 0;
  605
+  height: 0;
  606
+}
  607
+
  608
+.clearfix:after,
  609
+.container_24:after {
  610
+  clear: both;
  611
+}
  612
+
  613
+/*
  614
+  The following zoom:1 rule is specifically for IE6 + IE7.
  615
+  Move to separate stylesheet if invalid CSS is a problem.
  616
+*/
  617
+
  618
+.clearfix,
  619
+.container_24 {
  620
+  zoom: 1;
  621
+}
653  catalog/ext/960gs/960_rtl.css
... ...
@@ -0,0 +1,653 @@
  1
+/*
  2
+  960 Grid System ~ Core CSS.
  3
+  Learn more ~ http://960.gs/
  4
+
  5
+  Licensed under GPL and MIT.
  6
+*/
  7
+
  8
+/*
  9
+  Forces backgrounds to span full width,
  10
+  even if there is horizontal scrolling.
  11
+  Increase this if your layout is wider.
  12
+
  13
+  Note: IE6 works fine without this fix.
  14
+*/
  15
+
  16
+body {
  17
+  min-width: 960px;
  18
+}
  19
+
  20
+/* `Container
  21
+----------------------------------------------------------------------------------------------------*/
  22
+
  23
+.container_12,
  24
+.container_16 {
  25
+  margin-right: auto;
  26
+  margin-left: auto;
  27
+  width: 960px;
  28
+}
  29
+
  30
+/* `Grid >> Global
  31
+----------------------------------------------------------------------------------------------------*/
  32
+
  33
+.grid_1,
  34
+.grid_2,
  35
+.grid_3,
  36
+.grid_4,
  37
+.grid_5,
  38
+.grid_6,
  39
+.grid_7,
  40
+.grid_8,
  41
+.grid_9,
  42
+.grid_10,
  43
+.grid_11,
  44
+.grid_12,
  45
+.grid_13,
  46
+.grid_14,
  47
+.grid_15,
  48
+.grid_16 {
  49
+  display: inline;
  50
+  float: right;
  51
+  margin-right: 10px;
  52
+  margin-left: 10px;
  53
+}
  54
+
  55
+.push_1, .pull_1,
  56
+.push_2, .pull_2,
  57
+.push_3, .pull_3,
  58
+.push_4, .pull_4,
  59
+.push_5, .pull_5,
  60
+.push_6, .pull_6,
  61
+.push_7, .pull_7,
  62
+.push_8, .pull_8,
  63
+.push_9, .pull_9,
  64
+.push_10, .pull_10,
  65
+.push_11, .pull_11,
  66
+.push_12, .pull_12,
  67
+.push_13, .pull_13,
  68
+.push_14, .pull_14,
  69
+.push_15, .pull_15 {
  70
+  position: relative;
  71
+}
  72
+
  73
+.container_12 .grid_3,
  74
+.container_16 .grid_4 {
  75
+  width: 220px;
  76
+}
  77
+
  78
+.container_12 .grid_6,
  79
+.container_16 .grid_8 {
  80
+  width: 460px;
  81
+}
  82
+
  83
+.container_12 .grid_9,
  84
+.container_16 .grid_12 {
  85
+  width: 700px;
  86
+}
  87
+
  88
+.container_12 .grid_12,
  89
+.container_16 .grid_16 {
  90
+  width: 940px;
  91
+}
  92
+
  93
+/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
  94
+----------------------------------------------------------------------------------------------------*/
  95
+
  96
+.alpha {
  97
+  margin-right: 0;
  98
+}
  99
+
  100
+.omega {
  101
+  margin-left: 0;
  102
+}
  103
+
  104
+/* `Grid >> 12 Columns
  105
+----------------------------------------------------------------------------------------------------*/
  106
+
  107
+.container_12 .grid_1 {
  108
+  width: 60px;
  109
+}
  110
+
  111
+.container_12 .grid_2 {
  112
+  width: 140px;
  113
+}
  114
+
  115
+.container_12 .grid_4 {
  116
+  width: 300px;
  117
+}
  118
+
  119
+.container_12 .grid_5 {
  120
+  width: 380px;
  121
+}
  122
+
  123
+.container_12 .grid_7 {
  124
+  width: 540px;
  125
+}
  126
+
  127
+.container_12 .grid_8 {
  128
+  width: 620px;
  129
+}
  130
+
  131
+.container_12 .grid_10 {
  132
+  width: 780px;
  133
+}
  134
+
  135
+.container_12 .grid_11 {
  136
+  width: 860px;
  137
+}
  138
+
  139
+/* `Grid >> 16 Columns
  140
+----------------------------------------------------------------------------------------------------*/
  141
+
  142
+.container_16 .grid_1 {
  143
+  width: 40px;
  144
+}
  145
+
  146
+.container_16 .grid_2 {
  147
+  width: 100px;
  148
+}
  149
+
  150
+.container_16 .grid_3 {
  151
+  width: 160px;
  152
+}
  153
+
  154
+.container_16 .grid_5 {
  155
+  width: 280px;
  156
+}
  157
+
  158
+.container_16 .grid_6 {
  159
+  width: 340px;
  160
+}
  161
+
  162
+.container_16 .grid_7 {
  163
+  width: 400px;
  164
+}
  165
+
  166
+.container_16 .grid_9 {
  167
+  width: 520px;
  168
+}
  169
+
  170
+.container_16 .grid_10 {
  171
+  width: 580px;
  172
+}
  173
+
  174
+.container_16 .grid_11 {
  175
+  width: 640px;
  176
+}
  177
+
  178
+.container_16 .grid_13 {
  179
+  width: 760px;
  180
+}
  181
+
  182
+.container_16 .grid_14 {
  183
+  width: 820px;
  184
+}
  185
+
  186
+.container_16 .grid_15 {
  187
+  width: 880px;
  188
+}
  189
+
  190
+/* `Prefix Extra Space >> Global
  191
+----------------------------------------------------------------------------------------------------*/
  192
+
  193
+.container_12 .prefix_3,
  194
+.container_16 .prefix_4 {
  195
+  padding-right: 240px;
  196
+}
  197
+
  198
+.container_12 .prefix_6,
  199
+.container_16 .prefix_8 {
  200
+  padding-right: 480px;
  201
+}
  202
+
  203
+.container_12 .prefix_9,
  204
+.container_16 .prefix_12 {
  205
+  padding-right: 720px;
  206
+}
  207
+
  208
+/* `Prefix Extra Space >> 12 Columns
  209
+----------------------------------------------------------------------------------------------------*/
  210
+
  211
+.container_12 .prefix_1 {
  212
+  padding-right: 80px;
  213
+}
  214
+
  215
+.container_12 .prefix_2 {
  216
+  padding-right: 160px;
  217
+}
  218
+
  219
+.container_12 .prefix_4 {
  220
+  padding-right: 320px;
  221
+}
  222
+
  223
+.container_12 .prefix_5 {
  224
+  padding-right: 400px;
  225
+}
  226
+
  227
+.container_12 .prefix_7 {
  228
+  padding-right: 560px;
  229
+}
  230
+
  231
+.container_12 .prefix_8 {
  232
+  padding-right: 640px;
  233
+}
  234
+
  235
+.container_12 .prefix_10 {
  236
+  padding-right: 800px;
  237
+}
  238
+
  239
+.container_12 .prefix_11 {
  240
+  padding-right: 880px;
  241
+}
  242
+
  243
+/* `Prefix Extra Space >> 16 Columns
  244
+----------------------------------------------------------------------------------------------------*/
  245
+
  246
+.container_16 .prefix_1 {
  247
+  padding-right: 60px;
  248
+}
  249
+
  250
+.container_16 .prefix_2 {
  251
+  padding-right: 120px;
  252
+}
  253
+
  254
+.container_16 .prefix_3 {
  255
+  padding-right: 180px;
  256
+}
  257
+
  258
+.container_16 .prefix_5 {
  259
+  padding-right: 300px;
  260
+}
  261
+
  262
+.container_16 .prefix_6 {
  263
+  padding-right: 360px;
  264
+}
  265
+
  266
+.container_16 .prefix_7 {
  267
+  padding-right: 420px;
  268
+}
  269
+
  270
+.container_16 .prefix_9 {
  271
+  padding-right: 540px;
  272
+}
  273
+
  274
+.container_16 .prefix_10 {
  275
+  padding-right: 600px;
  276
+}
  277
+
  278
+.container_16 .prefix_11 {
  279
+  padding-right: 660px;
  280
+}
  281
+
  282
+.container_16 .prefix_13 {
  283
+  padding-right: 780px;
  284
+}
  285
+
  286
+.container_16 .prefix_14 {
  287
+  padding-right: 840px;
  288
+}
  289
+
  290
+.container_16 .prefix_15 {
  291
+  padding-right: 900px;
  292
+}
  293
+
  294
+/* `Suffix Extra Space >> Global
  295
+----------------------------------------------------------------------------------------------------*/
  296
+
  297
+.container_12 .suffix_3,
  298
+.container_16 .suffix_4 {
  299
+  padding-left: 240px;
  300
+}
  301
+
  302
+.container_12 .suffix_6,
  303
+.container_16 .suffix_8 {
  304
+  padding-left: 480px;
  305
+}
  306
+
  307
+.container_12 .suffix_9,
  308
+.container_16 .suffix_12 {
  309
+  padding-left: 720px;
  310
+}
  311
+
  312
+/* `Suffix Extra Space >> 12 Columns
  313
+----------------------------------------------------------------------------------------------------*/
  314
+
  315
+.container_12 .suffix_1 {
  316
+  padding-left: 80px;
  317
+}
  318
+
  319
+.container_12 .suffix_2 {
  320
+  padding-left: 160px;
  321
+}
  322
+
  323
+.container_12 .suffix_4 {
  324
+  padding-left: 320px;
  325
+}
  326
+
  327
+.container_12 .suffix_5 {
  328
+  padding-left: 400px;
  329
+}
  330
+
  331
+.container_12 .suffix_7 {
  332
+  padding-left: 560px;
  333
+}
  334
+
  335
+.container_12 .suffix_8 {
  336
+  padding-left: 640px;
  337
+}
  338
+
  339
+.container_12 .suffix_10 {
  340
+  padding-left: 800px;
  341
+}
  342
+
  343
+.container_12 .suffix_11 {
  344
+  padding-left: 880px;
  345
+}
  346
+
  347
+/* `Suffix Extra Space >> 16 Columns
  348
+----------------------------------------------------------------------------------------------------*/
  349
+
  350
+.container_16 .suffix_1 {
  351
+  padding-left: 60px;
  352
+}
  353
+
  354
+.container_16 .suffix_2 {
  355
+  padding-left: 120px;
  356
+}
  357
+
  358
+.container_16 .suffix_3 {
  359
+  padding-left: 180px;
  360
+}
  361
+
  362
+.container_16 .suffix_5 {
  363
+  padding-left: 300px;
  364
+}
  365
+
  366
+.container_16 .suffix_6 {
  367
+  padding-left: 360px;
  368
+}
  369
+
  370
+.container_16 .suffix_7 {
  371
+  padding-left: 420px;
  372
+}
  373
+
  374
+.container_16 .suffix_9 {
  375
+  padding-left: 540px;
  376
+}
  377
+
  378
+.container_16 .suffix_10 {
  379
+  padding-left: 600px;
  380
+}
  381
+
  382
+.container_16 .suffix_11 {
  383
+  padding-left: 660px;
  384
+}
  385
+
  386
+.container_16 .suffix_13 {
  387
+  padding-left: 780px;
  388
+}
  389
+
  390
+.container_16 .suffix_14 {
  391
+  padding-left: 840px;
  392
+}
  393
+
  394
+.container_16 .suffix_15 {
  395
+  padding-left: 900px;
  396
+}
  397
+
  398
+/* `Push Space >> Global
  399
+----------------------------------------------------------------------------------------------------*/
  400
+
  401
+.container_12 .push_3,
  402
+.container_16 .push_4 {
  403
+  right: 240px;
  404
+}
  405
+
  406
+.container_12 .push_6,
  407
+.container_16 .push_8 {
  408
+  right: 480px;
  409
+}
  410
+
  411
+.container_12 .push_9,
  412
+.container_16 .push_12 {
  413
+  right: 720px;
  414
+}
  415
+
  416
+/* `Push Space >> 12 Columns
  417
+----------------------------------------------------------------------------------------------------*/
  418
+
  419
+.container_12 .push_1 {
  420
+  right: 80px;
  421
+}
  422
+
  423
+.container_12 .push_2 {
  424
+  right: 160px;
  425
+}
  426
+
  427
+.container_12 .push_4 {
  428
+  right: 320px;
  429
+}
  430
+
  431
+.container_12 .push_5 {
  432
+  right: 400px;
  433
+}
  434
+
  435
+.container_12 .push_7 {
  436
+  right: 560px;
  437
+}
  438
+
  439
+.container_12 .push_8 {
  440
+  right: 640px;
  441
+}
  442
+
  443
+.container_12 .push_10 {
  444
+  right: 800px;
  445
+}
  446
+
  447
+.container_12 .push_11 {
  448
+  right: 880px;
  449
+}
  450
+
  451
+/* `Push Space >> 16 Columns
  452
+----------------------------------------------------------------------------------------------------*/
  453
+
  454
+.container_16 .push_1 {
  455
+  right: 60px;
  456
+}
  457
+
  458
+.container_16 .push_2 {
  459
+  right: 120px;
  460
+}
  461
+
  462
+.container_16 .push_3 {
  463
+  right: 180px;
  464
+}
  465
+
  466
+.container_16 .push_5 {
  467
+  right: 300px;
  468
+}
  469
+
  470
+.container_16 .push_6 {
  471
+  right: 360px;
  472
+}
  473
+
  474
+.container_16 .push_7 {
  475
+  right: 420px;
  476
+}
  477
+
  478
+.container_16 .push_9 {
  479
+  right: 540px;
  480
+}
  481
+
  482
+.container_16 .push_10 {
  483
+  right: 600px;
  484
+}
  485
+
  486
+.container_16 .push_11 {
  487
+  right: 660px;
  488
+}
  489
+
  490
+.container_16 .push_13 {
  491
+  right: 780px;
  492
+}
  493
+
  494
+.container_16 .push_14 {
  495
+  right: 840px;
  496
+}
  497
+
  498
+.container_16 .push_15 {
  499
+  right: 900px;
  500
+}
  501
+
  502
+/* `Pull Space >> Global
  503
+----------------------------------------------------------------------------------------------------*/
  504
+
  505
+.container_12 .pull_3,
  506
+.container_16 .pull_4 {
  507
+  right: -240px;
  508
+}
  509
+
  510
+.container_12 .pull_6,
  511
+.container_16 .pull_8 {
  512
+  right: -480px;
  513
+}
  514
+
  515
+.container_12 .pull_9,
  516
+.container_16 .pull_12 {
  517
+  right: -720px;
  518
+}
  519
+
  520
+/* `Pull Space >> 12 Columns
  521
+----------------------------------------------------------------------------------------------------*/
  522
+
  523
+.container_12 .pull_1 {
  524
+  right: -80px;
  525
+}
  526
+