Updated the jumbotron based on the new design

content/2021/theiacon/_index.md

@@ -2,8 +2,8 @@
 logo: '2021/theiacon/images/logos/theiacon-logo.svg'
 title: 'TheiaCon 2021'
 seo_title: 'TheiaCon 2021'
-headline: 'Jump Aboard the <br> Theia Rocketship'
-subtitle: 'Leading the Next Generation of Cloud IDE Development'
+headline: |
+  <div class='headerCtn'><h1>Jump Aboard the <br> Theia Rocketship</h1> <h2>Leading the Next Generation <br> of Cloud IDE Development</h2></div>
 tagline: 'Virtual Conference | November 17, 2021'
 summary: 'TheiaCon is a virtual conference focused around the Eclipse Theia IDE ecosystem. It brings together a diverse group of Theia developers, adopters, and other contributors. The program will feature a mix of full-length talks, expert panel discussions and short ”lightning talks” focused on project insider, adopter, and broader ecosystem stories. This event is hosted by the Eclipse Foundation’s Cloud DevTools Working Group and is open to anyone interested in learning more about Cloud IDE development and the Theia project.'
 date: 2021-11-17
@@ -12,7 +12,7 @@ links:
   [
     [href: 'https://www.crowdcast.io/e/theiacon2021', text: 'REGISTER'],
     [href: 'https://forms.gle/M3ckHPmjFpop6FzdA', text: 'Call for Papers'],
-    [href: '#', text: 'Speakers/Program Committee'],
+    [href: '#', text: 'Speakers'],
     [href: '#', text: 'Agenda'],
   ]
 hide_page_title: true

less/theiacon.less

@@ -2,26 +2,52 @@
   background-image: linear-gradient(rgba(0, 0, 0, 0.3), rgba(0, 0, 0, 0.3)),
     url('images/theiacon/theia-background-image.jpg');
   background-size: cover;
-  height: 610px;
 }
 
 .featured-jumbotron {
   text-shadow: 2px 2px #000;
   h1 {
-    @media (min-width: 768px) {
-      margin-right: -85px;
-    }
-    margin-top: 60px;
-    text-align: end;
+    margin-bottom: 0;
     &:after {
       border: none;
     }
   }
-  h2 {
-    margin-top: 80px;
+  .headerCtn {
+    h1 {
+      @media (min-width: 768px) {
+        text-align: end;
+        margin: 60px 0 0;
+      }
+      margin-top: -25px;
+      text-align: center;
+    }
+    h2 {
+      @media (min-width: 992px) {
+        font-size: 26px;
+      }
+      @media (min-width: 768px) {
+        text-align: end;
+        margin: 0 0 40px;
+      }
+      text-align: center;
+      font-size: 20px;
+      font-weight: 500;
+      margin-top: 120px;
+    }
   }
-  .btn {
-    text-shadow: none;
-    margin-bottom: 15px;
+
+  .list-inline {
+    & {
+      @media (min-width: 768px) {
+        display: block;
+      }
+      display: flex;
+      flex-direction: column;
+    }
+    .btn {
+      width: 200px;
+      text-shadow: none;
+      margin-bottom: 15px;
+    }
   }
 }