zen-grids 2.0.0.beta.1 → 2.0.0.beta.2

Sign up to get free protection for your applications and to get access to all the features.
Files changed (62) hide show
  1. checksums.yaml +7 -7
  2. data/.travis.yml +13 -0
  3. data/README.md +81 -0
  4. data/bower.json +14 -12
  5. data/sache.json +5 -0
  6. data/templates/project/_base-elements.scss +22 -0
  7. data/templates/project/_components.scss +73 -0
  8. data/templates/project/_init.scss +14 -4
  9. data/templates/project/_layouts.scss +143 -0
  10. data/templates/project/_visually-hidden.scss +2 -18
  11. data/templates/project/example.html +53 -24
  12. data/templates/project/manifest.rb +3 -2
  13. data/templates/project/styles.scss +3 -2
  14. data/tests/Gemfile +11 -0
  15. data/tests/README.md +16 -0
  16. data/tests/Rakefile +25 -0
  17. data/tests/config.rb +22 -0
  18. data/tests/controls/compass-compatibility.css +112 -0
  19. data/{templates/unit-tests/test-results → tests/controls}/function-zen-direction-switch.css +1 -1
  20. data/{templates/unit-tests/test-results → tests/controls}/function-zen-grid-item-width.css +0 -0
  21. data/{templates/unit-tests/test-results → tests/controls}/function-zen-half-gutter.css +0 -0
  22. data/{templates/unit-tests/test-results → tests/controls}/function-zen-unit-width.css +0 -0
  23. data/{templates/unit-tests/test-results → tests/controls}/zen-float.css +0 -0
  24. data/{templates/unit-tests/test-results/zen-grid-flow-item.css → tests/controls/zen-flow-item-width.css} +21 -55
  25. data/tests/controls/zen-grid-background.css +52 -0
  26. data/{templates/unit-tests/test-results → tests/controls}/zen-grid-container.css +20 -5
  27. data/{templates/unit-tests/test-results → tests/controls}/zen-grid-item-base.css +9 -12
  28. data/{templates/unit-tests/test-results → tests/controls}/zen-grid-item.css +14 -2
  29. data/{templates/unit-tests/test-results → tests/controls}/zen-new-row.css +0 -0
  30. data/tests/tests/compass-compatibility.scss +55 -0
  31. data/{templates/unit-tests/sass → tests/tests}/function-zen-direction-switch.scss +1 -0
  32. data/{templates/unit-tests/sass → tests/tests}/function-zen-grid-item-width.scss +6 -6
  33. data/{templates/unit-tests/sass → tests/tests}/function-zen-half-gutter.scss +2 -2
  34. data/{templates/unit-tests/sass → tests/tests}/function-zen-unit-width.scss +12 -12
  35. data/{templates/unit-tests/sass → tests/tests}/zen-float.scss +3 -3
  36. data/tests/tests/zen-flow-item-width.scss +85 -0
  37. data/tests/tests/zen-grid-background.scss +85 -0
  38. data/tests/tests/zen-grid-container.scss +49 -0
  39. data/tests/tests/zen-grid-item-base.scss +65 -0
  40. data/tests/tests/zen-grid-item.scss +101 -0
  41. data/{templates/unit-tests/sass → tests/tests}/zen-new-row.scss +3 -3
  42. data/tests/unit_tests.rb +57 -0
  43. data/zen-grids.gemspec +4 -45
  44. data/zen-grids/_background.scss +97 -157
  45. data/zen-grids/_flow.scss +39 -22
  46. data/zen-grids/_functions.scss +119 -0
  47. data/zen-grids/_grids.scss +71 -171
  48. data/zen-grids/_variables.scss +65 -0
  49. data/zen-grids/internal/_functions-compass-polyfill.scss +70 -0
  50. data/zen-grids/internal/_variables-background.scss +57 -0
  51. metadata +80 -69
  52. data/README.txt +0 -88
  53. data/templates/project/_layout.scss +0 -117
  54. data/templates/project/_modules.scss +0 -78
  55. data/templates/unit-tests/README.txt +0 -16
  56. data/templates/unit-tests/manifest.rb +0 -37
  57. data/templates/unit-tests/sass/zen-grid-background.scss +0 -80
  58. data/templates/unit-tests/sass/zen-grid-container.scss +0 -44
  59. data/templates/unit-tests/sass/zen-grid-flow-item.scss +0 -78
  60. data/templates/unit-tests/sass/zen-grid-item-base.scss +0 -59
  61. data/templates/unit-tests/sass/zen-grid-item.scss +0 -91
  62. data/templates/unit-tests/test-results/zen-grid-background.css +0 -60
