Merge branch 'patch-1' of https://github.com/jfelchner/compass into merge-1

This commit is contained in:
Scott Davis 2011-11-22 10:39:33 -05:00
commit 4766890388
11 changed files with 112 additions and 11 deletions

View File

@ -5,11 +5,11 @@
// the implementations are identical except for the property // the implementations are identical except for the property
// prefix. // prefix.
@mixin experimental($property, $value, @mixin experimental($property, $value,
$webkit : $experimental-support-for-webkit,
$khtml : $experimental-support-for-khtml,
$moz : $experimental-support-for-mozilla, $moz : $experimental-support-for-mozilla,
$ms : $experimental-support-for-microsoft, $webkit : $experimental-support-for-webkit,
$o : $experimental-support-for-opera, $o : $experimental-support-for-opera,
$ms : $experimental-support-for-microsoft,
$khtml : $experimental-support-for-khtml,
$official : true $official : true
) { ) {
@if $webkit and $experimental-support-for-webkit { -webkit-#{$property} : $value; } @if $webkit and $experimental-support-for-webkit { -webkit-#{$property} : $value; }
@ -22,11 +22,11 @@
// Same as experimental(), but for cases when the property is the same and the value is vendorized // Same as experimental(), but for cases when the property is the same and the value is vendorized
@mixin experimental-value($property, $value, @mixin experimental-value($property, $value,
$webkit : $experimental-support-for-webkit,
$khtml : $experimental-support-for-khtml,
$moz : $experimental-support-for-mozilla, $moz : $experimental-support-for-mozilla,
$ms : $experimental-support-for-microsoft, $webkit : $experimental-support-for-webkit,
$o : $experimental-support-for-opera, $o : $experimental-support-for-opera,
$ms : $experimental-support-for-microsoft,
$khtml : $experimental-support-for-khtml,
$official : true $official : true
) { ) {
@if $webkit and $experimental-support-for-webkit { #{$property} : -webkit-#{$value}; } @if $webkit and $experimental-support-for-webkit { #{$property} : -webkit-#{$value}; }

View File

@ -673,6 +673,7 @@ input.span-24, textarea.span-24, select.span-24 {
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 0px, rgba(100, 100, 225, 0.25) 0px, rgba(100, 100, 225, 0.25) 30px, rgba(0, 0, 0, 0) 30px, rgba(0, 0, 0, 0) 40px, rgba(100, 100, 225, 0.25) 40px, rgba(100, 100, 225, 0.25) 70px, rgba(0, 0, 0, 0) 70px, rgba(0, 0, 0, 0) 80px, rgba(100, 100, 225, 0.25) 80px, rgba(100, 100, 225, 0.25) 110px, rgba(0, 0, 0, 0) 110px, rgba(0, 0, 0, 0) 120px, rgba(100, 100, 225, 0.25) 120px, rgba(100, 100, 225, 0.25) 150px, rgba(0, 0, 0, 0) 150px, rgba(0, 0, 0, 0) 160px, rgba(100, 100, 225, 0.25) 160px, rgba(100, 100, 225, 0.25) 190px, rgba(0, 0, 0, 0) 190px, rgba(0, 0, 0, 0) 200px, rgba(100, 100, 225, 0.25) 200px, rgba(100, 100, 225, 0.25) 230px, rgba(0, 0, 0, 0) 230px, rgba(0, 0, 0, 0) 240px, rgba(100, 100, 225, 0.25) 240px, rgba(100, 100, 225, 0.25) 270px, rgba(0, 0, 0, 0) 270px, rgba(0, 0, 0, 0) 280px, rgba(100, 100, 225, 0.25) 280px, rgba(100, 100, 225, 0.25) 310px, rgba(0, 0, 0, 0) 310px, rgba(0, 0, 0, 0) 320px, rgba(100, 100, 225, 0.25) 320px, rgba(100, 100, 225, 0.25) 350px, rgba(0, 0, 0, 0) 350px, rgba(0, 0, 0, 0) 360px, rgba(100, 100, 225, 0.25) 360px, rgba(100, 100, 225, 0.25) 390px, rgba(0, 0, 0, 0) 390px, rgba(0, 0, 0, 0) 400px, rgba(100, 100, 225, 0.25) 400px, rgba(100, 100, 225, 0.25) 430px, rgba(0, 0, 0, 0) 430px, rgba(0, 0, 0, 0) 440px, rgba(100, 100, 225, 0.25) 440px, rgba(100, 100, 225, 0.25) 470px, rgba(0, 0, 0, 0) 470px, rgba(0, 0, 0, 0) 480px, rgba(100, 100, 225, 0.25) 480px, rgba(100, 100, 225, 0.25) 510px, rgba(0, 0, 0, 0) 510px, rgba(0, 0, 0, 0) 520px, rgba(100, 100, 225, 0.25) 520px, rgba(100, 100, 225, 0.25) 550px, rgba(0, 0, 0, 0) 550px, rgba(0, 0, 0, 0) 560px, rgba(100, 100, 225, 0.25) 560px, rgba(100, 100, 225, 0.25) 590px, rgba(0, 0, 0, 0) 590px, rgba(0, 0, 0, 0) 600px, rgba(100, 100, 225, 0.25) 600px, rgba(100, 100, 225, 0.25) 630px, rgba(0, 0, 0, 0) 630px, rgba(0, 0, 0, 0) 640px, rgba(100, 100, 225, 0.25) 640px, rgba(100, 100, 225, 0.25) 670px, rgba(0, 0, 0, 0) 670px, rgba(0, 0, 0, 0) 680px, rgba(100, 100, 225, 0.25) 680px, rgba(100, 100, 225, 0.25) 710px, rgba(0, 0, 0, 0) 710px, rgba(0, 0, 0, 0) 720px, rgba(100, 100, 225, 0.25) 720px, rgba(100, 100, 225, 0.25) 750px, rgba(0, 0, 0, 0) 750px, rgba(0, 0, 0, 0) 760px, rgba(100, 100, 225, 0.25) 760px, rgba(100, 100, 225, 0.25) 790px, rgba(0, 0, 0, 0) 790px, rgba(0, 0, 0, 0) 800px, rgba(100, 100, 225, 0.25) 800px, rgba(100, 100, 225, 0.25) 830px, rgba(0, 0, 0, 0) 830px, rgba(0, 0, 0, 0) 840px, rgba(100, 100, 225, 0.25) 840px, rgba(100, 100, 225, 0.25) 870px, rgba(0, 0, 0, 0) 870px, rgba(0, 0, 0, 0) 880px, rgba(100, 100, 225, 0.25) 880px, rgba(100, 100, 225, 0.25) 910px, rgba(0, 0, 0, 0) 910px, rgba(0, 0, 0, 0) 920px, rgba(100, 100, 225, 0.25) 920px, rgba(100, 100, 225, 0.25) 950px, rgba(0, 0, 0, 0) 950px, rgba(0, 0, 0, 0) 960px); background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 0px, rgba(100, 100, 225, 0.25) 0px, rgba(100, 100, 225, 0.25) 30px, rgba(0, 0, 0, 0) 30px, rgba(0, 0, 0, 0) 40px, rgba(100, 100, 225, 0.25) 40px, rgba(100, 100, 225, 0.25) 70px, rgba(0, 0, 0, 0) 70px, rgba(0, 0, 0, 0) 80px, rgba(100, 100, 225, 0.25) 80px, rgba(100, 100, 225, 0.25) 110px, rgba(0, 0, 0, 0) 110px, rgba(0, 0, 0, 0) 120px, rgba(100, 100, 225, 0.25) 120px, rgba(100, 100, 225, 0.25) 150px, rgba(0, 0, 0, 0) 150px, rgba(0, 0, 0, 0) 160px, rgba(100, 100, 225, 0.25) 160px, rgba(100, 100, 225, 0.25) 190px, rgba(0, 0, 0, 0) 190px, rgba(0, 0, 0, 0) 200px, rgba(100, 100, 225, 0.25) 200px, rgba(100, 100, 225, 0.25) 230px, rgba(0, 0, 0, 0) 230px, rgba(0, 0, 0, 0) 240px, rgba(100, 100, 225, 0.25) 240px, rgba(100, 100, 225, 0.25) 270px, rgba(0, 0, 0, 0) 270px, rgba(0, 0, 0, 0) 280px, rgba(100, 100, 225, 0.25) 280px, rgba(100, 100, 225, 0.25) 310px, rgba(0, 0, 0, 0) 310px, rgba(0, 0, 0, 0) 320px, rgba(100, 100, 225, 0.25) 320px, rgba(100, 100, 225, 0.25) 350px, rgba(0, 0, 0, 0) 350px, rgba(0, 0, 0, 0) 360px, rgba(100, 100, 225, 0.25) 360px, rgba(100, 100, 225, 0.25) 390px, rgba(0, 0, 0, 0) 390px, rgba(0, 0, 0, 0) 400px, rgba(100, 100, 225, 0.25) 400px, rgba(100, 100, 225, 0.25) 430px, rgba(0, 0, 0, 0) 430px, rgba(0, 0, 0, 0) 440px, rgba(100, 100, 225, 0.25) 440px, rgba(100, 100, 225, 0.25) 470px, rgba(0, 0, 0, 0) 470px, rgba(0, 0, 0, 0) 480px, rgba(100, 100, 225, 0.25) 480px, rgba(100, 100, 225, 0.25) 510px, rgba(0, 0, 0, 0) 510px, rgba(0, 0, 0, 0) 520px, rgba(100, 100, 225, 0.25) 520px, rgba(100, 100, 225, 0.25) 550px, rgba(0, 0, 0, 0) 550px, rgba(0, 0, 0, 0) 560px, rgba(100, 100, 225, 0.25) 560px, rgba(100, 100, 225, 0.25) 590px, rgba(0, 0, 0, 0) 590px, rgba(0, 0, 0, 0) 600px, rgba(100, 100, 225, 0.25) 600px, rgba(100, 100, 225, 0.25) 630px, rgba(0, 0, 0, 0) 630px, rgba(0, 0, 0, 0) 640px, rgba(100, 100, 225, 0.25) 640px, rgba(100, 100, 225, 0.25) 670px, rgba(0, 0, 0, 0) 670px, rgba(0, 0, 0, 0) 680px, rgba(100, 100, 225, 0.25) 680px, rgba(100, 100, 225, 0.25) 710px, rgba(0, 0, 0, 0) 710px, rgba(0, 0, 0, 0) 720px, rgba(100, 100, 225, 0.25) 720px, rgba(100, 100, 225, 0.25) 750px, rgba(0, 0, 0, 0) 750px, rgba(0, 0, 0, 0) 760px, rgba(100, 100, 225, 0.25) 760px, rgba(100, 100, 225, 0.25) 790px, rgba(0, 0, 0, 0) 790px, rgba(0, 0, 0, 0) 800px, rgba(100, 100, 225, 0.25) 800px, rgba(100, 100, 225, 0.25) 830px, rgba(0, 0, 0, 0) 830px, rgba(0, 0, 0, 0) 840px, rgba(100, 100, 225, 0.25) 840px, rgba(100, 100, 225, 0.25) 870px, rgba(0, 0, 0, 0) 870px, rgba(0, 0, 0, 0) 880px, rgba(100, 100, 225, 0.25) 880px, rgba(100, 100, 225, 0.25) 910px, rgba(0, 0, 0, 0) 910px, rgba(0, 0, 0, 0) 920px, rgba(100, 100, 225, 0.25) 920px, rgba(100, 100, 225, 0.25) 950px, rgba(0, 0, 0, 0) 950px, rgba(0, 0, 0, 0) 960px);
-webkit-background-size: 100% 18px, auto; -webkit-background-size: 100% 18px, auto;
-moz-background-size: 100% 18px, auto; -moz-background-size: 100% 18px, auto;
-o-background-size: 100% 18px, auto;
background-size: 100% 18px, auto; background-size: 100% 18px, auto;
background-position: left top; } background-position: left top; }

View File

@ -7,5 +7,6 @@
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 0px, rgba(100, 100, 225, 0.25) 0px, rgba(100, 100, 225, 0.25) 30px, rgba(0, 0, 0, 0) 30px, rgba(0, 0, 0, 0) 40px, rgba(100, 100, 225, 0.25) 40px, rgba(100, 100, 225, 0.25) 70px, rgba(0, 0, 0, 0) 70px, rgba(0, 0, 0, 0) 80px, rgba(100, 100, 225, 0.25) 80px, rgba(100, 100, 225, 0.25) 110px, rgba(0, 0, 0, 0) 110px, rgba(0, 0, 0, 0) 120px, rgba(100, 100, 225, 0.25) 120px, rgba(100, 100, 225, 0.25) 150px, rgba(0, 0, 0, 0) 150px, rgba(0, 0, 0, 0) 160px, rgba(100, 100, 225, 0.25) 160px, rgba(100, 100, 225, 0.25) 190px, rgba(0, 0, 0, 0) 190px, rgba(0, 0, 0, 0) 200px, rgba(100, 100, 225, 0.25) 200px, rgba(100, 100, 225, 0.25) 230px, rgba(0, 0, 0, 0) 230px, rgba(0, 0, 0, 0) 240px, rgba(100, 100, 225, 0.25) 240px, rgba(100, 100, 225, 0.25) 270px, rgba(0, 0, 0, 0) 270px, rgba(0, 0, 0, 0) 280px, rgba(100, 100, 225, 0.25) 280px, rgba(100, 100, 225, 0.25) 310px, rgba(0, 0, 0, 0) 310px, rgba(0, 0, 0, 0) 320px, rgba(100, 100, 225, 0.25) 320px, rgba(100, 100, 225, 0.25) 350px, rgba(0, 0, 0, 0) 350px, rgba(0, 0, 0, 0) 360px, rgba(100, 100, 225, 0.25) 360px, rgba(100, 100, 225, 0.25) 390px, rgba(0, 0, 0, 0) 390px, rgba(0, 0, 0, 0) 400px, rgba(100, 100, 225, 0.25) 400px, rgba(100, 100, 225, 0.25) 430px, rgba(0, 0, 0, 0) 430px, rgba(0, 0, 0, 0) 440px, rgba(100, 100, 225, 0.25) 440px, rgba(100, 100, 225, 0.25) 470px, rgba(0, 0, 0, 0) 470px, rgba(0, 0, 0, 0) 480px, rgba(100, 100, 225, 0.25) 480px, rgba(100, 100, 225, 0.25) 510px, rgba(0, 0, 0, 0) 510px, rgba(0, 0, 0, 0) 520px, rgba(100, 100, 225, 0.25) 520px, rgba(100, 100, 225, 0.25) 550px, rgba(0, 0, 0, 0) 550px, rgba(0, 0, 0, 0) 560px, rgba(100, 100, 225, 0.25) 560px, rgba(100, 100, 225, 0.25) 590px, rgba(0, 0, 0, 0) 590px, rgba(0, 0, 0, 0) 600px, rgba(100, 100, 225, 0.25) 600px, rgba(100, 100, 225, 0.25) 630px, rgba(0, 0, 0, 0) 630px, rgba(0, 0, 0, 0) 640px, rgba(100, 100, 225, 0.25) 640px, rgba(100, 100, 225, 0.25) 670px, rgba(0, 0, 0, 0) 670px, rgba(0, 0, 0, 0) 680px, rgba(100, 100, 225, 0.25) 680px, rgba(100, 100, 225, 0.25) 710px, rgba(0, 0, 0, 0) 710px, rgba(0, 0, 0, 0) 720px, rgba(100, 100, 225, 0.25) 720px, rgba(100, 100, 225, 0.25) 750px, rgba(0, 0, 0, 0) 750px, rgba(0, 0, 0, 0) 760px, rgba(100, 100, 225, 0.25) 760px, rgba(100, 100, 225, 0.25) 790px, rgba(0, 0, 0, 0) 790px, rgba(0, 0, 0, 0) 800px, rgba(100, 100, 225, 0.25) 800px, rgba(100, 100, 225, 0.25) 830px, rgba(0, 0, 0, 0) 830px, rgba(0, 0, 0, 0) 840px, rgba(100, 100, 225, 0.25) 840px, rgba(100, 100, 225, 0.25) 870px, rgba(0, 0, 0, 0) 870px, rgba(0, 0, 0, 0) 880px, rgba(100, 100, 225, 0.25) 880px, rgba(100, 100, 225, 0.25) 910px, rgba(0, 0, 0, 0) 910px, rgba(0, 0, 0, 0) 920px, rgba(100, 100, 225, 0.25) 920px, rgba(100, 100, 225, 0.25) 950px, rgba(0, 0, 0, 0) 950px, rgba(0, 0, 0, 0) 960px); background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 0px, rgba(100, 100, 225, 0.25) 0px, rgba(100, 100, 225, 0.25) 30px, rgba(0, 0, 0, 0) 30px, rgba(0, 0, 0, 0) 40px, rgba(100, 100, 225, 0.25) 40px, rgba(100, 100, 225, 0.25) 70px, rgba(0, 0, 0, 0) 70px, rgba(0, 0, 0, 0) 80px, rgba(100, 100, 225, 0.25) 80px, rgba(100, 100, 225, 0.25) 110px, rgba(0, 0, 0, 0) 110px, rgba(0, 0, 0, 0) 120px, rgba(100, 100, 225, 0.25) 120px, rgba(100, 100, 225, 0.25) 150px, rgba(0, 0, 0, 0) 150px, rgba(0, 0, 0, 0) 160px, rgba(100, 100, 225, 0.25) 160px, rgba(100, 100, 225, 0.25) 190px, rgba(0, 0, 0, 0) 190px, rgba(0, 0, 0, 0) 200px, rgba(100, 100, 225, 0.25) 200px, rgba(100, 100, 225, 0.25) 230px, rgba(0, 0, 0, 0) 230px, rgba(0, 0, 0, 0) 240px, rgba(100, 100, 225, 0.25) 240px, rgba(100, 100, 225, 0.25) 270px, rgba(0, 0, 0, 0) 270px, rgba(0, 0, 0, 0) 280px, rgba(100, 100, 225, 0.25) 280px, rgba(100, 100, 225, 0.25) 310px, rgba(0, 0, 0, 0) 310px, rgba(0, 0, 0, 0) 320px, rgba(100, 100, 225, 0.25) 320px, rgba(100, 100, 225, 0.25) 350px, rgba(0, 0, 0, 0) 350px, rgba(0, 0, 0, 0) 360px, rgba(100, 100, 225, 0.25) 360px, rgba(100, 100, 225, 0.25) 390px, rgba(0, 0, 0, 0) 390px, rgba(0, 0, 0, 0) 400px, rgba(100, 100, 225, 0.25) 400px, rgba(100, 100, 225, 0.25) 430px, rgba(0, 0, 0, 0) 430px, rgba(0, 0, 0, 0) 440px, rgba(100, 100, 225, 0.25) 440px, rgba(100, 100, 225, 0.25) 470px, rgba(0, 0, 0, 0) 470px, rgba(0, 0, 0, 0) 480px, rgba(100, 100, 225, 0.25) 480px, rgba(100, 100, 225, 0.25) 510px, rgba(0, 0, 0, 0) 510px, rgba(0, 0, 0, 0) 520px, rgba(100, 100, 225, 0.25) 520px, rgba(100, 100, 225, 0.25) 550px, rgba(0, 0, 0, 0) 550px, rgba(0, 0, 0, 0) 560px, rgba(100, 100, 225, 0.25) 560px, rgba(100, 100, 225, 0.25) 590px, rgba(0, 0, 0, 0) 590px, rgba(0, 0, 0, 0) 600px, rgba(100, 100, 225, 0.25) 600px, rgba(100, 100, 225, 0.25) 630px, rgba(0, 0, 0, 0) 630px, rgba(0, 0, 0, 0) 640px, rgba(100, 100, 225, 0.25) 640px, rgba(100, 100, 225, 0.25) 670px, rgba(0, 0, 0, 0) 670px, rgba(0, 0, 0, 0) 680px, rgba(100, 100, 225, 0.25) 680px, rgba(100, 100, 225, 0.25) 710px, rgba(0, 0, 0, 0) 710px, rgba(0, 0, 0, 0) 720px, rgba(100, 100, 225, 0.25) 720px, rgba(100, 100, 225, 0.25) 750px, rgba(0, 0, 0, 0) 750px, rgba(0, 0, 0, 0) 760px, rgba(100, 100, 225, 0.25) 760px, rgba(100, 100, 225, 0.25) 790px, rgba(0, 0, 0, 0) 790px, rgba(0, 0, 0, 0) 800px, rgba(100, 100, 225, 0.25) 800px, rgba(100, 100, 225, 0.25) 830px, rgba(0, 0, 0, 0) 830px, rgba(0, 0, 0, 0) 840px, rgba(100, 100, 225, 0.25) 840px, rgba(100, 100, 225, 0.25) 870px, rgba(0, 0, 0, 0) 870px, rgba(0, 0, 0, 0) 880px, rgba(100, 100, 225, 0.25) 880px, rgba(100, 100, 225, 0.25) 910px, rgba(0, 0, 0, 0) 910px, rgba(0, 0, 0, 0) 920px, rgba(100, 100, 225, 0.25) 920px, rgba(100, 100, 225, 0.25) 950px, rgba(0, 0, 0, 0) 950px, rgba(0, 0, 0, 0) 960px);
-webkit-background-size: 100% 18px, auto; -webkit-background-size: 100% 18px, auto;
-moz-background-size: 100% 18px, auto; -moz-background-size: 100% 18px, auto;
-o-background-size: 100% 18px, auto;
background-size: 100% 18px, auto; background-size: 100% 18px, auto;
background-position: left top; } background-position: left top; }

