/* Premium Post with header */
.page-header{
    margin-right: -1.9rem;
    margin-left: -1.9rem;
    background-size: cover !important;
}

.published{
    padding: .75rem 0;
    font-family: var(--menu-font);
    text-transform: var(--menu-text-transform);
    color: var(--body-color-2);
}

h1 {
    margin-bottom: 0; 
    line-height: 2rem;
}
.subtitle{
    font-weight: 300;
    font-size: 1.3rem;
    line-height: 1.3rem;
    margin-bottom: 1rem;
}

.blogger{
    display: flex;
    justify-content: space-between;
    margin-bottom: .75rem
}
.author{
    display: flex;
    align-content: center;
    font-weight: bold;
}
.author img{align-self: center }
img.circle{
    border-radius: 50%;
}
.author .name{
    font-family: var(--author-font);
    padding-left: .5rem; 
    align-self: center; 
} 

.content img{
    box-shadow: 0 .2rem .7rem var(--shadow-color);
    height: auto !important;
}
.content img.pull-left, 
.content img.float-left {
    margin-right: 1rem;
}
.content img.pull-right, 
.content img.float-right {
    margin-left: 1rem;
}
.content img.alignleft, .content figure.alignleft {
    float: left;
    margin-right: 1rem;
}
.content img.aligncenter, .content figure.aligncenter {
    display: table;
    margin:0 auto;
}
.content img.alignright, .content figure.alignright {
    float: right;
    margin-left: 1rem;
}
.content figcaption .title {
    font-weight: 700;
}
.content figcaption .copyright {
    color: var(--body-color-2); 
    margin-top: .5rem;
    font-style: italic; 
    font-size: .8rem;
    line-height: .8rem;
}
.content iframe.slideshow.force-fullscreen{
    position: fixed;
    top: 0;
    left: 0;
    width: 100vw !important;
    height: 100vh !important;
    z-index: 10000;
    background: #000000DD;
}

.author-resum{
    margin-top: 3rem;
    background: var(--body-secondary-bg-color);
    padding: 1rem;
    text-align: center;
    border-radius: var(--border-radius);
}
.author-resum .title {
    margin-top: 1rem;
}
.author-resum .name{
    color: var(--body-secondary-color);
    font-family: var(--author-font);
    font-size: 1.7rem;
}
.author-resum .bio{
    margin: 1rem auto;
    text-align: justify;
    color: var(--body-secondary-color-3);
    font-size: .9rem;
}

/* RELATED ARTISTS */
.related-artists{
    border-bottom: 1px solid var(--sidebar-border-color);
    margin-bottom: 1rem;
}
.related-artists > h4{
    text-transform: uppercase;
    font-size: 1.2rem;
    line-height: 1.1rem;
}
.related-artists > h4 i{
    font-size: 1rem;
    margin-left: .2rem;
    opacity: .5;
}
.related-artists > h4 span{
    color: var(--sidebar-color-2)
}
.related-artists .links{
    display: flex;
    justify-content: space-between;
    padding-bottom: 1rem;
}
.related-artists .links a{ 
    font-family: var(--body-font); 
    font-weight: var(--title-font-weight);
    color: var(--sidebar-color-2);
    text-align: center;
}
.related-artists .links a:hover, 
.related-artists .links a:active{
    color: var(--sidebar-color);
}
.related-artists .links a .title{
    text-transform: uppercase;
    font-size: .8rem;
    font-weight: 700;
}

/* RELATED Albums */
.related-albums{
    border-bottom: 1px solid var(--sidebar-border-color);
    margin-bottom: 1rem;
}
.related-albums > h4{
    text-transform: uppercase;
    font-size: 1.2rem;
    line-height: 1.1rem;
}
.related-albums .links a{
    display: flex;
    padding-bottom: 1rem;
    text-transform: uppercase;
    font-size: 1.2rem;
    line-height: 1.1rem;
    color: var(--sidebar-color-2);
    font-family: var(--body-font);
    font-weight: var(--title-font-weight);
}
.related-albums .links a .thumb{
    min-width: 70px;
    display: flex;
    align-items: center;
}
.related-albums .links a .meta{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: .7rem;
}
.related-albums .links a .l2{
    font-size: .8rem;
    font-weight: 100;
}
.related-albums .links a:hover, 
.related-albums .links a:active {
    color: var(--sidebar-color);
}

