CSS Slug

JADE
.frame .background .top .line_1 .line_2 .line_3 .line_4 .line_5 .line_6 .line_7 .line_8 .line_9 .line_10 .line_11 .line_12 .line_13 .line_14 .ground .line_1 .line_2 .line_3 .line_4 .line_5 #slug.slug_key-1
STYLUS
pixel = 12px color_bg = rgba(62,39,35,1) color_ground = rgba(33,33,33,1) color_slug = rgba(130,119,23,.8) color_grass = rgba(85,139,47,1) darken_stone = 75% * *:before *:after margin: 0 padding: 0 html body width: 100% height: 100% .frame position: relative width: 100% height: 100% background: color_bg .background position: relative width: 100% height: 100% background: linear-gradient( to bottom, darken(color_bg, 60%) (6.25% * 0), darken(color_bg, 60%) (6.25% * 4), darken(color_bg, 40%) (6.25% * 4), darken(color_bg, 40%) (6.25% * 10), darken(color_bg, 20%) (6.25% * 10) ) repeat-x background-size: pixel (pixel * 16) !important .top position: absolute top: 0 right: 0 bottom: 0 left: 0 .line_1 .line_2 .line_3 .line_4 .line_5 .line_6 .line_7 .line_8 .line_9 .line_10 .line_11 .line_12 .line_13 .line_14 width: 100% height: pixel background-size: (pixel * 16) pixel !important .line_1 background: linear-gradient(to right, darken(color_bg, darken_stone) (6.25% * 12), transparent (6.25% * 12)) repeat-x .line_2 background: linear-gradient(to right, transparent (6.25% * 1), darken(color_bg, darken_stone) (6.25% * 1), darken(color_bg, darken_stone) (6.25% * 11), transparent (6.25% * 11)) repeat-x .line_3 background: linear-gradient(to right, transparent (6.25% * 2), darken(color_bg, darken_stone) (6.25% * 2), darken(color_bg, darken_stone) (6.25% * 10), transparent (6.25% * 10)) repeat-x .line_4 background: linear-gradient(to right, transparent (6.25% * 3), darken(color_bg, darken_stone) (6.25% * 3), darken(color_bg, darken_stone) (6.25% * 10), transparent (6.25% * 10)) repeat-x .line_5 background: linear-gradient(to right, transparent (6.25% * 3), darken(color_bg, darken_stone) (6.25% * 3), darken(color_bg, darken_stone) (6.25% * 10), transparent (6.25% * 10)) repeat-x .line_6 background: linear-gradient(to right, transparent (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 9), transparent (6.25% * 9)) repeat-x .line_7 background: linear-gradient(to right, transparent (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 8), transparent (6.25% * 8)) repeat-x .line_8 background: linear-gradient(to right, transparent (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 8), transparent (6.25% * 8)) repeat-x .line_9 background: linear-gradient(to right, transparent (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 7), transparent (6.25% * 7)) repeat-x .line_10 background: linear-gradient(to right, transparent (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 8), transparent (6.25% * 8)) repeat-x .line_11 background: linear-gradient(to right, transparent (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 7), transparent (6.25% * 7)) repeat-x .line_12 background: linear-gradient(to right, transparent (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 7), transparent (6.25% * 7)) repeat-x .line_13 background: linear-gradient(to right, transparent (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 6), transparent (6.25% * 6)) repeat-x .line_14 background: linear-gradient(to right, transparent (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 6), transparent (6.25% * 6)) repeat-x .ground position: absolute top: 75% right: 0 bottom: 0 left: 0 background: linear-gradient( to bottom, darken(color_ground, 60%) (6.25% * 0), darken(color_ground, 60%) (6.25% * 2), darken(color_ground, 40%) (6.25% * 2), darken(color_ground, 40%) (6.25% * 6), darken(color_ground, 20%) (6.25% * 6) ) repeat-x background-size: pixel (pixel * 16) !important .line_1 .line_2 .line_3 .line_4 .line_5 width: 100% height: pixel background-size: (pixel * 16) pixel !important .line_1 background: linear-gradient(to right, darken(color_bg, darken_stone) (6.25% * 15), transparent (6.25% * 15)) repeat-x .line_2 background: linear-gradient(to right, transparent (6.25% * 1), darken(color_bg, darken_stone) (6.25% * 1), darken(color_bg, darken_stone) (6.25% * 11), transparent (6.25% * 11)) repeat-x .line_3 background: linear-gradient(to right, transparent (6.25% * 2), darken(color_bg, darken_stone) (6.25% * 2), darken(color_bg, darken_stone) (6.25% * 10), transparent (6.25% * 10)) repeat-x .line_4 background: linear-gradient(to right, transparent (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 4), darken(color_bg, darken_stone) (6.25% * 6), transparent (6.25% * 6)) repeat-x .line_5 background: linear-gradient(to right, transparent (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 5), darken(color_bg, darken_stone) (6.25% * 6), transparent (6.25% * 6)) repeat-x #slug position: absolute display: block width: pixel height: @width left: 30% bottom: 25% .slug_key-1 box-shadow: (pixel * 1) (pixel * -0) darken(color_slug, 50%), (pixel * 1) (pixel * -1) darken(color_slug, 50%), (pixel * 1) (pixel * -2) darken(color_slug, 50%), (pixel * 1) (pixel * -3) darken(color_slug, 50%), (pixel * 1) (pixel * -4) darken(color_slug, 50%), (pixel * 1) (pixel * -5) darken(color_slug, 50%), (pixel * 1) (pixel * -6) darken(color_slug, 50%), (pixel * 1) (pixel * -7) darken(color_slug, 50%), (pixel * 1) (pixel * -8) darken(color_slug, 50%), (pixel * 1) (pixel * -9) darken(color_slug, 50%), (pixel * 1) (pixel * -10) darken(color_slug, 50%), (pixel * 2) (pixel * -11) darken(color_slug, 50%), (pixel * 3) (pixel * -11) darken(color_slug, 50%), (pixel * 4) (pixel * -11) darken(color_slug, 50%), (pixel * 5) (pixel * -11) darken(color_slug, 50%), (pixel * 6) (pixel * -11) darken(color_slug, 50%), (pixel * 7) (pixel * -11) darken(color_slug, 50%), (pixel * 8) (pixel * -11) darken(color_slug, 50%), (pixel * 9) (pixel * -11) darken(color_slug, 50%), (pixel * 10) (pixel * -11) darken(color_slug, 50%), (pixel * 11) (pixel * -11) darken(color_slug, 50%), (pixel * 12) (pixel * -11) darken(color_slug, 50%), (pixel * 13) (pixel * -0) darken(color_slug, 50%), (pixel * 13) (pixel * -1) darken(color_slug, 50%), (pixel * 13) (pixel * -2) darken(color_slug, 50%), (pixel * 13) (pixel * -3) darken(color_slug, 50%), (pixel * 13) (pixel * -4) darken(color_slug, 50%), (pixel * 13) (pixel * -5) darken(color_slug, 50%), (pixel * 13) (pixel * -6) darken(color_slug, 50%), (pixel * 13) (pixel * -7) darken(color_slug, 50%), (pixel * 13) (pixel * -8) darken(color_slug, 50%), (pixel * 13) (pixel * -9) darken(color_slug, 50%), (pixel * 13) (pixel * -10) darken(color_slug, 50%), (pixel * 2) (pixel * 0) darken(color_slug, 50%), (pixel * 3) (pixel * 0) darken(color_slug, 50%), (pixel * 4) (pixel * 0) darken(color_slug, 50%), (pixel * 5) (pixel * 0) darken(color_slug, 50%), (pixel * 6) (pixel * 0) darken(color_slug, 50%), (pixel * 7) (pixel * 0) darken(color_slug, 50%), (pixel * 8) (pixel * 0) darken(color_slug, 50%), (pixel * 9) (pixel * 0) darken(color_slug, 50%), (pixel * 10) (pixel * 0) darken(color_slug, 50%), (pixel * 11) (pixel * 0) darken(color_slug, 50%), (pixel * 12) (pixel * 0) darken(color_slug, 50%), (pixel * 7) (pixel * -8) darken(color_slug, 50%), (pixel * 7) (pixel * -7) darken(color_slug, 50%), (pixel * 8) (pixel * -8) darken(color_slug, 50%), (pixel * 8) (pixel * -7) darken(color_slug, 50%), (pixel * 11) (pixel * -8) darken(color_slug, 50%), (pixel * 11) (pixel * -7) darken(color_slug, 50%), (pixel * 2) (pixel * -1) darken(color_slug, 25%), (pixel * 2) (pixel * -2) color_slug, (pixel * 2) (pixel * -3) color_slug, (pixel * 2) (pixel * -4) color_slug, (pixel * 2) (pixel * -5) color_slug, (pixel * 2) (pixel * -6) color_slug, (pixel * 2) (pixel * -7) color_slug, (pixel * 2) (pixel * -8) color_slug, (pixel * 2) (pixel * -9) color_slug, (pixel * 2) (pixel * -10) color_slug, (pixel * 3) (pixel * -1) color_slug, (pixel * 3) (pixel * -2) color_slug, (pixel * 3) (pixel * -3) color_slug, (pixel * 3) (pixel * -4) color_slug, (pixel * 3) (pixel * -5) color_slug, (pixel * 3) (pixel * -6) color_slug, (pixel * 3) (pixel * -7) color_slug, (pixel * 3) (pixel * -8) color_slug, (pixel * 3) (pixel * -9) color_slug, (pixel * 3) (pixel * -10) color_slug, (pixel * 4) (pixel * -1) darken(color_slug, 25%), (pixel * 4) (pixel * -2) color_slug, (pixel * 4) (pixel * -3) color_slug, (pixel * 4) (pixel * -4) color_slug, (pixel * 4) (pixel * -5) color_slug, (pixel * 4) (pixel * -6) color_slug, (pixel * 4) (pixel * -7) color_slug, (pixel * 4) (pixel * -8) color_slug, (pixel * 4) (pixel * -9) color_slug, (pixel * 4) (pixel * -10) color_slug, (pixel * 5) (pixel * -1) color_slug, (pixel * 5) (pixel * -2) color_slug, (pixel * 5) (pixel * -3) color_slug, (pixel * 5) (pixel * -4) color_slug, (pixel * 5) (pixel * -5) color_slug, (pixel * 5) (pixel * -6) color_slug, (pixel * 5) (pixel * -7) color_slug, (pixel * 5) (pixel * -8) color_slug, (pixel * 5) (pixel * -9) color_slug, (pixel * 5) (pixel * -10) color_slug, (pixel * 6) (pixel * -1) darken(color_slug, 25%), (pixel * 6) (pixel * -2) color_slug, (pixel * 6) (pixel * -3) color_slug, (pixel * 6) (pixel * -4) color_slug, (pixel * 6) (pixel * -5) color_slug, (pixel * 6) (pixel * -6) color_slug, (pixel * 6) (pixel * -7) color_slug, (pixel * 6) (pixel * -8) color_slug, (pixel * 6) (pixel * -9) color_slug, (pixel * 6) (pixel * -10) color_slug, (pixel * 7) (pixel * -1) color_slug, (pixel * 7) (pixel * -2) color_slug, (pixel * 7) (pixel * -3) color_slug, (pixel * 7) (pixel * -4) color_slug, (pixel * 7) (pixel * -5) color_slug, (pixel * 7) (pixel * -6) color_slug, (pixel * 7) (pixel * -9) color_slug, (pixel * 7) (pixel * -10) color_slug, (pixel * 8) (pixel * -1) darken(color_slug, 25%), (pixel * 8) (pixel * -2) color_slug, (pixel * 8) (pixel * -3) color_slug, (pixel * 8) (pixel * -4) color_slug, (pixel * 8) (pixel * -5) color_slug, (pixel * 8) (pixel * -6) color_slug, (pixel * 8) (pixel * -9) color_slug, (pixel * 8) (pixel * -10) color_slug, (pixel * 9) (pixel * -1) color_slug, (pixel * 9) (pixel * -2) color_slug, (pixel * 9) (pixel * -3) color_slug, (pixel * 9) (pixel * -4) color_slug, (pixel * 9) (pixel * -5) color_slug, (pixel * 9) (pixel * -6) color_slug, (pixel * 9) (pixel * -7) color_slug, (pixel * 9) (pixel * -8) color_slug, (pixel * 9) (pixel * -9) color_slug, (pixel * 9) (pixel * -10) color_slug, (pixel * 10) (pixel * -1) darken(color_slug, 25%), (pixel * 10) (pixel * -2) color_slug, (pixel * 10) (pixel * -3) color_slug, (pixel * 10) (pixel * -4) color_slug, (pixel * 10) (pixel * -5) color_slug, (pixel * 10) (pixel * -6) color_slug, (pixel * 10) (pixel * -7) color_slug, (pixel * 10) (pixel * -8) color_slug, (pixel * 10) (pixel * -9) color_slug, (pixel * 10) (pixel * -10) color_slug, (pixel * 11) (pixel * -1) color_slug, (pixel * 11) (pixel * -2) color_slug, (pixel * 11) (pixel * -3) color_slug, (pixel * 11) (pixel * -4) color_slug, (pixel * 11) (pixel * -5) color_slug, (pixel * 11) (pixel * -6) color_slug, (pixel * 11) (pixel * -9) color_slug, (pixel * 11) (pixel * -10) color_slug, (pixel * 12) (pixel * -1) darken(color_slug, 25%), (pixel * 12) (pixel * -2) color_slug, (pixel * 12) (pixel * -3) color_slug, (pixel * 12) (pixel * -4) color_slug, (pixel * 12) (pixel * -5) color_slug, (pixel * 12) (pixel * -6) color_slug, (pixel * 12) (pixel * -7) color_slug, (pixel * 12) (pixel * -8) color_slug, (pixel * 12) (pixel * -9) color_slug, (pixel * 12) (pixel * -10) color_slug .slug_key-2 box-shadow: (pixel * 1) (pixel * -0) darken(color_slug, 50%), (pixel * 1) (pixel * -1) darken(color_slug, 50%), (pixel * 1) (pixel * -2) darken(color_slug, 50%), (pixel * 1) (pixel * -3) darken(color_slug, 50%), (pixel * 1) (pixel * -4) darken(color_slug, 50%), (pixel * 1) (pixel * -5) darken(color_slug, 50%), (pixel * 1) (pixel * -6) darken(color_slug, 50%), (pixel * 1) (pixel * -7) darken(color_slug, 50%), (pixel * 2) (pixel * -8) darken(color_slug, 50%), (pixel * 3) (pixel * -8) darken(color_slug, 50%), (pixel * 4) (pixel * -8) darken(color_slug, 50%), (pixel * 5) (pixel * -8) darken(color_slug, 50%), (pixel * 6) (pixel * -8) darken(color_slug, 50%), (pixel * 7) (pixel * -8) darken(color_slug, 50%), (pixel * 8) (pixel * -8) darken(color_slug, 50%), (pixel * 9) (pixel * -8) darken(color_slug, 50%), (pixel * 10) (pixel * -8) darken(color_slug, 50%), (pixel * 11) (pixel * -8) darken(color_slug, 50%), (pixel * 12) (pixel * -8) darken(color_slug, 50%), (pixel * 13) (pixel * -8) darken(color_slug, 50%), (pixel * 14) (pixel * -0) darken(color_slug, 50%), (pixel * 14) (pixel * -1) darken(color_slug, 50%), (pixel * 14) (pixel * -2) darken(color_slug, 50%), (pixel * 14) (pixel * -3) darken(color_slug, 50%), (pixel * 14) (pixel * -4) darken(color_slug, 50%), (pixel * 14) (pixel * -5) darken(color_slug, 50%), (pixel * 14) (pixel * -6) darken(color_slug, 50%), (pixel * 14) (pixel * -7) darken(color_slug, 50%), (pixel * 2) (pixel * 0) darken(color_slug, 50%), (pixel * 3) (pixel * 0) darken(color_slug, 50%), (pixel * 4) (pixel * 0) darken(color_slug, 50%), (pixel * 5) (pixel * 0) darken(color_slug, 50%), (pixel * 6) (pixel * 0) darken(color_slug, 50%), (pixel * 7) (pixel * 0) darken(color_slug, 50%), (pixel * 8) (pixel * 0) darken(color_slug, 50%), (pixel * 9) (pixel * 0) darken(color_slug, 50%), (pixel * 10) (pixel * 0) darken(color_slug, 50%), (pixel * 11) (pixel * 0) darken(color_slug, 50%), (pixel * 12) (pixel * 0) darken(color_slug, 50%), (pixel * 13) (pixel * 0) darken(color_slug, 50%), (pixel * 7) (pixel * -6) darken(color_slug, 50%), (pixel * 7) (pixel * -5) darken(color_slug, 50%), (pixel * 8) (pixel * -6) darken(color_slug, 50%), (pixel * 8) (pixel * -5) darken(color_slug, 50%), (pixel * 11) (pixel * -6) darken(color_slug, 50%), (pixel * 11) (pixel * -5) darken(color_slug, 50%), (pixel * 2) (pixel * -1) darken(color_slug, 25%), (pixel * 2) (pixel * -2) color_slug, (pixel * 2) (pixel * -3) color_slug, (pixel * 2) (pixel * -4) color_slug, (pixel * 2) (pixel * -5) color_slug, (pixel * 2) (pixel * -6) color_slug, (pixel * 2) (pixel * -7) color_slug, (pixel * 3) (pixel * -1) color_slug, (pixel * 3) (pixel * -2) color_slug, (pixel * 3) (pixel * -3) color_slug, (pixel * 3) (pixel * -4) color_slug, (pixel * 3) (pixel * -5) color_slug, (pixel * 3) (pixel * -6) color_slug, (pixel * 3) (pixel * -7) color_slug, (pixel * 4) (pixel * -1) darken(color_slug, 25%), (pixel * 4) (pixel * -2) color_slug, (pixel * 4) (pixel * -3) color_slug, (pixel * 4) (pixel * -4) color_slug, (pixel * 4) (pixel * -5) color_slug, (pixel * 4) (pixel * -6) color_slug, (pixel * 4) (pixel * -7) color_slug, (pixel * 5) (pixel * -1) color_slug, (pixel * 5) (pixel * -2) color_slug, (pixel * 5) (pixel * -3) color_slug, (pixel * 5) (pixel * -4) color_slug, (pixel * 5) (pixel * -5) color_slug, (pixel * 5) (pixel * -6) color_slug, (pixel * 5) (pixel * -7) color_slug, (pixel * 6) (pixel * -1) darken(color_slug, 25%), (pixel * 6) (pixel * -2) color_slug, (pixel * 6) (pixel * -3) color_slug, (pixel * 6) (pixel * -4) color_slug, (pixel * 6) (pixel * -5) color_slug, (pixel * 6) (pixel * -6) color_slug, (pixel * 6) (pixel * -7) color_slug, (pixel * 7) (pixel * -1) color_slug, (pixel * 7) (pixel * -2) color_slug, (pixel * 7) (pixel * -3) color_slug, (pixel * 7) (pixel * -4) color_slug, (pixel * 7) (pixel * -7) color_slug, (pixel * 8) (pixel * -1) darken(color_slug, 25%), (pixel * 8) (pixel * -2) color_slug, (pixel * 8) (pixel * -3) color_slug, (pixel * 8) (pixel * -4) color_slug, (pixel * 8) (pixel * -7) color_slug, (pixel * 9) (pixel * -1) color_slug, (pixel * 9) (pixel * -2) color_slug, (pixel * 9) (pixel * -3) color_slug, (pixel * 9) (pixel * -4) color_slug, (pixel * 9) (pixel * -5) color_slug, (pixel * 9) (pixel * -6) color_slug, (pixel * 9) (pixel * -7) color_slug, (pixel * 10) (pixel * -1) darken(color_slug, 25%), (pixel * 10) (pixel * -2) color_slug, (pixel * 10) (pixel * -3) color_slug, (pixel * 10) (pixel * -4) color_slug, (pixel * 10) (pixel * -5) color_slug, (pixel * 10) (pixel * -6) color_slug, (pixel * 10) (pixel * -7) color_slug, (pixel * 11) (pixel * -1) color_slug, (pixel * 11) (pixel * -2) color_slug, (pixel * 11) (pixel * -3) color_slug, (pixel * 11) (pixel * -4) color_slug, (pixel * 11) (pixel * -7) color_slug, (pixel * 12) (pixel * -1) darken(color_slug, 25%), (pixel * 12) (pixel * -2) color_slug, (pixel * 12) (pixel * -3) color_slug, (pixel * 12) (pixel * -4) color_slug, (pixel * 12) (pixel * -5) color_slug, (pixel * 12) (pixel * -6) color_slug, (pixel * 12) (pixel * -7) color_slug, (pixel * 13) (pixel * -1) color_slug, (pixel * 13) (pixel * -2) color_slug, (pixel * 13) (pixel * -3) color_slug, (pixel * 13) (pixel * -4) color_slug, (pixel * 13) (pixel * -5) color_slug, (pixel * 13) (pixel * -6) color_slug, (pixel * 13) (pixel * -7) color_slug .slug_key-3 box-shadow: (pixel * 2) (pixel * -0) darken(color_slug, 50%), (pixel * 2) (pixel * -1) darken(color_slug, 50%), (pixel * 2) (pixel * -2) darken(color_slug, 50%), (pixel * 2) (pixel * -3) darken(color_slug, 50%), (pixel * 2) (pixel * -4) darken(color_slug, 50%), (pixel * 2) (pixel * -5) darken(color_slug, 50%), (pixel * 2) (pixel * -6) darken(color_slug, 50%), (pixel * 2) (pixel * -7) darken(color_slug, 50%), (pixel * 2) (pixel * -8) darken(color_slug, 50%), (pixel * 2) (pixel * -9) darken(color_slug, 50%), (pixel * 2) (pixel * -10) darken(color_slug, 50%), (pixel * 2) (pixel * -11) darken(color_slug, 50%), (pixel * 2) (pixel * -12) darken(color_slug, 50%), (pixel * 2) (pixel * -13) darken(color_slug, 50%), (pixel * 3) (pixel * -14) darken(color_slug, 50%), (pixel * 4) (pixel * -14) darken(color_slug, 50%), (pixel * 5) (pixel * -14) darken(color_slug, 50%), (pixel * 6) (pixel * -14) darken(color_slug, 50%), (pixel * 7) (pixel * -14) darken(color_slug, 50%), (pixel * 8) (pixel * -14) darken(color_slug, 50%), (pixel * 9) (pixel * -14) darken(color_slug, 50%), (pixel * 10) (pixel * -14) darken(color_slug, 50%), (pixel * 11) (pixel * -14) darken(color_slug, 50%), (pixel * 12) (pixel * -0) darken(color_slug, 50%), (pixel * 12) (pixel * -1) darken(color_slug, 50%), (pixel * 12) (pixel * -2) darken(color_slug, 50%), (pixel * 12) (pixel * -3) darken(color_slug, 50%), (pixel * 12) (pixel * -4) darken(color_slug, 50%), (pixel * 12) (pixel * -5) darken(color_slug, 50%), (pixel * 12) (pixel * -6) darken(color_slug, 50%), (pixel * 12) (pixel * -7) darken(color_slug, 50%), (pixel * 12) (pixel * -8) darken(color_slug, 50%), (pixel * 12) (pixel * -9) darken(color_slug, 50%), (pixel * 12) (pixel * -10) darken(color_slug, 50%), (pixel * 12) (pixel * -11) darken(color_slug, 50%), (pixel * 12) (pixel * -12) darken(color_slug, 50%), (pixel * 12) (pixel * -13) darken(color_slug, 50%), (pixel * 2) (pixel * 0) darken(color_slug, 50%), (pixel * 3) (pixel * 0) darken(color_slug, 50%), (pixel * 4) (pixel * 0) darken(color_slug, 50%), (pixel * 5) (pixel * 0) darken(color_slug, 50%), (pixel * 6) (pixel * 0) darken(color_slug, 50%), (pixel * 7) (pixel * 0) darken(color_slug, 50%), (pixel * 8) (pixel * 0) darken(color_slug, 50%), (pixel * 9) (pixel * 0) darken(color_slug, 50%), (pixel * 10) (pixel * 0) darken(color_slug, 50%), (pixel * 11) (pixel * 0) darken(color_slug, 50%), (pixel * 12) (pixel * 0) darken(color_slug, 50%), (pixel * 7) (pixel * -11) darken(color_slug, 50%), (pixel * 7) (pixel * -10) darken(color_slug, 50%), (pixel * 8) (pixel * -11) darken(color_slug, 50%), (pixel * 8) (pixel * -10) darken(color_slug, 50%), (pixel * 11) (pixel * -11) darken(color_slug, 50%), (pixel * 11) (pixel * -10) darken(color_slug, 50%), (pixel * 3) (pixel * -1) color_slug, (pixel * 3) (pixel * -2) color_slug, (pixel * 3) (pixel * -3) color_slug, (pixel * 3) (pixel * -4) color_slug, (pixel * 3) (pixel * -5) color_slug, (pixel * 3) (pixel * -6) color_slug, (pixel * 3) (pixel * -7) color_slug, (pixel * 3) (pixel * -8) color_slug, (pixel * 3) (pixel * -9) color_slug, (pixel * 3) (pixel * -10) color_slug, (pixel * 3) (pixel * -11) color_slug, (pixel * 3) (pixel * -12) color_slug, (pixel * 3) (pixel * -13) color_slug, (pixel * 4) (pixel * -1) darken(color_slug, 25%), (pixel * 4) (pixel * -2) color_slug, (pixel * 4) (pixel * -3) color_slug, (pixel * 4) (pixel * -4) color_slug, (pixel * 4) (pixel * -5) color_slug, (pixel * 4) (pixel * -6) color_slug, (pixel * 4) (pixel * -7) color_slug, (pixel * 4) (pixel * -8) color_slug, (pixel * 4) (pixel * -9) color_slug, (pixel * 4) (pixel * -10) color_slug, (pixel * 4) (pixel * -11) color_slug, (pixel * 4) (pixel * -12) color_slug, (pixel * 4) (pixel * -13) color_slug, (pixel * 5) (pixel * -1) color_slug, (pixel * 5) (pixel * -2) color_slug, (pixel * 5) (pixel * -3) color_slug, (pixel * 5) (pixel * -4) color_slug, (pixel * 5) (pixel * -5) color_slug, (pixel * 5) (pixel * -6) color_slug, (pixel * 5) (pixel * -7) color_slug, (pixel * 5) (pixel * -8) color_slug, (pixel * 5) (pixel * -9) color_slug, (pixel * 5) (pixel * -10) color_slug, (pixel * 5) (pixel * -11) color_slug, (pixel * 5) (pixel * -12) color_slug, (pixel * 5) (pixel * -13) color_slug, (pixel * 6) (pixel * -1) darken(color_slug, 25%), (pixel * 6) (pixel * -2) color_slug, (pixel * 6) (pixel * -3) color_slug, (pixel * 6) (pixel * -4) color_slug, (pixel * 6) (pixel * -5) color_slug, (pixel * 6) (pixel * -6) color_slug, (pixel * 6) (pixel * -7) color_slug, (pixel * 6) (pixel * -8) color_slug, (pixel * 6) (pixel * -9) color_slug, (pixel * 6) (pixel * -10) color_slug, (pixel * 6) (pixel * -11) color_slug, (pixel * 6) (pixel * -12) color_slug, (pixel * 6) (pixel * -13) color_slug, (pixel * 7) (pixel * -1) color_slug, (pixel * 7) (pixel * -2) color_slug, (pixel * 7) (pixel * -3) color_slug, (pixel * 7) (pixel * -4) color_slug, (pixel * 7) (pixel * -5) color_slug, (pixel * 7) (pixel * -6) color_slug, (pixel * 7) (pixel * -7) color_slug, (pixel * 7) (pixel * -8) color_slug, (pixel * 7) (pixel * -9) color_slug, (pixel * 7) (pixel * -12) color_slug, (pixel * 7) (pixel * -13) color_slug, (pixel * 8) (pixel * -1) darken(color_slug, 25%), (pixel * 8) (pixel * -2) color_slug, (pixel * 8) (pixel * -3) color_slug, (pixel * 8) (pixel * -4) color_slug, (pixel * 8) (pixel * -5) color_slug, (pixel * 8) (pixel * -6) color_slug, (pixel * 8) (pixel * -7) color_slug, (pixel * 8) (pixel * -8) color_slug, (pixel * 8) (pixel * -9) color_slug, (pixel * 8) (pixel * -12) color_slug, (pixel * 8) (pixel * -13) color_slug, (pixel * 9) (pixel * -1) color_slug, (pixel * 9) (pixel * -2) color_slug, (pixel * 9) (pixel * -3) color_slug, (pixel * 9) (pixel * -4) color_slug, (pixel * 9) (pixel * -5) color_slug, (pixel * 9) (pixel * -6) color_slug, (pixel * 9) (pixel * -7) color_slug, (pixel * 9) (pixel * -8) color_slug, (pixel * 9) (pixel * -9) color_slug, (pixel * 9) (pixel * -10) color_slug, (pixel * 9) (pixel * -11) color_slug, (pixel * 9) (pixel * -12) color_slug, (pixel * 9) (pixel * -13) color_slug, (pixel * 10) (pixel * -1) darken(color_slug, 25%), (pixel * 10) (pixel * -2) color_slug, (pixel * 10) (pixel * -3) color_slug, (pixel * 10) (pixel * -4) color_slug, (pixel * 10) (pixel * -5) color_slug, (pixel * 10) (pixel * -6) color_slug, (pixel * 10) (pixel * -7) color_slug, (pixel * 10) (pixel * -8) color_slug, (pixel * 10) (pixel * -9) color_slug, (pixel * 10) (pixel * -10) color_slug, (pixel * 10) (pixel * -11) color_slug, (pixel * 10) (pixel * -12) color_slug, (pixel * 10) (pixel * -13) color_slug, (pixel * 11) (pixel * -1) color_slug, (pixel * 11) (pixel * -2) color_slug, (pixel * 11) (pixel * -3) color_slug, (pixel * 11) (pixel * -4) color_slug, (pixel * 11) (pixel * -5) color_slug, (pixel * 11) (pixel * -6) color_slug, (pixel * 11) (pixel * -7) color_slug, (pixel * 11) (pixel * -8) color_slug, (pixel * 11) (pixel * -9) color_slug, (pixel * 11) (pixel * -12) color_slug, (pixel * 11) (pixel * -13) color_slug .slug_key-4 box-shadow: (pixel * 1) (pixel * -6) darken(color_slug, 50%), (pixel * 1) (pixel * -7) darken(color_slug, 50%), (pixel * 1) (pixel * -8) darken(color_slug, 50%), (pixel * 1) (pixel * -9) darken(color_slug, 50%), (pixel * 1) (pixel * -10) darken(color_slug, 50%), (pixel * 1) (pixel * -11) darken(color_slug, 50%), (pixel * 1) (pixel * -12) darken(color_slug, 50%), (pixel * 1) (pixel * -13) darken(color_slug, 50%), (pixel * 1) (pixel * -14) darken(color_slug, 50%), (pixel * 1) (pixel * -15) darken(color_slug, 50%), (pixel * 1) (pixel * -16) darken(color_slug, 50%), (pixel * 2) (pixel * -17) darken(color_slug, 50%), (pixel * 3) (pixel * -17) darken(color_slug, 50%), (pixel * 4) (pixel * -17) darken(color_slug, 50%), (pixel * 5) (pixel * -17) darken(color_slug, 50%), (pixel * 6) (pixel * -17) darken(color_slug, 50%), (pixel * 7) (pixel * -17) darken(color_slug, 50%), (pixel * 8) (pixel * -17) darken(color_slug, 50%), (pixel * 9) (pixel * -17) darken(color_slug, 50%), (pixel * 10) (pixel * -17) darken(color_slug, 50%), (pixel * 11) (pixel * -17) darken(color_slug, 50%), (pixel * 12) (pixel * -17) darken(color_slug, 50%), (pixel * 13) (pixel * -6) darken(color_slug, 50%), (pixel * 13) (pixel * -7) darken(color_slug, 50%), (pixel * 13) (pixel * -8) darken(color_slug, 50%), (pixel * 13) (pixel * -9) darken(color_slug, 50%), (pixel * 13) (pixel * -10) darken(color_slug, 50%), (pixel * 13) (pixel * -11) darken(color_slug, 50%), (pixel * 13) (pixel * -12) darken(color_slug, 50%), (pixel * 13) (pixel * -13) darken(color_slug, 50%), (pixel * 13) (pixel * -14) darken(color_slug, 50%), (pixel * 13) (pixel * -15) darken(color_slug, 50%), (pixel * 13) (pixel * -16) darken(color_slug, 50%), (pixel * 2) (pixel * -6) darken(color_slug, 50%), (pixel * 3) (pixel * -6) darken(color_slug, 50%), (pixel * 4) (pixel * -6) darken(color_slug, 50%), (pixel * 5) (pixel * -6) darken(color_slug, 50%), (pixel * 6) (pixel * -6) darken(color_slug, 50%), (pixel * 7) (pixel * -6) darken(color_slug, 50%), (pixel * 8) (pixel * -6) darken(color_slug, 50%), (pixel * 9) (pixel * -6) darken(color_slug, 50%), (pixel * 10) (pixel * -6) darken(color_slug, 50%), (pixel * 11) (pixel * -6) darken(color_slug, 50%), (pixel * 12) (pixel * -6) darken(color_slug, 50%), (pixel * 7) (pixel * -14) darken(color_slug, 50%), (pixel * 7) (pixel * -13) darken(color_slug, 50%), (pixel * 8) (pixel * -14) darken(color_slug, 50%), (pixel * 8) (pixel * -13) darken(color_slug, 50%), (pixel * 11) (pixel * -14) darken(color_slug, 50%), (pixel * 11) (pixel * -13) darken(color_slug, 50%), (pixel * 2) (pixel * -7) darken(color_slug, 25%), (pixel * 2) (pixel * -8) color_slug, (pixel * 2) (pixel * -9) color_slug, (pixel * 2) (pixel * -10) color_slug, (pixel * 2) (pixel * -11) color_slug, (pixel * 2) (pixel * -12) color_slug, (pixel * 2) (pixel * -13) color_slug, (pixel * 2) (pixel * -14) color_slug, (pixel * 2) (pixel * -15) color_slug, (pixel * 2) (pixel * -16) color_slug, (pixel * 3) (pixel * -7) color_slug, (pixel * 3) (pixel * -8) color_slug, (pixel * 3) (pixel * -9) color_slug, (pixel * 3) (pixel * -10) color_slug, (pixel * 3) (pixel * -11) color_slug, (pixel * 3) (pixel * -12) color_slug, (pixel * 3) (pixel * -13) color_slug, (pixel * 3) (pixel * -14) color_slug, (pixel * 3) (pixel * -15) color_slug, (pixel * 3) (pixel * -16) color_slug, (pixel * 4) (pixel * -7) darken(color_slug, 25%), (pixel * 4) (pixel * -8) color_slug, (pixel * 4) (pixel * -9) color_slug, (pixel * 4) (pixel * -10) color_slug, (pixel * 4) (pixel * -11) color_slug, (pixel * 4) (pixel * -12) color_slug, (pixel * 4) (pixel * -13) color_slug, (pixel * 4) (pixel * -14) color_slug, (pixel * 4) (pixel * -15) color_slug, (pixel * 4) (pixel * -16) color_slug, (pixel * 5) (pixel * -7) color_slug, (pixel * 5) (pixel * -8) color_slug, (pixel * 5) (pixel * -9) color_slug, (pixel * 5) (pixel * -10) color_slug, (pixel * 5) (pixel * -11) color_slug, (pixel * 5) (pixel * -12) color_slug, (pixel * 5) (pixel * -13) color_slug, (pixel * 5) (pixel * -14) color_slug, (pixel * 5) (pixel * -15) color_slug, (pixel * 5) (pixel * -16) color_slug, (pixel * 6) (pixel * -7) darken(color_slug, 25%), (pixel * 6) (pixel * -8) color_slug, (pixel * 6) (pixel * -9) color_slug, (pixel * 6) (pixel * -10) color_slug, (pixel * 6) (pixel * -11) color_slug, (pixel * 6) (pixel * -12) color_slug, (pixel * 6) (pixel * -13) color_slug, (pixel * 6) (pixel * -14) color_slug, (pixel * 6) (pixel * -15) color_slug, (pixel * 6) (pixel * -16) color_slug, (pixel * 7) (pixel * -7) color_slug, (pixel * 7) (pixel * -8) color_slug, (pixel * 7) (pixel * -9) color_slug, (pixel * 7) (pixel * -10) color_slug, (pixel * 7) (pixel * -11) color_slug, (pixel * 7) (pixel * -12) color_slug, (pixel * 7) (pixel * -15) color_slug, (pixel * 7) (pixel * -16) color_slug, (pixel * 8) (pixel * -7) darken(color_slug, 25%), (pixel * 8) (pixel * -8) color_slug, (pixel * 8) (pixel * -9) color_slug, (pixel * 8) (pixel * -10) color_slug, (pixel * 8) (pixel * -11) color_slug, (pixel * 8) (pixel * -12) color_slug, (pixel * 8) (pixel * -15) color_slug, (pixel * 8) (pixel * -16) color_slug, (pixel * 9) (pixel * -7) color_slug, (pixel * 9) (pixel * -8) color_slug, (pixel * 9) (pixel * -9) color_slug, (pixel * 9) (pixel * -10) color_slug, (pixel * 9) (pixel * -11) color_slug, (pixel * 9) (pixel * -12) color_slug, (pixel * 9) (pixel * -13) color_slug, (pixel * 9) (pixel * -14) color_slug, (pixel * 9) (pixel * -15) color_slug, (pixel * 9) (pixel * -16) color_slug, (pixel * 10) (pixel * -7) darken(color_slug, 25%), (pixel * 10) (pixel * -8) color_slug, (pixel * 10) (pixel * -9) color_slug, (pixel * 10) (pixel * -10) color_slug, (pixel * 10) (pixel * -11) color_slug, (pixel * 10) (pixel * -12) color_slug, (pixel * 10) (pixel * -13) color_slug, (pixel * 10) (pixel * -14) color_slug, (pixel * 10) (pixel * -15) color_slug, (pixel * 10) (pixel * -16) color_slug, (pixel * 11) (pixel * -7) color_slug, (pixel * 11) (pixel * -8) color_slug, (pixel * 11) (pixel * -9) color_slug, (pixel * 11) (pixel * -10) color_slug, (pixel * 11) (pixel * -11) color_slug, (pixel * 11) (pixel * -12) color_slug, (pixel * 11) (pixel * -15) color_slug, (pixel * 11) (pixel * -16) color_slug, (pixel * 12) (pixel * -7) darken(color_slug, 25%), (pixel * 12) (pixel * -8) color_slug, (pixel * 12) (pixel * -9) color_slug, (pixel * 12) (pixel * -10) color_slug, (pixel * 12) (pixel * -11) color_slug, (pixel * 12) (pixel * -12) color_slug, (pixel * 12) (pixel * -13) color_slug, (pixel * 12) (pixel * -14) color_slug, (pixel * 12) (pixel * -15) color_slug, (pixel * 12) (pixel * -16) color_slug
JAVASCRIPT
var slug = document.getElementById('slug'); var counter = 1; var counterToggler = false; var keys = 4; var speed = 1000/12; setInterval(function() { if ( counter > keys-1 || counter < 1 ) { counterToggler = !counterToggler } if (counter === 0) counter = 1; slug.setAttribute('class', 'slug_key-' + counter); if (!counterToggler) counter++; if (counterToggler) counter--; }, speed);
Expand for more options Login