@import url(root.min.css);
@import url(components.min.css);

body {
	position: relative;
	padding-top: 96px;
	display: flex;
	flex-direction: column;
	background: var(--clr-body);
	overflow-x: clip;
	overflow-y: overlay
}

body:has(.hide-overflow) {
	overflow: hidden
}

.main-header {
	position: fixed;
	top: 0;
	height: 96px;
	width: 100%;
	padding: 16px 24px;
	display: flex;
	align-items: stretch;
	background: var(--clr-header);
	transition: all .15s;
	z-index: 100
}

.main-header>.header-mobile-menu-btn,
.main-header>.header-mobile-contact-btn {
	display: none
}

.main-header>.header-mobile-contact-menu {
	display: none
}

.main-header>.header-logo {
	height: 100%;
	margin: auto 0;
	margin-right: var(--space-m);
	display: flex;
	align-items: center;
	justify-content: center
}

.header-logo>a {
	height: 100%
}

.header-logo>a>.logo {
	height: 118%
}

.main-header>.header-centre-text {
	margin-right: auto;
	font-size: 3rem;
	color: #FFF;
	font-weight: 600;
	font-variant: all-petite-caps
}

.main-header>.header-centre-text>span {
	font-size: 1em;
	color: var(--clr-primary);
	font-style: italic
}

.main-header>.header-items {
	height: 100%;
	margin: auto 0;
	display: flex;
	align-items: center;
	column-gap: 8px
}

.header-items>.header-menu-btn {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center
}

.header-menu-btn>.btn {
	font-size: 1.6rem;
	color: #FFFFFF
}

.header-items a,
.header-items button {
	margin-left: 10px;
	text-decoration: none;
	font-size: 1rem;
	font-weight: 600;
	color: var(--clr-body) !important;
	transition: all .15s
}

.header-items>.header-item-expandable {
	position: relative
}

.header-items>.header-item-expandable>a {
	cursor: pointer
}

.header-items>.header-item-expandable>a::after {
	margin-left: 8px;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f0d7"
}

.header-item-expandable>.header-submenu {
	position: absolute;
	width: 300px;
	left: 0;
	bottom: calc(-100% - 8px);
	transform: translateY(100%);
	padding: 16px;
	display: flex;
	flex-direction: column;
	border-radius: 8px;
	background: var(--clr-header);
	box-shadow: rgba(0, 0, 0, .25) 0 14px 28px, rgba(0, 0, 0, .22) 0 10px 10px
}

.header-item-expandable>.header-submenu>a {
	margin: 0
}

.header-items a:hover {
	color: var(--clr-primary);
	text-shadow: none;
	transition: all .15s
}

.header-btn {
	height: 100%;
	padding: 8px 24px;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;
	font-size: 1rem !important;
	border: none;
	border-radius: 8px;
	text-shadow: none
}

.header-btn:hover {
	color: #FFFFFF;
	cursor: pointer
}

.header-btn.header-btn-primary {
	font-weight: 800;
	background: #FFFFFF;
	color: var(--clr-header) !important
}

.header-btn.header-btn-primary:hover {
	background: #FFFFFF;
	color: var(--clr-header) !important
}

.header-btn.header-btn-secondary {
	background: var(--clr-primary);
	color: var(--clr-body) !important;
	box-shadow: 0 0 12px 0 var(--clr-primary) !important
}

.header-btn.header-btn-secondary:hover {
	box-shadow: 0 0 16px 2px var(--clr-primary) !important
}

.header-btn.header-btn-detail {
	background: var(--clr-detail);
	color: #0E6D15 !important;
	box-shadow: 0 0 12px 0 var(--clr-detail) !important
}

.header-btn.header-btn-detail:hover {
	box-shadow: 0 0 16px 2px var(--clr-detail) !important
}

.header-btn.header-btn-phone {
	background-color: rgba(255, 255, 255, .1);
	box-shadow: 0 0 12px 0 rgba(255, 255, 255, .1) !important
}

.navbar-mobile {
	position: fixed;
	height: 100vh;
	width: 350px;
	display: none;
	flex-direction: column;
	background: rgba(0, 0, 0, .5);
	backdrop-filter: blur(300px);
	-webkit-backdrop-filter: blur(300px);
	z-index: 1000
}

.navbar-mobile-header {
	display: none;
	padding: 8px 16px;
	background: var(--clr-header)
}

.navbar-mobile-header>.btn {
	font-size: .8rem;
	color: #FFFFFF
}

