arrows fixed on home

css/global.css

@@ -430,16 +430,24 @@ span.fixed-width {
  * CSS Arrows
  */
 
-.arrow {
+a span.arrow-link {
     position:relative;
-    display:block;
-    height:34px;
-    width:90%;
-    cursor:pointer;
+    font-size: 16px;
+    display:inline-block;
+    margin:0 6px 0 0;
+    color: #363636;
+    display:inline-block;
+}
+a span.arrow-link:hover {
+    color:#000000;
+    margin:0 15px 0 0;
 }
-.arrow p {
+a span.arrow-link > span.arrow {
     position:relative;
-    padding:6px 0 0 10px;
+    display: inline-block;
+    font-size: 30px;
+    margin: -3px 0 0 0;
+    vertical-align: middle;
 }
 .arrow.red {
     background:url(/images/btn/red-sprite.png) top repeat-x;

index.html

@@ -12,31 +12,22 @@ <h1>Calling All Developers</h1>
   <img src="/images/logo_worker.png">
   <p>IronWorker is a platform that makes getting things done easy. Define workers by writing scripts in your favourite language, then queue tasks against the workers. Tasks will be run asynchronously in the background.</p>
   <a href="/worker">
-    <div class="arrow red">
-      <p>See It Live</p>
-      <div class="point"></div>	
-    </div>
+      <span class="arrow-link">See It Live <span class="arrow">➟</span></span>
   </a>
 </div>
 
 <div class="product-box">
   <img src="/images/logo_mq.png">
   <p>Scalable, elastic applications are defined by discreet processes with a limited scope of functionality. IronMQ is a message queue in the cloud that allows your application's processes to communicate in a secure, fault-tolerant way.</p>
   <a href="/mq">
-    <div class="arrow red">
-      <p>See It Live</p>
-      <div class="point"></div>	
-    </div>
+      <span class="arrow-link">See It Live <span class="arrow">➟</span></span>
   </a>
 </div>
 
 <div class="product-box last">
   <img src="/images/logo_cache.png">
   <p>A key/value store in the cloud, IronCache allows you to define caches that you can store and retrieve values from. Built on industry standards, it makes building out scalable, temporary storage simple.</p>
   <a href="/cache">
-    <div class="arrow red">
-      <p>See It Live</p>
-      <div class="point"></div>	
-    </div>
+    <span class="arrow-link">See It Live <span class="arrow">➟</span></span>
   </a>
 </div>