/*
Theme Name: Metanature
Theme URI: https://orvalis.fr
Description: 100% fait main
Author: Orvalis
Author url: https://orvalis.fr
Tags: one-column, right-sidebar, left-sidebar, custom-header, custom-menu, featured-images, featured-image-header, full-width-template, flexible-header, theme-options, sticky-post, threaded-comments, translation-ready, rtl-language-support, custom-background
*/
@import url("https://use.typekit.net/qgp2wxx.css");
@font-face {
	font-family: body-font;
	font-style: normal;
	font-weight: normal;
	src: url('../../../themes/metanature/fonts/ITCKabelStdMedium.TTF') format('truetype');
}
@font-face {
	font-family: 'Kabel Book BT';
}
@font-face {
	font-family: headfontThin;
	src: url(../../../themes/metanature/fonts/YanoneKaffeesatz-Thin.otf);
	font-weight: 400;
}
@font-face {
	font-family: headfontBold;
	src: url('../../../themes/metanature/fonts/ITCKabelStdMedium.TTF') format('truetype');
	letter-spacing: 0.03em;
}
:root {
	--color-high: #17E65B;
	--color-green: #7FB128;
	--color-green-ultra-light: #E8F7CF;
	/*--color-grey: #95817B;*/
	--color-grey: #634E42;
	--color-grey-medium: #999;
	--color-grey-dark: #282828;
	--color-green-medium: #008226;
	/*--color-green-dark: #00220A;*/
	--color-beige: #E2E5D4;
	--color-green-dark: #527219;
	--color-grey-light: #E6E6E6;
	--color-blue: #66CEFE;
	--gap: 16px;
	--wrap: 90%;
	--font-size: 16px;
	--body-font: body-font;
	--title-font: headfontBold;
}
* {
	position: relative;
	box-sizing: border-box;
}
@media only screen and (min-width: 600px) {
	:root {
		--wrap: 90%;
	}
}
@media only screen and (min-width: 768px) {
	:root {
		--wrap: 90%;
		--font-size: 16px;
	}
}
@media only screen and (min-width: 1024px) {
	:root {
		--gap: 20px;
		--wrap: 950px;
	}
	body {
		/*font-size: 18px;*/
	}
}
@media only screen and (min-width: 1280px) {
	:root {
		--gap: 24px;
		--wrap: 1188px;
		/*--font-size: 20px;*/
	}
}
@media only screen and (min-width: 1600px) {
	:root {
		--gap: 30px;
		--wrap: 1364px;
		/*--font-size: 20px;*/
	}
}
body {
	font-size: var(--font-size);
	font-family: var(--body-font);
	padding: 0;
	scroll-behavior: smooth;
	font-family: 'Montserrat', sans-serif;
	line-height: 1.75em;
	color: #000;
	font-weight: 300;
	font-style: normal;
	line-height: 1.6em;
}
h1, h2, h3, h4, h5, h6 {
	font-family: headfontBold;
	line-height: normal;
	letter-spacing: 0.02em;
}
h1 {
	margin-top: 0;
	font-weight: normal;
}
h2 {
	font-size: 1.8em;
	line-height: 1;
	color: var(--color-grey);
	font-weight: normal;
	
}
@media (min-width: 768px) {
	h1 {
		font-size: 2.4em;
		color: var(--color-grey);
	}
	h3 {
		font-size: 1.2em;
	}
}
@media (min-width: 1024px) {
	h1 {
		font-size: 3.2em;
	}
	h2 {
		font-size: 2.4em;
	}
	h3 {
		font-size: 1.8em;
		font-weight: normal;
		line-height: 1.3;
	}
}
ul {
	padding: 0;
}
p a, footer#colophon a {
	color: var(--color-green);
}
.entry-content {
	display: flex;
	flex-direction: column;
}