.navbar-mobile-body {
	height: fit-content;
	padding: 24px;
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.navbar-item>a {
	text-decoration: none;
	font-size: 1rem;
	font-weight: 600;
	color: var(--clr-body);
	transition: all .15s;
	cursor: pointer
}

.navbar-item.expandable>a {
	display: flex;
	align-items: center;
	column-gap: 8px
}

.navbar-item.expandable>.submenu {
	width: 100%;
	padding: 16px;
	margin: 8px 0;
	display: flex;
	flex-direction: column;
	row-gap: 8px;
	border-radius: 8px;
	background: rgba(255, 255, 255, .04)
}

.navbar-item.expandable>a::after {
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f0d7";
	transform: rotate(0deg);
	transition: transform .075s
}

.navbar-item.expandable[data-expanded="true"]>a::after {
	transform: rotate(180deg);
	transition: transform .075s
}

.navbar-item.expandable>.submenu>a {
	text-decoration: none;
	font-size: 1rem;
	font-weight: 600;
	color: #FFFFFF
}

.menu-form-callback {
	position: fixed;
	right: 0;
	top: 96px;
	bottom: 0;
	height: calc(100% - 96px);
	width: fit-content;
	max-width: 512px;
	padding: 24px;
	display: flex;
	flex-direction: column;
	background: rgba(0, 0, 0, .5);
	backdrop-filter: blur(300px);
	-webkit-backdrop-filter: blur(300px);
	box-shadow: rgba(0, 0, 0, .19) 0 10px 20px, rgba(0, 0, 0, .23) 0 6px 6px;
	z-index: 101;
	overflow: auto
}

.menu-form-callback>.btn-icon {
	position: absolute;
	right: 24px;
	color: white;
	font-size: 1.4rem
}

.menu-form-callback>h2 {
	width: 100%;
	padding-right: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 2rem !important;
	color: #FFFFFF
}

.callback-form {
	flex: 1;
	margin-top: 24px;
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.callback-form>.form-col {
	flex: 0
}

.callback-form>.callback-form-infos {
	margin-top: 8px;
	width: 100%;
	font-size: .85rem
}

.callback-form-btn-container {
	margin-top: auto
}

.callback-form-btn-container>.btn {
	width: 100%;
	font-size: 1.4rem;
	font-weight: 600
}

.main-container {
	display: flex;
	flex-direction: column;
	flex: 1
}

.home-mobile-menu {
	padding: 16px;
	display: none;
	align-items: stretch;
	justify-content: space-evenly;
	column-gap: 16px;
	background: var(--clr-nav)
}

.home-mobile-menu,
.home-mobile-menu.displayed {
	display: none !important
}

.home-mobile-menu.hidden {
	display: none !important
}

.home-mobile-menu>.header-btn {
	width: 50%;
	padding: 16px;
	height: unset;
	text-decoration: none;
	font-weight: 600
}

.main-separator {
	padding: 48px 5%;
	background: var(--clr-nav)
}

.main-separator.increase-padding {
	padding-top: 136px
}

.main-separator>.main-separator-title {
	width: 100%;
	font-size: 2.8rem;
	font-weight: 100;
	color: #FFFFFF
}

.main-separator>.main-separator-title>span {
	font-size: 2.8rem;
	font-weight: 900;
	font-style: italic;
	color: var(--clr-primary)
}

.main-separator-title.left {
	text-align: left
}

.main-separator-title.right {
	text-align: right
}

.section-background {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%
}

.image-slider.rdv-slider {
	aspect-ratio: 1920/300
}

.image-slider {
	position: relative;
	display: flex;
	background: var(--clr-header);
	aspect-ratio: 413/140;
	z-index: 2
}

.image-slider-bck {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: -4px;
	border-bottom: 8px solid var(--clr-primary);
	background: linear-gradient(0deg, rgba(18, 22, 22, 1) 0, rgba(234, 236, 236, 0) 80px);
	z-index: 1;
	pointer-events: none
}

.image-slider-control {
	position: absolute;
	height: 100%;
	padding: 5%;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center
}

.image-slider-control.left {
	left: 0
}

.image-slider-control.right {
	right: 0
}

.image-slider-control>.btn {
	height: 48px;
	border-radius: 16px;
	font-size: 1.4rem;
	color: #FFFFFF;
	background: var(--clr-header);
	box-shadow: rgba(0, 0, 0, .19) 0 10px 20px, rgba(0, 0, 0, .23) 0 6px 6px !important;
	aspect-ratio: 1/1;
	transition: transform .15s;
	z-index: 1
}

.image-slider-control>.btn:hover {
	transform: scale(1.05);
	transition: transform .15s
}

.image-slider-content {
	position: absolute;
	top: 0;
	height: 100%;
	width: 100%;
	margin-left: -100%;
	display: flex
}

.image-slider-content.no-margin {
	margin: 0 !important
}

.image-slider-content img,
.image-slider-content picture,
.image-slider-content video {
	height: 100%;
	width: 100%;
	flex-shrink: 0;
	object-fit: cover
}

.offers-container {
	position: absolute;
	min-height: 1px;
	height: 160px;
	width: 60%;
	margin: 0 auto;
	left: 0;
	right: 0;
	bottom: 0;
	transform: translateY(50%);
	display: flex;
	align-items: center;
	justify-content: space-evenly;
	border-radius: 16px;
	border: 1px solid rgba(19, 19, 19, .5);
	background: rgba(19, 19, 19, .5);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	box-shadow: rgba(0, 0, 0, .19) 0 10px 20px, rgba(0, 0, 0, .23) 0 6px 6px;
	z-index: 2
}

.offer-step {
	position: relative;
	height: 70%;
	width: fit-content;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--clr-body);
	cursor: pointer
}

.offer-step>.offer-step-content {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 8px;
	text-align: center;
	overflow: hidden;
	z-index: 2
}

.offer-step-content>img {
	height: 50px
}

.offer-step-content>i,
.offer-step-content>.offer-step-text {
	flex: 1;
	z-index: 1
}

.offer-step-content>i {
	font-size: 2rem
}

.offer-step-content>.offer-step-text {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center
}

.offer-step-text span {
	font-size: 1.6rem;
	font-weight: 700;
	font-variant: all-small-caps
}

.find-my-center-section {
	position: relative;
	height: 80vh;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 5%;
	background: url(../img/find-center-bck-resize.webp);
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center
}

.find-my-center-section>.section-background {
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	filter: grayscale(50%)
}

.find-my-center-section>.section-background::after {
	position: absolute;
	content: '';
	height: 100%;
	width: 100%;
	background: rgba(0, 0, 0, .5);
	z-index: 1
}

.find-my-center-section .section-col {
	position: relative;
	height: 100%;
	width: 50%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	z-index: 1
}

.find-my-center-section svg {
	height: 100%;
	width: 100%;
	max-width: fit-content;
	padding: 24px 0
}

.text-over-map>span {
	color: black
}

.find-my-center-section .find-my-center-content {
	width: 50%;
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 40px
}

.find-my-center-section .center-icon {
	height: 160px;
	filter: drop-shadow(0 0 6px rgba(0, 0, 0, .7))
}

.find-my-center-section .center-btn {
	padding: 10px 20px;
	font-size: 1.6rem;
	font-weight: 600;
	box-shadow: rgba(0, 0, 0, .19) 0 10px 20px, rgba(0, 0, 0, .23) 0 6px 6px
}

.find-my-center-section .center-text {
	font-size: 1.2rem;
	text-align: center;
	color: #FFFFFF
}

.region {
	transition: all .15s
}

.region.disabled {
	fill: #EEEEEE;
	stroke: #E0E0E0;
	pointer-events: none
}

.region:hover {
	stroke: var(--clr-primary);
	fill: var(--clr-primary);
	transition: all .15s;
	cursor: pointer
}

.map-tooltip {
	position: absolute;
	padding: 10px;
	border-radius: 8px;
	border: 1px solid rgba(0, 0, 0, .3);
	font-weight: 600;
	color: #FFFFFF;
	background: rgba(0, 0, 0, .4);
	backdrop-filter: blur(30px);
	-webkit-backdrop-filter: blur(30px);
	box-shadow: rgba(0, 0, 0, .19) 0 10px 20px, rgba(0, 0, 0, .23) 0 6px 6px;
	pointer-events: none;
	z-index: 1000
}

.marker-content {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center
}

.marker-content>p {
	font-size: 1rem;
	color: #777777;
	font-weight: 500
}

.marker-content>.btn {
	width: 100%;
	margin-top: 16px
}

.services-section {
	height: 40vh!important;
	width: 100%;
	margin: 0;
	display: flex;
	align-items: center;
	justify-content: center
}

.section-col {
	height: 100%;
	width: 50%;
	/* padding: 80px */
}

.services-section>.section-col.left-col {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background: var(--clr-primary)
}

.services-catchphrase-top,
.services-catchphrase-sub {
	font-size: 2.6rem;
	color: #FFFFFF
}

.services-catchphrase-top {
	font-weight: 300
}

.>.section-col.left-col>.btn {
	margin-top: 80px;
	min-width: 33%;
	padding: 10px 20px;
	font-size: 1.6rem;
	font-weight: 900;
	color: var(--clr-primary);
	background: #FFFFFF !important
}

.services-section>.section-col.right-col {
	padding: 0
}

.services-section>.section-col.right-col>img {
	height: 100%;
	width: 100%;
	padding: 0;
	object-fit: cover
}

.review-section {
	height: fit-content;
	min-height: 100vh;
	/* width: 100%; */
	/* padding: 80px; */
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 80px
}

.review-section>.section-col {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 143px;
	width: 80%
}

.review {
	width: 33.33%;
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 10px
}

.review-logo {
	height: 70px
}

.review-logo>img {
	height: 100%;
	object-fit: contain
}

.review-rating {
	font-size: 3rem;
	font-weight: 700
}

.review-rating>span {
	font-size: 1em
}

.review-stars {
	font-size: 1.2rem;
	color: #FFC100
}

.skeepers-widget-wrapper-efed6021-8fe3-4de8-aa33-405e9b9b5259 {
	right: unset;
	left: 1vh
}

.skeepers_carousel_container .skeepers_carousel-main .swiper .swiper-wrapper .w-25 .carousel-content {
	border-radius: 8px !important;
	border: none !important
}

.page-header {
	padding: 40px 5%;
	display: flex;
	flex-direction: column;
	background: var(--clr-nav)
}

.page-header>.page-title {
	height: 64px;
	margin-bottom: 32px;
	color: #FFFFFF
}

.page-header>.page-title:only-child {
	margin-bottom: 0
}

.page-header>.page-catchphrase {
	margin-bottom: 32px;
	font-weight: 300;
	font-style: italic;
	color: #FFFFFF
}

.page-section {
	position: relative;
	height: calc(75vh + 240px);
	width: 100%;
	margin: 0 auto;
	display: flex;
	flex-direction: column
}

.page-section>.page-content {
	display: flex
}

.centers-map-section {
	height: calc(65vh + 240px);
	z-index: 1
}

.centers-search-container {
	display: flex;
	column-gap: 24px
}

.centers-search-btn-domicile {
	width: 180px !important;
	height: 62px !important;
	margin-top: auto
}

.centers-search-container .form-label>i {
	font-size: .9rem;
	color: rgba(255, 255, 255, .4)
}

.center-search-map {
	height: 100%;
	width: 100%
}

.center-search-map>#map {
	width: calc(100% + 45%);
	height: 100%
}

.center-search-over-map {
	position: absolute;
	height: 100%;
	width: 40%;
	top: 0;
	left: 5%;
	display: flex;
	flex-direction: column;
	background: var(--clr-body);
	box-shadow: rgba(0, 0, 0, .16) 0 3px 6px, rgba(0, 0, 0, .23) 0 3px 6px
}

.center-search-over-map>.center-search-page {
	flex: 1;
	display: flex;
	flex-direction: column
}

.center-search-page>.center-search-item {
	position: relative;
	height: 25%;
	padding: 16px;
	border-bottom: 1px solid rgba(0, 0, 0, .2);
	background: #FFFFFF;
	transition: all .15s
}

.center-search-page>.center-search-item:hover,
.center-search-page>.center-search-item.selected {
	background: rgba(50, 50, 50, .03);
	transition: all .15s
}

.center-search-item>.center-search-name {
	margin-bottom: 8px;
	color: #000000
}

.center-search-name>a>h2 {
	font-weight: 900
}

.center-search-name>a:has(h2) {
	text-decoration: none
}

.center-search-item>.center-search-address,
.center-search-item>.center-search-city {
	color: rgba(0, 0, 0, .4);
	font-size: 1.1em;
	font-weight: 500
}

.center-search-item>.center-search-distance,
.center-search-item>.center-search-tel {
	color: #000000;
	font-size: 1.1em;
	font-weight: 500
}

.center-search-item>.center-search-city {
	margin-bottom: 8px
}

.center-search-item>.center-search-distance,
.center-search-item>.center-search-tel {
	display: flex;
	align-items: center;
	column-gap: 8px
}

.center-search-item i {
	width: 24px;
	color: var(--clr-primary)
}

.center-search-item span,
.center-search-item a {
	color: inherit;
	font-size: inherit
}

.center-search-item a:hover {
	cursor: pointer
}

.center-search-item>.center-search-btns {
	position: absolute;
	bottom: 16px;
	right: 16px;
	display: flex;
	column-gap: 8px;
	font-weight: 500;
	color: #FFFFFF
}

.center-search-page-nmbr {
	padding: 16px;
	margin-top: -1px;
	display: flex;
	justify-content: center;
	column-gap: 4px;
	flex-shrink: 0;
	border-top: 1px solid rgba(0, 0, 0, .2);
	background: #FFFFFF
}

.center-search-page-nmbr>.page-btn {
	height: 40px;
	padding: 0;
	border: 1px solid var(--clr-primary);
	border-radius: 8px;
	display: flex;
	justify-content: center;
	font-weight: 900;
	line-height: 40px;
	color: var(--clr-primary);
	background: transparent !important;
	transform: scale(1);
	aspect-ratio: 1/1;
	transition: transform .15s
}

