Update index.html

index.html

@@ -83,7 +83,7 @@
                 <a href="https://hf.co/AtlaAI/Selene-1-Mini-Llama-3.1-8B" target="_blank"
                    class="external-link button is-normal is-rounded is-dark">
                   <span class="icon">
-                      <i class="fab fa-huggingface"></i>
+                      <i class="fas">🤗</i>
                   </span>
                   <span>HuggingFace</span>
                 </a>
@@ -116,19 +116,15 @@
   </div>
 </section>
 
-<section class="hero teaser">
+<section class="section">
   <div class="container is-max-desktop">
-    <div class="hero-body">
-      <img src="/api/placeholder/800/400" alt="Placeholder for GIF"/>
-      <h2 class="subtitle has-text-centered">
-        Atla Selene Mini outperforms current state-of-the-art small language models across multiple benchmarks
-      </h2>
+    <!-- Logo -->
+    <div class="columns is-centered has-text-centered">
+      <div class="column is-2">
+        <img src="figs/atla-logo.png" alt="Atla Logo" style="width: 75%">
+      </div>
     </div>
-  </div>
-</section>
 
-<section class="section">
-  <div class="container is-max-desktop">
     <!-- Abstract -->
     <div class="columns is-centered has-text-centered">
       <div class="column is-four-fifths">
@@ -147,6 +143,18 @@
       </div>
     </div>
 
+    <!-- Demo GIF -->
+    <div class="columns is-centered">
+      <div class="column is-four-fifths">
+        <div class="content has-text-centered">
+          <img src="/api/placeholder/800/400" alt="Demo of Atla Selene Mini in action"/>
+          <p class="subtitle">
+            Demo of Atla Selene Mini in action
+          </p>
+        </div>
+      </div>
+    </div>
+
     <!-- Key Results -->
     <div class="columns is-centered">
       <div class="column is-four-fifths">