/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline; }

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
  display: block; }

body {
  line-height: 1; }

ol, ul {
  list-style: none; }

blockquote, q {
  quotes: none; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none; }

table {
  border-collapse: collapse;
  border-spacing: 0; }

@font-face {
  font-family: "Palace Script MT W05 Regular";
  src: url("/yerly/fonts/5181108/b36764ca-1a82-45ad-8c26-cdae90efa7a9.eot?#iefix");
  src: url("/yerly/fonts/5181108/b36764ca-1a82-45ad-8c26-cdae90efa7a9.eot?#iefix") format("eot"), url("/yerly/fonts/5181108/4b78f66e-1a94-4e4a-b830-daa602763231.woff2") format("woff2"), url("/yerly/fonts/5181108/ff3ace62-f6de-4fc0-8d15-f7d537fc95e6.woff") format("woff"), url("/fonts/5181108/038f04b6-63e2-4388-ada7-869f67c575a4.ttf") format("truetype"); }

@font-face {
  font-family: "Helvetica Neue LT W05_23UltLtE";
  src: url("/yerly/fonts/5663813/d3e69efd-d933-4e23-86dd-96e0c937a4c6.eot?#iefix");
  src: url("/yerly/fonts/5663813/d3e69efd-d933-4e23-86dd-96e0c937a4c6.eot?#iefix") format("eot"), url("/yerly/fonts/5663813/7efec9b7-1374-4adc-8d45-514361fd48b8.woff2") format("woff2"), url("/yerly/fonts/5663813/06b4e4fc-e732-41a7-a362-be9f88aadc89.woff") format("woff"), url("/fonts/5663813/f9f83b5a-973f-405d-98f3-4d063792a708.ttf") format("truetype"); }

body {
  font-family: Helvetica Neue LT W05_23UltLtE; }

ul {
  font-size: 7.5vw; }

body {
  overflow: hidden;
  color: white; }

a {
  color: white;
  text-decoration: none; }

#container {
  position: absolute;
  left: 21%; }

#flex {
  display: flex; }
  #flex > * {
    flex: 0 1 auto; }

.artist-name {
  position: fixed;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  z-index: -1;
  font-family: "Palace Script MT W05 Regular"; }
  .artist-name h1 {
    width: 100vw;
    font-size: 35vw;
    text-align: center;
    line-height: .5em;
    display: none;
    margin-top: -.1em; }

.info {
  display: none;
  font-size: 1.25em;
  line-height: 1.2em;
  position: fixed;
  top: 10vh;
  left: 5vw;
  width: 500px;
  height: auto;
  background: black;
  overflow: scroll;
  box-shadow: 0 0 100px black;
  border-radius: 10px;
  z-index: 1;
  transition: height .25s, top .25s, left .25s;
  padding: 1.5em 0; }
  .info.small {
    height: 0;
    top: 100vh; }
  .info.expand {
    height: 100%;
    width: 100%;
    left: 0;
    top: 0; }
  .info p {
    margin: 0 .5em; }
  .info .header-bar {
    background: url(../assets/Popup_01.png);
    background-size: 100%;
    padding: 0 8px;
    height: 20px;
    overflow: hidden;
    z-index: 999;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; }
    .info .header-bar span {
      width: 13px;
      height: 13px;
      display: inline-block;
      border-radius: 50%;
      transform: translateY(-5px);
      z-index: 9999; }

#www.active {
  transform: translateY(0em); }

#com.active {
  transform: translateY(0em); }

#names.active {
  transform: translateY(0em);
  top: 0;
  text-align: center; }

.www {
  position: absolute;
  top: 0; }
  .www.com {
    right: 0; }

ul {
  top: 0; }

span {
  cursor: pointer; }

#flex li {
  line-height: 35vh;
  margin-top: 14.5225vh; }

@keyframes downward {
  0% {
    transform: translateY(0); }
  100% {
    transform: translateY(100vh);
    color: red; } }
