/*-----------------*/
/* LOADER */
/*-----------------*/

#loader-wrapper .pl {
    display: block;
    width: 6.25em;
    height: 6.25em;
}
#loader-wrapper .pl__ring, .pl__ball {
    animation: ring 2s ease-out infinite;
}
#loader-wrapper .pl__ball {
    animation-name: ball;
}

/* Animation */
@keyframes ring {
    from {
        stroke-dasharray: 0 257 0 0 1 0 0 258;
    }
    25% {
        stroke-dasharray: 0 0 0 0 257 0 258 0;
    }
    50%, to {
        stroke-dasharray: 0 0 0 0 0 515 0 0;
    }
}
@keyframes ball {
    from, 50% {
        animation-timing-function: ease-in;
        stroke-dashoffset: 1;
    }
    64% {
        animation-timing-function: ease-in;
        stroke-dashoffset: -109;
    }
    78% {
        animation-timing-function: ease-in;
        stroke-dashoffset: -145;
    }
    92% {
        animation-timing-function: ease-in;
        stroke-dashoffset: -157;
    }
    57%, 71%, 85%, 99%, to {
        animation-timing-function: ease-out;
        stroke-dashoffset: -163;
    }
}
/*-----------------*/
/* ELEMENTS */
/*-----------------*/
a
{
    display: inline-block;
}
.tc_content a:not([class*="button"])
{
    display: inline;
}
.thumbnail_slider a
{
    height: 100%;
    width: 100%;
}


/*--------------------------------------------*/
#wrappersite
{
    overflow: hidden;
}
.line_wrap {
    top: 0;
    left: 50%;
    bottom: 0;
    width: 80%;
    height: 100%;
    z-index: -1;
    display: block;
    position: absolute;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    border-left: 1px solid rgb(255 255 255 / 6%);
    pointer-events: none;
}

.line_wrap:before {
    width: 1px;
    left: -1px;
    content: "";
    height: 100px;
    position: absolute;
    -webkit-animation: scroll1 15s ease-out infinite;
    animation: scroll1 15s ease-out infinite;
    background-image: -webkit-gradient(linear,left bottom,left top,from(var(--primary-color)),to(transparent));
    background-image: linear-gradient(0deg,var(--primary-color),transparent);
}
.line_item {
    width: 20%;
    height: 100%;
    position: relative;
    display: inline-block;
    border-right: 1px solid rgb(16 16 16 / 6%);
}

.line_item:before {
    width: 1px;
    right: -1px;
    content: "";
    height: 100px;
    position: absolute
}

.line_item:nth-child(odd):before {
    -webkit-animation: scroll2 15s ease-out infinite;
    animation: scroll2 15s ease-out infinite;
    background-image: -webkit-gradient(linear, left bottom, left top, from(transparent), to(var(--primary-color)));
    background-image: linear-gradient(0deg, transparent, var(--primary-color));
}

.line_item:nth-child(even):before {
    -webkit-animation: scroll1 15s ease-out infinite;
    animation: scroll1 15s ease-out infinite;
    background-image: -webkit-gradient(linear, left bottom, left top, from(var(--primary-color)), to(transparent));
    background-image: linear-gradient(0deg, var(--primary-color), transparent)
}

@-webkit-keyframes scroll1 {
    0% {
        top: 0;
        opacity: 1
    }
    50% {
        top: 50%
    }
    100% {
        top: 100%;
        opacity: .5
    }
}

@keyframes scroll1 {
    0% {
        top: 0;
        opacity: 1
    }
    50% {
        top: 50%
    }
    100% {
        top: 100%;
        opacity: .5
    }
}

@-webkit-keyframes scroll2 {
    0% {
        opacity: 1;
        bottom: 0
    }
    50% {
        bottom: 50%
    }
    100% {
        bottom: 100%;
        opacity: .5
    }
}

@keyframes scroll2 {
    0% {
        opacity: 1;
        bottom: 0
    }
    50% {
        bottom: 50%
    }
    100% {
        bottom: 100%;
        opacity: .5
    }
}

/*-----------------*/
/* HEADER */
/*-----------------*/
#header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

/*-----------------*/
/* NAVPRIMARY */
/*-----------------*/
.social:not(.no-icon)
{
    padding: 0;
}
.social:not(.no-icon):before
{
    display: none;
}



