title for gender

Author: lathug

website/index.html

@@ -89,6 +89,11 @@ <h2>How has gender representation evolved across Olympic sports and disciplines
       </div>
       <div class="slide" data-anchor="gender-container">
         <div id="gender-viz">
+          <h2 class="gender-viz-title">Gender representation in Olympic sports</h2>
+          <p class="gender-viz-subtitle">
+            Hover over the disciplines to explore how men’s and women’s participation differs across sports and disciplines.
+          </p>
+
           <div id="gender-pie"></div>
 
           <div class="gender-controls">

website/styles.css

@@ -382,6 +382,25 @@ p {
   padding: 20px;
 }
 
+.gender-viz-title {
+  font-family: "Elms Sans", sans-serif;
+  font-size: 28px;
+  font-weight: 700;
+  width: 100%;
+  padding-bottom: 6px;
+  margin: 0 auto;
+}
+
+.gender-viz-subtitle {
+  font-family: "Elms Sans", sans-serif;
+  width: 70%;
+  margin: 0 auto 10px;
+  text-align: center;
+  font-size: 16px;
+  line-height: 1.25;
+  color: rgba(255,255,255,0.75);
+}
+
 /* =============================================
    Delegations section
    =========================================== */