/* RELATED Concerts */
.related-concerts{
    border-bottom: 1px solid var(--sidebar-border-color);
    margin-bottom: 1rem;
}
.related-concerts > h4{
    text-transform: uppercase;
    font-size: 1.2rem;
    line-height: 1.1rem;
}
.related-concerts .links a{
    display: flex;
    padding-bottom: 1rem;
    text-transform: uppercase;
    font-size: 1.2rem;
    line-height: 1.1rem;
    color: var(--sidebar-color-2);
    font-family: var(--body-font);
    font-weight: var(--title-font-weight);
}
.related-concerts .links a .meta{
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-left: .7rem;
}
.related-concerts .links a .l2{
    font-size: .8rem;
    font-weight: 100;
}
.related-concerts .links a:hover, 
.related-concerts .links a:active {
    color: var(--sidebar-color);
}


/* POPULAR POSTS */
.popular-posts{
    margin-top: 1rem;
}
.popular-posts > h4{
    text-transform: uppercase;
    text-align: center;
    font-size: 1.2rem;
    line-height: 1.1rem;
}
.popular-posts .links{
    display: flex;
    flex-direction: column;
    padding-bottom: 1rem;
}
.popular-posts .links a{
    display: flex;
    font-family: var(--body-font); 
    margin-bottom: .5rem;
}
.popular-posts .links a:hover .title, 
.popular-posts .links a:active .title {
    color: var(--primary-color);
}

.popular-posts .links a .metas{
    flex: 1;
    padding-left: .75rem;
}
.popular-posts .links a .title{
    color: var(--sidebar-color);
    line-height: 1rem;
    font-weight: var(--title-font-weight);
}
.popular-posts .links a .subtitle{
    color: var(--sidebar-color-2);
    line-height: .9rem;
    font-size: .8rem;
    margin:0;
}

.popular-posts .link.premium .thumb:after{
    content:"";
    position: absolute;
    background-image: url("../../img/logos/LOGOPREMIUM2023-317x100-bg-dark.png");
    background-repeat: no-repeat;
    background-size: contain;
    width: 70%;
    height: 50%;
    bottom: .5rem;
    left:.5rem;
}

/* RELATED ARTISTS PORTFOLIO */
.related-artists-portfolios {
    border-bottom: 1px solid var(--sidebar-border-color);
}
.related-artists-portfolios > h4{
    text-transform: uppercase;
    font-size: 1.2rem;
    line-height: 1.1rem;
}
.related-artists-portfolios .links{
    display: grid;
    grid-template-columns: 50% 50%;
    grid-gap: .5rem;
    padding-bottom: 1rem;
}
.related-artists-portfolios .links a{ 
    position: relative;
    color: var(--sidebar-color-2);
}
.related-artists-portfolios .links a:hover, 
.related-artists-portfolios .links a:active {
    color: var(--sidebar-color);
}
.related-artists-portfolios .links a .overlay{ 
    position: relative;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    font-size: .8rem;
    height: auto;
    background: none;
}
.related-artists-portfolios .links a .overlay .subtitle {
    font-size: .8rem;
    line-height: .8rem;
    margin:0;
}

.grecaptcha-badge {
    visibility: hidden; /* ! ne pas utiliser display:none sinon il n'y a pas de protection */
}

/* progress scroll bar */
#scroll-progress {
    background-color: var(--primary-color);
    position: absolute;
    width: 100%;
    height: .5rem;
    bottom: -.5rem;
    transform-origin: left;
    transform: scaleX(0);
    /*animation: grow-progress 1s linear forwards;
    animation-timeline: scroll(block root); /* ne marche pas encore sur chrome iphone : on passe par du JS */
}
/*@keyframes grow-progress {
    from {
        transform-origin: left;
        transform: scaleX(0);
    }
    to {
        transform-origin: left;
        transform: scaleX(1);
    }
}*/
