/**
 ** player-novo.css :: arquivo de estilização css
 ** @edthor ####### :: seuemail@gmail.com
 **/
 body{
    margin: 0;
    padding: 0;
}
.musica-body{
    background:#004080;
    border-bottom:1px solid #004080; 
    position: relative;
    max-height: 90px;
    overflow: hidden;
}
.box-controls{
    position: relative;
    width:147px;
    margin: auto;

}
.musica-play{   
    margin: auto;
    text-align: center;
    width:84px;
    font-size: 1.4em;

}
.musica-play span {
    background:#FFF;
    position: absolute;
    margin: auto;
    width: 60px;
    left:45px;
    top:15px;
    height: 60px;
    border-radius: 20px;
    display: inline-block;
}
.musica-play .fa {
   position: relative;
    
}
.musica-play:after{   
    width:140px;
    height:140px;
    border:1px solid #999;
    content: ''; 
    top:-30px; 
    left:3px;
    border-radius: 100px;    
    position: absolute;   

}
.musica-play.animar:after,.musica-play.animar:before{  
    -webkit-animation-name: animar; /* Safari 4.0 - 8.0 */
    -webkit-animation-duration: 4s; /* Safari 4.0 - 8.0 */
    animation-name: animar;
    animation-duration: 4s;
    animation-iteration-count: infinite;
}

@keyframes animar{
    0%{ transform: scale(1)}
    50%{ transform: scale(1.3)}
    50%{ transform: scale(1.5)}
    75%{ transform: scale(1.8);opacity:0.5}
    100%{ transform: scale(2); opacity: 0.1;}
}

.musica-play:before{   
    width:160px;
    height:160px;
    border:1px solid #999;
    content: ''; 
    top:-40px; 
    left:-8px;
    border-radius: 100px;    
    position: absolute;    
}