/*--------------------------------------------------------------
# Elements
--------------------------------------------------------------*/
/* Increase font size on article "lead" (usually for an "intro" paragraph */
.lead {
	font-size: 22px; /*18px, but goes to 24px @768 browser width */
}
/* Style code tag like pre tag */
code {
	/*color: #2f2f2f;
background-color: #f5f5f5; Moved to bootstrap.css*/
	border: 1px solid #ccc;
}
/* Remove a bit of margin since Bootstrap h1-h3 tags already have 22px top margin */
hr {
	margin: 16px 0; /*22px 0;*/
}
/*
* Override margins on jumbotron in case someone uses it like a colored "section" from
* this theme. Note: Moved here from theme-base.css.
*/
.jumbotron {
	margin-bottom: 0;
}
/* 
* Set block quote footer (author) to larger font size. BS quote is 20px, but footer
* is only 14px for some reason. 
*/
blockquote footer {
	font-size: 18px;
}
.col-md-8 {
	width: 100% !important;
}
/* Color the collapsible panel hover color to match the link hover color */
.panel-title > a:hover, .panel-title > small:hover, .panel-title > .small:hover, .panel-title > small > a:hover, .panel-title > .small > a:hover {
	color: #19b798;
}
/*--------------------------------------------------------------
# Forms and Buttons
--------------------------------------------------------------*/
/* Tone down field labels on forms, comments section, etc. */
label {
	font-weight: 300;
}
/* Match the default font color */
.form-control {
	color: #555;
}
/* 
* Generically set input buttons to look like Bootstrap, but set colors below that to make
* it easier for users to override. Match Bootstrap btn-primary styles.
*/
/*
button,
html input[type="button"],
input[type="submit"] {
color: #fff;
background-color: var(--color-green);
border-color:  var(--color-green);
width: fit-content;
margin-left: auto;
margin-right: auto;
border-radius: calc(0.25*var(--gap));
}

button:hover, 
button:focus,
html input[type="button"]:hover, 
html input[type="button"]:focus,
input[type="submit"]:hover, 
input[type="submit"]:focus {
outline: 0;
color: #fff;
background-color: #16a085;
border-color: #16a085;	
}

*/
input {
	border: thin solid #FFF;
	background-color: transparent;
	padding: calc(0.25*var(--gap));
	width: 100%;
	border-radius: calc(0.25*var(--gap));
	color: var(--color-green);
}
::placeholder {
	color: var(--color-grey-medium);
}
input:focus, input:active {
	border: thin solid var(--color-green) !important;
}
/* Bootstrap uses "active" style on the <li>, but WordPress paginate_links() uses 
* "current" in a <span> tag on the link. Also set the hover to match the primary button
* color. 
*/
.pagination > li > a, .pagination > li > span, span.page-numbers.current {
	color: #16a085;
}
.pagination > li > a:hover, .pagination > li > span:hover, .pagination > li > a:focus, .pagination > li > span:focus, span.page-numbers.current {
	z-index: 2;
	color: #fff;
	background-color: #16a085;
	border-color: #16a085;
}
/* Force search field to not be rounded on iOS devices */
input.search-field {
	-webkit-appearance: none !important;
	-webkit-border-radius: 0 !important;
	-moz-border-radius: 0 !important;
	border-radius: 0 !important;
}
/*--------------------------------------------------------------
# Navigation
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Links
--------------------------------------------------------------*/
/*
* Generically style the links here. Set colors below to make it easier for users to 
* override.
*/
a {
	word-wrap: break-word;
	-webkit-transition: color .1s ease-in, background .1s ease-in;
	-moz-transition: color .1s ease-in, background .1s ease-in;
	-ms-transition: color .1s ease-in, background .1s ease-in;
	-o-transition: color .1s ease-in, background .1s ease-in;
	transition: color .1s ease-in, background .1s ease-in;
	color: inherit;
}
a:hover, a:focus {
	text-decoration: none;
	outline: 0;
}
a:before, a:after, a:hover i:before, a:focus i:before {
	-webkit-transition: color .1s ease-in, background .1s ease-in;
	-moz-transition: color .1s ease-in, background .1s ease-in;
	-ms-transition: color .1s ease-in, background .1s ease-in;
	-o-transition: color .1s ease-in, background .1s ease-in;
	transition: color .1s ease-in, background .1s ease-in;
}
.fullwidth, figure.fullwidth img {
	width: 100vw;
	margin: 0;
}
.wrap {
	width: 100%;
	max-width: var(--wrap) !important;
	margin-left: auto !important;
	margin-right: auto !important;
}
/*--------------------------------------------------------------
## Menus
--------------------------------------------------------------*/
/* Since we lightened the body font, make the site title regular font weight */
.navbar-brand {
	font-weight: 500;
	/*height: 50px; BS already 50px*/ /* Fixes layout if nav bar wraps before collapsing for mobile */
}
/* 
* Line up the navbar with the header and page content (it's in a container, but not a
* row) 
*/
.nav-menu {
	height: 0;
	opacity: 0;
	left: 0;
	top: 0;
	position: fixed;
	background-color: var(--color-bg-body);
	width: 100vw;
	padding-top: var(--gap);
	transition: all 0.4s ease;
	overflow: hidden;
}
.navbar-header button {
	position: fixed;
	right: calc( calc(calc(100vw - var(--wrap)))/2);
	top: var(--gap);
	padding: 10px;
	border: none;
	height: 60px;
	width: 60px;
	font-size: 1.5em;
	z-index: 10000;
	cursor: pointer;
}
.nav-menu.toggled-on {
	opacity: 1;
	top: 0;
	height: 100vh;
	background: linear-gradient(75deg, var(--color-grey-dark), var(--color-green-ultra-light));
	z-index: 9999;
	padding: var(--gap) var(--gap) calc(var(--gap)*2) var(--gap);
	color: #FFF;
}
#menu-main-menu-container > div.wrap {
	height: 100%;
	display: flex;
	flex-direction: column;
	padding: 0;
	margin: 0;
	max-width: none;
}
.nav-menu .contact {
	background-color: var(--color-yellow);
}
#menu-main-menu-container > div.wrap > * {
	height: 100%;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
}
header .menu-main-menu-container {
	padding: var(--gap);
}
header .menu-main-menu-container ul, .nav-menu ul {
	display: flex;
	flex-direction: column;
	padding: var(--gap) 0;
	list-style: none;
}
header .nav-menu ul {
    padding: 0;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
header .menu-main-menu-container li, nav li {
	padding: 0;
}
header .menu-main-menu-container li a {
	border-bottom: thin solid var(--color-green-dark);
	display: flex;
	overflow: hidden;
	color: #FFF;
    text-decoration: none;
}
nav .contact .logo {
	width: 90%;
	position: relative;
}
nav .contact h2 {
	color: var(--color-green);
	margin-top: calc(4*var(--gap));
	margin-bottom: 0;
}
header .menu-main-menu-container .nav-menu ul li a {
	display: flex;
	width: 100%;
	text-decoration: none;
	font-size: 1.3em;
	line-height: 1.2em;
	align-items: center;
	height: 100%;
	width: 100%;
	padding: calc(var(--gap)/2);
	transition: all 0.4s ease;
	color: #FFF;
	color: #FFF;
	font-family: headfontBold;
	color: inherit;
	text-decoration: none;
}
.menu-main-menu-container .reseaux ul li a:hover, .nav-menu ul li a:hover {
	color: #FFF;
	background-color: var(--color-green-dark);
}
footer#colophon a:hover {
	color: var(--color-green-ultra-light);
}
button.navbar-toggle {
	color: var(--color-grey);
	border-radius: 20%;
	overflow: hidden;
	background-color: var(--color-yellow);
	/* border: thin solid;
filter: drop-shadow(1px 3px 3px rgb(0 0 0 / 50%));*/
}
button.navbar-toggle span {
	background-image: url(../../../themes/metanature/../../wp-content/themes/metanature/illustration/picto/menu-ouvrir.svg);
	background-repeat: no-repeat;
	background-postion: center;
	background-size: cover;
}
button.navbar-toggle span {
	height: 100%;
	width: 100%;
	display: block;
}
button.navbar-toggle.toggled-on span {
	background-image: url(../../../themes/metanature/../../wp-content/themes/metanature/illustration/picto/menu-fermer.svg);
}
/*--------------------------------------------------------------
# Content
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Header
--------------------------------------------------------------*/
header#masthead {
	z-index: 10;
}
#page, body {
	width: 100vw;
	overflow-x: hidden;
	margin: 0;
}