data/tests/controls/zen-grid-background.css ADDED
@@ -0,0 +1,52 @@
1
+ /**
2
+ * @file
3
+ * Test zen-grid-background()
4
+ */
5
+ #test-zen-grid-background {
6
+ /* Test zen-grid-background() with 1 column grid and 20px gutter */
7
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 50% top no-repeat, -moz-linear-gradient(left, #ffdede 50%, rgba(0, 0, 0, 0) 50%) 10px top no-repeat, -moz-linear-gradient(left, rgba(0, 0, 0, 0) 50%, #ffdede 50%) -10px top no-repeat;
8
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 50% top no-repeat, -o-linear-gradient(left, #ffdede 50%, rgba(0, 0, 0, 0) 50%) 10px top no-repeat, -o-linear-gradient(left, rgba(0, 0, 0, 0) 50%, #ffdede 50%) -10px top no-repeat;
9
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 50% top no-repeat, -webkit-linear-gradient(left, #ffdede 50%, rgba(0, 0, 0, 0) 50%) 10px top no-repeat, -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 50%, #ffdede 50%) -10px top no-repeat;
10
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 50% top no-repeat, linear-gradient(to right, #ffdede 50%, rgba(0, 0, 0, 0) 50%) 10px top no-repeat, linear-gradient(to right, rgba(0, 0, 0, 0) 50%, #ffdede 50%) -10px top no-repeat;
11
+ /* Test zen-grid-background() with margin gutter method, 5 column grid and 5% gutter */
12
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 8% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAdBJREFUeNqslL9LQlEUx3367AdamdCQaVjQ0uAQBS+hxbVBhEcESoOG/0SDS9HakDYGEU0huLa1GW4tGtkkURBlQRn4LPseOBdej0u+ygsffByvH98995zj6Ha7DqIfizyKkCmKYv1eBaPAB4ZpP3gDz/zZ+Y1wAEyBeTAH/OATPIBrUAP3oG0VOiRHVli2nslkTmu12pNhGF2iUqncxePxI3yngwDv7SkcAstYeSEy02w229FodB97NN77TeiU5NYDJlOp1KII5HK5y2QyWaZnr9frxvMSv6HH+mOZkPI3EgwGfSJQr9db5g2hUGiMZW47wg/QUlXVMAd1XQ+I50aj8cI3bUhrx5JD+ucI2ADb4DASiZyZ80j5pTzLcigTOlkaBqtgp1gs3ghZqVS6QmyTTm73lkXpTIBEOp0umm9Y07QDxFdkF/KTcBAsgC3k61UI8/n8BWJJrlOnXaEo7BQJhKxarTYR2+OiDnM1OOwWtkbFS0cUwlgsdo74MdgFa2AauOwIqW8ThUKhLOsUIpvNnmBPlIdGz06h1fH7/a6/jDDZtKEjz/ClzFrfAuudpw1d0C03wo/jS2HpOM9Da3tRd1CnPNodX/+a2H0XfgkwAIVYVeQ1/9a6AAAAAElFTkSuQmCC") 29% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAe5JREFUeNqslM1LAkEYxnX7lL62CAmTwENkhyKwDkZg185dgvDQwS7RUQkvkRfzKNQfIF5CukjRJelk4EWwDmVUEJinaNlSMLPWnhdmYFvWGqiFH44z8z7zzjPvjKXZbFqI//hIx8rFrFarfkwCNiCDPtABNFADKngFH6KC1BgEE2ASOEE3E1DALbgCZfBuFLSYbJmC51wu1046nb5pNBpNTrFYVEKh0DHGV8AoW/xXQTsFJJPJC72YHq/Xu485Xrb4N0HJxFvybsjtdtt5Rzwev04kEvf8v9/v97CFbcbgdhPBT/AmSZLGOxRFaRgyoa22scP7VbACih6PZ5cdzAjoSqVS03xCoVB4wM8zLWxaOwYPaZEBMAXWI5HIud6/TCZTQv82mBX18MfP5/M5Y7HYAprDlLlIhpTdPNgEe+AQHOVyuSeeJZUT+taAQyRDuhnufD6/heANsBwOh8ey2ewTn+BwOPrZCXcYg80EycMeTdNa2lGpVN5ZNWgiglQitWq1Wtd3yrLcydvlclll1VAX8ZAehCUYf9rqpgQCgQPMWQS9IlePtuyiCxGNRs9UVa1zoVKpVA0GgycYWwVjrLiFnq9OFjADxlkm5NcLuAOX4NHstWklyEVlBvfvjb2HL8xri8iW//Ri/7vglwADAMZnRpCsTg8QAAAAAElFTkSuQmCC") 50% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAW5JREFUeNqslDFLw0AYhpOaSFuiDjqViiUKVhACDpJCQycX/TVChCz+Evf8ALtlCGZyCW6uOiR4QusgSgtmiO/BBZJ4l1qSg4dwd19e7vvuvU9K01SiNDGojpyJybLMi9kEu2AHqGwtAZ/gA/ysI6iAPjgHx6DD1pfgGTwCUhaUKlLeBheO49wnSZLmwfotGPJSblWUZAscmKY55Ox1ciUoDJGgwmrXm0wmg3UuRiTYpWK2bY80TVN93yd1BWm6/fF4fEgnQRDM6ggW0iWELKbT6byOYCFdz/OIwJ9d3sW0BOn2LMvS6cR13TeBpfaZ4f96p+TDI3ATRdF32X8ZcRx/IeYa6P/x4YbIY7kfZZEXeYL0rS7wFIUdg+0tWWxxj/OW98AZOM0ag2EYgzAMr7IAVVXv8PHAA5jnU1Y4B6Cd5Am8sJvU2+32ZSnmHbyy2JUnLOzTGwcjcMLqVtltVgnyemJlP5Sa7tiNC/4KMAAbxb+98QKR2gAAAABJRU5ErkJggg==") 71% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAc5JREFUeNqslM9KAlEUxp0xzSTNDHMoCiIKKRChXbgIAldKEK5y4Up9A5dufAMRRB8gwnW7lkV/EBcR0WzaBMEQFRNFlkNO34E7MU23msyBHzNz58x373fOPdeh67qDGMRFOkOccQEMg3EwBlyW7xp4AHega/2ZJ0gCM2AFLIARy/cOkMEJuAZvX5ZpsRwEyUajsa9pms4jn89vI2bVOhnpiJwVkt2JcDg82U8eeZZpEqd5IJPJHDebzVtmj3J3BBReDsU/LoAEn1keSazXl2AikQghd0mw2Wq10vF4nAo2DTx9CWaz2XnjORaLSYVCYR2Pc8BnR5BsdURR/NgO1Wr1rFKpnBvvkUiEChYCXjtFobx0U6nUHu4XxgSlUmnZCJAkycfEXHYE3dQh7XY7HY1Gp2igXC63e72e1Y2T55BnmQI9ZgG/3+/Fu5OTGltVfqFelWX5xhgIBAJuc4CiKI+4PbG+dvzWeqNgLZfL7XzXevV6/QAxG9RRVi2eIFmbBVvFYnEXK703hFRVfa3Vaoe0k8Aiy/cnQcEQEwTBWhjauEvsxAmyicjmJTgFVyw9uh1BYwf4KYXsVBFYu6nsPOyaxX6y/K8TW3QM+HoXYACXiuXQRCn2XAAAAABJRU5ErkJggg==") 92% top no-repeat, -moz-linear-gradient(left, #ffdede 16%, rgba(0, 0, 0, 0) 16%, rgba(0, 0, 0, 0) 21%, #ffdede 21%, #ffdede 37%, rgba(0, 0, 0, 0) 37%, rgba(0, 0, 0, 0) 42%, #ffdede 42%, #ffdede 58%, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0) 63%, #ffdede 63%, #ffdede 79%, rgba(0, 0, 0, 0) 79%, rgba(0, 0, 0, 0) 84%, #ffdede 84%) left top no-repeat;
13
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 8% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAdBJREFUeNqslL9LQlEUx3367AdamdCQaVjQ0uAQBS+hxbVBhEcESoOG/0SDS9HakDYGEU0huLa1GW4tGtkkURBlQRn4LPseOBdej0u+ygsffByvH98995zj6Ha7DqIfizyKkCmKYv1eBaPAB4ZpP3gDz/zZ+Y1wAEyBeTAH/OATPIBrUAP3oG0VOiRHVli2nslkTmu12pNhGF2iUqncxePxI3yngwDv7SkcAstYeSEy02w229FodB97NN77TeiU5NYDJlOp1KII5HK5y2QyWaZnr9frxvMSv6HH+mOZkPI3EgwGfSJQr9db5g2hUGiMZW47wg/QUlXVMAd1XQ+I50aj8cI3bUhrx5JD+ucI2ADb4DASiZyZ80j5pTzLcigTOlkaBqtgp1gs3ghZqVS6QmyTTm73lkXpTIBEOp0umm9Y07QDxFdkF/KTcBAsgC3k61UI8/n8BWJJrlOnXaEo7BQJhKxarTYR2+OiDnM1OOwWtkbFS0cUwlgsdo74MdgFa2AauOwIqW8ThUKhLOsUIpvNnmBPlIdGz06h1fH7/a6/jDDZtKEjz/ClzFrfAuudpw1d0C03wo/jS2HpOM9Da3tRd1CnPNodX/+a2H0XfgkwAIVYVeQ1/9a6AAAAAElFTkSuQmCC") 29% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAe5JREFUeNqslM1LAkEYxnX7lL62CAmTwENkhyKwDkZg185dgvDQwS7RUQkvkRfzKNQfIF5CukjRJelk4EWwDmVUEJinaNlSMLPWnhdmYFvWGqiFH44z8z7zzjPvjKXZbFqI//hIx8rFrFarfkwCNiCDPtABNFADKngFH6KC1BgEE2ASOEE3E1DALbgCZfBuFLSYbJmC51wu1046nb5pNBpNTrFYVEKh0DHGV8AoW/xXQTsFJJPJC72YHq/Xu485Xrb4N0HJxFvybsjtdtt5Rzwev04kEvf8v9/v97CFbcbgdhPBT/AmSZLGOxRFaRgyoa22scP7VbACih6PZ5cdzAjoSqVS03xCoVB4wM8zLWxaOwYPaZEBMAXWI5HIud6/TCZTQv82mBX18MfP5/M5Y7HYAprDlLlIhpTdPNgEe+AQHOVyuSeeJZUT+taAQyRDuhnufD6/heANsBwOh8ey2ewTn+BwOPrZCXcYg80EycMeTdNa2lGpVN5ZNWgiglQitWq1Wtd3yrLcydvlclll1VAX8ZAehCUYf9rqpgQCgQPMWQS9IlePtuyiCxGNRs9UVa1zoVKpVA0GgycYWwVjrLiFnq9OFjADxlkm5NcLuAOX4NHstWklyEVlBvfvjb2HL8xri8iW//Ri/7vglwADAMZnRpCsTg8QAAAAAElFTkSuQmCC") 50% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAW5JREFUeNqslDFLw0AYhpOaSFuiDjqViiUKVhACDpJCQycX/TVChCz+Evf8ALtlCGZyCW6uOiR4QusgSgtmiO/BBZJ4l1qSg4dwd19e7vvuvU9K01SiNDGojpyJybLMi9kEu2AHqGwtAZ/gA/ysI6iAPjgHx6DD1pfgGTwCUhaUKlLeBheO49wnSZLmwfotGPJSblWUZAscmKY55Ox1ciUoDJGgwmrXm0wmg3UuRiTYpWK2bY80TVN93yd1BWm6/fF4fEgnQRDM6ggW0iWELKbT6byOYCFdz/OIwJ9d3sW0BOn2LMvS6cR13TeBpfaZ4f96p+TDI3ATRdF32X8ZcRx/IeYa6P/x4YbIY7kfZZEXeYL0rS7wFIUdg+0tWWxxj/OW98AZOM0ag2EYgzAMr7IAVVXv8PHAA5jnU1Y4B6Cd5Am8sJvU2+32ZSnmHbyy2JUnLOzTGwcjcMLqVtltVgnyemJlP5Sa7tiNC/4KMAAbxb+98QKR2gAAAABJRU5ErkJggg==") 71% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAc5JREFUeNqslM9KAlEUxp0xzSTNDHMoCiIKKRChXbgIAldKEK5y4Up9A5dufAMRRB8gwnW7lkV/EBcR0WzaBMEQFRNFlkNO34E7MU23msyBHzNz58x373fOPdeh67qDGMRFOkOccQEMg3EwBlyW7xp4AHega/2ZJ0gCM2AFLIARy/cOkMEJuAZvX5ZpsRwEyUajsa9pms4jn89vI2bVOhnpiJwVkt2JcDg82U8eeZZpEqd5IJPJHDebzVtmj3J3BBReDsU/LoAEn1keSazXl2AikQghd0mw2Wq10vF4nAo2DTx9CWaz2XnjORaLSYVCYR2Pc8BnR5BsdURR/NgO1Wr1rFKpnBvvkUiEChYCXjtFobx0U6nUHu4XxgSlUmnZCJAkycfEXHYE3dQh7XY7HY1Gp2igXC63e72e1Y2T55BnmQI9ZgG/3+/Fu5OTGltVfqFelWX5xhgIBAJuc4CiKI+4PbG+dvzWeqNgLZfL7XzXevV6/QAxG9RRVi2eIFmbBVvFYnEXK703hFRVfa3Vaoe0k8Aiy/cnQcEQEwTBWhjauEvsxAmyicjmJTgFVyw9uh1BYwf4KYXsVBFYu6nsPOyaxX6y/K8TW3QM+HoXYACXiuXQRCn2XAAAAABJRU5ErkJggg==") 92% top no-repeat, -o-linear-gradient(left, #ffdede 16%, rgba(0, 0, 0, 0) 16%, rgba(0, 0, 0, 0) 21%, #ffdede 21%, #ffdede 37%, rgba(0, 0, 0, 0) 37%, rgba(0, 0, 0, 0) 42%, #ffdede 42%, #ffdede 58%, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0) 63%, #ffdede 63%, #ffdede 79%, rgba(0, 0, 0, 0) 79%, rgba(0, 0, 0, 0) 84%, #ffdede 84%) left top no-repeat;
14
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 8% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAdBJREFUeNqslL9LQlEUx3367AdamdCQaVjQ0uAQBS+hxbVBhEcESoOG/0SDS9HakDYGEU0huLa1GW4tGtkkURBlQRn4LPseOBdej0u+ygsffByvH98995zj6Ha7DqIfizyKkCmKYv1eBaPAB4ZpP3gDz/zZ+Y1wAEyBeTAH/OATPIBrUAP3oG0VOiRHVli2nslkTmu12pNhGF2iUqncxePxI3yngwDv7SkcAstYeSEy02w229FodB97NN77TeiU5NYDJlOp1KII5HK5y2QyWaZnr9frxvMSv6HH+mOZkPI3EgwGfSJQr9db5g2hUGiMZW47wg/QUlXVMAd1XQ+I50aj8cI3bUhrx5JD+ucI2ADb4DASiZyZ80j5pTzLcigTOlkaBqtgp1gs3ghZqVS6QmyTTm73lkXpTIBEOp0umm9Y07QDxFdkF/KTcBAsgC3k61UI8/n8BWJJrlOnXaEo7BQJhKxarTYR2+OiDnM1OOwWtkbFS0cUwlgsdo74MdgFa2AauOwIqW8ThUKhLOsUIpvNnmBPlIdGz06h1fH7/a6/jDDZtKEjz/ClzFrfAuudpw1d0C03wo/jS2HpOM9Da3tRd1CnPNodX/+a2H0XfgkwAIVYVeQ1/9a6AAAAAElFTkSuQmCC") 29% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAe5JREFUeNqslM1LAkEYxnX7lL62CAmTwENkhyKwDkZg185dgvDQwS7RUQkvkRfzKNQfIF5CukjRJelk4EWwDmVUEJinaNlSMLPWnhdmYFvWGqiFH44z8z7zzjPvjKXZbFqI//hIx8rFrFarfkwCNiCDPtABNFADKngFH6KC1BgEE2ASOEE3E1DALbgCZfBuFLSYbJmC51wu1046nb5pNBpNTrFYVEKh0DHGV8AoW/xXQTsFJJPJC72YHq/Xu485Xrb4N0HJxFvybsjtdtt5Rzwev04kEvf8v9/v97CFbcbgdhPBT/AmSZLGOxRFaRgyoa22scP7VbACih6PZ5cdzAjoSqVS03xCoVB4wM8zLWxaOwYPaZEBMAXWI5HIud6/TCZTQv82mBX18MfP5/M5Y7HYAprDlLlIhpTdPNgEe+AQHOVyuSeeJZUT+taAQyRDuhnufD6/heANsBwOh8ey2ewTn+BwOPrZCXcYg80EycMeTdNa2lGpVN5ZNWgiglQitWq1Wtd3yrLcydvlclll1VAX8ZAehCUYf9rqpgQCgQPMWQS9IlePtuyiCxGNRs9UVa1zoVKpVA0GgycYWwVjrLiFnq9OFjADxlkm5NcLuAOX4NHstWklyEVlBvfvjb2HL8xri8iW//Ri/7vglwADAMZnRpCsTg8QAAAAAElFTkSuQmCC") 50% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAW5JREFUeNqslDFLw0AYhpOaSFuiDjqViiUKVhACDpJCQycX/TVChCz+Evf8ALtlCGZyCW6uOiR4QusgSgtmiO/BBZJ4l1qSg4dwd19e7vvuvU9K01SiNDGojpyJybLMi9kEu2AHqGwtAZ/gA/ysI6iAPjgHx6DD1pfgGTwCUhaUKlLeBheO49wnSZLmwfotGPJSblWUZAscmKY55Ox1ciUoDJGgwmrXm0wmg3UuRiTYpWK2bY80TVN93yd1BWm6/fF4fEgnQRDM6ggW0iWELKbT6byOYCFdz/OIwJ9d3sW0BOn2LMvS6cR13TeBpfaZ4f96p+TDI3ATRdF32X8ZcRx/IeYa6P/x4YbIY7kfZZEXeYL0rS7wFIUdg+0tWWxxj/OW98AZOM0ag2EYgzAMr7IAVVXv8PHAA5jnU1Y4B6Cd5Am8sJvU2+32ZSnmHbyy2JUnLOzTGwcjcMLqVtltVgnyemJlP5Sa7tiNC/4KMAAbxb+98QKR2gAAAABJRU5ErkJggg==") 71% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAc5JREFUeNqslM9KAlEUxp0xzSTNDHMoCiIKKRChXbgIAldKEK5y4Up9A5dufAMRRB8gwnW7lkV/EBcR0WzaBMEQFRNFlkNO34E7MU23msyBHzNz58x373fOPdeh67qDGMRFOkOccQEMg3EwBlyW7xp4AHega/2ZJ0gCM2AFLIARy/cOkMEJuAZvX5ZpsRwEyUajsa9pms4jn89vI2bVOhnpiJwVkt2JcDg82U8eeZZpEqd5IJPJHDebzVtmj3J3BBReDsU/LoAEn1keSazXl2AikQghd0mw2Wq10vF4nAo2DTx9CWaz2XnjORaLSYVCYR2Pc8BnR5BsdURR/NgO1Wr1rFKpnBvvkUiEChYCXjtFobx0U6nUHu4XxgSlUmnZCJAkycfEXHYE3dQh7XY7HY1Gp2igXC63e72e1Y2T55BnmQI9ZgG/3+/Fu5OTGltVfqFelWX5xhgIBAJuc4CiKI+4PbG+dvzWeqNgLZfL7XzXevV6/QAxG9RRVi2eIFmbBVvFYnEXK703hFRVfa3Vaoe0k8Aiy/cnQcEQEwTBWhjauEvsxAmyicjmJTgFVyw9uh1BYwf4KYXsVBFYu6nsPOyaxX6y/K8TW3QM+HoXYACXiuXQRCn2XAAAAABJRU5ErkJggg==") 92% top no-repeat, -webkit-linear-gradient(left, #ffdede 16%, rgba(0, 0, 0, 0) 16%, rgba(0, 0, 0, 0) 21%, #ffdede 21%, #ffdede 37%, rgba(0, 0, 0, 0) 37%, rgba(0, 0, 0, 0) 42%, #ffdede 42%, #ffdede 58%, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0) 63%, #ffdede 63%, #ffdede 79%, rgba(0, 0, 0, 0) 79%, rgba(0, 0, 0, 0) 84%, #ffdede 84%) left top no-repeat;
15
+ background: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAARVJREFUeNpi/P//PwMMMDIyMpALYOawEKEWpIYPiAWg7M9A/B6If4LMwaaYkGHiQKwFxJpAzA3E94H4LBA/BOJfWJ0Kw0iAFYhFgFgHiIOBuPHGjRtvf//+/X/WrFmHgHxPqIsxzGHC4TJ+IDYCYu+EhIQ4oGG5ysrKQiCJX79+cQApXqilDMR6mROI5Z8+fVotJibGS0rk4HLhd1AYSUtLd8rLyy/78uXLb0oN/AjE54D44LNnz27euXPnHaUGglz0BoifAvEHaniZbDBq4BA0EJR8vjAxMf2FCbCxsf2AljhYEzsjgfIQlKe1gVgPiCWAGGTwbWylDcwcQgayQIssASj9D5qLMMpDYg0kucSmeqQABBgAsyJrV7MArsMAAAAASUVORK5CYII=") 8% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAdBJREFUeNqslL9LQlEUx3367AdamdCQaVjQ0uAQBS+hxbVBhEcESoOG/0SDS9HakDYGEU0huLa1GW4tGtkkURBlQRn4LPseOBdej0u+ygsffByvH98995zj6Ha7DqIfizyKkCmKYv1eBaPAB4ZpP3gDz/zZ+Y1wAEyBeTAH/OATPIBrUAP3oG0VOiRHVli2nslkTmu12pNhGF2iUqncxePxI3yngwDv7SkcAstYeSEy02w229FodB97NN77TeiU5NYDJlOp1KII5HK5y2QyWaZnr9frxvMSv6HH+mOZkPI3EgwGfSJQr9db5g2hUGiMZW47wg/QUlXVMAd1XQ+I50aj8cI3bUhrx5JD+ucI2ADb4DASiZyZ80j5pTzLcigTOlkaBqtgp1gs3ghZqVS6QmyTTm73lkXpTIBEOp0umm9Y07QDxFdkF/KTcBAsgC3k61UI8/n8BWJJrlOnXaEo7BQJhKxarTYR2+OiDnM1OOwWtkbFS0cUwlgsdo74MdgFa2AauOwIqW8ThUKhLOsUIpvNnmBPlIdGz06h1fH7/a6/jDDZtKEjz/ClzFrfAuudpw1d0C03wo/jS2HpOM9Da3tRd1CnPNodX/+a2H0XfgkwAIVYVeQ1/9a6AAAAAElFTkSuQmCC") 29% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAe5JREFUeNqslM1LAkEYxnX7lL62CAmTwENkhyKwDkZg185dgvDQwS7RUQkvkRfzKNQfIF5CukjRJelk4EWwDmVUEJinaNlSMLPWnhdmYFvWGqiFH44z8z7zzjPvjKXZbFqI//hIx8rFrFarfkwCNiCDPtABNFADKngFH6KC1BgEE2ASOEE3E1DALbgCZfBuFLSYbJmC51wu1046nb5pNBpNTrFYVEKh0DHGV8AoW/xXQTsFJJPJC72YHq/Xu485Xrb4N0HJxFvybsjtdtt5Rzwev04kEvf8v9/v97CFbcbgdhPBT/AmSZLGOxRFaRgyoa22scP7VbACih6PZ5cdzAjoSqVS03xCoVB4wM8zLWxaOwYPaZEBMAXWI5HIud6/TCZTQv82mBX18MfP5/M5Y7HYAprDlLlIhpTdPNgEe+AQHOVyuSeeJZUT+taAQyRDuhnufD6/heANsBwOh8ey2ewTn+BwOPrZCXcYg80EycMeTdNa2lGpVN5ZNWgiglQitWq1Wtd3yrLcydvlclll1VAX8ZAehCUYf9rqpgQCgQPMWQS9IlePtuyiCxGNRs9UVa1zoVKpVA0GgycYWwVjrLiFnq9OFjADxlkm5NcLuAOX4NHstWklyEVlBvfvjb2HL8xri8iW//Ri/7vglwADAMZnRpCsTg8QAAAAAElFTkSuQmCC") 50% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAW5JREFUeNqslDFLw0AYhpOaSFuiDjqViiUKVhACDpJCQycX/TVChCz+Evf8ALtlCGZyCW6uOiR4QusgSgtmiO/BBZJ4l1qSg4dwd19e7vvuvU9K01SiNDGojpyJybLMi9kEu2AHqGwtAZ/gA/ysI6iAPjgHx6DD1pfgGTwCUhaUKlLeBheO49wnSZLmwfotGPJSblWUZAscmKY55Ox1ciUoDJGgwmrXm0wmg3UuRiTYpWK2bY80TVN93yd1BWm6/fF4fEgnQRDM6ggW0iWELKbT6byOYCFdz/OIwJ9d3sW0BOn2LMvS6cR13TeBpfaZ4f96p+TDI3ATRdF32X8ZcRx/IeYa6P/x4YbIY7kfZZEXeYL0rS7wFIUdg+0tWWxxj/OW98AZOM0ag2EYgzAMr7IAVVXv8PHAA5jnU1Y4B6Cd5Am8sJvU2+32ZSnmHbyy2JUnLOzTGwcjcMLqVtltVgnyemJlP5Sa7tiNC/4KMAAbxb+98QKR2gAAAABJRU5ErkJggg==") 71% top no-repeat, url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAUCAYAAACNiR0NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAc5JREFUeNqslM9KAlEUxp0xzSTNDHMoCiIKKRChXbgIAldKEK5y4Up9A5dufAMRRB8gwnW7lkV/EBcR0WzaBMEQFRNFlkNO34E7MU23msyBHzNz58x373fOPdeh67qDGMRFOkOccQEMg3EwBlyW7xp4AHega/2ZJ0gCM2AFLIARy/cOkMEJuAZvX5ZpsRwEyUajsa9pms4jn89vI2bVOhnpiJwVkt2JcDg82U8eeZZpEqd5IJPJHDebzVtmj3J3BBReDsU/LoAEn1keSazXl2AikQghd0mw2Wq10vF4nAo2DTx9CWaz2XnjORaLSYVCYR2Pc8BnR5BsdURR/NgO1Wr1rFKpnBvvkUiEChYCXjtFobx0U6nUHu4XxgSlUmnZCJAkycfEXHYE3dQh7XY7HY1Gp2igXC63e72e1Y2T55BnmQI9ZgG/3+/Fu5OTGltVfqFelWX5xhgIBAJuc4CiKI+4PbG+dvzWeqNgLZfL7XzXevV6/QAxG9RRVi2eIFmbBVvFYnEXK703hFRVfa3Vaoe0k8Aiy/cnQcEQEwTBWhjauEvsxAmyicjmJTgFVyw9uh1BYwf4KYXsVBFYu6nsPOyaxX6y/K8TW3QM+HoXYACXiuXQRCn2XAAAAABJRU5ErkJggg==") 92% top no-repeat, linear-gradient(to right, #ffdede 16%, rgba(0, 0, 0, 0) 16%, rgba(0, 0, 0, 0) 21%, #ffdede 21%, #ffdede 37%, rgba(0, 0, 0, 0) 37%, rgba(0, 0, 0, 0) 42%, #ffdede 42%, #ffdede 58%, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0) 63%, #ffdede 63%, #ffdede 79%, rgba(0, 0, 0, 0) 79%, rgba(0, 0, 0, 0) 84%, #ffdede 84%) left top no-repeat;
16
+ /* Test zen-grid-background() with 12 column grid and 20px gutter */
17
+ background: -moz-linear-gradient(left, #ffdede 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 8.33333%, #ffdede 8.33333%, #ffdede 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 16.66667%, #ffdede 16.66667%, #ffdede 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 25%, #ffdede 25%, #ffdede 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 33.33333%, #ffdede 33.33333%, #ffdede 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 41.66667%, #ffdede 41.66667%, #ffdede 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 50%, #ffdede 50%, #ffdede 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 58.33333%, #ffdede 58.33333%, #ffdede 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 66.66667%, #ffdede 66.66667%, #ffdede 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 75%, #ffdede 75%, #ffdede 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 83.33333%, #ffdede 83.33333%, #ffdede 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 91.66667%, #ffdede 91.66667%, #ffdede 95.83333%, rgba(0, 0, 0, 0) 95.83333%) 10px top no-repeat, -moz-linear-gradient(left, rgba(0, 0, 0, 0) 4.16667%, #ffdede 4.16667%, #ffdede 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 12.5%, #ffdede 12.5%, #ffdede 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 20.83333%, #ffdede 20.83333%, #ffdede 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 29.16667%, #ffdede 29.16667%, #ffdede 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 37.5%, #ffdede 37.5%, #ffdede 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 45.83333%, #ffdede 45.83333%, #ffdede 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 54.16667%, #ffdede 54.16667%, #ffdede 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 62.5%, #ffdede 62.5%, #ffdede 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 70.83333%, #ffdede 70.83333%, #ffdede 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 79.16667%, #ffdede 79.16667%, #ffdede 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 87.5%, #ffdede 87.5%, #ffdede 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 95.83333%, #ffdede 95.83333%) -10px top no-repeat;
18
+ background: -o-linear-gradient(left, #ffdede 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 8.33333%, #ffdede 8.33333%, #ffdede 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 16.66667%, #ffdede 16.66667%, #ffdede 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 25%, #ffdede 25%, #ffdede 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 33.33333%, #ffdede 33.33333%, #ffdede 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 41.66667%, #ffdede 41.66667%, #ffdede 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 50%, #ffdede 50%, #ffdede 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 58.33333%, #ffdede 58.33333%, #ffdede 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 66.66667%, #ffdede 66.66667%, #ffdede 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 75%, #ffdede 75%, #ffdede 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 83.33333%, #ffdede 83.33333%, #ffdede 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 91.66667%, #ffdede 91.66667%, #ffdede 95.83333%, rgba(0, 0, 0, 0) 95.83333%) 10px top no-repeat, -o-linear-gradient(left, rgba(0, 0, 0, 0) 4.16667%, #ffdede 4.16667%, #ffdede 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 12.5%, #ffdede 12.5%, #ffdede 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 20.83333%, #ffdede 20.83333%, #ffdede 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 29.16667%, #ffdede 29.16667%, #ffdede 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 37.5%, #ffdede 37.5%, #ffdede 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 45.83333%, #ffdede 45.83333%, #ffdede 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 54.16667%, #ffdede 54.16667%, #ffdede 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 62.5%, #ffdede 62.5%, #ffdede 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 70.83333%, #ffdede 70.83333%, #ffdede 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 79.16667%, #ffdede 79.16667%, #ffdede 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 87.5%, #ffdede 87.5%, #ffdede 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 95.83333%, #ffdede 95.83333%) -10px top no-repeat;
19
+ background: -webkit-linear-gradient(left, #ffdede 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 8.33333%, #ffdede 8.33333%, #ffdede 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 16.66667%, #ffdede 16.66667%, #ffdede 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 25%, #ffdede 25%, #ffdede 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 33.33333%, #ffdede 33.33333%, #ffdede 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 41.66667%, #ffdede 41.66667%, #ffdede 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 50%, #ffdede 50%, #ffdede 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 58.33333%, #ffdede 58.33333%, #ffdede 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 66.66667%, #ffdede 66.66667%, #ffdede 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 75%, #ffdede 75%, #ffdede 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 83.33333%, #ffdede 83.33333%, #ffdede 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 91.66667%, #ffdede 91.66667%, #ffdede 95.83333%, rgba(0, 0, 0, 0) 95.83333%) 10px top no-repeat, -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 4.16667%, #ffdede 4.16667%, #ffdede 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 12.5%, #ffdede 12.5%, #ffdede 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 20.83333%, #ffdede 20.83333%, #ffdede 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 29.16667%, #ffdede 29.16667%, #ffdede 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 37.5%, #ffdede 37.5%, #ffdede 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 45.83333%, #ffdede 45.83333%, #ffdede 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 54.16667%, #ffdede 54.16667%, #ffdede 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 62.5%, #ffdede 62.5%, #ffdede 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 70.83333%, #ffdede 70.83333%, #ffdede 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 79.16667%, #ffdede 79.16667%, #ffdede 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 87.5%, #ffdede 87.5%, #ffdede 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 95.83333%, #ffdede 95.83333%) -10px top no-repeat;
20
+ background: linear-gradient(to right, #ffdede 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 8.33333%, #ffdede 8.33333%, #ffdede 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 16.66667%, #ffdede 16.66667%, #ffdede 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 25%, #ffdede 25%, #ffdede 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 33.33333%, #ffdede 33.33333%, #ffdede 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 41.66667%, #ffdede 41.66667%, #ffdede 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 50%, #ffdede 50%, #ffdede 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 58.33333%, #ffdede 58.33333%, #ffdede 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 66.66667%, #ffdede 66.66667%, #ffdede 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 75%, #ffdede 75%, #ffdede 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 83.33333%, #ffdede 83.33333%, #ffdede 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 91.66667%, #ffdede 91.66667%, #ffdede 95.83333%, rgba(0, 0, 0, 0) 95.83333%) 10px top no-repeat, linear-gradient(to right, rgba(0, 0, 0, 0) 4.16667%, #ffdede 4.16667%, #ffdede 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 12.5%, #ffdede 12.5%, #ffdede 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 20.83333%, #ffdede 20.83333%, #ffdede 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 29.16667%, #ffdede 29.16667%, #ffdede 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 37.5%, #ffdede 37.5%, #ffdede 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 45.83333%, #ffdede 45.83333%, #ffdede 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 54.16667%, #ffdede 54.16667%, #ffdede 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 62.5%, #ffdede 62.5%, #ffdede 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 70.83333%, #ffdede 70.83333%, #ffdede 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 79.16667%, #ffdede 79.16667%, #ffdede 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 87.5%, #ffdede 87.5%, #ffdede 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 95.83333%, #ffdede 95.83333%) -10px top no-repeat;
21
+ /* Test zen-grid-background(), 5 column grid, 10% gutter and black grid color */
22
+ background: -moz-linear-gradient(left, rgba(0, 0, 0, 0) 5%, #000000 5%, #000000 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, #000000 25%, #000000 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, #000000 45%, #000000 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, #000000 65%, #000000 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, #000000 85%, #000000 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
23
+ background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 5%, #000000 5%, #000000 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, #000000 25%, #000000 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, #000000 45%, #000000 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, #000000 65%, #000000 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, #000000 85%, #000000 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
24
+ background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 5%, #000000 5%, #000000 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, #000000 25%, #000000 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, #000000 45%, #000000 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, #000000 65%, #000000 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, #000000 85%, #000000 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
25
+ background: linear-gradient(to right, rgba(0, 0, 0, 0) 5%, #000000 5%, #000000 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, #000000 25%, #000000 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, #000000 45%, #000000 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, #000000 65%, #000000 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, #000000 85%, #000000 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
26
+ /* Test zen-grid-background() with 5 column grid and 40px gutter */
27
+ background: -moz-linear-gradient(left, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, -moz-linear-gradient(left, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
28
+ background: -o-linear-gradient(left, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, -o-linear-gradient(left, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
29
+ background: -webkit-linear-gradient(left, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
30
+ background: linear-gradient(to right, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, linear-gradient(to right, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
31
+ /* Test zen-grid-background(), 5 column grid and 10% gutter and $zen-switch-direction */
32
+ background: -moz-linear-gradient(left, rgba(0, 0, 0, 0) 5%, rgba(255, 222, 222, 0.8) 5%, rgba(255, 222, 222, 0.8) 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, rgba(255, 222, 222, 0.8) 45%, rgba(255, 222, 222, 0.8) 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, rgba(255, 222, 222, 0.8) 65%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, rgba(255, 222, 222, 0.8) 85%, rgba(255, 222, 222, 0.8) 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
33
+ background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 5%, rgba(255, 222, 222, 0.8) 5%, rgba(255, 222, 222, 0.8) 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, rgba(255, 222, 222, 0.8) 45%, rgba(255, 222, 222, 0.8) 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, rgba(255, 222, 222, 0.8) 65%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, rgba(255, 222, 222, 0.8) 85%, rgba(255, 222, 222, 0.8) 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
34
+ background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 5%, rgba(255, 222, 222, 0.8) 5%, rgba(255, 222, 222, 0.8) 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, rgba(255, 222, 222, 0.8) 45%, rgba(255, 222, 222, 0.8) 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, rgba(255, 222, 222, 0.8) 65%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, rgba(255, 222, 222, 0.8) 85%, rgba(255, 222, 222, 0.8) 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
35
+ background: linear-gradient(to right, rgba(0, 0, 0, 0) 5%, rgba(255, 222, 222, 0.8) 5%, rgba(255, 222, 222, 0.8) 15%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 35%, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0) 45%, rgba(255, 222, 222, 0.8) 45%, rgba(255, 222, 222, 0.8) 55%, rgba(0, 0, 0, 0) 55%, rgba(0, 0, 0, 0) 65%, rgba(255, 222, 222, 0.8) 65%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 85%, rgba(255, 222, 222, 0.8) 85%, rgba(255, 222, 222, 0.8) 95%, rgba(0, 0, 0, 0) 95%) left top no-repeat;
36
+ /* Test zen-grid-background() with 5 column grid and 40px gutter and $zen-switch-direction */
37
+ background: -moz-linear-gradient(left, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, -moz-linear-gradient(left, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
38
+ background: -o-linear-gradient(left, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, -o-linear-gradient(left, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
39
+ background: -webkit-linear-gradient(left, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
40
+ background: linear-gradient(to right, rgba(255, 222, 222, 0.8) 10%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0) 20%, rgba(255, 222, 222, 0.8) 20%, rgba(255, 222, 222, 0.8) 30%, rgba(0, 0, 0, 0) 30%, rgba(0, 0, 0, 0) 40%, rgba(255, 222, 222, 0.8) 40%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 60%, rgba(255, 222, 222, 0.8) 60%, rgba(255, 222, 222, 0.8) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 80%, rgba(255, 222, 222, 0.8) 80%, rgba(255, 222, 222, 0.8) 90%, rgba(0, 0, 0, 0) 90%) 20px top no-repeat, linear-gradient(to right, rgba(0, 0, 0, 0) 10%, rgba(255, 222, 222, 0.8) 10%, rgba(255, 222, 222, 0.8) 20%, rgba(0, 0, 0, 0) 20%, rgba(0, 0, 0, 0) 30%, rgba(255, 222, 222, 0.8) 30%, rgba(255, 222, 222, 0.8) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 60%, rgba(0, 0, 0, 0) 60%, rgba(0, 0, 0, 0) 70%, rgba(255, 222, 222, 0.8) 70%, rgba(255, 222, 222, 0.8) 80%, rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0) 90%, rgba(255, 222, 222, 0.8) 90%) -20px top no-repeat;
41
+ /* Test zen-grid-background() with $zen-grid-width: 1000px, 5 column grid and 40px gutter */
42
+ background: -moz-linear-gradient(left, rgba(0, 0, 0, 0) 20px, rgba(255, 222, 222, 0.8) 20px, rgba(255, 222, 222, 0.8) 180px, rgba(0, 0, 0, 0) 180px, rgba(0, 0, 0, 0) 220px, rgba(255, 222, 222, 0.8) 220px, rgba(255, 222, 222, 0.8) 380px, rgba(0, 0, 0, 0) 380px, rgba(0, 0, 0, 0) 420px, rgba(255, 222, 222, 0.8) 420px, rgba(255, 222, 222, 0.8) 580px, rgba(0, 0, 0, 0) 580px, rgba(0, 0, 0, 0) 620px, rgba(255, 222, 222, 0.8) 620px, rgba(255, 222, 222, 0.8) 780px, rgba(0, 0, 0, 0) 780px, rgba(0, 0, 0, 0) 820px, rgba(255, 222, 222, 0.8) 820px, rgba(255, 222, 222, 0.8) 980px, rgba(0, 0, 0, 0) 980px) left top no-repeat;
43
+ background: -o-linear-gradient(left, rgba(0, 0, 0, 0) 20px, rgba(255, 222, 222, 0.8) 20px, rgba(255, 222, 222, 0.8) 180px, rgba(0, 0, 0, 0) 180px, rgba(0, 0, 0, 0) 220px, rgba(255, 222, 222, 0.8) 220px, rgba(255, 222, 222, 0.8) 380px, rgba(0, 0, 0, 0) 380px, rgba(0, 0, 0, 0) 420px, rgba(255, 222, 222, 0.8) 420px, rgba(255, 222, 222, 0.8) 580px, rgba(0, 0, 0, 0) 580px, rgba(0, 0, 0, 0) 620px, rgba(255, 222, 222, 0.8) 620px, rgba(255, 222, 222, 0.8) 780px, rgba(0, 0, 0, 0) 780px, rgba(0, 0, 0, 0) 820px, rgba(255, 222, 222, 0.8) 820px, rgba(255, 222, 222, 0.8) 980px, rgba(0, 0, 0, 0) 980px) left top no-repeat;
44
+ background: -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 20px, rgba(255, 222, 222, 0.8) 20px, rgba(255, 222, 222, 0.8) 180px, rgba(0, 0, 0, 0) 180px, rgba(0, 0, 0, 0) 220px, rgba(255, 222, 222, 0.8) 220px, rgba(255, 222, 222, 0.8) 380px, rgba(0, 0, 0, 0) 380px, rgba(0, 0, 0, 0) 420px, rgba(255, 222, 222, 0.8) 420px, rgba(255, 222, 222, 0.8) 580px, rgba(0, 0, 0, 0) 580px, rgba(0, 0, 0, 0) 620px, rgba(255, 222, 222, 0.8) 620px, rgba(255, 222, 222, 0.8) 780px, rgba(0, 0, 0, 0) 780px, rgba(0, 0, 0, 0) 820px, rgba(255, 222, 222, 0.8) 820px, rgba(255, 222, 222, 0.8) 980px, rgba(0, 0, 0, 0) 980px) left top no-repeat;
45
+ background: linear-gradient(to right, rgba(0, 0, 0, 0) 20px, rgba(255, 222, 222, 0.8) 20px, rgba(255, 222, 222, 0.8) 180px, rgba(0, 0, 0, 0) 180px, rgba(0, 0, 0, 0) 220px, rgba(255, 222, 222, 0.8) 220px, rgba(255, 222, 222, 0.8) 380px, rgba(0, 0, 0, 0) 380px, rgba(0, 0, 0, 0) 420px, rgba(255, 222, 222, 0.8) 420px, rgba(255, 222, 222, 0.8) 580px, rgba(0, 0, 0, 0) 580px, rgba(0, 0, 0, 0) 620px, rgba(255, 222, 222, 0.8) 620px, rgba(255, 222, 222, 0.8) 780px, rgba(0, 0, 0, 0) 780px, rgba(0, 0, 0, 0) 820px, rgba(255, 222, 222, 0.8) 820px, rgba(255, 222, 222, 0.8) 980px, rgba(0, 0, 0, 0) 980px) left top no-repeat;
46
+ /* Test zen-grid-background() with all 24 grid numbers */
47
+ background: -moz-linear-gradient(left, rgba(255, 222, 222, 0.8) 2.08333%, rgba(0, 0, 0, 0) 2.08333%, rgba(0, 0, 0, 0) 4.16667%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(255, 222, 222, 0.8) 6.25%, rgba(0, 0, 0, 0) 6.25%, rgba(0, 0, 0, 0) 8.33333%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(0, 0, 0, 0) 10.41667%, rgba(0, 0, 0, 0) 12.5%, rgba(255, 222, 222, 0.8) 12.5%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(0, 0, 0, 0) 14.58333%, rgba(0, 0, 0, 0) 16.66667%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(255, 222, 222, 0.8) 18.75%, rgba(0, 0, 0, 0) 18.75%, rgba(0, 0, 0, 0) 20.83333%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(0, 0, 0, 0) 22.91667%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(0, 0, 0, 0) 27.08333%, rgba(0, 0, 0, 0) 29.16667%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(255, 222, 222, 0.8) 31.25%, rgba(0, 0, 0, 0) 31.25%, rgba(0, 0, 0, 0) 33.33333%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(0, 0, 0, 0) 35.41667%, rgba(0, 0, 0, 0) 37.5%, rgba(255, 222, 222, 0.8) 37.5%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(0, 0, 0, 0) 39.58333%, rgba(0, 0, 0, 0) 41.66667%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(255, 222, 222, 0.8) 43.75%, rgba(0, 0, 0, 0) 43.75%, rgba(0, 0, 0, 0) 45.83333%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(0, 0, 0, 0) 47.91667%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(0, 0, 0, 0) 52.08333%, rgba(0, 0, 0, 0) 54.16667%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(255, 222, 222, 0.8) 56.25%, rgba(0, 0, 0, 0) 56.25%, rgba(0, 0, 0, 0) 58.33333%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(0, 0, 0, 0) 60.41667%, rgba(0, 0, 0, 0) 62.5%, rgba(255, 222, 222, 0.8) 62.5%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(0, 0, 0, 0) 64.58333%, rgba(0, 0, 0, 0) 66.66667%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(255, 222, 222, 0.8) 68.75%, rgba(0, 0, 0, 0) 68.75%, rgba(0, 0, 0, 0) 70.83333%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(0, 0, 0, 0) 72.91667%, rgba(0, 0, 0, 0) 75%, rgba(255, 222, 222, 0.8) 75%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(0, 0, 0, 0) 77.08333%, rgba(0, 0, 0, 0) 79.16667%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(255, 222, 222, 0.8) 81.25%, rgba(0, 0, 0, 0) 81.25%, rgba(0, 0, 0, 0) 83.33333%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(0, 0, 0, 0) 85.41667%, rgba(0, 0, 0, 0) 87.5%, rgba(255, 222, 222, 0.8) 87.5%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(0, 0, 0, 0) 89.58333%, rgba(0, 0, 0, 0) 91.66667%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(255, 222, 222, 0.8) 93.75%, rgba(0, 0, 0, 0) 93.75%, rgba(0, 0, 0, 0) 95.83333%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(255, 222, 222, 0.8) 97.91667%, rgba(0, 0, 0, 0) 97.91667%) 10px top no-repeat, -moz-linear-gradient(left, rgba(0, 0, 0, 0) 2.08333%, rgba(255, 222, 222, 0.8) 2.08333%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 6.25%, rgba(255, 222, 222, 0.8) 6.25%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 10.41667%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(255, 222, 222, 0.8) 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 14.58333%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 18.75%, rgba(255, 222, 222, 0.8) 18.75%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 22.91667%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(255, 222, 222, 0.8) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 27.08333%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 31.25%, rgba(255, 222, 222, 0.8) 31.25%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 35.41667%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(255, 222, 222, 0.8) 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 39.58333%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 43.75%, rgba(255, 222, 222, 0.8) 43.75%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 47.91667%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 52.08333%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 56.25%, rgba(255, 222, 222, 0.8) 56.25%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 60.41667%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(255, 222, 222, 0.8) 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 64.58333%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 68.75%, rgba(255, 222, 222, 0.8) 68.75%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 72.91667%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 77.08333%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 81.25%, rgba(255, 222, 222, 0.8) 81.25%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 85.41667%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(255, 222, 222, 0.8) 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 89.58333%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 93.75%, rgba(255, 222, 222, 0.8) 93.75%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(0, 0, 0, 0) 95.83333%, rgba(0, 0, 0, 0) 97.91667%, rgba(255, 222, 222, 0.8) 97.91667%) -10px top no-repeat;
48
+ background: -o-linear-gradient(left, rgba(255, 222, 222, 0.8) 2.08333%, rgba(0, 0, 0, 0) 2.08333%, rgba(0, 0, 0, 0) 4.16667%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(255, 222, 222, 0.8) 6.25%, rgba(0, 0, 0, 0) 6.25%, rgba(0, 0, 0, 0) 8.33333%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(0, 0, 0, 0) 10.41667%, rgba(0, 0, 0, 0) 12.5%, rgba(255, 222, 222, 0.8) 12.5%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(0, 0, 0, 0) 14.58333%, rgba(0, 0, 0, 0) 16.66667%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(255, 222, 222, 0.8) 18.75%, rgba(0, 0, 0, 0) 18.75%, rgba(0, 0, 0, 0) 20.83333%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(0, 0, 0, 0) 22.91667%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(0, 0, 0, 0) 27.08333%, rgba(0, 0, 0, 0) 29.16667%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(255, 222, 222, 0.8) 31.25%, rgba(0, 0, 0, 0) 31.25%, rgba(0, 0, 0, 0) 33.33333%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(0, 0, 0, 0) 35.41667%, rgba(0, 0, 0, 0) 37.5%, rgba(255, 222, 222, 0.8) 37.5%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(0, 0, 0, 0) 39.58333%, rgba(0, 0, 0, 0) 41.66667%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(255, 222, 222, 0.8) 43.75%, rgba(0, 0, 0, 0) 43.75%, rgba(0, 0, 0, 0) 45.83333%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(0, 0, 0, 0) 47.91667%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(0, 0, 0, 0) 52.08333%, rgba(0, 0, 0, 0) 54.16667%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(255, 222, 222, 0.8) 56.25%, rgba(0, 0, 0, 0) 56.25%, rgba(0, 0, 0, 0) 58.33333%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(0, 0, 0, 0) 60.41667%, rgba(0, 0, 0, 0) 62.5%, rgba(255, 222, 222, 0.8) 62.5%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(0, 0, 0, 0) 64.58333%, rgba(0, 0, 0, 0) 66.66667%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(255, 222, 222, 0.8) 68.75%, rgba(0, 0, 0, 0) 68.75%, rgba(0, 0, 0, 0) 70.83333%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(0, 0, 0, 0) 72.91667%, rgba(0, 0, 0, 0) 75%, rgba(255, 222, 222, 0.8) 75%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(0, 0, 0, 0) 77.08333%, rgba(0, 0, 0, 0) 79.16667%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(255, 222, 222, 0.8) 81.25%, rgba(0, 0, 0, 0) 81.25%, rgba(0, 0, 0, 0) 83.33333%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(0, 0, 0, 0) 85.41667%, rgba(0, 0, 0, 0) 87.5%, rgba(255, 222, 222, 0.8) 87.5%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(0, 0, 0, 0) 89.58333%, rgba(0, 0, 0, 0) 91.66667%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(255, 222, 222, 0.8) 93.75%, rgba(0, 0, 0, 0) 93.75%, rgba(0, 0, 0, 0) 95.83333%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(255, 222, 222, 0.8) 97.91667%, rgba(0, 0, 0, 0) 97.91667%) 10px top no-repeat, -o-linear-gradient(left, rgba(0, 0, 0, 0) 2.08333%, rgba(255, 222, 222, 0.8) 2.08333%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 6.25%, rgba(255, 222, 222, 0.8) 6.25%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 10.41667%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(255, 222, 222, 0.8) 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 14.58333%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 18.75%, rgba(255, 222, 222, 0.8) 18.75%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 22.91667%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(255, 222, 222, 0.8) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 27.08333%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 31.25%, rgba(255, 222, 222, 0.8) 31.25%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 35.41667%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(255, 222, 222, 0.8) 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 39.58333%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 43.75%, rgba(255, 222, 222, 0.8) 43.75%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 47.91667%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 52.08333%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 56.25%, rgba(255, 222, 222, 0.8) 56.25%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 60.41667%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(255, 222, 222, 0.8) 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 64.58333%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 68.75%, rgba(255, 222, 222, 0.8) 68.75%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 72.91667%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 77.08333%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 81.25%, rgba(255, 222, 222, 0.8) 81.25%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 85.41667%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(255, 222, 222, 0.8) 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 89.58333%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 93.75%, rgba(255, 222, 222, 0.8) 93.75%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(0, 0, 0, 0) 95.83333%, rgba(0, 0, 0, 0) 97.91667%, rgba(255, 222, 222, 0.8) 97.91667%) -10px top no-repeat;
49
+ background: -webkit-linear-gradient(left, rgba(255, 222, 222, 0.8) 2.08333%, rgba(0, 0, 0, 0) 2.08333%, rgba(0, 0, 0, 0) 4.16667%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(255, 222, 222, 0.8) 6.25%, rgba(0, 0, 0, 0) 6.25%, rgba(0, 0, 0, 0) 8.33333%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(0, 0, 0, 0) 10.41667%, rgba(0, 0, 0, 0) 12.5%, rgba(255, 222, 222, 0.8) 12.5%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(0, 0, 0, 0) 14.58333%, rgba(0, 0, 0, 0) 16.66667%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(255, 222, 222, 0.8) 18.75%, rgba(0, 0, 0, 0) 18.75%, rgba(0, 0, 0, 0) 20.83333%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(0, 0, 0, 0) 22.91667%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(0, 0, 0, 0) 27.08333%, rgba(0, 0, 0, 0) 29.16667%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(255, 222, 222, 0.8) 31.25%, rgba(0, 0, 0, 0) 31.25%, rgba(0, 0, 0, 0) 33.33333%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(0, 0, 0, 0) 35.41667%, rgba(0, 0, 0, 0) 37.5%, rgba(255, 222, 222, 0.8) 37.5%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(0, 0, 0, 0) 39.58333%, rgba(0, 0, 0, 0) 41.66667%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(255, 222, 222, 0.8) 43.75%, rgba(0, 0, 0, 0) 43.75%, rgba(0, 0, 0, 0) 45.83333%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(0, 0, 0, 0) 47.91667%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(0, 0, 0, 0) 52.08333%, rgba(0, 0, 0, 0) 54.16667%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(255, 222, 222, 0.8) 56.25%, rgba(0, 0, 0, 0) 56.25%, rgba(0, 0, 0, 0) 58.33333%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(0, 0, 0, 0) 60.41667%, rgba(0, 0, 0, 0) 62.5%, rgba(255, 222, 222, 0.8) 62.5%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(0, 0, 0, 0) 64.58333%, rgba(0, 0, 0, 0) 66.66667%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(255, 222, 222, 0.8) 68.75%, rgba(0, 0, 0, 0) 68.75%, rgba(0, 0, 0, 0) 70.83333%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(0, 0, 0, 0) 72.91667%, rgba(0, 0, 0, 0) 75%, rgba(255, 222, 222, 0.8) 75%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(0, 0, 0, 0) 77.08333%, rgba(0, 0, 0, 0) 79.16667%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(255, 222, 222, 0.8) 81.25%, rgba(0, 0, 0, 0) 81.25%, rgba(0, 0, 0, 0) 83.33333%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(0, 0, 0, 0) 85.41667%, rgba(0, 0, 0, 0) 87.5%, rgba(255, 222, 222, 0.8) 87.5%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(0, 0, 0, 0) 89.58333%, rgba(0, 0, 0, 0) 91.66667%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(255, 222, 222, 0.8) 93.75%, rgba(0, 0, 0, 0) 93.75%, rgba(0, 0, 0, 0) 95.83333%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(255, 222, 222, 0.8) 97.91667%, rgba(0, 0, 0, 0) 97.91667%) 10px top no-repeat, -webkit-linear-gradient(left, rgba(0, 0, 0, 0) 2.08333%, rgba(255, 222, 222, 0.8) 2.08333%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 6.25%, rgba(255, 222, 222, 0.8) 6.25%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 10.41667%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(255, 222, 222, 0.8) 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 14.58333%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 18.75%, rgba(255, 222, 222, 0.8) 18.75%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 22.91667%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(255, 222, 222, 0.8) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 27.08333%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 31.25%, rgba(255, 222, 222, 0.8) 31.25%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 35.41667%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(255, 222, 222, 0.8) 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 39.58333%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 43.75%, rgba(255, 222, 222, 0.8) 43.75%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 47.91667%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 52.08333%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 56.25%, rgba(255, 222, 222, 0.8) 56.25%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 60.41667%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(255, 222, 222, 0.8) 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 64.58333%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 68.75%, rgba(255, 222, 222, 0.8) 68.75%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 72.91667%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 77.08333%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 81.25%, rgba(255, 222, 222, 0.8) 81.25%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 85.41667%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(255, 222, 222, 0.8) 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 89.58333%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 93.75%, rgba(255, 222, 222, 0.8) 93.75%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(0, 0, 0, 0) 95.83333%, rgba(0, 0, 0, 0) 97.91667%, rgba(255, 222, 222, 0.8) 97.91667%) -10px top no-repeat;
50
+ background: linear-gradient(to right, rgba(255, 222, 222, 0.8) 2.08333%, rgba(0, 0, 0, 0) 2.08333%, rgba(0, 0, 0, 0) 4.16667%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(255, 222, 222, 0.8) 6.25%, rgba(0, 0, 0, 0) 6.25%, rgba(0, 0, 0, 0) 8.33333%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(0, 0, 0, 0) 10.41667%, rgba(0, 0, 0, 0) 12.5%, rgba(255, 222, 222, 0.8) 12.5%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(0, 0, 0, 0) 14.58333%, rgba(0, 0, 0, 0) 16.66667%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(255, 222, 222, 0.8) 18.75%, rgba(0, 0, 0, 0) 18.75%, rgba(0, 0, 0, 0) 20.83333%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(0, 0, 0, 0) 22.91667%, rgba(0, 0, 0, 0) 25%, rgba(255, 222, 222, 0.8) 25%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(0, 0, 0, 0) 27.08333%, rgba(0, 0, 0, 0) 29.16667%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(255, 222, 222, 0.8) 31.25%, rgba(0, 0, 0, 0) 31.25%, rgba(0, 0, 0, 0) 33.33333%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(0, 0, 0, 0) 35.41667%, rgba(0, 0, 0, 0) 37.5%, rgba(255, 222, 222, 0.8) 37.5%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(0, 0, 0, 0) 39.58333%, rgba(0, 0, 0, 0) 41.66667%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(255, 222, 222, 0.8) 43.75%, rgba(0, 0, 0, 0) 43.75%, rgba(0, 0, 0, 0) 45.83333%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(0, 0, 0, 0) 47.91667%, rgba(0, 0, 0, 0) 50%, rgba(255, 222, 222, 0.8) 50%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(0, 0, 0, 0) 52.08333%, rgba(0, 0, 0, 0) 54.16667%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(255, 222, 222, 0.8) 56.25%, rgba(0, 0, 0, 0) 56.25%, rgba(0, 0, 0, 0) 58.33333%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(0, 0, 0, 0) 60.41667%, rgba(0, 0, 0, 0) 62.5%, rgba(255, 222, 222, 0.8) 62.5%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(0, 0, 0, 0) 64.58333%, rgba(0, 0, 0, 0) 66.66667%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(255, 222, 222, 0.8) 68.75%, rgba(0, 0, 0, 0) 68.75%, rgba(0, 0, 0, 0) 70.83333%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(0, 0, 0, 0) 72.91667%, rgba(0, 0, 0, 0) 75%, rgba(255, 222, 222, 0.8) 75%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(0, 0, 0, 0) 77.08333%, rgba(0, 0, 0, 0) 79.16667%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(255, 222, 222, 0.8) 81.25%, rgba(0, 0, 0, 0) 81.25%, rgba(0, 0, 0, 0) 83.33333%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(0, 0, 0, 0) 85.41667%, rgba(0, 0, 0, 0) 87.5%, rgba(255, 222, 222, 0.8) 87.5%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(0, 0, 0, 0) 89.58333%, rgba(0, 0, 0, 0) 91.66667%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(255, 222, 222, 0.8) 93.75%, rgba(0, 0, 0, 0) 93.75%, rgba(0, 0, 0, 0) 95.83333%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(255, 222, 222, 0.8) 97.91667%, rgba(0, 0, 0, 0) 97.91667%) 10px top no-repeat, linear-gradient(to right, rgba(0, 0, 0, 0) 2.08333%, rgba(255, 222, 222, 0.8) 2.08333%, rgba(255, 222, 222, 0.8) 4.16667%, rgba(0, 0, 0, 0) 4.16667%, rgba(0, 0, 0, 0) 6.25%, rgba(255, 222, 222, 0.8) 6.25%, rgba(255, 222, 222, 0.8) 8.33333%, rgba(0, 0, 0, 0) 8.33333%, rgba(0, 0, 0, 0) 10.41667%, rgba(255, 222, 222, 0.8) 10.41667%, rgba(255, 222, 222, 0.8) 12.5%, rgba(0, 0, 0, 0) 12.5%, rgba(0, 0, 0, 0) 14.58333%, rgba(255, 222, 222, 0.8) 14.58333%, rgba(255, 222, 222, 0.8) 16.66667%, rgba(0, 0, 0, 0) 16.66667%, rgba(0, 0, 0, 0) 18.75%, rgba(255, 222, 222, 0.8) 18.75%, rgba(255, 222, 222, 0.8) 20.83333%, rgba(0, 0, 0, 0) 20.83333%, rgba(0, 0, 0, 0) 22.91667%, rgba(255, 222, 222, 0.8) 22.91667%, rgba(255, 222, 222, 0.8) 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 27.08333%, rgba(255, 222, 222, 0.8) 27.08333%, rgba(255, 222, 222, 0.8) 29.16667%, rgba(0, 0, 0, 0) 29.16667%, rgba(0, 0, 0, 0) 31.25%, rgba(255, 222, 222, 0.8) 31.25%, rgba(255, 222, 222, 0.8) 33.33333%, rgba(0, 0, 0, 0) 33.33333%, rgba(0, 0, 0, 0) 35.41667%, rgba(255, 222, 222, 0.8) 35.41667%, rgba(255, 222, 222, 0.8) 37.5%, rgba(0, 0, 0, 0) 37.5%, rgba(0, 0, 0, 0) 39.58333%, rgba(255, 222, 222, 0.8) 39.58333%, rgba(255, 222, 222, 0.8) 41.66667%, rgba(0, 0, 0, 0) 41.66667%, rgba(0, 0, 0, 0) 43.75%, rgba(255, 222, 222, 0.8) 43.75%, rgba(255, 222, 222, 0.8) 45.83333%, rgba(0, 0, 0, 0) 45.83333%, rgba(0, 0, 0, 0) 47.91667%, rgba(255, 222, 222, 0.8) 47.91667%, rgba(255, 222, 222, 0.8) 50%, rgba(0, 0, 0, 0) 50%, rgba(0, 0, 0, 0) 52.08333%, rgba(255, 222, 222, 0.8) 52.08333%, rgba(255, 222, 222, 0.8) 54.16667%, rgba(0, 0, 0, 0) 54.16667%, rgba(0, 0, 0, 0) 56.25%, rgba(255, 222, 222, 0.8) 56.25%, rgba(255, 222, 222, 0.8) 58.33333%, rgba(0, 0, 0, 0) 58.33333%, rgba(0, 0, 0, 0) 60.41667%, rgba(255, 222, 222, 0.8) 60.41667%, rgba(255, 222, 222, 0.8) 62.5%, rgba(0, 0, 0, 0) 62.5%, rgba(0, 0, 0, 0) 64.58333%, rgba(255, 222, 222, 0.8) 64.58333%, rgba(255, 222, 222, 0.8) 66.66667%, rgba(0, 0, 0, 0) 66.66667%, rgba(0, 0, 0, 0) 68.75%, rgba(255, 222, 222, 0.8) 68.75%, rgba(255, 222, 222, 0.8) 70.83333%, rgba(0, 0, 0, 0) 70.83333%, rgba(0, 0, 0, 0) 72.91667%, rgba(255, 222, 222, 0.8) 72.91667%, rgba(255, 222, 222, 0.8) 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0) 77.08333%, rgba(255, 222, 222, 0.8) 77.08333%, rgba(255, 222, 222, 0.8) 79.16667%, rgba(0, 0, 0, 0) 79.16667%, rgba(0, 0, 0, 0) 81.25%, rgba(255, 222, 222, 0.8) 81.25%, rgba(255, 222, 222, 0.8) 83.33333%, rgba(0, 0, 0, 0) 83.33333%, rgba(0, 0, 0, 0) 85.41667%, rgba(255, 222, 222, 0.8) 85.41667%, rgba(255, 222, 222, 0.8) 87.5%, rgba(0, 0, 0, 0) 87.5%, rgba(0, 0, 0, 0) 89.58333%, rgba(255, 222, 222, 0.8) 89.58333%, rgba(255, 222, 222, 0.8) 91.66667%, rgba(0, 0, 0, 0) 91.66667%, rgba(0, 0, 0, 0) 93.75%, rgba(255, 222, 222, 0.8) 93.75%, rgba(255, 222, 222, 0.8) 95.83333%, rgba(0, 0, 0, 0) 95.83333%, rgba(0, 0, 0, 0) 97.91667%, rgba(255, 222, 222, 0.8) 97.91667%) -10px top no-repeat;
51
+ /* Test zen-grid-background() with $display-zen-grid-background: false */
52
+ }
data/{templates/unit-tests/test-results → tests/controls}/zen-grid-container.css RENAMED
@@ -14,7 +14,7 @@
14
14
  }
15
15
 
16
16
  #test-zen-grid-container-2 {
17
- /* Test zen-grid-container() with $legacy-support-for-ie7: true */
17
+ /* Test zen-grid-container() with IE 7 support */
18
18
  *position: relative;
19
19
  *zoom: 1;
20
20
  }
@@ -27,7 +27,7 @@
27
27
  }
28
28
 
29
29
  #test-zen-grid-container-3 {
30
- /* Test zen-grid-container() with $legacy-support-for-ie6: true */
30
+ /* Test zen-grid-container() with IE 6 support */
31
31
  *position: relative;
32
32
  *zoom: 1;
33
33
  }
@@ -53,9 +53,9 @@
53
53
  }
54
54
 
55
55
  #test-zen-grid-container-5 {
56
- /* Test zen-grid-container() with $context: flow */
56
+ /* Test zen-grid-container() with $context: flow and $gutters: 21px */
57
57
  margin-left: -10px;
58
- margin-right: -10px;
58
+ margin-right: -11px;
59
59
  padding-left: 0;
60
60
  padding-right: 0;
61
61
  }
@@ -68,7 +68,11 @@
68
68
  }
69
69
 
70
70
  #test-zen-grid-container-6 {
71
- /* Test zen-grid-container() with $zen-gutter-method: margin */
71
+ /* Test zen-grid-container() with $context: flow and $gutters: 21px and $zen-switch-direction: true */
72
+ margin-left: -11px;
73
+ margin-right: -10px;
74
+ padding-left: 0;
75
+ padding-right: 0;
72
76
  }
73
77
  #test-zen-grid-container-6:before, #test-zen-grid-container-6:after {
74
78
  content: "";
@@ -77,3 +81,14 @@
77
81
  #test-zen-grid-container-6:after {
78
82
  clear: both;
79
83
  }
84
+
85
+ #test-zen-grid-container-7 {
86
+ /* Test zen-grid-container() with $zen-gutter-method: margin */
87
+ }
88
+ #test-zen-grid-container-7:before, #test-zen-grid-container-7:after {
89
+ content: "";
90
+ display: table;
91
+ }
92
+ #test-zen-grid-container-7:after {
93
+ clear: both;
94
+ }
data/{templates/unit-tests/test-results → tests/controls}/zen-grid-item-base.css RENAMED
@@ -10,42 +10,43 @@
10
10
  -webkit-box-sizing: border-box;
11
11
  -ms-box-sizing: border-box;
12
12
  box-sizing: border-box;
13
- word-wrap: break-word;
14
13
  /* Test zen-grid-item-base() with $zen-box-sizing: content-box */
15
14
  padding-left: 10px;
16
15
  padding-right: 10px;
17
16
  border-left: 0 !important;
18
17
  border-right: 0 !important;
19
- word-wrap: break-word;
20
- /* Test zen-grid-item-base() with $legacy-support-for-ie7: true */
18
+ /* Test zen-grid-item-base() with $zen-box-sizing: universal-border-box */
19
+ padding-left: 10px;
20
+ padding-right: 10px;
21
+ /* Test zen-grid-item-base() with IE 7 support */
21
22
  padding-left: 10px;
22
23
  padding-right: 10px;
23
24
  -moz-box-sizing: border-box;
24
25
  -webkit-box-sizing: border-box;
25
26
  -ms-box-sizing: border-box;
26
27
  box-sizing: border-box;
27
- word-wrap: break-word;
28
- /* Test zen-grid-item-base() with $box-sizing-polyfill-path: "/boxsizing.htc" and $legacy-support-for-ie7: true */
28
+ *word-wrap: break-word;
29
+ /* Test zen-grid-item-base() with $box-sizing-polyfill-path: "/boxsizing.htc" and IE 7 support */
29
30
  padding-left: 10px;
30
31
  padding-right: 10px;
31
32
  -moz-box-sizing: border-box;
32
33
  -webkit-box-sizing: border-box;
33
34
  -ms-box-sizing: border-box;
34
35
  box-sizing: border-box;
35
- word-wrap: break-word;
36
36
  *behavior: url("/boxsizing.htc");
37
- /* Test zen-grid-item-base() with $box-sizing-polyfill-path: "/boxsizing.htc" and $legacy-support-for-ie6: true */
37
+ *word-wrap: break-word;
38
+ /* Test zen-grid-item-base() with $box-sizing-polyfill-path: "/boxsizing.htc" and IE 6 support */
38
39
  padding-left: 10px;
39
40
  padding-right: 10px;
40
41
  -moz-box-sizing: border-box;
41
42
  -webkit-box-sizing: border-box;
42
43
  -ms-box-sizing: border-box;
43
44
  box-sizing: border-box;
44
- word-wrap: break-word;
45
45
  *behavior: url("/boxsizing.htc");
46
46
  _display: inline;
47
47
  _overflow: hidden;
48
48
  _overflow-y: visible;
49
+ *word-wrap: break-word;
49
50
  /* Test zen-grid-item-base() with $zen-gutters: 15px */
50
51
  padding-left: 7px;
51
52
  padding-right: 8px;
@@ -53,7 +54,6 @@
53
54
  -webkit-box-sizing: border-box;
54
55
  -ms-box-sizing: border-box;
55
56
  box-sizing: border-box;
56
- word-wrap: break-word;
57
57
  /* Test zen-grid-item-base() with $zen-gutters: 15px and $zen-direction: right */
58
58
  padding-left: 8px;
59
59
  padding-right: 7px;
@@ -61,7 +61,6 @@
61
61
  -webkit-box-sizing: border-box;
62
62
  -ms-box-sizing: border-box;
63
63
  box-sizing: border-box;
64
- word-wrap: break-word;
65
64
  /* Test zen-grid-item-base() with $zen-gutters: 15px and $zen-switch-direction: true */
66
65
  padding-left: 8px;
67
66
  padding-right: 7px;
@@ -69,11 +68,9 @@
69
68
  -webkit-box-sizing: border-box;
70
69
  -ms-box-sizing: border-box;
71
70
  box-sizing: border-box;
72
- word-wrap: break-word;
73
71
  /* Test zen-grid-item-base() with $zen-gutter-method: margin */
74
72
  -moz-box-sizing: border-box;
75
73
  -webkit-box-sizing: border-box;
76
74
  -ms-box-sizing: border-box;
77
75
  box-sizing: border-box;
78
- word-wrap: break-word;
79
76
  }
data/{templates/unit-tests/test-results → tests/controls}/zen-grid-item.css RENAMED
@@ -14,7 +14,13 @@
14
14
  -webkit-box-sizing: border-box;
15
15
  -ms-box-sizing: border-box;
16
16
  box-sizing: border-box;
17
- word-wrap: break-word;
17
+ /* Test zen-grid-item(6, 4) with 12 column grid and 20px gutter and $zen-box-sizing: universal-border-box */
18
+ float: left;
19
+ width: 50%;
20
+ margin-left: 25%;
21
+ margin-right: -100%;
22
+ padding-left: 10px;
23
+ padding-right: 10px;
18
24
  /* Test zen-grid-item(3, 3) with box-sizing: content-box, 5 column grid and 10% gutter */
19
25
  float: left;
20
26
  width: 50%;
@@ -24,7 +30,6 @@
24
30
  padding-right: 5%;
25
31
  border-left: 0 !important;
26
32
  border-right: 0 !important;
27
- word-wrap: break-word;
28
33
  /* Turn off $zen-auto-include-grid-item-base */
29
34
  /* Test zen-grid-item(3, 3) with 5 column grid and 40px gutter */
30
35
  float: left;
@@ -66,4 +71,11 @@
66
71
  width: 58%;
67
72
  margin-left: 29%;
68
73
  margin-right: -100%;
74
+ /* Test zen-grid-item(1, 1) with $gutters: 10px and $zen-auto-include-grid-item-base: false */
75
+ float: left;
76
+ width: 100%;
77
+ margin-left: 0%;
78
+ margin-right: -100%;
79
+ padding-left: 5px;
80
+ padding-right: 5px;
69
81
  }