.musica-vol1{
    position: absolute;
    top:50%;
    margin-top:-18px;
    background:#000;
    padding: 10px;
    border-radius: 100%;
    width:15px;
    height: 15px;
    color:#FFF;
    text-align: center;
}
.musica-pause{
    position: absolute;
    top:50%;
    right: 0;
    margin-top:-18px;
    background:#000;
    padding: 10px;
    border-radius: 100%;
    width:15px;
    height: 15px;
    color:#FFF;
    text-align: center;
}
.musica-vol1:hover body >.musica-vol2{
    display: block;
}
.musica-vol2{
    position: absolute;
    display: none;
    bottom:0;
    left:0;
}
.slider-handle{
    border-radius: 100%;    
}
.slider {
    width: 140px !important; 
}
.slider-track{ 
    border:1px solid #ccc;

}
#GC >.tooltip {
    position: absolute; 
    bottom:20px; 
    z-index: 10;
    color:#8716b8;
}
.slider-selection {
    background: #8716b8;   
}
.shareds{
    position: absolute;
    right:0;
    top:0;   
    bottom: 0;
}
.shareds ul{
    padding: 0;
    margin: 0;
    text-align: center; 
    display: table-cell;
    height: 60px;
    overflow: hidden; 
}
.shareds li{ 
    position: relative; 
    display: inline-block;
    padding: 10px;  
    height: 70px; 
    transform: skew(-15deg)  
}
.shareds li:hover{ 
    -webkit-filter: blur(2px); /* Safari */
    filter: blur(3px) brightness(200%);

}
.shareds li a{
    color:#FFF;
    bottom: 0;
    position: relative;  
    display: inline-block;
    padding: 13px 10px;   
    transform: skew(15deg)  
}
.shareds li i{
    width: 50px;    
}
.instagram{
    background: #8716b8;
    background-image:-linear-gradient(to bottom,#b81639,#8716b8);
    background-image:-webkit-linear-gradient(to bottom,#b81639,#8716b8);
    background-image:-moz-linear-gradient(to right bottom,#b81639,#8716b8);
    background-image:-o-linear-gradient(to bottom,#b81639,#8716b8);   
}
.twitter{
    background: #3193cc;
}
.whatsapp{
    background: #009652;    
}
.facebook{
    background: #004196;
}
.winamp { 
    background: #FFF; ;  
}
.winamp a{
    background: url('images/img-icone-player-winamp.png') no-repeat center; 
    background-size: cover;
    width:28px;
    top:10px;
    position: relative;   
    height:28px; 
    transform: skew(15deg)
}

.capa-radio{
    display: block;
    height: 80px;
    width:100px;
    float: left;   
     background-size:contain !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    margin: 4px 10px;
    border-radius: 4px;
}
.musica-musica-atual {
    background: #000;
    color:#FFF;
    font-size: 16px ;
    font-family: arial,sans-serif;
    text-transform: uppercase;
    padding: 5px 15px;
    max-width: 400px;
    border-radius: 10px;
    position: absolute;
    left:160px;
    top:50%;
    margin-top:-15px;
}
.musica-musica-atual label {
    font-weight: bold;
    overflow: hidden;
    float: left;
    font-size:12px;
    display: inline-block;
}
.musica-musica-atual span {
    font-weight: bold;
    overflow: hidden;
    float: left;
    margin-left:10px;
    max-width:200px;
    display: inline-block;
}
.cover{
    position: absolute;
    width:140px;
    top:0;
    z-index: 1;
    right:430px;  
    height: 90px;
    background-size: contain !important;
    background-repeat: no-repeat !important;

}
@media (max-width:1366px){
   .musica-musica-atual {    
        left:120px;
        top:20%;
        margin-top:0px;
        max-width:  300px;
        overflow: hidden;
    }

    .musica-musica-atual span {
        font-weight: bold;
        overflow: hidden;
        margin-left:10px; 
    }
}
@media (max-width:1260px){
    .twitter{
        display: none !important;
    }

    .shareds li{ 
        position: relative; 
        display: inline-block;
        padding: 10px;  
        height: 70px; 
        transform: skew(-15deg)  
    }
    .shareds li a{
        color:#FFF;
        bottom: 0;
        position: relative;  
        display: inline-block;
        padding:10px 0;  

        transform: skew(15deg)  
    }
    .cover-musica {
        right:270px; 
        width:90px;
        background-size: cover!important;
    }
    .musica-musica-atual {    
        left:120px;
        top:20%;
        margin-top:0px; 
        overflow: hidden;
    }

    .musica-musica-atual span {
        font-weight: bold;
        overflow: hidden;
        margin-left:10px; 
    }




}
@media (max-width:960px){
    .twitter,.winamp{
        display: none !important;
    }

 
    .shareds li{ 
        position: relative; 
        display: inline-block;
        padding: 10px;  
        height: 70px; 
        transform: skew(-15deg)  
    }
    .shareds li a{
        color:#FFF;
        bottom: 0;
        position: relative;  
        display: inline-block;
        padding:10px 0;  

        transform: skew(15deg)  
    }
    .cover-musica {
        right:220px; 
        width:90px;
        background-size: cover!important;
    }
    .musica-musica-atual {    
        left:120px;
        top:20%;
        margin-top:0px;
        max-width: 200px;
        overflow: hidden;
    }

    .musica-musica-atual span {
        font-weight: bold;
        overflow: hidden;
        margin-left:10px; 
    }




}
@media (max-width:768px){
    .twitter{
        display: none !important;
    }

    .shareds li{ 
        position: relative; 
        display: inline-block;
        padding: 10px;  
        height: 70px; 
        transform: skew(-15deg)  
    }
    .shareds li a{
        color:#FFF;
        bottom: 0;
        position: relative;  
        display: inline-block;
        padding:10px 0;  

        transform: skew(15deg)  
    }
    .cover-musica {
        right:150px; 
        width:90px;
        background-size: cover!important;
    }
    .musica-musica-atual {    
        left:95px;
        top:20%;
        margin-top:0px;
        max-width: 180px;
        overflow: hidden;
    }

    .musica-musica-atual span {
        font-weight: bold;
        overflow: hidden;
        margin-left:10px; 
    }

    .capa-radio {
        width:80px;
    }
    .twitter{
        display: none !important;
    }
    .instagram{
        display: none !important;
    }


}
@media (max-width:548px){   
    .cover-musica {
        display: none;
    }
    .musica-musica-atual {    
        display: none;
    }

    .capa-radio {
        width:80px;
    }  


}

@media (max-width:430px){    

    .shareds { 
        display: none;
    }



}