/* Set content (page title) header to midnight blue */
.content-header {
	background-color: transparent;
	color: #fff;
}
.content-header h1, .content-header h2, .content-header h3 {
	color: #fff;
}
.site-branding .container {
	position: relative;
}
.custom-header-image {
	width: 200px;
	height: auto;
}
.site-branding img {
	width: 100%;
	height: auto;
}
.logo {
	position: absolute;
	top: 30px;
	left: 0px;
}
/*--------------------------------------------------------------
## Footer
--------------------------------------------------------------*/
footer#colophon {
	background: linear-gradient(to bottom, var(--color-green-dark), var(--color-grey-dark));
	color: #FFF;
}
footer#colophon h2 {
	color: var(--color-green);
}
footer#colophon::before {
	content: url("illustrations/herbes_folles.svg");
	display: block;
	width: 100vw;
	height: 20vw;
	aspect-ratio: 5/1;
	position: absolute;
	top: -20vw;
	left: 0;
	background: linear-gradient(to bottom, transparent, var(--color-blue));
}
#colophon figure {
	margin: 0 auto calc(2*var(--gap));
}
#colophon figure img {
	width: 100%;
}
#contact-footer ul {
	list-style: none;
}
.wp-block-columns.reseaux {
	width: fit-content;
	/* display: flex; */
	align-items: center;
	/* justify-content: center; */
	margin: 0 auto calc(var(--gap)* 2);
	flex-direction: row;
}
.wp-block-columns.reseaux:not(.is-not-stacked-on-mobile) > .wp-block-column {
	flex-basis: auto !important;
}
#colophon .wp-block-columns.reseaux figure {
	margin: 0 !important;
	padding: 0;
	width: 90px;
	max-width: 14vw;
}
#colophon .wp-block-columns.reseaux a {
	background-color: transparent;
	transition: all 0.5s ease;
	display: block;
	border: 4px solid;
	border-radius: var(--gap);
}
#colophon .wp-block-columns.reseaux a:hover {
	background-color: var(--color-green-dark);
}
.widget_block li::before, #contact-footer li::before {
	width: 22px;
	height: 22px;
	content: '';
	background-repeat: no-repeat;
	display: block;
	background-size: contain;
	background-position: right;
	float: left;
	margin-right: 4px;
	margin-top: 2px;
}
.widget_block li.adresse::before, #contact-footer li.adresse::before {
	background-image: url("../../../themes/metanature/illustration/picto/picto-contact-adresse.svg");
}
.widget_block li.telephone::before, #contact-footer li.telephone::before {
	background-image: url("../../../themes/metanature/illustration/picto/picto-contact-telephone.svg");
}
.widget_block li.mobile::before, #contact-footer li.mobile::before {
	background-image: url("../../../themes/metanature/illustration/picto/picto-contact-mobile.svg");
}
.widget_block li.email::before, #contact-footer li.email::before {
	background-image: url("../../../themes/metanature/illustration/picto/picto-contact-mail.svg");
}
.widget.widget_nav_menu ul {
	display: flex;
	flex-direction: column;
}
/* Set our footer to "almost" black */
.sidebar-footer {
	background-color: #2f2f2f;
	color: white;
}
.sidebar-footer h1, .sidebar-footer h2, .sidebar-footer h3 {
	color: #fff;
}
#page > footer {
	margin-top: calc(12*var(--gap));
}
#page > footer a {}
/* Set our "after footer" (footer nav menu and site credits) to "not quite" black */
.after-footer {}
/* Set link colors to off white and text to gray for footer and after footer */
.sidebar-footer, /*.after-footer {*/ .footer-nav-menu {
	color: #95a5a6;
}
.sidebar-footer a:not(.btn), .footer-nav-menu a:not(.btn) {
	/*.after-footer a:not(.btn) {*/
	color: #f2f2f2;
}
.sidebar-footer a:hover:not(.btn), .sidebar-footer a:focus:not(.btn), .footer-nav-menu a:hover:not(.btn), .footer-nav-menu a:focus:not(.btn) {
	/*.after-footer a:hover:not(.btn),
.after-footer a:focus:not(.btn) {*/
	color: #3bc492;
}
#site-credits {
	margin: 0 auto;
	width: fit-content;
	text-align: center;
	padding: var(--gap);
}
#site-credits img {
	width: 80px;
}
/*--------------------------------------------------------------
## Posts and pages
--------------------------------------------------------------*/
/* Reduce the size of post entry meta (date, author) */
.entry-meta {
	font-size: 16px;
}
/* Color "sticky" (featured) posts */
.sticky .entry-title:after {
	background-color: #1abc9c;
	color: #fff;
}
/*--------------------------------------------------------------
## Comments
--------------------------------------------------------------*/
/* Reduce the size of comment edit link */
.comment-edit-link {
	font-size: 16px;
}
/*--------------------------------------------------------------
# Media
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Captions and Galleries
--------------------------------------------------------------*/
/*--------------------------------------------------------------
# Widgets and Plugins
--------------------------------------------------------------*/
/*--------------------------------------------------------------
## Widgets
--------------------------------------------------------------*/
/* Get Jetpack Popular Posts Widget to look like other thumbnail posts */
.widgets-list-layout-links {
	float: left !important;
	margin-left: 15px !important;
	/*margin-left: 1.625em !important;*/
}
/*--------------------------------------------------------------
## Plugins
--------------------------------------------------------------*/
/* Format Jetpack contact form with Bootstrap's form-control tag. */
form.contact-form input[type='text'], form.contact-form input[type='email'], form.contact-form textarea {
	display: block;
	width: 98%;
	height: 36px;
	padding: 6px 12px;
	font-size: 16px;
	line-height: 1.428571429;
	color: #a1a1a1;
	background-color: #fff;
	background-image: none;
	border: 1px solid #ccc;
}
form.contact-form input[type='text']:focus, form.contact-form input[type='email']:focus, form.contact-form textarea:focus {
	color: #555;
}
/* RAJOUTS ES */
/*.site-title,
	.site-description {*/
