/*-----------------*/
/* HEADER */
/*-----------------*/
 #header-coordonnees {
    background: var(--black);
    padding: 20px 60px;
    border-radius: 100px;
    border-top-left-radius: 0!important;
    border-top-right-radius: 0!important;
}
 #header-coordonnees br{display: none;}

/*-----------------*/
/* CONTENT */
/*-----------------*/
#liens {
    position: relative;
    padding: 20px;
    box-sizing: border-box;
}
.bloc_liens {
    position: relative;
    width: 100%;
    padding: 50px 10px;
    transition: all 0.6s;
    flex-grow: 1;
    overflow: hidden;
}
.bloc_liens:first-child{
    --primary-color: #9A6A3A;
	--secondary-color: #5a340e;
}


.bloc_liens:hover .wrapLiensImg img {transition: all 0.4s;}
.bloc_liens:hover .wrapLiensImg img {transform: rotate(5deg) scale(1.2);}

.bloc_liens .overlay {
    z-index: 1;
    pointer-events: none;
}
.wrapLiensImg {
    position: absolute;
    top: 0;
    left: 0;
    --size: 100%;
    width: var(--size);
    height: var(--size);
    z-index: 0;
}
.wrapLiensImg * {
    height: 100%;
    width: 100%;
    line-height: 0;
    transition: all 0.6s;
}
.bloc_liens .element_content {
    padding: 40px;
    padding-top: 0;
    max-width: 500px;
    z-index: 1;
    position: relative;
    margin: 0 auto;
}
.wrapContent {
    position: relative;
    z-index: 1;
    width: 100%;
}
.wrapContent h2 a {color: var(--white);}
.specialthumb {
    position: relative;
    z-index: 2;
    width: 190px;
    margin: 0 auto;
}
 .bloc_liens:nth-child(2) .specialthumb{
    width: 340px;
}
.specialthumb img{
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.bloc_liens .liresuite{
   transform: translate3d(0, 30px, 0);
   transition: opacity 0.2s, transform 0.35s;
   transition-delay: 0.1s;
   opacity: 0;
   margin-top: 50px;
}

.bloc_liens :hover .liresuite{
	opacity: 1;
	transform: translateY(-10px);
}
.bloc_liens :is(h2,.element_content) {
   transform: translate3d(0, 30px, 0);
   transition: transform 0.35s;
}

.bloc_liens .element_content {transition-delay: 0.1s;}
.bloc_liens .element_content p{}
.bloc_liens:hover :is(h2,.element_content){transform: translateY(0);}


/*-----------------*/
/* FOOTER */
/*-----------------*/
#footer{background: var(--black);}