View File

@ -1,19 +1,19 @@
.simple { .simple {
-webkit-border-radius: 4px / 4px; -webkit-border-radius: 4px 4px;
-moz-border-radius: 4px / 4px; -moz-border-radius: 4px / 4px;
-ms-border-radius: 4px / 4px; -ms-border-radius: 4px / 4px;
-o-border-radius: 4px / 4px; -o-border-radius: 4px / 4px;
border-radius: 4px / 4px; } border-radius: 4px / 4px; }
.compound { .compound {
-webkit-border-radius: 2px 5px / 3px 6px; -webkit-border-radius: 2px 3px;
-moz-border-radius: 2px 5px / 3px 6px; -moz-border-radius: 2px 5px / 3px 6px;
-ms-border-radius: 2px 5px / 3px 6px; -ms-border-radius: 2px 5px / 3px 6px;
-o-border-radius: 2px 5px / 3px 6px; -o-border-radius: 2px 5px / 3px 6px;
border-radius: 2px 5px / 3px 6px; } border-radius: 2px 5px / 3px 6px; }
.crazy { .crazy {
-webkit-border-radius: 1px 3px 5px 7px / 2px 4px 6px 8px; -webkit-border-radius: 1px 2px;
-moz-border-radius: 1px 3px 5px 7px / 2px 4px 6px 8px; -moz-border-radius: 1px 3px 5px 7px / 2px 4px 6px 8px;
-ms-border-radius: 1px 3px 5px 7px / 2px 4px 6px 8px; -ms-border-radius: 1px 3px 5px 7px / 2px 4px 6px 8px;
-o-border-radius: 1px 3px 5px 7px / 2px 4px 6px 8px; -o-border-radius: 1px 3px 5px 7px / 2px 4px 6px 8px;

View File

@ -1,84 +1,103 @@
.hbox { .hbox {
display: -webkit-box; display: -webkit-box;
display: -moz-box;
display: -ms-box; display: -ms-box;
display: box; display: box;
-webkit-box-orient: horizontal; -webkit-box-orient: horizontal;
-moz-box-orient: horizontal;
-ms-box-orient: horizontal; -ms-box-orient: horizontal;
box-orient: horizontal; box-orient: horizontal;
-webkit-box-align: stretch; -webkit-box-align: stretch;
-moz-box-align: stretch;
-ms-box-align: stretch; -ms-box-align: stretch;
box-align: stretch; } box-align: stretch; }
.hbox > * { .hbox > * {
-webkit-box-flex: 0; -webkit-box-flex: 0;
-moz-box-flex: 0;
-ms-box-flex: 0; -ms-box-flex: 0;
box-flex: 0; } box-flex: 0; }
.vbox { .vbox {
display: -webkit-box; display: -webkit-box;
display: -moz-box;
display: -ms-box; display: -ms-box;
display: box; display: box;
-webkit-box-orient: vertical; -webkit-box-orient: vertical;
-moz-box-orient: vertical;
-ms-box-orient: vertical; -ms-box-orient: vertical;
box-orient: vertical; box-orient: vertical;
-webkit-box-align: stretch; -webkit-box-align: stretch;
-moz-box-align: stretch;
-ms-box-align: stretch; -ms-box-align: stretch;
box-align: stretch; } box-align: stretch; }
.vbox > * { .vbox > * {
-webkit-box-flex: 0; -webkit-box-flex: 0;
-moz-box-flex: 0;
-ms-box-flex: 0; -ms-box-flex: 0;
box-flex: 0; } box-flex: 0; }
.spacer { .spacer {
-webkit-box-flex: 1; -webkit-box-flex: 1;
-moz-box-flex: 1;
-ms-box-flex: 1; -ms-box-flex: 1;
box-flex: 1; } box-flex: 1; }
.reverse { .reverse {
-webkit-box-direction: reverse; -webkit-box-direction: reverse;
-moz-box-direction: reverse;
-ms-box-direction: reverse; -ms-box-direction: reverse;
box-direction: reverse; } box-direction: reverse; }
.box-flex-0 { .box-flex-0 {
-webkit-box-flex: 0; -webkit-box-flex: 0;
-moz-box-flex: 0;
-ms-box-flex: 0; -ms-box-flex: 0;
box-flex: 0; } box-flex: 0; }
.box-flex-1 { .box-flex-1 {
-webkit-box-flex: 1; -webkit-box-flex: 1;
-moz-box-flex: 1;
-ms-box-flex: 1; -ms-box-flex: 1;
box-flex: 1; } box-flex: 1; }
.box-flex-2 { .box-flex-2 {
-webkit-box-flex: 2; -webkit-box-flex: 2;
-moz-box-flex: 2;
-ms-box-flex: 2; -ms-box-flex: 2;
box-flex: 2; } box-flex: 2; }
.box-flex-group-0 { .box-flex-group-0 {
-webkit-box-flex-group: 0; -webkit-box-flex-group: 0;
-moz-box-flex-group: 0;
-ms-box-flex-group: 0; -ms-box-flex-group: 0;
box-flex-group: 0; } box-flex-group: 0; }
.box-flex-group-1 { .box-flex-group-1 {
-webkit-box-flex-group: 1; -webkit-box-flex-group: 1;
-moz-box-flex-group: 1;
-ms-box-flex-group: 1; -ms-box-flex-group: 1;
box-flex-group: 1; } box-flex-group: 1; }
.box-flex-group-2 { .box-flex-group-2 {
-webkit-box-flex-group: 2; -webkit-box-flex-group: 2;
-moz-box-flex-group: 2;
-ms-box-flex-group: 2; -ms-box-flex-group: 2;
box-flex-group: 2; } box-flex-group: 2; }
.start { .start {
-webkit-box-pack: start; -webkit-box-pack: start;
-moz-box-pack: start;
-ms-box-pack: start; -ms-box-pack: start;
box-pack: start; } box-pack: start; }
.end { .end {
-webkit-box-pack: end; -webkit-box-pack: end;
-moz-box-pack: end;
-ms-box-pack: end; -ms-box-pack: end;
box-pack: end; } box-pack: end; }
.center { .center {
-webkit-box-pack: center; -webkit-box-pack: center;
-moz-box-pack: center;
-ms-box-pack: center; -ms-box-pack: center;
box-pack: center; } box-pack: center; }

View File

@ -1,14 +1,17 @@
.box-shadow { .box-shadow {
-webkit-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; -webkit-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
-moz-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; -moz-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
-o-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; } box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; }
.single-box-shadow { .single-box-shadow {
-webkit-box-shadow: 0px 0px 5px #333333; -webkit-box-shadow: 0px 0px 5px #333333;
-moz-box-shadow: 0px 0px 5px #333333; -moz-box-shadow: 0px 0px 5px #333333;
-o-box-shadow: 0px 0px 5px #333333;
box-shadow: 0px 0px 5px #333333; } box-shadow: 0px 0px 5px #333333; }
.multiple-box-shadows { .multiple-box-shadows {
-webkit-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; -webkit-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
-moz-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; -moz-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
-o-box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222;
box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; } box-shadow: 0px 0px 5px #333333, 2px 2px 5px #222222; }

View File

@ -1,39 +1,47 @@
.column-count { .column-count {
-webkit-column-count: 5; -webkit-column-count: 5;
-moz-column-count: 5; -moz-column-count: 5;
-o-column-count: 5;
column-count: 5; } column-count: 5; }
.column-gap { .column-gap {
-webkit-column-gap: 10px; -webkit-column-gap: 10px;
-moz-column-gap: 10px; -moz-column-gap: 10px;
-o-column-gap: 10px;
column-gap: 10px; } column-gap: 10px; }
.column-width { .column-width {
-webkit-column-width: 90px; -webkit-column-width: 90px;
-moz-column-width: 90px; -moz-column-width: 90px;
-o-column-width: 90px;
column-width: 90px; } column-width: 90px; }
.column-rule-width { .column-rule-width {
-webkit-rule-width: 1px; -webkit-rule-width: 1px;
-moz-rule-width: 1px; -moz-rule-width: 1px;
-o-rule-width: 1px;
rule-width: 1px; } rule-width: 1px; }
.column-rule-style { .column-rule-style {
-webkit-rule-style: dotted; -webkit-rule-style: dotted;
-moz-rule-style: dotted; -moz-rule-style: dotted;
-o-rule-style: dotted;
rule-style: dotted; } rule-style: dotted; }
.column-rule-color { .column-rule-color {
-webkit-rule-color: blue; -webkit-rule-color: blue;
-moz-rule-color: blue; -moz-rule-color: blue;
-o-rule-color: blue;
rule-color: blue; } rule-color: blue; }
.column-rule { .column-rule {
-webkit-column-rule: 1px solid blue; -webkit-column-rule: 1px solid blue;
-moz-column-rule: 1px solid blue; -moz-column-rule: 1px solid blue;
-o-column-rule: 1px solid blue;
column-rule: 1px solid blue; } column-rule: 1px solid blue; }
.column-rule-spaced { .column-rule-spaced {
-webkit-column-rule: 1px solid blue; -webkit-column-rule: 1px solid blue;
-moz-column-rule: 1px solid blue; -moz-column-rule: 1px solid blue;
-o-column-rule: 1px solid blue;
column-rule: 1px solid blue; } column-rule: 1px solid blue; }

View File

@ -7,6 +7,7 @@
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%); background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%);
-webkit-background-size: 100% 1.5em; -webkit-background-size: 100% 1.5em;
-moz-background-size: 100% 1.5em; -moz-background-size: 100% 1.5em;
-o-background-size: 100% 1.5em;
background-size: 100% 1.5em; background-size: 100% 1.5em;
background-position: left top; } background-position: left top; }
@ -28,6 +29,7 @@
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 0px, rgba(100, 100, 225, 0.25) 0px, rgba(100, 100, 225, 0.25) 30px, rgba(0, 0, 0, 0) 30px, rgba(0, 0, 0, 0) 40px, rgba(100, 100, 225, 0.25) 40px, rgba(100, 100, 225, 0.25) 70px, rgba(0, 0, 0, 0) 70px, rgba(0, 0, 0, 0) 80px, rgba(100, 100, 225, 0.25) 80px, rgba(100, 100, 225, 0.25) 110px, rgba(0, 0, 0, 0) 110px, rgba(0, 0, 0, 0) 120px, rgba(100, 100, 225, 0.25) 120px, rgba(100, 100, 225, 0.25) 150px, rgba(0, 0, 0, 0) 150px, rgba(0, 0, 0, 0) 160px, rgba(100, 100, 225, 0.25) 160px, rgba(100, 100, 225, 0.25) 190px, rgba(0, 0, 0, 0) 190px, rgba(0, 0, 0, 0) 200px, rgba(100, 100, 225, 0.25) 200px, rgba(100, 100, 225, 0.25) 230px, rgba(0, 0, 0, 0) 230px, rgba(0, 0, 0, 0) 240px, rgba(100, 100, 225, 0.25) 240px, rgba(100, 100, 225, 0.25) 270px, rgba(0, 0, 0, 0) 270px, rgba(0, 0, 0, 0) 280px, rgba(100, 100, 225, 0.25) 280px, rgba(100, 100, 225, 0.25) 310px, rgba(0, 0, 0, 0) 310px, rgba(0, 0, 0, 0) 320px, rgba(100, 100, 225, 0.25) 320px, rgba(100, 100, 225, 0.25) 350px, rgba(0, 0, 0, 0) 350px, rgba(0, 0, 0, 0) 360px, rgba(100, 100, 225, 0.25) 360px, rgba(100, 100, 225, 0.25) 390px, rgba(0, 0, 0, 0) 390px, rgba(0, 0, 0, 0) 400px, rgba(100, 100, 225, 0.25) 400px, rgba(100, 100, 225, 0.25) 430px, rgba(0, 0, 0, 0) 430px, rgba(0, 0, 0, 0) 440px, rgba(100, 100, 225, 0.25) 440px, rgba(100, 100, 225, 0.25) 470px, rgba(0, 0, 0, 0) 470px, rgba(0, 0, 0, 0) 480px, rgba(100, 100, 225, 0.25) 480px, rgba(100, 100, 225, 0.25) 510px, rgba(0, 0, 0, 0) 510px, rgba(0, 0, 0, 0) 520px, rgba(100, 100, 225, 0.25) 520px, rgba(100, 100, 225, 0.25) 550px, rgba(0, 0, 0, 0) 550px, rgba(0, 0, 0, 0) 560px, rgba(100, 100, 225, 0.25) 560px, rgba(100, 100, 225, 0.25) 590px, rgba(0, 0, 0, 0) 590px, rgba(0, 0, 0, 0) 600px, rgba(100, 100, 225, 0.25) 600px, rgba(100, 100, 225, 0.25) 630px, rgba(0, 0, 0, 0) 630px, rgba(0, 0, 0, 0) 640px, rgba(100, 100, 225, 0.25) 640px, rgba(100, 100, 225, 0.25) 670px, rgba(0, 0, 0, 0) 670px, rgba(0, 0, 0, 0) 680px, rgba(100, 100, 225, 0.25) 680px, rgba(100, 100, 225, 0.25) 710px, rgba(0, 0, 0, 0) 710px, rgba(0, 0, 0, 0) 720px, rgba(100, 100, 225, 0.25) 720px, rgba(100, 100, 225, 0.25) 750px, rgba(0, 0, 0, 0) 750px, rgba(0, 0, 0, 0) 760px, rgba(100, 100, 225, 0.25) 760px, rgba(100, 100, 225, 0.25) 790px, rgba(0, 0, 0, 0) 790px, rgba(0, 0, 0, 0) 800px, rgba(100, 100, 225, 0.25) 800px, rgba(100, 100, 225, 0.25) 830px, rgba(0, 0, 0, 0) 830px, rgba(0, 0, 0, 0) 840px, rgba(100, 100, 225, 0.25) 840px, rgba(100, 100, 225, 0.25) 870px, rgba(0, 0, 0, 0) 870px, rgba(0, 0, 0, 0) 880px, rgba(100, 100, 225, 0.25) 880px, rgba(100, 100, 225, 0.25) 910px, rgba(0, 0, 0, 0) 910px, rgba(0, 0, 0, 0) 920px, rgba(100, 100, 225, 0.25) 920px, rgba(100, 100, 225, 0.25) 950px, rgba(0, 0, 0, 0) 950px, rgba(0, 0, 0, 0) 960px); background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 0px, rgba(100, 100, 225, 0.25) 0px, rgba(100, 100, 225, 0.25) 30px, rgba(0, 0, 0, 0) 30px, rgba(0, 0, 0, 0) 40px, rgba(100, 100, 225, 0.25) 40px, rgba(100, 100, 225, 0.25) 70px, rgba(0, 0, 0, 0) 70px, rgba(0, 0, 0, 0) 80px, rgba(100, 100, 225, 0.25) 80px, rgba(100, 100, 225, 0.25) 110px, rgba(0, 0, 0, 0) 110px, rgba(0, 0, 0, 0) 120px, rgba(100, 100, 225, 0.25) 120px, rgba(100, 100, 225, 0.25) 150px, rgba(0, 0, 0, 0) 150px, rgba(0, 0, 0, 0) 160px, rgba(100, 100, 225, 0.25) 160px, rgba(100, 100, 225, 0.25) 190px, rgba(0, 0, 0, 0) 190px, rgba(0, 0, 0, 0) 200px, rgba(100, 100, 225, 0.25) 200px, rgba(100, 100, 225, 0.25) 230px, rgba(0, 0, 0, 0) 230px, rgba(0, 0, 0, 0) 240px, rgba(100, 100, 225, 0.25) 240px, rgba(100, 100, 225, 0.25) 270px, rgba(0, 0, 0, 0) 270px, rgba(0, 0, 0, 0) 280px, rgba(100, 100, 225, 0.25) 280px, rgba(100, 100, 225, 0.25) 310px, rgba(0, 0, 0, 0) 310px, rgba(0, 0, 0, 0) 320px, rgba(100, 100, 225, 0.25) 320px, rgba(100, 100, 225, 0.25) 350px, rgba(0, 0, 0, 0) 350px, rgba(0, 0, 0, 0) 360px, rgba(100, 100, 225, 0.25) 360px, rgba(100, 100, 225, 0.25) 390px, rgba(0, 0, 0, 0) 390px, rgba(0, 0, 0, 0) 400px, rgba(100, 100, 225, 0.25) 400px, rgba(100, 100, 225, 0.25) 430px, rgba(0, 0, 0, 0) 430px, rgba(0, 0, 0, 0) 440px, rgba(100, 100, 225, 0.25) 440px, rgba(100, 100, 225, 0.25) 470px, rgba(0, 0, 0, 0) 470px, rgba(0, 0, 0, 0) 480px, rgba(100, 100, 225, 0.25) 480px, rgba(100, 100, 225, 0.25) 510px, rgba(0, 0, 0, 0) 510px, rgba(0, 0, 0, 0) 520px, rgba(100, 100, 225, 0.25) 520px, rgba(100, 100, 225, 0.25) 550px, rgba(0, 0, 0, 0) 550px, rgba(0, 0, 0, 0) 560px, rgba(100, 100, 225, 0.25) 560px, rgba(100, 100, 225, 0.25) 590px, rgba(0, 0, 0, 0) 590px, rgba(0, 0, 0, 0) 600px, rgba(100, 100, 225, 0.25) 600px, rgba(100, 100, 225, 0.25) 630px, rgba(0, 0, 0, 0) 630px, rgba(0, 0, 0, 0) 640px, rgba(100, 100, 225, 0.25) 640px, rgba(100, 100, 225, 0.25) 670px, rgba(0, 0, 0, 0) 670px, rgba(0, 0, 0, 0) 680px, rgba(100, 100, 225, 0.25) 680px, rgba(100, 100, 225, 0.25) 710px, rgba(0, 0, 0, 0) 710px, rgba(0, 0, 0, 0) 720px, rgba(100, 100, 225, 0.25) 720px, rgba(100, 100, 225, 0.25) 750px, rgba(0, 0, 0, 0) 750px, rgba(0, 0, 0, 0) 760px, rgba(100, 100, 225, 0.25) 760px, rgba(100, 100, 225, 0.25) 790px, rgba(0, 0, 0, 0) 790px, rgba(0, 0, 0, 0) 800px, rgba(100, 100, 225, 0.25) 800px, rgba(100, 100, 225, 0.25) 830px, rgba(0, 0, 0, 0) 830px, rgba(0, 0, 0, 0) 840px, rgba(100, 100, 225, 0.25) 840px, rgba(100, 100, 225, 0.25) 870px, rgba(0, 0, 0, 0) 870px, rgba(0, 0, 0, 0) 880px, rgba(100, 100, 225, 0.25) 880px, rgba(100, 100, 225, 0.25) 910px, rgba(0, 0, 0, 0) 910px, rgba(0, 0, 0, 0) 920px, rgba(100, 100, 225, 0.25) 920px, rgba(100, 100, 225, 0.25) 950px, rgba(0, 0, 0, 0) 950px, rgba(0, 0, 0, 0) 960px);
-webkit-background-size: 100% 1.5em, auto; -webkit-background-size: 100% 1.5em, auto;
-moz-background-size: 100% 1.5em, auto; -moz-background-size: 100% 1.5em, auto;
-o-background-size: 100% 1.5em, auto;
background-size: 100% 1.5em, auto; background-size: 100% 1.5em, auto;
background-position: left top; } background-position: left top; }
@ -40,6 +42,7 @@
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%); background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%);
-webkit-background-size: 100% 1.5em; -webkit-background-size: 100% 1.5em;
-moz-background-size: 100% 1.5em; -moz-background-size: 100% 1.5em;
-o-background-size: 100% 1.5em;
background-size: 100% 1.5em; background-size: 100% 1.5em;
background-position: left top; } background-position: left top; }
@ -61,6 +64,7 @@
background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 11%, rgba(100, 100, 225, 0.25) 11%, rgba(100, 100, 225, 0.25) 16%, rgba(0, 0, 0, 0) 16%, rgba(0, 0, 0, 0) 17%, rgba(100, 100, 225, 0.25) 17%, rgba(100, 100, 225, 0.25) 22%, rgba(0, 0, 0, 0) 22%, rgba(0, 0, 0, 0) 23%, rgba(100, 100, 225, 0.25) 23%, rgba(100, 100, 225, 0.25) 28%, rgba(0, 0, 0, 0) 28%, rgba(0, 0, 0, 0) 29%, rgba(100, 100, 225, 0.25) 29%, rgba(100, 100, 225, 0.25) 34%, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, 0) 35%, rgba(100, 100, 225, 0.25) 35%, rgba(100, 100, 225, 0.25) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 41%, rgba(100, 100, 225, 0.25) 41%, rgba(100, 100, 225, 0.25) 46%, rgba(0, 0, 0, 0) 46%, rgba(0, 0, 0, 0) 47%, rgba(100, 100, 225, 0.25) 47%, rgba(100, 100, 225, 0.25) 52%, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, 0) 53%, rgba(100, 100, 225, 0.25) 53%, rgba(100, 100, 225, 0.25) 58%, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0) 59%, rgba(100, 100, 225, 0.25) 59%, rgba(100, 100, 225, 0.25) 64%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0) 65%, rgba(100, 100, 225, 0.25) 65%, rgba(100, 100, 225, 0.25) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 71%, rgba(100, 100, 225, 0.25) 71%, rgba(100, 100, 225, 0.25) 76%, rgba(0, 0, 0, 0) 76%, rgba(0, 0, 0, 0) 77%, rgba(100, 100, 225, 0.25) 77%, rgba(100, 100, 225, 0.25) 82%, rgba(0, 0, 0, 0) 82%, rgba(0, 0, 0, 0) 83%, rgba(100, 100, 225, 0.25) 83%, rgba(100, 100, 225, 0.25) 88%, rgba(0, 0, 0, 0) 88%, rgba(0, 0, 0, 0) 89%, rgba(100, 100, 225, 0.25) 89%, rgba(100, 100, 225, 0.25) 94%, rgba(0, 0, 0, 0) 94%, rgba(0, 0, 0, 0) 95%, rgba(100, 100, 225, 0.25) 95%, rgba(100, 100, 225, 0.25) 100%, rgba(0, 0, 0, 0) 100%, rgba(0, 0, 0, 0) 100%); background-image: linear-gradient(bottom, rgba(0, 0, 0, 0.5) 5%, rgba(0, 0, 0, 0) 5%), linear-gradient(left, rgba(0, 0, 0, 0) 11%, rgba(100, 100, 225, 0.25) 11%, rgba(100, 100, 225, 0.25) 16%, rgba(0, 0, 0, 0) 16%, rgba(0, 0, 0, 0) 17%, rgba(100, 100, 225, 0.25) 17%, rgba(100, 100, 225, 0.25) 22%, rgba(0, 0, 0, 0) 22%, rgba(0, 0, 0, 0) 23%, rgba(100, 100, 225, 0.25) 23%, rgba(100, 100, 225, 0.25) 28%, rgba(0, 0, 0, 0) 28%, rgba(0, 0, 0, 0) 29%, rgba(100, 100, 225, 0.25) 29%, rgba(100, 100, 225, 0.25) 34%, rgba(0, 0, 0, 0) 34%, rgba(0, 0, 0, 0) 35%, rgba(100, 100, 225, 0.25) 35%, rgba(100, 100, 225, 0.25) 40%, rgba(0, 0, 0, 0) 40%, rgba(0, 0, 0, 0) 41%, rgba(100, 100, 225, 0.25) 41%, rgba(100, 100, 225, 0.25) 46%, rgba(0, 0, 0, 0) 46%, rgba(0, 0, 0, 0) 47%, rgba(100, 100, 225, 0.25) 47%, rgba(100, 100, 225, 0.25) 52%, rgba(0, 0, 0, 0) 52%, rgba(0, 0, 0, 0) 53%, rgba(100, 100, 225, 0.25) 53%, rgba(100, 100, 225, 0.25) 58%, rgba(0, 0, 0, 0) 58%, rgba(0, 0, 0, 0) 59%, rgba(100, 100, 225, 0.25) 59%, rgba(100, 100, 225, 0.25) 64%, rgba(0, 0, 0, 0) 64%, rgba(0, 0, 0, 0) 65%, rgba(100, 100, 225, 0.25) 65%, rgba(100, 100, 225, 0.25) 70%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0) 71%, rgba(100, 100, 225, 0.25) 71%, rgba(100, 100, 225, 0.25) 76%, rgba(0, 0, 0, 0) 76%, rgba(0, 0, 0, 0) 77%, rgba(100, 100, 225, 0.25) 77%, rgba(100, 100, 225, 0.25) 82%, rgba(0, 0, 0, 0) 82%, rgba(0, 0, 0, 0) 83%, rgba(100, 100, 225, 0.25) 83%, rgba(100, 100, 225, 0.25) 88%, rgba(0, 0, 0, 0) 88%, rgba(0, 0, 0, 0) 89%, rgba(100, 100, 225, 0.25) 89%, rgba(100, 100, 225, 0.25) 94%, rgba(0, 0, 0, 0) 94%, rgba(0, 0, 0, 0) 95%, rgba(100, 100, 225, 0.25) 95%, rgba(100, 100, 225, 0.25) 100%, rgba(0, 0, 0, 0) 100%, rgba(0, 0, 0, 0) 100%);
-webkit-background-size: 100% 1.5em, auto; -webkit-background-size: 100% 1.5em, auto;
-moz-background-size: 100% 1.5em, auto; -moz-background-size: 100% 1.5em, auto;
-o-background-size: 100% 1.5em, auto;
background-size: 100% 1.5em, auto; background-size: 100% 1.5em, auto;
background-position: left top; } background-position: left top; }