data/tests/tests/compass-compatibility.scss ADDED
@@ -0,0 +1,55 @@
1
+ /**
2
+ * @file
3
+ * Test zen-grid-container() and zen-grid-item() after @import compass.
4
+ */
5
+
6
+ @import "compass";
7
+ @import "zen-grids";
8
+
9
+ $box-sizing-polyfill-path: "/ie-box-sizing.htc";
10
+
11
+ #test-zen-grid-container {
12
+ /* Test zen-grid-container() */
13
+ @include zen-grid-container();
14
+ }
15
+
16
+ #test-zen-grid-container-2 {
17
+ /* Test zen-grid-container() with IE 8 support */
18
+ $browser-minimum-versions: (ie: "8") !global;
19
+ @include zen-grid-container();
20
+ $browser-minimum-versions: (ie: null) !global;
21
+ }
22
+
23
+ #test-zen-grid-container-3 {
24
+ /* Test zen-grid-container() with IE 7 support */
25
+ $browser-minimum-versions: (ie: "7") !global;
26
+ @include zen-grid-container();
27
+ $browser-minimum-versions: (ie: null) !global;
28
+ }
29
+
30
+ #test-zen-grid-container-4 {
31
+ /* Test zen-grid-container() with IE 6 support */
32
+ $browser-minimum-versions: (ie: "6") !global;
33
+ @include zen-grid-container();
34
+ $browser-minimum-versions: (ie: null) !global;
35
+ }
36
+
37
+ #test-zen-grid-item {
38
+ /* Test zen-grid-item(1, 1) */
39
+ @include zen-grid-item(1, 1);
40
+
41
+ /* Test zen-grid-item(1, 1) with IE 8 support */
42
+ $browser-minimum-versions: (ie: "8") !global;
43
+ @include zen-grid-item(1, 1);
44
+ $browser-minimum-versions: (ie: null) !global;
45
+
46
+ /* Test zen-grid-item(1, 1) with IE 7 support */
47
+ $browser-minimum-versions: (ie: "7") !global;
48
+ @include zen-grid-item(1, 1);
49
+ $browser-minimum-versions: (ie: null) !global;
50
+
51
+ /* Test zen-grid-item(1, 1) with IE 6 support */
52
+ $browser-minimum-versions: (ie: "6") !global;
53
+ @include zen-grid-item(1, 1);
54
+ $browser-minimum-versions: (ie: null) !global;
55
+ }
data/{templates/unit-tests/sass → tests/tests}/function-zen-direction-switch.scss RENAMED
@@ -19,5 +19,6 @@
19
19
  float: zen-direction-switch(none);
