Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URLs added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Auto Save

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                <!-- Remove comment tag to see the giraffe pattern I traced -->

<!-- <div id="giraffe"></div> -->

<!-- Giraffe Head -->

<div id="head-1" class="head">
  <span id="h-l-1" class="left-span"></span>
  <span id="h-r-1" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f <br>f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i<br>
    <span class="head-1-span1"></span> r a f f e G <br><span class="head-1-span2"></span>i r a f f e <br><span class="head-1-span3"></span>G i r</p>
</div>

<div id="head-2" class="head">
  <span id="h-l-2" class="left-span"></span>
  <span id="h-r-2" class="right-span"></span>
  <p><br>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f</p>
</div>

<div id="head-3" class="head">
  <span id="h-l-3" class="left-span"></span>
  <span id="h-r-3" class="right-span"></span>
  <p><br>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r</p>
</div>

<div id="head-4" class="head">
  <span id="h-l-4" class="left-span"></span>
  <span id="h-r-4" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e<br>G i r a f f e G<br>i r a f f e G<br> i r a f f e<br> G i</p>
</div>

<div id="head-5" class="head">
  <span id="h-l-5" class="left-span"></span>
  <span id="h-r-5" class="right-span"></span>
  <span id="h-l-5-2" class="left-span"></span>
  <span id="h-r-5-2" class="right-span"></span>
  <p><br><span class="head-5-span1"></span>G i r a f <br>f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a </p>
</div>

<div id="head-6" class="head">
  <span id="h-l-6" class="left-span"></span>
  <span id="h-r-6" class="right-span"></span>
  <p><br>G i r a f f e <br> G i r a f<br> f e G i r a f f e G <br>i r a f f e G <br>i r a f </p>
</div>

<div id="head-7" class="head">
  <span id="h-l-7" class="left-span"></span>
  <span id="h-r-7" class="right-span"></span>
  <p>G i r a <br><span class="head-7-span1"></span>f f e G i <br> r a f f e G i r a f f<br>f e G i r a f f e G i</p>
</div>

<div id="head-8" class="head">
  <span id="h-l-8" class="left-span"></span>
  <span id="h-r-8" class="right-span"></span>
  <p>G i r a f f e G i r a f f e</p>
</div>

<div id="head-9" class="head">
  <span id="h-l-9" class="left-span"></span>
  <span id="h-r-9" class="right-span"></span>
  <p>G i r a f f e G i r a f f e</p>
</div>

<div id="head-10" class="head">
  <span id="h-l-10" class="left-span"></span>
  <span id="h-r-10" class="right-span"></span>
  <span id="h-l-10-2" class="left-span"></span>
  <p>G i <br>r a f f e G i r a f f e G i r a a <br> f f e <br> G i r <br> a f f <br> e G i <br> r a f f <br> e G i <br>r a f f e<br> G i r a f <br> f e G i r <br> a f f e G <br>i r a f f <br>e G i r<br> a f f e G i r a f f<br> e G i r a f f e G<br> i r a
    f f e G i r<br> a f f e G i r a <br> f f e G i r a<br>f f e G i r<br> a f f e G <br>i r a f f e<br> G i r a f f <br> e G i r a f <br>f e G i r a f f e<br> G i r a f f e G i r a f f e G i r a f f e <br>G i r a f f e G i r a f f e G i r a f <br> f e
    G i r a f f e G i r a f f</p>
</div>

<!-- End Giraffe Head -->

<!-- Giraffe Body -->

<div id="spot-1" class="spot">
  <span id="l-1" class="left-span"></span>
  <span id="r-1" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G</p>
</div>

<div id="spot-2" class="spot">
  <span id="l-2" class="left-span"></span>
  <span id="r-2" class="right-span"></span>
  <p><br>G i r <br>a f f e G i <br> r a f f e G i <br>r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r</p>
</div>

<div id="spot-3" class="spot">
  <span id="l-3" class="left-span"></span>
  <span id="r-3" class="right-span"></span>
  <p><span class="spot-3-span1"></span>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e <br>G i r a f f e <br>G i r</p>
</div>

<div id="spot-4" class="spot">
  <span id="l-4" class="left-span"></span>
  <span id="r-4" class="right-span"></span>
  <p>G i r a f <br> f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r</p>
</div>

<div id="spot-5" class="spot">
  <span id="l-5" class="left-span"></span>
  <span id="r-5" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r</p>
</div>

<div id="spot-6" class="spot">
  <span id="l-6" class="left-span"></span>
  <span id="r-6" class="right-span"></span>
  <p>G i r a f f <br> e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r</p>
</div>

<div id="spot-7" class="spot">
  <span id="l-7" class="left-span"></span>
  <span id="r-7" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e</p>
</div>

<div id="spot-8" class="spot">
  <span id="l-8" class="left-span"></span>
  <span id="r-8" class="right-span"></span>
  <p><br> G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a</p>
</div>

<div id="spot-9" class="spot">
  <span id="l-9" class="left-span"></span>
  <span id="r-9" class="right-span"></span>
  <p><br><br>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f</p>
</div>

<div id="spot-10" class="spot">
  <span id="l-10" class="left-span"></span>
  <span id="r-10" class="right-span"></span>
  <span id="l-10-2" class="left-span"></span>
  <span id="r-10-2" class="right-span"></span>
  <p><br>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f</p>
</div>

<div id="spot-11" class="spot">
  <span id="l-11" class="left-span"></span>
  <span id="r-11" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e</p>
</div>

<div id="spot-12" class="spot">
  <span id="l-12" class="left-span"></span>
  <span id="r-12" class="right-span"></span>
  <p><br>G i r a
    <Br>f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e Gi r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i</p>
</div>

<div id="spot-13" class="spot">
  <span id="l-13" class="left-span"></span>
  <span id="r-13" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r <br>a</p>
</div>

<div id="spot-14" class="spot">
  <span id="l-14" class="left-span"></span>
  <span id="r-14" class="right-span"></span>
  <p><br>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e</p>
</div>

<div id="spot-15" class="spot">
  <span id="l-15" class="left-span"></span>
  <span id="r-15" class="right-span"></span>
  <p> <br> <br> G i r a f f e <span class="spot-15-span1"></span>G i r a f f e G i r a f f e G i r a f<span class="spot-15-span2"></span> f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G <br>i r a f f e G i r a f f e G i r a f f e <br>G i r a f f e G i r a f f e </p>
</div>

