Untitled

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title><?=$title?></title>
<link rel="stylesheet" href="<?=$assets?>css/style.css" />
<? foreach($javascripts as $js): ?>
<script type="text/javascript" charset="utf-8" src="<?php echo $js;?>"></script>
<? endforeach; ?>

<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-24129924-1']);
_gaq.push(['_trackPageview']);

(function() {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
$(document).ready(function() {
    $("#bottom").css('visibility', 'visible');
    $("#bottom").css('position', 'relative');
})
</script>
</head>
<body>
<? echo form_open('welcome/update_layout'); ?>
</form>
<table width="950" height="1003" border="0" cellspacing="0" cellpadding="0" align="center" style="background: url(<?=$assets?>images/step1.png) no-repeat top; background-position:13px 120px; margin: 0 auto; padding: 0px;">
  <tr>
    <td valign="top"><div class="wrapper" style="width: 950px;">
    <div class="header" style="padding-left: 75px;">
<a href="<?=$link_base.''?>" title="Velcro&#174; Home"><img src="<?=$assets?>images/smlogo.png" id="logo" alt="Velcro&#174; Home"  style="padding-left: 30px;" /></a>
  <img src="<?=$assets?>images/school.png" />
    <div class="direction_container">
    <div class="text_direction" style="width: 240px;"> <span class="title">Step #1:</span>
        <div class="title_header" style="padding-bottom: 10px;">Create your board.</div>
        <div class="header_text" style="width: 220px;">Select, drag and drop up to 10 images onto your board to inspire your story.</div>
      </div>
    </div>
  </div>  <?php #<div class="wrapper" style="background:url('<?=$assets*****images/dragdrop.png') no-repeat;">?>
 <div id="topl_link"><a href="<?=$link_base.'welcome/create_mobile'?>" style="font-family:Myriad Pro; text-decoration: underline; color: #000;font-size: 12px; font-weight: bold;">On a mobile phone?</a></div>

  <div id="drop_area" class="vel_content ui-droppable" style="padding-right: 20px;"></div>

  <div class="bottom_container" style="background: none; visibility:hidden; margin-left: 25px;" id="bottom">
      <div style="margin-top: 30px;"><div class="nav_left"><a href="javascript:cycle_elements(-1)"><img src="<?=$assets?>images/arrow_right.png" style="padding-left: 10px;" id="navleft" /></a></div>
        <div class="bottom_content">

        </div>
      <div class="nav_right"><a href="javascript:cycle_elements(1)"><img src="<?=$assets?>images/arrow_left.png" style="float: right;margin-top:-15px;" id="navright" /></a></div>
      </div>
  <div class="buttom_button" style="margin-top: 25px;">
      <div class="button" style="margin-left: 45%;">
        <div>
        <a href="javascript:update_layout();"><img src="<?=$assets?>images/continue.png" /></a>
        <br />
            <div style="font-size: 18px;color: black;font-family: Myriad Pro;">Items Remaining:<span id="countdown" style="color:#000;font-weight:bold;"></span></div>
        </div>
      </div>
  </div>
  </div>


</div>
    </td>
  </tr>
<tr><td valign="top">
<div id="footer">    <span><a href="http://www.velcro.com/" target="_blank">Velcro.com Home</a> |</span>
  <span><a href="https://www.facebook.com/velcrobrand" target="_blank">Velcro&#174; brand fasteners on Facebook</a> |</span>
  <span><a href="<?=$link_base.'main/create6'?>">Rules &amp; Conditions</a> |</span>  <span><a href="http://www.youtube.com/watch?v=7GtddCLSTNk" target="_blank">Watch Memo Board Video</a> |</span>
  <span><a href="<?=$link_base.'main/create5'?>">Prizes</a></span><br /><br />
  <span>&copy; 2011 Velcro USA</span>
</td></tr>
</table>

<script>
$("#navleft").hover(
  function () {
    $(this).attr("src", "<?=$assets?>images/arrowRhover.png");
  },
  function () {
    $(this).attr("src", "<?=$assets?>images/arrow_right.png");
  }
);

$("#navright").hover(
  function () {
    $(this).attr("src", "<?=$assets?>images/arrowLhover.png");
  },
  function () {
    $(this).attr("src", "<?=$assets?>images/arrow_left.png");
  }
);
</script>
</body>
</html>