20
20
 
21
21
  /* Test zen-direction-switch(invalid) */
22
+ @warn "The following test will generate a warning.";
22
23
  float: zen-direction-switch(invalid);
23
24
  }
data/{templates/unit-tests/sass → tests/tests}/function-zen-grid-item-width.scss RENAMED
@@ -10,22 +10,22 @@
10
10
  width: zen-grid-item-width(1);
11
11
 
12
12
  /* Test zen-grid-item-width(2) with $zen-columns: 5 */
13
- $zen-columns: 5;
13
+ $zen-columns: 5 !global;
14
14
  width: zen-grid-item-width(2);
15
- $zen-columns: 1;
15
+ $zen-columns: 1 !global;
16
16
 
17
17
  /* Test zen-grid-item-width(2, 5) */
18
18
  width: zen-grid-item-width(2, 5);
19
19
 
20
20
  /* Test zen-grid-item-width(1) with $zen-grid-width: 100px */
21
- $zen-grid-width: 100px;
21
+ $zen-grid-width: 100px !global;
22
22
  width: zen-grid-item-width(1);
23
- $zen-grid-width: 100%;
23
+ $zen-grid-width: 100% !global;
24
24
 
25
25
  /* Test zen-grid-item-width(2, 5) with $zen-grid-width: 100px */
