/* Normalize margin and padding */
* {
  margin: 0;
  padding: 0; }

html, body {
  width: 100%;
  min-width: 254px;
  height: 100%;
  margin: 0;
  padding: 0;
  font-family: "HelveticaNeue-Light", "Helvetica Neue Light", "Helvetica Neue", Helvetica, Arial, "Lucida Grande", sans-serif;
  font-weight: 300;
  color: #000;
  background: #000; }

i {
  color: #FFF; }

.player {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%; }

#player-container {
  overflow: hidden;
  background-color: #000;
  position: relative; }

#ad-player {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0; }

#overlay {
  z-index: 2;
  display: none;
  height: 100%;
  width: 100%;
  position: absolute; }

.no-pointer-event {
  pointer-events: none; }

#splash {
  cursor: pointer;
  display: none;
  z-index: 4;
  background-position: center;
  background-size: cover;
  color: #FFF;
  text-shadow: black 1px 2px 3px; }

#show-info {
  bottom: 5vh;
  left: 5vw;
  padding-right: 5vh;
  position: absolute; }

#title {
  color: #FFF;
  font-size: 7vmin;
  text-overflow: ellipsis;
  overflow: hidden;
  min-height: 100vmin;
  display: table-cell;
  vertical-align: bottom; }

#source {
  padding-top: 2vmin;
  font-size: 3vmin;
  text-transform: lowercase;
  color: #ff5722; }

#source span {
  color: #FFF; }

#h5player-1 {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
  background-position: center;
  max-width: 100%;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0;
  left: 0;
  margin: auto;
  width: 100%;
  max-height: 100%; }

.remove-controls::-webkit-media-controls {
  display: none !important; }

.play_button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 46.5%;
  width: 8%;
  border-radius: 50%;
  background: #FF5800;
  cursor: pointer;
  background: -webkit-linear-gradient(#ff5722, #bf360c);
  background: -o-linear-gradient(#ff5722, #bf360c);
  background: -moz-linear-gradient(#ff5722, #bf360c);
  background: linear-gradient(#ff5722, #bf360c); }

#splash:hover .play_button {
  background: -webkit-linear-gradient(#bf360c, #ff5722);
  background: -o-linear-gradient(#bf360c, #ff5722);
  background: -moz-linear-gradient(#bf360c, #ff5722);
  background: linear-gradient(#bf360c, #ff5722); }

#error-page {
  width: 100%;
  height: 100%;
  display: none; }

#error-message {
  color: #FFF;
  font-size: 3em;
  height: 5%;
  position: absolute;
  top: 45%;
  text-align: center;
  width: 100%;
  display: none; }

/****************/
/* Media Queries*/
/****************/
@media (max-width: 550px) {
  .time {
    font-size: 0.8em; }
  #volume-bar {
    display: none; }
  .error-message {
    font-size: 1em;
    top: 40%; } }