diff --git a/css/dead.css b/css/dead.css index d736af6..82ee3a0 100644 --- a/css/dead.css +++ b/css/dead.css @@ -3,7 +3,7 @@ html { } body { background: #ddd; - background: rgba(255,110,110, .8); + background: rgba(240,100,100, 1); position: absolute; height: 100%; width: 100%; @@ -13,30 +13,21 @@ body { body:after { content: " "; position: absolute; + opacity: .85; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; - background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%); - background: -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%); - background: -ms-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%); - background: -o-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%); - background: radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%); + background: -webkit-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%), url(_img/static.gif); + background: -moz-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%), url(_img/static.gif); + background: -ms-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%), url(_img/static.gif); + background: -o-radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%), url(_img/static.gif); + background: radial-gradient(center, ellipse cover, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 10%, rgba(0, 0, 0, 0.9) 100%), url(_img/static.gif); } -canvas { - z-index: 1; - position: absolute; - opacity: .8; - left: 0; - top: 0; - width: 100%; - height: 100%; -} - h1 { color: #333; - color: rgba(50,50,50,.3); + color: rgba(200,50,50,.3); text-shadow: 0 0 20px rgba(0,0,0,.5); z-index: 3; position: absolute; @@ -48,27 +39,27 @@ h1 { margin-left: -50%; height: 200px; text-align: center; - -webkit-animation: blur 2s linear infinite, blink 3s ease infinite; - -moz-animation: blur 2s linear infinite, blink 3s ease infinite; - animation: blur 2s linear infinite, blink 3s ease infinite; + -webkit-animation: blur 2s linear infinite, blink 4s ease infinite; + -moz-animation: blur 2s linear infinite, blink 4s ease infinite; + animation: blur 2s linear infinite, blink 4s ease infinite; } @-webkit-keyframes blur { 0% { color: transparent; - text-shadow: 0 0 30px rgba(0, 0, 0, .5); + text-shadow: 0 0 30px rgba(20, 0, 0, .5); } 33% { - text-shadow: 0 0 10px rgba(0, 0, 0, .4); + text-shadow: 0 0 10px rgba(15, 0, 0, .4); } 36% { - text-shadow: 0 0 10px rgba(0, 0, 0, .2); + text-shadow: 0 0 10px rgba(25, 0, 0, .2); } 66% { - text-shadow: 0 0 20px rgba(0, 0, 0, .4); + text-shadow: 0 0 20px rgba(15, 0, 0, .4); } 100% { color: transparent; - text-shadow: 0 0 40px rgba(0, 0, 0, .8); + text-shadow: 0 0 40px rgba(30, 0, 0, .8); } } @-moz-keyframes blur { @@ -117,7 +108,7 @@ h1 { -webkit-transform: skewX(0deg); } 21% { - -webkit-transform: skewX(-1deg); + -webkit-transform: skewX(-3deg); } 35% { opacity: 1; @@ -143,7 +134,7 @@ h1 { -webkit-transform: skewX(0deg); } 21% { - -webkit-transform: skewX(-1deg); + -webkit-transform: skewX(-3deg); } 35% { opacity: 1; @@ -169,7 +160,7 @@ h1 { -webkit-transform: skewX(0deg); } 21% { - -webkit-transform: skewX(-1deg); + -webkit-transform: skewX(-3deg); } 35% { opacity: 1; diff --git a/index.html b/index.html index 33d91bf..a93f442 100644 --- a/index.html +++ b/index.html @@ -14,59 +14,5 @@

HTML5 is DEAD

- - -