.sunset{width:500px;height:400px;position:relative}.sunset .sun{width:265px;height:132.5px;border-top-left-radius:530px;border-top-right-radius:530px;background:-webkit-gradient(linear,left top,left bottom,from(#f4d06d),color-stop(30%,#f4d06d),color-stop(74%,#eca565),to(#e2645a));background:linear-gradient(180deg,#f4d06d,#f4d06d 30%,#eca565 74%,#e2645a);left:50%;margin-left:-132.5px;bottom:0;position:absolute}.sunset .cloud{position:absolute;z-index:999;display:-webkit-inline-box;display:-ms-inline-flexbox;display:inline-flex;-webkit-box-align:end;-ms-flex-align:end;align-items:flex-end;bottom:0;-webkit-animation:cloud-move;animation:cloud-move;-webkit-animation-timing-function:linear;animation-timing-function:linear;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite}.sunset .cloud:after,.sunset .cloud:before{content:"";width:0;height:0;background:#feffd5}.sunset .cloud:before{display:block;width:60px;height:30px;border-top-left-radius:120px;border-top-right-radius:120px}.sunset .cloud--reverse{-webkit-box-orient:horizontal;-webkit-box-direction:reverse;-ms-flex-direction:row-reverse;flex-direction:row-reverse}.sunset .cloud--double:after{display:block;width:35px;height:17.5px;border-top-left-radius:70px;border-top-right-radius:70px}.sunset .cloud--1{left:35%;-webkit-animation-duration:10s;animation-duration:10s}.sunset .cloud--2{left:60%;-webkit-transform:scale(1.5);transform:scale(1.5);-webkit-transform-origin:bottom center;transform-origin:bottom center;animation-direction:reverse;-webkit-animation-duration:11s;animation-duration:11s}.sunset .cloud--3{left:40%;bottom:200%;-webkit-transform:scale(1.4);transform:scale(1.4);-webkit-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-duration:14s;animation-duration:14s}.sunset .cloud--4{left:40%;bottom:100%;-webkit-transform:scale(1.2);transform:scale(1.2);-webkit-transform-origin:bottom center;transform-origin:bottom center;animation-direction:reverse;-webkit-animation-duration:12s;animation-duration:12s}.sunset .cloud--5{left:23%;bottom:40%;-webkit-transform:scale(1.5);transform:scale(1.5);-webkit-transform-origin:bottom center;transform-origin:bottom center;-webkit-animation-duration:13s;animation-duration:13s}.sunset .background-line{margin-left:auto;margin-right:auto;width:100%;margin-bottom:20px}.sunset .background-line--sky{background:#e2645a}.sunset .background-line--sea{background:#8ca6fb}.sunset .background-line--contains-sun,.sunset .background-line--has-clouds{position:relative}.sunset .background-line:first-child{width:100px;height:11.22449px;border-radius:11.22449px}.sunset .background-line:first-child,.sunset .background-line:nth-child(2){-webkit-animation:line-move;animation:line-move;-webkit-animation-duration:4s;animation-duration:4s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}.sunset .background-line:nth-child(2){width:250px;height:14.59184px;border-radius:14.59184px;animation-direction:alternate-reverse}.sunset .background-line:nth-child(3){width:340px;height:20.20408px;border-radius:20.20408px}.sunset .background-line:nth-child(3),.sunset .background-line:nth-child(4){-webkit-animation:line-move;animation:line-move;-webkit-animation-duration:4s;animation-duration:4s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}.sunset .background-line:nth-child(4){width:400px;height:28.06122px;border-radius:28.06122px;animation-direction:alternate-reverse}.sunset .background-line:nth-child(5){width:450px;height:37.04082px;border-radius:37.04082px;-webkit-animation:line-move;animation:line-move;-webkit-animation-duration:4s;animation-duration:4s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}.sunset .background-line:nth-child(6){width:500px;height:42.65306px;border-radius:42.65306px}.sunset .background-line:nth-child(7){width:450px;height:37.04082px;border-radius:37.04082px}.sunset .background-line:nth-child(7),.sunset .background-line:nth-child(8){-webkit-animation:line-move;animation:line-move;-webkit-animation-duration:4s;animation-duration:4s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}.sunset .background-line:nth-child(8){width:250px;height:12.34694px;border-radius:12.34694px;animation-direction:alternate-reverse}.sunset .background-line:nth-child(9){width:200px;height:8.97959px;border-radius:8.97959px}.sunset .background-line:nth-child(9),.sunset .background-line:nth-child(10){-webkit-animation:line-move;animation:line-move;-webkit-animation-duration:4s;animation-duration:4s;-webkit-animation-timing-function:ease-in-out;animation-timing-function:ease-in-out;-webkit-animation-iteration-count:infinite;animation-iteration-count:infinite;-webkit-animation-direction:alternate;animation-direction:alternate}.sunset .background-line:nth-child(10){width:50px;height:7.85714px;border-radius:7.85714px;animation-direction:alternate-reverse}.sunset .background-line:last-child{margin-bottom:0}@-webkit-keyframes line-move{0%{-webkit-transform:translateX(0);transform:translateX(0)}to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}@keyframes line-move{0%{-webkit-transform:translateX(0);transform:translateX(0)}to{-webkit-transform:translateX(-10px);transform:translateX(-10px)}}@-webkit-keyframes cloud-move{0%{margin-left:-50%;opacity:0}33%{margin-left:-17%;opacity:1}66%{margin-left:17%;opacity:1}to{margin-left:50%;opacity:0}}@keyframes cloud-move{0%{margin-left:-50%;opacity:0}33%{margin-left:-17%;opacity:1}66%{margin-left:17%;opacity:1}to{margin-left:50%;opacity:0}}body{padding:0;margin:0;font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#3e4b69;overflow:hidden}#app,body{min-height:100vh}#app{width:100vw;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}