Samuele Locatelli
81 lines
2.1 KiB
CSS
81 lines
2.1 KiB
CSS
.textMain {
|
|
font-size: 4rem;
|
|
-webkit-animation: glow 9s ease-in-out infinite alternate;
|
|
-moz-animation: glow 9s ease-in-out infinite alternate;
|
|
animation: glow 9s ease-in-out infinite alternate;
|
|
}
|
|
@-webkit-keyframes glow {
|
|
0% {
|
|
text-shadow: 0 0 0px #000;
|
|
}
|
|
90%,
|
|
100% {
|
|
text-shadow: 0 0 10px #fff, 0 0 20px #0073e6;
|
|
}
|
|
95% {
|
|
text-shadow: 0 0 15px #fff, 0 0 20px #4da6ff, 0 0 30px #4da6ff;
|
|
}
|
|
}
|
|
@media (max-width: 600px) {
|
|
.textMain {
|
|
font-size: 2rem;
|
|
}
|
|
}
|
|
@media (max-width: 992px) {
|
|
.textMain {
|
|
font-size: 3rem;
|
|
}
|
|
}
|
|
.backImage {
|
|
background-image: url('img/darkthree02.jpg');
|
|
background-repeat: no-repeat;
|
|
animation: zoom-bg 4s ease-in-out infinite;
|
|
}
|
|
@keyframes zoom-bg {
|
|
0%,
|
|
80% {
|
|
background-size: 100% 100%;
|
|
filter: brightness(80%);
|
|
}
|
|
90% {
|
|
background-size: 500% 500%;
|
|
background-position: 50% 50%;
|
|
filter: brightness(120%);
|
|
}
|
|
100% {
|
|
background-size: 100% 100%;
|
|
filter: brightness(80%);
|
|
}
|
|
}
|
|
.frontImage {
|
|
padding: 0rem;
|
|
background: -webkit-linear-gradient(135deg, #000 30%, #D8951C 45%, #FAF2A2 50%, #C8850C 55%, #000 70%);
|
|
background-size: 250% 250%;
|
|
animation: gradient-bg 6s ease-in-out infinite;
|
|
}
|
|
@keyframes gradient-bg {
|
|
0% {
|
|
background-position: 0% 50%;
|
|
filter: brightness(90%);
|
|
box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #0ff, 0 0 40px #0ff, 0 0 50px #0073e6, 0 0 60px #0073e6, 0 0 70px #0073e6;
|
|
}
|
|
40% {
|
|
filter: brightness(105%);
|
|
box-shadow: 0 0 40px #fff, 0 0 50px #4da6ff, 0 0 60px #4da6ff, 0 0 70px #4da6ff, 0 0 80px #4da6ff, 0 0 90px #4da6ff, 0 0 100px #4da6ff;
|
|
}
|
|
80% {
|
|
background-position: 0% 50%;
|
|
filter: brightness(90%);
|
|
box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #0ff, 0 0 40px #0ff, 0 0 50px #0073e6, 0 0 60px #0073e6, 0 0 70px #0073e6;
|
|
}
|
|
92% {
|
|
background-position: 100% 50%;
|
|
filter: brightness(110%);
|
|
box-shadow: 0 0 0px #fff;
|
|
}
|
|
100% {
|
|
background-position: 0% 50%;
|
|
filter: brightness(90%);
|
|
box-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #0ff, 0 0 40px #0ff, 0 0 50px #0073e6, 0 0 60px #0073e6, 0 0 70px #0073e6;
|
|
}
|
|
} |