<div id="spot-16" class="spot">
  <span id="l-16" class="left-span"></span>
  <span id="r-16" class="right-span"></span>
  <p> <span class="spot-16-span1"></span>G i r a f<br><span class="spot-16-span2"></span>f e G i r a f f e<br><span class="spot-16-span3"></span>G i r a f f e G i r a f<br><span class="spot-16-span4"></span>f e G i r a f f e G i r a f f <br><span class="spot-16-span5"></span>e
    G i r a f f e G i r a f f e G i<br><span class="spot-16-span6"></span> r a f f e G i r a f f e G i r a f f e G <br><span class="spot-16-span7"></span> i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e <span class="spot-16-span8"></span>    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e <span class="spot-16-span9"></span>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a<span class="spot-16-span10"></span>f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a<span class="spot-16-span11"></span>f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e<span class="spot-16-span12"></span>    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f<br>f e G i r a f f e G i r<br>a f f e G i r a f<br>f e G i r</p>
</div>

<div id="spot-17" class="spot">
  <span id="l-17" class="left-span"></span>
  <span id="r-17" class="right-span"></span>
  <p><br> G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i<br> r a f</p>
</div>

<div id="spot-18" class="spot">
  <span id="l-18" class="left-span"></span>
  <span id="r-18" class="right-span"></span>
  <p><br><span class="spot-18-span1"></span>G i r a f f<br><span class="spot-18-span2"></span>e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
    a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
    i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i<br> r a f f e G i r a f f e G i r a f f e G i <br>r a f f e G i r a f f e G i r a</p>
</div>

<div id="spot-19" class="spot">
  <span id="l-19" class="left-span"></span>
  <span id="r-19" class="right-span"></span>
  <p><span class="spot-19-span1">G i r a f f <br><span class="spot-19-span2">e G i r a f f e G i<br><span class="spot-19-span3">r a f f e G i r a f f e G i r<br><span class="spot-19-span4"> a f f e G i r a f f e G i r a f f e <br><span class="spot-19-span5">G i r a f f e G i r a f f e G i r a f f e <br><span class="spot-19-span6"> G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e </p>
</div>
    
 <div id="spot-20" class="spot">
  <span id="l-20" class="left-span"></span>
    <span id="r-20" class="right-span"></span>
    <p><span class="spot-20-span1"></span>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G
      i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
      f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
      r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
      e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r
      a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f</p>
</div>

<div id="spot-21" class="spot">
  <span id="l-21" class="left-span"></span>
  <span id="r-21" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i</p>
</div>

<div id="spot-22" class="spot">
  <span id="l-22" class="left-span"></span>
  <span id="r-22" class="right-span"></span>
  <p><br><span class="spot-22-span1"></span>G i r a f f e<br><span class="spot-22-span2"></span> G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e
    G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f
    f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G</p>
</div>

<div id="spot-23" class="spot">
  <span id="l-23" class="left-span"></span>
  <span id="r-23" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r</p>
</div>

<div id="spot-24" class="spot">
  <span id="l-24" class="left-span"></span>
  <span id="r-24" class="right-span"></span>
  <span id="l-24-2" class="left-span"></span>
  <span id="r-24-2" class="right-span"></span>
  <span id="l-24-3" class="left-span"></span>
  <span id="r-24-3" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a<br> f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e</p>
</div>

<div id="spot-25" class="spot">
  <span id="l-25" class="left-span"></span>
  <span id="r-25" class="right-span"></span>
  <p><br>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f </p>
</div>

<div id="spot-26" class="spot">
  <span id="l-26" class="left-span"></span>
  <span id="r-26" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f</p>
</div>

<div id="spot-27" class="spot">
  <span id="l-27" class="left-span"></span>
  <span id="r-27" class="right-span"></span>
  <p>G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f
    e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a
    f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i
    r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a f f e G i r a</p>
</div>

<!-- End Giraffe Body -->
              
            
!

CSS

              
                body {
  font-family: sans-serif;
  font-weight: bold;
  font-size: 5px;
  background-color: #f7f2e8d9;
  color: #c75f11;
}

#giraffe {
  position: absolute;
  margin-top: -100px;
  height: 2000px;
  width: 100%;
  background-image: url(https://s3-us-west-2.amazonaws.com/s.cdpn.io/108463/noun_Giraffe_142451.svg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
}

.spot,
.head {
  position: absolute;
  z-index: 100;
}

.left-span {
  float: left;
}

.right-span {
  float: right;
}

p {
  text-align: justify;
  hyphens: auto;
}

/* Head 1  */

#head-1 {
  height: 111px;
  width: 74px;
  left: 11px;
  top: 86px;
}

#h-l-1,
#h-r-1 {
  height: 111px;
}

#h-l-1 {
  width: 37px;
  shape-outside: polygon(
    96.72% -0.52%,
    114.3% 8.21%,
    59.47% 6.53%,
    33.32% 13.09%,
    23.36% 25.3%,
    40.2% 44.48%,
    70.16% 65.33%,
    104.41% 78.45%,
    96.93% 98.8%,
    8.83% 96.13%,
    -0.22% 3.15%
  );
}

#h-r-1 {
  width: 37px;
  shape-outside: polygon(98.34% -0.52%, 118.1% 100.69%, 5.37% 98.24%, 80.11% 93.86%, 110.57% 80.67%, 51.73% 68.17%, 73.95% 58.53%, 41.41% 47.67%, 19.31% 34.05%, 67.77% 23.14%, -4.24% 7.95%);
}

.head-1-span1 {
  margin-left: 4px;
}

.head-1-span2 {
  margin-left: 9px;
}
.head-1-span3 {
  margin-left: 17px;
}

/* End of Head 1  */

/*********************************************/

/* Head 2 */

#head-2 {
  height: 111px;
  width: 60px;
  left: 132px;
  top: 18px;
}

#h-l-2,
#h-r-2 {
  height: 111px;
}

#h-l-2 {
  width: 30px;
  shape-outside: polygon(
    96.72% 1.28%,
    44.29% 8.21%,
    29.47% 14.64%,
    39.99% 24.81%,
    66.69% 34.3%,
    90.2% 49.88%,
    93.49% 74.34%,
    84.41% 88.36%,
    58.83% 97.93%,
    -0.22% 3.15%
  );
}

#h-r-2 {
  width: 30px;
  shape-outside: polygon(
    95.01% 3.98%,
    91.43% 96.19%,
    46.77% 92.06%,
    39.59% 80.67%,
    35.06% 68.17%,
    31.41% 53.98%,
    42.64% 33.15%,
    37.77% 15.03%,
    5.76% 5.24%
  );
}

/* End of Head 2  */

/*********************************************/

/* Head 3 */

#head-3 {
  height: 111px;
  width: 104px;
  left: 191px;
  top: 18px;
}

#h-l-3,
#h-r-3 {
  height: 111px;
}

#h-l-3 {
  width: 52px;
  shape-outside: polygon(
    108.26% -0.52%,
    78.9% 15.42%,
    69.86% 34.46%,
    66.91% 49.13%,
    58.99% 67.63%,
    44.04% 83.22%,
    24.26% 95.96%,
    3.06% 96.13%,
    -0.22% 3.15%
  );
}