.site-branding {}
.navbar-brand {
	position: relative;
	clip: auto;
}
.site-branding h1, #site-navigation {}
#page > div > .content-header {
	padding-bottom: 0;
}
#page > div > .content-header .container {
	padding-left: 260px;
	min-height: 200px;
	margin: 0 auto;
	position: relative;
}
#page > div > .content-header .container h1 {
	font-size: 1.6em;
	text-align: right;
	position: absolute;
	bottom: 10px;
	width: calc(100% - 270px);
	font-weight: bold;
	max-width: 500px;
	right: 20px;
}
#image_entete .vc_column_container > .vc_column-inner {
	padding: 0;
	min-height: 370px;
}
#image_entete img {
	display: none;
}
#intro {
	/* background-color: #EF5A1E;  */
	z-index: 1;
}
#intro figure {
	margin-bottom: 0;
}
#intro img {
	width: 100%;
	z-index: -2;
}
.wp-block-cover > .wp-block-cover__inner-container {
	text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000, 1px 1px 2px #3b3332, 1px 1px 3px #3b3332, 1px 1px 5px #3b3332, 1px 1px 7px #3b3332, 1px 1px 10px #3b3332, 1px 1px 12px #3b3332, 1px 1px 18px #3b3332;
	font-size: 2em;
	position: absolute;
	max-width: 620px;
	right: 10px;
	bottom: 0;
	line-height: 0.6;
}
.wp-block-cover > .wp-block-cover__inner-container blockquote {
	font-size: 1.4em;
	line-height: 0.8;
}
.wp-block-cover > .wp-block-cover__inner-container blockquote cite {
	font-style: normal;
	font-size: 0.7em;
}
h3 {
	font-size: 20px;
	font-weight: bold;
}
li {
	list-style-position: inside;
}
.container {
	margin: 0 auto;
}
#secondary {
	display: none;
}
.texte {
	padding: 4vw !important;
	margin-bottom: 4vw
}
/* #################################
######## THEME PERSONNALISE ########
################################# */
section {
	margin-top: calc(4*var(--gap));
}
.wp-block-columns {
	gap: var(--gap);
}
.grid-2 > div, .grid-3 > div, .grid-4 > div {
	display: grid;
	gap: var(--gap);
	grid-template-rows: auto;
}
.grid-2 > div {
	grid-template-columns: repeat(2, 1fr);
}
.grid-3 > div {
	grid-template-columns: repeat(3, 1fr);
}
.grid-4 > div {
	grid-template-columns: repeat(4, 1fr);
}
.grid-2 > div > div, .grid-3 > div > div, .grid-4 > div > div {
	display: flex;
	justify-content: center;
}
.intro {
	margin-top: calc(4*var(--gap));
	z-index: 1;
}
header.intro .wp-block-column {
    display: flex;
    flex-direction: column;
    justify-content: center;
}
header.intro p.chapeau {
    margin: 0;
}
#medias .owl-item {
	/*width: 150px;
height: 150px;*/
	aspect-ratio: 1/1;
	border: thin solid var(--color-green);
	overflow: hidden;
}
#medias .owl-item p {
	padding: 0;
}
#medias .owl-carousel .owl-stage-outer {
	width: 99% !important;
}
#medias .owl-carousel .owl-item * {
	border: none !important;
	width: 100%;
	max-height: 100%;
}
#medias .owl-carousel .owl-item a {
	aspect-ratio: 1/1;
	height: 100%;
	width: 100%;
	background-color: #FFF;
	display: flex;
	align-items: center;
	padding: calc(var(--gap)/2);
	cursor: pointer;
}
.owl-prev, .owl-next {
	/*display: none !important;*/
}
#medias .owl-carousel .owl-stage {
	display: flex;
	justify-content: space-between;
	gap: var(--gap);
}
#medias .owl-carousel.owl-drag .owl-item {
	aspect-ratio: 1/1;
}
#medias .owl-carousel.owl-drag .owl-item {
	max-width: var(--wrap);
}
#medias .owl-carousel .owl-item > * {
	display: flex;
	align-items: center;
	padding: 0 !important;
}
.owl-item > div {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 0 !important;
	height: fit-content !important;
	max-height: 500px;
}
.owl-item > div {
	flex-direction: row;
}
/* #################################
### PARTICULARITES DE METANATURE ###
################################# */
#fondements_scientifiques, #bienfaits {
	background-color: var(--color-beige);
	margin: 0;
}
#bienfaits {
	padding: calc(var(--gap)*4) 0;
	background-image: linear-gradient(to bottom, var(--color-beige) 50%, #FFF);
}
#fondements_scientifiques h2 {
	margin: calc(2*var(--gap)) auto;
}
#fondements_scientifiques::before {
	content: url("illustrations/footer.svg");
	display: block;
	width: 100vw;
	height: auto;
}
span.metanature {
	color: var(--color-grey);
	font-weight: 400;
	font-family: headfontBold;
	font-size: 1.1em;
	line-height: 1;
}
span.metanature i {
	color: var(--color-green);
	text-transform: uppercase;
	font-style: normal;
}
span.metanature sup {
	color: var(--color-green);
	font-size: 0.5em;
}
.chapeau {
	max-width: 800px;
	text-align: left;
	margin: calc(2*var(--gap)) auto calc(2*var(--gap)) auto;
}
p.chapeau {
	font-size: 1.4em;
	line-height: 1.4em;
	margin: calc(2*var(--gap)) auto calc(4*var(--gap)) auto;
}
h2.chapeau {
	width: fit-content;
}
/* page d'acceuil */
section#concept {
	margin: 0;
	/*padding-right: var(--gap);*/
	z-index: 2;
}
section#concept > div {
	padding: calc(8*var(--gap)) 0;
	/*border-radius: 0 0 calc( calc( 100vw - var(--wrap) ) /2 ) 0;*/
}
section#concept::before {
	content: '';
	position: absolute;
	width: 100%;
	display: block;
	z-index: 2;
	left: -40%;
	bottom: -10%;
	filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
	opacity: 0.8;
	background-image: radial-gradient(white 18%, transparent 60%);
	height: 80vw;
	border-radius: 50%;
}
#medias {
	/* background: linear-gradient(to bottom, var(--color-green-ultra-light), var(--color-green));*/
	background-color: var(--color-green-dark);
	width: 100vw;
	margin: calc(4*var(--gap) 0 !important);
	max-width: none;
	padding: calc(2*var(--gap));
	display: block;
	/* border-radius: 10%; */
}
#medias h2 {
	color: #FFF;
}
#medias > div {
	max-width: var(--wrap);
	margin: 0 auto;
}
#methode {
	margin: 0;
	/*background: linear-gradient(to bottom, var(--color-green), var(--color-beige)) !important;*/
}
#methode > div {
	background-color: #FFF;
	/*border-radius:calc( calc( 100vw - var(--wrap) ) /2 ) 0  0 0;*/
	padding: calc(8*var(--gap)) 0 calc(0*var(--gap));
}
div#liste_references > div {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: var(--gap);
}
#liste_references .wp-block-group {
	aspect-ratio: 1/1;
}
#liste_references a {
	aspect-ratio: 1/1;
	margin: 0;
	padding: var(--gap);
	display: flex;
	height: 100%;
	width: 100%;
	z-index: 1;
}
#liste_references figure {
	max-width: 100%;
	max-height: 100%;
	margin: 0;
}
#liste_references figure img {
	max-width: 100%;
	max-height: 100%;
	object-fit: contain;
}
div#texte-intro {
	position: absolute;
	top: 111%;
	transform: translateY(-50%);
	padding-left: var(--gap);
	z-index: 11;
}
div#texte-intro h1 {
	color: var(--color-green-ultra-light);
	line-height: 1;
	margin-bottom: 0;
}
div#texte-intro h1 strong {
	font-size: 1.7em;
	font-weight: lighter;
	color: var(--color-green);
}
div#texte-intro p {
	font-size: 1.3em;
	color: var(--color-grey);
}
div#texte-intro span.metanature i {
	color: var(--color-green-dark);
	text-transform: uppercase;
	font-style: normal;
}
.a_plus a {
	font-family: 'headfontBold';
	font-size: 1.3em;
	color: #FFF;
	text-decoration: none;
	padding: calc(var(--gap)/2);
	background-color: var(--color-green);
	border-radius: calc(var(--gap)/4);
	margin-top: var(--gap);
	display: block;
	width: fit-content;
}
section#public {
	background: linear-gradient(var(--color-beige), #FFF);
	margin-top: 0;
	padding-top: calc(4*var(--gap));
}
section#public::before {
	content: url(../../../themes/metanature/illustration/courbe3.svg);
	width: 100vw;
	height: 7vw !important;
	filter: drop-shadow(-8px 9px 6px rgba(0, 0, 0, 0.2));
	display: block;
	position: absolute;
	top: 0;
	left: 0;
}
#public p.a_plus {
	display: block;
	text-align: center;
	padding: 0;
	margin: 0;
}
section#public .wp-block-columns {
	gap: var(--gap);
}
section#public .wp-block-column {
	align-items: center;
	justify-content: center;
	aspect-ratio: 1/1;
	/* border: thin solid var(--color-green); */
	display: flex;
	flex-direction: column;
}
section#public .wp-block-column figure {
	max-width: 60%;
	margin: 0;
}
#public figure::before {
	content: '';
	position: absolute;
	width: 130%;
	display: block;
	z-index: 0;
	left: 50%;
	top: 50%;
	filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
	/* opacity: 0.8; */
	background-image: linear-gradient(to top, var(--color-green) 25%, transparent 30%, var(--color-beige));
	/* height: 180%; */
	border-radius: var(--gap);
	background-color: #FFF;
	aspect-ratio: 1/1;
	transform: translate(-50%, -50%);
	border: var(--gap) solid var(--color-beige);
}
section#public .wp-block-column .a_plus a {
	color: #FFF;
	text-decoration: none;
	font-weight: bold;
	margin-top: calc(-0.5*var(--gap));
	background-color: transparent;
}
#medias .wp-block-columns {
	gap: var(--gap);
	padding: var(--gap);
}
#medias .wp-block-column, div#liste_references > div > div {
	display: flex;
	align-items: center;
	justify-content: center;
	aspect-ratio: 4/3;
	border: thin solid var(--color-green);
}
.illustration {
	border: thin solid var(--color-green);
}
.graphique {
	border: thin solid var(--color-green);
	aspect-ratio: 1/1;
	display: block;
	border-radius: 50%;
	margin: 0 auto;
	width: 200px;
}
#references .owl-carousel .owl-stage {
	position: relative;
	-ms-touch-action: pan-Y;
	touch-action: manipulation;
	-moz-backface-visibility: hidden;
	display: flex;
	align-items: center;
}
/* PAGE METHODE */
#cabinet-intro figure, header#methode-intro figure {
	z-index: -1;
}
#methode .wp-block-columns.wrap {
	margin: 0;
}
#cabinet-intro figure::after, header#methode-intro figure::after {
	content: url(illustrations/pissenlit_tete.svg);
	position: absolute;
	width: 200%;
	display: block;
	z-index: -1;
	left: -30%;
	bottom: -30%;
	filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
	opacity: 0.4;
}
/*
#cabinet-intro figure::before,
header#methode-intro figure::before {
content: '';
position: absolute;
width: 200%;
display: block;
z-index: -2;
left: -70%;
bottom: -100%;
filter: drop-shadow(2px 2px 1px rgba(0,0,0,0.2));
opacity: 0.8;
background-image: radial-gradient(var(--color-green) 0%, transparent 60%);
height: 50vw;
border-radius: 50%;

}
*/
#schemas_roue {
	background-color: var(--color-grey-light);
}
#schemas_roue > div {
    text-align: center;
}

