From 2014.igem.org
(Difference between revisions)
|
|
| Line 1: |
Line 1: |
| | <html> | | <html> |
| | <style> | | <style> |
| - | .letter-container h2 a {
| |
| - | text-align: center;
| |
| - | font-size: 130px;
| |
| - | line-height: 160px;
| |
| - | display: block;
| |
| - | padding-bottom: 30px;
| |
| - | mask: url(../images/mask.png) repeat;
| |
| - | }
| |
| - | .letter-container h2 a span {
| |
| - | color: #fff;
| |
| - | opacity: 1;
| |
| - | text-shadow: 0px 0px 2px #fff, 1px 1px 4px rgba(0,0,0,0.7);
| |
| - | transition: all 0.3s linear;
| |
| - | animation: sharpen 0.9s linear backwards;
| |
| - | }
| |
| - | .letter-container h2 a span:hover{
| |
| - | text-shadow: 0px 0px 40px #fff;
| |
| - | }
| |
| - | .letter-container h2 a span:nth-child(1) {
| |
| - | animation-delay: 0s;
| |
| - | }
| |
| - | .letter-container h2 a span:nth-child(2) {
| |
| - | animation-delay: 0.1s;
| |
| - | }
| |
| - | .letter-container h2 a span:nth-child(3) {
| |
| - | animation-delay: 0.2s;
| |
| - | }
| |
| - | /* ...and so on for all the letters */
| |
| - |
| |
| - | @keyframes sharpen {
| |
| - | 0% {
| |
| - | opacity: 0;
| |
| - | text-shadow: 0px 0px 100px #fff;
| |
| - | color: transparent;
| |
| - | }
| |
| - | 90% {
| |
| - | opacity: 0.9;
| |
| - | text-shadow: 0px 0px 10px #fff;
| |
| - | color: transparent;
| |
| - | }
| |
| - | 100% {
| |
| - | color: #fff;
| |
| - | opacity: 1;
| |
| - | text-shadow: 0px 0px 2px #fff, 1px 1px 4px rgba(0,0,0,0.7);
| |
| - | }
| |
| - | }
| |
| - |
| |
| - |
| |
| - |
| |
| - |
| |
| - |
| |
| - |
| |
| | | | |
| | | | |
Revision as of 13:34, 8 October 2014
"
