Update frontpage subtitle

Author: aklevy

css/style-narrow.css

@@ -60,7 +60,7 @@
     background: var(--dark-transparent-grey);
 	color: white;
 	padding: 4em;
-    padding-bottom: 3em;
+    padding-bottom: 2em;
     padding-top: 3em;
 
 	text-align: center;

css/style.css

@@ -1123,7 +1123,9 @@ div.logo-grid a:hover{
 #banner .inner {
     background: var(--dark-transparent-grey);
 	color: white;
-	padding: 4em;
+	padding: 3.5em;
+    padding-left: 4em;
+    padding-right: 4em;
 
 	text-align: center;
 }
@@ -1139,7 +1141,23 @@ div.logo-grid a:hover{
     padding-right: 20px;
 }
 
-h2.software {
+h2.catchphrase {
+    font-size: 35px;
+    font-weight: 200 !important;
+    font-family: 'Catamaran', sans-serif;
+    color: #8acdd0;
+    margin-bottom: 0;
+}
+div.line{
+    margin: auto;
+    width: 200px;
+    height: 8px;
+    border-bottom: solid 2px #6ea4a6;
+    margin-bottom: 20px;
+    margin-top: 20px;
+}
+h2.software{
+    
     font-size: 74px;
     font-weight: 700 !important;
     font-family: 'Catamaran', sans-serif;
@@ -1164,6 +1182,8 @@ h2.software.small{
     font-weight: 600;
 
     padding: 0.5em;
+    padding-left: 1em;
+    padding-right: 1em;
     text-transform: uppercase;
 
     border: solid var(--light-grey) 1px;

index.html

@@ -38,15 +38,15 @@
                     <h2 class="software">ossia score</h2>
                 </div>
 
+                   <div class="line"></div>
                 <!-- Short description -->		
-                <h2 style="color:white; margin-bottom: 0;">A free, open-source, cross-platform intermedia sequencer</h2>
-                <p> Enables precise and flexible scripting of interactive scenarios.
-                <br/>
-                Control and score any OSC-compliant software or hardware:
+                <h2 class="catchphrase">A free and open-source sequencer</h2>
+                             
+                <p style="font-size: 20px;"> A <b>free, open-source, cross-platform intermedia sequencer </b> for precise and flexible scripting of <b>interactive</b>  scenarios. <br/> Control and score any OSC-compliant software or hardware:
                 Max/MSP, PureData, openFrameworks, Processing… </p>
                 <br/>
                 <!-- Download button -->		
-            <a href="/score/download.html" class="download">Download ossia score</a>
+            <a href="/score/download.html" class="download">Download</a>
             </header>
 
         </div>  
@@ -73,7 +73,7 @@ <h2 style="text-align: center;" ><span class="title-section" style="color: black
 <img id="overlay-image" src="/assets/score.png"/>
 </div>
  <section id="index" class="dark-grey" >
-       <h2 style="text-align: center;" ><a href="/score/features.html" class="title-section">Main features</a></h2> 
+       <h2 style="text-align: center;" ><a href="/score/features.html" class="title-section">A New Era for Digital Art</a></h2> 
        <div class="feature-container">
             <div class="feature image-container">
                 <img onclick="displayInOverlay(this.src)" src="/assets/score.png"/>
@@ -123,7 +123,7 @@ <h2>A scriptable, open software</h2>
        <div class="feature-container reversed">
            <div class="feature text" >
                <h2>Mixed modular & timeline workflow</h2>
-               <p>ossia score allows to connect processes in a modular way directly from its timeline
+               <p>Connect processes in a modular way directly from its timeline:
                    <ul>
                        <li>Switch between timeline and nodal view at any point to edit processes more precisely</li>
                        <li>Create state-machine-like scores for atemporal scenarios</li>