#schemas_roue::before {
    content: url(../../../themes/metanature/illustration/courbe3.svg);
    width: 100vw;
    height: 7vw !important;
    filter: drop-shadow(-8px 9px 6px rgba(0, 0, 0, 0.2));
    z-index: -1;
    display: block;
	transform: scaleX(-1);
}
#schemas_roue::after {
    content: url(../../../themes/metanature/illustration/courbe3.svg);
    width: 100vw;
    height: 7vw !important;
    filter: drop-shadow(-8px 2px 2px rgba(0, 0, 0, 0.1));
    display: block;
    transform: scaleY(-1);
    position: absolute;
    bottom: -1px;
    left: 0;
}

#schemas_roue .wp-block-columns {
	gap: calc(var(--gap)*2);
	margin-bottom: calc(var(--gap)*4);
}
#schemas_roue img {
    width: 100%;
}
#cabinet-intro figure::before, header#methode-intro figure::before {
	content: '';
	position: absolute;
	width: 140%;
	display: block;
	z-index: -2;
	left: -70%;
	bottom: -59%;
	filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
	opacity: 0.8;
	background-image: radial-gradient(var(--color-green), transparent 60%);
	border-radius: 50%;
	aspect-ratio: 1/1;
}
#valeurs {
	background-color: var(--color-green-ultra-light);
	
}
#engagements {
	background-image: linear-gradient(to bottom, var(--color-green-ultra-light), transparent);
	margin-top: 0;
	padding-top: calc(4*var(--gap));
}
#valeurs > * { 
	padding-top: calc(4*var(--gap));
}
#professionnels .wp-block-columns {
	flex-direction: column-reverse;
}
#professionnels figure::before {
	content: '';
	position: absolute;
	width: 160%;
	display: block;
	z-index: -2;
	right: -50%;
	bottom: -29%;
	opacity: 0.8;
	background-image: radial-gradient(var(--color-green), transparent 60%);
	border-radius: 50%;
	aspect-ratio: 1 / 1;
}
#professionnels figure::after {
	content: url(illustrations/pissenlit_tete.svg);
	position: absolute;
	width: 180%;
	display: block;
	right: -120%;
	bottom: -10%;
	filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
	opacity: 0.5;
}
#professionnels figure img {
	filter: drop-shadow(2px 12px 17.9px var(--color-green));
	z-index: 1;
}
#nos-formations {
	background: linear-gradient(to bottom, var(--color-beige), transparent);
}
#nos-formations .chapeau {
	margin: calc(2* var(--gap)) auto calc(2* var(--gap)) calc(2* var(--gap));
}
#nos-formations ul.liste {
	margin: 0 calc(var(--gap)* 2) !important;
	/* display: block; */
}
#nos-formations p.chapeau {
	padding-left: var(--gap);
}

#valeurs::before,
#nos-formations::before {
	content: url(../../../themes/metanature/illustration/courbe3.svg);
	width: 100vw;
	height: 7vw !important;
	filter: drop-shadow(-8px 9px 6px rgba(0, 0, 0, 0.2));
	z-index: -1;
	display: block;
}

#piliers .grid-2 > div, #fondements_scientifiques .grid-2 > div, {
	counter-reset: count;
}
.engagements .wp-block-column {
	display: flex;
}
#piliers figure {
	text-align: center;
}
#piliers .grid-2 .wp-block-group {
	counter-increment: count;
}
#piliers .grid-2 .wp-block-group::before {
	content: counter(count);
	font-size: 5em;
	display: flex;
	justify-content: center;
	padding-top: calc(2*var(--gap));
	color: var(--color-green);
	font-style: italic;
	font-family: 'body-font';
}
#piliers .grid-2 .wp-block-group > div {
	padding: var(--gap) 0 0 var(--gap);
}
#piliers .wp-block-column {
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
}
#bienfaits .grid-4 {
	grid-template-columns: repeat(4, 1fr);
}
#bienfaits .grid-4 .wp-block-group__inner-container .wp-block-group {
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	/*border: thin solid var(--color-green);*/
	cursor: pointer;
	padding: var(--gap);
}
#bienfaits .grid-4 .wp-block-group__inner-container .wp-block-group h3 {
	font-size: 1em;
	text-align: center;
}
#bienfaits .grid-4 .wp-block-group__inner-container .wp-block-group figure {
	margin: var(--gap) auto 0;
	width: fit-content;
	transition: transform 0.3s ease;
}
#liste_references a img, #medias .owl-carousel .owl-item a img {
	transition: transform 0.3s ease;
}
#bienfaits .grid-4 .wp-block-group__inner-container .wp-block-group figure:hover, #liste_references a:hover img, #medias .owl-carousel .owl-item a:hover img {
	transform: scale(1.3);
}
/* PAGES FORMATION */
/*section#nos-formations .wp-block-group.wrap:nth-child(odd) .wp-block-columns {
flex-direction: row-reverse;
}*/
section#nos-formations .wp-block-columns, #supervision {
	/* border: thin solid var(--color-green); */
	border-radius: 5vw 0;
	padding: var(--gap);
	overflow: hidden;
	background: linear-gradient(120deg, var(--color-green-dark), var(--color-beige), #FFF 80%);
	box-shadow: 2px 2px 4px rgba(0, 0, 0, 0.2);
}
#supervision {
	background: linear-gradient(120deg, var(--color-green-ultra-light), var(--color-beige), #FFF 80%);
	padding: var(--gap);
}
section#nos-formations .wp-block-columns::after {
	content: url(illustrations/pissenlit_tete.svg);
	position: absolute;
	left: 0;
	top: 0;
	width: 120%;
	opacity: 0.5;
}
section#nos-formations .wp-block-columns * {
	z-index: 1;
}
section#nos-formations .wp-block-columns h3 {
	font-size: 2.4em;
	letter-spacing: 0.02em;
}
section#nos-formations .wp-block-columns h3 span.metanature {
	color: var(--color-beige);
	font-weight: 400;
	font-family: headfontBold;
	font-size: 1.1em;
}
section#nos-formations .wp-block-columns h3 span.metanature i {
	color: var(--color-green-dark);
	text-transform: uppercase;
	font-style: normal;
}
section#nos-formations .wp-block-column {
	display: flex;
	justify-content: center;
	flex-direction: column;
}
#sources a {
	color: var(--color-green);
	font-weight: bold;
	text-decoration: none;
}
.wp-block-column.formation-header h3 {
	color: #FFF;
}
.wp-block-column.formation-header {
	display: flex;
	flex-direction: column;
	justify-content: space-between !important;
	border-radius: 5vw 0;
}
#satisfaction .grid-3 {
	margin-top: calc(2*var(--gap));
}
.boutons > div {
	display: flex;
	width: fit-content;
	gap: var(--gap);
	flex-direction: column;
	margin: 0 auto;
}
.bouton, input.bouton, .caldera-grid input.btn.bouton {
	background-color: var(--color-green);
	overflow: hidden;
	color: #FFF;
	text-decoration: none;
	z-index: 2 !important;
	cursor: pointer;
	border-radius: 0;
	border: none;
}
.bouton::before, input.bouton::before, .caldera-grid input.btn.bouton::before {
	content: '';
	/* transform: translateX(50%); */
	height: 100%;
	background-color: var(--color-green-dark);
	width: 0;
	position: absolute;
	top: 0;
	left: 0;
	transition: all 0.3s ease;
	transform: rotate(90deg) translate(50%, 50%);
	z-index: 1;
}
.bouton {
	overflow: hidden;
	display: flex;
	width: fit-content;
	margin: 0 auto;
}
.bouton a {
	text-decoration: none;
	color: inherit;
	width: 100%;
	height: 100%;
	display: flex;
	padding: calc(.5*var(--gap));
}
input.bouton:hover::before, .bouton:hover::before, .caldera-grid input.btn.bouton:hover::before {
	width: 100%;
	transition: all 0.3s ease;
	left: 0;
	transform: rotate(0);
	z-index: 0;
}
#nos-formations .wp-block-group.wrap {
	margin: calc(var(--gap)*4);
}
#nos-references .illustration {
	aspect-ratio: 2/1;
}
section#avantages figure {
	float: left;
	height: 40px;
	display: flex;
	margin-right: calc(0.5*var(--gap));
}
section#avantages figure img {
	width: 40px;
	transform: translateY(21%);
}
#fondateur .wp-block-group.illustration {
	aspect-ratio: 1/1;
	max-width: 100%;
	float: revert;
}
#commites .grid-4 {
	margin-top: calc(var(--gap)*2);
}
#commites .grid-4 .wp-block-columns,
#equipe_pedagogique .grid-4 .wp-block-columns {
	flex-direction: column;
	gap: 0;
	color: #000;
	background-color: transparent;
	transition: all 0.6s ease;
}
#commites .grid-4 .wp-block-columns {
	cursor: pointer;
}
#commites .grid-4 .wp-block-columns:hover {
	background-color: var(--color-green);
	color: #FFF;
	transition: all 0.6s ease;
}
#commites .grid-4 .illustration ,
#equipe_pedagogique .grid-4 .illustration {
	height: min-content;
}
#commites .grid-4 .illustration + div ,
#equipe_pedagogique .grid-4 .illustration + div {
	height: 100%;	
}
#commites .illustration,
#equipe_pedagogique .illustration {
	border: none;

}
#commites .grid-4 .illustration figure,
#equipe_pedagogique .grid-4 .illustration figure {
	aspect-ratio: 1/1;
	overflow: hidden;
	width: 100%;
	margin: 0;
	border-radius: 50%;	
	border: calc(var(--gap)/8) solid var(--color-grey);
	
}
#commites .grid-4 .illustration figure {
	border: calc(var(--gap)/8) solid var(--color-green);
}
#commites .grid-4 .illustration img,
#equipe_pedagogique  .grid-4 .illustration img {
	object-fit: cover;
	min-width: 100%;
	min-height: 100%;
	transition: all 0.4s ease;
	filter: grayscale(1);

}

