@media screen and (max-width: 1200px) {
    #wave { margin-left: 20px !important; }
    #controls { margin-left: 10px !important; }
}

@media screen and (max-width: 1096px) {
    .jsDetailAlbum { padding-left: 0; }
    /*#jsKeywords { max-width: 65%; }*/
}

@media screen and (max-width: 1024px) {
    #pieceVersions { margin-right: 0 !important; }
    #divAudio .action_icons a { margin-bottom: -10px !important; }
    #duration { margin-top: 23px !important; }
    body.playerActive #logo { max-width: 177px; }
    #innerHeader { padding-bottom: 20px; }
    #mainNav, #innerContent, #jsDetailAlbum, #jsDetailPlaylist { margin-top: 120px !important; padding-top: 2.1em; }
    body.playerActive #mainNav, 
    body.playerActive  #innerContent, 
    body.playerActive #jsDetailAlbum, 
    body.playerActive #jsDetailPlaylist { 
        margin-top: 235px !important; 
    }
    #logo { bottom: 1px; }
    table { min-width: 75%; }
    #lstTitres { width: 100% !important; }
    #alsoLike { width: 100% !important; float: left; text-align: left; }
    #alsoLike div.album { float: left; }
    #jsDetailAlbum { padding-left: 10px; padding-top: 2.1em;}
    #shortNav::before { display: block; clear: both; content:''; }
    #pageLibre #innerContent .une_video { height: 240px; }
    #lstTitres .bigMargin {
        padding-left: 25px;
    }
    .hide1024 { display: none; }
}

@media screen and (max-width: 900px) {
    #pageLibre #innerContent .une_video { height: 250px; }
    .playlist.playlist img.playlistPlay { top: calc(50% - 32px - 40px) !important; }
    #mainNav { max-height: calc(95vh - 280px); }
    #login { max-width: 90% !important; }
    #login > img { max-width: 90%; }
    #existingAccount, #requestingAccount { width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
}

@media screen and (max-width: 800px) {
    #divAudio .action_icons a { margin-bottom: 0 !important; }
    #pieceTitle { max-width: 250px; overflow: hidden; }
    #pieceVersions { margin-left: 0!important; }
    #edito { float: none; width: 100%; }
    #shortNav a { font-size: 0.95em; margin-left: 0.35em; margin-right: 0.5em; margin-top: 0.65em;}
    #mainNav ul li { margin-bottom: 0.5em; }
    #mainNav a.active::before { content: ""; }
    #mainNav a.active::after { content: ""; }

    #lastAlbums { clear: both; width: 100%; }
    .nivo-caption { font-size: 0.75em; }

    table { min-width: 99%; }

    #homeActus { float: none; border-left: 0 !important; float: none; width: 98% !important; padding: 0 !important; margin-left: 0 !important; }
    #homeNouveautes { float: none; width: 95% !important; padding: 0 !important; margin-right: 0 !important; }

    #mentionslogo { position: absolute; float: left; display: none;}
    #mentionsmentions { position: relative; float: right; }

    #pageLibre #innerContent .une_video { max-width: 48%; }

    .playlist.playlist img.playlistPlay { top: calc(50% - 32px - 50px) !important; }
    .hide800 { display: none; }
}

@media screen and (max-width: 700px) {
    #shortNav a { font-size: 0.85em; }

    .album.album_une { 
        width: calc(50% - 18px);
    }

    .album, .playlist {
        width: calc(50% - 1.4em) !important;
    }

    .playlist.playlist img.playlistPlay { top: calc(50% - 32px - 20px) !important; }
    .hide700 { display: none; }
}

