/* Updates to core css to get things working */

#player_wrapper {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  overflow: hidden;
}
#main-content #player {
//  height: 116%;
//  top: -8%;
}

#main-content {
  position: relative;
  height: 100vh;
}

#main-content:after {
  position: absolute;
//  content: '';
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: transparent;
}

body #share {
  z-index: 10;
}

/* WELCOME CLICK-THROUGH OVERLAY */
#clickin {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 99;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  font-size: calc(1rem + 2vw);
  background: rgba(0,0,0,.7);
  transition: background .5s, opacity 1s ease-in-out, bottom 3s ease-in;
  overflow: hidden;
}
#clickin span {
  cursor: pointer;
}
#clickin img {
  margin: 1rem auto .5rem;
}
#clickin small {
  font-size: 1rem;
}
#clickin span:hover small {
  color: skyblue;
}
#clickin.clickedin {
  opacity: 0;
  bottom: 100%;
  background: rgba(0,0,0,0);
}


#global-header span {
  opacity: .25;
}
#global-header em {
  margin: 0 -.05em 0 -.15em;
  font-size: 88%;
}

@media (max-width: 480px) {
  #main-content:after {
    display: none;
  }
  #clickin {
//    display: none;
  }
  audio#audioplayer {
//    display: none;
  }
  #player_wrapper {
    filter: none;
  }
}
@media only screen and (max-device-width: 480px) and (min-device-width: 320px) {
  #share, #controls {
    display: block;
  }
}

#global-header h1 a{
  background:url('logo.png');
  background-size: contain;
  background-repeat: no-repeat;
}
#global-header h1 a.logo_hover{
  background:url('logo_hover.png');
  background-size: contain;
  background-repeat: no-repeat;
}
