<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>KukuFm</title>
<style type="text/css">
@font-face {
font-family: anima;
src: url(fonts/SimonLovely.otf);
}
body {
background: black;
display: flex;
justify-content: center;
perspective: 200px;
}
h2 {
font-size: 150px;
letter-spacing: 50px;
font-weight: bolder;
font-family: anima;
transition: all .25s;
color: black;
animation: senanima 3s infinite alternate;
/*background: linear-gradient(90deg, aqua, pink, green, red);
-webkit-background-clip: text;*/
}
h2:hover {
scale: 1.1;
transform: rotateX(10deg);
}
@keyframes senanima {
0% {
text-shadow: 5px 5px 5px red, -5px -5px 5px red;
}
20% {
text-shadow: 5px 5px 10px red, -5px -5px 10px red;
}
40% {
text-shadow: 5px 5px 5px palegoldenrod, -5px -5px 5px palegoldenrod;
}
60% {
text-shadow: 5px 5px 10px palegoldenrod, -5px -5px 10px palegoldenrod;
}
80% {
text-shadow: 5px 5px 5px lightgreen, -5px -5px 5px lightgreen;
}
100% {
text-shadow: 5px 5px 10px lightgreen, -5px -5px 10px lightgreen;
}
}
</style>
</head>
<body>
<h2>
SENANIMA
</h2>
</body>
</html>