Styled the textual elements to make it look more like a exhibition.

#11

public/index.html

@@ -8,6 +8,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1" />
     <meta name="theme-color" content="#000000" />
     <meta name="description" content="Web site created using create-react-app" />
+    <link href='https://fonts.googleapis.com/css?family=Esteban' rel='stylesheet'>
     <link rel="apple-touch-icon" href="%PUBLIC_URL%/logo192.png" />
     <!--
       manifest.json provides metadata used when your web app is installed on a

src/App.css

@@ -18,15 +18,32 @@ body {
   text-align: center;
   padding: 0.5%;
   height: 100%;
+  line-height: 2;
+  font-size: 1rem;
+  font-family: Arial, Helvetica, sans-serif;
 }
 
 h1 {
-  text-decoration: underline;
   margin: auto;
+  line-height: 1.2;
 }
 
 header > h1 {
   text-decoration: none;
+  font-weight: 500;
+  font-size: 5.05rem;
+}
+
+h2 {
+  line-height: 1.2;
+  font-weight: 400;
+  font-size: 3.4rem;
+  text-decoration: underline;
+}
+
+h3 {
+  line-height: 1.2;
+  font-size: 2.25rem;
 }
 #wrapperdiv {
   padding-left: 5%;
@@ -73,11 +90,15 @@ button:hover {
   justify-content: space-evenly;
 }
 
+p{
+  font-family: Esteban;
+  font-weight: 350;
+}
+
 #wrapperdiv hr {
   border: 0;
   height: 1px;
   background-image: linear-gradient(to right, #202040, #b030b0, #202040);
-  /* transform:rotate(90deg) */
 }
 
 canvas {

src/components/Exhibition.tsx

@@ -24,9 +24,9 @@ const Exhibition: React.FC<Installation> = ({
   return (
     <div>
       <AudioPlayer source={audiosource} currentIndex={currentIndex} />
-      <h1>
+      <h2>
         [{currentIndex}] {title}
-      </h1>
+      </h2>
       <h3>
         By - <em>{author}</em>
       </h3>