49 lines
1022 B
HTML
49 lines
1022 B
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<body style="overflow:hidden">
|
|
<style>
|
|
@keyframes peepy-move {
|
|
from {
|
|
transform: rotate(3deg) scale(0.9,0.9) translate(-5%,-5%);
|
|
}
|
|
50% {
|
|
transform: rotate(-3deg) scale(1.1,1.1) translate(5%,5%);
|
|
}
|
|
to {
|
|
transform: rotate(3deg) scale(0.9,0.9) translate(-5%,-5%);
|
|
}
|
|
}
|
|
@keyframes peepy-color {
|
|
from {
|
|
filter: hue-rotate(0deg)
|
|
}
|
|
to {
|
|
filter: hue-rotate(359deg)
|
|
}
|
|
}
|
|
.peepy {
|
|
position: absolute;
|
|
top: -20%;
|
|
left: -20%;
|
|
width: 140%;
|
|
height: 140%;
|
|
z-index: -1;
|
|
|
|
background-image: url(https://cdn.shopify.com/s/files/1/2597/3774/products/itemlabel-cow-peepy-site-1.jpg?v=1620839788&width=1200);
|
|
background-size: 25% 25%;
|
|
animation-duration: 0.2s, 1s;
|
|
animation-name: peepy-move, peepy-color;
|
|
animation-iteration-count: infinite;
|
|
|
|
}
|
|
</style>
|
|
<div class="peepy"></div>
|
|
<h1 style="transform: rotate(15deg) translate(10vw,50vh); text-align: center;">
|
|
peepy. peepy. have you seen him? i love peepy.
|
|
do you love peepy?
|
|
i need peepy. peepy?
|
|
peepy.
|
|
<h2>
|
|
</body>
|
|
</html>
|