#h-r-3 {
  width: 52px;
  shape-outside: polygon(
    95.01% 3.98%,
    95.27% 100.7%,
    41.58% 96.28%,
    25.62% 81.25%,
    18.44% 67.16%,
    33.13% 51.05%,
    73.73% 46.77%,
    62.56% 42.49%,
    56.1% 26.84%,
    43.54% 17.73%,
    30.56% 10.12%,
    1.65% 8.02%,
    1.92% -1.07%
  );
}

/* End of Head 3  */

/*********************************************/

/* Head 4 */

#head-4 {
  height: 135px;
  width: 142px;
  left: 131px;
  top: 122px;
}

#h-l-4,
#h-r-4 {
  height: 135px;
}

#h-l-4 {
  width: 71px;
  shape-outside: polygon(27.98% 2.45%, 15.52% 15.42%, 13.52% 34.46%, 14.8% 55.8%, 13.55% 65.41%, 20.99% 72.59%, 31.31% 83.36%, 38.7% 97.29%, 45.1% 97.5%, 3.06% 96.13%, -0.22% 3.15%);
}

#h-r-4 {
  width: 71px;
  shape-outside: polygon(
    92.19% 1.02%,
    71.33% 68.11%,
    0.18% 99.81%,
    0.93% 79.07%,
    13.42% 76.28%,
    24.21% 70.14%,
    15.62% 58.27%,
    13.41% 45.12%,
    11.76% 29.73%,
    21.7% 23.23%,
    56.1% 19.43%,
    58.74% 12.02%,
    81.94% 14.68%
  );
}

/* End of Head 4  */

/*********************************************/

/* Head 5 */

#head-5 {
  height: 111px;
  width: 104px;
  left: 259px;
  top: 136px;
}

#h-l-5,
#h-r-5 {
  height: 55px;
}

#h-l-5-2,
#h-r-5-2 {
  height: 56px;
}

#h-l-5 {
  width: 64px;
  shape-outside: polygon(
    109.23% 15.18%,
    87.39% 29.97%,
    67.18% 47.09%,
    46.05% 63.07%,
    26.35% 82.95%,
    10.87% 97.95%,
    -0.22% 3.15%
  );
}

#h-r-5 {
  width: 40px;
  shape-outside: polygon(
    101.33% 0.83%,
    98.94% 98.38%,
    -7.69% 100.07%,
    2.68% 88.9%,
    32.43% 60.51%,
    56.24% 33.84%,
    61.04% 18.28%,
    13.38% 17.77%,
    13.14% -2.78%
  );
}

#h-l-5-2 {
  width: 37px;
  shape-outside: polygon(
    30.68% 4.24%,
    65.82% 36.17%,
    74.55% 72.21%,
    91.05% 83.21%,
    0.36% 72.92%,
    -0.22% 3.15%
  );
}

#h-r-5-2 {
  width: 67px;
  shape-outside: polygon(
    72.79% 2.81%,
    56.4% 78.82%,
    0.18% 85.52%,
    20.28% 60.51%,
    30.38% 33.45%,
    34.18% 5.75%
  );
}

.head-5-span1 {
  margin-left: 2px;
}

/* End of Head 5  */

/*********************************************/

/* Head 6 */

#head-6 {
  height: 47px;
  width: 58px;
  left: 228px;
  top: 248px;
}

#h-l-6,
#h-r-6 {
  height: 47px;
}

#h-l-6 {
  width: 29px;
  shape-outside: polygon(
    91.99% 8.79%,
    42.03% 30.59%,
    21.87% 64.02%,
    60.28% 93.9%,
    10.87% 97.95%,
    -0.22% 3.15%
  );
}

#h-r-6 {
  width: 29px;
  shape-outside: polygon(
    101.33% 0.83%,
    98.94% 98.38%,
    -7.69% 100.07%,
    74.03% 71.47%,
    73.62% 17.78%,
    -0.64% 1.48%
  );
}

/* End of Head 6 */

/*********************************************/

/* Head 7 */

#head-7 {
  height: 47px;
  width: 58px;
  left: 42px;
  top: 228px;
}

#h-l-7,
#h-r-7 {
  height: 47px;
}

#h-l-7 {
  width: 29px;
  shape-outside: polygon(
    78.2% -6.1%,
    8.08% 40.62%,
    68.55% 54.18%,
    132.4% 79.9%,
    10.87% 97.95%,
    -0.22% 3.15%
  );
}

#h-r-7 {
  width: 29px;
  shape-outside: polygon(
    101.33% 0.83%,
    98.94% 98.38%,
    2.65% 100.07%,
    63.68% 62.96%,
    63.28% 26.29%,
    6.26% 5.74%
  );
}

.head-7-span1 {
  margin-left: 14px;
}

/* End of Head 7 */

/*********************************************/

/* Head 8 */

#head-8 {
  height: 40px;
  width: 38px;
  left: 66px;
  top: 391px;
}

#h-l-8,
#h-r-8 {
  height: 40px;
}

#h-l-8 {
  width: 19px;
  shape-outside: polygon(
    104.52% 13.9%,
    44.92% 38.12%,
    52.75% 79.18%,
    53.46% 107.4%,
    10.87% 97.95%,
    -0.22% 3.15%
  );
}

#h-r-8 {
  width: 19px;
  shape-outside: polygon(
    101.33% 0.83%,
    98.94% 98.38%,
    2.65% 87.57%,
    42.63% 60.46%,
    47.5% 13.79%,
    -7.8% 11.93%,
    1.01% -1.76%
  );
}

/* End of Head 8 */

/*********************************************/

/* Head 9 */

#head-9 {
  height: 40px;
  width: 38px;
  left: 119px;
  top: 399px;
}

#h-l-9,
#h-r-9 {
  height: 40px;
}

#h-l-9 {
  width: 19px;
  shape-outside: polygon(
    104.52% 13.9%,
    44.92% 38.12%,
    52.75% 79.18%,
    53.46% 107.4%,
    10.87% 97.95%,
    -0.22% 3.15%
  );
}

#h-r-9 {
  width: 19px;
  shape-outside: polygon(
    101.33% 0.83%,
    98.94% 98.38%,
    2.65% 87.57%,
    42.63% 60.46%,
    47.5% 13.79%,
    -7.8% 11.93%,
    1.01% -1.76%
  );
}

/* End of Head 9 */

/*********************************************/

/* Head 10 */

#head-10 {
  height: 194px;
  width: 218px;
  left: 74px;
  top: 294px;
}

#h-l-10,
#h-r-10 {
  height: 40px;
}

#h-l-10-2 {
  height: 164px;
}

