landing.html

<style>
body {
  background-color: #222;
  color: #fff;
}
a {
    display: block;
    color: #ddd;
    font-family: monospace;
    white-space: pre;
    margin: 1em 2vw;
    text-decoration: none;
}
a:hover {
  font-weight: bold;
  text-shadow: 0 0 2px #999;
  color: #fff;
  transition: all 0.5s ease-out;
}
.small { text-align:center; font-size: 8vw; text-shadow: none; }

pre.hr { max-width:100%; overflow:hidden;  margin:0 2vw; }

@media (max-width: 800px) {
  a .large { display:none; }
  a .small { display:inherit; }

}
@media (min-width:800px) {
  a .large { display:inherit; }
  a .small { display:none; }
}
</style>
<a href="/demos/">
  <span class="large">
      ××  ××    ××  ××××××  ××××××      ××××××  ××    ××    ××××    ××××××    ××××××××××  ××××××××××
      ××  ××  ××      ××    ××    ××  ××        ××    ××  ××    ××  ××    ××      ××            ××
      ××  ××××        ××    ××××××    ××        ××××××××  ××××××××  ××××××        ××          ××
××    ××  ××  ××      ××    ××    ××  ××        ××    ××  ××    ××  ××    ××      ××        ××
  ××××    ××    ××  ××××××  ××    ××    ××××××  ××    ××  ××    ××  ××    ××      ××      ××××××××××



××××××    ××××××××  ××      ××    ××××      ××××××
××    ××  ××        ××××  ××××  ××    ××  ××
××    ××  ××××××    ××  ××  ××  ××    ××    ××××
××    ××  ××        ××      ××  ××    ××        ××
××××××    ××××××××  ××      ××    ××××    ××××××
  </span>
  <span class="small">JKirchartz Demos</span>
</a>

<pre class="hr">--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------</pre>