@font-face
{
    font-family: 'Akzidenz-Grotesk';
    src: url('/type/Akzidenz-grotesk-roman.ttf');
}
@font-face
{
    font-family: 'Akzidenz-Grotesk-Bold';
    src: url('/type/Akzidenz-grotesk-bold.ttf');
}
body
{
    background: #6c6a6f;
    background-image: url("/img/background-main.png");
    background-size: 100%;
    background-repeat: no-repeat;
    font-size: 1em;
    line-height: 1.2em;
}
img
{
    max-width:100%;
}
p
{
    font-family: 'Akzidenz-Grotesk';
    color: #fff;
    font-size: inherit;
}
a:link
{
    font-size: inherit;
    text-decoration: none;
    color: inherit;
}
a:visited
{
    font-size: inherit;
    text-decoration: none;
    color: inherit;
}
a:hover
{
    font-size: inherit;
    text-decoration: none;
    color: inherit;
}
.italique
{
    font-style: italic;
    font-size: inherit;
}
.gras
{
    font-family: 'Akzidenz-Grotesk-Bold';
    font-size: inherit;
}
.txtnr
{
    color: #000;
}
.header__wrapper
{   
}
.header__section
{
    display: flex;
}
.header__section>*
{
    margin: 0px;
    flex: 1;
}
.header__content
{
    opacity: 0;
    visibility: hidden;
    position: absolute;
    width: 93%;
    margin-left: 1%;
    height: auto;
    padding: 20px;
    font-size: 0.8em;
    background-color: #fff;
    filter: drop-shadow(5px 5px #000);
}
.header__content:before
{
    position: absolute;
    z-index: -1;
    transition-duration: 0.3s;
    transition-property: transform;
}
.header__wrapper:hover .header__content
{
    z-index: 10;
    opacity: 1;
    visibility: visible;
}
.footer
{
    z-index: 999;
    position: fixed;
    left: 1em;
    bottom: -4em;
}
.trait
{
    position: absolute;
    left: 1.6%;
    border-top: 2px solid #fff;
    width: 95.2%;
    height: 1%;
}
/**GRILLE - À MODIFIER À CHAQUE ENTRÉE**/
#wrapper
{
    position: absolute;
    left: 1.6%;
    width: 95.2%;
    height: 9em;
    padding-top: 20px;
    display: grid;
    grid-template-areas:
                        "lbl1 lbl2 lbl3 ."
                        "rl . . ."
                        "nfo1 vgn1 ln1 ."
                        "nfo2 vgn2 ln2 .";
    grid-auto-columns: 25%;
    grid-gap: 10px;
    border-bottom: solid 2px #fff;
}
#wrapper__infos > div
{
    padding-right: 40px;
}
.label__un
{
    grid-area: lbl1;
}
.label__deux
{
    grid-area: lbl2;
}
.label__trois
{
    grid-area: lbl3;
}
#bg-float
{
    z-index: 1;
    position: fixed;
    top: 6em;
    right: 0em;
}
#news
{
    z-index: 2;
    position: fixed;
    top: 9.5em;
    right: 2.5em;
    width: 165px;
}
.releases
{
    grid-area: rl;
    padding-top: 40px;
}
.titre
{
    background-color: #fff;
    padding-top: 5px;
    padding-bottom: 3px;
    text-indent: 10px;
}
.credits__wrapper
{
    position:relative;
    left: 0.5em;
    bottom: 0.9em;
}
.credits__content
{
    opacity: 0;
    visibility: hidden;
    position: relative;
    top: -3.34em;
    left: 5em;
    width: 50em;
    padding: 1px 10px 1px 10px;
}
.credits__content:before
{
    z-index: -1;
    top: -8px;
    transition-duration: 0.3s;
    transition-property: transform;
}
.credits__wrapper:hover .credits__content
{
    z-index: 10;
    opacity: 1;
    visibility: visible;
    transform: translate(0px, 0);
}
/**COLONNES INFOS ET LIENS - À MODIFIER À CHAQUE ENTRÉE**/
.infos1
{
    grid-area: nfo1;
}
.liens1
{
    grid-area: ln1;
}
.infos2
{
    grid-area: nfo2;
}
.liens2
{
    grid-area: ln2;
}
/**VIGNETTES AVEC SURVOL - À MODIFIER À CHAQUE ENTRÉE**/
.vignette01__wrapper
{   
    grid-area: vgn1;
    margin-top: 18px;
    border: solid 1px #fff;
    width: 95%;
    height: 49px;
    background-image: url("/rls/vignette01.jpg");
    background-size: 100%;
}
.vignette01__content
{
    opacity: 0;
    visibility: hidden;
    position: fixed;
    top: 200px;
    filter: drop-shadow(5px 5px #000);
}
.vignette01__content:before
{
    position: absolute;
    z-index: -1;
    transition-duration: 0.3s;
    transition-property: transform;
}
.vignette01__wrapper:hover .vignette01__content
{
    z-index: 10;
    opacity: 1;
    visibility: visible;
    transform: translate(-10%, 25%);
}
.vignette02__wrapper
{   
    grid-area: vgn2;
    margin-top: 18px;
    border: solid 1px #fff;
    width: 95%;
    height: 49px;
    background-image: url("/rls/vignette02.jpg");
    background-size: 100%;
}
.vignette02__content
{
    opacity: 0;
    visibility: hidden;
    position: fixed;
    top: 200px;
    filter: drop-shadow(5px 5px #000);
}
.vignette02__content:before
{
    position: absolute;
    z-index: -1;
    transition-duration: 0.3s;
    transition-property: transform;
}
.vignette02__wrapper:hover .vignette02__content
{
    z-index: 10;
    opacity: 1;
    visibility: visible;
    transform: translate(-10%, 25%);
}