#h-l-10 {
  width: 197px;
  shape-outside: polygon(
    101.98% -18.6%,
    96.7% 40.62%,
    95.9% 71.68%,
    94.07% 97.4%,
    77.88% 87.95%,
    83.03% 15.65%
  );
}

#h-r-10 {
  width: 21px;
  shape-outside: polygon(
    101.33% 0.83%,
    98.94% 98.38%,
    2.65% 87.57%,
    42.63% 60.46%,
    47.5% 13.79%,
    -7.8% 11.93%,
    1.01% -1.76%
  );
}

#h-l-10-2 {
  width: 195px;
  shape-outside: polygon(
    94.78% -0.1%,
    89.02% 7.45%,
    83.52% 14.51%,
    77.05% 20.9%,
    70.4% 29.99%,
    66.68% 38.51%,
    57.94% 34.91%,
    53.3% 42.3%,
    52.42% 56.78%,
    48.92% 63.14%,
    45.61% 67.18%,
    39.83% 71.49%,
    30.05% 74.13%,
    20.62% 75.03%,
    8.61% 74.87%,
    7.22% 83.97%,
    14.85% 89.62%,
    0.84% 94.57%,
    -0.22% 3.15%
  );
}

/* End of Head 10 */

/*********************************************/

/* Spot 1  */

#spot-1 {
  height: 70px;
  width: 70px;
  left: 255px;
  top: 323px;
}

#l-1,
#r-1 {
  height: 70px;
  width: 35px;
}

#l-1 {
  shape-outside: polygon(
    96.72% -1.42%,
    73.86% 12.19%,
    47.68% 25.3%,
    29.39% 43.58%,
    18.8% 63.53%,
    12.53% 88.36%,
    3.42% 106.94%,
    -2.92% -2.26%
  );
}

#r-1 {
  shape-outside: polygon(
    76.72% -1.42%,
    74.85% 99.79%,
    1px 99.72%,
    3.08% 83.49%,
    25.3% 68.44%,
    32.82% 41.26%,
    32.63% 20.44%,
    22.79% 3.45%
  );
}

/* End of Spot 1  */

/*********************************************/

/* Spot 2  */

#spot-2 {
  height: 120px;
  width: 126px;
  left: 291px;
  top: 300px;
}

#l-2,
#r-2 {
  height: 120px;
  width: 63px;
}

#l-2 {
  shape-outside: polygon(
    55.62% 9.42%,
    53.22% 17.19%,
    54.03% 27.8%,
    51.61% 42.75%,
    45.78% 53.53%,
    47.56% 67.45%,
    55.39% 78.36%,
    70.87% 90.64%,
    104.87% 95.38%,
    106.53% 100.05%,
    11.35% 100.28%,
    12.95% 0.24%,
    100.01% -0.42%,
    93.66% 5.47%,
    65.04% 1.98%
  );
}

#r-2 {
  shape-outside: polygon(
    98.94% -1.42%,
    100.25% 102.29%,
    -1px 100.55%,
    25.96% 93.31%,
    50.76% 91.46%,
    66.57% 84.32%,
    77.68% 75.94%,
    72.3% 63.31%,
    53.42% 51.54%,
    39.17% 42.93%,
    15.17% 28.77%,
    -6.89% 17.27%,
    3.74% 2.62%
  );
}

/* End of Spot 2 */

/*********************************************/

/* Spot 3  */

#spot-3 {
  height: 115px;
  width: 200px;
  left: 170px;
  top: 388px;
}

#l-3,
#r-3 {
  height: 115px;
}

#l-3 {
  width: 90px;
  shape-outside: polygon(
    99.54% 20.54%,
    84.48% 23.45%,
    69.17% 29.71%,
    54.34% 39.62%,
    47.11% 53.54%,
    45.85% 68.71%,
    56.61% 80.1%,
    74.3% 88.9%,
    81.97% 98.31%,
    11.35% 100.28%,
    12.95% 0.24%,
    96.84% 0.47%
  );
}

#r-3 {
  width: 110px;
  shape-outside: polygon(
    98.94% -1.42%,
    100.25% 102.29%,
    -1px 100.55%,
    -3.39% 79.07%,
    4.04% 61.72%,
    12.17% 49.13%,
    19.68% 40.29%,
    31.39% 33.74%,
    39.87% 21.98%,
    33.44% 7.28%,
    2.19% 14.22%,
    0.74% 1.75%
  );
}

.spot-3-span1 {
  margin-left: 20px;
}
/* End of Spot 3 */

/*********************************************/

/* Spot 4  */

#spot-4 {
  height: 205px;
  width: 150px;
  left: 241px;
  top: 420px;
}

#l-4,
#r-4 {
  height: 205px;
  width: 75px;
}

#l-4 {
  shape-outside: polygon(
    100.87% 9.32%,
    97.17% 16.54%,
    86.34% 24.5%,
    65.78% 31.1%,
    47.18% 37%,
    33.58% 43.56%,
    26.62% 52.04%,
    33.94% 60.59%,
    46.53% 66.78%,
    59.3% 71.71%,
    66.35% 78.48%,
    63.64% 85.4%,
    69.53% 93.22%,
    88.04% 98.43%,
    11.35% 100.28%,
    12.95% 0.24%,
    99.51% -0.02%
  );
}

#r-4 {
  shape-outside: polygon(
    98.94% -1.42%,
    100.25% 98.39%,
    -4px 95.67%,
    7.76% 87.06%,
    22.21% 78.06%,
    35.64% 68.83%,
    53.79% 58.68%,
    66.88% 54.08%,
    75.34% 46.43%,
    65.8% 35.48%,
    60.18% 33.52%,
    53.02% 27.6%,
    52.72% 20.56%,
    40.3% 14.66%,
    26.48% 9.37%,
    25.17% 4.59%,
    0% 6.17%,
    11.41% 0.29%
  );
}

/* End of Spot 4 */

/*********************************************/

/* Spot 5  */

#spot-5 {
  height: 105px;
  width: 120px;
  left: 355px;
  top: 418px;
}

#l-5,
#r-5 {
  height: 105px;
  width: 60px;
}

#l-5 {
  shape-outside: polygon(
    32.6% 25.88%,
    38.29% 41.57%,
    42.27% 54.88%,
    53.2% 70.59%,
    69.3% 85.04%,
    91.37% 96.53%,
    11.35% 100.28%,
    12.95% 0.24%,
    102.83% 10.11%,
    69.51% 4.74%,
    19.34% 13.24%
  );
}

#r-5 {
  shape-outside: polygon(
    98.94% -1.42%,
    100.25% 98.39%,
    1px 90.91%,
    33.94% 80.75%,
    57.76% 70.87%,
    73.16% 59.74%,
    65.55% 42.82%,
    45.8% 30.71%,
    31.35% 19.98%,
    -1.66% 10.92%,
    -1.8% 1.55%
  );
}

/* End of Spot 5 */

