.radio-wrapper {
    background-color: #fff;
    border-radius: 2px;
    height: 32px;
    padding: 0px 10px;
    position: absolute;
    right: 0px;
    top: 8px;
    width: 170px;
    background: url('../images/logo-terradosol-min.png') no-repeat 55px 5px scroll #FFFFFF;
}

.radio{
    height: 20px;
    padding-top: 10px;
}

.tv-wrapper {
    background-color: #fff;
    border-radius: 2px;
    height: 32px;
    padding: 0px 10px;
    position: absolute;
    right: 180px;
    top: 8px;
    width: 170px;
    background: url('../images/logo-tv.png') no-repeat #FFFFFF;
}

.tv{
    height: 20px;
    padding-top: 10px;
}

div#play-pause, div#sing-mute{
    height: 12px;
    width: 12px;
    cursor: pointer;
    float: left;
    margin: 0 5px 0 0;
}

div.paused {
    background-image: url('../images/botoes.png');
    background-repeat: no-repeat;
    background-position: -15px 0;
}
div.paused:hover {
    background-position: -15px -12px;
}

div.playing{
    background-image: url('../images/botoes.png');
    background-repeat: no-repeat;
    background-position: 0 0;
}
div.playing:hover{
    background-position: 0 -12px;
}
div.sing{
    background-image: url('../images/botoes.png');
    background-repeat: no-repeat;
    background-position: -28px 0;
}
div.sing:hover{
    background-position: -28px -12px;
}
div.mute{
    background-image: url('../images/botoes.png');
    background-repeat: no-repeat;
    background-position: -42px 0;
}
div.mute:hover{
    background-position: -42px -12px;
}

.radio input[type=range] {
    -webkit-appearance: none;
    width: 150px;
    height: 10px;
}


input[type=range]:focus {
    outline: none;
}
input[type=range]::-webkit-slider-runnable-track {
    width: 100%;
    height: 5px;
    cursor: pointer;
    box-shadow: 0px 0px 0.1px #000000, 0px 0px 0px #0d0d0d;
    background: rgba(100, 169, 163, 0.31);
    border-radius: 0px;
    border: 0px solid #010101;
}
input[type=range]::-webkit-slider-thumb {
    box-shadow: 0px 0px 0px rgba(103, 0, 0, 0), 0px 0px 0px rgba(129, 0, 0, 0);
    border: 0px solid #64a9a3;
    height: 5px;
    width: 20px;
    border-radius: 0px;
    background: #64a9a3;
    cursor: pointer;
    -webkit-appearance: none;
    margin-top: -0.25px;
}
input[type=range]:focus::-webkit-slider-runnable-track {
    background: rgba(100, 169, 163, 0.31);
}
input[type=range]::-moz-range-track {
    width: 100%;
    height: 5px;
    cursor: pointer;
    box-shadow: 0px 0px 0.1px #000000, 0px 0px 0px #0d0d0d;
    background: rgba(100, 169, 163, 0.31);
    border-radius: 0px;
    border: 0px solid #010101;
}
input[type=range]::-moz-range-thumb {
    box-shadow: 0px 0px 0px rgba(103, 0, 0, 0), 0px 0px 0px rgba(129, 0, 0, 0);
    border: 0px solid #64a9a3;
    height: 5px;
    width: 20px;
    border-radius: 0px;
    background: #64a9a3;
    cursor: pointer;
}
input[type=range]::-ms-track {
    width: 100%;
    height: 5px;
    cursor: pointer;
    background: transparent;
    border-color: transparent;
    color: transparent;
}
input[type=range]::-ms-fill-lower {
    background: rgba(100, 169, 163, 0.31);
    border: 0px solid #010101;
    border-radius: 0px;
    box-shadow: 0px 0px 0.1px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-fill-upper {
    background: rgba(100, 169, 163, 0.31);
    border: 0px solid #010101;
    border-radius: 0px;
    box-shadow: 0px 0px 0.1px #000000, 0px 0px 0px #0d0d0d;
}
input[type=range]::-ms-thumb {
    box-shadow: 0px 0px 0px rgba(103, 0, 0, 0), 0px 0px 0px rgba(129, 0, 0, 0);
    border: 0px solid #64a9a3;
    height: 4px;
    width: 20px;
    border-radius: 0px;
    background: #64a9a3;
    cursor: pointer;
    height: 3.5px;
}
input[type=range]:focus::-ms-fill-lower {
    background: rgba(100, 169, 163, 0.31);
}
input[type=range]:focus::-ms-fill-upper {
    background: rgba(100, 169, 163, 0.31);
}
