madebysource / lesshat

Smart LESS CSS mixins library.
lesshat.com
MIT License
2.19k stars 258 forks source link

.background-image() generating 8121991 #115

Closed ghost closed 10 years ago

ghost commented 10 years ago

After upgrading from 2.0.15 to 3.0.1, the background-image mixin started generating "8121991" instead of the base64 url for the SVG variant of the background-image property.

Seems to be similar to issue #112.

I'm compiling LESS Hat 3.0.1 with grunt 0.4.2 -> grunt-contrib-less 0.10.0 -> less 1.7.0.

I've extracted all of the occurrences of the mixin in my code, to make sure it wasn't conflicting with other includes I have defined and it's still behaving the same way - 18 out of the 36 occurrences generate background-image: 8121991;.

I've also tried to look for a pattern, to see if I could find a possible culprit in the function parameters, but none resulted in 18 matches.

Here is the Less code:

@color1: #111111;
@color2: #fc0097;
@color3: #bf0072;
@color4: #3e0024;
@color5: #0d000d;
@color6: #555555;
@color7: #707070;
@color8: rgb(118,207,255);

// LESS Hat
@import "../../../bower_components/lesshat/build/lesshat.less";

.a1 {
    .background-image(linear-gradient(to bottom, fade(@color4, 66%) 0%, fade(@color5, 0%) 100%));
}

.b1 {
    .background-image(linear-gradient(135deg, fade(@color5, 40%) 0%, fade(rgb(3,0,3), 0%) 80%, fade(black, 0%) 100%));
}

.c1 {
    .background-image(linear-gradient(to bottom, @color7 0%, @color6 100%));
}

.d1 {
    .background-image(linear-gradient(to bottom, @color6 0%, @color7 100%));
}

.e1 {
    .background-image(linear-gradient(to right, transparent 0%, darken(white, 10%) 100%));
}

.f1 {
    .background-image(linear-gradient(to bottom, lighten(@color1, 1%) 0%, lighten(@color1, 10%) 100%));
}

.g1 {
    .background-image(linear-gradient(135deg, fade(@color5, 40%) 0%, fade(rgb(3,0,3), 0%) 80%, fade(black, 0%) 100%));
}

.h1 {
    .background-image(linear-gradient(to bottom, darken(white, 5%) 0%, white 888px));
}

.i1 {
    .background-image(linear-gradient(135deg, fade(@color5, 40%) 0%, fade(rgb(3,0,3), 0%) 80%, fade(black, 0%) 100%));
}

.j1 {
    .background-image(linear-gradient(135deg, fade(@color5, 40%) 0%, fade(rgb(3,0,3), 0%) 80%, fade(black, 0%) 100%));
}

.k1 {
    .background-image(linear-gradient(to bottom, fade(@color5, 40%) 0%, @color8 100%));
}

.l1 {
    .background-image(linear-gradient(to right, fade(@color1, 0%) 0%, @color1 100%));
}

.m1 {
    .background-image(linear-gradient(135deg, fade(@color5, 40%) 0%, fade(rgb(3,0,3), 0%) 80%, fade(black, 0%) 100%));
}

.n1 {
    .background-image(linear-gradient(to right, fade(black, 10%) 0%, fade(black, 10%) 100%));
}

.o1 {
    .background-image(radial-gradient(ellipse at center, fade(black, 50%) 0%, transparent 66%));
}

.p1 {
    .background-image(linear-gradient(135deg, fade(@color5, 40%) 0%, fade(rgb(3,0,3), 0%) 80%, fade(black, 0%) 100%));
}

.q1 {
    .background-image(radial-gradient(to right, fade(@color5, 50%) 0%, fade(@color5, 0%) 66%));
}

.r1 {
    .background-image(linear-gradient(to right, @color2 0%, fade(@color2, 0%) 100%));
}

.s1 {
    .background-image(linear-gradient(to right, fade(@color3, 40%) 0%, fade(@color3, 0%) 100%));
}

.t1 {
    .background-image(linear-gradient(to bottom, fade(black, 11%) 0%, transparent 66%));
}