.center-search-page-nmbr>.page-btn:hover {
	transform: scale(1.04);
	transform-origin: center center;
	transition: transform .15s
}

.center-search-page-nmbr>.page-btn.active {
	color: #FFFFFF;
	background: var(--clr-primary) !important;
	transform: scale(1.04);
	transform-origin: center center;
	transition: transform .15s
}

.centers-departement-section {
	position: relative;
	height: fit-content;
	padding: 60px 5%
}

.centers-departement-section::before {
	position: absolute;
	content: '';
	height: 300px;
	width: 150%;
	top: -120px;
	left: -25%;
	background: var(--clr-nav);
	z-index: 0
}

.centers-departement-section>h1 {
	height: 64px;
	margin-bottom: 120px;
	color: #FFFFFF;
	z-index: 1
}

.centers-departement {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-gap: 24px
}

.centers-departement>.centers-departement-col {
	display: flex;
	flex-direction: column;
	row-gap: 24px
}

.centers-departement-col>.centers-departement-list {
	position: relative;
	padding: 16px;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	z-index: 1
}

.centers-departement-list>.centers-departement-title {
	width: 100%;
	display: flex;
	align-items: center;
	column-gap: 8px;
	border-radius: 8px
}

.centers-departement-title>.centers-departement-nmbr {
	height: 48px;
	width: 48px;
	display: flex;
	justify-content: center;
	line-height: 48px;
	border-radius: 8px;
	background: var(--clr-header)
}

.centers-departement-nmbr {
	font-size: 1.2rem;
	font-weight: 600;
	color: #FFFFFF
}

.centers-departement-name {
	font-size: 1.2rem;
	font-weight: 900;
	color: #000000
}

.centers-departement-list>.centers-list {
	padding: 16px;
	padding-bottom: 0;
	margin: 0;
	display: flex;
	flex-direction: column;
	list-style-type: none
}

.centers-list>li>a {
	font-size: 1.1rem;
	font-weight: 400;
	color: #000000;
	text-decoration: none
}

.centers-list>li>a:hover {
	color: var(--clr-primary)
}

#centreInfoHeaderMobile {
	display: none
}

.center-info-map-section {
	position: relative;
	height: 56vh;
	width: 100%;
	display: flex;
	justify-content: center;
	background: var(--clr-body);
	z-index: 1
}

.center-info-map-section>#map-info {
	height: 100%;
	width: calc(100% + 45%)
}

.center-info-map-section>.center-info-over-map {
	position: absolute;
	left: 5%;
	height: fit-content;
	width: 40%;
	padding: 32px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 16px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px
}

.center-info-over-map>h2 {
	font-weight: 900
}

.center-info-address {
	display: flex;
	flex-direction: column;
	font-size: 1.1rem;
	font-weight: 500;
	color: rgba(0, 0, 0, .4)
}

.center-info-address>span {
	font-size: inherit;
	color: inherit
}

.center-info-details {
	display: flex;
	flex-direction: column
}

.center-info-details>.center-info-tel,
.center-info-details>.center-info-hours {
	display: flex;
	align-items: center;
	column-gap: 8px;
	font-size: 1.1rem;
	font-weight: 500
}

.center-info-tel>i,
.center-info-hours>i {
	width: 24px;
	color: var(--clr-primary)
}

.center-info-tel>a,
.center-info-hours>span {
	font-size: inherit;
	color: inherit
}

.center-info-btns {
	margin-top: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px
}

.center-info-btns>.btn {
	flex: 1;
	font-weight: 600
}

.center-info-section {
	height: fit-content;
	padding: 80px 5%;
	padding-bottom: 0;
	display: flex;
	flex-direction: row;
	column-gap: 40px
}

.center-info-section::before {
	position: absolute;
	content: '';
	height: 300px;
	width: 150%;
	left: -25%;
	top: -54px;
	transform: rotate(-1deg);
	background: var(--clr-nav)
}

.center-info-section>.centre-info-col {
	height: 100%;
	display: flex;
	flex-direction: column;
	row-gap: 24px;
	z-index: 1
}

.centre-info-col>.centre-info-col-carousel {
	position: relative;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	z-index: 1;
	aspect-ratio: 16/9;
	overflow: hidden
}

.centre-info-col-carousel>.centre-carousel-img-container {
	height: 100%;
	width: 100%;
	display: flex
}

.centre-info-col-carousel>.centre-carousel-dot-container {
	position: absolute;
	bottom: 0;
	height: 50px;
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: center;
	column-gap: 8px
}

.centre-carousel-dot-container>.centre-carousel-dot {
	height: 10px;
	width: 10px;
	border-radius: 100px;
	background-color: #FFFFFF
}

.centre-carousel-dot-container>.centre-carousel-dot.current {
	background: var(--clr-primary)
}

.centre-carousel-img-container>img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	flex-shrink: 0
}

.centre-info-col>.centre-info-col-nav {
	display: flex;
	align-items: center;
	column-gap: 8px;
	margin-bottom: 40px;
	font-size: 1.1rem;
	border-radius: 8px;
	color: #FFFFFF
}

.centre-info-col-nav>span,
.centre-info-col-nav>a {
	font-size: inherit;
	color: inherit;
	text-decoration: none;
	transition: color .15s
}

.centre-info-col-nav>span:last-of-type {
	color: var(--clr-primary)
}

.centre-info-col-nav>a:hover {
	color: var(--clr-primary);
	transition: color .15s
}

.centre-info-col>h1 {
	height: 64px;
	margin-bottom: 80px;
	color: #FFFFFF
}

.centre-info-col>.centre-info-col-text {
	margin-bottom: 40px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	font-size: 1.1rem;
	text-align: justify
}

.centre-info-col-text>p {
	font-size: inherit;
	text-align: inherit;
	color: inherit;
	font-weight: inherit
}

.centre-info-col>.centre-info-col-btns {
	display: flex;
	flex-direction: row;
	column-gap: 8px;
	font-size: 1.1rem
}

.centre-info-col>.centre-info-col-hours {
	flex: 1;
	padding: 40px;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	z-index: 1
}

.centre-info-col-hours>h2 {
	height: 48px
}

.centre-info-col-hours>.centre-info-col-hours-list {
	padding: 0;
	margin: 40px 0;
	list-style-type: none
}

.centre-info-col-hours-list>li {
	font-size: 1.1rem
}

.centre-info-col-hours-list>li.current {
	font-weight: 700
}

.centre-info-col-hours-list>li.closed {
	font-weight: 700;
	color: rgba(0, 0, 0, .4)
}

.centre-info-col-hours-list>li>.hours-list-day {
	width: 120px;
	display: inline-block;
	font-size: 1.1rem
}

.centre-info-col-hours>.centre-info-col-gps-btns {
	width: 100%;
	margin-top: 40px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	column-gap: 32px
}

.centre-info-col-gps-btns>.gps-button {
	position: relative;
	height: 64px;
	width: 64px;
	padding: 8px;
	border: none;
	border-radius: 8px;
	background: transparent;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px !important;
	overflow: inherit
}

.centre-info-col-gps-btns>.gps-button::after {
	position: absolute;
	bottom: 0;
	padding-top: 4px;
	transform: translateY(100%);
	font-size: 1rem;
	font-weight: 400;
	content: attr(data-gps);
	transition: all .15s
}

.centre-info-col-gps-btns>.gps-button:hover::after {
	font-weight: 600;
	color: var(--clr-primary);
	transition: all .15s
}

.centre-info-col-gps-btns>.gps-button.waze {
	background: #70D1FB
}

.centre-info-col-gps-btns>.gps-button.maps,
.centre-info-col-gps-btns>.gps-button.plans {
	background: var(--clr-body)
}

.centre-info-col-gps-btns>.gps-button>img {
	height: 100%
}

.center-info-go-back-section {
	height: fit-content;
	padding: 80px 5%
}

.center-info-go-back-section>a {
	width: fit-content;
	display: flex;
	align-items: center;
	column-gap: 8px;
	font-size: 1.4rem;
	font-weight: 700;
	color: var(--clr-primary);
	text-decoration: none
}

.jeu-concours {
	padding: 40px 5%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 24px
}

.jeu-concours>.btn {
	height: 64px;
	width: 50%;
	min-width: 300px;
	font-size: 1.8rem
}

.jeu-concours>form {
	width: 100%;
	padding: 16px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 8px;
	background: rgba(0, 0, 0, .04)
}

.jeu-concours>form .form-col {
	row-gap: 8px
}

.jeu-concours>form .form-row {
	flex-direction: row !important
}

.jeu-concours>form .form-label {
	width: 100%;
	margin: 0
}

#jeuConcoursSendBtn {
	height: 64px;
	width: 50%;
	min-width: fit-content;
	margin: auto;
	min-width: fit-content;
	column-gap: 8px;
	font-size: 1.2rem
}

.offers-section {
	height: fit-content;
	padding: 80px 5%;
	display: flex;
	flex-direction: column;
	row-gap: 40px
}

.offers-section>.offers-row {
	height: fit-content;
	flex: .5;
	display: flex;
	flex-direction: row;
	column-gap: 40px;
	row-gap: 40px
}

.offers-row>.offer-card {
	flex: 1;
	position: relative
}

