<?xml version="1.0" encoding="utf-8"?>
<!-- Generator: Adobe Illustrator 16.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">

<div align="center">
  <div style="margin-top:75px; width:100%;">
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
   width="200px" height="200px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
  <style type="text/css" >
      <![CDATA[
body,
#canvas {
  background-color: #121212;
}
        

      ]]>
    </style>
  
<polygon id="FirstHEX" style="fill:none;stroke:#FC0303;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="360 50 50" to="0 50 50"
                    begin="0s" dur="10s"
                    repeatCount="indefinite"
                    >
    <animateTransform/>
        </polygon>

  
<polygon id="SecondHEX" style="fill:none;stroke:#00FFEC;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="0 50 50" to="360 50 50"
                    begin="0s" dur="10s"
                    repeatCount="indefinite"
          />
  </polygon>
  
<polygon style="fill:none;stroke:#06F906;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="0 50 50" to="360 50 50"
                    begin="0s" dur="100s"
                    repeatCount="indefinite"
          />
  </polygon>
</svg>
<svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
   width="200px" height="200px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
  <style type="text/css" >
      <![CDATA[
body,
#canvas {
  background-color: #121212;
}
        @use cssnext;
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,600);

a {
    color: #10F0FE;
}

.Hint {
    padding: 2rem;
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    text-align: center;
    text-transform: uppercase;
    letter-spacing: .02rem;
    line-height: 1.4;
    font-size: .9rem;
    font-family: "Open Sans", sans-serif;
    font-weight: bold;
    color: #FFDE00;
}
    .Hint-highlight {
        color: #10F0FE;
    }
    .Hint-credits {
        padding-top: 2rem;
        font-size: .6rem;
        font-weight: normal;
        color: #aaa;
    }

      ]]>
    </style>
  
<polygon id="FirstHEX" style="fill:none;stroke:#FC0303;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="360 50 50" to="0 50 50"
                    begin="0s" dur="10s"
                    repeatCount="indefinite"
                    >
    <animateTransform/>
        </polygon>

  
<polygon id="SecondHEX" style="fill:none;stroke:#00FFEC;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="0 50 50" to="360 50 50"
                    begin="0s" dur="10s"
                    repeatCount="indefinite"
          />
  </polygon>
  
<polygon style="fill:none;stroke:#fff;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="0 50 50" to="360 50 50"
                    begin="0s" dur="100s"
                    repeatCount="indefinite"
          />
  </polygon>
</svg>
  <svg version="1.1" id="Layer_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
   width="200px" height="200px" viewBox="0 0 100 100" style="enable-background:new 0 0 100 100;" xml:space="preserve">
  <style type="text/css" >
      <![CDATA[
body,
#canvas {
  background-color: #121212;
}
        

      ]]>
    </style>
  
<polygon id="FirstHEX" style="fill:none;stroke:#fff;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="360 50 50" to="0 50 50"
                    begin="0s" dur="10s"
                    repeatCount="indefinite"
                    >
    <animateTransform/>
        </polygon>

  
<polygon id="SecondHEX" style="fill:none;stroke:#fff;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="0 50 50" to="360 50 50"
                    begin="0s" dur="10s"
                    repeatCount="indefinite"
          />
  </polygon>
  
<polygon style="fill:none;stroke:#fff;stroke-width:2;stroke-miterlimit:10;" points="35.908,74.406 21.818,50 35.908,25.594 
  64.091,25.594 78.183,50 64.091,74.406 ">
  
  <animateTransform attributeName="transform"
                    type="rotate"
                    from="0 50 50" to="360 50 50"
                    begin="0s" dur="100s"
                    repeatCount="indefinite"
          />
  </polygon>
</svg>
<div class="Hint">

    <div class="Hint-credits">
        Created by Louis Lombardo IV &ndash; <a href="https://twitter.com/LouisLombardoIV">Follow me</a> &ndash; <a href="https://codepen.io/LLIV/">More CODEPENS</a>
    </div>
</div>