.u1 {
    .background-image(linear-gradient(to bottom, @color6 0%, @color7 100%));
}

.v1 {
    .background-image(linear-gradient(to bottom, @color6 0%, @color7 100%));
}

.w1 {
    .background-image(linear-gradient(to bottom, fade(@color2, 0%) 0%, @color2 50%, fade(@color2, 0%) 100%));
}

.x1 {
    .background-image(linear-gradient(to bottom, @color6 0%, @color7 100%));
}

.y1 {
    .background-image(linear-gradient(to right, @color1 0%, @color6 100%));
}

.z1 {
    .background-image(linear-gradient(to bottom, fade(@color1, 0%), fade(@color1, 66%) 100%));
}

.a2 {
    .background-image(linear-gradient(to bottom, lighten(@color1, 1%) 0%, lighten(@color1, 10%) 100%));
}

.b2 {
    .background-image(linear-gradient(to bottom, @color7 0%, @color6 100%));
}

.c2 {
    .background-image(linear-gradient(to right, fade(@color6, 0%) 0%, @color6 50%, fade(@color6, 0%) 100%));
}

.d2 {
    .background-image(linear-gradient(to right, fade(@color7, 0%) 0%, @color7 50%, fade(@color7, 0%) 100%));
}

.e2 {
    .background-image(linear-gradient(to right, fade(@color6, 0%) 0%, @color6 50%, fade(@color6, 0%) 100%));
}

.f2 {
    .background-image(linear-gradient(to right, fade(@color7, 0%) 0%, @color7 50%, fade(@color7, 0%) 100%));
}

.g2 {
    .background-image(linear-gradient(to right, fade(@color7, 0%) 0%, @color7 50%, fade(@color7, 0%) 100%));
}

.h2 {
    .background-image(linear-gradient(to right, fade(@color6, 0%) 0%, @color6 50%, fade(@color6, 0%) 100%));
}

.i2 {
    .background-image(linear-gradient(to right, @color6 0%, fade(@color6, 0%) 100%));
}

.j2 {
    .background-image(linear-gradient(to right, @color6 0%, fade(@color6, 0%) 100%));
}

And the compiled CSS:

