<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=730" />
  <title>gif-maker</title>
  <link rel="stylesheet" type="text/css" href="rpstyle.css" />
</head>

<body>

<div id="page-loader"></div>

<div id="wrapper" class="homepage-wrapper">

<p class="beta-link fade-in-8++++ delay6" style="text-align:center; top:-08px; margin-bottom:-20px; opacity:0;">
  <a href="beta/index.html" class="beta-link">&nbsp;[ beta testers click here ]&nbsp;</a>
</p>

<!-- trigger -->
<span class="rp-frame" data-switch-target=".start-trigger" data-trigger-after="100" data-reset-before="98" data-pause-scroll></span>
<span class="rp-frame" data-switch-target=".start-trigger-hold" data-trigger-after="100" data-reset-before="-90000"></span>

<p class="overmask" style="margin-top:20px; right:4px;">
  <!-- images: THE REAL PLEASURE letters -->
  <img src="images/title-letters/the-t.png" width="45" class="wobble-up-b title-delay1" style="position:relative; left:43px;" alt="the real pleasure in life"> 
  <img src="images/title-letters/the-h.png" width="25" class="wobble-up-b title-delay2" alt="" style="position:relative; left:33px; top:7px;"> 
  <img src="images/title-letters/the-e.png" width="28" class="wobble-up-b title-delay3" alt="" style="position:relative; left:32px; top:02px;"> 
  <img src="images/title-letters/real-r.png" width="36" class="wobble-up-b title-delay4" alt="" style="position:relative; left:47px; top:16px;"> 
  <img src="images/title-letters/real-e.png" width="27" class="wobble-up-b title-delay5" alt="" style="position:relative; left:40px; top:04px;"> 
  <img src="images/title-letters/real-a.png" width="29" class="wobble-up-b title-delay6" alt="" style="position:relative; left:40px; top:01px;"> 
  <img src="images/title-letters/real-l.png" width="27" class="wobble-up-b title-delay7" alt="" style="position:relative; left:39px; top:-1px;"> 
  <img src="images/title-letters/pleasure-p.png" width="36" class="wobble-up-a title-delay8" alt="" style="position:relative; left:43px; top:35px; transform-origin:center 60%;"> 
  <img src="images/title-letters/pleasure-l.png" width="21" class="wobble-up-a title-delay9" alt="" style="position:relative; left:39px; top:04px;"> 
  <img src="images/title-letters/pleasure-e1.png" width="27" class="wobble-up-a title-delaya" alt="" style="position:relative; left:38px; top:03px;"> 
  <img src="images/title-letters/pleasure-a.png" width="35" class="wobble-up-a title-delayb" alt="" style="position:relative; left:33px; top:07px;"> 
  <img src="images/title-letters/pleasure-s.png" width="19" class="wobble-up-a title-delayc" alt="" style="position:relative; left:30px; top:07px;"> 
  <img src="images/title-letters/pleasure-u.png" width="27" class="wobble-up-a title-delayd" alt="" style="position:relative; left:27px; top:04px;"> 
  <img src="images/title-letters/pleasure-r.png" width="34" class="wobble-up-a title-delaye" alt="" style="position:relative; left:24px; top:33px; transform-origin:center 80%;"> 
  <img src="images/title-letters/pleasure-e2.png" width="39" class="wobble-up-a title-delayf" alt="" style="position:relative; left:11px; top:00px;">
</p>

<p class="fade-in-1 delay3_5" style="left:201px; top:11px;">
  <!-- images: IN LIFE letters -->
  <img src="images/title-letters/inlife-i1.png" height="52" id="drop-i1" alt="" style="position:relative; left:-1px; top:00px;"> 
  <img src="images/title-letters/inlife-n.png" width="34" id="drop-n" alt="" style="position:relative; left:-4px; top:00px;"> 
  <img src="images/title-letters/inlife-l.png" width="36" id="drop-l" alt="" style="position:relative; left:08px; top:07px;"> 
  <img src="images/title-letters/inlife-i2.png" width="16" id="drop-i2" alt="" style="position:relative; left:03px; top:13px;"> 
  <img src="images/title-letters/inlife-f.png" width="29" id="drop-f" alt="" style="position:relative; left:-1px; top:19px;"> 
  <img src="images/title-letters/inlife-e.png" width="38" id="drop-e" alt="" style="position:relative; left:-6px; top:03px;"> 
</p>

<span id="anchor"></span>

<p>
  <img src="images/title-letters/underline.png" width="203" alt="" style="position:relative; left:192px; top:27px;"> 
  <span id="eraserbox-website"></span>
</p>


<p id="homepage-subtitle" class="fade-in-3 delay4_9" style="left:28px;">
  <!-- [ a novel in html & javascript ] -->
  [ a novel in 
   <span id="istoodup1" class="duration0_9 delay0 start-trigger">a</span><!--
--><span id="istoodup2" class="duration0_9 delay0_04 start-trigger">n</span><!--
--><span id="istoodup3" class="duration0_9 delay0_08 start-trigger">i</span><!--
--><span id="istoodup4" class="duration0_9 delay0_12 start-trigger">m</span><!--
--><span id="istoodup5" class="duration0_9 delay0_15 start-trigger">a</span><!--
--><span id="istoodup6" class="duration0_9 delay0_18 start-trigger">t</span><!--
--><span id="istoodup7" class="duration0_9 delay0_21 start-trigger">e</span><!--
--><span id="istoodup8" class="duration0_9 delay0_24 start-trigger">d</span>
  <span class="istoodup10-word duration0_9 delay0_3 start-trigger">
    <span id="blowright" class="delay1_2 f-21 start-trigger">
       <span id="puff1" class="duration1_8 delay1_05 start-trigger">t</span><!--
    --><span id="puff2" class="duration1_8 delay1_09 start-trigger">e</span><!--
    --><span id="puff3" class="duration1_8 delay1_13 start-trigger">x</span><!--
    --><span id="puff4" class="duration1_8 delay1_17 start-trigger">t</span>
    </span>
  </span><span class="down1 right5">]</span>
  <span id="text-replace" class="fade-in-2 ease-in delay1_8 start-trigger">
    text
  </span>
</p>


  <p class="scenebreak">&nbsp;</p>
  <p class="scenebreak">&nbsp;</p>




<div id="homepage-bottom"></div>

<div id="chapterbottom-big"></div>

</div>

<script type="text/javascript" src="js/d3.v2.js"></script>
<script type="text/javascript" src="js/underscore.js"></script>
<script type="text/javascript" src="js/realpleasure.js"></script>

</body>
</html>