/*********************************************/

/* Spot 6  */

#spot-6 {
  height: 215px;
  width: 140px;
  left: 407px;
  top: 504px;
}

#l-6,
#r-6 {
  height: 215px;
  width: 70px;
}

#l-6 {
  shape-outside: polygon(
    19.74% 21.23%,
    29.72% 30.87%,
    43.7% 39.53%,
    51.26% 51.65%,
    51.77% 61.75%,
    59.33% 73.23%,
    69.3% 84.11%,
    85.66% 92.81%,
    112.8% 100.83%,
    11.35% 100.28%,
    12.95% 0.24%,
    101.38% 0.75%,
    117.23% 4.11%,
    78.56% 0.91%,
    61.41% 4.52%,
    33.79% 9.86%,
    23.63% 14.17%
  );
}

#r-6 {
  shape-outside: polygon(98.94% 0.44%, 100.25% 98.39%, 29.53% 96.95%, 29px 85.79%, 53.94% 75.17%, 66.33% 63.89%, 78.59% 52.11%, 72.4% 44.43%, 56.02% 38.35%, 35.55% 30.73%, 24.37% 22.8%, 11.35% 15.33%, 1.2% 8.13%, 1.06% 0.62%);
}

/* End of Spot 6 */

/*********************************************/

/* Spot 7  */

#spot-7 {
  height: 185px;
  width: 140px;
  left: 300px;
  top: 542px;
}

#l-7,
#r-7 {
  height: 185px;
  width: 70px;
}

#l-7 {
  shape-outside: polygon(
    91.17% 18.53%,
    74% 27.63%,
    52.27% 36.29%,
    39.83% 46.24%,
    33.2% 57.97%,
    36.48% 69.99%,
    56.44% 80.87%,
    75.66% 87.55%,
    98.73% 92.11%,
    102.8% 100.05%,
    11.35% 100.28%,
    12.95% 0.24%,
    101.38% 0.75%,
    98.66% 10.6%
  );
}

#r-7 {
  shape-outside: polygon(98.94% 0.44%, 100.25% 98.39%, 8.59% 98.03%, 28.23% 86.52%, 26.33% 78.49%, 35.74% 69.95%, 53.83% 68.21%, 63.16% 61.6%, 61.27% 55.6%, 67.22% 49.83%, 69.64% 41.54%, 68.84% 28.65%, 48.49% 19.11%, 19.66% 12.1%, 1.2% 8.13%, 1.06% 0.62%);
}

/* End of Spot 7 */

/*********************************************/

/* Spot 8  */

#spot-8 {
  height: 218px;
  width: 200px;
  left: 474px;
  top: 640px;
}

#l-8,
#r-8 {
  height: 218px;
  width: 100px;
}

#l-8 {
  shape-outside: polygon(
    75.17% 12.56%,
    65% 22.13%,
    52.27% 30.79%,
    39.83% 37.53%,
    25.2% 41.45%,
    18.48% 48.89%,
    32.44% 59.31%,
    50.97% 70.22%,
    65.66% 79.29%,
    76.73% 89.82%,
    90.22% 95.77%,
    99.8% 100.51%,
    11.35% 100.28%,
    12.95% 0.24%,
    101.38% 2.13%,
    86.66% 5.55%
  );
}

#r-8 {
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    -3.41% 99.86%,
    24.94% 88.35%,
    33.33% 80.32%,
    47.74% 71.78%,
    63.83% 69.59%,
    74.16% 65.27%,
    80.27% 57.89%,
    78.22% 49.37%,
    69.64% 41.54%,
    52.84% 30.94%,
    33.49% 20.03%,
    20.2% 12.26%,
    1.06% 3.37%
  );
}

/* End of Spot 8 */

/*********************************************/

/* Spot 9  */

#spot-9 {
  height: 234px;
  width: 240px;
  left: 320px;
  top: 716px;
}

#l-9,
#r-9 {
  height: 234px;
  width: 120px;
}

#l-9 {
  shape-outside: polygon(61.02% 7.43%, 52.5% 7.6%, 38.1% 7.29%, 21.5% 2.91%, 21.04% 10.67%, 28.48% 19.41%, 38.27% 28.11%, 45.14% 38.17%, 50.66% 44.25%, 52.72% 51.16%, 58.18% 64.11%, 62.56% 74.86%, 77.72% 85.09%, 93.13% 100.52%, 11.35% 100.28%, 12.95% 0.24%, 99.96% 0.29%, 98.87% 5.54%);
}

#r-9 {
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    -1.74% 100.29%,
    16.84% 90.83%,
    25.77% 83.22%,
    49.16% 80.32%,
    63.57% 78.62%,
    75.49% 71.73%,
    75.83% 61.42%,
    66.94% 50.2%,
    57.38% 42.96%,
    46.31% 35.13%,
    36.17% 26.24%,
    25.99% 16.18%,
    16.86% 8.41%,
    0.51% 4.95%,
    -3.94% -0.47%
  );
}

/* End of Spot 9 */

/*********************************************/

/* Spot 10  */

#spot-10 {
  height: 246px;
  width: 260px;
  left: 592px;
  top: 794px;
}

#l-10,
#r-10,
#l-10-2,
#r-10-2 {
  height: 123px;
}

#l-10 {
  width: 88px;
  shape-outside: polygon(
    75.98% 11.97%,
    58.21% 31.17%,
    35.73% 46.28%,
    19.97% 56.35%,
    6.76% 65.27%,
    8.18% 77.42%,
    28.23% 84.81%,
    41.54% 92.38%,
    49.86% 101.72%,
    1.35% 100.28%,
    1.28% 0.24%,
    91.8% 0.32%
  );
}

#l-10-2 {
  width: 160px;
  shape-outside: polygon(45.75% 3.84%, 57.42% 8.44%, 63.92% 21.23%, 70.53% 39.82%, 71.88% 53.07%, 72.78% 65.22%, 78.86% 77.92%, 101.25% 105.39%, 99.02% 99.72%, 1.35% 100.28%, 1.28% 0.24%, 23.78% 1.94%);
}

#r-10 {
  width: 172px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    62.64% 97.89%,
    49.78% 84.74%,
    39.11% 71.76%,
    31.14% 56.76%,
    21.92% 40.62%,
    13.63% 26.34%,
    5.61% 13.51%,
    -1.06% 4.01%
  );
}

#r-10-2 {
  width: 100px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    -0.69% 97.77%,
    16.3% 87.59%,
    55.62% 84.06%,
    72.42% 82.39%,
    85.81% 77.01%,
    90.2% 61.01%,
    88.92% 46.55%,
    84.8% 33.23%,
    72.05% 20.17%,
    55.57% 8.91%,
    39.37% -0.49%
  );
}
/* End of Spot 10 */

/*********************************************/

