body
{
  background: #8c0000;
  color: white;
  font-family: roboto-condensed, sans-serif;
  font-weight: 400;
  margin: 0px;
  padding: 0px;
}

#page
{
    width: 100%;
    margin: 0px auto;
}



#pochette_background
{
    position: fixed;
    overflow: hidden;
    z-index: -100;
    top: -70px;
    left: -70px;
    right: -70px;
    bottom: -70px;
}

#pochette_background img
{
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: blur(60px);
}

#player_container
{
    position: absolute;
    top: 0px;
    left: 0px;
    right: 0px;
    bottom: 0px;
    background: rgba(0,0,0,.4);
    overflow: auto;
}


#player_videolivelink a
{
    display: inline-block;
    width: 80%;
    background-image: url("../img/player/videolive.jpg");
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    font-size: 18px;
    text-decoration: none;
    padding: 15px 30px;
    box-sizing: border-box;
}

#player_videolivelink a mark
{
    display: block;
    font-size: 34px;
    background: transparent;
    color: inherit;
    text-transform: uppercase;
}

#player_videolivelink a .clickhere
{
    display: block;
    font-size: 12px;
    background: transparent;
    color: inherit;
    text-transform: uppercase;
}


#player_show
{
    width: 100%;
}

#player_show a
{
    display: block;
    position: relative;
    width: 100%;
    padding-bottom: 20%;
}

#player_show img
{
    position: absolute;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover;
}





#banner
{
    width: 100%;
    margin: 20px 0px;
    display: flex;
    flex-direction: row;
    justify-content: center;
    flex-wrap: nowrap;
}




#player_logo
{
    width: 100%;
    text-align: center;
}

#player_logo h1
{
    margin: 0px;
    padding: 0px;
    line-height: normal;
}

#player_logo img
{
    display: inline;
    width: auto;
    height: 100px;
}

#player_title
{
    width: 100%;
}

#player_title h2
{
    font-size: 40px;
    line-height: 100px;
    text-transform: uppercase;
    margin: 0px;
    padding: 0px;
    text-align: center;
}



#player_flex
{
    display: flex;
    flex-direction: row-reverse;
    flex-wrap: nowrap;
    justify-content: center;
}



.player_part
{
    width: 100%;
    margin: 0px 10px;
}




#player_videolivelink
{
    text-align: center;
}





#player_titrage
{
    width: 100%;
    display: flex;
    flex-direction: column;
    margin: 20px 0px;
}

#player_titrage > div
{
    text-align: center;
}

#player_titrage_pochette img
{
    width: 200px;
    height: 200px;
    object-fit: cover;
}

#titrage_artiste, #titrage_titre
{
    display: block;
    max-width: 100%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

#titrage_artiste
{
    font-size: 28px;
    font-weight: 700;
    text-transform: uppercase;
}

#titrage_titre
{
    font-size: 24px;
}


#titrage_thumb_up:hover { color: #457dff !important; }
#titrage_thumb_down:hover { color: #ff7474 !important; }


#player_titrage_like a
{
  font-family: "Material Icons";
  font-size: 18pt !important;
  padding: 0px 5px;
  color: white;
  text-decoration: none;
}


#player_switch
{
    width: 100%;
    text-align: center;
}

#player_switch, #player_switch select
{
    font-size: 20px;
}


#player_media
{
    width: 100%;
}

#player_media audio
{
    width: 100%;
}


#player_videolive iframe
{
    margin: 0px auto;
    width: 100% !important;
}


#player_other_podcasts h3
{
    text-align: center;
}

#player_other_podcasts ul
{
    width: 100%;
    height: 230px;
    overflow: auto;
    display: flex;
    flex-direction: column;
    margin: 0px;
    padding: 0px;
    list-style: none;
    background-color: rgba(0,0,0,.3);
}

.podcast_item
{
    margin: 0px;
    padding: 0px;
}

.podcast_item a
{
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: flex-start;
    text-decoration: none;
}

.podcast_item a:hover
{
    background-color: rgba(255,255,255,.3);
}

.podcast_item a span
{
    display: inline-block;
}

.podcast_more a
{
    display: inline-block;
    width: 100%;
    font-size: 18px;
    line-height: 60px;
    color: white;
    text-align: center;
}

.podcast_item_picture img
{
    width: 60px;
    height: 60px;
    object-fit: cover;
}

.podcast_item_title
{
    width: 100%;
    margin-left: 15px;
    line-height: 60px;
    font-size: 18px;
    color: white;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
}



#player_pub
{
    margin-top: 30px;
}



#player_container a
{
    color: inherit;
}



@media(max-width: 700px)
{
    #banner
    {
        flex-direction: column;
    }

    #player_flex
    {
        flex-direction: column;
    }

    .player_part
    {
        margin: 10px 0px;
        padding: 0px 10px;
        box-sizing: border-box;
    }


    #player_other_podcasts ul
    {
        height: 400px;
    }
}