@media screen and (max-width: 600px) {
    h1 { font-size: 1.2em !important; }
    #innerFooter { padding: 10px 0 !important; margin: 0 !important; width: 100% !important; }
    #mainNav { min-width: 100px; }
    #mainNav h4 { font-size: 0.75em; }
    #mainNav ul li { margin-bottom: 0.5em; font-size: 0.75em; line-height: normal;}
    #client { font-size: 0.75em; }
    #linkNavHome { display: none !important; }
    #shortNav > a { font-size: 0.65em !important; margin-left: 0 !important; }
    #shortNav #navSep { width: 99%; height: 1px; display: block !important;}
    #shortNav #lang { margin-right: 20px; }
    #innerContent, #jsDetailAlbum, #jsDetailPlaylist { width: calc(100% - 150px) !important; padding-left: 10px !important;}
    #home #innerContent, #contact #innerContent { float: none; width: 97% !important; }
    #contact form { min-width: initial; }
    #lstTitres tr td { font-size: 0.75em; }
    #lastAlbums { clear: both; width: 100%; }
    .nivo-caption { font-size: 0.6em; }
    #pageLibre #innerContent .une_video { max-width: 48%; }
    #titres #jsDetailAlbum h1 span.cartouche::after { content: ''; display: block; clear: both; }
    #titres #jsDetailAlbum img#albumImage, img#playlistImage { width: 50% !important; }
    #titres #jsDetailAlbum h1 span.titreAlbum { display: inline-block; width: 90%; }
    #titres #jsDetailAlbum h1 span.space { display: none; }
    #titres #jsDetailAlbum h1 a:first-child { margin-left: 0 !important; }
    #lstTitres .bigMargin { padding-left: 0 !important; }
    .album.asso { height: 150px; }
    .playlist.playlist img.playlistPlay { top: calc(50% - 32px - 50px) !important; }

}

@media screen and (max-width: 550px) {
    #pageLibre #innerContent .une_video { max-width: 98%; }
    #cover { width: 60px; }
    #wave { width: calc(100% - 80px) !important; margin-left: 10px !important; }
    #duration { margin-top: 3px !important; }
    #home #homeNouveautes .detailAlbum { padding: 0 !important; width: calc(100% - 100px) !important; margin-left: 0 !important; float: right !important; }
    .nivoSlider { width: 98% !important; }
}

@media screen and (max-width: 500px) {
    .hide500 { display: none; }
    .popin label, #monCompte label, #contact label { width: 90%; text-align: left; padding-left: 0 !important; }
    .popin input, #monCompte input, #monCompte .inputZone, #contact input, #contact .inputZone { width: 100% !important; }
    .playlist.playlist_une img.playlistPlay { top: calc(50% - 32px - 100px) !important; }
    #trackInfosContent, #albumInfosContent, #playlistInfosContent { min-width: 90% !important }
    .popin > div { padding: 1em !important; }
    #trackInfosContent p, #albumInfosContent p, #playlistInfosContent p { margin-left: 10px !important; }
    #trackInfosContent label, #albumInfosContent label, #playlistInfosContent label { width: 100% !important; margin-top: 15px !important;}
}

@media screen and (max-width: 450px) {
    #mainNav { max-height: calc(95vh - 320px); padding-top: 0; }
    #jsDetailAlbum { padding-top: 0; }
    .playerActive footer { display: none; }

    #pieceTitle { display: block !important; margin-top: 50px !important; clear: both !important; }
    #pieceVersions { clear: both !important; margin-top: -35px !important; }
    #divAudio .action_icons { width: 100%; text-align: center; bottom: -5px; margin-right: auto !important; }

    .album.asso { height: 220px; }       
    .album.album_une, .playlist.playlist_une, .album.albumList { 
        width: calc(100% - 18px) !important;
        max-width: 220px !important;
    }
    .album, .playlist {
        width: calc(100% - 1.4em) !important;
        max-width: 170px !important;
    }

    .playlist.playlist_une img.playlistPlay { top: calc(50% - 32px - 110px) !important; }
}

@media screen and (max-width: 400px) {
    .playlist.playlist_une img.playlistPlay { top: calc(50% - 32px - 120px) !important; }
}

@media (orientation: landscape) and (max-height: 425px) {
    #smallScreensWarning { display: block; z-index: 10000; }
    .beingTyped #smallScreensWarning { display: none !important; z-index: 10000; }
}