/* Spot 11  */

#spot-11 {
  height: 212px;
  width: 190px;
  left: 410px;
  top: 900px;
}

#l-11,
#r-11 {
  height: 212px;
}

#l-11 {
  width: 128px;
  shape-outside: polygon(
    89.55% 7.59%,
    73.84% 14.66%,
    59.95% 19.4%,
    50.02% 24.14%,
    35.53% 27.53%,
    26.36% 34.75%,
    21.2% 42.83%,
    22.79% 53.7%,
    26.34% 64.77%,
    31.17% 76.01%,
    43.76% 84.9%,
    62.29% 88.91%,
    80.6% 93.43%,
    102.49% 96.46%,
    102.91% 100.09%,
    1.35% 100.28%,
    1.28% 0.24%,
    102.24% 2.63%
  );
}



#r-11 {
  width: 62px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    -9.78% 95.45%,
    3.18% 87.48%,
    19.09% 77.14%,
    40.11% 71.06%,
    60.08% 62.8%,
    66.62% 51.1%,
    67.08% 37.32%,
    63.63% 23.98%,
    60.45% 10.68%,
    42.49% 2.59%
  );
}

/* End of Spot 11 */

/*********************************************/

/* Spot 12  */

#spot-12 {
  height: 184px;
  width: 130px;
  left: 572px;
  top: 907px;
}

#l-12,
#r-12 {
  height: 182px;
}

#l-12 {
  width: 45px;
  shape-outside: polygon(45.28% 15.84%, 42.94% 28.97%, 51.62% 41.04%, 57.93% 60.5%, 62.6% 76.51%, 80.23% 86.45%, 96.16% 99.47%, 100.68% 101.19%, 1.35% 100.28%, 1.28% 0.24%, 81.38% 0.98%, 56.72% 8.58%);
}

#r-12 {
  width: 85px;
  shape-outside: polygon(98.94% 0.44%, 100.25% 98.39%, 28.42% 98.89%, 59.44% 96.54%, 61.64% 89.69%, 67.33% 83.73%, 77.67% 71.61%, 78.72% 56.75%, 75.59% 36.27%, 69.53% 26.8%, 59.39% 20.28%, 38.47% 15.74%, 17.28% 14.53%, 1.64% 8.73%, 0.5% 1.49%);
}

.spot-12-span1 {
  margin-left: 4px;
}

.spot-12-span2 {
  margin-left: 14px;
}

/* End of Spot 12 */

/*********************************************/

/* Spot 13  */

#spot-13 {
  height: 118px;
  width: 120px;
  left: 830px;
  top: 945px;
}

#l-13,
#r-13 {
  height: 118px;
}

#l-13 {
  width: 60px;
  shape-outside: polygon(
    70.28% 25.16%,
    59.95% 52.06%,
    54.6% 68.13%,
    65.94% 83.29%,
    90.19% 91.04%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    105.03% 0.6%,
    95.83% 10.81%,
    80.05% 16.21%
  );
}

#r-13 {
  width: 60px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    -1.14% 97.89%,
    2.82% 77.79%,
    27.68% 63.99%,
    49.7% 53.36%,
    55.59% 37.12%,
    35.13% 24.46%,
    17.28% 17.91%,
    -1.69% 14.66%,
    1.48% 0.64%
  );
}

/* End of Spot 13 */

/*********************************************/

/* Spot 14  */

#spot-14 {
  height: 155px;
  width: 150px;
  left: 865px;
  top: 1010px;
}

#l-14,
#r-14 {
  height: 155px;
}

#l-14 {
  width: 75px;
  shape-outside: polygon(
    59.62% 25.81%,
    31.95% 37.87%,
    13.26% 52.65%,
    13.94% 69.1%,
    22.18% 82.01%,
    42.67% 89.03%,
    67.91% 93.99%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    98.36% 0.6%,
    102.49% 7.58%,
    82.72% 16.86%
  );
}

#r-14 {
  width: 75px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    -1.14% 97.89%,
    6.6% 91.7%,
    25.66% 85.3%,
    52.15% 76.5%,
    77.01% 62.05%,
    88.37% 45.62%,
    76.92% 33.25%,
    47.13% 17.36%,
    23.65% 7.56%,
    7.69% 3.59%,
    1.48% 0.64%
  );
}

/* End of Spot 14 */

/*********************************************/

/* Spot 15  */

#spot-15 {
  height: 210px;
  width: 198px;
  left: 662px;
  top: 1028px;
}

#l-15,
#r-15 {
  height: 210px;
}

#l-15 {
  width: 99px;
  shape-outside: polygon(
    19.22% 70.1%,
    16.8% 78.35%,
    10.23% 85.03%,
    12.93% 91.96%,
    20.16% 93.91%,
    60.85% 97.61%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    102.06% 1.33%,
    100.38% 6.79%,
    53.64% 5.35%,
    43.9% 9.48%,
    40.31% 16.31%,
    34.24% 25.43%,
    22.77% 36.28%,
    17.67% 46.36%,
    20.62% 57.39%
  );
}

#r-15 {
  width: 99px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    0.88% 99.79%,
    -2.26% 87.3%,
    10.3% 81.33%,
    28.86% 76.05%,
    41.95% 72.65%,
    67.07% 67.68%,
    81.44% 62.69%,
    88.12% 55.38%,
    82.31% 45.62%,
    67.83% 10.39%,
    52.18% 4.99%,
    33.75% 6.61%,
    7.69% 3.59%,
    1.48% 0.64%
  );
}

.spot-15-span1 {
  margin-left: 60px;
}

.spot-15-span2 {
  margin-left: 24px;
}
/* End of Spot 15 */

/*********************************************/

/* Spot 16  */

#spot-16 {
  height: 220px;
  width: 240px;
  left: 428px;
  top: 1066px;
}

#l-16,
#r-16 {
  height: 220px;
}

#l-16 {
  width: 120px;
  shape-outside: polygon(
    25.06% 75.1%,
    38.77% 86.05%,
    47.66% 93%,
    55.85% 96.7%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    99.56% 1.33%,
    100.29% 21.21%,
    25.57% 14.02%,
    19.47% 21.77%,
    12.58% 26.34%,
    8.6% 41.28%,
    7.67% 51.36%,
    12.29% 64.21%
  );
}

#r-16 {
  width: 120px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    0.88% 99.79%,
    1.42% 84.42%,
    10.24% 83.2%,
    29.18% 86.03%,
    47.2% 82.41%,
    56.12% 79.01%,
    71.24% 69.04%,
    81.44% 62.69%,
    90.62% 53.56%,
    93.98% 39.26%,
    86.08% 25.59%,
    63.01% 14.09%,
    49.51% 9.13%,
    26.26% 1.16%,
    0.06% 5.47%,
    1.48% 0.64%
  );
}