View File

@ -2,268 +2,332 @@
-webkit-transform-origin: 2px 5%; -webkit-transform-origin: 2px 5%;
-moz-transform-origin: 2px 5%; -moz-transform-origin: 2px 5%;
-ms-transform-origin: 2px 5%; -ms-transform-origin: 2px 5%;
-o-transform-origin: 2px 5%;
transform-origin: 2px 5%; } transform-origin: 2px 5%; }
.apply-origin-3d { .apply-origin-3d {
-webkit-transform-origin: 2px 5% 2in;
transform-origin: 2px 5% 2in; } transform-origin: 2px 5% 2in; }
.transform-origin-2d { .transform-origin-2d {
-webkit-transform-origin: 100px 100px; -webkit-transform-origin: 100px 100px;
-moz-transform-origin: 100px 100px; -moz-transform-origin: 100px 100px;
-ms-transform-origin: 100px 100px; -ms-transform-origin: 100px 100px;
-o-transform-origin: 100px 100px;
transform-origin: 100px 100px; } transform-origin: 100px 100px; }
.transform-origin-3d { .transform-origin-3d {
-webkit-transform-origin: 100px 100px 100px;
transform-origin: 100px 100px 100px; } transform-origin: 100px 100px 100px; }
.transform-2d { .transform-2d {
-webkit-transform: rotateY(20deg); -webkit-transform: rotateY(20deg);
-moz-transform: rotateY(20deg); -moz-transform: rotateY(20deg);
-ms-transform: rotateY(20deg); -ms-transform: rotateY(20deg);
-o-transform: rotateY(20deg);
transform: rotateY(20deg); } transform: rotateY(20deg); }
.transform-3d { .transform-3d {
-webkit-transform: rotateZ(20deg);
transform: rotateZ(20deg); } transform: rotateZ(20deg); }
.perspective { .perspective {
-webkit-perspective: 500;
perspective: 500; } perspective: 500; }
.perspective-origin { .perspective-origin {
-webkit-perspective-origin: 25% 25%;
perspective-origin: 25% 25%; } perspective-origin: 25% 25%; }
.transform-style { .transform-style {
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d; } transform-style: preserve-3d; }
.backface-visibility { .backface-visibility {
-webkit-backface-visibility: hidden;
backface-visibility: hidden; } backface-visibility: hidden; }
.scale { .scale {
-webkit-transform: scale(30px, 50px); -webkit-transform: scale(30px, 50px);
-moz-transform: scale(30px, 50px); -moz-transform: scale(30px, 50px);
-ms-transform: scale(30px, 50px); -ms-transform: scale(30px, 50px);
-o-transform: scale(30px, 50px);
transform: scale(30px, 50px); } transform: scale(30px, 50px); }
.scale-3d { .scale-3d {
-webkit-transform: scale(30px, 50px);
transform: scale(30px, 50px); } transform: scale(30px, 50px); }
.scale-with-perspective { .scale-with-perspective {
-webkit-transform: perspective(500) scale(30px, 50px); -webkit-transform: perspective(500) scale(30px, 50px);
-moz-transform: perspective(500) scale(30px, 50px); -moz-transform: perspective(500) scale(30px, 50px);
-ms-transform: perspective(500) scale(30px, 50px); -ms-transform: perspective(500) scale(30px, 50px);
-o-transform: perspective(500) scale(30px, 50px);
transform: perspective(500) scale(30px, 50px); } transform: perspective(500) scale(30px, 50px); }
.scale-3d-with-perspective { .scale-3d-with-perspective {
-webkit-transform: perspective(500) scale(30px, 50px);
transform: perspective(500) scale(30px, 50px); } transform: perspective(500) scale(30px, 50px); }
.scale-x { .scale-x {
-webkit-transform: scaleX(30px); -webkit-transform: scaleX(30px);
-moz-transform: scaleX(30px); -moz-transform: scaleX(30px);
-ms-transform: scaleX(30px); -ms-transform: scaleX(30px);
-o-transform: scaleX(30px);
transform: scaleX(30px); } transform: scaleX(30px); }
.scale-x-3d { .scale-x-3d {
-webkit-transform: scaleX(30px);
transform: scaleX(30px); } transform: scaleX(30px); }
.scale-x-with-perspective { .scale-x-with-perspective {
-webkit-transform: perspective(500) scaleX(30px); -webkit-transform: perspective(500) scaleX(30px);
-moz-transform: perspective(500) scaleX(30px); -moz-transform: perspective(500) scaleX(30px);
-ms-transform: perspective(500) scaleX(30px); -ms-transform: perspective(500) scaleX(30px);
-o-transform: perspective(500) scaleX(30px);
transform: perspective(500) scaleX(30px); } transform: perspective(500) scaleX(30px); }
.scale-x-3d-with-perspective { .scale-x-3d-with-perspective {
-webkit-transform: perspective(500) scaleX(30px);
transform: perspective(500) scaleX(30px); } transform: perspective(500) scaleX(30px); }
.scale-y { .scale-y {
-webkit-transform: scaleY(50px); -webkit-transform: scaleY(50px);
-moz-transform: scaleY(50px); -moz-transform: scaleY(50px);
-ms-transform: scaleY(50px); -ms-transform: scaleY(50px);
-o-transform: scaleY(50px);
transform: scaleY(50px); } transform: scaleY(50px); }
.scale-y-3d { .scale-y-3d {
-webkit-transform: scaleY(50px);
transform: scaleY(50px); } transform: scaleY(50px); }
.scale-y-with-perspective { .scale-y-with-perspective {
-webkit-transform: perspective(500) scaleY(50px); -webkit-transform: perspective(500) scaleY(50px);
-moz-transform: perspective(500) scaleY(50px); -moz-transform: perspective(500) scaleY(50px);
-ms-transform: perspective(500) scaleY(50px); -ms-transform: perspective(500) scaleY(50px);
-o-transform: perspective(500) scaleY(50px);
transform: perspective(500) scaleY(50px); } transform: perspective(500) scaleY(50px); }
.scale-y-3d-with-perspective { .scale-y-3d-with-perspective {
-webkit-transform: perspective(500) scaleY(50px);
transform: perspective(500) scaleY(50px); } transform: perspective(500) scaleY(50px); }
.scale-z { .scale-z {
-webkit-transform: scaleZ(50px);
transform: scaleZ(50px); } transform: scaleZ(50px); }
.scale-z-with-perspective { .scale-z-with-perspective {
-webkit-transform: perspective(500) scaleZ(50px);
transform: perspective(500) scaleZ(50px); } transform: perspective(500) scaleZ(50px); }
.scale3d { .scale3d {
-webkit-transform: scale3d(30px, 50px, 100px);
transform: scale3d(30px, 50px, 100px); } transform: scale3d(30px, 50px, 100px); }
.scaled3-with-perspective { .scaled3-with-perspective {
-webkit-transform: perspective(500) scale3d(30px, 50px, 100px);
transform: perspective(500) scale3d(30px, 50px, 100px); } transform: perspective(500) scale3d(30px, 50px, 100px); }
.rotate { .rotate {
-webkit-transform: perspective(500) rotate(25deg); -webkit-transform: perspective(500) rotate(25deg);
-moz-transform: perspective(500) rotate(25deg); -moz-transform: perspective(500) rotate(25deg);
-ms-transform: perspective(500) rotate(25deg); -ms-transform: perspective(500) rotate(25deg);
-o-transform: perspective(500) rotate(25deg);
transform: perspective(500) rotate(25deg); } transform: perspective(500) rotate(25deg); }
.rotate-with-perspective { .rotate-with-perspective {
-webkit-transform: perspective(500) rotate(25deg); -webkit-transform: perspective(500) rotate(25deg);
-moz-transform: perspective(500) rotate(25deg); -moz-transform: perspective(500) rotate(25deg);
-ms-transform: perspective(500) rotate(25deg); -ms-transform: perspective(500) rotate(25deg);
-o-transform: perspective(500) rotate(25deg);
transform: perspective(500) rotate(25deg); } transform: perspective(500) rotate(25deg); }
.rotate-z { .rotate-z {
-webkit-transform: rotate(25deg); -webkit-transform: rotate(25deg);
-moz-transform: rotate(25deg); -moz-transform: rotate(25deg);
-ms-transform: rotate(25deg); -ms-transform: rotate(25deg);
-o-transform: rotate(25deg);
transform: rotate(25deg); } transform: rotate(25deg); }
.rotate-z-with-perspective { .rotate-z-with-perspective {
-webkit-transform: perspective(500) rotate(25deg); -webkit-transform: perspective(500) rotate(25deg);
-moz-transform: perspective(500) rotate(25deg); -moz-transform: perspective(500) rotate(25deg);
-ms-transform: perspective(500) rotate(25deg); -ms-transform: perspective(500) rotate(25deg);
-o-transform: perspective(500) rotate(25deg);
transform: perspective(500) rotate(25deg); } transform: perspective(500) rotate(25deg); }
.rotate-x { .rotate-x {
-webkit-transform: rotateX(25deg);
transform: rotateX(25deg); } transform: rotateX(25deg); }
.rotate-x-with-perspective { .rotate-x-with-perspective {
-webkit-transform: perspective(500) rotateX(25deg);
transform: perspective(500) rotateX(25deg); } transform: perspective(500) rotateX(25deg); }
.rotate-y { .rotate-y {
-webkit-transform: rotateY(25deg);
transform: rotateY(25deg); } transform: rotateY(25deg); }
.rotate-y-with-perspective { .rotate-y-with-perspective {
-webkit-transform: perspective(500) rotateY(25deg);
transform: perspective(500) rotateY(25deg); } transform: perspective(500) rotateY(25deg); }
.rotate-3d { .rotate-3d {
-webkit-transform: rotate3d(5, 2, 1, 75deg);
transform: rotate3d(5, 2, 1, 75deg); } transform: rotate3d(5, 2, 1, 75deg); }
.rotate-3d-with-perspective { .rotate-3d-with-perspective {
-webkit-transform: perspective(500) rotate3d(5, 2, 1, 75deg);
transform: perspective(500) rotate3d(5, 2, 1, 75deg); } transform: perspective(500) rotate3d(5, 2, 1, 75deg); }
.translate { .translate {
-webkit-transform: translate(20px, 30%); -webkit-transform: translate(20px, 30%);
-moz-transform: translate(20px, 30%); -moz-transform: translate(20px, 30%);
-ms-transform: translate(20px, 30%); -ms-transform: translate(20px, 30%);
-o-transform: translate(20px, 30%);
transform: translate(20px, 30%); } transform: translate(20px, 30%); }
.translate-with-perspective { .translate-with-perspective {
-webkit-transform: perspective(500) translate(20px, 30%); -webkit-transform: perspective(500) translate(20px, 30%);
-moz-transform: perspective(500) translate(20px, 30%); -moz-transform: perspective(500) translate(20px, 30%);
-ms-transform: perspective(500) translate(20px, 30%); -ms-transform: perspective(500) translate(20px, 30%);
-o-transform: perspective(500) translate(20px, 30%);
transform: perspective(500) translate(20px, 30%); } transform: perspective(500) translate(20px, 30%); }
.translate-3d { .translate-3d {
-webkit-transform: translate(20px, 30%);
transform: translate(20px, 30%); } transform: translate(20px, 30%); }
.translate-3d-with-perspective { .translate-3d-with-perspective {
-webkit-transform: perspective(500) translate(20px, 30%);
transform: perspective(500) translate(20px, 30%); } transform: perspective(500) translate(20px, 30%); }
.translate-x { .translate-x {
-webkit-transform: translateX(30px); -webkit-transform: translateX(30px);
-moz-transform: translateX(30px); -moz-transform: translateX(30px);
-ms-transform: translateX(30px); -ms-transform: translateX(30px);
-o-transform: translateX(30px);
transform: translateX(30px); } transform: translateX(30px); }
.translate-x-3d { .translate-x-3d {
-webkit-transform: translateX(30px);
transform: translateX(30px); } transform: translateX(30px); }
.translate-x-with-perspective { .translate-x-with-perspective {
-webkit-transform: perspective(500) translateX(30px); -webkit-transform: perspective(500) translateX(30px);
-moz-transform: perspective(500) translateX(30px); -moz-transform: perspective(500) translateX(30px);
-ms-transform: perspective(500) translateX(30px); -ms-transform: perspective(500) translateX(30px);
-o-transform: perspective(500) translateX(30px);
transform: perspective(500) translateX(30px); } transform: perspective(500) translateX(30px); }
.translate-x-3d-with-perspective { .translate-x-3d-with-perspective {
-webkit-transform: perspective(500) translateX(30px);
transform: perspective(500) translateX(30px); } transform: perspective(500) translateX(30px); }
.translate-y { .translate-y {
-webkit-transform: translateY(30px); -webkit-transform: translateY(30px);
-moz-transform: translateY(30px); -moz-transform: translateY(30px);
-ms-transform: translateY(30px); -ms-transform: translateY(30px);
-o-transform: translateY(30px);
transform: translateY(30px); } transform: translateY(30px); }
.translate-y-3d { .translate-y-3d {
-webkit-transform: translateY(30px);
transform: translateY(30px); } transform: translateY(30px); }
.translate-y-with-perspective { .translate-y-with-perspective {
-webkit-transform: perspective(500) translateY(30px); -webkit-transform: perspective(500) translateY(30px);
-moz-transform: perspective(500) translateY(30px); -moz-transform: perspective(500) translateY(30px);
-ms-transform: perspective(500) translateY(30px); -ms-transform: perspective(500) translateY(30px);
-o-transform: perspective(500) translateY(30px);
transform: perspective(500) translateY(30px); } transform: perspective(500) translateY(30px); }
.translate-y-3d-with-perspective { .translate-y-3d-with-perspective {
-webkit-transform: perspective(500) translateY(30px);
transform: perspective(500) translateY(30px); } transform: perspective(500) translateY(30px); }
.translate-z { .translate-z {
-webkit-transform: translateZ(30px);
transform: translateZ(30px); } transform: translateZ(30px); }
.translate-z-with-perspective { .translate-z-with-perspective {
-webkit-transform: perspective(500) translateZ(30px);
transform: perspective(500) translateZ(30px); } transform: perspective(500) translateZ(30px); }
.translate-3d { .translate-3d {
-webkit-transform: translate3d(30px, 50px, 75px);
transform: translate3d(30px, 50px, 75px); } transform: translate3d(30px, 50px, 75px); }
.translate-3d-with-perspective { .translate-3d-with-perspective {
-webkit-transform: perspective(500) translate3d(30px, 50px, 75px);
transform: perspective(500) translate3d(30px, 50px, 75px); } transform: perspective(500) translate3d(30px, 50px, 75px); }
.skew { .skew {
-webkit-transform: skew(20deg, 50deg); -webkit-transform: skew(20deg, 50deg);
-moz-transform: skew(20deg, 50deg); -moz-transform: skew(20deg, 50deg);
-ms-transform: skew(20deg, 50deg); -ms-transform: skew(20deg, 50deg);
-o-transform: skew(20deg, 50deg);
transform: skew(20deg, 50deg); } transform: skew(20deg, 50deg); }
.skew-3d { .skew-3d {
-webkit-transform: skew(20deg, 50deg);
transform: skew(20deg, 50deg); } transform: skew(20deg, 50deg); }
.skew-x { .skew-x {
-webkit-transform: skewX(20deg); -webkit-transform: skewX(20deg);
-moz-transform: skewX(20deg); -moz-transform: skewX(20deg);
-ms-transform: skewX(20deg); -ms-transform: skewX(20deg);
-o-transform: skewX(20deg);
transform: skewX(20deg); } transform: skewX(20deg); }
.skew-x-3d { .skew-x-3d {
-webkit-transform: skewX(20deg);
transform: skewX(20deg); } transform: skewX(20deg); }
.skew-y { .skew-y {
-webkit-transform: skewY(20deg); -webkit-transform: skewY(20deg);
-moz-transform: skewY(20deg); -moz-transform: skewY(20deg);
-ms-transform: skewY(20deg); -ms-transform: skewY(20deg);
-o-transform: skewY(20deg);
transform: skewY(20deg); } transform: skewY(20deg); }
.skew-y-3d { .skew-y-3d {
-webkit-transform: skewY(20deg);
transform: skewY(20deg); } transform: skewY(20deg); }
.create-transform-2d { .create-transform-2d {
-webkit-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%); -webkit-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
-moz-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%); -moz-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
-ms-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%); -ms-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
-o-transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%); transform: perspective(500) scale(20px, 20px) rotateX(25deg) rotateY(25deg) rotate3d(false 50px) translateX(50px) translateZ(50deg) skew(50deg, 50%);
-webkit-transform-origin: 50%; -webkit-transform-origin: 50%;
-moz-transform-origin: 50%; -moz-transform-origin: 50%;
-ms-transform-origin: 50%; -ms-transform-origin: 50%;
-o-transform-origin: 50%;
transform-origin: 50%; } transform-origin: 50%; }
.create-transform-3d { .create-transform-3d {
-webkit-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%); -webkit-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
-moz-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%); -moz-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
-ms-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%); -ms-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
-o-transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%); transform: perspective(500) scale3d(20px, 20px, 20px) rotateX(25deg) rotateY(25deg) rotateZ(25deg) rotate3d(false 50px) translate3d(50px, 50px, 50deg) skew(50deg, 50%);
-webkit-transform-origin: 50% 50%; -webkit-transform-origin: 50% 50%;
-moz-transform-origin: 50% 50%; -moz-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%;
-o-transform-origin: 50% 50%;
transform-origin: 50% 50%; } transform-origin: 50% 50%; }
.simple-transform { .simple-transform {
-webkit-transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg); -webkit-transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
-moz-transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg); -moz-transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
-ms-transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg); -ms-transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
-o-transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg); transform: scale(25px, 25px) rotateZ(25deg) translate(10px, 10px) skew(30deg, 30deg);
-webkit-transform-origin: 10% 10%; -webkit-transform-origin: 10% 10%;
-moz-transform-origin: 10% 10%; -moz-transform-origin: 10% 10%;
-ms-transform-origin: 10% 10%; -ms-transform-origin: 10% 10%;
-o-transform-origin: 10% 10%;
transform-origin: 10% 10%; } transform-origin: 10% 10%; }

View File

@ -1,11 +1,12 @@
.single-transition-without-delay { .single-transition-without-delay {
-webkit-transition: all 0.6s ease-out; -webkit-transition: all 0.6s ease-out;
-moz-transition: all 0.6s ease-out; -moz-transition: all 0.6s ease-out;
-o-transition: all 0.6s ease-out;
transition: all 0.6s ease-out; } transition: all 0.6s ease-out; }
.single-transition-with-delay { .single-transition-with-delay {
-webkit-transition: all 0.6s ease-out; -webkit-transition: all 0.6s ease-out;
-webkit-transition-delay: 0.2s; -webkit-transition-delay: 0.2s;
-webkit-transition: all 0.6s ease-out 0.2s;
-moz-transition: all 0.6s ease-out 0.2s; -moz-transition: all 0.6s ease-out 0.2s;
-o-transition: all 0.6s ease-out 0.2s;
transition: all 0.6s ease-out 0.2s; } transition: all 0.6s ease-out 0.2s; }

View File

@ -1,4 +1,4 @@
.user-select { .user-select {
-webkit-user-select: none; -webkit-user-select: none;
-o-user-select: none; -moz-user-select: none;
user-select: none; } user-select: none; }