body {
    background: #000;
    color: #fff;
    font-family: arial, verdana;
}

.full-background {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: auto;
    background-repeat: no-repeat;
    background-position: center;
}

.full-layer, .centering-layer {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.full-layer {
    overflow: hidden;
}

.centering-layer {
    display: table;
    text-align: center;
}

.centering-layer > span {
    display: table-cell;
    vertical-align: middle;
    text-align: center;
    font-size: 120px;
    font-size: 30vh;
}

#divLoading {
    -ms-opacity: 0.8;
    opacity: 0.8;
}

#divLoadingBars {
    position: absolute;
    bottom: 0;
    width: 100%;
}

.full-image {
    width: 100%;
    height: 100%;
}

.play-button {
    color: #fff;
    background-color: #333;
    background-color: rgba(0,0,0,0.5);
    padding: 5vh 8vh;
    border-radius: 5vh;
}

.restart-container, .volume-container, .elapsed-container {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 2vh 3vh;
    color: #ddd;
    font-size: 32px;
    font-size: 8vh;
}

.volume-container {
    left: 12vh;
}

.elapsed-container {
    left: auto;
    right: 0;
}

.volume-button, .restart-button {
    -ms-text-shadow: 0 0 1vh #666;
    text-shadow: 0 0 1vh #666;
}

.volume-button:hover, .restart-button:hover {
    color: #fff;
    -ms-text-shadow: 0 0 2vh #00f, 0 0 5vh #39f;
    text-shadow: 0 0 2vh #00f, 0 0 5vh #39f;
}

#spanStart, #spanMute, #spanUnmute, #spanRestart {
    cursor: pointer;
}

.elapsed-time {
    font-size: 24px;
    font-size: 6vh;
    -ms-text-shadow: 0 0 .5vh #666;
    text-shadow: 0 0 .5vh #666;
}

.text-label {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    font-family: 'Trebuchet MS', Verdana, Geneva, Tahoma, sans-serif;
    font-weight: bold;
    color: #fff;
    -ms-text-shadow: 0 0 .3vh #333, .4vh .4vh .6vh #666;
    text-shadow:  0 0 .3vh #333, .4vh .4vh .6vh #666;
}

.label-effect-Title {
    padding: 1% 2%;
    text-align: left;    
    font-size: 36px;
    font-size: 9vh;
}
.label-effect-Tagline {
    padding: 1% 2%;
    text-align: center;
    font-size: 32px;
    font-size: 8vh;
}
.label-effect-Blare {
    display: table;
    text-align: center;
    font-size: 60px;
    font-size: 15vh;
}
.label-effect-Blare > span {
    display: table-cell;
    vertical-align: middle;
}
.label-effect-Scroll {
    padding: 1% 2%;
    text-align: left;    
    font-size: 20px;
    font-size: 5.5vh;
}
.label-features-heading {
    font-size: 28px;
    font-size: 7vh;
}


.debug-panel {
    position: absolute;
    top: 0;
    left: 0;
    padding: 5px 8px;
    -ms-text-shadow: 1px 1px 2px #666;
    text-shadow: 1px 1px 2px #666;
}

#divError {
    background: #000;
    color: #f00;
    font-weight: bold;
    font-size: 15px;
    line-height: 20px;
    word-wrap: break-word;
}