.offer-card::before {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	content: attr(data-offer-step);
	display: flex;
	align-items: center;
	font-family: 'Montserrat', sans-serif;
	font-size: 11rem;
	font-weight: 700;
	color: rgba(150, 150, 150, .25);
	transition: color .15s;
	z-index: -2
}

.offer-card:hover::before {
	color: var(--clr-primary);
	transition: color .15s
}

.offer-card>.offer-card-content {
	position: relative;
	height: 100%;
	width: 100%;
	padding: 40px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 16px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	overflow-y: clip
}

.offer-card-content>.offer-card-title {
	display: flex;
	align-items: center;
	column-gap: 16px
}

.offer-card-title>i {
	font-size: 1.6rem
}

.offer-card-title>span {
	font-size: 1.6rem
}

.offer-card-content>.offer-card-description {
	font-size: 1.1rem
}

.offer-card-content>.offer-card-detail {
	margin-top: auto;
	font-size: .9rem;
	color: rgba(0, 0, 0, .4)
}

.activities-section {
	height: fit-content;
	padding: 80px 5%;
	display: flex;
	flex-direction: column;
	row-gap: 40px
}

.activities-section>.activities-row {
	position: relative;
	min-height: fit-content;
	height: 45vh;
	display: flex;
	flex-direction: row;
	border-radius: 16px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	overflow: clip
}

.activities-section>.activities-row:nth-child(even) {
	flex-direction: row-reverse
}

.activities-row>img {
	height: 100%
}

.activities-row>.activities-row-content {
	height: 100%;
	padding: 80px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	row-gap: 16px
}

.activities-row-content>h2 {
	height: 56px;
	margin-bottom: 32px;
	font-size: 2rem;
	flex-shrink: 0
}

.activities-row-content>p {
	font-size: 1rem;
	text-align: justify
}

.job-search-container {
	display: flex;
	column-gap: 32px
}

.job-offers-section {
	position: relative;
	height: fit-content;
	padding: 80px 5%;
	padding-top: 40px;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: min-content;
	grid-gap: 16px
}

.job-offers-section>.job-card {
	padding: 24px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	z-index: 1
}

.job-card>.job-details {
	display: flex;
	flex-direction: column
}

.job-details>span {
	font-size: 1.1rem;
	color: rgba(0, 0, 0, .4)
}

.job-card>.job-tags {
	display: flex;
	column-gap: 8px
}

.job-tags>.job-tag {
	min-width: 70px;
	padding: 4px 8px;
	border-radius: 8px;
	text-align: center;
	color: #FFFFFF;
	background: var(--clr-primary)
}

.job-card>.job-start-date>span {
	font-size: 1.1rem;
	font-weight: 300
}

.job-card>.job-salary>span {
	font-weight: 700;
	font-size: 1.1rem
}

.job-tag>span>i,
.job-start-date>span>i,
.job-salary>span>i {
	width: 20px
}

.job-card>.job-footer {
	margin-top: auto;
	display: flex;
	align-items: center
}

.job-footer>.job-btn {
	padding: 0;
	margin-left: 16px;
	font-size: 1rem;
	font-weight: 400;
	text-decoration: none;
	border: 0;
	color: var(--clr-primary);
	background: transparent
}

.job-footer>.job-btn:first-of-type {
	margin-left: auto
}

.job-description {
	position: fixed;
	height: calc(100vh - 32px);
	width: calc(100% - 32px);
	top: 16px;
	left: 16px;
	padding: 40px;
	display: flex;
	flex-direction: column;
	border-radius: 16px;
	background: #FFFFFF;
	box-shadow: rgba(0, 0, 0, .3) 0 0 50px 58px;
	z-index: 200
}

.job-description-header>.job-description-title {
	height: 64px !important;
	width: 50%;
	font-size: 2rem;
	font-weight: 600
}

.job-description>.job-description-header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between
}

.job-description>.job-description-body {
	flex: 1;
	display: flex;
	flex-direction: row;
	column-gap: 40px
}

.job-description-body>.job-description-separator {
	height: 100%;
	width: 4px;
	border-radius: 8px;
	background: rgba(0, 0, 0, .1)
}

.job-description-body>.job-description-col {
	display: flex;
	flex-direction: column;
	text-align: justify
}

.job-description-col>.job-description-subtitle {
	margin-top: 40px;
	margin-bottom: 16px;
	font-size: 1.6rem
}

.job-description>.job-description-footer {
	display: flex;
	justify-content: flex-end;
	column-gap: 16px
}

.job-description-footer>.btn-icon {
	font-size: 1.1rem;
	color: var(--clr-primary)
}

.job-description-address {
	margin-top: 16px
}

.job-description-address>span {
	display: flex;
	flex-direction: column;
	font-size: 1.1rem;
	color: rgba(0, 0, 0, .4)
}

.job-description-details {
	margin-top: 16px;
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.job-description-details>span {
	font-size: 1.1rem !important
}

.job-description-details>span>span {
	font-size: 1.1rem
}

.job-form-header>p {
	font-size: 1.1rem
}

.job-form-header>p:last-of-type {
	margin-bottom: 16px
}

.job-form-header>i {
	font-weight: 600
}

.job-form {
	margin-top: 24px;
	padding: 16px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 8px;
	border: 1px solid var(--clr-border);
	background: var(--clr-body)
}

.job-form .job-submit-btn {
	height: 48px;
	width: 50%;
	margin-left: auto;
	margin-top: 24px;
	font-size: 1.2rem
}

.appointment-form-section {
	position: relative;
	height: fit-content;
	padding: 40px 5%;
	display: flex;
	flex-direction: row;
	column-gap: 80px
}

.appointment-form-section>.appointment-col {
	display: flex;
	flex-direction: column
}

.appointment-col>.appointment-step-bar {
	height: fit-content;
	width: 100%;
	margin-bottom: 40px;
	display: flex;
	justify-content: space-between
}

.appointment-step-bar>h1>span {
	height: 64px;
	font-size: 2.6rem;
	font-weight: 900
}

.appointment-step-bar>h1>span:last-of-type {
	font-size: 2.6rem;
	font-weight: 900;
	color: var(--clr-primary)
}

.appointment-step-bar>.step-bar-content {
	position: relative;
	display: flex;
	align-items: center;
	column-gap: 80px
}

.step-bar-content>.bar {
	position: absolute;
	height: 4px;
	width: 100%;
	top: 0;
	bottom: 0;
	margin: auto;
	background: rgba(0, 0, 0, .4);
	background-image: linear-gradient(var(--clr-primary), var(--clr-primary));
	background-size: 0 100%;
	background-repeat: no-repeat;
	z-index: 0
}

.step-bar-content>.step {
	position: relative;
	height: 40px;
	width: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 100px;
	color: rgba(0, 0, 0, .4);
	background: var(--clr-body);
	border: 2px solid rgba(0, 0, 0, .4);
	pointer-events: none;
	transition: all .15s;
	z-index: 1
}

.step-bar-content>.step.done {
	background-color: var(--clr-primary);
	color: #FFFFFF;
	border-color: var(--clr-primary);
	pointer-events: all;
	cursor: pointer;
	transition: all .15s
}

.step-bar-content>.step::before {
	position: absolute;
	content: attr(data-title);
	width: fit-content;
	top: -8px;
	left: 50%;
	transform: translateY(-100%) translateX(-50%);
	white-space: nowrap;
	font-size: 1rem;
	font-variant: all-petite-caps;
	font-weight: 600;
	color: rgba(0, 0, 0, .4)
}

.appointment-content {
	width: 100%;
	display: flex;
	flex-direction: row
}

.appointment-content>.appointment-form {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	row-gap: 40px
}

.appointment-form>.appointment-step {
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center
}

.appointment-form>.appointment-step.inline-step {
	flex-direction: row
}

.appointment-step[data-last-step="true"]>.btn,
#appointmentSendBtn {
	height: 64px;
	width: 50%;
	min-width: fit-content;
	column-gap: 8px;
	font-size: 1.2rem
}

.appointment-step>label {
	margin-bottom: 20px;
	font-size: 1.2rem
}

.appointment-step>.form-row {
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 40px
}

.appointment-step>.form-row img {
	height: 24px;
	margin-left: 8px
}

.appointment-step>.form-row>.form-item {
	height: fit-content;
	width: 200px;
	padding: 20px;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: #FFFFFF;
	border-radius: 8px;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	transition: transform .15s
}

.appointment-step>.form-row>.form-item-text {
	background: transparent;
	box-shadow: none;
	align-items: flex-start;
	width: fit-content;
	border-left: 4px solid rgba(0, 0, 0, .2);
	border-radius: 0;
	pointer-events: none
}

.appointment-step>.form-row>.form-item-text:hover {
	transform: unset !important
}

.appointment-step>.form-row>.form-item-text>span {
	margin: 0 !important
}

.appointment-step>.form-row>.form-item.form-item-inline {
	width: fit-content;
	display: flex;
	flex-direction: row;
	column-gap: 16px
}

.appointment-step>.form-row>.form-item.form-item-inline.form-item-center {
	margin: auto
}

.appointment-step>.form-row>.form-item:has(input[type="radio"]:checked) {
	border: 2px solid var(--clr-primary);
	background: var(--clr-primary);
	color: #FFF
}