.spot-16-span1 {
  margin-left: 29px;
}

.spot-16-span2 {
  margin-left: 24px;
}
.spot-16-span3 {
  margin-left: 21px;
}
.spot-16-span4 {
  margin-left: 17px;
}
.spot-16-span5 {
  margin-left: 15px;
}
.spot-16-span6 {
  margin-left: 12px;
}
.spot-16-span7 {
  margin-left: 10px;
}
.spot-16-span8 {
  margin-left: 62px;
}
.spot-16-span9 {
  margin-left: 44px;
}
.spot-16-span10 {
  margin-left: 36px;
}
.spot-16-span11 {
  margin-left: 31px;
}
.spot-16-span12 {
  margin-left: 20px;
}
/* End of Spot 16 */

/*********************************************/

/* Spot 17  */

#spot-17 {
  height: 128px;
  width: 116px;
  left: 1000px;
  top: 1080px;
}

#l-17,
#r-17 {
  height: 128px;
}

#l-17 {
  width: 58px;
  shape-outside: polygon(
    43.36% 74.01%,
    60.85% 89.8%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    103.78% 5.24%,
    81.39% 8.94%,
    54.24% 22.35%,
    25.98% 38.41%,
    26.29% 56.52%
  );
}

#r-17 {
  width: 58px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    2.6% 98.23%,
    -4.68% 77.78%,
    17.19% 66.49%,
    46.38% 53.61%,
    69.29% 45.05%,
    79.9% 34.6%,
    64.25% 21.39%,
    35.28% 12.18%,
    1.48% 2.98%
  );
}

/* End of Spot 17 */

/*********************************************/

/* Spot 18  */

#spot-18 {
  height: 220px;
  width: 234px;
  left: 824px;
  top: 1160px;
}

#l-18,
#r-18 {
  height: 220px;
}

#l-18 {
  width: 117px;
  shape-outside: polygon(
    43.36% 63.1%,
    22.11% 74.01%,
    6.95% 82.65%,
    9.18% 90.81%,
    16.45% 95.35%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    100.85% 0.24%,
    101.22% 2.06%,
    71.99% 8.49%,
    63.64% 18.26%,
    67.86% 29.77%,
    70.73% 43.34%,
    58.15% 54.87%
  );
}

#r-18 {
  width: 117px;
  shape-outside: polygon(
    98.94% 0.44%,
    100.25% 98.39%,
    2.6% 98.23%,
    3.94% 83.37%,
    24.14% 81.82%,
    50.89% 80.35%,
    65.18% 75.06%,
    76.52% 66.42%,
    86.51% 57.42%,
    92.57% 49.29%,
    87.27% 40.13%,
    75.43% 35.43%,
    59.89% 26.86%,
    47.42% 16.41%,
    39.46% 6.39%,
    33.29% 3.05%,
    2.33% 1.16%
  );
}

.spot-18-span1 {
  margin-left: 33px;
}

.spot-18-span2 {
  margin-left: 34px;
}

/* End of Spot 18 */

/*********************************************/

/* Spot 19  */

#spot-19 {
  height: 155px;
  width: 216px;
  left: 678px;
  top: 1181px;
}

#l-19,
#r-19 {
  height: 155px;
}

#l-19 {
  width: 108px;
  shape-outside: polygon(
    33.22% 83.7%,
    49.54% 89.95%,
    65.51% 94.95%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    101.78% -0.41%,
    93.8% 24.68%,
    80.32% 31.4%,
    63.64% 42.31%,
    29.9% 43.21%,
    13.31% 47.46%,
    9.07% 61.62%,
    20.61% 71.12%
  );
}

#r-19 {
  width: 108px;
  shape-outside: polygon(
    99.94% 1%,
    100.25% 98.39%,
    2.6% 98.23%,
    22.46% 88.57%,
    38.03% 81.52%,
    53.67% 74.2%,
    68.18% 65.28%,
    77.25% 56.23%,
    87.94% 43.34%,
    85.42% 23.46%,
    83.97% 10.8%,
    75.64% 0.81%,
    2.33% 1.16%
  );
}

.spot-19-span1 {
  margin-left: 63px;
}
.spot-19-span2 {
  margin-left: 50px;
}
.spot-19-span3 {
  margin-left: 38px;
}
.spot-19-span4 {
  margin-left: 27px;
}
.spot-19-span5 {
  margin-left: 17px;
}
.spot-19-span6 {
  margin-left: 8px;
}

/* End of Spot 19 */

/*********************************************/

/* Spot 20  */

#spot-20 {
  height: 132px;
  width: 194px;
  left: 460px;
  top: 1268px;
}

#l-20,
#r-20 {
  height: 132px;
}

#l-20 {
  width: 97px;
  shape-outside: polygon(
    32.19% 87.49%,
    51.08% 95.71%,
    107.35% 99.54%,
    1.35% 100.28%,
    1.28% 0.24%,
    101.78% -0.41%,
    101.85% 9.17%,
    82.46% 18.62%,
    67.76% 27.92%,
    37.11% 25.78%,
    20.53% 20.94%,
    9.07% 34.34%,
    20.61% 71.12%
  );
}

#r-20 {
  width: 97px;
  shape-outside: polygon(
    99.94% 1%,
    100.25% 98.39%,
    2.6% 98.23%,
    32.87% 90.61%,
    51.6% 80.26%,
    63.03% 71.35%,
    79.31% 56.23%,
    91.61% 38.61%,
    79.65% 31.16%,
    68.51% 19.89%,
    57.08% 10.67%,
    48.29% 6.42%,
    2.33% 7.22%
  );
}

.spot-20-span1 {
  margin-left: 3px;
}

/* End of Spot 20 */

/*********************************************/

/* Spot 21  */

#spot-21 {
  height: 82px;
  width: 168px;
  left: 645px;
  top: 1322px;
}

#l-21,
#r-21 {
  height: 82px;
}

#l-21 {
  width: 56px;
  shape-outside: polygon(
    106.16% 86.13%,
    1.35% 100.28%,
    1.28% 0.24%,
    101.78% 3.25%,
    82.21% 17.7%,
    74.3% 34.01%,
    59.06% 47.75%,
    33.84% 55.31%,
    14.06% 72.64%,
    27.16% 88.2%
  );
}

#r-21 {
  width: 112px;
  shape-outside: polygon(
    99.94% 1%,
    100.25% 98.39%,
    2.6% 98.23%,
    2.51% 80.85%,
    84.46% 85.99%,
    90.02% 69.64%,
    86.25% 52.02%,
    74.29% 42.14%,
    39.36% 25.93%,
    2.33% 7.22%
  );
}

/* End of Spot 21 */

/*********************************************/

/* Spot 22  */

#spot-22 {
  height: 138px;
  width: 140px;
  left: 1068px;
  top: 1173px;
}