26
- $zen-grid-width: 100px;
26
+ $zen-grid-width: 100px !global;
27
27
  width: zen-grid-item-width(2, 5);
28
- $zen-grid-width: 100%;
28
+ $zen-grid-width: 100% !global;
29
29
 
30
30
  /* Test zen-grid-item-width(2, 5, $grid-width: 1000px) */
31
31
  width: zen-grid-item-width(2, 5, $grid-width: 1000px);
data/{templates/unit-tests/sass → tests/tests}/function-zen-half-gutter.scss RENAMED
@@ -10,7 +10,7 @@
10
10
  padding-left: zen-half-gutter();
11
11
 
12
12
  /* Test zen-half-gutter() with $zen-gutters: 30px */
13
- $zen-gutters: 30px;
13
+ $zen-gutters: 30px !global;
14
14
  padding-left: zen-half-gutter();
15
15
 
16
16
  /* Test zen-half-gutter(10em) */
@@ -29,7 +29,7 @@
29
29
  padding-left: zen-half-gutter(11px, right);
30
30
 
31
31
  /* Test zen-half-gutter(11px) with $zen-direction: right */
32
- $zen-direction: right;
32
+ $zen-direction: right !global;
33
33
  padding-left: zen-half-gutter(11px);
34
34
 
35
35
  /* Test zen-half-gutter(11px, left) with $zen-direction: right */
