Hellacolor, Flexbox, animation and music

Developer
BROWNERD
Size
10,370 Kb
Views
24,288
  1. Hellacolor, Flexbox, animation and music Previews
  2. Hellacolor, Flexbox, animation and music HTML Codes
  3. Hellacolor, Flexbox, animation and music CSS Codes
  4. Hellacolor, Flexbox, animation and music JS Codes

How do I make an hellacolor, flexbox, animation and music?

So this was a long piece in the making. I first came across this concept via Bennett Feely's pen which referenced Landschaft Mit Haus by Maria Zaikina about 3 years ago. Well I Googled that back then and found this beautiful video Landschaft mit Haus.. What is a hellacolor, flexbox, animation and music? How do you make a hellacolor, flexbox, animation and music? This script and codes were developed by BROWNERD on 29 August 2022, Monday.

Hellacolor, Flexbox, animation and music Previews
IQ Test

Hellacolor, Flexbox, animation and music - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>Hellacolor, Flexbox, animation and music</title> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/meyer-reset/2.0/reset.min.css"> <link rel="stylesheet" href="css/style.css">
</head>
<body>
<!-- Use a mixin to keep from writing this html twice-->
<div class="#{blk}"> <div class="#{blk}__haus"> <!-- Use flex order to reverse the roof and walls in the reflection--> <div class="#{blk}__haus-roof"> <div class="#{blk}__haus-roof-side"></div> <div class="#{blk}__haus-roof-front"></div> </div> <div class="#{blk}__haus-walls"> <div class="#{blk}__haus-walls-front"></div> <div class="#{blk}__haus-walls-side"></div> </div> </div>
</div>
<div class="#{blk}"> <div class="#{blk}__haus"> <!-- Use flex order to reverse the roof and walls in the reflection--> <div class="#{blk}__haus-roof"> <div class="#{blk}__haus-roof-side"></div> <div class="#{blk}__haus-roof-front"></div> </div> <div class="#{blk}__haus-walls"> <div class="#{blk}__haus-walls-front"></div> <div class="#{blk}__haus-walls-side"></div> </div> </div>
</div> <script src='https://s3-us-west-2.amazonaws.com/s.cdpn.io/5530/howler.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

Hellacolor, Flexbox, animation and music - Script Codes CSS Codes