.appointment-step>.form-row>.form-item:hover {
	transform: scale(1.02);
	cursor: pointer;
	transition: transform .15s
}

.appointment-step>.form-row>.form-item>input[type="radio"] {
	display: none
}

.appointment-step>.form-row>.form-item>img {
	height: 100px;
	width: 100%;
	object-fit: contain;
	filter: drop-shadow(0 0 2px rgba(0, 0, 0, .7))
}

.appointment-step>.form-row>.form-item>span {
	margin-top: 20px;
	font-size: 1.2rem
}

.appointment-step>.form-row>.form-item.form-item-inline>i {
	font-size: 1.2rem
}

.appointment-step>.form-row>.form-item.form-item-inline>span {
	margin-top: 0;
	font-size: 1.2rem
}

.appointment-calendar-row {
	position: relative;
	width: 100%;
	padding: 8px 54px;
	display: flex;
	border-radius: 8px;
	background: var(--clr-body);
	overflow: hidden
}

.appointment-calendar-row>.appointment-calendar-arrow {
	position: absolute;
	height: 100%;
	width: 54px;
	padding: 0 20px;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--clr-body);
	z-index: 10
}

.appointment-calendar-arrow.left {
	left: 0
}

.appointment-calendar-arrow.right {
	right: 0
}

.appointment-calendar-row>.appointment-calendar-content {
	width: 100%;
	padding: 8px;
	display: flex
}

.appointment-calendar-content>.calendar-day {
	height: fit-content;
	width: calc(100% / 5 - ((16px * 4) / 5));
	margin-left: 16px;
	padding: 16px;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: center;
	border-radius: 8px;
	background: #FFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	aspect-ratio: 1/1
}

.appointment-calendar-content>.calendar-day:first-of-type {
	margin: 0
}

.calendar-day>.calendar-day-name,
.calendar-day>.calendar-day-month {
	font-size: 1.2rem;
	font-weight: 400
}

.calendar-day>.calendar-day-day {
	font-size: 1.4rem;
	font-weight: 900
}

.calendar-day>.calendar-day-btns {
	width: 100%;
	margin-top: 16px;
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.calendar-day-btns>.btn {
	width: 100%;
	border: 2px solid var(--clr-primary);
	font-weight: 600;
	color: var(--clr-primary);
	background: transparent !important;
	transition: all .15s
}

.calendar-day-btns>.btn:disabled {
	background: var(--clr-border) !important;
	border-color: var(--clr-border) !important;
	color: #000000
}

.calendar-day-btns>.btn:disabled:hover {
	box-shadow: none !important
}

.calendar-day-btns>.btn:has(input[type="radio"]:checked) {
	border: 2px solid transparent;
	color: #FFFFFF;
	background: var(--clr-primary) !important;
	transition: all .15s
}

.calendar-day-btns>.btn>input {
	display: none !important
}

.appointment-kdo-carousel-container {
	height: 250px;
	width: 50%;
	margin: auto;
	display: flex;
	flex-direction: row;
	column-gap: 16px;
	overflow: hidden
}

.appointment-kdo-carousel-container>.appointment-kdo-carousel-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 1.6rem;
	cursor: pointer
}

.appointment-kdo-carousel-container>.appointment-kdo-carousel {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: row;
	overflow: hidden
}

.appointment-kdo-carousel>.appointment-kdo-item {
	height: 100%;
	width: 100%;
	padding: 16px;
	margin-right: 8px;
	flex-shrink: 0;
	border-radius: 8px;
	background: white;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	cursor: pointer
}

.appointment-kdo-item:has(input:checked) {
	background: var(--clr-primary)
}

.appointment-kdo-item>img {
	height: 100%;
	width: 100%;
	object-fit: contain
}

.appointment-kdo-item>input {
	display: none !important
}

.appointment-optional-infos {
	width: 100%;
	margin-top: 20px;
	padding: 40px;
	display: flex;
	flex-wrap: wrap;
	flex-direction: row;
	column-gap: 20px;
	row-gap: 20px;
	border-radius: 8px;
	background: rgba(0, 0, 0, .04)
}

.appointment-optional-infos:first-of-type {
	margin-top: 0
}

.appointment-optional-infos>label {
	width: 100%;
	display: flex;
	align-items: center;
	column-gap: 8px;
	font-size: 1.4rem
}

.appointment-optional-infos>textarea {
	min-width: 100%
}

.appointment-optional-infos>.appointment-small-text {
	margin-bottom: 8px;
	font-size: .8rem;
	text-align: justify
}

.appointment-optional-infos .file-signature {
	width: 150px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 8px;
	font-size: 2rem;
	font-weight: 600;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(50, 50, 50, .05) 0 1px 0, rgba(50, 50, 50, .1) 0 0 8px;
	cursor: pointer;
	transition: transform .15s;
	aspect-ratio: 1/1
}

.appointment-optional-infos .file-signature:hover {
	transform: scale(1.02);
	cursor: pointer;
	transition: transform .15s
}

.file-signature>input[type="checkbox"] {
	display: none !important
}

.file-signature:has(input[type="checkbox"]:checked) {
	color: #0E6D15 !important;
	background: var(--clr-detail)
}

.appointment-step-inputs {
	width: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 20px
}

.modal-documents-to-sign-signature {
	height: fit-content;
	border-radius: var(--border-radius-l);
	background: white;
	z-index: 1
}

.modal-documents-to-sign-signature>span {
	display: block;
	width: 100%;
	text-align: center;
	font-size: 1.6rem;
	font-weight: 600
}

.modal-documents-to-sign-signature>.signature-frame {
	margin-top: 16px;
	border: 1px solid rgba(0, 0, 0, .3);
	border-radius: 8px;
	overflow: hidden
}

.modal-documents-to-sign-signature>.signature-toolbar {
	display: flex;
	justify-content: flex-end;
	padding-top: 16px;
	column-gap: 8px
}

.appointment-help-col {
	position: sticky;
	top: 120px;
	height: fit-content;
	padding: 40px;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	z-index: 1
}

.appointment-help-col>h1 {
	height: 64px;
	margin-bottom: 40px
}

.appointment-help-content {
	display: flex;
	flex-direction: column;
	row-gap: 32px
}

.appointment-help-phone {
	display: flex;
	flex-direction: column
}

.appointment-help-phone>span {
	font-size: 1.8rem;
	color: var(--clr-primary);
	font-weight: 700
}

.appointment-help-phone>span:last-of-type {
	font-weight: 300 !important
}

.appointment-help-description>span {
	font-size: 1.1rem;
	font-weight: 300
}

.appointment-help-list {
	position: relative;
	font-family: 'Rajdhani', sans-serif;
	list-style-type: none;
	font-size: 1.4rem;
	font-weight: 700
}

.appointment-help-list>li::before {
	position: absolute;
	left: 0;
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	content: "\f058";
	color: var(--clr-primary)
}