data/{templates/unit-tests/sass → tests/tests}/function-zen-unit-width.scss RENAMED
@@ -10,34 +10,34 @@
10
10
  width: zen-unit-width();
11
11
 
12
12
  /* Test zen-unit-width() with $zen-columns: 5 */
13
- $zen-columns: 5;
13
+ $zen-columns: 5 !global;
14
14
  width: zen-unit-width();
15
- $zen-columns: 1;
15
+ $zen-columns: 1 !global;
16
16
 
17
17
  /* Test zen-unit-width(5) */
18
18
  width: zen-unit-width(5);
19
19
 
20
20
  /* Test zen-unit-width() with $zen-grid-width: 100px */
21
- $zen-grid-width: 100px;
21
+ $zen-grid-width: 100px !global;
22
22
  width: zen-unit-width();
23
- $zen-grid-width: 100%;
23
+ $zen-grid-width: 100% !global;
24
24
 
25
25
  /* Test zen-unit-width(5) with $zen-grid-width: 100px */
26
- $zen-grid-width: 100px;
26
+ $zen-grid-width: 100px !global;
27
27
  width: zen-unit-width(5);
28
- $zen-grid-width: 100%;
28
+ $zen-grid-width: 100% !global;
29
29
 
30
30
  /* Test zen-unit-width(5, 100px) */