/*-----------------*/
/* HEADERHOME */
/*-----------------*/
#headerHome
{
    padding-top: 100px;
}
#banner
{
     -webkit-mask: url(../images/bottomCurveFull.svg);
    mask: url(../images/bottomCurveFull.svg);
    mask-size: cover;
    -webkit-mask-size: cover;
    mask-repeat: no-repeat;
    -webkit-mask-repeat: no-repeat;
    mask-position: bottom center;
    -webkit-mask-position: bottom center;
}
/*-----------------*/
/* CONTENT / INTRO */
/*-----------------*/
.home #content {
    padding: 0;
    /* padding-bottom: 0; */
    display: flex;
    position: relative;
    z-index: 3;
}

#content-wrapper {
    padding: 300px 90px 70px 0;
    width: 55%;
    position: relative;
}

#content-wrapper .quaternarythumb {
    position: absolute;
    left: 40%;
    top: 0px;
    width: 30%;
    height: 250px;
    overflow: hidden;
    /* opacity: 0.3; */
}
#content-wrapper .tertiarythumb {
    position: absolute;
    left: 0;
    bottom: 5%;
    width: 34.5%;
    height: 45%;
    overflow: hidden;
}
#content-wrapper .content-body {
    position: relative;
    box-sizing: border-box;
    max-width: 58%;
    margin-left: auto;
}
#content-img {
    width: 45%;
    position: relative;
}
#content-img>.blocthumb {
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    width: 100%;
    height: 100%;
    clip-path: inset(0 0 0 0);
    -webkit-clip-path: inset(0 0 0 0);
    filter: brightness(0.5);
    width: 90%;
    margin-left: auto;
}
#content-img .specialthumb {
    position: absolute;
    bottom: -80px;
    left: initial;
    right: 20Px;
    width: 250px;
    height: 310px;
    overflow: hidden;
}


/*-----------------*/
/* GALLERY HOME */
/*-----------------*/
#galleryHome .gallery-item {
    margin-bottom: 0;
}

.gallery-icon {
    line-height: 0;
}

.gallery-icon>*:not(a) {
    line-height: 1.2;
}

.gallery-icon {
    height: 100%;
}

.nohome .gallery .gallery-item a img {
    max-height: 450Px;
}
#galleryHome figure.wp-block-gallery.has-nested-images
{
    gap: 0;
}
#galleryHome::before {
    background: url(../images/shape.svg);
    background-position: bottom center;
    background-repeat: no-repeat;
    background-size: 100%;
    z-index: 1;
    top: 4px;
    pointer-events: none;
}
/*-----------------*/
/* CTA */
/*-----------------*/


/*-----------------*/
/* PRESTATIONS */
/*-----------------*/
#choixPrestations .linkPresta p{
	padding: 15px 0;
	text-transform: uppercase;
	letter-spacing: 1.5px;
	font-size: 15px;
	cursor: pointer;
	transition: 250ms all ease-in-out;
	position: relative;
	display: inline-block;
	font-family: var(--font-bold);
	color: var(--title-color);
}

#choixPrestations .linkPresta.active p,
#choixPrestations .linkPresta:hover p {color: var(--primary-color);}

#choixPrestations .linkPresta.active p{font-family: var(--font-bold);}

#choixPrestations .linkPresta p:before{
	content: "";
	border: none;
	height: 2px;
	width: 100%;
	background: var(--primary-color);
	position: absolute;
	top: 50%;
	left: 105%;
	z-index: 10;
	transition: all 300ms linear 0s;
	transform: scaleX(0);
	transform-origin: 0 50%;
}

#choixPrestations .linkPresta.active p:before{transform: scaleX(1);}

#prestations .prestations-content .liresuite a{
	--size: 140px;
	padding: 0px 52px;
	margin-bottom: -35px;
	float: none;
	position: absolute;
	right: 55px;
	bottom: 0px;
	margin-right: 0px;
	font-size: 30px;
	font-weight: bold;
	height: var(--size);
	width: var(--size);
	display: block;
	background-size: 35px;
	box-sizing: border-box;
	background-image: url(../images/icons/arrowright.svg);
	background-position: center;
	background-repeat: no-repeat;
}
#prestations .prestations-content .liresuite a span{display: none;}
#prestations .prestations-img a:before{
	background: linear-gradient(transparent, var(--black));
	z-index: 1;
}

#prestations .prestations-content .title_content:not(:hover),
#prestations .prestations-content .content_link, 
#prestations .prestations-content .tc_excerpt{color: var(--white);}