.appointment-help-details {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.appointment-help-details>span {
	font-size: 1.1rem;
	font-weight: 300
}

.appointment-help-details>span>i {
	color: var(--clr-primary);
	width: 40px;
	font-size: 1.4rem
}

.fonctionnement-section {
	height: fit-content;
	position: relative;
	padding: 80px 5%
}

.timeline-top-row {
	height: 30vh;
	width: 100%;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-evenly
}

.timeline-row {
	position: absolute;
	height: 8px;
	left: 0;
	right: 0;
	border-top-left-radius: 100px;
	border-bottom-left-radius: 100px;
	background: var(--clr-primary)
}

.timeline-item {
	position: relative;
	height: 32px;
	aspect-ratio: 1/1;
	border-radius: 100px;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center
}

.timeline-side-row {
	position: absolute;
	height: 40vh;
	width: 8px;
	right: 5%;
	top: calc(76px + 15vh);
	background: var(--clr-primary)
}

.timeline-bottom-row {
	height: 30vh;
	margin-top: 10vh;
	display: flex;
	align-items: center
}

.timeline-right-row {
	position: relative;
	width: 40%;
	height: 8px;
	background: var(--clr-primary)
}

.timeline-right-row>i {
	position: absolute;
	height: 8px;
	width: 45px;
	font-size: 60px;
	bottom: 0;
	top: 0;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	margin-left: -10px;
	color: var(--clr-primary)
}

.timeline-spacer {
	height: 8px;
	width: 40%
}

.timeline-center-icon {
	width: 20%;
	display: flex;
	align-items: center;
	justify-content: center
}

.timeline-item>img {
	position: absolute;
	height: 64px;
	top: -8px;
	transform: translateY(-100%)
}

.item-dot {
	height: 24px;
	aspect-ratio: 1/1;
	background: var(--clr-primary);
	border-radius: 100px
}

.item-text {
	position: absolute;
	left: 16%;
	right: 16%;
	bottom: -8px;
	transform: translateY(100%);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 8px
}

.item-text>h3 {
	font-weight: 900;
	font-variant: all-small-caps;
	font-size: 2em;
	text-align: center
}

.item-text>p {
	text-align: center
}

.fonctionnement-faq-header-section {
	height: fit-content;
	padding: 80px 5%;
	color: #FFFFFF;
	background: var(--clr-nav)
}

.fonctionnement-faq-content-section {
	height: fit-content;
	padding: 80px 5%;
	display: flex;
	flex-direction: column;
	column-gap: 48px
}

.fonctionnement-faq-content-section>h2 {
	font-size: 2rem;
	font-weight: 600;
	margin-bottom: 32px
}

.fonctionnement-faq-content-section>.faq-col-container {
	width: 100%;
	display: flex;
	column-gap: 24px;
	margin-bottom: 48px
}

.faq-col-container>.faq-col {
	height: fit-content;
	width: 50%;
	display: flex;
	flex-direction: column;
	row-gap: 24px
}

.faq-col>.faq-question-row {
	display: flex;
	flex-direction: column
}

.faq-question-row>.faq-question {
	display: flex;
	align-items: center;
	justify-content: space-between;
	font-size: 1.2rem;
	font-weight: 500;
	border-bottom: 1px solid var(--clr-border)
}

.faq-question-row>.faq-response {
	padding: 16px;
	display: none;
	font-size: 1.2rem;
	border-bottom-left-radius: 8px;
	border-bottom-right-radius: 8px;
	background: rgba(0, 0, 0, .05)
}

.actualites-section {
	height: fit-content;
	padding: 80px 5%
}

.actualites-container {
	display: grid;
	grid-template-columns: repeat(4, minmax(280px, 1fr));
	grid-gap: 40px
}

.actualites-card {
	padding: 16px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 16px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px
}

.actualites-card>img {
	border-radius: 8px;
	object-fit: cover;
	aspect-ratio: 4/3
}

.actualites-card>.actualites-card-header {
	margin-top: 16px
}

.actualites-card-header>h2 {
	font-size: 1.4em !important;
	font-weight: 600
}

.actualites-card>.actualites-card-body {
	margin-top: 8px
}

.actualites-card>.actualites-card-footer {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: flex-end
}

.actualites-card-footer>.btn {
	width: 50%;
	font-size: 1rem;
	font-weight: 600
}

.actualites-infos-section {
	height: fit-content;
	padding: 80px 5%
}

.actualites-infos-content {
	display: flex;
	column-gap: 40px
}

.actualites-infos-content>.actualites-infos-col.img-col {
	width: 480px;
	flex-shrink: 0
}

.actualites-infos-col.img-col>img {
	border-radius: 8px;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	aspect-ratio: 4/3;
	object-fit: cover;
	background: #FFFFFF
}

.actualites-infos-content>.actualites-infos-col.text-col {
	width: -webkit-fill-available;
	display: flex;
	align-items: center
}

.actualites-infos-col p {
	font-size: 1rem;
	text-align: justify
}

.actualites-infos-col a {
	color: var(--clr-primary);
	text-decoration: none
}

.actualites-infos-btns {
	height: fit-content;
	padding: 0 5%;
	padding-bottom: 80px
}

.actualites-infos-btns>.btn {
	font-size: 1.4em;
	font-weight: 600
}

.backofficeAddJobForm {
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.cgu-section,
.legal-section,
.personnal-data-section {
	height: fit-content;
	padding: 80px 5%
}

.cgu-section>h2,
.legal-section>h2,
.personnal-data-section>h2 {
	margin: 24px 0;
	font-size: 2rem
}

.cgu-section>p,
.cgu-section>i,
.legal-section>p,
.legal-section>i,
.personnal-data-section>p,
.personnal-data-section>i {
	margin-bottom: 16px
}

.chatbot {
	position: fixed;
	right: 40px;
	bottom: 40px;
	z-index: 100
}

.chatbot>.chatbot-btn-picto {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px
}

.chatbot-btn-picto>.chatbot-btn,
.chatbot-btn-picto>a {
	height: 64px;
	width: 64px;
	padding: 16px;
	display: flex;
	column-gap: 8px;
	align-items: center;
	justify-content: center;
	border: none;
	border-radius: 1000px;
	font-weight: 500;
	text-decoration: none;
	color: #FFFFFF;
	box-shadow: rgba(0, 0, 0, .19) 0 10px 20px, rgba(0, 0, 0, .23) 0 6px 6px;
	background: var(--clr-primary)
}

.chatbot-btn-picto>a {
	width: fit-content
}

.chatbot-btn>i,
.chatbot-btn-picto>a>i {
	font-size: 1.4rem
}

.chatbot-btn-picto>a>i {
	display: none
}

.chatbot-btn-picto>a>span {
	display: inline
}

.chatbot>.chatbot-window {
	height: 550px;
	width: 400px;
	max-width: 100%;
	display: flex;
	flex-direction: column;
	border-radius: 16px;
	background: var(--clr-body);
	box-shadow: rgba(0, 0, 0, .19) 0 10px 20px, rgba(0, 0, 0, .23) 0 6px 6px;
	overflow: hidden;
	pointer-events: all
}

.chatbot-window>.chatbot-header {
	height: 80px;
	padding: 16px;
	display: flex;
	align-items: center;
	column-gap: 16px;
	background: var(--clr-primary);
	box-shadow: rgba(0, 0, 0, .1) 0 4px 6px -1px, rgba(0, 0, 0, .06) 0 2px 4px -1px;
	z-index: 1
}

.chatbot-header>.chatbot-header-avatar {
	height: 100%;
	border-radius: 1000px;
	aspect-ratio: 1/1
}

.chatbot-header>.chatbot-header-title {
	font-size: 1.2rem;
	font-weight: 600;
	color: #FFFFFF
}

.chatbot-header>.chatbot-header-btns {
	margin-left: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px
}

.chatbot-header-btns>.btn {
	font-size: 1.1rem
}

.chatbot-window>.chatbot-body {
	flex: 1;
	padding: 8px 16px;
	display: flex;
	flex-direction: column;
	row-gap: 8px;
	overflow-y: scroll
}

.chatbot-body>.chatbot-message {
	display: flex;
	flex-direction: column;
	row-gap: 4px
}

.chatbot-message>span,
.chatbot-message>.chatbot-unavailable-response {
	height: fit-content;
	width: fit-content;
	padding: 12px;
	flex-shrink: 0;
	display: block;
	border-radius: 16px;
	font-weight: 500
}

.chatbot-message.question>span {
	margin-left: auto;
	font-weight: 700;
	border: 2px solid var(--clr-primary);
	color: var(--clr-primary);
	cursor: pointer
}

.chatbot-message.bot>span,
.chatbot-message.bot>.chatbot-unavailable-response {
	margin-right: auto;
	background: rgba(0, 0, 0, .04)
}

.chatbot-message.customer>span {
	margin-left: auto;
	background: var(--clr-primary);
	color: #FFFFFF
}

.chatbot-unavailable-response>span {
	margin-bottom: 8px;
	display: block
}

.chatbot-unavailable-response>.chatbot-unavailable-row {
	column-gap: 0
}

.chatbot-unavailable-row>input {
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
	border: none
}

.chatbot-unavailable-row>button {
	border-top-left-radius: 0;
	border-bottom-left-radius: 0
}

.chatbot-window>.chatbot-footer {
	height: 80px;
	padding: 8px;
	display: flex;
	border-top: 1px solid rgba(0, 0, 0, .2)
}

.chatbot-footer>.form-control {
	border-radius: var(--border-radius-s) 0 0 var(--border-radius-s)
}

.chatbot-footer>.btn {
	height: 100%;
	border-radius: 0 var(--border-radius-s) var(--border-radius-s) 0;
	aspect-ratio: 1/1
}

.main-footer {
	height: fit-content;
	padding: 48px 5%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	background-color: var(--clr-header)
}

.main-footer.desktop-footer {
	display: inherit
}

.main-footer.mobile-footer {
	display: hide
}

.main-footer>.main-footer-col {
	height: 100%;
	width: 100%;
	margin-bottom: 40px;
	display: flex;
	justify-content: center;
	column-gap: 120px
}

.main-footer>.main-footer-row {
	width: 100%;
	padding-top: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: 8px;
	border-top: 1px solid rgb(80 80 80)
}

.footer-col {
	width: 100%;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	color: var(--clr-body)
}

.footer-col.inline {
	flex: 1;
	flex-direction: row;
	align-items: center;
	row-gap: 8px
}

.footer-row {
	display: flex;
	column-gap: 16px
}

.footer-row.footer-row-center {
	justify-content: center
}

.footer-row.space-top {
	margin-top: 10px
}

.footer-col.footer-logo-col {
	width: 70%;
	max-width: 255px;
	justify-content: center
}

.footer-row.footer-row-header {
	align-items: center
}

.footer-row.footer-row-header>img {
	width: 100%
}

.footer-row.footer-row-header>h3 {
	color: var(--clr-body)
}

.footer-social {
	height: 48px;
	width: 48px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	font-size: 1.4rem;
	text-decoration: none;
	color: #FFFFFF
}

.footer-social:hover {
	color: #FFFFFF
}

.footer-social.facebook {
	background-color: #1B4195
}

.footer-social.linkedin {
	background-color: #0F72AA
}

.footer-social.instagram {
	background-color: #E1306C
}

.footer-social.tiktok {
	background-color: #000000
}

.footer-link,
.footer-text {
	color: #FFFFFF;
	text-decoration: none;
	font-weight: 600;
	font-size: 1rem;
	margin-bottom: 8px;
}

.footer-link:hover {
	color: var(--clr-primary)
}

.main-footer-row>.footer-link,
.main-footer-row>.footer-text {
	color: white
}

.main-footer-row>.footer-link:hover {
	color: var(--clr-primary)
}

.main-footer-row>.footer-link:not(:last-child)::after {
	content: '|';
	margin-left: 8px;
	color: white !important
}

.unknown-page-container {
	position: absolute;
	height: 100vh;
	width: 100%;
	top: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	row-gap: 40px;
	background-color: var(--clr-body);
	z-index: 9999999
}

.unknown-page-container>.unknown-page-content {
	height: 100%;
	width: 100%;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 40px
}

.unknown-page-content>img {
	height: 50%
}

.unknown-page-content>a {
	font-size: 1.6rem;
	text-decoration: none;
	color: var(--clr-primary);
	display: flex;
	align-items: center;
	column-gap: 8px
}

body:has(.login-form) {
	padding: 0
}

body:has(.login-form) .header,
body:has(.login-form) .chatbot,
body:has(.login-form) .main-footer {
	display: none
}

.login-section {
	position: relative;
	height: 100vh;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background: url(../img/find-center-bck.webp);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center
}

.login-background {
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: rgba(0, 0, 0, .5);
	backdrop-filter: blur(6px);
	-webkit-backdrop-filter: blur(6px);
	filter: grayscale(100%)
}

.login-logo {
	position: absolute;
	padding: 20px;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	z-index: 1
}

.login-logo>img {
	height: 3em
}

.login-form {
	height: 50%;
	width: 448px;
	padding: 40px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	border-radius: 8px;
	z-index: 2;
	background: var(--clr-nav);
	box-shadow: rgba(0, 0, 0, .25) 0 14px 28px, rgba(0, 0, 0, .22) 0 10px 10px
}

.login-form>.form-title {
	color: #FFFFFF;
	border-bottom: 1px solid rgba(255, 255, 255, .1)
}

.login-form>.login-form-contents {
	width: 100%;
	margin-top: 16px
}

.login-form-contents>.form-label {
	margin-top: 8px;
	color: #FFFFFF
}

.login-form>.login-form-contents:last-of-type {
	margin-top: auto
}

.login-form-contents>input,
.login-form-contents>.btn {
	padding: 16px
}

.login-form-contents>.btn>i,
.login-form-contents>.btn>span {
	font-size: 1.2rem !important;
	font-weight: 800
}

body:has(.backoffice-section) {
	padding: 0
}

body:has(.backoffice-section) .header,
body:has(.backoffice-section) .main-footer,
body:has(.backoffice-section) .chatbot {
	display: none
}

.backoffice-header {
	height: 80px;
	padding: 0 20px;
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 32px;
	background: var(--clr-header)
}

.backoffice-header>img {
	height: 3em
}

.backoffice-header>h1 {
	color: #FFFFFF;
	font-variant: all-small-caps
}

.backoffice-section {
	height: calc(100vh - 80px);
	padding: 16px;
	display: flex;
	align-items: center;
	column-gap: 16px
}

.backoffice-section>.backoffice-side-menu {
	height: 100%;
	padding: 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 8px;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px
}

.backoffice-btn-menu,
.backoffice-btn-menu-dropdown {
	font-size: 1.2rem;
	color: #222222;
	aspect-ratio: 1/1
}

.backoffice-btn-menu-dropdown {
	position: relative !important;
	overflow: inherit !important
}

.backoffice-btn-menu-dropdown-body {
	min-width: 200px;
	padding: 16px;
	position: absolute;
	right: -8px;
	transform: translateX(100%);
	background: white;
	display: flex;
	flex-direction: column;
	row-gap: 8px;
	border-radius: 8px;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px
}

.backoffice-btn-menu-dropdown-body>.btn {
	width: 100%
}

.backoffice-side-menu>.btn>i,
.backoffice-btn-menu-dropdown-body>.btn>* {
	pointer-events: none;
	margin: 0 !important
}

.backoffice-side-menu>.backoffice-btn-bottom {
	margin-top: auto
}

.backoffice-section>.backoffice-content {
	height: 100%;
	width: 100%;
	padding: 24px;
	border-radius: 8px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	overflow: auto
}

.backoffice-content-section {
	display: flex;
	flex-direction: column;
	row-gap: 24px
}

.backoffice-content-section.height-full {
	height: 100%;
	overflow: hidden
}

.backoffice-content-section>h1 {
	display: flex;
	align-items: center;
	column-gap: 16px
}

.backoffice-content-section>h1>button>i,
.backoffice-content-section>h1>.btn>i {
	font-size: 1rem
}

.backoffice-content-section>.backoffice-img-carousel-container,
.backoffice-content-section>.backoffice-img-carousel-rdv-container {
	height: 100%;
	margin-bottom: 16px;
	overflow: auto;
	display: flex;
	column-gap: 24px
}

.backoffice-img-carousel-container>.backoffice-img-carousel-content {
	width: calc(100% / 2);
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.backoffice-img-carousel-content>h2 {
	display: flex;
	align-items: center;
	column-gap: 16px
}

.backoffice-img-carousel-content>h2>button>i {
	font-size: 1rem
}

.backoffice-img-carousel-content>h2>.backoffice-img-carousel-switch {
	display: flex;
	flex-direction: row;
	column-gap: 8px;
	align-items: center
}

.backoffice-img-carousel-content>.backoffice-home-img,
.backoffice-img-carousel-content>.backoffice-home-mobile-img,
.backoffice-img-carousel-content>.backoffice-home-rdv-mobile-img {
	height: 100%;
	display: grid;
	grid-template-columns: repeat(2, minmax(150px, 1fr));
	grid-template-rows: max-content;
	grid-gap: 16px;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid rgba(0, 0, 0, .1);
	align-items: start
}

.backoffice-home-img>.backoffice-carousel-img,
.backoffice-home-mobile-img>.backoffice-carousel-img,
.backoffice-home-rdv-mobile-img>.backoffice-carousel-img {
	position: relative;
	display: flex;
	flex-direction: column;
	border-radius: 8px;
	overflow: hidden;
	transition: transform .15s
}

.backoffice-carousel-img-detail {
	flex: 1;
	width: 100%;
	padding: 8px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	color: #000000;
	font-size: .9rem;
	font-weight: 700;
	background: rgba(0, 0, 0, .1)
}

.backoffice-carousel-order {
	position: absolute;
	top: 8px;
	left: 8px;
	display: flex;
	column-gap: 8px;
	align-items: center
}

.backoffice-carousel-order>span {
	font-size: 1.2rem;
	font-weight: 600;
	color: white;
	text-shadow: 0 0 3px black
}

.backoffice-carousel-img:hover>.backoffice-carousel-img-btns {
	display: flex;
	column-gap: 8px
}

.backoffice-carousel-img>.backoffice-carousel-img-btns {
	position: absolute;
	height: 100%;
	width: 100%;
	top: 0;
	left: 0;
	padding: 8px;
	display: none;
	align-items: flex-end;
	justify-content: flex-end;
	background-color: rgba(0, 0, 0, .5)
}

#modalEditCarouselImgCurrentName {
	display: block;
	margin-top: 8px;
	font-weight: 700
}

.backoffice-section-text-body {
	height: 100%;
	display: flex;
	column-gap: 16px;
	overflow: hidden
}

.backoffice-section-text-menu {
	flex-shrink: 0;
	height: 100%;
	min-width: 250px;
	padding: 16px;
	display: flex;
	flex-direction: column;
	row-gap: 8px;
	border-radius: 8px;
	border: 1px solid var(--bs-gray-200);
	overflow: auto
}

.backoffice-section-text-menu>.backoffice-section-text-menu-header {
	font-size: 1.2rem;
	font-weight: 600
}

.backoffice-section-text-menu-body {
	width: 100%;
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.backoffice-section-text-menu-body>button {
	flex: 1;
	width: 100%
}

.backoffice-section-text-editor {
	width: 100%;
	border-radius: 8px;
	border: 1px solid var(--bs-gray-200)
}

.backoffice-categories-blog-grid {}

.modal-add-offre-container {
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.backoffice-offres-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 24px
}

.backoffice-offer-card {}

.backoffice-offer-card-content {
	position: relative;
	height: 100%;
	width: 100%;
	padding: 24px;
	display: flex;
	flex-direction: row;
	column-gap: 40px;
	border-radius: 16px;
	background: #FFFFFF;
	box-shadow: rgba(17, 17, 26, .05) 0 1px 0, rgba(17, 17, 26, .1) 0 0 8px;
	overflow-y: clip
}

.backoffice-offer-card-number {
	height: 100%;
	font-size: 7rem;
	line-height: 7rem;
	font-family: 'Montserrat', sans-serif;
	font-weight: 700
}

.backoffice-offer-card-texte {
	width: 100%;
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.backoffice-offer-card-texte>.backoffice-offer-card-title {
	display: flex;
	align-items: center;
	column-gap: 16px
}

.backoffice-offer-card-title>i,
.backoffice-offer-card-title>span {
	font-size: 1.6rem
}

.backoffice-offer-btn-container {
	margin-top: auto;
	display: flex;
	justify-content: flex-end;
	column-gap: 8px
}

.backoffice-news-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 24px
}

.backoffice-actu-card {
	min-height: 570px;
	display: flex;
	flex-direction: column;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid rgba(0, 0, 0, .06);
	box-shadow: rgba(149, 157, 165, .2) 0 8px 24px;
	transition: transform .15s
}

.backoffice-actu-card>.backoffice-btn-actu-card {
	margin: auto;
	height: 64px;
	width: 50%;
	font-size: 1.6rem;
	font-weight: 600
}

.backoffice-actu-card:hover {
	transform: scale(1.01);
	transition: transform .15s
}

.backoffice-actu-card>.backoffice-actu-img {
	border-radius: 8px;
	object-fit: cover;
	aspect-ratio: 4/3
}

.backoffice-actu-card>.backoffice-actu-header {
	margin-top: 16px;
	display: flex;
	align-items: center
}

.backoffice-actu-header>h3 {
	font-size: 2rem;
	font-weight: 600
}

.backoffice-actu-header>.backoffice-actu-header-date {
	margin-left: auto;
	flex-shrink: 0;
	display: flex;
	flex-direction: column;
	align-items: flex-end
}

.backoffice-actu-header-date>i {
	margin-left: 8px;
	font-size: .9rem;
	font-weight: 400;
	color: rgba(0, 0, 0, .4)
}

.backoffice-actu-card>.backoffice-actu-body {
	margin: 16px 0
}

.backoffice-actu-body>.backoffice-preview-content {
	display: -webkit-box;
	-webkit-line-clamp: 5;
	line-clamp: 5;
	-webkit-box-orient: vertical;
	text-align: justify;
	overflow: hidden
}

.backofficeActuEditImage {
	position: relative;
	height: 300px
}

.backofficeActuEditImage>img {
	height: 100%;
	border-radius: 8px;
	object-fit: cover;
	aspect-ratio: 4/3
}

.backofficeActuEditImage>.backofficeActuEditImageOptions {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	padding: 16px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	row-gap: 8px;
	border-radius: 8px;
	opacity: 0;
	background: rgba(0, 0, 0, .4);
	pointer-events: none;
	backdrop-filter: blur(8px);
	transition: opacity .15s
}

.backofficeActuEditImage:hover>.backofficeActuEditImageOptions {
	opacity: 1;
	pointer-events: all;
	transition: opacity .15s
}

.backofficeActuEditImageOptions>.btn {
	width: 50%
}

.backoffice-actu-card>.backoffice-actu-footer {
	display: flex;
	column-gap: 8px;
	margin-top: auto;
	justify-content: flex-end
}

.backofficeEditActuForm {
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.backoffice-jobs-grid {
	position: relative;
	height: fit-content;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-auto-rows: min-content;
	grid-gap: 16px
}

.backoffice-jobs-grid>.job-card {
	padding: 24px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 8px;
	background: #FFFFFF;
	border: 1px solid rgba(0, 0, 0, .06);
	box-shadow: rgba(149, 157, 165, .2) 0 8px 24px;
	z-index: 1;
	transition: transform .15s
}

.backoffice-jobs-grid>.job-card:hover {
	transform: scale(1.01);
	transition: transform .15s
}

.backofficeModalHoraireContainer {
	margin-top: 16px;
	display: grid;
	grid-template-columns: repeat(2, minmax(150px, 1fr));
	grid-gap: 16px
}

.backofficeModalHoraireContainer>.backofficeModalHoraire {
	padding: 16px;
	border-radius: var(--border-radius-s);
	background-color: rgba(0, 0, 0, .04)
}

.backofficeModalHoraire>.backofficeModalHoraireHalfDay {
	display: flex;
	flex-direction: row;
	column-gap: 16px;
	width: 100%
}

.backofficeModalHoraireHalfDay>.backofficeModalHoraireMorning,
.backofficeModalHoraireHalfDay>.backofficeModalHoraireAfternoon {
	flex: 1
}

.backofficeModalHoraireMorning>label,
.backofficeModalHoraireAfternoon>label {
	font: .9rem
}

.modalCentreImageTitle {
	display: flex;
	align-items: center;
	column-gap: 8px
}

.modalCentreImagesContainer {
	margin-top: 16px;
	max-height: 60vh;
	display: grid;
	grid-template-columns: repeat(4, minmax(10px, 1fr));
	grid-auto-rows: 150px;
	grid-gap: 16px;
	overflow: auto
}

.modalCentreImagesContainer>.modalCentreImage {
	position: relative;
	border-radius: 8px;
	overflow: hidden
}

.modalCentreImage>img {
	height: 100%;
	width: 100%;
	border-radius: 8px;
	object-fit: contain
}

.modalCentreImage>.modalCentreImgOption {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 0;
	pointer-events: none;
	background: rgba(0, 0, 0, .4)
}

.modalCentreImage:hover>.modalCentreImgOption {
	opacity: 1;
	pointer-events: all
}

div#kdoListBody {
	display: grid;
	grid-template-columns: repeat(5, auto);
	grid-auto-rows: 300px;
	grid-gap: 16px
}

.backoffice-kdo-item {
	height: 100%;
	width: 100%;
	padding: 8px;
	display: flex;
	flex-direction: column;
	row-gap: 8px;
	border-radius: 8px;
	border: 1px solid rgba(0, 0, 0, .06);
	box-shadow: rgba(149, 157, 165, .2) 0 8px 24px
}

.backoffice-kdo-item-header {
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between
}

.backoffice-kdo-item-header>span {
	font-size: 1.2rem !important;
	font-weight: 600
}

.backoffice-kdo-item-header>.backoffice-kdo-item-header-actif {
	height: 100%;
	display: flex;
	flex-direction: row;
	align-items: center;
	column-gap: 8px
}

.backoffice-kdo-item-body {
	height: 200px;
	width: 100%;
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 1/1
}

.backoffice-kdo-item-body>img {
	height: 100%;
	display: block
}

.backoffice-kdo-item-footer {
	display: flex;
	justify-content: flex-end;
	column-gap: 8px
}

.rendez-vous-confirme-container {
	height: 70vh !important;
	padding: var(--space-l);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: auto
}

.rendez-vous-confirme-header {
	display: flex;
	align-items: center;
	justify-content: center;
	column-gap: var(--space-l)
}

.rendez-vous-confirme-header-logo {
	font-size: 5rem;
	color: var(--clr-detail)
}

.rendez-vous-confirme-header-text {
	display: flex;
	flex-direction: column
}

.rendez-vous-confirme-header-text>span:nth-child(1) {
	font-size: 2rem;
	font-weight: 500
}

.rendez-vous-confirme-header-text>span:nth-child(2) {
	font-size: 2rem;
	font-weight: 700
}

.rendez-vous-confime-body {
	max-width: 450px;
	margin-top: var(--space-l);
	padding: var(--space-m);
	display: flex;
	flex-direction: column;
	align-items: center;
	text-align: center;
	border-radius: 8px;
	background: rgba(0, 0, 0, .05)
}

.rendez-vous-confime-body>.rendez-vous-confime-customer {
	font-size: 1.5rem;
	font-weight: 500
}

.rendez-vous-confime-body>.rendez-vous-confime-thanks {
	font-size: 2rem;
	font-weight: 700
}

.rendez-vous-confime-body>.rendez-vous-confime-text {
	margin-top: var(--space-m);
	font-size: 1rem;
	font-weight: 500
}

.rendez-vous-confirme-footer {
	width: 100%;
	max-width: 450px;
	margin-top: var(--space-l);
	display: flex
}

.rendez-vous-confirme-footer>.btn {
	flex: 1
}

.text-edition-box {
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.backoffice-articles-body {
	display: flex;
	flex-direction: column;
	row-gap: 16px
}

.backoffice-articles-header {
	display: flex;
	flex-direction: row;
	align-items: center
}

.backoffice-articles-grid {
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-gap: 16px
}

.articles-cards-container {
	padding: 32px;
	display: grid;
	grid-template-columns: repeat(auto-fit, 320px);
	gap: 32px
}

.article-card {
	height: 100%;
	width: 100%;
	padding: 16px;
	display: flex;
	flex-direction: column;
	row-gap: 16px;
	border-radius: 16px;
	background: linear-gradient(90deg, #131313 10%, #474747 50%, #131313 90%);
	aspect-ratio: 9/10
}

.article-card.inactif {
	opacity: .7
}

.article-card-header {
	display: flex;
	align-items: center;
	justify-content: center
}

.article-card-header>.article-card-header-icon {
	height: 80px;
	padding: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 500px;
	font-size: 1.8rem;
	background: white;
	color: var(--clr-primary);
	aspect-ratio: 1/1
}

.article-card-header-icon>img {
	width: 60%
}

.article-card-body {
	width: 100%;
	display: flex;
	flex-direction: column;
	row-gap: 8px
}

.article-card-body>h3 {
	width: 100%;
	color: white;
	text-transform: uppercase;
	font-size: 1.2rem;
	text-align: center
}

.article-card-body>.article-card-hr {
	height: 2px;
	border: none;
	background: linear-gradient(90deg, #000000 0%, #FFFFFF 33%, #FFFFFF 66%, #000000 100%)
}

.article-card-body>p {
	width: 100%;
	display: -webkit-box;
	-webkit-line-clamp: 4;
	-webkit-box-orient: vertical;
	overflow: hidden;
	color: white
}

.article-card-footer {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	column-gap: 8px
}

.pagesContainer {
	padding: 32px;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-gap: 10px
}