From b59bd8314c5ffb2f54cb4f29ee787c271b91948b Mon Sep 17 00:00:00 2001
From: Chris Bews <koshiro@gmail.com>
Date: Thu, 1 Oct 2020 12:24:45 +0100
Subject: [PATCH] Testing font loading

---
 testing.html | 172 +++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 172 insertions(+)
 create mode 100644 testing.html
diff --git a/testing.html b/testing.html
new file mode 100644
index 0000000..b5363ca
--- /dev/null
+++ b/testing.html
@@ -0,0 +1,172 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="ut-8" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <meta property="og:title" content="LUMI" />
+    <meta name="twitter:title" content="LUMI" />
+    <meta
+      name="description"
+      content="Choose songs you love in the app, follow the lights on the keyboard, and build skills that last a lifetime.&nbsp;Unlock your musical potential with an easy, all-in-one system. LUMI is the fun, instant, rewarding way to learn to play the piano."
+    />
+    <meta
+      name="og:description"
+      content="Choose songs you love in the app, follow the lights on the keyboard, and build skills that last a lifetime.&nbsp;Unlock your musical potential with an easy, all-in-one system. LUMI is the fun, instant, rewarding way to learn to play the piano."
+    />
+    <meta
+      name="twitter:description"
+      content="Choose songs you love in the app, follow the lights on the keyboard, and build skills that last a lifetime.&nbsp;Unlock your musical potential with an easy, all-in-one system. LUMI is the fun, instant, rewarding way to learn to play the piano."
+    />
+    <meta name="twitter:card" content="summary_large_image" />
+    <meta
+      property="og:image"
+      content="https://d1ag85ptixulvl.cloudfront.net/2azq4ayq3grn/BEGjAzP1QdBZb4e6Z5zdA/6ff0e3f9cc2989951110afbdac5ac9c9/Overview_-_Hero.jpg?w=1200&amp;h=630"
+    />
+    <meta property="og:image:width" content="1200" />
+    <meta property="og:image:height" content="630" />
+    <meta
+      name="twitter:image"
+      content="https://d1ag85ptixulvl.cloudfront.net/2azq4ayq3grn/BEGjAzP1QdBZb4e6Z5zdA/6ff0e3f9cc2989951110afbdac5ac9c9/Overview_-_Hero.jpg?w=1024&amp;h=512"
+    />
+    <meta property="og:type" content="website" />
+    <title>LUMI</title>
+    <link
+      rel="icon"
+      href="data:image/x-icon;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAABGdBTUEAALGPC/xhBQAAAAFzUkdCAK7OHOkAAAAgY0hSTQAAeiYAAICEAAD6AAAAgOgAAHUwAADqYAAAOpgAABdwnLpRPAAAAVNQTFRF/////Pz8tbW1s7Oz+/v7wsLCpKSk8fHx4+PjnZ2d1dXV7e3txcXF/v7+19fXzMzMtLS09/f3SUlJRUVF9vb2a2trIiIi3t7eurq6EBAQmZmZt7e3Pj4+4eHhenp6cnJyR0dHSEhIS0tLRkZGIyMju7u7ERERmpqagICACQkJn5+fNDQ0NjY26urq+Pj4/f39WFhYBAQETk5O9PT0lZWVCwsLExMT+vr6nJycKSkpFhYWpqamISEhFRUVkJCQbGxsHx8f2traDw8PEhISh4eHMjIyMTExhYWF8PDwSkpKRERE8/PzDg4Oo6Ojd3d3JSUl29vbdHR0BQUFLCws2dnZz8/PWlpaX19fXV1de3t7PT09Z2dnFxcXQEBAW1tbw8PDGhoav7+/VlZWPz8/YGBg7+/v0NDQbW1tNTU1Ozs7gYGB9fX1eHh45ubmi4uLj4+P+fn5MTAfqAAAAAFiS0dEAIgFHUgAAAAJcEhZcwAAAEgAAABIAEbJaz4AAAD/SURBVDjLY2AYBfQDjEzMLECKlY2dgYGDk4uBm4eXgYGPn4GRWYARrEBQSFgESImKiTMwSEhKMUjLyDIwyMkzCCooCkIUKCmDFagAFaiqqTNoaGoxcGjr6OopYlegb2BoZGxiaiZhjl2BhbilipW1kY2tHbICEMPewZGBgdmJk83ZxdXNyl3BwEMIpsDTy1tfn8HFx5eB0c9JQN4/IDAoOEReLNQTqoAlzNYgPCIyNEolOiImnCM2Tj8+QY6BzYfTUwGigCExKTlWJiU1LT0jM4sjO0eAQS+QlSE3PTEvXx8aVAXGxsYivAyM3B7AIGIBinoAQ46Rl4VxoONwZAEARD4mt/FEhFcAAAAldEVYdGRhdGU6Y3JlYXRlADIwMTktMDYtMThUMTU6Mzc6MDkrMDA6MDDT/SjeAAAAJXRFWHRkYXRlOm1vZGlmeQAyMDE5LTA2LTE4VDE1OjM3OjA5KzAwOjAwoqCQYgAAABF0RVh0anBlZzpjb2xvcnNwYWNlADIsdVWfAAAAIHRFWHRqcGVnOnNhbXBsaW5nLWZhY3RvcgAxeDEsMXgxLDF4MemV/HAAAABGdEVYdHNvZnR3YXJlAEltYWdlTWFnaWNrIDYuNy44LTkgMjAxNC0wNS0xMiBRMTYgaHR0cDovL3d3dy5pbWFnZW1hZ2ljay5vcmfchu0AAAAAGHRFWHRUaHVtYjo6RG9jdW1lbnQ6OlBhZ2VzADGn/7svAAAAGHRFWHRUaHVtYjo6SW1hZ2U6OmhlaWdodAAxOTIPAHKFAAAAF3RFWHRUaHVtYjo6SW1hZ2U6OldpZHRoADE5MtOsIQgAAAAZdEVYdFRodW1iOjpNaW1ldHlwZQBpbWFnZS9wbmc/slZOAAAAF3RFWHRUaHVtYjo6TVRpbWUAMTU2MDg3MjIyOUH50p8AAAAPdEVYdFRodW1iOjpTaXplADBCQpSiPuwAAABWdEVYdFRodW1iOjpVUkkAZmlsZTovLy9tbnRsb2cvZmF2aWNvbnMvMjAxOS0wNi0xOC9mNDc0ZTAxNjQzZjYzZTY2YWM1Mzg5ZGI1YTcxNWQwZS5pY28ucG5neYT3nAAAAABJRU5ErkJggg=="
+    />
+    <style>
+      @font-face {
+        font-family: "Contax Pro";
+        font-weight: 500;
+        src: url("//d30pueezughrda.cloudfront.net/fonts/contax-pro/contaxpro65med.woff2")
+            format("woff2"),
+          url("//d30pueezughrda.cloudfront.net/fonts/contax-pro/contaxpro65med.woff")
+            format("woff");
+      }
+
+      html,
+      body {
+        height: 100%;
+        margin: 0;
+        padding: 0;
+      }
+
+      .site-wrapper {
+        display: flex;
+        flex-direction: column;
+        align-items: center;
+        justify-content: center;
+        box-sizing: border-box;
+        width: 100%;
+        height: 100%;
+        padding: 40px;
+        background: rgba(26, 30, 201, 1)
+          url("https://d1ag85ptixulvl.cloudfront.net/2azq4ayq3grn/2t6Z0IruOWfFVQ6Ka8taLv/1501ac866b0970a6b2345c220d1ab780/Header_Generic_D__2x.jpg")
+          no-repeat 50% 50%;
+        background-size: cover;
+      }
+
+      .lumi-logo {
+        margin: 0;
+        padding: 0;
+        fill: rgba(255, 255, 255, 1);
+      }
+
+      .lumi-logo svg {
+        width: 9rem;
+        height: 3.05187375;
+        margin: 0;
+        padding: 0;
+        vertical-align: top;
+      }
+
+      .message {
+        max-width: 260px;
+        margin: 0;
+        padding: 30px 0 0 0;
+        color: rgba(215, 246, 255, 1);
+        font-family: "Contax Pro", "HelveticaNeue", "Helvetica Neue",
+          "HelveticaNeueRoman", "HelveticaNeue-Roman", "Helvetica Neue Roman",
+          "Helvetica", "Tahoma", "Geneva", "Arial", sans-serif;
+        font-size: 1.25rem;
+        line-height: 1.5rem;
+        font-weight: 500;
+        text-align: center;
+      }
+
+      .message-first-line {
+        display: block;
+      }
+
+      .message-last-line {
+        display: block;
+        padding: 10px 0 0 0;
+      }
+
+      @media (min-width: 420px) {
+        .message {
+          max-width: none;
+        }
+      }
+
+      @media (min-width: 550px) {
+        .lumi-logo svg {
+          width: 10rem;
+          height: 3.390970833333333rem;
+        }
+
+        .message {
+          padding-top: 30px;
+          font-size: 1.5rem;
+          line-height: 1.75rem;
+        }
+
+        .message-first-line {
+          display: inline;
+        }
+
+        .message-first-line::after {
+          content: " ";
+        }
+
+        .message-last-line {
+          padding-top: 10px;
+        }
+      }
+
+      @media (min-width: 960px) {
+        .lumi-logo svg {
+          width: 15rem;
+          height: 5.08645625rem;
+        }
+
+        .message {
+          padding-top: 50px;
+          font-size: 2.375rem;
+          line-height: 2.75rem;
+        }
+
+        .message-last-line {
+          padding-top: 10px;
+        }
+      }
+    </style>
+  </head>
+  <body>
+    <div class="site-wrapper">
+      <h1 class="lumi-logo">
+        <svg viewBox="0 0 236 84" xmlns="http://www.w3.org/2000/svg">
+          <path
+            d="M195.623 5.074c-.711-2.582-4.291-2.815-5.335-.35l-19.51 46.086-19.51-46.086c-1.043-2.465-4.624-2.232-5.335.35l-18.413 66.86c-1.044 3.792 1.195 7.708 4.998 8.748 3.804 1.042 7.735-1.189 8.779-4.98l9.662-35.085 17.213 40.659c.972 2.299 4.24 2.299 5.213 0l17.213-40.659 9.662 35.085c1.044 3.791 4.974 6.022 8.778 4.98 3.805-1.04 6.042-4.956 4.998-8.748l-18.413-66.86zm25.405 68.62V4.355H236v69.337c0 4.121-3.353 7.46-7.486 7.46-4.135 0-7.486-3.339-7.486-7.46zM89.511 82.108c-17.366 0-32.456-12.652-32.456-33.42V4.356h14.97v43.736c0 12.174 7.187 20.052 17.486 20.052 10.3 0 17.487-7.878 17.487-20.052V4.356h14.97V48.69c0 20.768-15.09 33.42-32.457 33.42zM0 65.918V4.373l.017-.017h14.939l.016.017v58.28a3.893 3.893 0 003.9 3.886h33.904v14.615H15.289C6.846 81.154 0 74.332 0 65.918z"
+            fill-rule="evenodd"
+          ></path>
+        </svg>
+      </h1>
+      <p class="message">
+        <span class="message-first-line">LUMI pre-orders</span>are going live
+        today.
+        <span class="message-last-line"> Come back soon!</span>
+      </p>
+    </div>
+  </body>
+</html>