* { box-sizing: border-box;
}
body { background: #fff; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100vh; width: 100vw;
}
.sky { background: #eee; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 50vh; width: 100vw; -webkit-animation: sky 120s forwards; animation: sky 120s forwards;
}
.sky__haus { display: -webkit-box; display: -ms-flexbox; display: flex; height: 90px; width: 120px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; opacity: 1;
}
.sky__haus-roof { display: -webkit-box; display: -ms-flexbox; display: flex; height: 40px; width: 140px;
}
.sky__haus-roof-side { background-color: #333; height: 40px; -webkit-transform: skew(35deg) translateX(-14px); transform: skew(35deg) translateX(-14px); -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; -webkit-box-flex: 2; -ms-flex: 2; flex: 2; -webkit-animation: side 120s forwards; animation: side 120s forwards;
}
.sky__haus-roof-front { background-color: #f5deb3; height: 40px; -webkit-transform: skew(-35deg) translateX(14px); transform: skew(-35deg) translateX(14px); -webkit-box-flex: 3; -ms-flex: 3; flex: 3; -webkit-animation: roof 120s forwards; animation: roof 120s forwards;
}
.sky__haus-walls { display: -webkit-box; display: -ms-flexbox; display: flex; height: 50px; width: 140px;
}
.sky__haus-walls-front { background-color: #f0f; height: 50px; -webkit-box-flex: 3; -ms-flex: 3; flex: 3; -webkit-animation: front 120s forwards; animation: front 120s forwards;
}
.sky__haus-walls-side { background-color: #333; height: 50px; -webkit-box-flex: 2; -ms-flex: 2; flex: 2; -webkit-animation: side 120s forwards; animation: side 120s forwards;
}
.ground { background: #008000; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 50vh; width: 100vw; -webkit-animation: ground 120s forwards; animation: ground 120s forwards;
}
.ground__haus { display: -webkit-box; display: -ms-flexbox; display: flex; height: 90px; width: 120px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; opacity: 0; -webkit-animation: reflection 120s forwards; animation: reflection 120s forwards;
}
.ground__haus-roof { display: -webkit-box; display: -ms-flexbox; display: flex; height: 40px; width: 140px; -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2;
}
.ground__haus-roof-side { background-color: #333; height: 40px; -webkit-transform: skew(-35deg) translateX(-14px); transform: skew(-35deg) translateX(-14px); -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2; -webkit-box-flex: 2; -ms-flex: 2; flex: 2; -webkit-animation: side 120s forwards; animation: side 120s forwards;
}
.ground__haus-roof-front { background-color: #f5deb3; height: 40px; -webkit-transform: skew(35deg) translateX(14px); transform: skew(35deg) translateX(14px); -webkit-box-flex: 3; -ms-flex: 3; flex: 3; -webkit-animation: roof 120s forwards; animation: roof 120s forwards;
}
.ground__haus-walls { display: -webkit-box; display: -ms-flexbox; display: flex; height: 50px; width: 140px; -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1;
}
.ground__haus-walls-front { background-color: #f0f; height: 50px; -webkit-box-flex: 3; -ms-flex: 3; flex: 3; -webkit-animation: front 120s forwards; animation: front 120s forwards;
}
.ground__haus-walls-side { background-color: #333; height: 50px; -webkit-box-flex: 2; -ms-flex: 2; flex: 2; -webkit-animation: side 120s forwards; animation: side 120s forwards;
}
@-webkit-keyframes roof { 0% { background: -webkit-linear-gradient(#6cb20a, #6cb20a); background: linear-gradient(#6cb20a, #6cb20a); } 5% { background: -webkit-linear-gradient(#cd7f5b, #cd7f5b); background: linear-gradient(#cd7f5b, #cd7f5b); } 10% { background: -webkit-linear-gradient(#7542ff, #7542ff); background: linear-gradient(#7542ff, #7542ff); } 15% { background: -webkit-linear-gradient(#a7e28d, #a7e28d); background: linear-gradient(#a7e28d, #a7e28d); } 20% { background: -webkit-linear-gradient(#c7f7ff, #c7f7ff); background: linear-gradient(#c7f7ff, #c7f7ff); } 25% { background: -webkit-linear-gradient(#30bb32, #30bb32); background: linear-gradient(#30bb32, #30bb32); } 30% { background: -webkit-linear-gradient(#ed9bf8, #ed9bf8); background: linear-gradient(#ed9bf8, #ed9bf8); } 35% { background: -webkit-linear-gradient(#e09f42, #e09f42); background: linear-gradient(#e09f42, #e09f42); } 40% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 45% { background: -webkit-linear-gradient(#9f7ef1, #9f7ef1); background: linear-gradient(#9f7ef1, #9f7ef1); } 50% { background: -webkit-linear-gradient(#ff6352, #ff6352); background: linear-gradient(#ff6352, #ff6352); } 55% { background: -webkit-linear-gradient(#773256, #773256); background: linear-gradient(#773256, #773256); } 60% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 65% { background: -webkit-linear-gradient(#1cc4a3, #1cc4a3); background: linear-gradient(#1cc4a3, #1cc4a3); } 70% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 75% { background: -webkit-linear-gradient(#6c81d5, #6c81d5); background: linear-gradient(#6c81d5, #6c81d5); } 80% { background: -webkit-linear-gradient(#faeefb, #faeefb); background: linear-gradient(#faeefb, #faeefb); } 85% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 90% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 95% { background: -webkit-linear-gradient(#00b877, #00b877); background: linear-gradient(#00b877, #00b877); } 100% { background: -webkit-linear-gradient(#aee59a, #aee59a); background: linear-gradient(#aee59a, #aee59a); } 105% { background: -webkit-linear-gradient(#dfb4b8, #dfb4b8); background: linear-gradient(#dfb4b8, #dfb4b8); }
}
@keyframes roof { 0% { background: -webkit-linear-gradient(#6cb20a, #6cb20a); background: linear-gradient(#6cb20a, #6cb20a); } 5% { background: -webkit-linear-gradient(#cd7f5b, #cd7f5b); background: linear-gradient(#cd7f5b, #cd7f5b); } 10% { background: -webkit-linear-gradient(#7542ff, #7542ff); background: linear-gradient(#7542ff, #7542ff); } 15% { background: -webkit-linear-gradient(#a7e28d, #a7e28d); background: linear-gradient(#a7e28d, #a7e28d); } 20% { background: -webkit-linear-gradient(#c7f7ff, #c7f7ff); background: linear-gradient(#c7f7ff, #c7f7ff); } 25% { background: -webkit-linear-gradient(#30bb32, #30bb32); background: linear-gradient(#30bb32, #30bb32); } 30% { background: -webkit-linear-gradient(#ed9bf8, #ed9bf8); background: linear-gradient(#ed9bf8, #ed9bf8); } 35% { background: -webkit-linear-gradient(#e09f42, #e09f42); background: linear-gradient(#e09f42, #e09f42); } 40% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 45% { background: -webkit-linear-gradient(#9f7ef1, #9f7ef1); background: linear-gradient(#9f7ef1, #9f7ef1); } 50% { background: -webkit-linear-gradient(#ff6352, #ff6352); background: linear-gradient(#ff6352, #ff6352); } 55% { background: -webkit-linear-gradient(#773256, #773256); background: linear-gradient(#773256, #773256); } 60% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 65% { background: -webkit-linear-gradient(#1cc4a3, #1cc4a3); background: linear-gradient(#1cc4a3, #1cc4a3); } 70% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 75% { background: -webkit-linear-gradient(#6c81d5, #6c81d5); background: linear-gradient(#6c81d5, #6c81d5); } 80% { background: -webkit-linear-gradient(#faeefb, #faeefb); background: linear-gradient(#faeefb, #faeefb); } 85% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 90% { background: -webkit-linear-gradient(#fff, #fff); background: linear-gradient(#fff, #fff); } 95% { background: -webkit-linear-gradient(#00b877, #00b877); background: linear-gradient(#00b877, #00b877); } 100% { background: -webkit-linear-gradient(#aee59a, #aee59a); background: linear-gradient(#aee59a, #aee59a); } 105% { background: -webkit-linear-gradient(#dfb4b8, #dfb4b8); background: linear-gradient(#dfb4b8, #dfb4b8); }
}
@-webkit-keyframes side { 0% { background: -webkit-linear-gradient(#27790b, #27790b); background: linear-gradient(#27790b, #27790b); } 5% { background: -webkit-linear-gradient(#2ae006, #2ae006); background: linear-gradient(#2ae006, #2ae006); } 10% { background: -webkit-linear-gradient(#41520a, #41520a); background: linear-gradient(#41520a, #41520a); } 15% { background: -webkit-linear-gradient(#8e49a7, #8e49a7); background: linear-gradient(#8e49a7, #8e49a7); } 20% { background: -webkit-linear-gradient(#01320d, #01320d); background: linear-gradient(#01320d, #01320d); } 25% { background: -webkit-linear-gradient(#173387, #173387); background: linear-gradient(#173387, #173387); } 30% { background: -webkit-linear-gradient(#5b0b4d, #5b0b4d); background: linear-gradient(#5b0b4d, #5b0b4d); } 35% { background: -webkit-linear-gradient(#71192d, #71192d); background: linear-gradient(#71192d, #71192d); } 40% { background: -webkit-linear-gradient(#4f8c76, #4f8c76); background: linear-gradient(#4f8c76, #4f8c76); } 45% { background: -webkit-linear-gradient(#098cce, #098cce); background: linear-gradient(#098cce, #098cce); } 50% { background: -webkit-linear-gradient(#026ed9, #026ed9); background: linear-gradient(#026ed9, #026ed9); } 55% { background: -webkit-linear-gradient(#6c3414, #6c3414); background: linear-gradient(#6c3414, #6c3414); } 60% { background: -webkit-linear-gradient(#395365, #395365); background: linear-gradient(#395365, #395365); } 65% { background: -webkit-linear-gradient(#045247, #045247); background: linear-gradient(#045247, #045247); } 70% { background: -webkit-linear-gradient(#400387, #400387); background: linear-gradient(#400387, #400387); } 75% { background: -webkit-linear-gradient(#732138, #732138); background: linear-gradient(#732138, #732138); } 80% { background: -webkit-linear-gradient(#8a0029, #8a0029); background: linear-gradient(#8a0029, #8a0029); } 85% { background: -webkit-linear-gradient(#9f5673, #9f5673); background: linear-gradient(#9f5673, #9f5673); } 90% { background: -webkit-linear-gradient(#24d6ca, #24d6ca); background: linear-gradient(#24d6ca, #24d6ca); } 95% { background: -webkit-linear-gradient(#677728, #677728); background: linear-gradient(#677728, #677728); } 100% { background: -webkit-linear-gradient(#b139a9, #b139a9); background: linear-gradient(#b139a9, #b139a9); } 105% { background: -webkit-linear-gradient(#650644, #650644); background: linear-gradient(#650644, #650644); }
}
@keyframes side { 0% { background: -webkit-linear-gradient(#27790b, #27790b); background: linear-gradient(#27790b, #27790b); } 5% { background: -webkit-linear-gradient(#2ae006, #2ae006); background: linear-gradient(#2ae006, #2ae006); } 10% { background: -webkit-linear-gradient(#41520a, #41520a); background: linear-gradient(#41520a, #41520a); } 15% { background: -webkit-linear-gradient(#8e49a7, #8e49a7); background: linear-gradient(#8e49a7, #8e49a7); } 20% { background: -webkit-linear-gradient(#01320d, #01320d); background: linear-gradient(#01320d, #01320d); } 25% { background: -webkit-linear-gradient(#173387, #173387); background: linear-gradient(#173387, #173387); } 30% { background: -webkit-linear-gradient(#5b0b4d, #5b0b4d); background: linear-gradient(#5b0b4d, #5b0b4d); } 35% { background: -webkit-linear-gradient(#71192d, #71192d); background: linear-gradient(#71192d, #71192d); } 40% { background: -webkit-linear-gradient(#4f8c76, #4f8c76); background: linear-gradient(#4f8c76, #4f8c76); } 45% { background: -webkit-linear-gradient(#098cce, #098cce); background: linear-gradient(#098cce, #098cce); } 50% { background: -webkit-linear-gradient(#026ed9, #026ed9); background: linear-gradient(#026ed9, #026ed9); } 55% { background: -webkit-linear-gradient(#6c3414, #6c3414); background: linear-gradient(#6c3414, #6c3414); } 60% { background: -webkit-linear-gradient(#395365, #395365); background: linear-gradient(#395365, #395365); } 65% { background: -webkit-linear-gradient(#045247, #045247); background: linear-gradient(#045247, #045247); } 70% { background: -webkit-linear-gradient(#400387, #400387); background: linear-gradient(#400387, #400387); } 75% { background: -webkit-linear-gradient(#732138, #732138); background: linear-gradient(#732138, #732138); } 80% { background: -webkit-linear-gradient(#8a0029, #8a0029); background: linear-gradient(#8a0029, #8a0029); } 85% { background: -webkit-linear-gradient(#9f5673, #9f5673); background: linear-gradient(#9f5673, #9f5673); } 90% { background: -webkit-linear-gradient(#24d6ca, #24d6ca); background: linear-gradient(#24d6ca, #24d6ca); } 95% { background: -webkit-linear-gradient(#677728, #677728); background: linear-gradient(#677728, #677728); } 100% { background: -webkit-linear-gradient(#b139a9, #b139a9); background: linear-gradient(#b139a9, #b139a9); } 105% { background: -webkit-linear-gradient(#650644, #650644); background: linear-gradient(#650644, #650644); }
}
@-webkit-keyframes front { 0% { background: -webkit-linear-gradient(#ebb3ff, #ebb3ff); background: linear-gradient(#ebb3ff, #ebb3ff); } 5% { background: -webkit-linear-gradient(#8cfc36, #8cfc36); background: linear-gradient(#8cfc36, #8cfc36); } 10% { background: -webkit-linear-gradient(#dfffc7, #dfffc7); background: linear-gradient(#dfffc7, #dfffc7); } 15% { background: -webkit-linear-gradient(#ff2969, #ff2969); background: linear-gradient(#ff2969, #ff2969); } 20% { background: -webkit-linear-gradient(#b6f9fb, #b6f9fb); background: linear-gradient(#b6f9fb, #b6f9fb); } 25% { background: -webkit-linear-gradient(#afff8a, #afff8a); background: linear-gradient(#afff8a, #afff8a); } 30% { background: -webkit-linear-gradient(#ff47f6, #ff47f6); background: linear-gradient(#ff47f6, #ff47f6); } 35% { background: -webkit-linear-gradient(#75a8ff, #75a8ff); background: linear-gradient(#75a8ff, #75a8ff); } 40% { background: -webkit-linear-gradient(#ff249c, #ff249c); background: linear-gradient(#ff249c, #ff249c); } 45% { background: -webkit-linear-gradient(#57efba, #57efba); background: linear-gradient(#57efba, #57efba); } 50% { background: -webkit-linear-gradient(#eea320, #eea320); background: linear-gradient(#eea320, #eea320); } 55% { background: -webkit-linear-gradient(#c200b5, #c200b5); background: linear-gradient(#c200b5, #c200b5); } 60% { background: -webkit-linear-gradient(#ffadf0, #ffadf0); background: linear-gradient(#ffadf0, #ffadf0); } 65% { background: -webkit-linear-gradient(#1400eb, #1400eb); background: linear-gradient(#1400eb, #1400eb); } 70% { background: -webkit-linear-gradient(#daff61, #daff61); background: linear-gradient(#daff61, #daff61); } 75% { background: -webkit-linear-gradient(#dfaffd, #dfaffd); background: linear-gradient(#dfaffd, #dfaffd); } 80% { background: -webkit-linear-gradient(#ffc766, #ffc766); background: linear-gradient(#ffc766, #ffc766); } 85% { background: -webkit-linear-gradient(#94a4ff, #94a4ff); background: linear-gradient(#94a4ff, #94a4ff); } 90% { background: -webkit-linear-gradient(#ff94e1, #ff94e1); background: linear-gradient(#ff94e1, #ff94e1); } 95% { background: -webkit-linear-gradient(#d61d00, #d61d00); background: linear-gradient(#d61d00, #d61d00); } 100% { background: -webkit-linear-gradient(#b9aa04, #b9aa04); background: linear-gradient(#b9aa04, #b9aa04); } 105% { background: -webkit-linear-gradient(#3f9ae4, #3f9ae4); background: linear-gradient(#3f9ae4, #3f9ae4); }
}
@keyframes front { 0% { background: -webkit-linear-gradient(#ebb3ff, #ebb3ff); background: linear-gradient(#ebb3ff, #ebb3ff); } 5% { background: -webkit-linear-gradient(#8cfc36, #8cfc36); background: linear-gradient(#8cfc36, #8cfc36); } 10% { background: -webkit-linear-gradient(#dfffc7, #dfffc7); background: linear-gradient(#dfffc7, #dfffc7); } 15% { background: -webkit-linear-gradient(#ff2969, #ff2969); background: linear-gradient(#ff2969, #ff2969); } 20% { background: -webkit-linear-gradient(#b6f9fb, #b6f9fb); background: linear-gradient(#b6f9fb, #b6f9fb); } 25% { background: -webkit-linear-gradient(#afff8a, #afff8a); background: linear-gradient(#afff8a, #afff8a); } 30% { background: -webkit-linear-gradient(#ff47f6, #ff47f6); background: linear-gradient(#ff47f6, #ff47f6); } 35% { background: -webkit-linear-gradient(#75a8ff, #75a8ff); background: linear-gradient(#75a8ff, #75a8ff); } 40% { background: -webkit-linear-gradient(#ff249c, #ff249c); background: linear-gradient(#ff249c, #ff249c); } 45% { background: -webkit-linear-gradient(#57efba, #57efba); background: linear-gradient(#57efba, #57efba); } 50% { background: -webkit-linear-gradient(#eea320, #eea320); background: linear-gradient(#eea320, #eea320); } 55% { background: -webkit-linear-gradient(#c200b5, #c200b5); background: linear-gradient(#c200b5, #c200b5); } 60% { background: -webkit-linear-gradient(#ffadf0, #ffadf0); background: linear-gradient(#ffadf0, #ffadf0); } 65% { background: -webkit-linear-gradient(#1400eb, #1400eb); background: linear-gradient(#1400eb, #1400eb); } 70% { background: -webkit-linear-gradient(#daff61, #daff61); background: linear-gradient(#daff61, #daff61); } 75% { background: -webkit-linear-gradient(#dfaffd, #dfaffd); background: linear-gradient(#dfaffd, #dfaffd); } 80% { background: -webkit-linear-gradient(#ffc766, #ffc766); background: linear-gradient(#ffc766, #ffc766); } 85% { background: -webkit-linear-gradient(#94a4ff, #94a4ff); background: linear-gradient(#94a4ff, #94a4ff); } 90% { background: -webkit-linear-gradient(#ff94e1, #ff94e1); background: linear-gradient(#ff94e1, #ff94e1); } 95% { background: -webkit-linear-gradient(#d61d00, #d61d00); background: linear-gradient(#d61d00, #d61d00); } 100% { background: -webkit-linear-gradient(#b9aa04, #b9aa04); background: linear-gradient(#b9aa04, #b9aa04); } 105% { background: -webkit-linear-gradient(#3f9ae4, #3f9ae4); background: linear-gradient(#3f9ae4, #3f9ae4); }
}
@-webkit-keyframes sky { 0 { background: -webkit-linear-gradient(#0f0, #0f0); background: linear-gradient(#0f0, #0f0); } 5% { background: -webkit-linear-gradient(#082b08, #082b08); background: linear-gradient(#082b08, #082b08); } 5% { background: -webkit-linear-gradient(bottom, #0ff, #f0f); background: linear-gradient(0deg, #0ff, #f0f); } 10% { background: -webkit-linear-gradient(290deg, #660053, hsla(293,100%,20%,1) 0%,hsla(293,100%,20%,1) 12%,hsla(196,100%,20%,1) 42%,hsla(196,100%,20%,1) 84%,hsla(89,100%,20%,1) 40%,hsla(89,100%,20%,1) 60%,hsla(63,100%,20%,1) 129%,hsla(63,100%,20%,1) 172%,hsla(87,100%,20%,1) 108%,hsla(87,100%,20%,1) 135%,hsla(284,100%,20%,1) 255%,hsla(284,100%,20%,1) 306%,hsla(257,100%,20%,1) 210%,hsla(257,100%,20%,1) 245%,hsla(268,100%,20%,1) 413%,hsla(268,100%,20%,1) 472%,hsla(234,100%,20%,1) 464%,hsla(234,100%,20%,1) 522%,hsla(199,100%,20%,1) 198%,hsla(199,100%,20%,1) 220%,hsla(311,100%,20%,1) 400%,hsla(311,100%,20%,1) 440%); background: linear-gradient(160deg, #660053, hsla(293,100%,20%,1) 0%,hsla(293,100%,20%,1) 12%,hsla(196,100%,20%,1) 42%,hsla(196,100%,20%,1) 84%,hsla(89,100%,20%,1) 40%,hsla(89,100%,20%,1) 60%,hsla(63,100%,20%,1) 129%,hsla(63,100%,20%,1) 172%,hsla(87,100%,20%,1) 108%,hsla(87,100%,20%,1) 135%,hsla(284,100%,20%,1) 255%,hsla(284,100%,20%,1) 306%,hsla(257,100%,20%,1) 210%,hsla(257,100%,20%,1) 245%,hsla(268,100%,20%,1) 413%,hsla(268,100%,20%,1) 472%,hsla(234,100%,20%,1) 464%,hsla(234,100%,20%,1) 522%,hsla(199,100%,20%,1) 198%,hsla(199,100%,20%,1) 220%,hsla(311,100%,20%,1) 400%,hsla(311,100%,20%,1) 440%); } 15% { background: -webkit-linear-gradient(bottom, #204060, hsla(210,50%,25%,1) 25%,hsla(210,50%,20%,1) 25%,hsla(210,50%,20%,1) 50%,hsla(210,50%,15%,1) 50%,hsla(210,50%,15%,1) 75%,hsla(210,50%,10%,1) 75%,hsla(210,50%,10%,1) 100%,hsla(210,50%,5%,1) 100%,hsla(210,50%,5%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); background: linear-gradient(0deg, #204060, hsla(210,50%,25%,1) 25%,hsla(210,50%,20%,1) 25%,hsla(210,50%,20%,1) 50%,hsla(210,50%,15%,1) 50%,hsla(210,50%,15%,1) 75%,hsla(210,50%,10%,1) 75%,hsla(210,50%,10%,1) 100%,hsla(210,50%,5%,1) 100%,hsla(210,50%,5%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); } 20% { background: -webkit-linear-gradient(bottom, #602035, hsla(340,50%,25%,1) 25%,hsla(340,50%,15%,1) 25%,hsla(340,50%,15%,1) 50%,hsla(340,50%,5%,1) 50%,hsla(340,50%,5%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); background: linear-gradient(0deg, #602035, hsla(340,50%,25%,1) 25%,hsla(340,50%,15%,1) 25%,hsla(340,50%,15%,1) 50%,hsla(340,50%,5%,1) 50%,hsla(340,50%,5%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); } 25% { background: -webkit-linear-gradient(45deg, #08ff00, hsla(281,100%,50%,1) 0%,hsla(281,100%,50%,1) 16%,hsla(246,100%,50%,1) 59%,hsla(246,100%,50%,1) 118%,hsla(198,100%,50%,1) 98%,hsla(198,100%,50%,1) 147%,hsla(188,100%,50%,1) 108%,hsla(188,100%,50%,1) 144%,hsla(273,100%,50%,1) 60%,hsla(273,100%,50%,1) 75%,hsla(328,100%,50%,1) 145%,hsla(328,100%,50%,1) 174%,hsla(67,100%,50%,1) 300%,hsla(67,100%,50%,1) 350%,hsla(163,100%,50%,1) 189%,hsla(163,100%,50%,1) 216%,hsla(188,100%,50%,1) 240%,hsla(188,100%,50%,1) 270%,hsla(269,100%,50%,1) 261%,hsla(269,100%,50%,1) 290%,hsla(307,100%,50%,1) 440%,hsla(307,100%,50%,1) 484%,hsla(302,100%,50%,1) 528%,hsla(302,100%,50%,1) 576%,hsla(240,100%,50%,1) 552%,hsla(240,100%,50%,1) 598%,hsla(62,100%,50%,1) 312%,hsla(62,100%,50%,1) 336%,hsla(107,100%,50%,1) 280%,hsla(107,100%,50%,1) 300%,hsla(351,100%,50%,1) 315%,hsla(351,100%,50%,1) 336%,hsla(126,100%,50%,1) 256%,hsla(126,100%,50%,1) 272%,hsla(359,100%,50%,1) 442%,hsla(359,100%,50%,1) 468%,hsla(281,100%,50%,1) 612%,hsla(281,100%,50%,1) 646%,hsla(60,100%,50%,1) 1083%,hsla(60,100%,50%,1) 1140%,hsla(118,100%,50%,1) 440%,hsla(118,100%,50%,1) 462%); background: linear-gradient(45deg, #08ff00, hsla(281,100%,50%,1) 0%,hsla(281,100%,50%,1) 16%,hsla(246,100%,50%,1) 59%,hsla(246,100%,50%,1) 118%,hsla(198,100%,50%,1) 98%,hsla(198,100%,50%,1) 147%,hsla(188,100%,50%,1) 108%,hsla(188,100%,50%,1) 144%,hsla(273,100%,50%,1) 60%,hsla(273,100%,50%,1) 75%,hsla(328,100%,50%,1) 145%,hsla(328,100%,50%,1) 174%,hsla(67,100%,50%,1) 300%,hsla(67,100%,50%,1) 350%,hsla(163,100%,50%,1) 189%,hsla(163,100%,50%,1) 216%,hsla(188,100%,50%,1) 240%,hsla(188,100%,50%,1) 270%,hsla(269,100%,50%,1) 261%,hsla(269,100%,50%,1) 290%,hsla(307,100%,50%,1) 440%,hsla(307,100%,50%,1) 484%,hsla(302,100%,50%,1) 528%,hsla(302,100%,50%,1) 576%,hsla(240,100%,50%,1) 552%,hsla(240,100%,50%,1) 598%,hsla(62,100%,50%,1) 312%,hsla(62,100%,50%,1) 336%,hsla(107,100%,50%,1) 280%,hsla(107,100%,50%,1) 300%,hsla(351,100%,50%,1) 315%,hsla(351,100%,50%,1) 336%,hsla(126,100%,50%,1) 256%,hsla(126,100%,50%,1) 272%,hsla(359,100%,50%,1) 442%,hsla(359,100%,50%,1) 468%,hsla(281,100%,50%,1) 612%,hsla(281,100%,50%,1) 646%,hsla(60,100%,50%,1) 1083%,hsla(60,100%,50%,1) 1140%,hsla(118,100%,50%,1) 440%,hsla(118,100%,50%,1) 462%); } 30% { background: -webkit-linear-gradient(top, #b3b3b3, hsla(300,0%,70%,1) 40%,hsla(300,0%,90%,1) 40%,hsla(300,0%,90%,1) 80%,hsla(300,0%,100%,1) 80%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); background: linear-gradient(180deg, #b3b3b3, hsla(300,0%,70%,1) 40%,hsla(300,0%,90%,1) 40%,hsla(300,0%,90%,1) 80%,hsla(300,0%,100%,1) 80%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); } 35% { background: -webkit-linear-gradient(85deg, hsla(298,96%,47%,1) 0%,hsla(298,96%,47%,1) 10%,hsla(64,48%,44%,1) 10%,hsla(64,48%,44%,1) 20%,hsla(325,68%,50%,1) 20%,hsla(325,68%,50%,1) 30%); background: linear-gradient(5deg, hsla(298,96%,47%,1) 0%,hsla(298,96%,47%,1) 10%,hsla(64,48%,44%,1) 10%,hsla(64,48%,44%,1) 20%,hsla(325,68%,50%,1) 20%,hsla(325,68%,50%,1) 30%); } 40% { background: -webkit-linear-gradient(top, #ff2b00, hsla(10,100%,50%,1) 50%,hsla(10,100%,60%,1) 50%,hsla(10,100%,60%,1) 100%,hsla(10,100%,70%,1) 100%); background: linear-gradient(180deg, #ff2b00, hsla(10,100%,50%,1) 50%,hsla(10,100%,60%,1) 50%,hsla(10,100%,60%,1) 100%,hsla(10,100%,70%,1) 100%); } 45% { background: -webkit-linear-gradient(60deg, #0f2, hsla(67,100%,50%,1) 0%,hsla(67,100%,50%,1) 31%,hsla(68,100%,50%,1) 18%,hsla(68,100%,50%,1) 36%,hsla(78,100%,50%,1) 118%,hsla(78,100%,50%,1) 177%,hsla(133,100%,50%,1) 48%,hsla(133,100%,50%,1) 64%,hsla(152,100%,50%,1) 108%,hsla(152,100%,50%,1) 135%,hsla(75,100%,50%,1) 145%,hsla(75,100%,50%,1) 174%,hsla(139,100%,50%,1) 216%,hsla(139,100%,50%,1) 252%,hsla(134,100%,50%,1) 301%,hsla(134,100%,50%,1) 344%,hsla(170,100%,50%,1) 112%,hsla(170,100%,50%,1) 126%,hsla(166,100%,50%,1) 378%,hsla(166,100%,50%,1) 420%,hsla(135,100%,50%,1) 230%,hsla(135,100%,50%,1) 253%,hsla(120,100%,50%,1) 286%,hsla(120,100%,50%,1) 312%,hsla(145,100%,50%,1) 408%,hsla(145,100%,50%,1) 442%,hsla(119,100%,50%,1) 143%,hsla(119,100%,50%,1) 154%,hsla(151,100%,50%,1) 238%,hsla(151,100%,50%,1) 255%,hsla(65,100%,50%,1) 825%,hsla(65,100%,50%,1) 880%,hsla(175,100%,50%,1) 384%,hsla(175,100%,50%,1) 408%,hsla(89,100%,50%,1) 221%,hsla(89,100%,50%,1) 234%,hsla(167,100%,50%,1) 918%,hsla(167,100%,50%,1) 969%,hsla(61,100%,50%,1) 475%,hsla(61,100%,50%,1) 500%,hsla(128,100%,50%,1) 940%,hsla(128,100%,50%,1) 987%); background: linear-gradient(30deg, #0f2, hsla(67,100%,50%,1) 0%,hsla(67,100%,50%,1) 31%,hsla(68,100%,50%,1) 18%,hsla(68,100%,50%,1) 36%,hsla(78,100%,50%,1) 118%,hsla(78,100%,50%,1) 177%,hsla(133,100%,50%,1) 48%,hsla(133,100%,50%,1) 64%,hsla(152,100%,50%,1) 108%,hsla(152,100%,50%,1) 135%,hsla(75,100%,50%,1) 145%,hsla(75,100%,50%,1) 174%,hsla(139,100%,50%,1) 216%,hsla(139,100%,50%,1) 252%,hsla(134,100%,50%,1) 301%,hsla(134,100%,50%,1) 344%,hsla(170,100%,50%,1) 112%,hsla(170,100%,50%,1) 126%,hsla(166,100%,50%,1) 378%,hsla(166,100%,50%,1) 420%,hsla(135,100%,50%,1) 230%,hsla(135,100%,50%,1) 253%,hsla(120,100%,50%,1) 286%,hsla(120,100%,50%,1) 312%,hsla(145,100%,50%,1) 408%,hsla(145,100%,50%,1) 442%,hsla(119,100%,50%,1) 143%,hsla(119,100%,50%,1) 154%,hsla(151,100%,50%,1) 238%,hsla(151,100%,50%,1) 255%,hsla(65,100%,50%,1) 825%,hsla(65,100%,50%,1) 880%,hsla(175,100%,50%,1) 384%,hsla(175,100%,50%,1) 408%,hsla(89,100%,50%,1) 221%,hsla(89,100%,50%,1) 234%,hsla(167,100%,50%,1) 918%,hsla(167,100%,50%,1) 969%,hsla(61,100%,50%,1) 475%,hsla(61,100%,50%,1) 500%,hsla(128,100%,50%,1) 940%,hsla(128,100%,50%,1) 987%); } 50% { background: -webkit-linear-gradient(165deg, #454a54, hsla(220,10%,30%,1) 5%,hsla(220,10%,32%,1) 5%,hsla(220,10%,32%,1) 10%,hsla(220,10%,34%,1) 10%,hsla(220,10%,34%,1) 15%,hsla(220,10%,36%,1) 15%,hsla(220,10%,36%,1) 20%,hsla(220,10%,38%,1) 20%,hsla(220,10%,38%,1) 25%,hsla(220,10%,40%,1) 25%,hsla(220,10%,40%,1) 30%,hsla(220,10%,42%,1) 30%,hsla(220,10%,42%,1) 35%,hsla(220,10%,44%,1) 35%,hsla(220,10%,44%,1) 40%,hsla(220,10%,46%,1) 40%,hsla(220,10%,46%,1) 45%,hsla(220,10%,48%,1) 45%,hsla(220,10%,48%,1) 50%,hsla(220,10%,50%,1) 50%,hsla(220,10%,50%,1) 55%,hsla(220,10%,52%,1) 55%,hsla(220,10%,52%,1) 60%,hsla(220,10%,54%,1) 60%,hsla(220,10%,54%,1) 65%,hsla(220,10%,56%,1) 65%,hsla(220,10%,56%,1) 70%,hsla(220,10%,58%,1) 70%,hsla(220,10%,58%,1) 75%,hsla(220,10%,60%,1) 75%,hsla(220,10%,60%,1) 80%,hsla(220,10%,62%,1) 80%,hsla(220,10%,62%,1) 85%,hsla(220,10%,64%,1) 85%,hsla(220,10%,64%,1) 90%,hsla(220,10%,66%,1) 90%,hsla(220,10%,66%,1) 95%,hsla(220,10%,68%,1) 95%,hsla(220,10%,68%,1) 100%,hsla(220,10%,70%,1) 100%,hsla(220,10%,70%,1) 105%,hsla(220,10%,72%,1) 105%); background: linear-gradient(-75deg, #454a54, hsla(220,10%,30%,1) 5%,hsla(220,10%,32%,1) 5%,hsla(220,10%,32%,1) 10%,hsla(220,10%,34%,1) 10%,hsla(220,10%,34%,1) 15%,hsla(220,10%,36%,1) 15%,hsla(220,10%,36%,1) 20%,hsla(220,10%,38%,1) 20%,hsla(220,10%,38%,1) 25%,hsla(220,10%,40%,1) 25%,hsla(220,10%,40%,1) 30%,hsla(220,10%,42%,1) 30%,hsla(220,10%,42%,1) 35%,hsla(220,10%,44%,1) 35%,hsla(220,10%,44%,1) 40%,hsla(220,10%,46%,1) 40%,hsla(220,10%,46%,1) 45%,hsla(220,10%,48%,1) 45%,hsla(220,10%,48%,1) 50%,hsla(220,10%,50%,1) 50%,hsla(220,10%,50%,1) 55%,hsla(220,10%,52%,1) 55%,hsla(220,10%,52%,1) 60%,hsla(220,10%,54%,1) 60%,hsla(220,10%,54%,1) 65%,hsla(220,10%,56%,1) 65%,hsla(220,10%,56%,1) 70%,hsla(220,10%,58%,1) 70%,hsla(220,10%,58%,1) 75%,hsla(220,10%,60%,1) 75%,hsla(220,10%,60%,1) 80%,hsla(220,10%,62%,1) 80%,hsla(220,10%,62%,1) 85%,hsla(220,10%,64%,1) 85%,hsla(220,10%,64%,1) 90%,hsla(220,10%,66%,1) 90%,hsla(220,10%,66%,1) 95%,hsla(220,10%,68%,1) 95%,hsla(220,10%,68%,1) 100%,hsla(220,10%,70%,1) 100%,hsla(220,10%,70%,1) 105%,hsla(220,10%,72%,1) 105%); } 55% { background: -webkit-linear-gradient(bottom, #ff0, hsla(60,100%,50%,1) 15%,hsla(60,100%,60%,1) 15%,hsla(60,100%,60%,1) 30%,hsla(60,100%,70%,1) 30%,hsla(60,100%,70%,1) 45%,hsla(60,100%,80%,1) 45%,hsla(60,100%,80%,1) 60%,hsla(60,100%,90%,1) 60%,hsla(60,100%,90%,1) 75%,hsla(60,100%,100%,1) 75%,hsla(60,100%,100%,1) 90%,hsla(60,100%,100%,1) 90%); background: linear-gradient(0deg, #ff0, hsla(60,100%,50%,1) 15%,hsla(60,100%,60%,1) 15%,hsla(60,100%,60%,1) 30%,hsla(60,100%,70%,1) 30%,hsla(60,100%,70%,1) 45%,hsla(60,100%,80%,1) 45%,hsla(60,100%,80%,1) 60%,hsla(60,100%,90%,1) 60%,hsla(60,100%,90%,1) 75%,hsla(60,100%,100%,1) 75%,hsla(60,100%,100%,1) 90%,hsla(60,100%,100%,1) 90%); } 60% { background: -webkit-linear-gradient(top, #00a6ff, hsla(2,100%,50%,1) 0%,hsla(2,100%,50%,1) 51%,hsla(205,100%,50%,1) 13%,hsla(205,100%,50%,1) 26%,hsla(44,100%,50%,1) 110%,hsla(44,100%,50%,1) 165%,hsla(281,100%,50%,1) 51%,hsla(281,100%,50%,1) 68%,hsla(111,100%,50%,1) 176%,hsla(111,100%,50%,1) 220%,hsla(99,100%,50%,1) 70%,hsla(99,100%,50%,1) 84%,hsla(38,100%,50%,1) 252%,hsla(38,100%,50%,1) 294%,hsla(141,100%,50%,1) 84%,hsla(141,100%,50%,1) 96%,hsla(258,100%,50%,1) 400%,hsla(258,100%,50%,1) 450%,hsla(50,100%,50%,1) 324%,hsla(50,100%,50%,1) 360%,hsla(146,100%,50%,1) 570%,hsla(146,100%,50%,1) 627%,hsla(312,100%,50%,1) 132%,hsla(312,100%,50%,1) 144%,hsla(186,100%,50%,1) 252%,hsla(186,100%,50%,1) 273%,hsla(20,100%,50%,1) 559%,hsla(20,100%,50%,1) 602%,hsla(103,100%,50%,1) 154%,hsla(103,100%,50%,1) 165%,hsla(201,100%,50%,1) 390%,hsla(201,100%,50%,1) 416%); background: linear-gradient(180deg, #00a6ff, hsla(2,100%,50%,1) 0%,hsla(2,100%,50%,1) 51%,hsla(205,100%,50%,1) 13%,hsla(205,100%,50%,1) 26%,hsla(44,100%,50%,1) 110%,hsla(44,100%,50%,1) 165%,hsla(281,100%,50%,1) 51%,hsla(281,100%,50%,1) 68%,hsla(111,100%,50%,1) 176%,hsla(111,100%,50%,1) 220%,hsla(99,100%,50%,1) 70%,hsla(99,100%,50%,1) 84%,hsla(38,100%,50%,1) 252%,hsla(38,100%,50%,1) 294%,hsla(141,100%,50%,1) 84%,hsla(141,100%,50%,1) 96%,hsla(258,100%,50%,1) 400%,hsla(258,100%,50%,1) 450%,hsla(50,100%,50%,1) 324%,hsla(50,100%,50%,1) 360%,hsla(146,100%,50%,1) 570%,hsla(146,100%,50%,1) 627%,hsla(312,100%,50%,1) 132%,hsla(312,100%,50%,1) 144%,hsla(186,100%,50%,1) 252%,hsla(186,100%,50%,1) 273%,hsla(20,100%,50%,1) 559%,hsla(20,100%,50%,1) 602%,hsla(103,100%,50%,1) 154%,hsla(103,100%,50%,1) 165%,hsla(201,100%,50%,1) 390%,hsla(201,100%,50%,1) 416%); } 65% { background: -webkit-linear-gradient(60deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); background: linear-gradient(30deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); } 70% { background: -webkit-linear-gradient(bottom, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); background: linear-gradient(0deg, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); } 75% { background: -webkit-linear-gradient(45deg, hsla(83,50%,98%,1) 0%,hsla(83,50%,98%,1) 15%,hsla(304,45%,78%,1) 15%,hsla(304,45%,78%,1) 30%,hsla(108,63%,42%,1) 30%,hsla(108,63%,42%,1) 45%,hsla(70,96%,48%,1) 45%,hsla(70,96%,48%,1) 60%,hsla(20,45%,55%,1) 60%,hsla(20,45%,55%,1) 75%,hsla(10,50%,66%,1) 75%,hsla(10,50%,66%,1) 90%,hsla(105,59%,83%,1) 90%,hsla(105,59%,83%,1) 105%,hsla(314,52%,50%,1) 105%,hsla(314,52%,50%,1) 120%); background: linear-gradient(45deg, hsla(83,50%,98%,1) 0%,hsla(83,50%,98%,1) 15%,hsla(304,45%,78%,1) 15%,hsla(304,45%,78%,1) 30%,hsla(108,63%,42%,1) 30%,hsla(108,63%,42%,1) 45%,hsla(70,96%,48%,1) 45%,hsla(70,96%,48%,1) 60%,hsla(20,45%,55%,1) 60%,hsla(20,45%,55%,1) 75%,hsla(10,50%,66%,1) 75%,hsla(10,50%,66%,1) 90%,hsla(105,59%,83%,1) 90%,hsla(105,59%,83%,1) 105%,hsla(314,52%,50%,1) 105%,hsla(314,52%,50%,1) 120%); } 80% { background: -webkit-linear-gradient(top, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); background: linear-gradient(180deg, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); } 85% { background: -webkit-linear-gradient(bottom, #f0f, hsla(300,100%,50%,1) 10%,hsla(300,100%,40%,1) 10%,hsla(300,100%,40%,1) 20%,hsla(300,100%,30%,1) 20%,hsla(300,100%,30%,1) 30%,hsla(300,100%,20%,1) 30%,hsla(300,100%,20%,1) 40%,hsla(300,100%,10%,1) 40%,hsla(300,100%,10%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); background: linear-gradient(0deg, #f0f, hsla(300,100%,50%,1) 10%,hsla(300,100%,40%,1) 10%,hsla(300,100%,40%,1) 20%,hsla(300,100%,30%,1) 20%,hsla(300,100%,30%,1) 30%,hsla(300,100%,20%,1) 30%,hsla(300,100%,20%,1) 40%,hsla(300,100%,10%,1) 40%,hsla(300,100%,10%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); } 90% { background: -webkit-linear-gradient(bottom, hsla(173,100%,66%,1) 0%,hsla(173,100%,66%,1) 10%,hsla(14,100%,75%,1) 10%,hsla(14,100%,75%,1) 20%,hsla(220,100%,72%,1) 20%,hsla(220,100%,72%,1) 30%); background: linear-gradient(0deg, hsla(173,100%,66%,1) 0%,hsla(173,100%,66%,1) 10%,hsla(14,100%,75%,1) 10%,hsla(14,100%,75%,1) 20%,hsla(220,100%,72%,1) 20%,hsla(220,100%,72%,1) 30%); } 95% { background: -webkit-linear-gradient(45deg, #f70, hsla(5,100%,50%,1) 0%,hsla(5,100%,50%,1) 13%,hsla(10,100%,50%,1) 37%,hsla(10,100%,50%,1) 74%,hsla(15,100%,50%,1) 102%,hsla(15,100%,50%,1) 153%,hsla(22,100%,50%,1) 132%,hsla(22,100%,50%,1) 176%,hsla(29,100%,50%,1) 68%,hsla(29,100%,50%,1) 85%,hsla(6,100%,50%,1) 220%,hsla(6,100%,50%,1) 264%,hsla(17,100%,50%,1) 294%,hsla(17,100%,50%,1) 343%,hsla(15,100%,50%,1) 238%,hsla(15,100%,50%,1) 272%,hsla(24,100%,50%,1) 408%,hsla(24,100%,50%,1) 459%,hsla(2,100%,50%,1) 360%,hsla(2,100%,50%,1) 400%,hsla(28,100%,50%,1) 240%,hsla(28,100%,50%,1) 264%); background: linear-gradient(45deg, #f70, hsla(5,100%,50%,1) 0%,hsla(5,100%,50%,1) 13%,hsla(10,100%,50%,1) 37%,hsla(10,100%,50%,1) 74%,hsla(15,100%,50%,1) 102%,hsla(15,100%,50%,1) 153%,hsla(22,100%,50%,1) 132%,hsla(22,100%,50%,1) 176%,hsla(29,100%,50%,1) 68%,hsla(29,100%,50%,1) 85%,hsla(6,100%,50%,1) 220%,hsla(6,100%,50%,1) 264%,hsla(17,100%,50%,1) 294%,hsla(17,100%,50%,1) 343%,hsla(15,100%,50%,1) 238%,hsla(15,100%,50%,1) 272%,hsla(24,100%,50%,1) 408%,hsla(24,100%,50%,1) 459%,hsla(2,100%,50%,1) 360%,hsla(2,100%,50%,1) 400%,hsla(28,100%,50%,1) 240%,hsla(28,100%,50%,1) 264%); }
}
@keyframes sky { 0 { background: -webkit-linear-gradient(#0f0, #0f0); background: linear-gradient(#0f0, #0f0); } 5% { background: -webkit-linear-gradient(#082b08, #082b08); background: linear-gradient(#082b08, #082b08); } 5% { background: -webkit-linear-gradient(bottom, #0ff, #f0f); background: linear-gradient(0deg, #0ff, #f0f); } 10% { background: -webkit-linear-gradient(290deg, #660053, hsla(293,100%,20%,1) 0%,hsla(293,100%,20%,1) 12%,hsla(196,100%,20%,1) 42%,hsla(196,100%,20%,1) 84%,hsla(89,100%,20%,1) 40%,hsla(89,100%,20%,1) 60%,hsla(63,100%,20%,1) 129%,hsla(63,100%,20%,1) 172%,hsla(87,100%,20%,1) 108%,hsla(87,100%,20%,1) 135%,hsla(284,100%,20%,1) 255%,hsla(284,100%,20%,1) 306%,hsla(257,100%,20%,1) 210%,hsla(257,100%,20%,1) 245%,hsla(268,100%,20%,1) 413%,hsla(268,100%,20%,1) 472%,hsla(234,100%,20%,1) 464%,hsla(234,100%,20%,1) 522%,hsla(199,100%,20%,1) 198%,hsla(199,100%,20%,1) 220%,hsla(311,100%,20%,1) 400%,hsla(311,100%,20%,1) 440%); background: linear-gradient(160deg, #660053, hsla(293,100%,20%,1) 0%,hsla(293,100%,20%,1) 12%,hsla(196,100%,20%,1) 42%,hsla(196,100%,20%,1) 84%,hsla(89,100%,20%,1) 40%,hsla(89,100%,20%,1) 60%,hsla(63,100%,20%,1) 129%,hsla(63,100%,20%,1) 172%,hsla(87,100%,20%,1) 108%,hsla(87,100%,20%,1) 135%,hsla(284,100%,20%,1) 255%,hsla(284,100%,20%,1) 306%,hsla(257,100%,20%,1) 210%,hsla(257,100%,20%,1) 245%,hsla(268,100%,20%,1) 413%,hsla(268,100%,20%,1) 472%,hsla(234,100%,20%,1) 464%,hsla(234,100%,20%,1) 522%,hsla(199,100%,20%,1) 198%,hsla(199,100%,20%,1) 220%,hsla(311,100%,20%,1) 400%,hsla(311,100%,20%,1) 440%); } 15% { background: -webkit-linear-gradient(bottom, #204060, hsla(210,50%,25%,1) 25%,hsla(210,50%,20%,1) 25%,hsla(210,50%,20%,1) 50%,hsla(210,50%,15%,1) 50%,hsla(210,50%,15%,1) 75%,hsla(210,50%,10%,1) 75%,hsla(210,50%,10%,1) 100%,hsla(210,50%,5%,1) 100%,hsla(210,50%,5%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); background: linear-gradient(0deg, #204060, hsla(210,50%,25%,1) 25%,hsla(210,50%,20%,1) 25%,hsla(210,50%,20%,1) 50%,hsla(210,50%,15%,1) 50%,hsla(210,50%,15%,1) 75%,hsla(210,50%,10%,1) 75%,hsla(210,50%,10%,1) 100%,hsla(210,50%,5%,1) 100%,hsla(210,50%,5%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); } 20% { background: -webkit-linear-gradient(bottom, #602035, hsla(340,50%,25%,1) 25%,hsla(340,50%,15%,1) 25%,hsla(340,50%,15%,1) 50%,hsla(340,50%,5%,1) 50%,hsla(340,50%,5%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); background: linear-gradient(0deg, #602035, hsla(340,50%,25%,1) 25%,hsla(340,50%,15%,1) 25%,hsla(340,50%,15%,1) 50%,hsla(340,50%,5%,1) 50%,hsla(340,50%,5%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); } 25% { background: -webkit-linear-gradient(45deg, #08ff00, hsla(281,100%,50%,1) 0%,hsla(281,100%,50%,1) 16%,hsla(246,100%,50%,1) 59%,hsla(246,100%,50%,1) 118%,hsla(198,100%,50%,1) 98%,hsla(198,100%,50%,1) 147%,hsla(188,100%,50%,1) 108%,hsla(188,100%,50%,1) 144%,hsla(273,100%,50%,1) 60%,hsla(273,100%,50%,1) 75%,hsla(328,100%,50%,1) 145%,hsla(328,100%,50%,1) 174%,hsla(67,100%,50%,1) 300%,hsla(67,100%,50%,1) 350%,hsla(163,100%,50%,1) 189%,hsla(163,100%,50%,1) 216%,hsla(188,100%,50%,1) 240%,hsla(188,100%,50%,1) 270%,hsla(269,100%,50%,1) 261%,hsla(269,100%,50%,1) 290%,hsla(307,100%,50%,1) 440%,hsla(307,100%,50%,1) 484%,hsla(302,100%,50%,1) 528%,hsla(302,100%,50%,1) 576%,hsla(240,100%,50%,1) 552%,hsla(240,100%,50%,1) 598%,hsla(62,100%,50%,1) 312%,hsla(62,100%,50%,1) 336%,hsla(107,100%,50%,1) 280%,hsla(107,100%,50%,1) 300%,hsla(351,100%,50%,1) 315%,hsla(351,100%,50%,1) 336%,hsla(126,100%,50%,1) 256%,hsla(126,100%,50%,1) 272%,hsla(359,100%,50%,1) 442%,hsla(359,100%,50%,1) 468%,hsla(281,100%,50%,1) 612%,hsla(281,100%,50%,1) 646%,hsla(60,100%,50%,1) 1083%,hsla(60,100%,50%,1) 1140%,hsla(118,100%,50%,1) 440%,hsla(118,100%,50%,1) 462%); background: linear-gradient(45deg, #08ff00, hsla(281,100%,50%,1) 0%,hsla(281,100%,50%,1) 16%,hsla(246,100%,50%,1) 59%,hsla(246,100%,50%,1) 118%,hsla(198,100%,50%,1) 98%,hsla(198,100%,50%,1) 147%,hsla(188,100%,50%,1) 108%,hsla(188,100%,50%,1) 144%,hsla(273,100%,50%,1) 60%,hsla(273,100%,50%,1) 75%,hsla(328,100%,50%,1) 145%,hsla(328,100%,50%,1) 174%,hsla(67,100%,50%,1) 300%,hsla(67,100%,50%,1) 350%,hsla(163,100%,50%,1) 189%,hsla(163,100%,50%,1) 216%,hsla(188,100%,50%,1) 240%,hsla(188,100%,50%,1) 270%,hsla(269,100%,50%,1) 261%,hsla(269,100%,50%,1) 290%,hsla(307,100%,50%,1) 440%,hsla(307,100%,50%,1) 484%,hsla(302,100%,50%,1) 528%,hsla(302,100%,50%,1) 576%,hsla(240,100%,50%,1) 552%,hsla(240,100%,50%,1) 598%,hsla(62,100%,50%,1) 312%,hsla(62,100%,50%,1) 336%,hsla(107,100%,50%,1) 280%,hsla(107,100%,50%,1) 300%,hsla(351,100%,50%,1) 315%,hsla(351,100%,50%,1) 336%,hsla(126,100%,50%,1) 256%,hsla(126,100%,50%,1) 272%,hsla(359,100%,50%,1) 442%,hsla(359,100%,50%,1) 468%,hsla(281,100%,50%,1) 612%,hsla(281,100%,50%,1) 646%,hsla(60,100%,50%,1) 1083%,hsla(60,100%,50%,1) 1140%,hsla(118,100%,50%,1) 440%,hsla(118,100%,50%,1) 462%); } 30% { background: -webkit-linear-gradient(top, #b3b3b3, hsla(300,0%,70%,1) 40%,hsla(300,0%,90%,1) 40%,hsla(300,0%,90%,1) 80%,hsla(300,0%,100%,1) 80%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); background: linear-gradient(180deg, #b3b3b3, hsla(300,0%,70%,1) 40%,hsla(300,0%,90%,1) 40%,hsla(300,0%,90%,1) 80%,hsla(300,0%,100%,1) 80%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); } 35% { background: -webkit-linear-gradient(85deg, hsla(298,96%,47%,1) 0%,hsla(298,96%,47%,1) 10%,hsla(64,48%,44%,1) 10%,hsla(64,48%,44%,1) 20%,hsla(325,68%,50%,1) 20%,hsla(325,68%,50%,1) 30%); background: linear-gradient(5deg, hsla(298,96%,47%,1) 0%,hsla(298,96%,47%,1) 10%,hsla(64,48%,44%,1) 10%,hsla(64,48%,44%,1) 20%,hsla(325,68%,50%,1) 20%,hsla(325,68%,50%,1) 30%); } 40% { background: -webkit-linear-gradient(top, #ff2b00, hsla(10,100%,50%,1) 50%,hsla(10,100%,60%,1) 50%,hsla(10,100%,60%,1) 100%,hsla(10,100%,70%,1) 100%); background: linear-gradient(180deg, #ff2b00, hsla(10,100%,50%,1) 50%,hsla(10,100%,60%,1) 50%,hsla(10,100%,60%,1) 100%,hsla(10,100%,70%,1) 100%); } 45% { background: -webkit-linear-gradient(60deg, #0f2, hsla(67,100%,50%,1) 0%,hsla(67,100%,50%,1) 31%,hsla(68,100%,50%,1) 18%,hsla(68,100%,50%,1) 36%,hsla(78,100%,50%,1) 118%,hsla(78,100%,50%,1) 177%,hsla(133,100%,50%,1) 48%,hsla(133,100%,50%,1) 64%,hsla(152,100%,50%,1) 108%,hsla(152,100%,50%,1) 135%,hsla(75,100%,50%,1) 145%,hsla(75,100%,50%,1) 174%,hsla(139,100%,50%,1) 216%,hsla(139,100%,50%,1) 252%,hsla(134,100%,50%,1) 301%,hsla(134,100%,50%,1) 344%,hsla(170,100%,50%,1) 112%,hsla(170,100%,50%,1) 126%,hsla(166,100%,50%,1) 378%,hsla(166,100%,50%,1) 420%,hsla(135,100%,50%,1) 230%,hsla(135,100%,50%,1) 253%,hsla(120,100%,50%,1) 286%,hsla(120,100%,50%,1) 312%,hsla(145,100%,50%,1) 408%,hsla(145,100%,50%,1) 442%,hsla(119,100%,50%,1) 143%,hsla(119,100%,50%,1) 154%,hsla(151,100%,50%,1) 238%,hsla(151,100%,50%,1) 255%,hsla(65,100%,50%,1) 825%,hsla(65,100%,50%,1) 880%,hsla(175,100%,50%,1) 384%,hsla(175,100%,50%,1) 408%,hsla(89,100%,50%,1) 221%,hsla(89,100%,50%,1) 234%,hsla(167,100%,50%,1) 918%,hsla(167,100%,50%,1) 969%,hsla(61,100%,50%,1) 475%,hsla(61,100%,50%,1) 500%,hsla(128,100%,50%,1) 940%,hsla(128,100%,50%,1) 987%); background: linear-gradient(30deg, #0f2, hsla(67,100%,50%,1) 0%,hsla(67,100%,50%,1) 31%,hsla(68,100%,50%,1) 18%,hsla(68,100%,50%,1) 36%,hsla(78,100%,50%,1) 118%,hsla(78,100%,50%,1) 177%,hsla(133,100%,50%,1) 48%,hsla(133,100%,50%,1) 64%,hsla(152,100%,50%,1) 108%,hsla(152,100%,50%,1) 135%,hsla(75,100%,50%,1) 145%,hsla(75,100%,50%,1) 174%,hsla(139,100%,50%,1) 216%,hsla(139,100%,50%,1) 252%,hsla(134,100%,50%,1) 301%,hsla(134,100%,50%,1) 344%,hsla(170,100%,50%,1) 112%,hsla(170,100%,50%,1) 126%,hsla(166,100%,50%,1) 378%,hsla(166,100%,50%,1) 420%,hsla(135,100%,50%,1) 230%,hsla(135,100%,50%,1) 253%,hsla(120,100%,50%,1) 286%,hsla(120,100%,50%,1) 312%,hsla(145,100%,50%,1) 408%,hsla(145,100%,50%,1) 442%,hsla(119,100%,50%,1) 143%,hsla(119,100%,50%,1) 154%,hsla(151,100%,50%,1) 238%,hsla(151,100%,50%,1) 255%,hsla(65,100%,50%,1) 825%,hsla(65,100%,50%,1) 880%,hsla(175,100%,50%,1) 384%,hsla(175,100%,50%,1) 408%,hsla(89,100%,50%,1) 221%,hsla(89,100%,50%,1) 234%,hsla(167,100%,50%,1) 918%,hsla(167,100%,50%,1) 969%,hsla(61,100%,50%,1) 475%,hsla(61,100%,50%,1) 500%,hsla(128,100%,50%,1) 940%,hsla(128,100%,50%,1) 987%); } 50% { background: -webkit-linear-gradient(165deg, #454a54, hsla(220,10%,30%,1) 5%,hsla(220,10%,32%,1) 5%,hsla(220,10%,32%,1) 10%,hsla(220,10%,34%,1) 10%,hsla(220,10%,34%,1) 15%,hsla(220,10%,36%,1) 15%,hsla(220,10%,36%,1) 20%,hsla(220,10%,38%,1) 20%,hsla(220,10%,38%,1) 25%,hsla(220,10%,40%,1) 25%,hsla(220,10%,40%,1) 30%,hsla(220,10%,42%,1) 30%,hsla(220,10%,42%,1) 35%,hsla(220,10%,44%,1) 35%,hsla(220,10%,44%,1) 40%,hsla(220,10%,46%,1) 40%,hsla(220,10%,46%,1) 45%,hsla(220,10%,48%,1) 45%,hsla(220,10%,48%,1) 50%,hsla(220,10%,50%,1) 50%,hsla(220,10%,50%,1) 55%,hsla(220,10%,52%,1) 55%,hsla(220,10%,52%,1) 60%,hsla(220,10%,54%,1) 60%,hsla(220,10%,54%,1) 65%,hsla(220,10%,56%,1) 65%,hsla(220,10%,56%,1) 70%,hsla(220,10%,58%,1) 70%,hsla(220,10%,58%,1) 75%,hsla(220,10%,60%,1) 75%,hsla(220,10%,60%,1) 80%,hsla(220,10%,62%,1) 80%,hsla(220,10%,62%,1) 85%,hsla(220,10%,64%,1) 85%,hsla(220,10%,64%,1) 90%,hsla(220,10%,66%,1) 90%,hsla(220,10%,66%,1) 95%,hsla(220,10%,68%,1) 95%,hsla(220,10%,68%,1) 100%,hsla(220,10%,70%,1) 100%,hsla(220,10%,70%,1) 105%,hsla(220,10%,72%,1) 105%); background: linear-gradient(-75deg, #454a54, hsla(220,10%,30%,1) 5%,hsla(220,10%,32%,1) 5%,hsla(220,10%,32%,1) 10%,hsla(220,10%,34%,1) 10%,hsla(220,10%,34%,1) 15%,hsla(220,10%,36%,1) 15%,hsla(220,10%,36%,1) 20%,hsla(220,10%,38%,1) 20%,hsla(220,10%,38%,1) 25%,hsla(220,10%,40%,1) 25%,hsla(220,10%,40%,1) 30%,hsla(220,10%,42%,1) 30%,hsla(220,10%,42%,1) 35%,hsla(220,10%,44%,1) 35%,hsla(220,10%,44%,1) 40%,hsla(220,10%,46%,1) 40%,hsla(220,10%,46%,1) 45%,hsla(220,10%,48%,1) 45%,hsla(220,10%,48%,1) 50%,hsla(220,10%,50%,1) 50%,hsla(220,10%,50%,1) 55%,hsla(220,10%,52%,1) 55%,hsla(220,10%,52%,1) 60%,hsla(220,10%,54%,1) 60%,hsla(220,10%,54%,1) 65%,hsla(220,10%,56%,1) 65%,hsla(220,10%,56%,1) 70%,hsla(220,10%,58%,1) 70%,hsla(220,10%,58%,1) 75%,hsla(220,10%,60%,1) 75%,hsla(220,10%,60%,1) 80%,hsla(220,10%,62%,1) 80%,hsla(220,10%,62%,1) 85%,hsla(220,10%,64%,1) 85%,hsla(220,10%,64%,1) 90%,hsla(220,10%,66%,1) 90%,hsla(220,10%,66%,1) 95%,hsla(220,10%,68%,1) 95%,hsla(220,10%,68%,1) 100%,hsla(220,10%,70%,1) 100%,hsla(220,10%,70%,1) 105%,hsla(220,10%,72%,1) 105%); } 55% { background: -webkit-linear-gradient(bottom, #ff0, hsla(60,100%,50%,1) 15%,hsla(60,100%,60%,1) 15%,hsla(60,100%,60%,1) 30%,hsla(60,100%,70%,1) 30%,hsla(60,100%,70%,1) 45%,hsla(60,100%,80%,1) 45%,hsla(60,100%,80%,1) 60%,hsla(60,100%,90%,1) 60%,hsla(60,100%,90%,1) 75%,hsla(60,100%,100%,1) 75%,hsla(60,100%,100%,1) 90%,hsla(60,100%,100%,1) 90%); background: linear-gradient(0deg, #ff0, hsla(60,100%,50%,1) 15%,hsla(60,100%,60%,1) 15%,hsla(60,100%,60%,1) 30%,hsla(60,100%,70%,1) 30%,hsla(60,100%,70%,1) 45%,hsla(60,100%,80%,1) 45%,hsla(60,100%,80%,1) 60%,hsla(60,100%,90%,1) 60%,hsla(60,100%,90%,1) 75%,hsla(60,100%,100%,1) 75%,hsla(60,100%,100%,1) 90%,hsla(60,100%,100%,1) 90%); } 60% { background: -webkit-linear-gradient(top, #00a6ff, hsla(2,100%,50%,1) 0%,hsla(2,100%,50%,1) 51%,hsla(205,100%,50%,1) 13%,hsla(205,100%,50%,1) 26%,hsla(44,100%,50%,1) 110%,hsla(44,100%,50%,1) 165%,hsla(281,100%,50%,1) 51%,hsla(281,100%,50%,1) 68%,hsla(111,100%,50%,1) 176%,hsla(111,100%,50%,1) 220%,hsla(99,100%,50%,1) 70%,hsla(99,100%,50%,1) 84%,hsla(38,100%,50%,1) 252%,hsla(38,100%,50%,1) 294%,hsla(141,100%,50%,1) 84%,hsla(141,100%,50%,1) 96%,hsla(258,100%,50%,1) 400%,hsla(258,100%,50%,1) 450%,hsla(50,100%,50%,1) 324%,hsla(50,100%,50%,1) 360%,hsla(146,100%,50%,1) 570%,hsla(146,100%,50%,1) 627%,hsla(312,100%,50%,1) 132%,hsla(312,100%,50%,1) 144%,hsla(186,100%,50%,1) 252%,hsla(186,100%,50%,1) 273%,hsla(20,100%,50%,1) 559%,hsla(20,100%,50%,1) 602%,hsla(103,100%,50%,1) 154%,hsla(103,100%,50%,1) 165%,hsla(201,100%,50%,1) 390%,hsla(201,100%,50%,1) 416%); background: linear-gradient(180deg, #00a6ff, hsla(2,100%,50%,1) 0%,hsla(2,100%,50%,1) 51%,hsla(205,100%,50%,1) 13%,hsla(205,100%,50%,1) 26%,hsla(44,100%,50%,1) 110%,hsla(44,100%,50%,1) 165%,hsla(281,100%,50%,1) 51%,hsla(281,100%,50%,1) 68%,hsla(111,100%,50%,1) 176%,hsla(111,100%,50%,1) 220%,hsla(99,100%,50%,1) 70%,hsla(99,100%,50%,1) 84%,hsla(38,100%,50%,1) 252%,hsla(38,100%,50%,1) 294%,hsla(141,100%,50%,1) 84%,hsla(141,100%,50%,1) 96%,hsla(258,100%,50%,1) 400%,hsla(258,100%,50%,1) 450%,hsla(50,100%,50%,1) 324%,hsla(50,100%,50%,1) 360%,hsla(146,100%,50%,1) 570%,hsla(146,100%,50%,1) 627%,hsla(312,100%,50%,1) 132%,hsla(312,100%,50%,1) 144%,hsla(186,100%,50%,1) 252%,hsla(186,100%,50%,1) 273%,hsla(20,100%,50%,1) 559%,hsla(20,100%,50%,1) 602%,hsla(103,100%,50%,1) 154%,hsla(103,100%,50%,1) 165%,hsla(201,100%,50%,1) 390%,hsla(201,100%,50%,1) 416%); } 65% { background: -webkit-linear-gradient(60deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); background: linear-gradient(30deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); } 70% { background: -webkit-linear-gradient(bottom, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); background: linear-gradient(0deg, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); } 75% { background: -webkit-linear-gradient(45deg, hsla(83,50%,98%,1) 0%,hsla(83,50%,98%,1) 15%,hsla(304,45%,78%,1) 15%,hsla(304,45%,78%,1) 30%,hsla(108,63%,42%,1) 30%,hsla(108,63%,42%,1) 45%,hsla(70,96%,48%,1) 45%,hsla(70,96%,48%,1) 60%,hsla(20,45%,55%,1) 60%,hsla(20,45%,55%,1) 75%,hsla(10,50%,66%,1) 75%,hsla(10,50%,66%,1) 90%,hsla(105,59%,83%,1) 90%,hsla(105,59%,83%,1) 105%,hsla(314,52%,50%,1) 105%,hsla(314,52%,50%,1) 120%); background: linear-gradient(45deg, hsla(83,50%,98%,1) 0%,hsla(83,50%,98%,1) 15%,hsla(304,45%,78%,1) 15%,hsla(304,45%,78%,1) 30%,hsla(108,63%,42%,1) 30%,hsla(108,63%,42%,1) 45%,hsla(70,96%,48%,1) 45%,hsla(70,96%,48%,1) 60%,hsla(20,45%,55%,1) 60%,hsla(20,45%,55%,1) 75%,hsla(10,50%,66%,1) 75%,hsla(10,50%,66%,1) 90%,hsla(105,59%,83%,1) 90%,hsla(105,59%,83%,1) 105%,hsla(314,52%,50%,1) 105%,hsla(314,52%,50%,1) 120%); } 80% { background: -webkit-linear-gradient(top, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); background: linear-gradient(180deg, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); } 85% { background: -webkit-linear-gradient(bottom, #f0f, hsla(300,100%,50%,1) 10%,hsla(300,100%,40%,1) 10%,hsla(300,100%,40%,1) 20%,hsla(300,100%,30%,1) 20%,hsla(300,100%,30%,1) 30%,hsla(300,100%,20%,1) 30%,hsla(300,100%,20%,1) 40%,hsla(300,100%,10%,1) 40%,hsla(300,100%,10%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); background: linear-gradient(0deg, #f0f, hsla(300,100%,50%,1) 10%,hsla(300,100%,40%,1) 10%,hsla(300,100%,40%,1) 20%,hsla(300,100%,30%,1) 20%,hsla(300,100%,30%,1) 30%,hsla(300,100%,20%,1) 30%,hsla(300,100%,20%,1) 40%,hsla(300,100%,10%,1) 40%,hsla(300,100%,10%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); } 90% { background: -webkit-linear-gradient(bottom, hsla(173,100%,66%,1) 0%,hsla(173,100%,66%,1) 10%,hsla(14,100%,75%,1) 10%,hsla(14,100%,75%,1) 20%,hsla(220,100%,72%,1) 20%,hsla(220,100%,72%,1) 30%); background: linear-gradient(0deg, hsla(173,100%,66%,1) 0%,hsla(173,100%,66%,1) 10%,hsla(14,100%,75%,1) 10%,hsla(14,100%,75%,1) 20%,hsla(220,100%,72%,1) 20%,hsla(220,100%,72%,1) 30%); } 95% { background: -webkit-linear-gradient(45deg, #f70, hsla(5,100%,50%,1) 0%,hsla(5,100%,50%,1) 13%,hsla(10,100%,50%,1) 37%,hsla(10,100%,50%,1) 74%,hsla(15,100%,50%,1) 102%,hsla(15,100%,50%,1) 153%,hsla(22,100%,50%,1) 132%,hsla(22,100%,50%,1) 176%,hsla(29,100%,50%,1) 68%,hsla(29,100%,50%,1) 85%,hsla(6,100%,50%,1) 220%,hsla(6,100%,50%,1) 264%,hsla(17,100%,50%,1) 294%,hsla(17,100%,50%,1) 343%,hsla(15,100%,50%,1) 238%,hsla(15,100%,50%,1) 272%,hsla(24,100%,50%,1) 408%,hsla(24,100%,50%,1) 459%,hsla(2,100%,50%,1) 360%,hsla(2,100%,50%,1) 400%,hsla(28,100%,50%,1) 240%,hsla(28,100%,50%,1) 264%); background: linear-gradient(45deg, #f70, hsla(5,100%,50%,1) 0%,hsla(5,100%,50%,1) 13%,hsla(10,100%,50%,1) 37%,hsla(10,100%,50%,1) 74%,hsla(15,100%,50%,1) 102%,hsla(15,100%,50%,1) 153%,hsla(22,100%,50%,1) 132%,hsla(22,100%,50%,1) 176%,hsla(29,100%,50%,1) 68%,hsla(29,100%,50%,1) 85%,hsla(6,100%,50%,1) 220%,hsla(6,100%,50%,1) 264%,hsla(17,100%,50%,1) 294%,hsla(17,100%,50%,1) 343%,hsla(15,100%,50%,1) 238%,hsla(15,100%,50%,1) 272%,hsla(24,100%,50%,1) 408%,hsla(24,100%,50%,1) 459%,hsla(2,100%,50%,1) 360%,hsla(2,100%,50%,1) 400%,hsla(28,100%,50%,1) 240%,hsla(28,100%,50%,1) 264%); }
}
@-webkit-keyframes ground { 0 { background: -webkit-linear-gradient(#0f0, #0f0); background: linear-gradient(#0f0, #0f0); } 5% { background: -webkit-linear-gradient(#082b08, #082b08); background: linear-gradient(#082b08, #082b08); } 10% { background: -webkit-linear-gradient(290deg, #24423b, hsla(327,30%,20%,1) 0%,hsla(327,30%,20%,1) 21%,hsla(4,30%,20%,1) 41%,hsla(4,30%,20%,1) 82%,hsla(203,30%,20%,1) 110%,hsla(203,30%,20%,1) 165%,hsla(5,30%,20%,1) 126%,hsla(5,30%,20%,1) 168%,hsla(326,30%,20%,1) 100%,hsla(326,30%,20%,1) 125%,hsla(287,30%,20%,1) 220%,hsla(287,30%,20%,1) 264%,hsla(347,30%,20%,1) 84%,hsla(347,30%,20%,1) 98%,hsla(65,30%,20%,1) 406%,hsla(65,30%,20%,1) 464%,hsla(75,30%,20%,1) 448%,hsla(75,30%,20%,1) 504%,hsla(35,30%,20%,1) 270%,hsla(35,30%,20%,1) 300%,hsla(166,30%,20%,1) 130%,hsla(166,30%,20%,1) 143%); background: linear-gradient(160deg, #24423b, hsla(327,30%,20%,1) 0%,hsla(327,30%,20%,1) 21%,hsla(4,30%,20%,1) 41%,hsla(4,30%,20%,1) 82%,hsla(203,30%,20%,1) 110%,hsla(203,30%,20%,1) 165%,hsla(5,30%,20%,1) 126%,hsla(5,30%,20%,1) 168%,hsla(326,30%,20%,1) 100%,hsla(326,30%,20%,1) 125%,hsla(287,30%,20%,1) 220%,hsla(287,30%,20%,1) 264%,hsla(347,30%,20%,1) 84%,hsla(347,30%,20%,1) 98%,hsla(65,30%,20%,1) 406%,hsla(65,30%,20%,1) 464%,hsla(75,30%,20%,1) 448%,hsla(75,30%,20%,1) 504%,hsla(35,30%,20%,1) 270%,hsla(35,30%,20%,1) 300%,hsla(166,30%,20%,1) 130%,hsla(166,30%,20%,1) 143%); } 15% { background: -webkit-linear-gradient(bottom, #132639, hsla(210,50%,15%,1) 25%,hsla(210,50%,10%,1) 25%,hsla(210,50%,10%,1) 50%,hsla(210,50%,5%,1) 50%,hsla(210,50%,5%,1) 75%,hsla(210,50%,0%,1) 75%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); background: linear-gradient(0deg, #132639, hsla(210,50%,15%,1) 25%,hsla(210,50%,10%,1) 25%,hsla(210,50%,10%,1) 50%,hsla(210,50%,5%,1) 50%,hsla(210,50%,5%,1) 75%,hsla(210,50%,0%,1) 75%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); } 20% { background: -webkit-linear-gradient(bottom, #4d192a, hsla(340,50%,20%,1) 25%,hsla(340,50%,10%,1) 25%,hsla(340,50%,10%,1) 50%,hsla(340,50%,0%,1) 50%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); background: linear-gradient(0deg, #4d192a, hsla(340,50%,20%,1) 25%,hsla(340,50%,10%,1) 25%,hsla(340,50%,10%,1) 50%,hsla(340,50%,0%,1) 50%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); } 25% { background: -webkit-linear-gradient(45deg, #33c2cc, hsla(96,60%,50%,1) 0%,hsla(96,60%,50%,1) 34%,hsla(62,60%,50%,1) 49%,hsla(62,60%,50%,1) 98%,hsla(113,60%,50%,1) 88%,hsla(113,60%,50%,1) 132%,hsla(70,60%,50%,1) 75%,hsla(70,60%,50%,1) 100%,hsla(99,60%,50%,1) 184%,hsla(99,60%,50%,1) 230%,hsla(199,60%,50%,1) 235%,hsla(199,60%,50%,1) 282%,hsla(88,60%,50%,1) 234%,hsla(88,60%,50%,1) 273%,hsla(222,60%,50%,1) 329%,hsla(222,60%,50%,1) 376%,hsla(75,60%,50%,1) 312%,hsla(75,60%,50%,1) 351%,hsla(130,60%,50%,1) 342%,hsla(130,60%,50%,1) 380%,hsla(127,60%,50%,1) 140%,hsla(127,60%,50%,1) 154%,hsla(155,60%,50%,1) 561%,hsla(155,60%,50%,1) 612%,hsla(257,60%,50%,1) 240%,hsla(257,60%,50%,1) 260%,hsla(222,60%,50%,1) 273%,hsla(222,60%,50%,1) 294%,hsla(169,60%,50%,1) 770%,hsla(169,60%,50%,1) 825%,hsla(114,60%,50%,1) 465%,hsla(114,60%,50%,1) 496%,hsla(62,60%,50%,1) 752%,hsla(62,60%,50%,1) 799%,hsla(147,60%,50%,1) 646%,hsla(147,60%,50%,1) 684%,hsla(212,60%,50%,1) 288%,hsla(212,60%,50%,1) 304%,hsla(81,60%,50%,1) 456%,hsla(81,60%,50%,1) 480%,hsla(184,60%,50%,1) 260%,hsla(184,60%,50%,1) 273%); background: linear-gradient(45deg, #33c2cc, hsla(96,60%,50%,1) 0%,hsla(96,60%,50%,1) 34%,hsla(62,60%,50%,1) 49%,hsla(62,60%,50%,1) 98%,hsla(113,60%,50%,1) 88%,hsla(113,60%,50%,1) 132%,hsla(70,60%,50%,1) 75%,hsla(70,60%,50%,1) 100%,hsla(99,60%,50%,1) 184%,hsla(99,60%,50%,1) 230%,hsla(199,60%,50%,1) 235%,hsla(199,60%,50%,1) 282%,hsla(88,60%,50%,1) 234%,hsla(88,60%,50%,1) 273%,hsla(222,60%,50%,1) 329%,hsla(222,60%,50%,1) 376%,hsla(75,60%,50%,1) 312%,hsla(75,60%,50%,1) 351%,hsla(130,60%,50%,1) 342%,hsla(130,60%,50%,1) 380%,hsla(127,60%,50%,1) 140%,hsla(127,60%,50%,1) 154%,hsla(155,60%,50%,1) 561%,hsla(155,60%,50%,1) 612%,hsla(257,60%,50%,1) 240%,hsla(257,60%,50%,1) 260%,hsla(222,60%,50%,1) 273%,hsla(222,60%,50%,1) 294%,hsla(169,60%,50%,1) 770%,hsla(169,60%,50%,1) 825%,hsla(114,60%,50%,1) 465%,hsla(114,60%,50%,1) 496%,hsla(62,60%,50%,1) 752%,hsla(62,60%,50%,1) 799%,hsla(147,60%,50%,1) 646%,hsla(147,60%,50%,1) 684%,hsla(212,60%,50%,1) 288%,hsla(212,60%,50%,1) 304%,hsla(81,60%,50%,1) 456%,hsla(81,60%,50%,1) 480%,hsla(184,60%,50%,1) 260%,hsla(184,60%,50%,1) 273%); } 30% { background: -webkit-linear-gradient(top, #808080, hsla(300,0%,50%,1) 40%,hsla(300,0%,70%,1) 40%,hsla(300,0%,70%,1) 80%,hsla(300,0%,90%,1) 80%,hsla(300,0%,90%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); background: linear-gradient(180deg, #808080, hsla(300,0%,50%,1) 40%,hsla(300,0%,70%,1) 40%,hsla(300,0%,70%,1) 80%,hsla(300,0%,90%,1) 80%,hsla(300,0%,90%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); } 35% { background: -webkit-linear-gradient(85deg, hsla(98,52%,34%,1) 0%,hsla(98,52%,34%,1) 10%,hsla(278,58%,41%,1) 10%,hsla(278,58%,41%,1) 20%,hsla(141,70%,83%,1) 20%,hsla(141,70%,83%,1) 30%); background: linear-gradient(5deg, hsla(98,52%,34%,1) 0%,hsla(98,52%,34%,1) 10%,hsla(278,58%,41%,1) 10%,hsla(278,58%,41%,1) 20%,hsla(141,70%,83%,1) 20%,hsla(141,70%,83%,1) 30%); } 40% { background: -webkit-linear-gradient(top, #c20, hsla(10,100%,40%,1) 50%,hsla(10,100%,50%,1) 50%,hsla(10,100%,50%,1) 100%,hsla(10,100%,60%,1) 100%); background: linear-gradient(180deg, #c20, hsla(10,100%,40%,1) 50%,hsla(10,100%,50%,1) 50%,hsla(10,100%,50%,1) 100%,hsla(10,100%,60%,1) 100%); } 45% { background: -webkit-linear-gradient(60deg, #dbf20d, hsla(133,90%,50%,1) 0%,hsla(133,90%,50%,1) 14%,hsla(76,90%,50%,1) 27%,hsla(76,90%,50%,1) 54%,hsla(72,90%,50%,1) 32%,hsla(72,90%,50%,1) 48%,hsla(116,90%,50%,1) 84%,hsla(116,90%,50%,1) 112%,hsla(118,90%,50%,1) 188%,hsla(118,90%,50%,1) 235%,hsla(62,90%,50%,1) 225%,hsla(62,90%,50%,1) 270%,hsla(122,90%,50%,1) 192%,hsla(122,90%,50%,1) 224%,hsla(179,90%,50%,1) 140%,hsla(179,90%,50%,1) 160%,hsla(153,90%,50%,1) 392%,hsla(153,90%,50%,1) 441%,hsla(151,90%,50%,1) 207%,hsla(151,90%,50%,1) 230%,hsla(133,90%,50%,1) 530%,hsla(133,90%,50%,1) 583%,hsla(138,90%,50%,1) 121%,hsla(138,90%,50%,1) 132%,hsla(93,90%,50%,1) 276%,hsla(93,90%,50%,1) 299%,hsla(130,90%,50%,1) 676%,hsla(130,90%,50%,1) 728%,hsla(63,90%,50%,1) 350%,hsla(63,90%,50%,1) 375%,hsla(145,90%,50%,1) 840%,hsla(145,90%,50%,1) 896%,hsla(121,90%,50%,1) 320%,hsla(121,90%,50%,1) 340%,hsla(144,90%,50%,1) 510%,hsla(144,90%,50%,1) 540%,hsla(94,90%,50%,1) 810%,hsla(94,90%,50%,1) 855%,hsla(172,90%,50%,1) 1045%,hsla(172,90%,50%,1) 1100%,hsla(66,90%,50%,1) 460%,hsla(66,90%,50%,1) 483%); background: linear-gradient(30deg, #dbf20d, hsla(133,90%,50%,1) 0%,hsla(133,90%,50%,1) 14%,hsla(76,90%,50%,1) 27%,hsla(76,90%,50%,1) 54%,hsla(72,90%,50%,1) 32%,hsla(72,90%,50%,1) 48%,hsla(116,90%,50%,1) 84%,hsla(116,90%,50%,1) 112%,hsla(118,90%,50%,1) 188%,hsla(118,90%,50%,1) 235%,hsla(62,90%,50%,1) 225%,hsla(62,90%,50%,1) 270%,hsla(122,90%,50%,1) 192%,hsla(122,90%,50%,1) 224%,hsla(179,90%,50%,1) 140%,hsla(179,90%,50%,1) 160%,hsla(153,90%,50%,1) 392%,hsla(153,90%,50%,1) 441%,hsla(151,90%,50%,1) 207%,hsla(151,90%,50%,1) 230%,hsla(133,90%,50%,1) 530%,hsla(133,90%,50%,1) 583%,hsla(138,90%,50%,1) 121%,hsla(138,90%,50%,1) 132%,hsla(93,90%,50%,1) 276%,hsla(93,90%,50%,1) 299%,hsla(130,90%,50%,1) 676%,hsla(130,90%,50%,1) 728%,hsla(63,90%,50%,1) 350%,hsla(63,90%,50%,1) 375%,hsla(145,90%,50%,1) 840%,hsla(145,90%,50%,1) 896%,hsla(121,90%,50%,1) 320%,hsla(121,90%,50%,1) 340%,hsla(144,90%,50%,1) 510%,hsla(144,90%,50%,1) 540%,hsla(94,90%,50%,1) 810%,hsla(94,90%,50%,1) 855%,hsla(172,90%,50%,1) 1045%,hsla(172,90%,50%,1) 1100%,hsla(66,90%,50%,1) 460%,hsla(66,90%,50%,1) 483%); } 50% { background: -webkit-linear-gradient(165deg, #2e3138, hsla(220,10%,20%,1) 5%,hsla(220,10%,22%,1) 5%,hsla(220,10%,22%,1) 10%,hsla(220,10%,24%,1) 10%,hsla(220,10%,24%,1) 15%,hsla(220,10%,26%,1) 15%,hsla(220,10%,26%,1) 20%,hsla(220,10%,28%,1) 20%,hsla(220,10%,28%,1) 25%,hsla(220,10%,30%,1) 25%,hsla(220,10%,30%,1) 30%,hsla(220,10%,32%,1) 30%,hsla(220,10%,32%,1) 35%,hsla(220,10%,34%,1) 35%,hsla(220,10%,34%,1) 40%,hsla(220,10%,36%,1) 40%,hsla(220,10%,36%,1) 45%,hsla(220,10%,38%,1) 45%,hsla(220,10%,38%,1) 50%,hsla(220,10%,40%,1) 50%,hsla(220,10%,40%,1) 55%,hsla(220,10%,42%,1) 55%,hsla(220,10%,42%,1) 60%,hsla(220,10%,44%,1) 60%,hsla(220,10%,44%,1) 65%,hsla(220,10%,46%,1) 65%,hsla(220,10%,46%,1) 70%,hsla(220,10%,48%,1) 70%,hsla(220,10%,48%,1) 75%,hsla(220,10%,50%,1) 75%,hsla(220,10%,50%,1) 80%,hsla(220,10%,52%,1) 80%,hsla(220,10%,52%,1) 85%,hsla(220,10%,54%,1) 85%,hsla(220,10%,54%,1) 90%,hsla(220,10%,56%,1) 90%,hsla(220,10%,56%,1) 95%,hsla(220,10%,58%,1) 95%,hsla(220,10%,58%,1) 100%,hsla(220,10%,60%,1) 100%,hsla(220,10%,60%,1) 105%,hsla(220,10%,62%,1) 105%); background: linear-gradient(-75deg, #2e3138, hsla(220,10%,20%,1) 5%,hsla(220,10%,22%,1) 5%,hsla(220,10%,22%,1) 10%,hsla(220,10%,24%,1) 10%,hsla(220,10%,24%,1) 15%,hsla(220,10%,26%,1) 15%,hsla(220,10%,26%,1) 20%,hsla(220,10%,28%,1) 20%,hsla(220,10%,28%,1) 25%,hsla(220,10%,30%,1) 25%,hsla(220,10%,30%,1) 30%,hsla(220,10%,32%,1) 30%,hsla(220,10%,32%,1) 35%,hsla(220,10%,34%,1) 35%,hsla(220,10%,34%,1) 40%,hsla(220,10%,36%,1) 40%,hsla(220,10%,36%,1) 45%,hsla(220,10%,38%,1) 45%,hsla(220,10%,38%,1) 50%,hsla(220,10%,40%,1) 50%,hsla(220,10%,40%,1) 55%,hsla(220,10%,42%,1) 55%,hsla(220,10%,42%,1) 60%,hsla(220,10%,44%,1) 60%,hsla(220,10%,44%,1) 65%,hsla(220,10%,46%,1) 65%,hsla(220,10%,46%,1) 70%,hsla(220,10%,48%,1) 70%,hsla(220,10%,48%,1) 75%,hsla(220,10%,50%,1) 75%,hsla(220,10%,50%,1) 80%,hsla(220,10%,52%,1) 80%,hsla(220,10%,52%,1) 85%,hsla(220,10%,54%,1) 85%,hsla(220,10%,54%,1) 90%,hsla(220,10%,56%,1) 90%,hsla(220,10%,56%,1) 95%,hsla(220,10%,58%,1) 95%,hsla(220,10%,58%,1) 100%,hsla(220,10%,60%,1) 100%,hsla(220,10%,60%,1) 105%,hsla(220,10%,62%,1) 105%); } 55% { background: -webkit-linear-gradient(bottom, #e5e600, hsla(60,100%,45%,1) 15%,hsla(60,100%,55%,1) 15%,hsla(60,100%,55%,1) 30%,hsla(60,100%,65%,1) 30%,hsla(60,100%,65%,1) 45%,hsla(60,100%,75%,1) 45%,hsla(60,100%,75%,1) 60%,hsla(60,100%,85%,1) 60%,hsla(60,100%,85%,1) 75%,hsla(60,100%,95%,1) 75%,hsla(60,100%,95%,1) 90%,hsla(60,100%,100%,1) 90%); background: linear-gradient(0deg, #e5e600, hsla(60,100%,45%,1) 15%,hsla(60,100%,55%,1) 15%,hsla(60,100%,55%,1) 30%,hsla(60,100%,65%,1) 30%,hsla(60,100%,65%,1) 45%,hsla(60,100%,75%,1) 45%,hsla(60,100%,75%,1) 60%,hsla(60,100%,85%,1) 60%,hsla(60,100%,85%,1) 75%,hsla(60,100%,95%,1) 75%,hsla(60,100%,95%,1) 90%,hsla(60,100%,100%,1) 90%); } 60% { background: -webkit-linear-gradient(top, #11f20d, hsla(139,90%,50%,1) 0%,hsla(139,90%,50%,1) 41%,hsla(229,90%,50%,1) 40%,hsla(229,90%,50%,1) 80%,hsla(108,90%,50%,1) 116%,hsla(108,90%,50%,1) 174%,hsla(297,90%,50%,1) 108%,hsla(297,90%,50%,1) 144%,hsla(319,90%,50%,1) 48%,hsla(319,90%,50%,1) 60%,hsla(229,90%,50%,1) 70%,hsla(229,90%,50%,1) 84%,hsla(260,90%,50%,1) 324%,hsla(260,90%,50%,1) 378%,hsla(308,90%,50%,1) 147%,hsla(308,90%,50%,1) 168%,hsla(203,90%,50%,1) 352%,hsla(203,90%,50%,1) 396%,hsla(33,90%,50%,1) 342%,hsla(33,90%,50%,1) 380%,hsla(303,90%,50%,1) 300%,hsla(303,90%,50%,1) 330%,hsla(321,90%,50%,1) 605%,hsla(321,90%,50%,1) 660%,hsla(116,90%,50%,1) 264%,hsla(116,90%,50%,1) 286%,hsla(297,90%,50%,1) 624%,hsla(297,90%,50%,1) 672%,hsla(246,90%,50%,1) 182%,hsla(246,90%,50%,1) 195%,hsla(119,90%,50%,1) 885%,hsla(119,90%,50%,1) 944%); background: linear-gradient(180deg, #11f20d, hsla(139,90%,50%,1) 0%,hsla(139,90%,50%,1) 41%,hsla(229,90%,50%,1) 40%,hsla(229,90%,50%,1) 80%,hsla(108,90%,50%,1) 116%,hsla(108,90%,50%,1) 174%,hsla(297,90%,50%,1) 108%,hsla(297,90%,50%,1) 144%,hsla(319,90%,50%,1) 48%,hsla(319,90%,50%,1) 60%,hsla(229,90%,50%,1) 70%,hsla(229,90%,50%,1) 84%,hsla(260,90%,50%,1) 324%,hsla(260,90%,50%,1) 378%,hsla(308,90%,50%,1) 147%,hsla(308,90%,50%,1) 168%,hsla(203,90%,50%,1) 352%,hsla(203,90%,50%,1) 396%,hsla(33,90%,50%,1) 342%,hsla(33,90%,50%,1) 380%,hsla(303,90%,50%,1) 300%,hsla(303,90%,50%,1) 330%,hsla(321,90%,50%,1) 605%,hsla(321,90%,50%,1) 660%,hsla(116,90%,50%,1) 264%,hsla(116,90%,50%,1) 286%,hsla(297,90%,50%,1) 624%,hsla(297,90%,50%,1) 672%,hsla(246,90%,50%,1) 182%,hsla(246,90%,50%,1) 195%,hsla(119,90%,50%,1) 885%,hsla(119,90%,50%,1) 944%); } 65% { background: -webkit-linear-gradient(60deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); background: linear-gradient(30deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); } 70% { background: -webkit-linear-gradient(bottom, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); background: linear-gradient(0deg, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); } 75% { background: -webkit-linear-gradient(45deg, hsla(266,61%,57%,1) 0%,hsla(266,61%,57%,1) 15%,hsla(93,86%,48%,1) 15%,hsla(93,86%,48%,1) 30%,hsla(188,55%,37%,1) 30%,hsla(188,55%,37%,1) 45%,hsla(354,82%,62%,1) 45%,hsla(354,82%,62%,1) 60%,hsla(8,72%,47%,1) 60%,hsla(8,72%,47%,1) 75%,hsla(100,30%,63%,1) 75%,hsla(100,30%,63%,1) 90%,hsla(147,22%,77%,1) 90%,hsla(147,22%,77%,1) 105%,hsla(310,62%,31%,1) 105%,hsla(310,62%,31%,1) 120%); background: linear-gradient(45deg, hsla(266,61%,57%,1) 0%,hsla(266,61%,57%,1) 15%,hsla(93,86%,48%,1) 15%,hsla(93,86%,48%,1) 30%,hsla(188,55%,37%,1) 30%,hsla(188,55%,37%,1) 45%,hsla(354,82%,62%,1) 45%,hsla(354,82%,62%,1) 60%,hsla(8,72%,47%,1) 60%,hsla(8,72%,47%,1) 75%,hsla(100,30%,63%,1) 75%,hsla(100,30%,63%,1) 90%,hsla(147,22%,77%,1) 90%,hsla(147,22%,77%,1) 105%,hsla(310,62%,31%,1) 105%,hsla(310,62%,31%,1) 120%); } 80% { background: -webkit-linear-gradient(top, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); background: linear-gradient(180deg, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); } 85% { background: -webkit-linear-gradient(bottom, #c0c, hsla(300,100%,40%,1) 10%,hsla(300,100%,30%,1) 10%,hsla(300,100%,30%,1) 20%,hsla(300,100%,20%,1) 20%,hsla(300,100%,20%,1) 30%,hsla(300,100%,10%,1) 30%,hsla(300,100%,10%,1) 40%,hsla(300,100%,0%,1) 40%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); background: linear-gradient(0deg, #c0c, hsla(300,100%,40%,1) 10%,hsla(300,100%,30%,1) 10%,hsla(300,100%,30%,1) 20%,hsla(300,100%,20%,1) 20%,hsla(300,100%,20%,1) 30%,hsla(300,100%,10%,1) 30%,hsla(300,100%,10%,1) 40%,hsla(300,100%,0%,1) 40%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); } 90% { background: -webkit-linear-gradient(bottom, hsla(156,40%,38%,1) 0%,hsla(156,40%,38%,1) 10%,hsla(39,92%,25%,1) 10%,hsla(39,92%,25%,1) 20%,hsla(286,51%,96%,1) 20%,hsla(286,51%,96%,1) 30%); background: linear-gradient(0deg, hsla(156,40%,38%,1) 0%,hsla(156,40%,38%,1) 10%,hsla(39,92%,25%,1) 10%,hsla(39,92%,25%,1) 20%,hsla(286,51%,96%,1) 20%,hsla(286,51%,96%,1) 30%); } 95% { background: -webkit-linear-gradient(45deg, #c20, hsla(30,100%,40%,1) 0%,hsla(30,100%,40%,1) 56%,hsla(20,100%,40%,1) 57%,hsla(20,100%,40%,1) 114%,hsla(29,100%,40%,1) 86%,hsla(29,100%,40%,1) 129%,hsla(12,100%,40%,1) 33%,hsla(12,100%,40%,1) 44%,hsla(7,100%,40%,1) 144%,hsla(7,100%,40%,1) 180%,hsla(24,100%,40%,1) 95%,hsla(24,100%,40%,1) 114%,hsla(19,100%,40%,1) 354%,hsla(19,100%,40%,1) 413%,hsla(13,100%,40%,1) 161%,hsla(13,100%,40%,1) 184%,hsla(30,100%,40%,1) 264%,hsla(30,100%,40%,1) 297%,hsla(8,100%,40%,1) 135%,hsla(8,100%,40%,1) 150%,hsla(10,100%,40%,1) 530%,hsla(10,100%,40%,1) 583%); background: linear-gradient(45deg, #c20, hsla(30,100%,40%,1) 0%,hsla(30,100%,40%,1) 56%,hsla(20,100%,40%,1) 57%,hsla(20,100%,40%,1) 114%,hsla(29,100%,40%,1) 86%,hsla(29,100%,40%,1) 129%,hsla(12,100%,40%,1) 33%,hsla(12,100%,40%,1) 44%,hsla(7,100%,40%,1) 144%,hsla(7,100%,40%,1) 180%,hsla(24,100%,40%,1) 95%,hsla(24,100%,40%,1) 114%,hsla(19,100%,40%,1) 354%,hsla(19,100%,40%,1) 413%,hsla(13,100%,40%,1) 161%,hsla(13,100%,40%,1) 184%,hsla(30,100%,40%,1) 264%,hsla(30,100%,40%,1) 297%,hsla(8,100%,40%,1) 135%,hsla(8,100%,40%,1) 150%,hsla(10,100%,40%,1) 530%,hsla(10,100%,40%,1) 583%); }
}
@keyframes ground { 0 { background: -webkit-linear-gradient(#0f0, #0f0); background: linear-gradient(#0f0, #0f0); } 5% { background: -webkit-linear-gradient(#082b08, #082b08); background: linear-gradient(#082b08, #082b08); } 10% { background: -webkit-linear-gradient(290deg, #24423b, hsla(327,30%,20%,1) 0%,hsla(327,30%,20%,1) 21%,hsla(4,30%,20%,1) 41%,hsla(4,30%,20%,1) 82%,hsla(203,30%,20%,1) 110%,hsla(203,30%,20%,1) 165%,hsla(5,30%,20%,1) 126%,hsla(5,30%,20%,1) 168%,hsla(326,30%,20%,1) 100%,hsla(326,30%,20%,1) 125%,hsla(287,30%,20%,1) 220%,hsla(287,30%,20%,1) 264%,hsla(347,30%,20%,1) 84%,hsla(347,30%,20%,1) 98%,hsla(65,30%,20%,1) 406%,hsla(65,30%,20%,1) 464%,hsla(75,30%,20%,1) 448%,hsla(75,30%,20%,1) 504%,hsla(35,30%,20%,1) 270%,hsla(35,30%,20%,1) 300%,hsla(166,30%,20%,1) 130%,hsla(166,30%,20%,1) 143%); background: linear-gradient(160deg, #24423b, hsla(327,30%,20%,1) 0%,hsla(327,30%,20%,1) 21%,hsla(4,30%,20%,1) 41%,hsla(4,30%,20%,1) 82%,hsla(203,30%,20%,1) 110%,hsla(203,30%,20%,1) 165%,hsla(5,30%,20%,1) 126%,hsla(5,30%,20%,1) 168%,hsla(326,30%,20%,1) 100%,hsla(326,30%,20%,1) 125%,hsla(287,30%,20%,1) 220%,hsla(287,30%,20%,1) 264%,hsla(347,30%,20%,1) 84%,hsla(347,30%,20%,1) 98%,hsla(65,30%,20%,1) 406%,hsla(65,30%,20%,1) 464%,hsla(75,30%,20%,1) 448%,hsla(75,30%,20%,1) 504%,hsla(35,30%,20%,1) 270%,hsla(35,30%,20%,1) 300%,hsla(166,30%,20%,1) 130%,hsla(166,30%,20%,1) 143%); } 15% { background: -webkit-linear-gradient(bottom, #132639, hsla(210,50%,15%,1) 25%,hsla(210,50%,10%,1) 25%,hsla(210,50%,10%,1) 50%,hsla(210,50%,5%,1) 50%,hsla(210,50%,5%,1) 75%,hsla(210,50%,0%,1) 75%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); background: linear-gradient(0deg, #132639, hsla(210,50%,15%,1) 25%,hsla(210,50%,10%,1) 25%,hsla(210,50%,10%,1) 50%,hsla(210,50%,5%,1) 50%,hsla(210,50%,5%,1) 75%,hsla(210,50%,0%,1) 75%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 100%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 125%,hsla(210,50%,0%,1) 150%,hsla(210,50%,0%,1) 150%); } 20% { background: -webkit-linear-gradient(bottom, #4d192a, hsla(340,50%,20%,1) 25%,hsla(340,50%,10%,1) 25%,hsla(340,50%,10%,1) 50%,hsla(340,50%,0%,1) 50%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); background: linear-gradient(0deg, #4d192a, hsla(340,50%,20%,1) 25%,hsla(340,50%,10%,1) 25%,hsla(340,50%,10%,1) 50%,hsla(340,50%,0%,1) 50%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 75%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 100%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 125%,hsla(340,50%,0%,1) 150%,hsla(340,50%,0%,1) 150%); } 25% { background: -webkit-linear-gradient(45deg, #33c2cc, hsla(96,60%,50%,1) 0%,hsla(96,60%,50%,1) 34%,hsla(62,60%,50%,1) 49%,hsla(62,60%,50%,1) 98%,hsla(113,60%,50%,1) 88%,hsla(113,60%,50%,1) 132%,hsla(70,60%,50%,1) 75%,hsla(70,60%,50%,1) 100%,hsla(99,60%,50%,1) 184%,hsla(99,60%,50%,1) 230%,hsla(199,60%,50%,1) 235%,hsla(199,60%,50%,1) 282%,hsla(88,60%,50%,1) 234%,hsla(88,60%,50%,1) 273%,hsla(222,60%,50%,1) 329%,hsla(222,60%,50%,1) 376%,hsla(75,60%,50%,1) 312%,hsla(75,60%,50%,1) 351%,hsla(130,60%,50%,1) 342%,hsla(130,60%,50%,1) 380%,hsla(127,60%,50%,1) 140%,hsla(127,60%,50%,1) 154%,hsla(155,60%,50%,1) 561%,hsla(155,60%,50%,1) 612%,hsla(257,60%,50%,1) 240%,hsla(257,60%,50%,1) 260%,hsla(222,60%,50%,1) 273%,hsla(222,60%,50%,1) 294%,hsla(169,60%,50%,1) 770%,hsla(169,60%,50%,1) 825%,hsla(114,60%,50%,1) 465%,hsla(114,60%,50%,1) 496%,hsla(62,60%,50%,1) 752%,hsla(62,60%,50%,1) 799%,hsla(147,60%,50%,1) 646%,hsla(147,60%,50%,1) 684%,hsla(212,60%,50%,1) 288%,hsla(212,60%,50%,1) 304%,hsla(81,60%,50%,1) 456%,hsla(81,60%,50%,1) 480%,hsla(184,60%,50%,1) 260%,hsla(184,60%,50%,1) 273%); background: linear-gradient(45deg, #33c2cc, hsla(96,60%,50%,1) 0%,hsla(96,60%,50%,1) 34%,hsla(62,60%,50%,1) 49%,hsla(62,60%,50%,1) 98%,hsla(113,60%,50%,1) 88%,hsla(113,60%,50%,1) 132%,hsla(70,60%,50%,1) 75%,hsla(70,60%,50%,1) 100%,hsla(99,60%,50%,1) 184%,hsla(99,60%,50%,1) 230%,hsla(199,60%,50%,1) 235%,hsla(199,60%,50%,1) 282%,hsla(88,60%,50%,1) 234%,hsla(88,60%,50%,1) 273%,hsla(222,60%,50%,1) 329%,hsla(222,60%,50%,1) 376%,hsla(75,60%,50%,1) 312%,hsla(75,60%,50%,1) 351%,hsla(130,60%,50%,1) 342%,hsla(130,60%,50%,1) 380%,hsla(127,60%,50%,1) 140%,hsla(127,60%,50%,1) 154%,hsla(155,60%,50%,1) 561%,hsla(155,60%,50%,1) 612%,hsla(257,60%,50%,1) 240%,hsla(257,60%,50%,1) 260%,hsla(222,60%,50%,1) 273%,hsla(222,60%,50%,1) 294%,hsla(169,60%,50%,1) 770%,hsla(169,60%,50%,1) 825%,hsla(114,60%,50%,1) 465%,hsla(114,60%,50%,1) 496%,hsla(62,60%,50%,1) 752%,hsla(62,60%,50%,1) 799%,hsla(147,60%,50%,1) 646%,hsla(147,60%,50%,1) 684%,hsla(212,60%,50%,1) 288%,hsla(212,60%,50%,1) 304%,hsla(81,60%,50%,1) 456%,hsla(81,60%,50%,1) 480%,hsla(184,60%,50%,1) 260%,hsla(184,60%,50%,1) 273%); } 30% { background: -webkit-linear-gradient(top, #808080, hsla(300,0%,50%,1) 40%,hsla(300,0%,70%,1) 40%,hsla(300,0%,70%,1) 80%,hsla(300,0%,90%,1) 80%,hsla(300,0%,90%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); background: linear-gradient(180deg, #808080, hsla(300,0%,50%,1) 40%,hsla(300,0%,70%,1) 40%,hsla(300,0%,70%,1) 80%,hsla(300,0%,90%,1) 80%,hsla(300,0%,90%,1) 120%,hsla(300,0%,100%,1) 120%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 160%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 200%,hsla(300,0%,100%,1) 240%,hsla(300,0%,100%,1) 240%); } 35% { background: -webkit-linear-gradient(85deg, hsla(98,52%,34%,1) 0%,hsla(98,52%,34%,1) 10%,hsla(278,58%,41%,1) 10%,hsla(278,58%,41%,1) 20%,hsla(141,70%,83%,1) 20%,hsla(141,70%,83%,1) 30%); background: linear-gradient(5deg, hsla(98,52%,34%,1) 0%,hsla(98,52%,34%,1) 10%,hsla(278,58%,41%,1) 10%,hsla(278,58%,41%,1) 20%,hsla(141,70%,83%,1) 20%,hsla(141,70%,83%,1) 30%); } 40% { background: -webkit-linear-gradient(top, #c20, hsla(10,100%,40%,1) 50%,hsla(10,100%,50%,1) 50%,hsla(10,100%,50%,1) 100%,hsla(10,100%,60%,1) 100%); background: linear-gradient(180deg, #c20, hsla(10,100%,40%,1) 50%,hsla(10,100%,50%,1) 50%,hsla(10,100%,50%,1) 100%,hsla(10,100%,60%,1) 100%); } 45% { background: -webkit-linear-gradient(60deg, #dbf20d, hsla(133,90%,50%,1) 0%,hsla(133,90%,50%,1) 14%,hsla(76,90%,50%,1) 27%,hsla(76,90%,50%,1) 54%,hsla(72,90%,50%,1) 32%,hsla(72,90%,50%,1) 48%,hsla(116,90%,50%,1) 84%,hsla(116,90%,50%,1) 112%,hsla(118,90%,50%,1) 188%,hsla(118,90%,50%,1) 235%,hsla(62,90%,50%,1) 225%,hsla(62,90%,50%,1) 270%,hsla(122,90%,50%,1) 192%,hsla(122,90%,50%,1) 224%,hsla(179,90%,50%,1) 140%,hsla(179,90%,50%,1) 160%,hsla(153,90%,50%,1) 392%,hsla(153,90%,50%,1) 441%,hsla(151,90%,50%,1) 207%,hsla(151,90%,50%,1) 230%,hsla(133,90%,50%,1) 530%,hsla(133,90%,50%,1) 583%,hsla(138,90%,50%,1) 121%,hsla(138,90%,50%,1) 132%,hsla(93,90%,50%,1) 276%,hsla(93,90%,50%,1) 299%,hsla(130,90%,50%,1) 676%,hsla(130,90%,50%,1) 728%,hsla(63,90%,50%,1) 350%,hsla(63,90%,50%,1) 375%,hsla(145,90%,50%,1) 840%,hsla(145,90%,50%,1) 896%,hsla(121,90%,50%,1) 320%,hsla(121,90%,50%,1) 340%,hsla(144,90%,50%,1) 510%,hsla(144,90%,50%,1) 540%,hsla(94,90%,50%,1) 810%,hsla(94,90%,50%,1) 855%,hsla(172,90%,50%,1) 1045%,hsla(172,90%,50%,1) 1100%,hsla(66,90%,50%,1) 460%,hsla(66,90%,50%,1) 483%); background: linear-gradient(30deg, #dbf20d, hsla(133,90%,50%,1) 0%,hsla(133,90%,50%,1) 14%,hsla(76,90%,50%,1) 27%,hsla(76,90%,50%,1) 54%,hsla(72,90%,50%,1) 32%,hsla(72,90%,50%,1) 48%,hsla(116,90%,50%,1) 84%,hsla(116,90%,50%,1) 112%,hsla(118,90%,50%,1) 188%,hsla(118,90%,50%,1) 235%,hsla(62,90%,50%,1) 225%,hsla(62,90%,50%,1) 270%,hsla(122,90%,50%,1) 192%,hsla(122,90%,50%,1) 224%,hsla(179,90%,50%,1) 140%,hsla(179,90%,50%,1) 160%,hsla(153,90%,50%,1) 392%,hsla(153,90%,50%,1) 441%,hsla(151,90%,50%,1) 207%,hsla(151,90%,50%,1) 230%,hsla(133,90%,50%,1) 530%,hsla(133,90%,50%,1) 583%,hsla(138,90%,50%,1) 121%,hsla(138,90%,50%,1) 132%,hsla(93,90%,50%,1) 276%,hsla(93,90%,50%,1) 299%,hsla(130,90%,50%,1) 676%,hsla(130,90%,50%,1) 728%,hsla(63,90%,50%,1) 350%,hsla(63,90%,50%,1) 375%,hsla(145,90%,50%,1) 840%,hsla(145,90%,50%,1) 896%,hsla(121,90%,50%,1) 320%,hsla(121,90%,50%,1) 340%,hsla(144,90%,50%,1) 510%,hsla(144,90%,50%,1) 540%,hsla(94,90%,50%,1) 810%,hsla(94,90%,50%,1) 855%,hsla(172,90%,50%,1) 1045%,hsla(172,90%,50%,1) 1100%,hsla(66,90%,50%,1) 460%,hsla(66,90%,50%,1) 483%); } 50% { background: -webkit-linear-gradient(165deg, #2e3138, hsla(220,10%,20%,1) 5%,hsla(220,10%,22%,1) 5%,hsla(220,10%,22%,1) 10%,hsla(220,10%,24%,1) 10%,hsla(220,10%,24%,1) 15%,hsla(220,10%,26%,1) 15%,hsla(220,10%,26%,1) 20%,hsla(220,10%,28%,1) 20%,hsla(220,10%,28%,1) 25%,hsla(220,10%,30%,1) 25%,hsla(220,10%,30%,1) 30%,hsla(220,10%,32%,1) 30%,hsla(220,10%,32%,1) 35%,hsla(220,10%,34%,1) 35%,hsla(220,10%,34%,1) 40%,hsla(220,10%,36%,1) 40%,hsla(220,10%,36%,1) 45%,hsla(220,10%,38%,1) 45%,hsla(220,10%,38%,1) 50%,hsla(220,10%,40%,1) 50%,hsla(220,10%,40%,1) 55%,hsla(220,10%,42%,1) 55%,hsla(220,10%,42%,1) 60%,hsla(220,10%,44%,1) 60%,hsla(220,10%,44%,1) 65%,hsla(220,10%,46%,1) 65%,hsla(220,10%,46%,1) 70%,hsla(220,10%,48%,1) 70%,hsla(220,10%,48%,1) 75%,hsla(220,10%,50%,1) 75%,hsla(220,10%,50%,1) 80%,hsla(220,10%,52%,1) 80%,hsla(220,10%,52%,1) 85%,hsla(220,10%,54%,1) 85%,hsla(220,10%,54%,1) 90%,hsla(220,10%,56%,1) 90%,hsla(220,10%,56%,1) 95%,hsla(220,10%,58%,1) 95%,hsla(220,10%,58%,1) 100%,hsla(220,10%,60%,1) 100%,hsla(220,10%,60%,1) 105%,hsla(220,10%,62%,1) 105%); background: linear-gradient(-75deg, #2e3138, hsla(220,10%,20%,1) 5%,hsla(220,10%,22%,1) 5%,hsla(220,10%,22%,1) 10%,hsla(220,10%,24%,1) 10%,hsla(220,10%,24%,1) 15%,hsla(220,10%,26%,1) 15%,hsla(220,10%,26%,1) 20%,hsla(220,10%,28%,1) 20%,hsla(220,10%,28%,1) 25%,hsla(220,10%,30%,1) 25%,hsla(220,10%,30%,1) 30%,hsla(220,10%,32%,1) 30%,hsla(220,10%,32%,1) 35%,hsla(220,10%,34%,1) 35%,hsla(220,10%,34%,1) 40%,hsla(220,10%,36%,1) 40%,hsla(220,10%,36%,1) 45%,hsla(220,10%,38%,1) 45%,hsla(220,10%,38%,1) 50%,hsla(220,10%,40%,1) 50%,hsla(220,10%,40%,1) 55%,hsla(220,10%,42%,1) 55%,hsla(220,10%,42%,1) 60%,hsla(220,10%,44%,1) 60%,hsla(220,10%,44%,1) 65%,hsla(220,10%,46%,1) 65%,hsla(220,10%,46%,1) 70%,hsla(220,10%,48%,1) 70%,hsla(220,10%,48%,1) 75%,hsla(220,10%,50%,1) 75%,hsla(220,10%,50%,1) 80%,hsla(220,10%,52%,1) 80%,hsla(220,10%,52%,1) 85%,hsla(220,10%,54%,1) 85%,hsla(220,10%,54%,1) 90%,hsla(220,10%,56%,1) 90%,hsla(220,10%,56%,1) 95%,hsla(220,10%,58%,1) 95%,hsla(220,10%,58%,1) 100%,hsla(220,10%,60%,1) 100%,hsla(220,10%,60%,1) 105%,hsla(220,10%,62%,1) 105%); } 55% { background: -webkit-linear-gradient(bottom, #e5e600, hsla(60,100%,45%,1) 15%,hsla(60,100%,55%,1) 15%,hsla(60,100%,55%,1) 30%,hsla(60,100%,65%,1) 30%,hsla(60,100%,65%,1) 45%,hsla(60,100%,75%,1) 45%,hsla(60,100%,75%,1) 60%,hsla(60,100%,85%,1) 60%,hsla(60,100%,85%,1) 75%,hsla(60,100%,95%,1) 75%,hsla(60,100%,95%,1) 90%,hsla(60,100%,100%,1) 90%); background: linear-gradient(0deg, #e5e600, hsla(60,100%,45%,1) 15%,hsla(60,100%,55%,1) 15%,hsla(60,100%,55%,1) 30%,hsla(60,100%,65%,1) 30%,hsla(60,100%,65%,1) 45%,hsla(60,100%,75%,1) 45%,hsla(60,100%,75%,1) 60%,hsla(60,100%,85%,1) 60%,hsla(60,100%,85%,1) 75%,hsla(60,100%,95%,1) 75%,hsla(60,100%,95%,1) 90%,hsla(60,100%,100%,1) 90%); } 60% { background: -webkit-linear-gradient(top, #11f20d, hsla(139,90%,50%,1) 0%,hsla(139,90%,50%,1) 41%,hsla(229,90%,50%,1) 40%,hsla(229,90%,50%,1) 80%,hsla(108,90%,50%,1) 116%,hsla(108,90%,50%,1) 174%,hsla(297,90%,50%,1) 108%,hsla(297,90%,50%,1) 144%,hsla(319,90%,50%,1) 48%,hsla(319,90%,50%,1) 60%,hsla(229,90%,50%,1) 70%,hsla(229,90%,50%,1) 84%,hsla(260,90%,50%,1) 324%,hsla(260,90%,50%,1) 378%,hsla(308,90%,50%,1) 147%,hsla(308,90%,50%,1) 168%,hsla(203,90%,50%,1) 352%,hsla(203,90%,50%,1) 396%,hsla(33,90%,50%,1) 342%,hsla(33,90%,50%,1) 380%,hsla(303,90%,50%,1) 300%,hsla(303,90%,50%,1) 330%,hsla(321,90%,50%,1) 605%,hsla(321,90%,50%,1) 660%,hsla(116,90%,50%,1) 264%,hsla(116,90%,50%,1) 286%,hsla(297,90%,50%,1) 624%,hsla(297,90%,50%,1) 672%,hsla(246,90%,50%,1) 182%,hsla(246,90%,50%,1) 195%,hsla(119,90%,50%,1) 885%,hsla(119,90%,50%,1) 944%); background: linear-gradient(180deg, #11f20d, hsla(139,90%,50%,1) 0%,hsla(139,90%,50%,1) 41%,hsla(229,90%,50%,1) 40%,hsla(229,90%,50%,1) 80%,hsla(108,90%,50%,1) 116%,hsla(108,90%,50%,1) 174%,hsla(297,90%,50%,1) 108%,hsla(297,90%,50%,1) 144%,hsla(319,90%,50%,1) 48%,hsla(319,90%,50%,1) 60%,hsla(229,90%,50%,1) 70%,hsla(229,90%,50%,1) 84%,hsla(260,90%,50%,1) 324%,hsla(260,90%,50%,1) 378%,hsla(308,90%,50%,1) 147%,hsla(308,90%,50%,1) 168%,hsla(203,90%,50%,1) 352%,hsla(203,90%,50%,1) 396%,hsla(33,90%,50%,1) 342%,hsla(33,90%,50%,1) 380%,hsla(303,90%,50%,1) 300%,hsla(303,90%,50%,1) 330%,hsla(321,90%,50%,1) 605%,hsla(321,90%,50%,1) 660%,hsla(116,90%,50%,1) 264%,hsla(116,90%,50%,1) 286%,hsla(297,90%,50%,1) 624%,hsla(297,90%,50%,1) 672%,hsla(246,90%,50%,1) 182%,hsla(246,90%,50%,1) 195%,hsla(119,90%,50%,1) 885%,hsla(119,90%,50%,1) 944%); } 65% { background: -webkit-linear-gradient(60deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); background: linear-gradient(30deg, #0fa, hsla(160,100%,50%,1) 35%,hsla(160,100%,45%,1) 35%); } 70% { background: -webkit-linear-gradient(bottom, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); background: linear-gradient(0deg, #ff0, hsla(60,100%,50%,1) 23%,hsla(60,100%,45%,1) 23%,hsla(60,100%,45%,1) 46%,hsla(60,100%,40%,1) 46%); } 75% { background: -webkit-linear-gradient(45deg, hsla(266,61%,57%,1) 0%,hsla(266,61%,57%,1) 15%,hsla(93,86%,48%,1) 15%,hsla(93,86%,48%,1) 30%,hsla(188,55%,37%,1) 30%,hsla(188,55%,37%,1) 45%,hsla(354,82%,62%,1) 45%,hsla(354,82%,62%,1) 60%,hsla(8,72%,47%,1) 60%,hsla(8,72%,47%,1) 75%,hsla(100,30%,63%,1) 75%,hsla(100,30%,63%,1) 90%,hsla(147,22%,77%,1) 90%,hsla(147,22%,77%,1) 105%,hsla(310,62%,31%,1) 105%,hsla(310,62%,31%,1) 120%); background: linear-gradient(45deg, hsla(266,61%,57%,1) 0%,hsla(266,61%,57%,1) 15%,hsla(93,86%,48%,1) 15%,hsla(93,86%,48%,1) 30%,hsla(188,55%,37%,1) 30%,hsla(188,55%,37%,1) 45%,hsla(354,82%,62%,1) 45%,hsla(354,82%,62%,1) 60%,hsla(8,72%,47%,1) 60%,hsla(8,72%,47%,1) 75%,hsla(100,30%,63%,1) 75%,hsla(100,30%,63%,1) 90%,hsla(147,22%,77%,1) 90%,hsla(147,22%,77%,1) 105%,hsla(310,62%,31%,1) 105%,hsla(310,62%,31%,1) 120%); } 80% { background: -webkit-linear-gradient(top, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); background: linear-gradient(180deg, #05f, hsla(220,100%,50%,1) 10%,hsla(220,100%,60%,1) 10%,hsla(220,100%,60%,1) 20%,hsla(220,100%,70%,1) 20%,hsla(220,100%,70%,1) 30%,hsla(220,100%,80%,1) 30%); } 85% { background: -webkit-linear-gradient(bottom, #c0c, hsla(300,100%,40%,1) 10%,hsla(300,100%,30%,1) 10%,hsla(300,100%,30%,1) 20%,hsla(300,100%,20%,1) 20%,hsla(300,100%,20%,1) 30%,hsla(300,100%,10%,1) 30%,hsla(300,100%,10%,1) 40%,hsla(300,100%,0%,1) 40%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); background: linear-gradient(0deg, #c0c, hsla(300,100%,40%,1) 10%,hsla(300,100%,30%,1) 10%,hsla(300,100%,30%,1) 20%,hsla(300,100%,20%,1) 20%,hsla(300,100%,20%,1) 30%,hsla(300,100%,10%,1) 30%,hsla(300,100%,10%,1) 40%,hsla(300,100%,0%,1) 40%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 50%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 60%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 70%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 80%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 90%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 100%,hsla(300,100%,0%,1) 110%,hsla(300,100%,0%,1) 110%); } 90% { background: -webkit-linear-gradient(bottom, hsla(156,40%,38%,1) 0%,hsla(156,40%,38%,1) 10%,hsla(39,92%,25%,1) 10%,hsla(39,92%,25%,1) 20%,hsla(286,51%,96%,1) 20%,hsla(286,51%,96%,1) 30%); background: linear-gradient(0deg, hsla(156,40%,38%,1) 0%,hsla(156,40%,38%,1) 10%,hsla(39,92%,25%,1) 10%,hsla(39,92%,25%,1) 20%,hsla(286,51%,96%,1) 20%,hsla(286,51%,96%,1) 30%); } 95% { background: -webkit-linear-gradient(45deg, #c20, hsla(30,100%,40%,1) 0%,hsla(30,100%,40%,1) 56%,hsla(20,100%,40%,1) 57%,hsla(20,100%,40%,1) 114%,hsla(29,100%,40%,1) 86%,hsla(29,100%,40%,1) 129%,hsla(12,100%,40%,1) 33%,hsla(12,100%,40%,1) 44%,hsla(7,100%,40%,1) 144%,hsla(7,100%,40%,1) 180%,hsla(24,100%,40%,1) 95%,hsla(24,100%,40%,1) 114%,hsla(19,100%,40%,1) 354%,hsla(19,100%,40%,1) 413%,hsla(13,100%,40%,1) 161%,hsla(13,100%,40%,1) 184%,hsla(30,100%,40%,1) 264%,hsla(30,100%,40%,1) 297%,hsla(8,100%,40%,1) 135%,hsla(8,100%,40%,1) 150%,hsla(10,100%,40%,1) 530%,hsla(10,100%,40%,1) 583%); background: linear-gradient(45deg, #c20, hsla(30,100%,40%,1) 0%,hsla(30,100%,40%,1) 56%,hsla(20,100%,40%,1) 57%,hsla(20,100%,40%,1) 114%,hsla(29,100%,40%,1) 86%,hsla(29,100%,40%,1) 129%,hsla(12,100%,40%,1) 33%,hsla(12,100%,40%,1) 44%,hsla(7,100%,40%,1) 144%,hsla(7,100%,40%,1) 180%,hsla(24,100%,40%,1) 95%,hsla(24,100%,40%,1) 114%,hsla(19,100%,40%,1) 354%,hsla(19,100%,40%,1) 413%,hsla(13,100%,40%,1) 161%,hsla(13,100%,40%,1) 184%,hsla(30,100%,40%,1) 264%,hsla(30,100%,40%,1) 297%,hsla(8,100%,40%,1) 135%,hsla(8,100%,40%,1) 150%,hsla(10,100%,40%,1) 530%,hsla(10,100%,40%,1) 583%); }
}
@-webkit-keyframes reflection { 0 { opacity: 0; } 5% { opacity: 0; } 10% { opacity: 0; } 15% { opacity: 0; } 20% { opacity: 0; } 25% { opacity: 0.25; } 30% { opacity: 0; } 35% { opacity: 0; } 40% { opacity: 0.1; } 45% { opacity: 0.25; } 50% { opacity: 0.1; } 55% { opacity: 0.25; } 60% { opacity: 0; } 65% { opacity: 0.25; } 70% { opacity: 0.25; } 75% { opacity: 0; } 80% { opacity: 0; } 85% { opacity: 0; } 90% { opacity: 0.25; } 95% { opacity: 0; }
}
@keyframes reflection { 0 { opacity: 0; } 5% { opacity: 0; } 10% { opacity: 0; } 15% { opacity: 0; } 20% { opacity: 0; } 25% { opacity: 0.25; } 30% { opacity: 0; } 35% { opacity: 0; } 40% { opacity: 0.1; } 45% { opacity: 0.25; } 50% { opacity: 0.1; } 55% { opacity: 0.25; } 60% { opacity: 0; } 65% { opacity: 0.25; } 70% { opacity: 0.25; } 75% { opacity: 0; } 80% { opacity: 0; } 85% { opacity: 0; } 90% { opacity: 0.25; } 95% { opacity: 0; }
}

Hellacolor, Flexbox, animation and music - Script Codes JS Codes

var sound = new Howl({ urls: ['https://s3-us-west-2.amazonaws.com/s.cdpn.io/5530/09_Sphinx_Gate.mp3'], autoplay: true, loop: true, volume: 0.5,
}).play();
// Other possible tracks, but time must be set to 40sec
//https://s3-us-west-2.amazonaws.com/s.cdpn.io/5530/Whole_Wide_World_(Instrumental).mp3
//https://s3-us-west-2.amazonaws.com/s.cdpn.io/5530/09_Sphinx_Gate.mp3
//https://s3-us-west-2.amazonaws.com/s.cdpn.io/5530/Sphynx_Gate___The_World_It_Softly_Lulls.mp3
Hellacolor, Flexbox, animation and music - Script Codes
Hellacolor, Flexbox, animation and music - Script Codes
Home Page Home
Developer BROWNERD
Username brownerd
Uploaded August 29, 2022
Rating 3.5
Size 10,370 Kb
Views 24,288
Do you need developer help for Hellacolor, Flexbox, animation and music?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

BROWNERD (brownerd) Script Codes
Name
CSS SLACK plaid
C.Rowe Button
Love for Paris
3 rad blend-mode techniques
R EVOL UTION
Circle
Chunky Nav buttons, centered, no floats
Book
Offset button - layered 60fps
Lego Ziggy Stardust RIP David Bowie
Create amazing marketing copy with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!