31
31
  width: zen-unit-width(5, $grid-width: 100px);
32
32
 
33
33
  /* Test zen-unit-width() with $zen-columns: 3, $zen-gutter-method: margin, and $zen-gutters: 5% */
34
- $zen-columns: 3;
35
- $zen-gutter-method: margin;
36
- $zen-gutters: 5%;
34
+ $zen-columns: 3 !global;
35
+ $zen-gutter-method: margin !global;
36
+ $zen-gutters: 5% !global;
37
37
  width: zen-unit-width();
38
- $zen-columns: 1;
39
- $zen-gutter-method: padding;
40
- $zen-gutters: 20px;
38
+ $zen-columns: 1 !global;
39
+ $zen-gutter-method: padding !global;
40
+ $zen-gutters: 20px !global;
41
41
 
42
42
  /* Test zen-unit-width(3, 5px, margin, 100px) */
43
43
  width: zen-unit-width(3, 5px, margin, 100px);
data/{templates/unit-tests/sass → tests/tests}/zen-float.scss RENAMED
@@ -10,9 +10,9 @@
10
10
  @include zen-float();
11
11
 
12
12
  /* Test zen-float() with $zen-direction: right */
13
- $zen-direction: right;
13
+ $zen-direction: right !global;
14
14
  @include zen-float();