.template-parent-page-php #content
{
    padding-bottom: 0;
}
.template-parent-page-php #prestations
{
    padding-top: 0;
}
/*-----------------*/
/* ACTU / NEWS */
/*-----------------*/
#news
{
    background: var(--black);
    z-index: 2;
}
.home #news::before,.home #news::after
{
    pointer-events: none;
    background: url(../images/bottomCurve.svg);
    background-position: bottom left 30%;
    background-repeat: no-repeat;
    height: 500px;
    background-size: 150%;
}
.home #news::before {
    top: 99%;
    z-index: 1;
    transform: scale(-1);
}
.home #news::after {
    top: initial;
    bottom: 99%;
}
.home #news .content_slider::before
{
    content: '';
    position: absolute;
    top: 0;
    left: 10px;
    width: 3px;
    height: 100%;
    z-index: -1;
    background: var(--title-color);
    transition: all 0.4s;
}

.home #news .content_slider:hover::before {
    width: calc(100% - 40px);
}

/*-----------------*/
/* SECTIONS */
/*-----------------*/
#sections {
    position: relative;
    z-index: 10
}

.sectionsbloc .specialthumb {position: relative}


/*-----------------*/
/* REASSURANCES */
/*-----------------*/
#reassurances::before
{
    background-image: url(../images/home-bg1.jpg);
    background-attachment: fixed;
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
}
#reassurances .overlay
{
    z-index: -1;
}
.picto-container li:nth-child(2n) {margin-top: 50px}

.picto-container {
    justify-content: space-around;
    counter-reset: section
}

.picto-container .picto-bloc {
    position: relative;
    flex: 1 1 calc(25% - 50px);
    padding: 50px 38px 0!important
}

.picto-container li:before {
    content: "0" counter(section);
    counter-increment: section;
    font-size: 72px;
    line-height: 1;
    font-weight: 400;
    font-family: var(--font-bold);
    color: transparent;
    -webkit-text-stroke: 1px var(--white);
    opacity: .5;
    position: absolute;
    top: -20px;
    left: 50%;
    margin-left: -100px;
    z-index: 1
}

.picto-container li:after {
    --size: 140px;
    content: "";
    position: absolute;
    left: 50%;
    top: 2px;
    width: var(--size);
    height: var(--size);
    /* pour changer la couleur du background, il faut modifier le style du .s0 et du .s1. Attention, les variables ne fonctionnent pas, il faut mettre absolument le "%23" avant le code couleur voulu */
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8" standalone="no"%3F><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0.00 0.00 500.00 500.00"><path fill="%23cc6046" d=" M 124.96 448.84 C 103.53 441.42 82.06 431.21 63.85 418.55 Q 51.74 410.13 39.11 396.71 C 18.42 374.73 9.07 347.07 8.06 317.41 C 7.15 290.47 10.94 263.32 16.44 237.32 Q 23.96 201.81 38.36 167.73 C 53.58 131.71 76.51 99.05 104.78 71.71 C 132.37 45.03 168.61 25.53 207.61 24.06 Q 222.68 23.50 237.22 24.94 Q 261.67 27.36 283.45 33.16 Q 311.91 40.74 340.31 55.52 C 398.42 85.77 445.79 135.94 471.72 195.91 Q 483.08 222.19 487.07 249.63 C 491.95 283.22 486.08 315.57 468.86 345.20 Q 455.99 367.36 437.84 385.71 Q 395.11 428.88 336.35 449.34 Q 286.38 466.74 233.03 466.70 Q 217.31 466.68 198.30 464.82 Q 160.35 461.10 124.96 448.84 Z"/></svg>');
    background-repeat: no-repeat;
    z-index: -1;
    margin-left: -70px;
    background-size: contain;
    background-position: center;
}

.picto-container li p {
    margin-top: 65px;
    font-family: var(--font-bold);
    line-height: 1.3;
    /* text-transform: uppercase; */
    /* letter-spacing: 2px; */
}



/*-----------------*/
/* certifications */
/*-----------------*/

/*-----------------*/
/* PARTENAIRES */
/*-----------------*/

/*-----------------*/
/* NEWSLETTER */
/*-----------------*/

/*-----------------*/
/* AGENCES */
/*-----------------*/

/*-----------------*/
/* CONTACTFORM */
/*-----------------*/

/*-----------------*/
/* FOOTER */
/*-----------------*/
.wrapperFooter {
    background: var(--title-color);
    box-shadow: 0px 0px 30px #1a1a2612;
    padding: 10px
}

.imgFooter {
    background: url(../images/home-bg2.jpg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover
}
#footerLinks {
    padding: 20px;
    /* margin: 0 auto 50px; */
    border-top: 1px solid rgb(0 0 0 / 10%);
    text-transform: uppercase;
    letter-spacing: 0px;
    font-size: 11px;
    font-weight: bold;
}
#footer .cekome_form .blc_checkbox label a:hover{color: var(--white);}
#footer #footerbloc {padding: 40px 15px}
#footer #wrapperForm .title{margin-bottom: 20px;}