CodePen Embed - Triangles Animation

<div class="title-block">
    <h1 class="title"> BUILD. CREATE. ACCELERATE. </h1>
</div>

<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 19.2.1, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<svg version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
   viewBox="0 0 2450.7 1343.9" style="enable-background:new 0 0 2450.7 1343.9;" xml:space="preserve">
<style type="text/css">
  .st0{opacity:0.2;fill:#6EBECE;}
  .st1{opacity:0.2;fill:#04738A;}
  .st2{opacity:0.2;fill:#03496A;}
  .st3{opacity:0.2;fill:#0F97A1;}
  .st4{opacity:0.2;fill:#10596B;}
  .st5{opacity:0.2;fill:#0E5767;}
  .st6{opacity:0.5;fill:#46C1C6;}
  .st7{opacity:0.5;fill:#6AAECC;}
  .st8{opacity:0.2;fill:none;stroke:#24898E;stroke-miterlimit:10;}
  .st9{opacity:0.2;fill:#06546F;}
  .st10{opacity:0.2;fill:#3D9FBE;}
  .st11{opacity:0.2;fill:#064C6A;}
  .st12{opacity:0.2;fill:#047080;}
  .st13{opacity:0.2;fill:#0C638B;}
  .st14{opacity:0.5;fill:#106068;}
  .st15{opacity:0.5;fill:#1A737C;}
  .st16{opacity:0.5;fill:#1A8799;}
  .st17{opacity:0.5;fill:#1A848E;}
  .st18{opacity:0.5;fill:#5FC6C7;}
  .st19{opacity:0.5;fill:#0F5C63;}
  .st20{opacity:0.5;fill:#2694A0;}
  .st21{opacity:0.5;fill:#0A6481;}
  .st22{opacity:0.5;fill:#57B9CF;}
  .st23{opacity:0.5;fill:#0B526C;}
  .st24{opacity:0.5;fill:#0F7F8A;}
  .st25{opacity:0.5;fill:#11636C;}
  .st26{opacity:0.5;fill:#0B8898;}
  .st27{opacity:0.2;fill:#0B676A;}
  .st28{opacity:5.000000e-02;fill:none;stroke:#24898E;stroke-miterlimit:10;}
  .st29{opacity:0.5;fill:#208899;}
  .st30{opacity:0.5;fill:#279AA6;}
  .st31{opacity:0.5;fill:#167383;}
  .st32{opacity:0.5;fill:#2A9AA6;}
  .st33{opacity:0.5;fill:#1C8E78;}
    .st0{opacity:0.5;fill:#106068;} .st1{opacity:0.5;fill:#1A737C;} .st2{opacity:0.5;fill:#1A8799;} .st3{opacity:0.5;fill:#5FC6C7;} .st4{opacity:0.5;fill:#1A848E;} .st5{opacity:0.5;fill:#208899;} .st6{opacity:0.5;fill:#279AA6;} .st7{opacity:0.5;fill:#0F5C63;} .st8{opacity:0.5;fill:#2694A0;} .st9{opacity:0.5;fill:#167383;} .st10{opacity:0.5;fill:#2A9AA6;} .st11{opacity:0.5;fill:#1C8E78;} .st12{opacity:0.5;fill:#137260;} .st13{opacity:0.3;fill:#6EBECE;} .st14{opacity:0.3;fill:#04738A;} .st15{opacity:0.3;fill:#03496A;} .st16{opacity:0.5;fill:#0A6481;} .st17{opacity:0.5;fill:#57B9CF;} .st18{opacity:0.5;fill:#45B3C5;} .st19{opacity:0.5;fill:#0B526C;} .st20{opacity:0.5;fill:#0F7F8A;} .st21{opacity:0.5;fill:#11636C;} .st22{opacity:0.5;fill:#0B8898;} .st23{opacity:0.3;fill:#0B676A;} .st24{opacity:0.3;fill:#0F97A1;} .st25{opacity:0.3;fill:#10596B;} .st26{opacity:0.3;fill:#0E5767;} .st27{opacity:0.3;fill:#64BFBF;} .st28{opacity:0.3;fill:#2B8383;} .st29{opacity:0.3;fill:#46C1C6;} .st30{opacity:0.3;fill:#206462;} .st31{opacity:0.5;fill:#46C1C6;} .st32{opacity:0.5;fill:#6AAECC;} .st33{opacity:0.3;fill:none;stroke:#24898E;stroke-miterlimit:10;} .st34{opacity:5.000000e-02;fill:none;stroke:#24898E;stroke-miterlimit:10;} .st35{opacity:0.3;fill:#06546F;} .st36{opacity:0.3;fill:#3D9FBE;} .st37{opacity:0.3;fill:#064C6A;} .st38{opacity:0.3;fill:#047080;} .st39{opacity:0.3;fill:#0C638B;} .st40{opacity:0.35;fill:#1A737C;} .st41{opacity:0.3;fill:#2E8887;} .st42{opacity:0.3;fill:#08838B;} .st43{opacity:0.34;fill:#42B0A3;} .st44{opacity:0.5;fill:#128172;} .st45{opacity:0.35;fill:none;stroke:#24898E;stroke-miterlimit:10;} .st46{opacity:0.5;fill:#24898E;} .st47{opacity:0.3;fill:#6CC0BA;} .st48{opacity:0.3;fill:#3896BA;} .st49{opacity:0.5;fill:#086A73;} .st50{opacity:0.35;fill:#0781A0;} .st51{opacity:0.33;fill:none;stroke:#24898E;stroke-miterlimit:10;} .st52{opacity:0.3;fill:#0A6D75;} .st53{opacity:0.3;fill:#0C8270;} .st54{opacity:0.3;fill:#4DB5B9;} .st55{opacity:0.3;fill:#1A737C;} .st56{opacity:0.5;fill:#0CA181;} .st57{opacity:0.35;fill:#328488;} .st58{opacity:0.34;fill:#06938E;} .st59{opacity:0.37;fill:#105756;}
  </style>

  
  <g id="base0">
  <polygon class="st0" points="-41.1,715 -169.8,715.6 -101.5,618.1  "/>
  <polygon class="st1" points="2.6,563.5 -41.1,715 -101.5,618.1   "/>
  <polygon class="st2" points="-18.6,372.3 -135.4,405.1 2.6,563.5   "/>
  <polygon class="st3" points="-41.1,715 -103.6,794.2 -38,846.5   "/>
  <polygon class="st4" points="-169.8,715.6 -103.6,794.2 -41.1,715  "/>
  <polygon class="st5" points="-136,859 -137.2,807.7 -103.6,794.2   "/>
  <polygon class="st6" points="-136,859 -103.6,794.2 -38,846.5  "/>
  <polygon class="st7" points="-153.5,499 -135.4,405.1 2.6,563.5  "/>
  <polygon class="st8" points="-41.1,715 -169.8,715.6 -101.5,618.1  "/>
  <polygon class="st8" points="-257.5,671 -236.4,569.2 -101.5,618.1   "/>
  <polygon class="st8" points="-153.5,499 -101.5,618.1 2.6,563.5  "/>
  <polygon class="st8" points="-236.4,569.2 -101.5,618.1 -153.5,499   "/>
  <polygon class="st8" points="-257.5,671 -169.8,715.6 -101.5,618.1   "/>
  <polygon class="st8" points="2.6,563.5 -41.1,715 -101.5,618.1   "/>
  <polygon class="st8" points="-18.6,372.3 -135.4,405.1 2.6,563.5   "/>
  <polygon class="st8" points="-41.1,715 -103.6,794.2 -38,846.5   "/>
  <polygon class="st8" points="-169.8,715.6 -103.6,794.2 -41.1,715  "/>
  <polygon class="st8" points="-169.8,715.6 -137.2,807.7 -103.6,794.2   "/>
  <polygon class="st8" points="-136,859 -137.2,807.7 -103.6,794.2   "/>
  <polygon class="st9" points="-153.5,499 -101.5,618.1 2.6,563.5  "/>
  <polygon class="st10" points="-257.5,671 -169.8,715.6 -101.5,618.1  "/>
  <polygon class="st11" points="-236.4,569.2 -101.5,618.1 -153.5,499  "/>
  <polygon class="st12" points="-169.8,715.6 -137.2,807.7 -103.6,794.2  "/>
  <polygon class="st13" points="-257.5,671 -236.4,569.2 -101.5,618.1  "/>
</g>
  
  
<g id="base1">
  <polygon class="st14" points="30.2,984 -37.8,844.3 77.8,774.6   "/>
  <polygon class="st15" points="50.9,713.1 -41.1,715 1.8,568.4  "/>
  <polygon class="st16" points="77.8,774.6 144.2,896.7 30.2,984   "/>
  <polygon class="st15" points="235.7,825.7 77.8,774.6 180.9,746.7  "/>
  <polygon class="st17" points="77.8,774.6 144.2,896.7 235.7,825.7  "/>
  <polygon class="st18" points="77.8,774.6 50.9,713.1 180.9,746.7   "/>
  <polygon class="st17" points="-37.6,843.7 -41.1,715 50.9,713.1  "/>
  <polygon class="st19" points="97,592.1 50.9,713.1 0,563   "/>
  <polygon class="st20" points="-37.8,844.3 77.8,774.6 50.9,713.1   "/>
  <polyline class="st15" points="180.9,746.7 97,592.1 50.9,713.1  "/>
  <polygon class="st21" points="129.1,515.9 2.6,563.5 -18.6,372.3   "/>
  <polygon class="st22" points="97,592.1 2.6,563.5 129.1,515.9  "/>
  <polygon class="st23" points="133.9,390.3 -18.6,372.3 129.1,515.9   "/>
  <polygon class="st27" points="-38,846.5 -136,859 29.9,985.1   "/>
  <polygon class="st28" points="129.1,515.9 2.6,563.5 -18.6,372.3   "/>
  <polygon class="st8" points="97,592.1 2.6,563.5 129.1,515.9   "/>
  <polygon class="st28" points="133.9,390.3 -18.6,372.3 129.1,515.9   "/>
  <polygon class="st8" points="-38,846.5 -136,859 29.9,985.1  "/>
</g>
  
  
<g id="base2">
  <polygon class="st24" points="260,503.4 258.2,428.6 129.1,515.9   "/>
  <polygon class="st25" points="133.9,390.3 284.8,312.6 129.1,515.9   "/>
  <polygon class="st26" points="258.2,428.6 284.8,312.6 129.1,515.9   "/>
  <polygon class="st18" points="268,866 85.4,941.7 235.7,825.7  "/>
  <polygon class="st29" points="265.7,770.1 235.7,825.7 294.4,824.3   "/>
  <polygon class="st30" points="268,866 294.4,824.3 235.7,825.7   "/>
  <polygon class="st19" points="265.7,770.1 180.9,746.7 235.7,825.7   "/>
  <polygon class="st18" points="387.1,605.9 180.9,746.7 265.7,770.1   "/>
  <polygon class="st16" points="97,592.1 180.9,746.7 387.1,605.9  "/>
  <polygon class="st31" points="259,504.2 99.1,592.2 387.1,605.9  "/>
  <polyline class="st32" points="387.1,605.9 414.4,684.9 265.7,770.1 387.1,605.9  "/>
  <polygon class="st19" points="411.9,576.7 387.1,605.9 257.4,502.9   "/>
  <polygon class="st33" points="332.3,989.6 243.3,1034.5 299.9,946.3  "/>
  <polygon class="st34" points="396.4,887 332.3,989.6 299.9,946.3   "/>
  <polygon class="st29" points="294.4,824.3 299.9,946.3 396.4,887   "/>
  <polygon class="st34" points="86.1,941.7 299.9,946.3 268,866  "/>
  <polygon class="st33" points="299.9,946.3 268,866 294.4,824.3   "/>
  <polygon class="st35" points="258.5,504.1 129.1,515.9 97.7,592  "/>
  <polygon class="st36" points="396.4,887 295.4,824.3 469.3,825.6   "/>
  <polygon class="st37" points="265.7,770.1 294.4,824.3 469.3,825.6   "/>
  <polygon class="st38" points="496.7,906.4 396.4,887 469.3,825.6   "/>
  <polygon class="st39" points="396.4,887 474,1022.1 332.3,989.6  "/>
  <polygon class="st8" points="258.5,504.1 129.1,515.9 97.7,592   "/>
  <polygon class="st28" points="260,503.4 258.2,428.6 129.1,515.9   "/>
  <polygon class="st28" points="133.9,390.3 284.8,312.6 129.1,515.9   "/>
  <polygon class="st28" points="258.2,428.6 284.8,312.6 129.1,515.9   "/>
  <polygon class="st8" points="396.4,887 295.4,824.3 469.3,825.6  "/>
  <polygon class="st8" points="265.7,770.1 294.4,824.3 469.3,825.6  "/>
  <polygon class="st8" points="496.7,906.4 396.4,887 469.3,825.6  "/>
  <polygon class="st8" points="396.4,887 474,1022.1 332.3,989.6   "/>
</g>
  
  
  
  <g id="nearright">
    <path class="st40" d="M289.8 766.6L493.5 822l-55-140.6z"/>
    <path class="st41" d="M513.6 915.4l-13.3 117.2L412 904.2z"/>
    <path class="st42" d="M272 503l124.3-57.4L270 428.2z"/>
    <path class="st43" d="M414 447.3L441.2 578l-106.7-51z"/>
    <path class="st44" d="M420.4 685l-2.6-108-24.7 29z"/>
    <path class="st45" d="M305 764.2L509 819.6l-55-140.6z"/>
    <path class="st33" d="M513.6 915.4l-13.3 117.2L412 904.2z"/>
    <path class="st46" d="M399.3 440.4L273 423l26.6-116 99.7 133.4"/>
    <path class="st33" d="M272 503l124.3-57.4L270 428.2z"/>
    <path class="st33" d="M272 503l45 22.4 79.3-79.8"/>
    <path class="st47" d="M272 503l45 22.4 79.3-79.8"/>
    <path class="st33" d="M412 447.6l27.3 130.7-106.7-51z"/>
  </g>
  <g id="top">
    <path class="st48" d="M-22.5 335.5l126.2-101 26.4 119z"/>
    <path class="st49" d="M442.7 423.3l20.5-160.5-120 27z"/>
    <path class="st33" d="M-22.5 335.5l126.2-101 26.4 119z"/>
    <path class="st50" d="M145 321.3l-26.2-119L296 243.6z"/>
    <path class="st51" d="M148.3 311.4l-26.4-119 177 41.3z"/>
    <path class="st52" d="M470 251.7l-122-37L392.3 104 470 251.7"/>
  </g>
  <g id="bottom">
    <path class="st53" d="M23.4 1031.5l213.3 49.4-157-93z"/>
    <path class="st33" d="M27.3 1033l213.3 49.3-157-92.8z"/>
    <path class="st54" d="M481 1064.7l-32.5 95.3-50.8-36zM124.2 1235.6L8.6 1188l69.3 74.3z"/>
    <path class="st51" d="M142 1232.4l-115.6-47.6 69.3 74.3z"/>
    <path class="st55" d="M142 1101.2l60.5 56.5-83.2 59.2z"/>
    <path class="st51" d="M150.5 1086.7l60.6 56.5-83 59.3z"/>
    <path class="st33" d="M483 1054.7l-32.5 95.3-50.8-36z"/>
    <path class="st56" d="M287.8 957.3L74 952.7l157.2 92.8z"/>
  </g>
  <g id="farright">
    <path class="st54" d="M684.3 738l-120.6 32.6L664 787.3z"/>
    <path class="st57" d="M693.5 532.6L869 640.4l-120.6 32.8z"/>
    <path class="st58" d="M481.5 490.4l92.7-58.7-87 192z"/>
    <path class="st59" d="M527.8 314.7l82-73-61.4-87.5z"/>
    <path class="st51" d="M695.7 736L575 769l100.4 16.6zM684.5 551.8l175.5 108-120.6 32.6zM517.3 483l92.8-58.6-87 192z"/>
  </g>

</svg>



  .st34{opacity:0.3;fill:#137260;}
  .st35{opacity:0.3;fill:#45B3C5;}
  .st36{opacity:0.1;fill:#64BFBF;}
  .st37{opacity:0.1;fill:#2B8383;}
  .st38{opacity:0.1;fill:#46C1C6;}
  .st39{opacity:0.1;fill:#206462;}
  .st40{opacity:0.35;fill:#1A737C;}
  .st41{opacity:0.1;fill:#2E8887;}
  .st42{opacity:0.1;fill:#08838B;}
  .st43{opacity:0.14;fill:#42B0A3;}
  .st44{opacity:0.3;fill:#128172;}
  .st45{opacity:0.15;fill:none;stroke:#24898E;stroke-miterlimit:10;}
  .st46{opacity:0.3;fill:#24898E;}
  .st47{opacity:0.1;fill:#6CC0BA;}
  .st48{opacity:0.1;fill:#3896BA;}
  .st49{opacity:0.3;fill:#086A73;}
  .st50{opacity:0.15;fill:#0781A0;}
  .st51{opacity:0.13;fill:none;stroke:#24898E;stroke-miterlimit:10;}
  .st52{opacity:0.1;fill:#0A6D75;}
  .st53{opacity:0.1;fill:#0C8270;}
  .st54{opacity:0.1;fill:#4DB5B9;}
  .st55{opacity:0.1;fill:#1A737C;}
  .st56{opacity:0.3;fill:#0CA181;}
  .st57{opacity:0.15;fill:#328488;}
  .st58{opacity:0.14;fill:#06938E;}
  .st59{opacity:0.17;fill:#105756;}
</style>
<g id="base0">
  <polygon class="st0" points="-41.1,715 -169.8,715.6 -101.5,618.1  "/>
  <polygon class="st1" points="2.6,563.5 -41.1,715 -101.5,618.1   "/>
  <polygon class="st2" points="-18.6,372.3 -135.4,405.1 2.6,563.5   "/>
  <polygon class="st3" points="-41.1,715 -103.6,794.2 -38,846.5   "/>
  <polygon class="st4" points="-169.8,715.6 -103.6,794.2 -41.1,715  "/>
  <polygon class="st5" points="-136,859 -137.2,807.7 -103.6,794.2   "/>
  <polygon class="st6" points="-136,859 -103.6,794.2 -38,846.5  "/>
  <polygon class="st7" points="-153.5,499 -135.4,405.1 2.6,563.5  "/>
  <polygon class="st8" points="-41.1,715 -169.8,715.6 -101.5,618.1  "/>
  <polygon class="st8" points="-257.5,671 -236.4,569.2 -101.5,618.1   "/>
  <polygon class="st8" points="-153.5,499 -101.5,618.1 2.6,563.5  "/>
  <polygon class="st8" points="-236.4,569.2 -101.5,618.1 -153.5,499   "/>
  <polygon class="st8" points="-257.5,671 -169.8,715.6 -101.5,618.1   "/>
  <polygon class="st8" points="2.6,563.5 -41.1,715 -101.5,618.1   "/>
  <polygon class="st8" points="-18.6,372.3 -135.4,405.1 2.6,563.5   "/>
  <polygon class="st8" points="-41.1,715 -103.6,794.2 -38,846.5   "/>
  <polygon class="st8" points="-169.8,715.6 -103.6,794.2 -41.1,715  "/>
  <polygon class="st8" points="-169.8,715.6 -137.2,807.7 -103.6,794.2   "/>
  <polygon class="st8" points="-136,859 -137.2,807.7 -103.6,794.2   "/>
  <polygon class="st9" points="-153.5,499 -101.5,618.1 2.6,563.5  "/>
  <polygon class="st10" points="-257.5,671 -169.8,715.6 -101.5,618.1  "/>
  <polygon class="st11" points="-236.4,569.2 -101.5,618.1 -153.5,499  "/>
  <polygon class="st12" points="-169.8,715.6 -137.2,807.7 -103.6,794.2  "/>
  <polygon class="st13" points="-257.5,671 -236.4,569.2 -101.5,618.1  "/>
</g>
<g id="base1">
  <polygon class="st14" points="30.2,984 -37.8,844.3 77.8,774.6   "/>
  <polygon class="st15" points="50.9,713.1 -41.1,715 1.8,568.4  "/>
  <polygon class="st16" points="77.8,774.6 144.2,896.7 30.2,984   "/>
  <polygon class="st15" points="235.7,825.7 77.8,774.6 180.9,746.7  "/>
  <polygon class="st17" points="77.8,774.6 144.2,896.7 235.7,825.7  "/>
  <polygon class="st18" points="77.8,774.6 50.9,713.1 180.9,746.7   "/>
  <polygon class="st17" points="-37.6,843.7 -41.1,715 50.9,713.1  "/>
  <polygon class="st19" points="97,592.1 50.9,713.1 0,563   "/>
  <polygon class="st20" points="-37.8,844.3 77.8,774.6 50.9,713.1   "/>
  <polyline class="st15" points="180.9,746.7 97,592.1 50.9,713.1  "/>
  <polygon class="st21" points="129.1,515.9 2.6,563.5 -18.6,372.3   "/>
  <polygon class="st22" points="97,592.1 2.6,563.5 129.1,515.9  "/>
  <polygon class="st23" points="133.9,390.3 -18.6,372.3 129.1,515.9   "/>
  <polygon class="st24" points="260,503.4 258.2,428.6 129.1,515.9   "/>
  <polygon class="st25" points="133.9,390.3 284.8,312.6 129.1,515.9   "/>
  <polygon class="st26" points="258.2,428.6 284.8,312.6 129.1,515.9   "/>
  <polygon class="st27" points="-38,846.5 -136,859 29.9,985.1   "/>
  <polygon class="st28" points="129.1,515.9 2.6,563.5 -18.6,372.3   "/>
  <polygon class="st8" points="97,592.1 2.6,563.5 129.1,515.9   "/>
  <polygon class="st28" points="133.9,390.3 -18.6,372.3 129.1,515.9   "/>
  <polygon class="st8" points="-38,846.5 -136,859 29.9,985.1  "/>
</g>
<g id="base2">
  <polygon class="st18" points="268,866 85.4,941.7 235.7,825.7  "/>
  <polygon class="st29" points="265.7,770.1 235.7,825.7 294.4,824.3   "/>
  <polygon class="st30" points="268,866 294.4,824.3 235.7,825.7   "/>
  <polygon class="st19" points="265.7,770.1 180.9,746.7 235.7,825.7   "/>
  <polygon class="st18" points="387.1,605.9 180.9,746.7 265.7,770.1   "/>
  <polygon class="st16" points="97,592.1 180.9,746.7 387.1,605.9  "/>
  <polygon class="st31" points="259,504.2 99.1,592.2 387.1,605.9  "/>
  <polyline class="st32" points="387.1,605.9 414.4,684.9 265.7,770.1 387.1,605.9  "/>
  <polygon class="st19" points="411.9,576.7 387.1,605.9 257.4,502.9   "/>
  <polygon class="st33" points="332.3,989.6 243.3,1034.5 299.9,946.3  "/>
  <polygon class="st34" points="396.4,887 332.3,989.6 299.9,946.3   "/>
  <polygon class="st29" points="294.4,824.3 299.9,946.3 396.4,887   "/>
  <polygon class="st34" points="86.1,941.7 299.9,946.3 268,866  "/>
  <polygon class="st33" points="299.9,946.3 268,866 294.4,824.3   "/>
  <polygon class="st35" points="258.5,504.1 129.1,515.9 97.7,592  "/>
  <polygon class="st36" points="396.4,887 295.4,824.3 469.3,825.6   "/>
  <polygon class="st37" points="265.7,770.1 294.4,824.3 469.3,825.6   "/>
  <polygon class="st38" points="496.7,906.4 396.4,887 469.3,825.6   "/>
  <polygon class="st39" points="396.4,887 474,1022.1 332.3,989.6  "/>
  <polygon class="st8" points="258.5,504.1 129.1,515.9 97.7,592   "/>
  <polygon class="st28" points="260,503.4 258.2,428.6 129.1,515.9   "/>
  <polygon class="st28" points="133.9,390.3 284.8,312.6 129.1,515.9   "/>
  <polygon class="st28" points="258.2,428.6 284.8,312.6 129.1,515.9   "/>
  <polygon class="st8" points="396.4,887 295.4,824.3 469.3,825.6  "/>
  <polygon class="st8" points="265.7,770.1 294.4,824.3 469.3,825.6  "/>
  <polygon class="st8" points="496.7,906.4 396.4,887 469.3,825.6  "/>
  <polygon class="st8" points="396.4,887 474,1022.1 332.3,989.6   "/>
</g>
<g id="nearright">
  <polygon class="st40" points="289.8,766.6 493.5,822.1 438.6,681.4   "/>
  <polygon class="st41" points="513.6,915.4 500.3,1032.6 412,904.2  "/>
  <polygon class="st42" points="271.9,503 396.3,445.6 270.1,428.2   "/>
  <polygon class="st43" points="413.9,447.3 441.3,578 334.6,527   "/>
  <polygon class="st44" points="420.4,685.1 417.8,576.9 393.1,606   "/>
  <polygon class="st45" points="305.1,764.2 508.8,819.6 453.9,679   "/>
  <polygon class="st8" points="513.6,915.4 500.3,1032.6 412,904.2   "/>
  <polyline class="st46" points="399.3,440.4 273,422.9 299.6,307 399.3,440.4  "/>
  <polygon class="st8" points="271.9,503 396.3,445.6 270.1,428.2  "/>
  <polyline class="st8" points="271.9,503 317,525.4 396.3,445.6   "/>
  <polyline class="st47" points="271.9,503 317,525.4 396.3,445.6  "/>
  <polygon class="st8" points="411.9,447.6 439.3,578.3 332.6,527.4  "/>
</g>
<g id="top">
  <polygon class="st48" points="-22.5,335.5 103.7,234.5 130.1,353.5   "/>
  <polygon class="st49" points="442.7,423.3 463.2,262.8 343.1,289.9   "/>
  <polygon class="st8" points="-22.5,335.5 103.7,234.5 130.1,353.5  "/>
  <polygon class="st50" points="145.1,321.3 118.8,202.3 296,243.6   "/>
  <polygon class="st51" points="148.3,311.4 121.9,192.3 299.1,233.7   "/>
  <polyline class="st52" points="469.9,251.7 347.9,214.6 392.4,104.2 469.9,251.7  "/>
</g>
<g id="bottom">
  <polygon class="st53" points="23.4,1031.5 236.7,1080.9 79.6,988.1   "/>
  <polygon class="st8" points="27.3,1033 240.6,1082.3 83.5,989.5  "/>
  <polygon class="st54" points="480.9,1064.7 448.5,1160 397.7,1123.9  "/>
  <polygon class="st54" points="124.2,1235.6 8.6,1188 77.9,1262.3   "/>
  <polygon class="st51" points="142,1232.4 26.4,1184.8 95.7,1259.1  "/>
  <polygon class="st55" points="142,1101.2 202.5,1157.7 119.3,1216.9  "/>
  <polygon class="st51" points="150.5,1086.7 211.1,1143.2 127.9,1202.5  "/>
  <polygon class="st8" points="482.9,1054.7 450.5,1150 399.7,1113.9   "/>
  <polygon class="st56" points="287.8,957.3 74.1,952.7 231.2,1045.5   "/>
</g>
<g id="farright">
  <polygon class="st54" points="684.3,737.9 563.7,770.6 664,787.3   "/>
  <polygon class="st57" points="693.5,532.6 869,640.4 748.4,673.2   "/>
  <polygon class="st58" points="481.5,490.4 574.2,431.7 487.1,623.8   "/>
  <polygon class="st59" points="527.8,314.7 609.7,241.6 548.4,154.2   "/>
  <polygon class="st51" points="695.7,736.1 575.1,768.8 675.4,785.4   "/>
  <polygon class="st51" points="684.5,551.8 860,659.7 739.4,692.4   "/>
  <polygon class="st51" points="517.3,483.1 610.1,424.4 522.9,616.5   "/>
</g>
</svg>

body {
  background: #000;
}


svg {
  height: 140%;
  // height: 100vh;
  display: block;
  position: absolute;
  left: 0;
  top: -100px;
  // background-color: #333;
}

.title-block {
  position: absolute;
  left: 50%;
  top: 45%;
  .title {
    position: relative;
    left: -50%;
    color: #fff;
    text-align: center;
    font-family: 'Lato';
    // font-weight: 300;
    letter-spacing: 5px;
  }
}


#top {
  // display: none;
  .st48,
  .st52,
  .st50{
    animation: drift-right-up 80s alternate;
  }
  .st33,
  .st51 {
    animation: drift-right-up 75s alternate;
  }
  .st49,
  .st42 {
    animation: drift-right-up 65s alternate;
  }
  
}

#bottom {
  // display: none;
  .st11,
  .st56 {
    animation: drift-down 70s alternate;
  }
  .st53,
  .st54{
    animation: drift-right 195s alternate;
  }
  .st55,
  .st36,
  .st33 {
    animation: drift-down 115s alternate;
  }
  .st51 {
    animation: drift-down-right 105s alternate;
  }
}

#nearright {
  // display: none;
  .st40,
  .st43,
  .st33{
    animation: drift-right 115s;
  }
  .st41,
  .st44 {
    animation: drift-right-up 105s;
  }
  .st42,
  .st45,
  .st46,
  .st55,
  .st47{
    animation: drift-right 135s;
  }
}

#farright {
  // display: none;
  .st54,
  .st58,
  .st59{
    animation: drift-right 55s;
  }
  .st57,
  .st51 {
    animation: drift-right-up 40s;
  }
}


@keyframes drift-right {
  100% {
    transform: translate(2000px, -20px);
  }
}

@keyframes drift-right-up {
  100% {
    transform: translate(2000px, -250px);
  }
}

@keyframes drift-up {
  100% {
    transform: translate(10px, -1450px);
  }
}

@keyframes drift-up-right {
  100% {
    transform: translate(175px, -1550px);
  }
}

@keyframes drift-down {
  100% {
    transform: translate(2000px, 1220px);
  }
}

@keyframes drift-down-right {
  100% {
    transform: translate(1450px, 320px);
  }
}

View Compiled

This Pen is owned by Lindsay Grizzard on CodePen.

See more by @lindsayrusd on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.