|
|
@import url('https://fonts.googleapis.com/css2?family=Alfa+Slab+One&display=swap'); |
|
|
* { |
|
|
padding: 0; |
|
|
margin: 0; |
|
|
box-sizing: border-box; |
|
|
} |
|
|
|
|
|
body { |
|
|
|
|
|
|
|
|
justify-content: center; |
|
|
align-items: center; |
|
|
|
|
|
} |
|
|
.waviy { |
|
|
|
|
|
position: relative; |
|
|
margin-top: 25%; |
|
|
margin-left: 35%; |
|
|
-webkit-box-reflect: below -20px linear-gradient(transparent, rgba(0,0,0,.2)); |
|
|
font-size: 60px; |
|
|
} |
|
|
.waviy span { |
|
|
font-family: 'Alfa Slab One', cursive; |
|
|
position: relative; |
|
|
display: inline-block; |
|
|
color: #fff; |
|
|
text-transform: uppercase; |
|
|
animation: waviy 1s infinite; |
|
|
animation-delay: calc(.1s * var(--i)); |
|
|
|
|
|
} |
|
|
@keyframes waviy { |
|
|
0%,40%,100% { |
|
|
transform: translateY(0) |
|
|
} |
|
|
20% { |
|
|
transform: translateY(-20px) |
|
|
} |
|
|
} |
