#player-wrapper {
    position: fixed;
    left: -320px;
    top: 68%;
    z-index: 10000000;
    height: 98px;
}

.player {
    background: url('../img/player.png') no-repeat;
    width: 360px;
    height: 98px;
    position: relative;
}

.controls {
    font-size: 0;
    position: absolute;
    top: 47px;
    left: 47px;
}

.playback-button {
    cursor: pointer;
    opacity: 0.88;
    width: 44px;
    height: 20px;
    display: inline-block;
}

.playback-button:hover {
    opacity: 1;
}

#skip-back-button {
    background: url("../img/rew.png") no-repeat;
}

#play-button {
    background: url("../img/play.png") no-repeat;
}

#skip-next-button {
    background: url("../img/fwd.png") no-repeat;
}

#speaker-button {
    width: 12px;
    height: 20px;
    background: url("../img/vol1.png") no-repeat;
}

#volume-controller {
    display: inline-block;
    margin-left: 45px;
    position: relative;
}

#volume-bar {
    width: 52px;
    height: 20px;
    position: absolute;
    top: 0;
    left: 12px;
    background: url("../img/vol2.png") no-repeat;
}

#volume-level {
    width: 13px;
    height: 20px;
    position: absolute;
    top: 0;
    left: 12px;
    background: url("../img/vol3.png") no-repeat;
}

#volume-bar-overlap {
    width: 53px;
    height: 14px;
    background: #fff;
    position: absolute;
    bottom: 0;
    left: 12px;
    top: 3px;
    opacity: 0;
}

#progress-bar-wrapper {
    position: absolute;
    bottom: 0;
    left: 44px;
    width: 262px;
    overflow: hidden;
    height: 14px;
}

.progress-bar {
    position: relative;
}

#progress-level {
    position: absolute;
    background: url("../img/loaded.png");
    left: 7px;
    width: 254px;
    height: 14px;
}

#audio-loading-indicator {
    position: absolute;
    left: 7px;
    width: 254px;
    height: 14px;
    text-align: center;
    font-size: 12px;
    color: #fff;
    display: none;
}

#progress-thumb {
    position: absolute;
    width: 14px;
    height: 14px;
    left: 1px;
    background: url("../img/posbut.png") no-repeat;
}

#progress-bar-overlap {
    width: 261px;
    height: 14px;
    background: #fff;
    position: absolute;
    bottom: 0;
    left: 45px;
    opacity: 0;
}

#play-pause-button-icon {
    background: url("../img/play.png") no-repeat;
}

#play-pause-button:checked + #play-pause-button-icon {
    background: url("../img/pause-icon.png") no-repeat;
}

#play-pause-button {
    display: none;
}

#track-name {
    position: absolute;
    top: 19px;
    left: 57px;
    color: #fff;
    font-size: 12px;
    white-space: nowrap;
    width: 248px;
    overflow: hidden;
}

#track-name-text {
    white-space: nowrap;
    display: inline;
    width: auto;
}

#track-name-main-text, #track-name-complementary-text {
    white-space: nowrap;
    display: inline;
    width: auto;
}

#player-pull-right {
    width: 40px;
    height: 98px;
    position: absolute;
    right: 0;
    cursor: pointer;
}

#player-pull-left {
    width: 41px;
    height: 98px;
    position: absolute;
    left: 0;
    cursor: pointer;
}