.a1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYig2MiwgMCwgMzYpIiBzdG9wLW9wYWNpdHk9IjAuNjYiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9InJnYigxMywgMCwgMTMpIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjbGVzc2hhdC1nZW5lcmF0ZWQpIiAvPjwvc3ZnPg==);
  background-image: -webkit-linear-gradient(top, rgba(62, 0, 36, 0.66) 0%, rgba(13, 0, 13, 0) 100%);
  background-image: -moz-linear-gradient(top, rgba(62, 0, 36, 0.66) 0%, rgba(13, 0, 13, 0) 100%);
  background-image: -o-linear-gradient(top, rgba(62, 0, 36, 0.66) 0%, rgba(13, 0, 13, 0) 100%);
  background-image: linear-gradient(to bottom, rgba(62, 0, 36, 0.66) 0%, rgba(13, 0, 13, 0) 100%);
}
.b1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -moz-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -o-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: linear-gradient(135deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
}
.c1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM3MDcwNzAiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU1NTU1NSIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #707070 0%, #555555 100%);
  background-image: -moz-linear-gradient(top, #707070 0%, #555555 100%);
  background-image: -o-linear-gradient(top, #707070 0%, #555555 100%);
  background-image: linear-gradient(to bottom, #707070 0%, #555555 100%);
}
.d1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM1NTU1NTUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzcwNzA3MCIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -moz-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -o-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: linear-gradient(to bottom, #555555 0%, #707070 100%);
}
.e1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2U2ZTZlNiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(left, transparent 0%, #e6e6e6 100%);
  background-image: -moz-linear-gradient(left, transparent 0%, #e6e6e6 100%);
  background-image: -o-linear-gradient(left, transparent 0%, #e6e6e6 100%);
  background-image: linear-gradient(to right, transparent 0%, #e6e6e6 100%);
}
.f1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMxNDE0MTQiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzJiMmIyYiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #141414 0%, #2b2b2b 100%);
  background-image: -moz-linear-gradient(top, #141414 0%, #2b2b2b 100%);
  background-image: -o-linear-gradient(top, #141414 0%, #2b2b2b 100%);
  background-image: linear-gradient(to bottom, #141414 0%, #2b2b2b 100%);
}
.g1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -moz-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -o-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: linear-gradient(135deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
}
.h1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmMmYyZjIiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #f2f2f2 0%, #ffffff 888px);
  background-image: -moz-linear-gradient(top, #f2f2f2 0%, #ffffff 888px);
  background-image: -o-linear-gradient(top, #f2f2f2 0%, #ffffff 888px);
  background-image: linear-gradient(to bottom, #f2f2f2 0%, #ffffff 888px);
}
.i1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -moz-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -o-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: linear-gradient(135deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
}
.j1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -moz-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -o-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: linear-gradient(135deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
}
.k1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(top, rgba(13, 0, 13, 0.4) 0%, #76cfff 100%);
  background-image: -moz-linear-gradient(top, rgba(13, 0, 13, 0.4) 0%, #76cfff 100%);
  background-image: -o-linear-gradient(top, rgba(13, 0, 13, 0.4) 0%, #76cfff 100%);
  background-image: linear-gradient(to bottom, rgba(13, 0, 13, 0.4) 0%, #76cfff 100%);
}
.l1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, rgba(17, 17, 17, 0) 0%, #111111 100%);
  background-image: -moz-linear-gradient(left, rgba(17, 17, 17, 0) 0%, #111111 100%);
  background-image: -o-linear-gradient(left, rgba(17, 17, 17, 0) 0%, #111111 100%);
  background-image: linear-gradient(to right, rgba(17, 17, 17, 0) 0%, #111111 100%);
}
.m1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -moz-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -o-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: linear-gradient(135deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
}
.n1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYigwLCAwLCAwKSIgc3RvcC1vcGFjaXR5PSIwLjEiLz48c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9InJnYigwLCAwLCAwKSIgc3RvcC1vcGFjaXR5PSIwLjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjbGVzc2hhdC1nZW5lcmF0ZWQpIiAvPjwvc3ZnPg==);
  background-image: -webkit-linear-gradient(left, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
  background-image: -moz-linear-gradient(left, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
  background-image: -o-linear-gradient(left, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
  background-image: linear-gradient(to right, rgba(0, 0, 0, 0.1) 0%, rgba(0, 0, 0, 0.1) 100%);
}
.o1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cmFkaWFsR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY3g9IjUwJSIgY3k9IjUwJSIgcj0iNzUlIj48c3RvcCBvZmZzZXQ9IjAlIiBzdG9wLWNvbG9yPSJyZ2IoMCwgMCwgMCkiIHN0b3Atb3BhY2l0eT0iMC41Ii8+PC9yYWRpYWxHcmFkaWVudD48cmVjdCB4PSItNTAiIHk9Ii01MCIgd2lkdGg9IjEwMSIgaGVpZ2h0PSIxMDEiIGZpbGw9InVybCgjbGVzc2hhdC1nZW5lcmF0ZWQpIiAvPjwvc3ZnPg==);
  background-image: -webkit-radial-gradient(center ,ellipse, rgba(0, 0, 0, 0.5) 0%, transparent 66%);
  background-image: -moz-radial-gradient(center ,ellipse, rgba(0, 0, 0, 0.5) 0%, transparent 66%);
  background-image: -o-radial-gradient(center ,ellipse, rgba(0, 0, 0, 0.5) 0%, transparent 66%);
  background-image: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.5) 0%, transparent 66%);
}
.p1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -moz-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: -o-linear-gradient(-45deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
  background-image: linear-gradient(135deg, rgba(13, 0, 13, 0.4) 0%, rgba(3, 0, 3, 0) 80%, rgba(0, 0, 0, 0) 100%);
}
.q1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48cmFkaWFsR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYigxMywgMCwgMTMpIiBzdG9wLW9wYWNpdHk9IjAuNSIvPjxzdG9wIG9mZnNldD0iNjYlIiBzdG9wLWNvbG9yPSJyZ2IoMTMsIDAsIDEzKSIgc3RvcC1vcGFjaXR5PSIwIi8+PC9yYWRpYWxHcmFkaWVudD48cmVjdCB4PSItNTAiIHk9Ii01MCIgd2lkdGg9IjEwMSIgaGVpZ2h0PSIxMDEiIGZpbGw9InVybCgjbGVzc2hhdC1nZW5lcmF0ZWQpIiAvPjwvc3ZnPg==);
  background-image: -webkit-radial-gradient(left, rgba(13, 0, 13, 0.5) 0%, rgba(13, 0, 13, 0) 66%);
  background-image: -moz-radial-gradient(left, rgba(13, 0, 13, 0.5) 0%, rgba(13, 0, 13, 0) 66%);
  background-image: -o-radial-gradient(left, rgba(13, 0, 13, 0.5) 0%, rgba(13, 0, 13, 0) 66%);
  background-image: radial-gradient(to right, rgba(13, 0, 13, 0.5) 0%, rgba(13, 0, 13, 0) 66%);
}
.r1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, #fc0097 0%, rgba(252, 0, 151, 0) 100%);
  background-image: -moz-linear-gradient(left, #fc0097 0%, rgba(252, 0, 151, 0) 100%);
  background-image: -o-linear-gradient(left, #fc0097 0%, rgba(252, 0, 151, 0) 100%);
  background-image: linear-gradient(to right, #fc0097 0%, rgba(252, 0, 151, 0) 100%);
}
.s1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYigxOTEsIDAsIDExNCkiIHN0b3Atb3BhY2l0eT0iMC40Ii8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSJyZ2IoMTkxLCAwLCAxMTQpIiBzdG9wLW9wYWNpdHk9IjAiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjbGVzc2hhdC1nZW5lcmF0ZWQpIiAvPjwvc3ZnPg==);
  background-image: -webkit-linear-gradient(left, rgba(191, 0, 114, 0.4) 0%, rgba(191, 0, 114, 0) 100%);
  background-image: -moz-linear-gradient(left, rgba(191, 0, 114, 0.4) 0%, rgba(191, 0, 114, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(191, 0, 114, 0.4) 0%, rgba(191, 0, 114, 0) 100%);
  background-image: linear-gradient(to right, rgba(191, 0, 114, 0.4) 0%, rgba(191, 0, 114, 0) 100%);
}
.t1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYigwLCAwLCAwKSIgc3RvcC1vcGFjaXR5PSIwLjExIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, rgba(0, 0, 0, 0.11) 0%, transparent 66%);
  background-image: -moz-linear-gradient(top, rgba(0, 0, 0, 0.11) 0%, transparent 66%);
  background-image: -o-linear-gradient(top, rgba(0, 0, 0, 0.11) 0%, transparent 66%);
  background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0.11) 0%, transparent 66%);
}
.u1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM1NTU1NTUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzcwNzA3MCIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -moz-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -o-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: linear-gradient(to bottom, #555555 0%, #707070 100%);
}
.v1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM1NTU1NTUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzcwNzA3MCIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -moz-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -o-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: linear-gradient(to bottom, #555555 0%, #707070 100%);
}
.w1 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(top, rgba(252, 0, 151, 0) 0%, #fc0097 50%, rgba(252, 0, 151, 0) 100%);
  background-image: -moz-linear-gradient(top, rgba(252, 0, 151, 0) 0%, #fc0097 50%, rgba(252, 0, 151, 0) 100%);
  background-image: -o-linear-gradient(top, rgba(252, 0, 151, 0) 0%, #fc0097 50%, rgba(252, 0, 151, 0) 100%);
  background-image: linear-gradient(to bottom, rgba(252, 0, 151, 0) 0%, #fc0097 50%, rgba(252, 0, 151, 0) 100%);
}
.x1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM1NTU1NTUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzcwNzA3MCIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -moz-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: -o-linear-gradient(top, #555555 0%, #707070 100%);
  background-image: linear-gradient(to bottom, #555555 0%, #707070 100%);
}
.y1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIxMDAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMxMTExMTEiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU1NTU1NSIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(left, #111111 0%, #555555 100%);
  background-image: -moz-linear-gradient(left, #111111 0%, #555555 100%);
  background-image: -o-linear-gradient(left, #111111 0%, #555555 100%);
  background-image: linear-gradient(to right, #111111 0%, #555555 100%);
}
.z1 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYigxNywgMTcsIDE3KSIgc3RvcC1vcGFjaXR5PSIwIi8+PHN0b3Agb2Zmc2V0PSIxMDAlIiBzdG9wLWNvbG9yPSJyZ2IoMTcsIDE3LCAxNykiIHN0b3Atb3BhY2l0eT0iMC42NiIvPjwvbGluZWFyR3JhZGllbnQ+PHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNsZXNzaGF0LWdlbmVyYXRlZCkiIC8+PC9zdmc+);
  background-image: -webkit-linear-gradient(top, rgba(17, 17, 17, 0), rgba(17, 17, 17, 0.66) 100%);
  background-image: -moz-linear-gradient(top, rgba(17, 17, 17, 0), rgba(17, 17, 17, 0.66) 100%);
  background-image: -o-linear-gradient(top, rgba(17, 17, 17, 0), rgba(17, 17, 17, 0.66) 100%);
  background-image: linear-gradient(to bottom, rgba(17, 17, 17, 0), rgba(17, 17, 17, 0.66) 100%);
}
.a2 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMxNDE0MTQiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzJiMmIyYiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #141414 0%, #2b2b2b 100%);
  background-image: -moz-linear-gradient(top, #141414 0%, #2b2b2b 100%);
  background-image: -o-linear-gradient(top, #141414 0%, #2b2b2b 100%);
  background-image: linear-gradient(to bottom, #141414 0%, #2b2b2b 100%);
}
.b2 {
  background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiM3MDcwNzAiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzU1NTU1NSIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  background-image: -webkit-linear-gradient(top, #707070 0%, #555555 100%);
  background-image: -moz-linear-gradient(top, #707070 0%, #555555 100%);
  background-image: -o-linear-gradient(top, #707070 0%, #555555 100%);
  background-image: linear-gradient(to bottom, #707070 0%, #555555 100%);
}
.c2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: -moz-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: linear-gradient(to right, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
}
.d2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: -moz-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: linear-gradient(to right, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
}
.e2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: -moz-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: linear-gradient(to right, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
}
.f2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: -moz-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: linear-gradient(to right, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
}
.g2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: -moz-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
  background-image: linear-gradient(to right, rgba(112, 112, 112, 0) 0%, #707070 50%, rgba(112, 112, 112, 0) 100%);
}
.h2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: -moz-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: -o-linear-gradient(left, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
  background-image: linear-gradient(to right, rgba(85, 85, 85, 0) 0%, #555555 50%, rgba(85, 85, 85, 0) 100%);
}
.i2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, #555555 0%, rgba(85, 85, 85, 0) 100%);
  background-image: -moz-linear-gradient(left, #555555 0%, rgba(85, 85, 85, 0) 100%);
  background-image: -o-linear-gradient(left, #555555 0%, rgba(85, 85, 85, 0) 100%);
  background-image: linear-gradient(to right, #555555 0%, rgba(85, 85, 85, 0) 100%);
}
.j2 {
  background-image: 8121991;
  background-image: -webkit-linear-gradient(left, #555555 0%, rgba(85, 85, 85, 0) 100%);
  background-image: -moz-linear-gradient(left, #555555 0%, rgba(85, 85, 85, 0) 100%);
  background-image: -o-linear-gradient(left, #555555 0%, rgba(85, 85, 85, 0) 100%);
  background-image: linear-gradient(to right, #555555 0%, rgba(85, 85, 85, 0) 100%);
}
petrbrzek commented 10 years ago

Almost everything is fixed in 3.0.2. You can now combine hex and rgb colors without problems. I didn't fix the radial gradient case. You can get radial gradient only if you use ellipse at center for now. I'll add more options later.

ghost commented 10 years ago

Nice, looking forward to the release :)

Edit: Ah wicked, it's already released!