@import url(fontes/stylesheet.css);
[display-viewer="on"][display-container="side-container"] #side-container {
    width: 40%;
    border-left: 1px solid #dee2e6 !important;
}
[display-viewer="on"][display-container="side-container"] #items-container {
    width: 60%;
}
#toolbar > div {
    background-color: rgba(255, 255, 255, 0.25);
    padding: 0 10px;
} 
body {
    font-family: 'd-dinregular';
    /* background-color:#72005c;*/
}

.navbar-brand {
    font-family: 'ergofontregular';
    text-transform: uppercase;
    font-size: 2.5rem;
    padding-bottom:0;
}
.ergote-lateral-titre {
    font-family: 'ergofontregular';
    text-transform: uppercase;
    font-size:1.75rem; 
    color:#ef00c1; 
}
.ergote-item-titre {
    /*font-family: 'ergofontregular';*/
    
    text-transform: uppercase;
    font-size:1.2rem; 

    color:#fff; 
    text-shadow:1px 1px 0 #b1008f;
}
.texte-medium {
    font-size:0.9rem;
    margin-top: -14px;
    font-style: italic;
}

.navbar-light .navbar-brand {
    color:#ef00c1; 
}
.navbar-light .navbar-brand:hover {
    color:#900275;
}

article.item {

}
article .item-wrapper {
    background-color:#930077;
    background-position:top center;
    background-size:cover;
    padding:10px;
    min-height:350px;
    display:flex;
    flex-direction: column;
    justify-content: flex-end;
    cursor:pointer;
}
article .item-wrapper:hover {
} 
.tag-descriptif, .tag-date {
    color:#fff;
}

/* player son : les css */
.flat-lecteur {
    width:100%;
    box-sizing: border-box;
    display:flex;
    padding:6px;
    font-family:helvetica, sans-serif;
    font-size:12px;
    justify-content: stretch;
}

.flat-lecteur.offline {
    opacity:0.5;
    
}
.flat-lecteur.offline button {
    opacity:0;
}

.flat-lecteur.online button {
    opacity:1;
}
.flat-lecteur.offline .lecteur-playpause {
    background-image: url(ajax-loader.gif);
    background-repeat: no-repeat;
    background-position:center center;
}

.flat-lecteur.online {
    
}
/* boutons */
.lecteur-entete, .lecteur-etat {
    margin-top:10px;

}
.lecteur-etat {
    font-weight:bold;
    cursor:pointer;
}
.lecteur-play {
    width:50px;
    height:36px;
    border:0;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E play %3C/title%3E%3Cpath fill='%23aaa' fill-rule='evenodd' d='M16.75 10.83L4.55 19A1 1 0 0 1 3 18.13V1.87A1 1 0 0 1 4.55 1l12.2 8.13a1 1 0 0 1 0 1.7z'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position:center center;
    background-color:transparent;
}

.lecteur-pause {
    width:50px;
    height:36px;
    border:0;
    background-image: url("data:image/svg+xml,%3C%3Fxml version='1.0' encoding='UTF-8'%3F%3E%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20'%3E%3Ctitle%3E pause %3C/title%3E%3Crect fill='%23aaa' width='6' height='16' x='3' y='2' rx='1' ry='1'/%3E%3Crect fill='%23aaa' width='6' height='16' x='11' y='2' rx='1' ry='1'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position:center center;
    background-color:transparent;
}

.lecteur-infos {
    padding: 6px 10px;
}

.lecteur-titre {
    font-weight:bold;
}

/* timeline */

.lecteur-timeline {
    flex-grow: 1;
    height:6px;
    background-color:#eee;
    margin:15px 20px 0 20px;
    border-radius: 3px;
}

.lecteur-bar-played {
    height:6px;
    background-color:#aaa;
    border-radius: 3px;
}

.lecteur-time {
    display:flex;
    padding:10px;
    border-radius: 3px;
}



@media (max-width: 576px){
    [display-viewer="on"][display-container="side-container"] #side-container {
        width:100%;
    }
}