#l-22,
#r-22 {
  height: 138px;
}

#l-22 {
  width: 70px;
  shape-outside: polygon(
    71.45% 100.01%,
    1.35% 100.28%,
    1.28% 0.24%,
    106.07% 1.08%,
    99.35% 14.08%,
    77.16% 23.87%,
    70.49% 39.05%,
    55.27% 55.31%,
    32.63% 71.19%,
    17.16% 83.13%,
    25.74% 93.56%
  );
}

#r-22 {
  width: 70px;
  shape-outside: polygon(
    99.94% 1%,
    100.25% 98.39%,
    2.6% 98.23%,
    14.76% 88.4%,
    33.94% 77.23%,
    50.17% 58.45%,
    70.02% 45.73%,
    77.68% 31.73%,
    74.29% 15.33%,
    57.93% 4.92%,
    -0.53% 2.87%
  );
}

.spot-22-span1 {
  margin-left: 19px;
}

.spot-22-span2 {
  margin-left: 9px;
}

/* End of Spot 22 */

/*********************************************/

/* Spot 23  */

#spot-23 {
  height: 94px;
  width: 72px;
  left: 1185px;
  top: 1214px;
}

#l-23,
#r-23 {
  height: 94px;
}

#l-23 {
  width: 36px;
  shape-outside: polygon(
    71.45% 100.01%,
    1.35% 100.28%,
    1.28% 0.24%,
    106.07% 3.21%,
    77.13% 31.1%,
    53.82% 49.69%,
    24.72% 73.4%,
    30.08% 84.88%
  );
}

#r-23 {
  width: 36px;
  shape-outside: polygon(
    99.94% 1%,
    100.25% 98.39%,
    -13.91% 98.26%,
    35.93% 79.08%,
    64.06% 66.96%,
    61.69% 51.05%,
    36.05% 16.29%,
    52.68% 32.79%,
    30.16% 5.98%,
    -3.31% 7.12%
  );
}

/* End of Spot 23 */

/*********************************************/

/* Spot 24  */

#spot-24 {
  height: 118px;
  width: 158px;
  left: 1260px;
  top: 1228px;
}

#l-24,
#r-24 {
  height: 42px;
}
#l-24-2,
#r-24-2 {
  height: 59px;
}
#l-24-3,
#r-24-3 {
  height: 15px;
}

#l-24 {
  width: 19px;
  shape-outside: polygon(
    1.35% 90.76%,
    6.54% 0.24%,
    106.07% 3.21%,
    46.5% 29.21%,
    82.71% 84.88%
  );
}

#r-24 {
  width: 139px;
  shape-outside: polygon(
    37.35% 17.67%,
    57.8% 81.72%,
    38.61% 91.64%,
    24.54% 62.01%,
    11.45% 33.67%,
    1% 8.49%
  );
}

#l-24-2 {
  width: 74px;
  shape-outside: polygon(
    97.11% 105.09%,
    27.03% 73.16%,
    20.2% -3.15%,
    34.45% 21.85%,
    53.23% 53.98%,
    67.11% 75.96%,
    82.83% 91.79%
  );
}

#r-24-2 {
  width: 84px;
  shape-outside: polygon(
    73.75% 9.47%,
    89.67% 85.02%,
    73.72% 64.42%,
    42.18% 32.25%,
    11.49% 5.43%
  );
}

#l-24-3 {
  width: 135px;
  shape-outside: polygon(82.4% 66.68%, 61.1% 59.83%, 53.7% 8.52%, 71.3% 56.07%);
}

#r-24-3 {
  width: 23px;
  shape-outside: polygon(
    65.05% -37.2%,
    73.72% 84.42%,
    -23.03% 98.92%,
    37.58% 58.77%
  );
}

/* End of Spot 24 */

/*********************************************/

/* Spot 25  */

#spot-25 {
  height: 48px;
  width: 108px;
  left: 1336px;
  top: 1348px;
}

#l-25,
#r-25 {
  height: 48px;
}

#l-25 {
  width: 54px;
  shape-outside: polygon(
    3.2% 90.76%,
    4.69% 2.32%,
    96.33% 1.03%,
    99.68% 14.81%,
    62.33% 13.76%,
    40.95% 25.04%,
    21.16% 51.61%,
    8.38% 82.81%,
    96.73% 87.65%,
    104.93% 101.54%
  );
}

#r-25 {
  width: 54px;
  shape-outside: polygon(
    98.46% 5.17%,
    98.94% 89.73%,
    85.65% 41.18%,
    54.04% 19.09%,
    8.41% 8.49%
  );
}

/* End of Spot 25 */

/*********************************************/

/* Spot 26  */

#spot-26 {
  height: 102px;
  width: 148px;
  left: 1167px;
  top: 1297px;
}

#l-26,
#r-26 {
  height: 102px;
}

#l-26 {
  width: 95px;
  shape-outside: polygon(
    1.85% 100.56%,
    4.69% 2.32%,
    100.38% 1.03%,
    88.1% 9.91%,
    61.81% 20.78%,
    37.05% 36.81%,
    15.08% 61.85%,
    8.68% 73.99%,
    13.72% 85.8%,
    96.73% 87.65%,
    104.93% 101.54%
  );
}

#r-26 {
  width: 53px;
  shape-outside: polygon(
    98.46% 5.17%,
    100.39% 102.99%,
    81.46% 79.25%,
    60.26% 28.43%,
    43.77% 15.17%,
    25.98% 3.59%
  );
}

/* End of Spot 26 */

/*********************************************/

/* Spot 27  */

#spot-27 {
  height: 90px;
  width: 210px;
  left: 957px;
  top: 1312px;
}

#l-27,
#r-27 {
  height: 90px;
}

#l-27 {
  width: 105px;
  shape-outside: polygon(
    1.85% 100.56%,
    0.88% 4.54%,
    104.19% 8.81%,
    90% 18.8%,
    78.01% 28.56%,
    63.19% 40.53%,
    47.53% 50.14%,
    27.46% 60.74%,
    5.82% 73.99%,
    10.86% 86.91%,
    98.63% 85.43%,
    104.93% 101.54%
  );
}

#r-27 {
  width: 105px;
  shape-outside: polygon(
    98.46% 5.17%,
    100.36% 103.27%,
    62.79% 86.32%,
    79.44% 74.1%,
    88.18% 49.88%,
    91.94% 31.47%,
    85.02% 16.21%,
    59.96% 9.61%,
    30.39% 7.12%,
    -1.03% 11.67%,
    -2.59% -1.97%
  );
}

.spot {
  overflow: hidden;
}
              
            
!

JS

              
                // Giraffe Pattern by Arturo Alejandro Romo Escartin from the Noun Project https://thenounproject.com/icon/142451/



              
            
!
999px

Console