#commites .grid-4 h3,
#equipe_pedagogique .grid-4 h3 {
	text-align: center;
}

#commites .grid-4 .wp-block-columns:hover img {
	transform: scale(1.3);
}
#commites .grid-4 .wp-block-column
#equipe_pedagogique  .grid-4 .wp-block-column {
	flex: 1;
}
#commites .grid-4 .wp-block-column.illustration,
#equipe_pedagogique .grid-4 .wp-block-column.illustration {
	flex: 0;
}
.illustration figure {
	margin: 0;
}
#commites .grid-4 .wp-block-column p {
	display: none;
}
#modale .illustration {
	float: left;
	max-width: 300px;
	margin: 0 calc(var(--gap)/2) calc(var(--gap)/2) 0;
}
#modale h3 {
	width: fit-content;
}
#modale {
	max-height: 90%;
	overflow: scroll;
}
#modale span.close {
	border: thin solid;
	border-radius: 50%;
	position: absolute;
	right: var(--gap);
	top: var(--gap);
	display: block;
	width: 30px;
	text-align: center;
	cursor: pointer;
}

.valeurs figure {
	float: left;
	margin-bottom: 0;
}
.engagements {
	counter-reset: count;
}
.engagements .wp-block-column {
	display: flex;
	/* align-items: center; */
	padding-top: calc(2*var(--gap));
}
.engagements .wp-block-column {
	counter-increment: count;
}
.engagements .wp-block-column::before {
	content: counter(count);
	font-size: 5em;
	display: flex;
	justify-content: center;
	padding-top: var(--gap);
	color: var(--color-green);
	font-style: italic;
	font-family: 'body-font';
	position: absolute;
	top: 0;
	left: 0;
}
section#champs-application ul {
	margin-left: auto;
	margin-right: auto;
	width: fit-content;
	font-size: 1.4em;
	line-height: 1.4em;
}
.camembert > div {
	display: flex;
	flex-direction: column;
	margin-bottom: calc(var(--gap)* 4);
}
.camembert > div > * {
	display: flex;
	justify-content: left;
	flex: 1;
	text-align: left;
	align-items: center;
}
.camembert > div > p {
	padding: var(--gap) calc(2*var(--gap));
}
.chart {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	text-align: left;
}
.chart {
	display: flex;
	align-items: flex-start;
	justify-content: flex-start;
	text-align: left;
}
.chart > div {
	position: relative;
	height: var(--gap);
	width: 0;
}
.chart > div span.percentage-span {
	position: absolute;
	transform: translate(-50%, 0);
	font-family: body-font;
	font-size: 0.8em;
	left: 50%;
	bottom: calc(-1 * var(--gap));
	transition: opacity 3s ease; /* Transition pour l'opacité */
	opacity: 0;
}
.chart > div:nth-child(odd) span.percentage-span {
	top: calc(-1 * var(--gap));
	bottom: auto;
}
.chart.appeared > div span.percentage-span {
	opacity: 1; /* Rendre le texte visible à la fin de la transition */
}
.chart > div {
	height: var(--gap);
}
/*
.chart.appeared > div {
width: var(--width) !important;
}*/
.legende .wp-block-column:first-of-type, .legende .wp-block-column:first-of-type p {
	max-width: 20px;
	aspect-ratio: 1/1;
	display: block;
}
.legende .wp-block-column:nth-child(2) {
	flex: 1;
}
.legendes {
	border: thin solid var(--color-green);
	padding: calc(var(--gap) / 2);
	flex-direction: column;
}
.legendes p {
	margin: 0;
}
.legendes .wp-block-columns {
	gap: calc(var(--gap)/2);
	margin: 0;
}
.pas_satisfaisant {
	background-color: #FE502D;
}
.peu_satisfaisant {
	background-color: #CBA79F;
}
.satisfaisant {
	background-color: #CCE0A9;
}
.tres_satisfaisant {
	background-color: var(--color-green);
}
#modale {
	display: none;
	position: fixed;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	background: white;
	padding: 20px;
	z-index: 1000;
	filter: drop-shadow(10px 17px 10px rgba(0, 0, 0, 0.4));
	width: 95%;
	max-width: 600px;
}
/* PAGE PRODUCTION */
section#production-intro {
	background: linear-gradient(to bottom, #FFF, var(--color-blue), var(--color-green));
}
#intro::after, section#production-intro::after {
	content: url(../../../themes/metanature/illustration/courbe3.svg);
	width: 100vw;
	height: 7vw !important;
	filter: drop-shadow(-8px 20px 11px rgba(0, 0, 0, 0.2));
	display: block;
	transform: scaleY(-1);
	position: absolute;
	bottom: -1px;
	left: 0;
}
#production-intro .wp-block-column {
	justify-content: center;
	/* align-items: center; */
	display: flex;
	flex-direction: column;
}
#production-intro .wp-block-column h1 {
	color: #FFF;
}
#production-intro .wp-block-column p {
	font-size: 1.3em;
}
.wp-block-column.couverture {
	padding: var(--gap);
	border: 4px solid var(--color-green);
}
.wp-block-columns.livre.wrap {
	margin: calc(4*var(--gap));
}
.wp-block-columns.acheter {
    padding: calc(var(--gap) / 2);
    /* border-radius: var(--gap); */
    width: fit-content;
    margin: 0 auto;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: calc(4* var(--gap));
}
.wp-block-columns.acheter .wp-block-column {
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--color-green);
}
.wp-block-columns.acheter .wp-block-column p {
	white-space: nowrap;
}
.wp-block-columns.livre > .wp-block-column:not(.couverture) {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	border-bottom: 4px solid var(--color-green);
}
.wp-block-columns.acheter a {
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #FFF;
	border-radius: calc(var(--gap)/2);
	padding: calc(var(--gap)/2);
	aspect-ratio: 1/1;
	height: 100%;
	border: 2px solid var(--color-green);
}
.wp-block-columns.acheter figure {
	margin: 0;
}
.acheter > * {
	display: flex;
	justify-content: center;
	align-items: center;
	text-wrap: nowrap;
	font-weight: bold;
}
.acheter img {
    width: 32px;
    transform: scale(1);
    transition: transform 0.4s ease;
}
.wp-block-columns.acheter a:hover img {
    transform: scale(1.8);
}
/* ACTUALITES */
#blog .intro-text {
	display: flex;
	justify-content: left;
	align-items: center;
}
#blog.blog-all .grid-2 > div {
	grid-template-columns: 1fr 2fr;
}
.single-article main > header a {
	color: inherit;
	text-decoration: none;
	font-weight: inherit;
}
.single-article .grid-2 > div {
	grid-template-columns: 1fr 8fr;
}
.single-article article::before, #articles::before {
	content: url(../../../themes/metanature/illustration/courbe3.svg);
	width: 100vw;
	height: 7vw !important;
	filter: drop-shadow(-8px 9px 6px rgba(0, 0, 0, 0.2));
	z-index: -1;
	display: block;
	transform: scaleX(-1);
}
.single-article header .intro-illustration img {
	max-width: 100px;
}
.single-article header h1 {
	font-size: 1.4em;
}
.single-article article > div, #articles > div {
	padding-top: calc(var(--gap)*2);
}
#articles article {
	border: thin solid var(--color-green);
	padding: var(--gap);
}
.post-thumbnail figure, .post-thumbnail img {
	max-width: 100%;
	width: auto;
	height: auto;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	object-fit: cover;
}
.post-text h2 {
	font-size: 1.6em;
}
div.single-article figure {}
div.single-article img {
	max-width: 500px;
	float: left;
	width: auto;
	height: auto;
	margin: 0 var(--gap) var(--gap) 0;
}
.type-post .entry-content {
	display: block;
}
.blog-all .intro-illustration img {
	max-width: 100%;
}
blockquote {
	padding: var(--gap) calc(var(--gap)* 2);
	margin: 0 0;
	border-left: 5px solid var(--color-green);
	line-height: normal;
	font-style: italic;
	/* color: #FFF; */
	line-height: 1.6em;
}
#medias .white .sa_owl_theme .owl-nav .owl-next, #medias .white .sa_owl_theme .owl-nav .owl-prev, #references .white .sa_owl_theme .owl-nav .owl-next, #references .white .sa_owl_theme .owl-nav .owl-prev {
	aspect-ratio: 1 / 1;
	border-radius: 50%;
	height: 50px !important;
	width: 50px !important;
}
#medias .white .sa_owl_theme .owl-nav .owl-prev, #references .white .sa_owl_theme .owl-nav .owl-prev {
	background: var(--color-green) url(../../../themes/metanature/../../plugins/slide-anything/images/icon_prev.png) no-repeat center center !important;
	left: 30% !important;
}
#references .white .sa_owl_theme .owl-nav .owl-next, #medias .white .sa_owl_theme .owl-nav .owl-next {
	background: var(--color-green) url(../../../themes/metanature/../../plugins/slide-anything/images/icon_next.png) no-repeat center center !important;
	right: 30% !important;
}
#references .sa_owl_theme .owl-dots, #medias .sa_owl_theme .owl-dots {
	position: absolute;
	display: block !important;
	padding: 10px 0px 0px !important;
	bottom: -22px !important;
	text-align: center !important;
	font-size: 12px !important;
	line-height: 12px !important;
	width: fit-content;
	margin: 0 auto;
	left: 50%;
	transform: translate(-50%, -50%);
}
#references .owl-item > div {
	display: flex;
	flex-direction: column;
}
#medias .sa_owl_theme .owl-dots {
	calc(var(--gap)*-2) !important;
}
@media only screen and (min-width: 900px) {
	#references .owl-item > div {
		flex-direction: row-reverse;
		gap: calc(2*var(--gap));
	}
}
#references .owl-item blockquote {
	grid-area: blockquote;
	flex: 2;
}
#references .owl-item .temoin {
	flex: 1;
}
#references .owl-item .temoin img {
	clear: both;
	display: block;
	float: left;
	max-width: 100px;
	margin-right: calc(var(--gap)/2);
	margin-bottom: calc(var(--gap)/2);
}
#references .owl-item .temoin > div {
	clear: both;
}
#references .owl-item .ha-testimonial__reviewer-name {
	grid-area: name;
}
#references .owl-item .ha-testimonial__reviewer-title {
	grid-area: company;
}
.col-sm-6 {
	border: thin solid var(--color-green);
	padding: calc(var(--gap) / 2) !important;
	border-radius: calc(var(--gap) / 2);
	margin-bottom: var(--gap);
}
@media only screen and (min-width: 768px) {
	
.col-sm-6 {
	width: calc(50% - calc(var(--gap) / 2)) !important;
	margin-bottom: 0;

}
.col-sm-6.first_col {
	margin-right: calc(var(--gap)/2);
}
.col-sm-6.last_col {
	margin-left: calc(var(--gap)/2);
}
}
.caldera-grid .single {
	border: thin solid var(--color-green);
	padding: calc(var(--gap) / 2) !important;
	border-radius: calc(var(--gap) / 2);
}
.caldera-grid .row {
	margin-bottom: var(--gap);
}
.caldera-grid .radio input[type=radio] {
	width: fit-content;
}
.legal p {
	text-align: justify;
}
#cmplz-document, #legal, #main.legal {
	color: #000;
	font-size: 1em;
	max-width: none;
	column-gap: calc(4*var(--gap));
}
#cmplz-document a, #legal a, #main.legal a {
	color: inherit;
}
#main.legal h1 {
	text-align: center;
	text-transform: uppercase;
	font-size: 3em;
	color: var(--color-green);
	margin-top: calc(4* var(--gap));
}
#main.legal h2::after {
	bottom: -4px;
}
#cmplz-document h2, #legal h2, #main.legal h2 {
	font-size: 1.8em;
	margin-top: calc(2*var(--gap));
}
#main.legal h3 {
	font-size: 1.2em;
	color: var(--color-grey);
}
.legal .polycontain, .legal + .polycontain {
	position: relative;
	bottom: 0 !important;
}
.footer-nav-menu.menu-main-menu-container.wrap {
	align-items: center;
	width: fit-content;
	/* color: var(--color-green); */
}
ul#menu-legal {
	display: flex;
	gap: var(--gap);
	list-style: none;
}
p.bouton.pdf {
	padding-left: 40px;
}
.pdf::after {
	content: url(../../../themes/metanature/../../themes/metanature/illustration/picto/picto-acrobat-blanc.svg);
	/* display: flex; */
	height: 100%;
	z-index: 10 !important;
	aspect-ratio: 1 / 1;
	background: var(--color-grey);
	position: absolute;
	left: 0;
	margin: calc(var(--gap) / 4);
    height: calc(100% - calc(var(--gap) / 2));
}
@media only screen and (max-width: 500px) {
	#piliers .grid-2 > div, #fondements_scientifiques .grid-2 > div, #bienfaits .grid-4 > div {
		display: flex;
		flex-direction: column;
	}
}
@media only screen and (max-width: 600px) {
	#comites .grid-2 > div {
		display: block;
	}
	.blog-all .grid-3 > div, .blog-all header .grid-2 > div {
		display: flex;
		flex-direction: column;
	}
}
@media only screen and (max-width: 760px) {
	header .nav-menu ul {
		height: 100%;
	}
	div#texte-intro h1 {
		color: var(--color-green-ultra-light);
		line-height: 1;
		margin-bottom: 66px;
		margin-top: -12px;
		text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.4);
	}
	#commites .grid-4 > div,
	#equipe_pedagogique .grid-4 > div {
		grid-template-columns: 1fr 1fr;
	}
	#commites .grid-4 .wp-block-columns,
	#equipe_pedagogique .grid-4 .wp-block-columns {
		flex-direction: row;
	}
	.legendes .wp-block-columns {
		display: grid;
		grid-template-columns: 1fr 9fr;
	}
}
@media only screen and (min-width: 768px) {
	section#concept::after {
		content: url(../../../themes/metanature/illustration/pissenlit_tete_vert.svg);
		position: absolute;
		left: -16vw;
		top: -22vw;
		width: 115%;
		filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
	}
	.custom-header-image {
		width: 320px;
		height: auto;
	}
	#intro {
		/* background-color: #EF5A1E;  */
		margin-top: -320px;
	}
	div#texte-intro {
		top: 50%;
		transform: translateY(-50%);
		right: calc(calc(100vw - var(--wrap)) /2);
		max-width: calc(var(--wrap)/2);
		padding-left: var(--gap);
		z-index: 11;
		color: #000;
	}
	div#texte-intro h1 {
		color: var(--color-green-dark);
	}
	.single-article article {
		margin-top: -100px;
		z-index: -1;
	}
	.single-article header .intro-illustration img {
		max-width: 140px;
	}
	#professionnels .wp-block-columns {
		flex-direction: row;
	}
	section#nos-formations .wp-block-column {
		display: flex;
		justify-content: center;
		flex-direction: column;
	}
	.wp-block-column.formation-header {
		display: flex;
		flex-direction: column;
		justify-content: space-between !important;
		padding: 0 calc(var(--gap)*2);
		border-radius: 5vw 0;
	}
	header .menu-main-menu-container ul li a {
		font-size: 1.8em;
		padding: calc(var(--gap) / 2);
		transition: all 0.6s ease;
	}
	.col-2 > * {
		column-count: 2;
	}
	#medias .owl-item {
		width: calc(calc(var(--wrap)/8) - calc(var(--gap)/8*7)) !important;
		aspect-ratio: 1/1;
	}
	#menu-main-menu-container > div.wrap {
		display: grid;
		grid-template-columns: 1fr 1fr;
	}
	div#liste_references > div {
		grid-template-columns: repeat(6, 1fr);
		gap: calc(var(--gap)* 2);
	}
	.plus_d_info a::after {
		width: 80px;
		height: 80px;
	}
}
@media only screen and (min-width: 768px) and (max-width: 1400px) {
	div#texte-intro h1 {
		font-size: 2.6em;
	}
}
@media only screen and (min-width: 980px) {
	#cmplz-document, #legal {
		column-count: 2;
	}
	.legal .content {
		padding: calc(4 * var(--gap));
		margin: 0 calc(4 * var(--gap)) calc(4 * var(--gap));
	}
	.concept figure {
		margin: 0 var(--gap) var(--gap) 0 !important;
	}
	.concept .wp-block-image {
		display: inline-block;
		height: auto;
		float: left;
		width: calc(50% + calc(var(--gap)/2));
	}
	.concept:nth-child(even) .wp-block-image {
		float: right;
	}
	.concept:nth-child(even) figure {
		margin: 0 0 var(--gap) var(--gap) !important;		
	}
}
.concept p {
	text-align: justify;
}
header#concepts-intro {
	z-index: -1;
}
header#concepts-intro .wp-block-column:nth-child(1)::before {
    content: '';
    position: absolute;
    width: 140%;
    display: block;
    z-index: -2;
    left: -70%;
    bottom: -69%;
    filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
    opacity: 0.8;
    background-image: radial-gradient(var(--color-green), transparent 60%);
    border-radius: 50%;
    aspect-ratio: 1 / 1;
}
header#concepts-intro .wp-block-column:nth-child(1)::after {
    content: url(illustrations/pissenlit_tete.svg);
    position: absolute;
    width: 200%;
    display: block;
    z-index: -1;
    left: -30%;
    bottom: -20%;
    filter: drop-shadow(2px 2px 1px rgba(0, 0, 0, 0.2));
    opacity: 0.4;
}
header#concepts-intro .wp-block-column:nth-child(1) {
    display: flex;
    align-items: center;
}
header#concepts-intro .wp-block-column:nth-child(2) {
	font-size: 1.4em;
	line-height: 1.4em;
}
.wp-block-group.concept.wrap {
    margin-top: calc(2* var(--gap));
}
@media only screen and (min-width: 1024px) {
	main {
		padding-bottom: calc(8*var(--gap));
	}
	#colophon figure {
		max-width: 50%;
	}
	nav .contact .logo {
		width: 60%;
		margin-left: 20%;
	}
	.legendes {
		flex-direction: row;
	}
	.camembert > div {
		flex-direction: row;
		margin-bottom: 0;
	}
	.camembert > div > * {
		width: 50%;
	}
	#supervision {
		padding: calc(var(--gap)*3);
	}
	blockquote {
		font-size: 1.2em;
		/* color: #FFF; */
		line-height: 1.6em;
		height: 100%;
	}
	.wp-block-columns.acheter {
    	flex-direction: row;
		height: auto;
	}
	#schemas_roue > div {
		padding: calc(var(--gap)* 2) calc(var(--gap)* 4);
	}

	#schemas_roue img {
		width: 80%;
	}
}
@media only screen and (min-width: 1150px) {
	.boutons > div {
		flex-direction: row;
	}
}
#equipe_pedagogique .wp-block-video video {

    max-width: 700px;
    margin: 0 auto;
    display: block;
}
.wp-block-group.video.player.wrap > div > iframe {
	display: block;
	margin: 0 auto;
}
/* metanature-wizm : proportions des illustrations posées en CSS (viewBox des SVG). */
#fondements_scientifiques::before { aspect-ratio: auto 200 / 90; }
section#public::before { aspect-ratio: auto 1920 / 158; }
#cabinet-intro figure::after, header#methode-intro figure::after { aspect-ratio: auto 512 / 305; }
#schemas_roue::before { aspect-ratio: auto 1920 / 158; }
#schemas_roue::after { aspect-ratio: auto 1920 / 158; }
#professionnels figure::after { aspect-ratio: auto 512 / 305; }
#valeurs::before,
#nos-formations::before { aspect-ratio: auto 1920 / 158; }
section#nos-formations .wp-block-columns::after { aspect-ratio: auto 512 / 305; }
#intro::after, section#production-intro::after { aspect-ratio: auto 1920 / 158; }
.single-article article::before, #articles::before { aspect-ratio: auto 1920 / 158; }
section#concept::after { aspect-ratio: auto 512 / 305; }
header#concepts-intro .wp-block-column:nth-child(1)::after { aspect-ratio: auto 512 / 305; }