@keyframes fade{
    0%{
        opacity: 1;
    }
    
    50%{
        opacity: 0;
    }
    
    100%{
        opacity: 1;
        content:'\f00d' ;
    }
}

@import url('https://fonts.googleapis.com/css?family=Montserrat:300,400,500,700,900');


.slider-bullet .slider-menu li{
    background: #FE1542;
    border: 0;
    border-radius: 0;
    height: 5px;
    margin-bottom: 10px;
}

.menu-responsive-button{
    background: transparent;
    background-image: none;
    border: 0;
    -webkit-tap-highlight-color:rgba(0,0,0,0);
    
}

.menu-responsive-button span{
    color: #fe1542;
    transition: all 0.5s;
}

.menu-responsive-open span{
    transform: rotate(180deg);
}

.menu-responsive-open .fa-bars::before{
    animation-name: fade;
    animation-play-state: running;
    animation-duration: 0.5s;   
    animation-fill-mode: forwards;
}

.slider-header .slider-items .num-player{
    font-size: 250px;
    font-weight: 900;
    font-family: 'Montserrat';
    color: #FFF;
    position: absolute;
    left: 7%;
}

.slider-header .slider-items img{
    display: block;
    margin-top: 15px;
    margin-bottom: 15px;
}

.gototop .fa-arrow-circle-up::before{
    content: url('/theme/etoile/img/arow-top.png');
}

@media screen and (min-device-width:320px) and (max-device-width:768px){
    .preview, .next{
        padding: 2.5% !important;
        text-transform: uppercase;
        display: block !important;
        margin-top: 15px;
        margin-bottom: 15px;
    }
    
    .gototop{
        bottom: -10px;
        right: 0;
    }
}

@media screen and (min-device-width:768px) and (max-device-width:992px){
    .gototop {
        bottom: -10px;
        right: 0;
    }
}

@media screen and (min-device-width:992px) and (max-device-width:1200px){
    
    .gototop{
        bottom: -9px;
        right: 0;
    }
}

@media screen and (min-width:1200px) and (max-width:1900px){

}