css实现三维海面波浪帆船行驶动画效果代码
代码语言：html
所属分类：动画
代码描述：css实现三维海面波浪帆船行驶动画效果代码
下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<style>
body {
background:#c8e6ff;
height:100vh;
overflow:hidden;
display:-webkit-box;
display:-ms-flexbox;
display:flex;
-webkit-box-pack:center;
-ms-flex-pack:center;
justify-content:center;
-webkit-box-align:center;
-ms-flex-align:center;
align-items:center;
-webkit-perspective:800px;
perspective:800px;
}
div {
-webkit-transform-style:preserve-3d;
transform-style:preserve-3d;
position:absolute;
}
#open_water {
-webkit-perspective:800px;
perspective:800px;
-webkit-filter:drop-shadow(0 220px 20px rgba(0,20,150,0.3));
filter:drop-shadow(0 220px 20px rgba(0,20,150,0.3));
}
@-moz-document url-prefix() {
#open_water {
filter:none;
}
}#open_water .tree_1 {
background:-webkit-gradient(linear,left bottom,left top,from(#470d04),color-stop(5%,#ea831c),color-stop(12%,#ea831c),color-stop(20%,#894d10),color-stop(25%,#6b190c),color-stop(26%,#470d04),color-stop(28%,#ea831c),color-stop(36%,#ea831c),color-stop(45%,#894d10),color-stop(50%,#6b190c),color-stop(51%,#470d04),color-stop(53%,#ea831c),color-stop(61%,#ea831c),color-stop(70%,#894d10),color-stop(75%,#6b190c),color-stop(76%,#470d04),color-stop(78%,#ea831c),color-stop(86%,#ea831c),color-stop(95%,#894d10),to(#6b190c));
background:linear-gradient(0deg,#470d04 0%,#ea831c 5%,#ea831c 12%,#894d10 20%,#6b190c 25%,#470d04 26%,#ea831c 28%,#ea831c 36%,#894d10 45%,#6b190c 50%,#470d04 51%,#ea831c 53%,#ea831c 61%,#894d10 70%,#6b190c 75%,#470d04 76%,#ea831c 78%,#ea831c 86%,#894d10 95%,#6b190c 100%);
}
#open_water .tree_2 {
background:-webkit-gradient(linear,left top,right top,from(#470d04),color-stop(5%,#ea831c),color-stop(12%,#ea831c),color-stop(20%,#894d10),color-stop(25%,#6b190c),color-stop(26%,#470d04),color-stop(28%,#ea831c),color-stop(36%,#ea831c),color-stop(45%,#894d10),color-stop(50%,#6b190c),color-stop(51%,#470d04),color-stop(53%,#ea831c),color-stop(61%,#ea831c),color-stop(70%,#894d10),color-stop(75%,#6b190c),color-stop(76%,#470d04),color-stop(78%,#ea831c),color-stop(86%,#ea831c),color-stop(95%,#894d10),to(#6b190c));
background:linear-gradient(90deg,#470d04 0%,#ea831c 5%,#ea831c 12%,#894d10 20%,#6b190c 25%,#470d04 26%,#ea831c 28%,#ea831c 36%,#894d10 45%,#6b190c 50%,#470d04 51%,#ea831c 53%,#ea831c 61%,#894d10 70%,#6b190c 75%,#470d04 76%,#ea831c 78%,#ea831c 86%,#894d10 95%,#6b190c 100%);
}
#open_water .metal {
background:linear-gradient(45deg,#f5f6f6 0%,#dbdce2 21%,#b8bac6 49%,#dddfe3 80%,#f5f6f6 100%);
}
#open_water .black {
background:linear-gradient(135deg,#959595 0%,#0a0a0a 36%,#0a0a0a 36%,#010101 50%,#4e4e4e 65%,#383838 87%,#1b1b1b 100%);
}
#open_water .fish_1 {
background:-webkit-gradient(linear,left top,left bottom,from(#2c539e),color-stop(32%,#2c539e),color-stop(84%,#4786d3),to(#2c539e));
background:linear-gradient(180deg,#2c539e 0%,#2c539e 32%,#4786d3 84%,#2c539e 100%);
}
#open_water .fish_2 {
background:-webkit-gradient(linear,left top,right top,from(#2c539e),color-stop(32%,#2c539e),color-stop(84%,#4786d3),to(#2c539e));
background:linear-gradient(90deg,#2c539e 0%,#2c539e 32%,#4786d3 84%,#2c539e 100%);
}
#open_water .wood {
background:linear-gradient(45deg,#a90329 0%,#8f0222 44%,#6d0019 100%);
}
.camera_x {
-webkit-transform:rotateX(70deg);
transform:rotateX(70deg);
-webkit-animation:cameraX 20000ms linear infinite alternate;
animation:cameraX 20000ms linear infinite alternate;
}
.camera_z {
-webkit-transform:rotateZ(30deg);
transform:rotateZ(30deg);
-webkit-animation:cameraZ 30000ms linear infinite;
animation:cameraZ 30000ms linear infinite;
}
.sea {
-webkit-transform:translate(-50%,-50%) translateZ(-60px);
transform:translate(-50%,-50%) translateZ(-60px);
}
.sea .dolphin .dolphin_move {
-webkit-animation:dolphinMove 10000ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinMove 10000ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(1) .dolphin_z {
-webkit-animation:dolphinZ 1987ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinZ 1987ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(1) .dolphin_rotate {
-webkit-animation:dolphinRotate 1987ms -993.5ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinRotate 1987ms -993.5ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(1) {
-webkit-transform:translate(410px,200px);
transform:translate(410px,200px);
}
.sea .dolphin:nth-child(2) {
-webkit-transform:translate(370px,160px);
transform:translate(370px,160px);
}
.sea .dolphin:nth-child(3) {
-webkit-transform:translate(100px,400px);
transform:translate(100px,400px);
}
.sea .dolphin:nth-child(4) {
-webkit-transform:translate(60px,360px);
transform:translate(60px,360px);
}
.sea .dolphin:nth-child(5) {
-webkit-transform:translate(110px,340px);
transform:translate(110px,340px);
}
.sea .dolphin:nth-child(2) .dolphin_z {
-webkit-animation:dolphinZ 2494ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinZ 2494ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(2) .dolphin_rotate {
-webkit-animation:dolphinRotate 2494ms -1247ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinRotate 2494ms -1247ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(1) {
-webkit-transform:translate(410px,200px);
transform:translate(410px,200px);
}
.sea .dolphin:nth-child(2) {
-webkit-transform:translate(370px,160px);
transform:translate(370px,160px);
}
.sea .dolphin:nth-child(3) {
-webkit-transform:translate(100px,400px);
transform:translate(100px,400px);
}
.sea .dolphin:nth-child(4) {
-webkit-transform:translate(60px,360px);
transform:translate(60px,360px);
}
.sea .dolphin:nth-child(5) {
-webkit-transform:translate(110px,340px);
transform:translate(110px,340px);
}
.sea .dolphin:nth-child(3) .dolphin_z {
-webkit-animation:dolphinZ 1767ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinZ 1767ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(3) .dolphin_rotate {
-webkit-animation:dolphinRotate 1767ms -883.5ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinRotate 1767ms -883.5ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(1) {
-webkit-transform:translate(410px,200px);
transform:translate(410px,200px);
}
.sea .dolphin:nth-child(2) {
-webkit-transform:translate(370px,160px);
transform:translate(370px,160px);
}
.sea .dolphin:nth-child(3) {
-webkit-transform:translate(100px,400px);
transform:translate(100px,400px);
}
.sea .dolphin:nth-child(4) {
-webkit-transform:translate(60px,360px);
transform:translate(60px,360px);
}
.sea .dolphin:nth-child(5) {
-webkit-transform:translate(110px,340px);
transform:translate(110px,340px);
}
.sea .dolphin:nth-child(4) .dolphin_z {
-webkit-animation:dolphinZ 1697ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinZ 1697ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(4) .dolphin_rotate {
-webkit-animation:dolphinRotate 1697ms -848.5ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinRotate 1697ms -848.5ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(1) {
-webkit-transform:translate(410px,200px);
transform:translate(410px,200px);
}
.sea .dolphin:nth-child(2) {
-webkit-transform:translate(370px,160px);
transform:translate(370px,160px);
}
.sea .dolphin:nth-child(3) {
-webkit-transform:translate(100px,400px);
transform:translate(100px,400px);
}
.sea .dolphin:nth-child(4) {
-webkit-transform:translate(60px,360px);
transform:translate(60px,360px);
}
.sea .dolphin:nth-child(5) {
-webkit-transform:translate(110px,340px);
transform:translate(110px,340px);
}
.sea .dolphin:nth-child(5) .dolphin_z {
-webkit-animation:dolphinZ 1776ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinZ 1776ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(5) .dolphin_rotate {
-webkit-animation:dolphinRotate 1776ms -888ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
animation:dolphinRotate 1776ms -888ms cubic-bezier(0.545,0.08,0.52,0.975) infinite alternate;
}
.sea .dolphin:nth-child(1) {
-webkit-transform:translate(410px,200px);
transform:translate(410px,200px);
}
.sea .dolphin:nth-child(2) {
-webkit-transform:translate(370px,160px);
transform:translate(370px,160px);
}
.sea .dolphin:nth-child(3) {
-webkit-transform:translate(100px,400px);
transform:translate(100px,400px);
}
.sea .dolphin:nth-child(4) {
-webkit-transform:translate(60px,360px);
transform:translate(60px,360px);
}
.sea .dolphin:nth-child(5) {
-webkit-transform:translate(110px,340px);
transform:translate(110px,340px);
}
.sea .dolphin .body {
width:15px;
height:40px;
background:blue;
-webkit-transform:rotateY(90deg);
transform:rotateY(90deg);
-webkit-clip-path:polygon(0 60%,50% 0,100% 60%,50% 100%);
clip-path:polygon(0 60%,50% 0,100% 60%,50% 100%);
}
.sea .dolphin .front_fin {
width:21px;
height:8px;
background:red;
-webkit-transform:translate(-3px,20px) translateZ(-5px) rotateX(-10deg);
transform:translate(-3px,20px) translateZ(-5px) rotateX(-10deg);
-webkit-clip-path:polygon(0 0,100% 0,50% 100%);
clip-path:polygon(0 0,100% 0,50% 100%);
}
.sea .dolphin .back_fin {
width:25px;
height:6px;
background:green;
-webkit-transform:translate(-5px,-5px) translateZ(0px) rotateX(20deg);
transform:translate(-5px,-5px) translateZ(0px) rotateX(20deg);
-webkit-clip-path:polygon(0 0,100% 0,50% 100%);
clip-path:polygon(0 0,100% 0,50% 100%);
}
.sea .wave {
position:relative;
width:500px;
height:20px;
background:rgba(0,0,255,0.25);
}
.sea .wave:nth-child(1) {
-webkit-animation:wavey 2500ms -300ms ease-in-out infinite alternate;
animation:wavey 2500ms -300ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(1)::before {
content:'';
position:absolute;
left:35%;
width:122px;
height:118%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -2987ms linear infinite;
animation:light 5000ms -2987ms linear infinite;
}
.sea .wave:nth-child(1)::after {
content:'';
position:absolute;
left:51%;
width:136px;
height:54%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -7712ms linear infinite;
animation:light 5000ms -7712ms linear infinite;
}
.sea .wave:nth-child(2) {
-webkit-animation:wavey 2500ms -600ms ease-in-out infinite alternate;
animation:wavey 2500ms -600ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(2)::before {
content:'';
position:absolute;
left:79%;
width:126px;
height:154%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5434ms linear infinite;
animation:light 5000ms -5434ms linear infinite;
}
.sea .wave:nth-child(2)::after {
content:'';
position:absolute;
left:59%;
width:115px;
height:220%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8962ms linear infinite;
animation:light 5000ms -8962ms linear infinite;
}
.sea .wave:nth-child(3) {
-webkit-animation:wavey 2500ms -900ms ease-in-out infinite alternate;
animation:wavey 2500ms -900ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(3)::before {
content:'';
position:absolute;
left:23%;
width:184px;
height:279%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6510ms linear infinite;
animation:light 5000ms -6510ms linear infinite;
}
.sea .wave:nth-child(3)::after {
content:'';
position:absolute;
left:25%;
width:189px;
height:82%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8442ms linear infinite;
animation:light 5000ms -8442ms linear infinite;
}
.sea .wave:nth-child(4) {
-webkit-animation:wavey 2500ms -1200ms ease-in-out infinite alternate;
animation:wavey 2500ms -1200ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(4)::before {
content:'';
position:absolute;
left:19%;
width:179px;
height:326%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1740ms linear infinite;
animation:light 5000ms -1740ms linear infinite;
}
.sea .wave:nth-child(4)::after {
content:'';
position:absolute;
left:87%;
width:155px;
height:343%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5553ms linear infinite;
animation:light 5000ms -5553ms linear infinite;
}
.sea .wave:nth-child(5) {
-webkit-animation:wavey 2500ms -1500ms ease-in-out infinite alternate;
animation:wavey 2500ms -1500ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(5)::before {
content:'';
position:absolute;
left:69%;
width:193px;
height:245%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6207ms linear infinite;
animation:light 5000ms -6207ms linear infinite;
}
.sea .wave:nth-child(5)::after {
content:'';
position:absolute;
left:74%;
width:162px;
height:182%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8218ms linear infinite;
animation:light 5000ms -8218ms linear infinite;
}
.sea .wave:nth-child(6) {
-webkit-animation:wavey 2500ms -1800ms ease-in-out infinite alternate;
animation:wavey 2500ms -1800ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(6)::before {
content:'';
position:absolute;
left:55%;
width:159px;
height:188%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -2946ms linear infinite;
animation:light 5000ms -2946ms linear infinite;
}
.sea .wave:nth-child(6)::after {
content:'';
position:absolute;
left:48%;
width:199px;
height:112%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9842ms linear infinite;
animation:light 5000ms -9842ms linear infinite;
}
.sea .wave:nth-child(7) {
-webkit-animation:wavey 2500ms -2100ms ease-in-out infinite alternate;
animation:wavey 2500ms -2100ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(7)::before {
content:'';
position:absolute;
left:25%;
width:188px;
height:169%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6112ms linear infinite;
animation:light 5000ms -6112ms linear infinite;
}
.sea .wave:nth-child(7)::after {
content:'';
position:absolute;
left:70%;
width:170px;
height:205%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -3975ms linear infinite;
animation:light 5000ms -3975ms linear infinite;
}
.sea .wave:nth-child(8) {
-webkit-animation:wavey 2500ms -2400ms ease-in-out infinite alternate;
animation:wavey 2500ms -2400ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(8)::before {
content:'';
position:absolute;
left:82%;
width:179px;
height:310%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8530ms linear infinite;
animation:light 5000ms -8530ms linear infinite;
}
.sea .wave:nth-child(8)::after {
content:'';
position:absolute;
left:63%;
width:113px;
height:329%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5087ms linear infinite;
animation:light 5000ms -5087ms linear infinite;
}
.sea .wave:nth-child(9) {
-webkit-animation:wavey 2500ms -2700ms ease-in-out infinite alternate;
animation:wavey 2500ms -2700ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(9)::before {
content:'';
position:absolute;
left:41%;
width:120px;
height:137%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -2571ms linear infinite;
animation:light 5000ms -2571ms linear infinite;
}
.sea .wave:nth-child(9)::after {
content:'';
position:absolute;
left:30%;
width:133px;
height:215%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6227ms linear infinite;
animation:light 5000ms -6227ms linear infinite;
}
.sea .wave:nth-child(10) {
-webkit-animation:wavey 2500ms -3000ms ease-in-out infinite alternate;
animation:wavey 2500ms -3000ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(10)::before {
content:'';
position:absolute;
left:19%;
width:113px;
height:95%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5028ms linear infinite;
animation:light 5000ms -5028ms linear infinite;
}
.sea .wave:nth-child(10)::after {
content:'';
position:absolute;
left:52%;
width:193px;
height:192%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8659ms linear infinite;
animation:light 5000ms -8659ms linear infinite;
}
.sea .wave:nth-child(11) {
-webkit-animation:wavey 2500ms -3300ms ease-in-out infinite alternate;
animation:wavey 2500ms -3300ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(11)::before {
content:'';
position:absolute;
left:63%;
width:153px;
height:306%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1680ms linear infinite;
animation:light 5000ms -1680ms linear infinite;
}
.sea .wave:nth-child(11)::after {
content:'';
position:absolute;
left:40%;
width:151px;
height:84%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1881ms linear infinite;
animation:light 5000ms -1881ms linear infinite;
}
.sea .wave:nth-child(12) {
-webkit-animation:wavey 2500ms -3600ms ease-in-out infinite alternate;
animation:wavey 2500ms -3600ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(12)::before {
content:'';
position:absolute;
left:44%;
width:193px;
height:309%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -409ms linear infinite;
animation:light 5000ms -409ms linear infinite;
}
.sea .wave:nth-child(12)::after {
content:'';
position:absolute;
left:61%;
width:116px;
height:143%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1234ms linear infinite;
animation:light 5000ms -1234ms linear infinite;
}
.sea .wave:nth-child(13) {
-webkit-animation:wavey 2500ms -3900ms ease-in-out infinite alternate;
animation:wavey 2500ms -3900ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(13)::before {
content:'';
position:absolute;
left:75%;
width:155px;
height:262%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1660ms linear infinite;
animation:light 5000ms -1660ms linear infinite;
}
.sea .wave:nth-child(13)::after {
content:'';
position:absolute;
left:22%;
width:159px;
height:178%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5818ms linear infinite;
animation:light 5000ms -5818ms linear infinite;
}
.sea .wave:nth-child(14) {
-webkit-animation:wavey 2500ms -4200ms ease-in-out infinite alternate;
animation:wavey 2500ms -4200ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(14)::before {
content:'';
position:absolute;
left:12%;
width:133px;
height:312%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9853ms linear infinite;
animation:light 5000ms -9853ms linear infinite;
}
.sea .wave:nth-child(14)::after {
content:'';
position:absolute;
left:44%;
width:178px;
height:244%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5356ms linear infinite;
animation:light 5000ms -5356ms linear infinite;
}
.sea .wave:nth-child(15) {
-webkit-animation:wavey 2500ms -4500ms ease-in-out infinite alternate;
animation:wavey 2500ms -4500ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(15)::before {
content:'';
position:absolute;
left:88%;
width:193px;
height:132%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1877ms linear infinite;
animation:light 5000ms -1877ms linear infinite;
}
.sea .wave:nth-child(15)::after {
content:'';
position:absolute;
left:74%;
width:179px;
height:344%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -3799ms linear infinite;
animation:light 5000ms -3799ms linear infinite;
}
.sea .wave:nth-child(16) {
-webkit-animation:wavey 2500ms -4800ms ease-in-out infinite alternate;
animation:wavey 2500ms -4800ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(16)::before {
content:'';
position:absolute;
left:70%;
width:118px;
height:123%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9056ms linear infinite;
animation:light 5000ms -9056ms linear infinite;
}
.sea .wave:nth-child(16)::after {
content:'';
position:absolute;
left:11%;
width:170px;
height:313%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -4078ms linear infinite;
animation:light 5000ms -4078ms linear infinite;
}
.sea .wave:nth-child(17) {
-webkit-animation:wavey 2500ms -5100ms ease-in-out infinite alternate;
animation:wavey 2500ms -5100ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(17)::before {
content:'';
position:absolute;
left:10%;
width:154px;
height:208%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -7291ms linear infinite;
animation:light 5000ms -7291ms linear infinite;
}
.sea .wave:nth-child(17)::after {
content:'';
position:absolute;
left:48%;
width:162px;
height:150%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -4830ms linear infinite;
animation:light 5000ms -4830ms linear infinite;
}
.sea .wave:nth-child(18) {
-webkit-animation:wavey 2500ms -5400ms ease-in-out infinite alternate;
animation:wavey 2500ms -5400ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(18)::before {
content:'';
position:absolute;
left:83%;
width:175px;
height:82%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6625ms linear infinite;
animation:light 5000ms -6625ms linear infinite;
}
.sea .wave:nth-child(18)::after {
content:'';
position:absolute;
left:48%;
width:106px;
height:165%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -4565ms linear infinite;
animation:light 5000ms -4565ms linear infinite;
}
.sea .wave:nth-child(19) {
-webkit-animation:wavey 2500ms -5700ms ease-in-out infinite alternate;
animation:wavey 2500ms -5700ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(19)::before {
content:'';
position:absolute;
left:45%;
width:116px;
height:336%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -7216ms linear infinite;
animation:light 5000ms -7216ms linear infinite;
}
.sea .wave:nth-child(19)::after {
content:'';
position:absolute;
left:79%;
width:180px;
height:200%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9513ms linear infinite;
animation:light 5000ms -9513ms linear infinite;
}
.sea .wave:nth-child(20) {
-webkit-animation:wavey 2500ms -6000ms ease-in-out infinite alternate;
animation:wavey 2500ms -6000ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(20)::before {
content:'';
position:absolute;
left:29%;
width:174px;
height:326%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1524ms linear infinite;
animation:light 5000ms -1524ms linear infinite;
}
.sea .wave:nth-child(20)::after {
content:'';
position:absolute;
left:54%;
width:101px;
height:190%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -7981ms linear infinite;
animation:light 5000ms -7981ms linear infinite;
}
.sea .wave:nth-child(21) {
-webkit-animation:wavey 2500ms -6300ms ease-in-out infinite alternate;
animation:wavey 2500ms -6300ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(21)::before {
content:'';
position:absolute;
left:84%;
width:111px;
height:262%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8939ms linear infinite;
animation:light 5000ms -8939ms linear infinite;
}
.sea .wave:nth-child(21)::after {
content:'';
position:absolute;
left:63%;
width:137px;
height:60%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9692ms linear infinite;
animation:light 5000ms -9692ms linear infinite;
}
.sea .wave:nth-child(22) {
-webkit-animation:wavey 2500ms -6600ms ease-in-out infinite alternate;
animation:wavey 2500ms -6600ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(22)::before {
content:'';
position:absolute;
left:22%;
width:102px;
height:215%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1517ms linear infinite;
animation:light 5000ms -1517ms linear infinite;
}
.sea .wave:nth-child(22)::after {
content:'';
position:absolute;
left:17%;
width:164px;
height:75%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5971ms linear infinite;
animation:light 5000ms -5971ms linear infinite;
}
.sea .wave:nth-child(23) {
-webkit-animation:wavey 2500ms -6900ms ease-in-out infinite alternate;
animation:wavey 2500ms -6900ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(23)::before {
content:'';
position:absolute;
left:45%;
width:182px;
height:60%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6573ms linear infinite;
animation:light 5000ms -6573ms linear infinite;
}
.sea .wave:nth-child(23)::after {
content:'';
position:absolute;
left:86%;
width:194px;
height:181%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -2824ms linear infinite;
animation:light 5000ms -2824ms linear infinite;
}
.sea .wave:nth-child(24) {
-webkit-animation:wavey 2500ms -7200ms ease-in-out infinite alternate;
animation:wavey 2500ms -7200ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(24)::before {
content:'';
position:absolute;
left:46%;
width:176px;
height:74%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9346ms linear infinite;
animation:light 5000ms -9346ms linear infinite;
}
.sea .wave:nth-child(24)::after {
content:'';
position:absolute;
left:22%;
width:113px;
height:337%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -4697ms linear infinite;
animation:light 5000ms -4697ms linear infinite;
}
.sea .wave:nth-child(25) {
-webkit-animation:wavey 2500ms -7500ms ease-in-out infinite alternate;
animation:wavey 2500ms -7500ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(25)::before {
content:'';
position:absolute;
left:64%;
width:173px;
height:262%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8539ms linear infinite;
animation:light 5000ms -8539ms linear infinite;
}
.sea .wave:nth-child(25)::after {
content:'';
position:absolute;
left:74%;
width:169px;
height:320%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -8914ms linear infinite;
animation:light 5000ms -8914ms linear infinite;
}
.sea .wave:nth-child(26) {
-webkit-animation:wavey 2500ms -7800ms ease-in-out infinite alternate;
animation:wavey 2500ms -7800ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(26)::before {
content:'';
position:absolute;
left:37%;
width:109px;
height:114%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9481ms linear infinite;
animation:light 5000ms -9481ms linear infinite;
}
.sea .wave:nth-child(26)::after {
content:'';
position:absolute;
left:27%;
width:112px;
height:305%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1769ms linear infinite;
animation:light 5000ms -1769ms linear infinite;
}
.sea .wave:nth-child(27) {
-webkit-animation:wavey 2500ms -8100ms ease-in-out infinite alternate;
animation:wavey 2500ms -8100ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(27)::before {
content:'';
position:absolute;
left:16%;
width:149px;
height:88%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -3883ms linear infinite;
animation:light 5000ms -3883ms linear infinite;
}
.sea .wave:nth-child(27)::after {
content:'';
position:absolute;
left:79%;
width:163px;
height:106%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5177ms linear infinite;
animation:light 5000ms -5177ms linear infinite;
}
.sea .wave:nth-child(28) {
-webkit-animation:wavey 2500ms -8400ms ease-in-out infinite alternate;
animation:wavey 2500ms -8400ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(28)::before {
content:'';
position:absolute;
left:38%;
width:175px;
height:322%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -992ms linear infinite;
animation:light 5000ms -992ms linear infinite;
}
.sea .wave:nth-child(28)::after {
content:'';
position:absolute;
left:36%;
width:115px;
height:129%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -3279ms linear infinite;
animation:light 5000ms -3279ms linear infinite;
}
.sea .wave:nth-child(29) {
-webkit-animation:wavey 2500ms -8700ms ease-in-out infinite alternate;
animation:wavey 2500ms -8700ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(29)::before {
content:'';
position:absolute;
left:23%;
width:182px;
height:120%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1070ms linear infinite;
animation:light 5000ms -1070ms linear infinite;
}
.sea .wave:nth-child(29)::after {
content:'';
position:absolute;
left:1%;
width:126px;
height:317%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -628ms linear infinite;
animation:light 5000ms -628ms linear infinite;
}
.sea .wave:nth-child(30) {
-webkit-animation:wavey 2500ms -9000ms ease-in-out infinite alternate;
animation:wavey 2500ms -9000ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(30)::before {
content:'';
position:absolute;
left:79%;
width:191px;
height:100%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -4220ms linear infinite;
animation:light 5000ms -4220ms linear infinite;
}
.sea .wave:nth-child(30)::after {
content:'';
position:absolute;
left:59%;
width:186px;
height:118%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -1951ms linear infinite;
animation:light 5000ms -1951ms linear infinite;
}
.sea .wave:nth-child(31) {
-webkit-animation:wavey 2500ms -9300ms ease-in-out infinite alternate;
animation:wavey 2500ms -9300ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(31)::before {
content:'';
position:absolute;
left:76%;
width:183px;
height:113%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5011ms linear infinite;
animation:light 5000ms -5011ms linear infinite;
}
.sea .wave:nth-child(31)::after {
content:'';
position:absolute;
left:71%;
width:130px;
height:334%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -3880ms linear infinite;
animation:light 5000ms -3880ms linear infinite;
}
.sea .wave:nth-child(32) {
-webkit-animation:wavey 2500ms -9600ms ease-in-out infinite alternate;
animation:wavey 2500ms -9600ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(32)::before {
content:'';
position:absolute;
left:25%;
width:168px;
height:330%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6987ms linear infinite;
animation:light 5000ms -6987ms linear infinite;
}
.sea .wave:nth-child(32)::after {
content:'';
position:absolute;
left:17%;
width:157px;
height:73%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -3320ms linear infinite;
animation:light 5000ms -3320ms linear infinite;
}
.sea .wave:nth-child(33) {
-webkit-animation:wavey 2500ms -9900ms ease-in-out infinite alternate;
animation:wavey 2500ms -9900ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(33)::before {
content:'';
position:absolute;
left:66%;
width:116px;
height:55%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -7758ms linear infinite;
animation:light 5000ms -7758ms linear infinite;
}
.sea .wave:nth-child(33)::after {
content:'';
position:absolute;
left:28%;
width:130px;
height:111%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -2563ms linear infinite;
animation:light 5000ms -2563ms linear infinite;
}
.sea .wave:nth-child(34) {
-webkit-animation:wavey 2500ms -10200ms ease-in-out infinite alternate;
animation:wavey 2500ms -10200ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(34)::before {
content:'';
position:absolute;
left:19%;
width:127px;
height:103%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -2781ms linear infinite;
animation:light 5000ms -2781ms linear infinite;
}
.sea .wave:nth-child(34)::after {
content:'';
position:absolute;
left:29%;
width:154px;
height:137%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -4241ms linear infinite;
animation:light 5000ms -4241ms linear infinite;
}
.sea .wave:nth-child(35) {
-webkit-animation:wavey 2500ms -10500ms ease-in-out infinite alternate;
animation:wavey 2500ms -10500ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(35)::before {
content:'';
position:absolute;
left:47%;
width:138px;
height:51%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6766ms linear infinite;
animation:light 5000ms -6766ms linear infinite;
}
.sea .wave:nth-child(35)::after {
content:'';
position:absolute;
left:73%;
width:159px;
height:109%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -7526ms linear infinite;
animation:light 5000ms -7526ms linear infinite;
}
.sea .wave:nth-child(36) {
-webkit-animation:wavey 2500ms -10800ms ease-in-out infinite alternate;
animation:wavey 2500ms -10800ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(36)::before {
content:'';
position:absolute;
left:21%;
width:179px;
height:348%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -7042ms linear infinite;
animation:light 5000ms -7042ms linear infinite;
}
.sea .wave:nth-child(36)::after {
content:'';
position:absolute;
left:32%;
width:119px;
height:98%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -3380ms linear infinite;
animation:light 5000ms -3380ms linear infinite;
}
.sea .wave:nth-child(37) {
-webkit-animation:wavey 2500ms -11100ms ease-in-out infinite alternate;
animation:wavey 2500ms -11100ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(37)::before {
content:'';
position:absolute;
left:2%;
width:128px;
height:278%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -4045ms linear infinite;
animation:light 5000ms -4045ms linear infinite;
}
.sea .wave:nth-child(37)::after {
content:'';
position:absolute;
left:3%;
width:189px;
height:162%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -5056ms linear infinite;
animation:light 5000ms -5056ms linear infinite;
}
.sea .wave:nth-child(38) {
-webkit-animation:wavey 2500ms -11400ms ease-in-out infinite alternate;
animation:wavey 2500ms -11400ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(38)::before {
content:'';
position:absolute;
left:27%;
width:138px;
height:282%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.3) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -6432ms linear infinite;
animation:light 5000ms -6432ms linear infinite;
}
.sea .wave:nth-child(38)::after {
content:'';
position:absolute;
left:13%;
width:188px;
height:94%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.1)),to(rgba(255,255,255,0)));
background:linear-gradient(to right,rgba(255,255,255,0) 0%,rgba(255,255,255,0.1) 30%,rgba(255,255,255,0) 100%);
-webkit-transform-origin:0 0;
transform-origin:0 0;
-webkit-transform:rotateY(50deg);
transform:rotateY(50deg);
-webkit-animation:light 5000ms -9993ms linear infinite;
animation:light 5000ms -9993ms linear infinite;
}
.sea .wave:nth-child(39) {
-webkit-animation:wavey 2500ms -11700ms ease-in-out infinite alternate;
animation:wavey 2500ms -11700ms ease-in-out infinite alternate;
}
.sea .wave:nth-child(39)::before {
content:'';
position:absolute;
left:57%;
width:183px;
height:191%;
background:-webkit-gradient(linear,left top,right top,from(rgba(255,255,255,0)),color-stop(30%,rgba(255,255,255,0.3)),to(rgba(255,255,255,0)));
background:linear-gradient(t.........完整代码请登录后点击上方下载按钮下载查看
热门代码搜索
其他语言代码库
Html代码库
Python代码库
Java代码库
Php代码库
Phpcli代码库
Golang代码库
C#代码库
Nodejs代码库
C代码库
C++代码库
Sql代码库
R代码库
Rust代码库
Ruby代码库
Dart代码库
Vb代码库
D代码库
F#代码库
Typescript代码库
Coffeescript代码库
Julia代码库
Kotlin代码库
Perl代码库
Groovy代码库
Lua代码库
Vala代码库
Ocaml代码库
Assembly代码库
Objectc代码库
Scala代码库
Erlang代码库
Pascal代码库
Swift代码库
Fortran代码库
Bash代码库
Clojure代码库
Ada代码库
Elixir代码库
Cobol代码库
Haskell代码库
Nim代码库
Racket代码库
Lisp代码库
网友评论0