15
- $zen-direction: left;
15
+ $zen-direction: left !global;
16
16
 
17
17
  /* Test zen-float(left) */
18
18
  @include zen-float(left);
@@ -21,6 +21,6 @@
21
21
  @include zen-float(left, $switch-direction: TRUE);
22
22
 
23
23
  /* Test zen-float(left) with: $zen-switch-direction: TRUE; */
24
- $zen-switch-direction: TRUE;
24
+ $zen-switch-direction: TRUE !global;
25
25
  @include zen-float(left);
26
26
  }
data/tests/tests/zen-flow-item-width.scss ADDED
@@ -0,0 +1,85 @@
1
+ /**
2
+ * @file
3
+ * Test zen-flow-item-width()
4
+ */
5
+
6
+ @import "zen-grids/flow";
7
+
8
+ #test-zen-flow-item-width {
9
+ // We will use a 5 column grid for all tests.
10
+ $zen-columns: 5 !global;
11
+
12
+ /* Test zen-flow-item-width(1) without setting $parent-column-span */
13
+ @warn "The following test will generate a warning.";
14
+ @include zen-flow-item-width(1);
15
+
16
+ /* Test zen-flow-item-width(1, 4) with 20px gutter */
17
+ @include zen-flow-item-width(1, 4);
18
+
19
+ /* Test zen-flow-item-width(1, 4) with 15px gutter */
20
+ $zen-gutters: 15px !global;
21
+ @include zen-flow-item-width(1, 4);
22
+ $zen-gutters: 20px !global;
23
+
24
+ /* Test zen-flow-item-width(1) with 5 columns, 20px gutter and $zen-grid-width: 1000px */
25
+ $zen-grid-width: 1000px !global;
26
+ @include zen-flow-item-width(1);
27
+ $zen-grid-width: 100% !global;
28
+
29
+ /* Test zen-flow-item-width(1) with 5 columns, 20px gutter, $zen-grid-width: 1000px, $alpha-gutter: true and $omega-gutter: false */
30
+ $zen-grid-width: 1000px !global;
31
+ @include zen-flow-item-width(1, $alpha-gutter: true, $omega-gutter: false);
32
+ $zen-grid-width: 100% !global;
33
+
34
+ /* Test zen-flow-item-width(1) with 5 columns, 20px gutter, $zen-grid-width: 1000px and $omega-gutter: false */
35
+ $zen-grid-width: 1000px !global;
36
+ @include zen-flow-item-width(1, $omega-gutter: false);
37
+ $zen-grid-width: 100% !global;
38
+
39
+ /* Test zen-flow-item-width(1, 4) with 15px gutter and $zen-direction: right */
40
+ $zen-gutters: 15px !global;
41
+ $zen-direction: right !global;
42
+ @include zen-flow-item-width(1, 4);
43
+ $zen-gutters: 20px !global;
44
+ $zen-direction: left !global;
45
+
46
+ /* Test zen-flow-item-width(1, 4) with 15px gutter and $alpha-gutter: true */
47
+ $zen-gutters: 15px !global;
48
+ @include zen-flow-item-width(1, 4, $alpha-gutter: true);
49
+ $zen-gutters: 20px !global;
50
+
51
+ /* Test zen-flow-item-width(1, 4) with 15px gutter and $omega-gutter: false */
52
+ $zen-gutters: 15px !global;
53
+ @include zen-flow-item-width(1, 4, $omega-gutter: false);
54
+ $zen-gutters: 20px !global;
55
+
56
+ /* Test zen-flow-item-width(3, 4) with 20px gutter and $alpha-gutter: true */
57
+ @include zen-flow-item-width(3, 4, $alpha-gutter: true);
58
+
59
+ /* Test zen-flow-item-width(3, 4) with 20px gutter and $omega-gutter: false */
60
+ @include zen-flow-item-width(3, 4, $omega-gutter: false);
61
+
62
+ /* Test zen-flow-item-width(1, 4) with 15px gutter, $zen-direction: right and $alpha-gutter: true */
63
+ $zen-gutters: 15px !global;
64
+ $zen-direction: right !global;
65
+ @include zen-flow-item-width(1, 4, $alpha-gutter: true);
66
+ $zen-gutters: 20px !global;
67
+ $zen-direction: left !global;
68
+
69
+ /* Test zen-flow-item-width(1, 4) with $zen-box-sizing: content-box and 10% gutter */
70
+ $zen-gutters: 10% !global;
71
+ $zen-box-sizing: content-box !global;
72
+ @include zen-flow-item-width(1, 4);
73
+ $zen-gutters: 20px !global;
74
+ $zen-box-sizing: border-box !global;
75
+
76
+ /* Test zen-flow-item-width(1, 4) with $zen-box-sizing: universal-border-box */
77
+ $zen-box-sizing: universal-border-box !global;
78
+ @include zen-flow-item-width(1, 4);
79
+ $zen-box-sizing: border-box !global;
80
+
81
+ /* Test zen-flow-item-width(1, 4) with $zen-auto-include-flow-item-base: false */
82
+ $zen-auto-include-flow-item-base: false !global;
83
+ @include zen-flow-item-width(1, 4);
84
+ $zen-auto-include-flow-item-base: true !global;
85
+ }