b.css

#p-2 .i2,#p-2 .i3,#p-2 .i4{animation:r 10s infinite ease-in}body{margin:0;background-color:#C6537D;font-family:"Hoefler Text","Baskerville Old Face",Garamond,Georgia,serif}article,aside,details,figcaption,figure,footer,header,main,menu,nav,section,summary{display:block}body,html{height:100%}a:focus{outline:#000 solid 2px}section{width:100%;color:#fff}section .c{max-width:1260px;padding:30px 0}@media all{body{background-color:#fff}section{min-height:100%;min-height:100vh;display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;overflow:hidden;position:relative}section .c{display:-ms-flexbox;display:flex;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;-ms-flex-direction:column;flex-direction:column}}@media screen and (min-width:1260px){section .c{margin:0 auto}}section .l{font-size:18px;font-size:1.125rem}@media screen and (min-width:50em){section .l{font-size:27px;font-size:1.6875rem}}section .t{text-shadow:0 1px 1px rgba(0,0,0,.2);font-size:22px;font-size:1.375rem;line-height:1.5;padding:1.875rem}section .i>svg{width:100%;height:100%}section .i,section .t{position:relative}section .b,section .b>svg{position:absolute}section .b{top:0;right:0;bottom:0;left:0}#p-1{background:#C6537D}@media screen and (min-width:50em){section .t{font-size:33px;font-size:2.0625rem;line-height:1.3}#p-1 .c{-ms-flex-direction:row;flex-direction:row}#p-1 .i,#p-1 .t{width:50%}#p-1 .i{float:right}}#p-1 .i1{fill:#d98ca8}#p-1 .i2{fill:#ad3963}#p-1 .i3{fill:#c95b83;color:#602037}#p-1 .i4{fill:#C6537D}#p-2{background:#E37544}#p-2 .c{-ms-flex-direction:column-reverse;flex-direction:column-reverse}#p-2 .i{-ms-flex-item-align:end;align-self:flex-end}#p-3 .i,#p-4 .i{align-self:stretch}#p-2 .i>svg{max-width:300px;width:50%;float:right}#p-2 .i1{fill:#cb541e;fill:rgba(255,255,255,.2)}#p-2 .i2,#p-2 .i3,#p-2 .i4,#p-2 .i5,#p-2 .i6,#p-2 .i7,#p-2 .i8,#p-2 .i9{stroke:#cb541e;stroke:rgba(255,255,255,.2);stroke-width:10}#p-2 .i3{animation-delay:2s;animation-direction:reverse}#p-2 .i4{animation-delay:4s}#p-2 .i5{animation:r 10s infinite ease-in;animation-delay:6s;animation-direction:reverse}@keyframes r{0%,80%{stroke-dashoffset:0;stroke-dasharray:40 20}100%{stroke-dashoffset:60;stroke-dasharray:40 20}}#p-3{background:#5B9A52}#p-3 .c{-ms-flex-direction:column;flex-direction:column}#p-3 .i{-ms-flex-item-align:stretch}#p-3 .i1{fill:#3e6837}#p-3 .i2{fill:#477940;color:#34572f}#p-3 .i3{fill:#6dac63}#p-3 .i4{fill:#4f8647}#p-3 .i5{fill:#477940}#p-4{background:#2BA292}#p-4 .c{-ms-flex-direction:column-reverse;flex-direction:column-reverse}#p-4 .i{-ms-flex-item-align:stretch}#p-4 .i1{stroke:#30b6a4;stroke:rgba(255,255,255,.1);stroke-width:5}@media screen and (min-width:800px){#p-4 .i1{stroke-width:7}}#p-4 .i2{fill:#207a6e;fill:rgba(0,0,0,.1)}#p-4 .i3{fill:#30b6a4;fill:rgba(255,255,255,.1)}#p-4 .i4{fill:#258a7c;fill:rgba(0,0,0,.06)}#p-4 .i5{fill:#2daa99;fill:rgba(255,255,255,.06)}#p-5{background:#3A97D6}#p-5 .c{-ms-flex-direction:column;flex-direction:column}@media screen and (min-width:50em){#p-2 .i>svg{width:100%}#p-3 .i>svg{float:right;max-width:800px}#p-4 .i{width:100%}#p-5 .c{-ms-flex-direction:row;flex-direction:row}#p-5 .t{width:60%}#p-5 .i{width:40%}#p-6 .i{width:100%}}#p-5 .i1{fill:#267cb7}#p-5 .i2,#p-5 .i3,#p-5 .i4{fill:#64addf}#p-6{background:#286B95}#p-6 .c{-ms-flex-direction:column-reverse;flex-direction:column-reverse}#p-6 .i>svg{float:right;max-width:220px}#p-6 .i1{fill:#3388bd}#p-6 .i2{fill:#52a0d1;color:#235d81}#p-6 .b1{fill:#5aa4d3;top:50%;right:3%;opacity:.4}#p-6 .b2{fill:#4a9cce;top:15%;left:20%;opacity:.6}#p-6 .b3{fill:#66abd6;top:70%;left:50%;opacity:.4}#p-7{background:#556A9F}@media screen and (min-width:50em){#p-7 .c{-ms-flex-direction:row;flex-direction:row}#p-7 .t{width:70%}#p-7 .i{width:30%}}#p-7 .i{-ms-flex-item-align:end;align-self:flex-end}#p-7 .i>svg{max-width:250px}#p-7 .i1{fill:#43547e;fill:rgba(0,0,0,.1)}#p-7 .i2{fill:#6277ab;fill:rgba(255,255,255,.2)}#p-7 .b1{fill:rgba(255,255,255,.22);top:20%;right:15%}#p-7 .b2{fill:rgba(255,255,255,.18);top:10%;left:5%}#p-7 .b3{fill:rgba(255,255,255,.25);top:27%;left:50%}#p-8{background:#43537D}#p-8 .c{-ms-flex-direction:column-reverse;flex-direction:column-reverse}#p-8 .i{-ms-flex-item-align:stretch;align-self:stretch}#p-8 .i1{stroke:#fff;stroke-width:5}#p-9{background:#5F4F85}@media screen and (min-width:50em){#p-8 .i{width:100%}#p-8 .i1{stroke-width:3}#p-9 .c{-ms-flex-direction:row;flex-direction:row}#p-9 .i,#p-9 .t{width:50%}}#p-9 .i{-ms-flex-item-align:end;align-self:flex-end}#p-9 .i>svg{max-width:350px}#p-9 .i1{fill:#7764a3}#p-9 .i2{fill:#483c65}#p-9 .i3{fill:#7764a3;color:#483c65}#p-10{background:#7B498E}#p-10 .c{-ms-flex-direction:column-reverse;flex-direction:column-reverse}#p-10 .i1{fill:#41264b;animation:zC 3s infinite;animation-fill-mode:forwards}#p-10 .i2{fill:#4f2f5b;animation:zB 3s infinite;animation-fill-mode:forwards}#p-10 .i3{fill:#5e386c;animation:zA 3s infinite;animation-fill-mode:forwards}@keyframes zA{0%,100%,50%{opacity:0}25%{opacity:1}}@keyframes zB{0%,100%,25%,75%{opacity:0}50%{opacity:1}}@keyframes zC{0%,100%,50%{opacity:0}75%{opacity:1}}