/*
 * Theme Name: Le Studio
 * Description: 
 * Author: Le Studio
 * Version: 2.0.1
 * Tags: 
 */


body {
    line-height: 1;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    font-size: 1em;
    font-family: 'Open Sans', sans-serif;
    color: black;
    position: relative;
    overflow-x: hidden;
    margin: 0;
}

body, section, article, div, ul, li, p, img, textarea, input {
    box-sizing: border-box;
}

.wrapper.clearfix{
    overflow-x: hidden;
}

h1 { font-size: 2.5em;  margin: 0; color: var(--bleu); font-family: 'Dosis', sans-serif; line-height: 140%;}
h2 { font-size: 1.8em; margin: 0; color: var(--bleu); font-family: 'Dosis', sans-serif; line-height: 140%;}
h3 { font-size: 1.2em; margin: 0; color: var(--bleu); font-family: 'Dosis', sans-serif; line-height: 140%;}
h4 { font-size: 1.12em; margin: 0; line-height: 140%;}
h5 { font-size: .83em;  margin: 0; line-height: 140%; }
h6 { font-size: .75em;  margin: 0; line-height: 140%; }
p{ font-size: 16px; line-height: 140%; }

a{ color: var(--bleu)};

img { max-width: 100%; height: auto; }

/* *** TYPOS *** */
/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-300italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  font-display: swap;
  src: url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300italic.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-300italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-italic.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-800italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 800;
  font-display: swap;
  src: url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800italic.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800italic.woff') format('woff'), /* Modern Browsers */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/wp-content/themes/lestudio/fonts/open-sans-v34-latin-800italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}

/* dosis-200 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 200;
  src: url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-200.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-200.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* dosis-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 400;
  src: url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* dosis-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 600;
  src: url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}
/* dosis-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Dosis';
  font-style: normal;
  font-weight: 800;
  src: url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('/wp-content/themes/lestudio/fonts/dosis-v34-latin-800.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}


/* *** CLASS FLEX *** */
.flex {
    display: flex;
}
.flex-column {
    display: flex;
    flex-direction: column;
}
.flex-wrap {
    flex-wrap: wrap;
}
.ai-center {
    align-items: center;
}
.ai-flex-start {
    align-items: flex-start;
}
.ai-flex-end {
    align-items: flex-end;
}
.jc-space-around {
    justify-content: space-around; 
}
.jc-space-between {
    justify-content: space-between; 
}
.jc-flex-end {
    justify-content: flex-end;
}
.jc-flex-start {
    justify-content: flex-start;
}
.jc-center {
    justify-content: center;
}



/* *** COULEURS *** */
:root {
  --bleu_fonce: #06264b;
  --bleu: #00569a;
  --gris : #f1f3f8;
  --rouge: #ec6357;
}
.has-rouge-background-color {
    background-color: #ec6357;
}
.has-rouge-color,
.has-rouge-color-color h1,
.has-rouge-color-color h2,
.has-rouge-color-color h3,
.has-rouge-color-color h4,
.has-rouge-color-color p,
.has-rouge-color-color a{
    color: #ec6357;
}
.has-blue-background-color {
    background-color: #06264b;
}
.has-blue-color,
.has-blue-color h1,
.has-blue-color h2,
.has-blue-color h3,
.has-blue-color h4,
.has-blue-color p,
.has-blue-color a{
    color: #06264b;
}
.has-or-2-background-color {
    background-color: #B8A179;
}
.has-or-2-color,
.has-or-2-color h1,
.has-or-2-color h2,
.has-or-2-color h3,
.has-or-2-color h4,
.has-or-2-color p,
.has-or-2-color a{
    color: #B8A179;
}
.has-blue-2-background-color {
    background-color: #00569a;
}
.has-blue-2-color,
.has-blue-2-color h1,
.has-blue-2-color h2,
.has-blue-2-color h3,
.has-blue-2-color h4,
.has-blue-2-color p,
.has-blue-2-color a{
    color: #00569a;
}

.has-grey-1-background-color {
    background-color: #f1f3f8;
}
.has-grey-1-color,
.has-grey-1-color h1,
.has-grey-1-color h2,
.has-grey-1-color h3,
.has-grey-1-color h4,
.has-grey-1-color p,
.has-grey-1-color a{
    color: #f1f3f8;
}
.has-grey-2-background-color {
    background-color: #D5D5D5;
}
.has-grey-2-color,
.has-grey-2-color h1,
.has-grey-2-color h2,
.has-grey-2-color h3,
.has-grey-2-color h4,
.has-grey-2-color p,
.has-grey-2-color a{
    color: #D5D5D5;
}
.has-grey-3-background-color {
    background-color: #6C6C6C;
}
.has-grey-3-color,
.has-grey-3-color h1,
.has-grey-3-color h2,
.has-grey-3-color h3,
.has-grey-3-color h4,
.has-grey-3-color p,
.has-grey-3-color a{
    color: #6C6C6C;
}
.has-beige-background-color {
    background-color: #F9F8F5;
}
.has-beige-color,
.has-beige-color h1,
.has-beige-color h2,
.has-beige-color h3,
.has-beige-color h4,
.has-beige-color p,
.has-beige-color a{
    color: #F9F8F5;
}

.has-green-background-color {
    background-color: #006B52;
}
.has-green-color,
.has-green-color h1,
.has-green-color h2,
.has-green-color h3,
.has-green-color h4,
.has-green-color p,
.has-green-color a{
    color: #006B52;
}

.has-noir-background-color {
    background-color: #000000;
}
.has-noir-color,
.has-noir-color h1,
.has-noir-color h2,
.has-noir-color h3,
.has-noir-color h4,
.has-noir-color p,
.has-noir-color a{
    color: #000000;
}

.has-blanc-background-color {
    background-color: #FFFFFF;
}
.has-blanc-color,
.has-blanc-color h1,
.has-blanc-color h2,
.has-blanc-color h3,
.has-blanc-color h4,
.has-blanc-color p,
.has-blanc-color a{
    color: #FFFFFF;
}


/* ************************ GLOBALE ************************ */

.wrapper-fw, .wrapper-lw, .wrapper-sm{
    position: relative;
    width: 100%;
    padding: 15px;
}
.wrapper-lw{
    max-width: 1200px;
    margin-left: auto;
    margin-right: auto;
}
.wrapper-sm{
    max-width: 768px;
    margin-left: auto;
    margin-right: auto;
}
.section-page{
    padding-top: 60px;
    padding-bottom: 60px;
}


/* ************************ NAGIGATION ************************ */
.menu_ordi{
    display: block;
}
.menu_mobile{
    display: none;
}

/* *** MENU ORDI *** */
.menu_ordi .menu {
    display: flex;
    justify-content: center;
    align-items: center;
    padding-left: 0;
}
.menu_ordi .menu li {
    list-style: none;
    margin-bottom: 0;
    width: 20%;
    max-width: 250px;
    text-align: center;
}
.menu_ordi .menu li a {
    color: var(--bleu);
    text-decoration: none;
    font-family: 'Dosis', sans-serif;
    font-weight: 600;
    font-size: 1.2em;
    padding: 10px 15px;
    transition: all 0.2s ease-in-out;
    border-radius: 30px;
}
.menu_ordi .menu li a:hover,
.menu_ordi .menu li.current-menu-item a,
.menu_ordi .menu li.current-page-ancestor a{
    background-color: var(--gris);
}

body.home #navigation-principale .menu_ordi .menu li a:hover,
body.home #navigation-principale .menu_ordi .menu li.current-menu-item a{
    color: var(--bleu);
}
#navigation-principale{
    background-color: white;
    position: relative;
    transition: all 0.2s ease-in-out;
    z-index: 6;
}
body.home #navigation-principale{
    background-color: transparent;
}
#navigation-principale.sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 99;
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.1);
}
body.home #navigation-principale.sticky{
    background-color: white;
}
#bloc-logo{
    padding: 5px 25px;
    width: 130px;
}
#bloc-vide{
    width: 130px;
}
#bloc-menu{
    padding: 5px 15px;
    width: calc(100% - 260px);
}
#bloc-logo svg{
    width: 80px;
}

body.home #navigation-principale #bloc-logo svg path{
    fill: white;
}
#bloc-logo path,
body.home #navigation-principale.sticky #bloc-logo path{
    fill: var(--bleu);
}

body.home #navigation-principale .menu_ordi .menu li a{
    color: white;
}
body.home #navigation-principale.sticky .menu_ordi .menu li a{
    color: var(--bleu);
}

/* *** MENU MOBILE *** */
.bouton_burger {
    position: relative;
    z-index: 9;
    right: 5px;
    color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    cursor: pointer;
    background-color: var(--rouge);
    border-radius: 300px;
    width: 40px;
    height: 40px;
}
.bouton_burger span {
    display: block;
    width: 25px;
    height: 4px;
    margin-bottom: 2px;
    margin-top: 2px;
    position: relative;
    background: white;
    border-radius: 3px;
    box-shadow: 2px 2px 2px rgba(0,0,0,0.2);
    transition: all 0.3s ease;
}
.bouton_burger:hover span:first-child, 
.bouton_burger:hover span:last-child {
    width: 20px;
}
.menu_mobile.active .bouton_burger span:first-child {
    transform: rotate(-45deg) translate(-3px, 2px);
}
.menu_mobile.active .bouton_burger span:last-child {
    transform: rotate(45deg) translate(-3px, -3px);
}
.menu_mobile.active .bouton_burger span:nth-child(2) {
    display: none;
}
.menu_mobile nav {
    height: 100%;
    position: fixed;
    top: 0%;
    right: -100%;
    background-color: var(--bleu);
    z-index: 8;
    transition: all 0.3s ease;
    width: 100%;
}
.menu_mobile.active nav {
    right: 0%;
}
.menu_mobile nav a {
    color: white;
    text-decoration: none;
    font-weight: bolder;
    font-size: 1.15em;
    font-family: 'Dosis', sans-serif;
    position: relative;
    text-align: left;
    display: block;
    transition: all 0.3s ease;
    width: 100%;
}
.menu_mobile nav ul {
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.menu_mobile nav ul .niveau-1{
    overflow: scroll;
}

.menu_mobile nav ul li {
    list-style: none;
    padding-bottom: 30px;
    align-self: flex-start;
    padding: 15px 50px 15px 50px;
    width: 100%;
    border-bottom: solid 1px #9090904d;
    margin-left: 0;
}
.menu_mobile img {
    width: 150px;
    margin: 15px auto;
    display: block;
    text-align: center;
}

/*** sous-menu ***/
.menu-mobile-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
}
.menu_mobile nav ul li ul li{
    border: none;
    padding: 10px;
}
/* Sous-menus masqués */
.menu-mobile-nav .sub-menu {
    display: none;
    padding-left: 15px;
}
/* Bouton toggle */
.submenu-toggle {
    background: none;
    border: none;
    width: 32px;
    height: 32px;
    cursor: pointer;
    position: relative;
}
.submenu-toggle::before {
    content: "+";
    font-size: 25px;
    color: white;
}
/* État ouvert */
li.open > .sub-menu {
    display: block;
}
li.open > .menu-item-wrapper .submenu-toggle::before {
    content: "–";
}
/* Wrapper lien + bouton */
.menu-item-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
}



/*** Sous menus ***/
.menu_ordi .menu li{
    position: relative;
}
.menu_ordi .menu li a{
    position: relative;
    z-index: 2;
}
.menu_ordi .menu .sub-menu {
    opacity: 0;
    position: absolute; 
    left: 0;            
    top: 100px;   
    width: 100%;     
    background: transparent;
    list-style: none;
    z-index: 1;
    transition: all 0.2s ease-in-out;
    pointer-events: none;
    padding-top: 40px;
    padding-left: 0;
}
.menu_ordi .menu li.menu-item-has-children:hover > .sub-menu {
    opacity: 1;
    top: 0px;
    pointer-events: initial;
    border-radius: 15px;
    background-color: transparent;
}
.menu_ordi .menu .sub-menu li{
    width: 100%;
    max-width: 100%;
    font-size: 0.9em;
}
.menu_ordi .menu .sub-menu li a {
    display: block;
    padding: 10px;
    text-decoration: none;
    color: var(--bleu) !important;
    background-color: white !important;
    border-radius: 0;
    box-shadow: 0px 0px 1px 1px rgba(0, 0, 0, 0.1);
    line-height: 140%;
}
.menu_ordi .menu .sub-menu li:first-child a { border-top-left-radius: 15px; border-top-right-radius: 15px;}
.menu_ordi .menu .sub-menu li:last-child a { border-bottom-left-radius: 15px; border-bottom-right-radius: 15px;}
.menu_ordi .menu .sub-menu li a:hover {
    background-color: var(--gris) !important;
}




/* ************************ HEADER ************************ */

/*** Preheader ***/
#preheader{
    background-color: var(--gris);
    font-size: 14px;
    padding-top: 8px;
    padding-bottom: 8px;
}
#preheader a{
    color: var(--bleu);
    text-decoration: none;
}
.el-preheader{
    position: relative;
    gap: 5px;
    margin-right: 10px;
    padding-right: 10px
}
.el-preheader:after{
    position: absolute;
    content: "|";
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    width: 1px;
    height: 16px;
    color: var(--bleu);
}

.el-preheader img{
    padding-right: 5px;
}

.reseaux_sociaux_menu{
    gap: 10px;
}
.reseaux_sociaux_menu img{
    object-fit: contain;
    object-position: center;
    width: 20px;
    height: 20px;
}

.header-simple{
    background-color: var(--gris);
}
.header-simple h1,
.header-formation h1{
    text-align: center;
    text-transform: uppercase;
    padding: 50px 15px;
}
.header-formation h1{
    padding-bottom: 0;
}


.header-formation > *,
.header-formation > .contenu_gutenberg{
    max-width: 768px;
    padding: 15px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    color: white;
}
body.page-template-page_pro_rubriques .header-formation{
    background-color: var(--bleu_fonce);
}
body.page-template-page_loisir_rubriques .header-formation,
body.page-template-page_formations_loisir .header-formation{
    background-color: var(--rouge);
}
.header-formation a{
    color: white;
}
body.single-plateaux_techniques .header-formation{
    background-color: var(--bleu);
}
.header-formation > .contenu_gutenberg h2,
.header-formation > .contenu_gutenberg h3,
.header-formation > .contenu_gutenberg h4{
    color: white;
}


/* ************************ PAGE ACCUEIL ************************ */

#bloc-bretagne{
    position: absolute;
    z-index: 5;
    top: 150px;
    right: 0;
    }

header#centre-activites-plongee{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
section#presentation-cap{
    position: relative;
    order: 2;
    opacity: 0;
    animation: fadeInUp 1s ease-out 0.5s forwards;
    padding-top: 0;
}

section#presentation-cap.contenu_gutenberg .wrapper-sm{
    max-width: 1024px;
}

section#presentation-cap h1{
    text-align: center;
}

section#mea-formations{
    top: -62px;
    position: relative;
    order: 1;
}

#mea-formations {
    display: flex;
    flex-direction: row;
    width: 100%;
    height: 100%;
}
#mea-formations > * {
    flex: 1;
    height: 100%;
    min-height: calc(100vh - 46px);
    box-sizing: border-box;
}
#mea-formations > *:not(:last-child) {
    margin-right: 0;
}

.formation-block {
    position: relative;
    flex: 1;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    overflow: hidden;
}

.formation-block img.formation-img {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; 
    z-index: 1;
    filter: grayscale(100%) contrast(120%) brightness(95%);
    transform-origin: 50%;
    animation: zoomOutOnLoad 1.5s ease-out forwards;
}

@keyframes zoomOutOnLoad {
    0% { transform: scale(1.04); }
    100% { transform: scale(1); }
}

.formation-block .overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0.6;
    z-index: 2;
    mix-blend-mode: multiply;
    filter: brightness(1.2);
}
#formation-pro.formation-block .overlay {
    background-color: var(--bleu_fonce);
        filter: brightness(2);
}
#formation-loisir.formation-block .overlay {
    background-color: var(--rouge);
    opacity: 0.9;
}

.formation-block .inner-formation-block{
    position: relative;
    z-index: 3;
}
.formation-block .inner-formation-block h2{
    color: white;
    font-size: 2.8em;
    text-transform: uppercase;
    margin-bottom: 2em;
    opacity: 0;
    animation: fadeInUp 1s ease-out 1.5s forwards;

}
.formation-block .inner-formation-block h2 .pre-titre{
    font-size: 0.6em;
    text-transform: initial;
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translateY(20px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}

.formation-block .wp-block-buttons{
    opacity: 0;
    animation: fadeInUp 1s ease-out 2.5s forwards;
}
.formation-block .wp-block-button{
    font-size: 14px;
    line-height: 150%;
    width: 245px;
    max-width: 100%;
}
.formation-block .wp-block-button strong{
    font-size: 18px;
    text-transform: uppercase;
}

.formation-block .wp-block-button__link{
    border: 2px solid white;
}
.contener_descendre {
    position: absolute;
    bottom: 40px;
    left: calc(50% - 26px);
    z-index: 2;
    height: 184px !important;
    text-align: center;
    opacity: 0;
    animation: fadeInUp 1s ease-out 3.5s forwards;
    min-height: 184px !important;
}
.descendre {
    width: 35px;
    height: 35px;
    object-fit: contain;
}
.bulles_header {
    width: 50px;
}

.carte-accueil{
    position: relative;
    width: 100%;
    /*max-width: 1054px !important;*/
    padding: 15px;
}
.carte-accueil img{
    width: 100%;
    height: auto;
    border-radius: 15px;
}

#presentation-cap .wrapper-sm img{
    border-radius: 15px;
}

#presentation-cap .wp-block-button__link {
    min-width: 200px;
}

/*** actus ***/
section#actualites{
    background-color: var(--gris);
}
section#actualites h2{
    text-align: center;
    color: var(--rouge);
}
#diapo-actus{
    max-width: 1200px;
    padding: 30px;
    margin-left: auto;
    margin-right: auto;
}

.slick-item{
    padding: 10px;
}
.slick-item a{
    text-decoration: none;
}
.post-thumbnail{
    width: 100%;
}
.post-thumbnail img{
    width: 100%;
    height: 300px;
    object-fit: cover;
    object-position: center;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    background: white;
}
.post-info{
    width: 100%;
    background-color: white;
    padding: 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
}
.post-date{
    font-size: 0.9em;
    line-height: 150%;
    text-align: center;
    display: block;
    color: black;
}
.post-title{
    color: var(--rouge);
    text-align: center;
    line-height: 150%;
}

/* ************************ PAGE FORMATIONS ************************ */
.page_formations{
    position: relative;
    width: 100%;
    background-color: var(--gris);
}

.categorie-formations{
    padding-bottom: 60px;
}
.categorie-formations h2, .listing-formations-pt h2{
    text-align: center;
    margin-bottom: 30px;
}
.listing-formations-pro .categorie-formations h2{
    color: var(--bleu_fonce);
}
.listing-formations-loisir .categorie-formations h2{
    color: var(--rouge);
}
#listing-formations{
    width: 100%;
    max-width: 1600px;
    margin-left: auto;
    margin-right: auto;
    padding: 50px 15px;
}

.liste_formations{
    gap: 30px;
}
.element_formation{
    width: calc(30% - 15px);
    background-color: white;
    border-radius: 15px;
    overflow: hidden;
}

.photo-formation{
    position: relative;
    width: 100%;
    height: 250px;
}
.photo-formation img{
    position: absolute;
    top: 0;
    left: 0;
    width:  100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    filter: grayscale(100%) contrast(120%) brightness(95%);
    transition: all 0.2s ease-in-out;
}
.element_formation:hover .photo-formation img{
        filter: grayscale(0);
}

.description-formation{
    padding: 15px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;
}

.description-formation h3{
    text-align: center;
}
.listing-formations-pro .description-formation h3{
    color: var(--bleu_fonce);
}
.listing-formations-loisir .description-formation h3{
    color: var(--rouge);
}

.btns-formation{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 10px;
    gap: 10px;
    width: 100%;
    flex-wrap: wrap;
}
.btns-formation a{
    display: block;
    padding: 10px;
    border-radius: 5px;
    text-align: center;
    width: calc(50% - 10px);
    text-decoration: none;
    line-height: 150%;
    box-sizing: border-box;
    transition: all 0.2s ease-in-out;
}
.btns-formation a:hover{
    opacity: 0.8;
}

.listing-formations-pro .btns-formation a:first-child{
    background-color: var(--bleu_fonce);
    color: white;
    border: 1px solid  var(--bleu_fonce);
}
.listing-formations-loisir .btns-formation a:first-child{
    background-color: var(--rouge);
    color: white;
    border: 1px solid  var(--rouge);
}
.listing-formations-pro .btns-formation a:last-child{
    background-color: transparent;
    color: var(--bleu_fonce);
    border: 1px solid  var(--bleu_fonce);
}
.listing-loisir-pro .btns-formation a:first-child{
    background-color: var(--rouge);
    color: white;
    border: 1px solid  var(--rouge);
}
.loisir-formations-pro .btns-formation a:last-child{
    background-color: transparent;
    color: var(--rouge);
    border: 1px solid  var(--rouge);
}

.infos-formation li{
    list-style: circle;
    line-height: 120%;
    margin-bottom: 5px;
}
.infos-formation li:last-child{
    margin-bottom: 0;
}

.certifications.partie_basse {
    box-shadow: 0 0 65px rgba(0, 0, 0, 0.2);
    text-align: center;
    padding: 30px 15px;
    background-color: white;
}
.liste_certifications img {
    object-fit: contain;
    padding: 15px;
    cursor: pointer;
    margin: 15px;
    width: 180px;
    height: 150px;
}


/*** cartes plateau techniques ***/
.main-container {
    position: relative;
    background: #ecf0f1;
}
.sticky-wrapper {
    display: flex;
    gap: 0;
}
.list-section {
    flex: 0 0 50%;
    padding: 30px;
    background: var(--gris);
    position: relative;
}
.inner-list-section{
    position: relative;
    padding: 30px;
    width: 100%;
}
.inner-list-section h2{
    margin-bottom: 30px;
    color: var(--bleu_fonce);
}
.inner-list-section hr{
    margin-top: 50px;
    margin-bottom: 50px;
}
.liste_plateaux_tech{
    margin-bottom: 50px;
    margin-top: 15px;
    gap: 10px;
}
.element_plateaux_tech {
    position: relative;
}
.element_plateaux_tech img{
    object-fit: contain;
    object-position: bottom;
    margin: 0 auto;
    display: block;
    height: 100px;
    width: 100%;
}
.element_plateaux_tech a{
    color: var(--bleu);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    padding: 15px;
    width: 220px;
    box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
    background-color: white;
    box-sizing: border-box;
    min-height: 220px;
}
.element_plateaux_tech h4,
.element_plateaux_tech h3{
    text-align: center;
    margin-top: 10px;
}
.map-section {
    flex: 0 0 50%;
    background: var(--bleu_fonce);
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    height: calc(100vh - 62px);
    min-height: calc(100vh - 62px);
}
.map-section.is-fixed {
    position: fixed;
    top: 62px;
    right: 0;
    width: 50%;
    height: calc(100vh - 62px);
}
.map-section.is-bottom {
    position: absolute;
    bottom: 0;
    right: 0;
    width: 50%;
    height: calc(100vh - 62px);
}


/*** Formations loisir ***/
#formations-loisir{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
}
#formations-loisir #header{
    order: 2;
    width: 100%;
    padding: 0;
    margin: 0;
}
#formations-loisir #mea-formations{
    top: 0 !important;
    height: auto !important;
    min-height: auto !important;
}
/*#formations-loisir #mea-formations > *{
    height: auto !important;
    min-height: auto !important;
    padding: 150px 30px;
}
#formation-camaret.formation-block .overlay {
    background-color: black;
    opacity: 0.5;
}
#formation-trebeurden.formation-block .overlay {
    background-color: black;
    opacity: 0.5;
}
*/
#formation-camaret.formation-block .overlay {
    background-color: black;
    opacity: 0.5;
}
#formation-trebeurden.formation-block .overlay {
    opacity: 0.9;
    background-color: var(--rouge);
}

/*#formation-trebeurden img.formation-img,
#formation-camaret img.formation-img{
    filter: grayscale(0);
}*/
#formations-loisir .certifications.partie_basse{
    width: 100%;;
}
#formation-camaret .inner-formation-block h2,
#formation-trebeurden .inner-formation-block h2,
#formation-camaret .wp-block-buttons,
#formation-trebeurden .wp-block-buttons{
    animation: none;
    opacity: 1;
}

/*** Galerie photos ***/
#bandeau-photos{
    padding: 10px;
}
.liste_photos_secondaire {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(6, 1fr);
}
.liste_photos_secondaire .photo-item {
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}
.liste_photos_secondaire img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
@media (max-width: 1024px) {
    .liste_photos_secondaire {
        grid-template-columns: repeat(3, 1fr);
    }
}
@media (max-width: 600px) {
    .liste_photos_secondaire {
        grid-template-columns: repeat(2, 1fr);
    }
}

#bandeau-nav-loisir{
    padding: 15px;
    background-color: #D43E32;
    gap: 10px;
}
.btn-nav-loisir{
    display: block;
    padding: 5px;
    border-radius: 5px;
    background-color: white;
    color: var(--rouge);
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    width: 200px;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}
.btn-nav-loisir:hover{
    background-color: #ffd1ce;
}

#bandeau-nav-pro{
    padding: 15px;
    background-color: #021832;
    gap: 10px;
}
.btn-nav-pro{
    display: block;
    padding: 5px;
    border-radius: 5px;
    background-color: white;
    color:  var(--bleu_fonce);
    font-weight: bold;
    line-height: 120%;
    text-align: center;
    width: 200px;
    text-decoration: none;
    transition: all 0.2s ease-in-out;
}
.btn-nav-pro:hover{
    background-color:#97afcc;
}
.btn-nav-pro p, .btn-nav-loisir p{
    margin: 0;
    text-align: center;
    line-height: 120%;
    min-height: 38px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.bandeau_tags.is-fixed {
    position: fixed;
    left: 0;
    right: 0;
    z-index: 9;
}

/* ************************ PAGE DETAIL FORMATIONS ************************ */

.wrapper_parties{
    display: flex;
}
.partie_secondaire{
    width: 750px;
    background-color: var(--bleu_fonce);
    color: white;
    padding: 45px;
}
.partie_principale{
    width: calc(100vw - 750px);
    background-color: var(--gris);
}
#contenu_formation_detail{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: space-between;    
}

.inner-partie-principale{
    padding: 45px;
}

.contenu_gutenberg.contener_infos_formation{
    padding-top: 0;
}
.contenu_gutenberg.contener_infos_formation h3{
    color: white;
    margin-top: 0;
    margin-bottom: 0;
}
.sous_titre_infos_form {
    border-bottom: solid 1px white;
    padding-bottom: 15px;
}
.sous_titre_infos_form img{
    vertical-align: middle;
    margin-right: 10px;
}
.contenu_gutenberg .element_infos_formation{
    margin-top: 30px;
}
.contenu_gutenberg .element_infos_formation:first-child{
    margin-top: 0;
}
.chiffres_formations {
    margin-top: 50px;
}
.chiffres_formations > * {
    width: 45%;
    min-height: 110px;
    padding: 15px;
    border: solid 1px white;
    text-align: center;
    color: white;
    margin: 5px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.taux_reussite {
    background-color: white;
    color: var(--bleu_fonce)
}
.chiffres_formations p{
    font-size: 12px;
    margin-bottom: 10px;
}
.contenu_gutenberg.contener_infos_formation > *:last-child,
.contenu_gutenberg.contener_formation_detail > *:last-child{
    margin-bottom: 50px;
}

.element_infos_formation a{
    text-decoration: none;
    color: white;
}
.element_infos_formation a:hover{
    text-decoration: underline;
}

/*** Fil Arianne Formation Pro ***/
.breadcrumb-with-dropdown {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-bottom: 30px;
    font-size: 14px;
    flex-wrap: wrap;
}

.breadcrumb-with-dropdown > a{
    color: var(--bleu_fonce)
}  

.dropdown-wrapper {
    position: relative;
    display: inline-block;
}

.dropdown-trigger {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    background: white;
    border: 2px solid var(--bleu);
    border-radius: 6px;
    cursor: pointer;
    color: #333;
    font-weight: 600;
    transition: all 0.3s ease;
}

.dropdown-trigger:hover {
    background: #f0f7ff;
}

.dropdown-icon {
    transition: transform 0.3s ease;
    font-size: 10px;
}

.dropdown-wrapper.open .dropdown-icon {
    transform: rotate(180deg);
}

.dropdown-menu {
    position: absolute;
    top: calc(100% + 5px);
    left: 0;
    min-width: 300px;
    background: white;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    box-shadow: 0 4px 12px rgba(0,0,0,0.15);
    display: none;
    z-index: 1000;
}

.dropdown-wrapper.open .dropdown-menu {
    display: block;
}

.dropdown-menu a {
    display: block;
    padding: 12px 16px;
    color: #333;
    text-decoration: none;
    transition: background 0.2s ease;
    border-bottom: 1px solid #f0f0f0;
}

.dropdown-menu a:last-child {
    border-bottom: none;
}

.dropdown-menu a:hover {
    background: #f8f9fa;
    color: #0066cc;
}

.dropdown-menu a.current {
    background: #f0f7ff;
    color: var(--bleu);
    font-weight: 600;
}

.titre_page_formation{
    text-align: center;
}
.titre_page_formation h1{
    color: var(--bleu_fonce)
}
.titre_page_formation span{
    padding: 10px 5px 20px 5px;
    color: var(--bleu_fonce);
    display: block;
    font-style: italic;
    opacity: 0.6;
}

.bouton {
    text-align: center;
    position: relative;
    z-index: 2;
}
.bouton_orange a {
    background-color: #ec6357;
    color: white;
}
.bouton a {
    padding: 12px 46px;
    border-radius: 60px;
    text-transform: uppercase;
    font-family: 'Dosis', sans-serif;
    font-weight: 500;
    font-size: 1.2em;
    text-decoration: none;
    margin: 15px auto 25px auto;
    display: inline-block;
}

.contener_formation_detail.contenu_gutenberg{
    padding-top: 30px;
}

/*** Plateau technique detail foramtion ***/
.bandeau_plateau_technique_formation{
    margin-left: auto;
    margin-right: auto;
    max-width: 900px;
    width: 100%;
}
.picto-localisation{
    display: block;
    margin-left: auto;
    margin-right: auto;
}
.mea_plateaux_tech_formation {
    text-align: center;
    display: block;
    padding: 15px;
    position: relative;
}
.mea_plateau_trebeurden {
    margin-bottom: 30px;
    position: relative;
    font-size: 1.2em;
    text-transform: uppercase;
}
.mea_plateau_trebeurden a, .liste_plateaux_tech_formation a{
    text-decoration: none;
    font-weight: bold;
    line-height: 150%;
}

/*** Photos formations pro ***/
#formations_pros .liste_photos_secondaire{
    grid-template-columns: repeat(5, 1fr) !important;
    gap: 0 !important;
}
#formations_pros  #bandeau-photos {
    padding: 0 !important;
}


/* ************************ PAGE CONTACT ************************ */

#page-contact .partie_secondaire,
#page-contact .partie_principale{
    width: 50%;
}
.titre_page_contact h1{
    text-align: center;
}
.intro_pages{
    line-height: 140%;
}
#contenu_page_detail .intro_pages img {
    width: 25px;
    height: 20px;
    object-fit: contain;
    object-position: center;
}
#contenu_page_detail .intro_pages .flex{
    gap: 8px;
    margin-top: 15px;
}
#contenu_page_detail .intro_pages .wp-block-column {
    padding: 25px;
    border-radius: 15px;
}
#contenu_page_detail .intro_pages .wp-block-columns{
    gap: 25px;
}

.contener_formulaire{
    width: 100%;
    max-width: 600px;
    margin-left: auto;
    margin-right: auto;
}
.contener_formulaire h2 {
    font-size: 2.5em;
    font-family: 'Dosis', sans-serif;
    line-height: 140%;
    text-align: center;
    color: white;
    margin-top: 0 !important;
}
.contener_formulaire input,
.contener_formulaire textarea,
.contener_formulaire select {
    width: 100%;
    background-color: white;
    padding: 15px 25px;
    border: none;
    color: #00569a;
    margin: 7px 0;
    font-family: 'Open Sans', sans-serif;
    font-size: 0.9em;
}
.contener_formulaire input::placeholder,
.contener_formulaire textarea::placeholder,
.contener_formulaire select::placeholder {
    color: #00569a;
    font-family: 'Open Sans', sans-serif;
    font-size: 0.9em;
}
.contener_formulaire textarea{
    height: 150px;
}
.mentions_formulaire {
    font-size: 0.8em;
}
.mentions_formulaire,
.mentions_formulaire a {
    color: white;
}
.mentions_formulaire input {
    width: inherit;
    margin: 0;
}
.wpcf7-list-item {
    margin: 0;
}
.mentions_formulaire > * {
    margin-bottom: 5px;
    display: block;
}
.bouton_formulaire {
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}
.wpcf7-submit {
    border-radius: 60px;
    width: inherit !important;
    color: white !important;
    background-color: #ec6357 !important;
    text-transform: uppercase;
    font-family: 'Dosis', sans-serif !important;
    font-size: 1.2em !important;
    letter-spacing: 1px;
    padding: 15px 135px !important;
    margin-bottom: 25px !important;
    transition: all 0.2s ease-in-out;
}
.wpcf7-submit:hover {
    opacity: 0.8;
}

.contenu_gutenberg .wpcf7 p{
    margin-top: 5px;
    margin-bottom: 5px;;
}

.demarchage_tel,
.demarchage_tel p{
    font-size: 12px;
    font-style: italic;
    margin-top: 25px;
}
.demarchage_tel strong {
    color: white;
    margin-bottom: 10px;
    display: block;
}
.demarchage_tel p {
    color: white;
}
.demarchage_tel span {
    color: #ec6357;
    display: block;
}
.demarchage_tel span a {
    color: #ec6357;
}


#page-contact #osm-map{
    position: relative;
    z-index: 1;
    margin-top: 50px;
    border-radius: 15px;
}

/*** Photos formations pro ***/
#page-contact .liste_photos_secondaire{
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 0 !important;
}
#page-contact  #bandeau-photos {
    padding: 0 !important;
}

#page-contact  .partie_principale{
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

/*** liens croisés ***/
#autres-formations::before{
    position: absolute;
    content: "";
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background-color: var(--bleu_fonce);
    left: 50%;
    top: 0;
    transform: translateX(-50%);
}
#autres-formations{
    position: relative;
    margin-top: 34px;
    padding: 30px 15px;
}
#autres-formations h2{
    text-align: center;
    font-size: 1.5em;
    color: var(--bleu_fonce);
    margin-bottom: 30px;;
}
#autres-formations h2 span{
    font-size: 0.8em;
}
#inner-autres-formations{
    gap: 10px;
}
#inner-autres-formations a{
    display: block;
    text-decoration: none;
    background-color: white;
    color: var(--bleu_fonce);
    border-radius: 15px;
    transition: all 0.2s ease-in-out;
    padding: 15px 30px;
    font-weight: bold;;
}
#inner-autres-formations a:hover{
    background-color: #D2D8E7;
}

/* ************************ PAGE DEFAUT ************************ */
/* Gutenberg */
.contenu_gutenberg{
    position: relative;
    width: 100%;
    padding: 50px 0 0 0;
}

.contenu_gutenberg > *{
    max-width: 900px;
    margin: 0 auto;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
}

.contenu_gutenberg > .wp-block-cover, .contenu_gutenberg > .wp-block-group{
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}
.contenu_gutenberg .colonnes-pleine-largeur{
    max-width: 100%;
    padding: 0;
}
.contenu_gutenberg > .wp-block-media-text.colonnes-pleine-largeur:first-child{
    margin-top: -50px;
    margin-bottom: 0;
    min-height: calc(100vh - 62px);
}
.contenu_gutenberg > .wp-block-media-text.colonnes-pleine-largeur .wp-block-media-text__content{
    padding-top: 65px;
    padding-bottom: 65px;
}
.contenu_gutenberg .wp-block-media-text.colonnes-pleine-largeur{
    padding: 0;
}
.wp-block-media-text.is-image-fill-element .wp-block-media-text__media{
    position: relative;
    min-height: 500px;
}
.wp-block-media-text.is-image-fill-element .wp-block-media-text__media img{
    position: absolute;
    top: 0;
    left: 0;
}

.contenu_gutenberg > .wp-block-cover > .wp-block-cover__inner-container, .contenu_gutenberg > .wp-block-group > .wp-block-group__inner-container{
    max-width: 900px;
    padding-left: 15px;
    padding-right: 15px;
    box-sizing: border-box;
    margin-left: auto;
    margin-right: auto;
}

 .contenu_gutenberg > .wp-block-group#mainContainer > .wp-block-group__inner-container{
    max-width: 100%;
    padding-left: 0;
    padding-right: 0;
}

.contenu_gutenberg .intro_pages.wp-block-group .wp-block-group__inner-container{
    max-width: 768px;
    padding: 15px;
    width: 100%;
}

.contenu_gutenberg p{
    margin-bottom: 15px;
    line-height: 140%;
}
.contenu_gutenberg p.has-text-align-center{
    text-align: center;
}
.contenu_gutenberg p.has-text-align-left{
    text-align: left;
}
.contenu_gutenberg p.has-text-align-right{
    text-align: right;
}
.contenu_gutenberg p.has-background{
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 15px;
}

.contenu_gutenberg ul,
.contenu_gutenberg ol{
    margin-bottom: 15px;
    padding-left: 35px;
}
.contenu_gutenberg .wp-block-group__inner-container > ul,
.contenu_gutenberg .wp-block-group__inner-container > ol{
    padding: 0;
    padding-left: 20px;
}
.contenu_gutenberg ul li,
.contenu_gutenberg ol li{
    line-height: 140%;
    list-style-position: outside;
    padding-bottom: 5px;
}
.contenu_gutenberg .wp-block-group, .contenu_gutenberg .wp-block-columns, .contenu_gutenberg .wp-block-media-text{
    margin-top: 30px;
    margin-bottom: 30px;
    padding: 15px;
}
.contenu_gutenberg .wp-block-buttons, .contenu_gutenberg .wp-block-table{
    margin-top: 30px;
    margin-bottom: 30px;
}
.wp-block-button{
    line-height: 140%;
}
.wp-block-button__link{
    transition: all 0.2s ease-in-out;
}
.wp-block-button__link:hover{
    opacity: 0.8;
}

.contenu_gutenberg .wp-block-columns .wp-block-media-text{
    padding: 0;
    margin-top: 0;
    margin-bottom: 0;
}

.contenu_gutenberg .wp-block-image{
    margin-top: 30px;
    margin-bottom: 30px;    
}

.wp-block-image.ombre img{
    box-shadow: 0 0 10px 1px rgba(41, 56, 115, 0.4);
}

.contenu_gutenberg .wp-block-group.titre-section{
    margin-top: 0;
    margin-bottom: 0;
    padding: 0;
}

.contenu_gutenberg .wp-block-group.titre-section .wp-block-image{
    margin-top: 30px;
    margin-bottom: 0;
}

.wp-block-image.aligncenter{
    margin-left: auto;
    margin-right: auto;
}

.contenu_gutenberg h2{
    margin-top: 30px;
    margin-bottom: 20px;
}

.contenu_gutenberg h3{
    margin-top: 20px;
    margin-bottom: 15px;
}

.contenu_gutenberg h4{
    margin-top: 20px;
    margin-bottom: 15px;
}

.contenu_gutenberg > *:last-child,
.contenu_gutenberg .wp-block-columns p:last-child, .contenu_gutenberg .wp-block-media-text p:last-child,
.contenu_gutenberg .wp-block-columns ul:last-child, .contenu_gutenberg .wp-block-media-text ul:last-child,
.contenu_gutenberg .wp-block-columns ol:last-child, .contenu_gutenberg .wp-block-media-text ol:last-child{
    margin-bottom: 0;
}

.contenu_gutenberg > *:firs-child,
.contenu_gutenberg .wp-block-columns p:firs-child, .contenu_gutenberg .wp-block-media-text p:firs-child,
.contenu_gutenberg .wp-block-columns ul:firs-child, .contenu_gutenberg .wp-block-media-text ul:firs-child,
.contenu_gutenberg .wp-block-columns ol:firs-child, .contenu_gutenberg .wp-block-media-text ol:firs-child{
    margin-top: 0;
}

.wp-block-columns.colonnes-sous-pages{
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}
.wp-block-columns.colonnes-sous-pages .wp-block-button__link{
    width: 160px;
    height: 160px;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    font-weight: bold;
}
.wp-block-columns.colonnes-sous-pages .wp-block-column,
.wp-block-columns.colonnes-sous-pages:not(.is-not-stacked-on-mobile)>.wp-block-column{ display: block !important; width: 160px !important; flex-basis: unset !important; text-align: center !important; margin-left: auto; margin-right: auto;}

.wp-block-columns.colonnes-sous-pages .wp-block-buttons {
    margin-top: 0;
    margin-bottom: 0;
}
.contenu_gutenberg > *:last-child{
    margin-bottom: 65px;
}
.contenu_gutenberg > .wp-block-group:last-child,
.contenu_gutenberg > .wp-block-cover:last-child{
    margin-bottom: 0px;
}

.contenu_gutenberg .wp-block-group + .wp-block-columns{
    margin-top: 0;
}
.contenu_gutenberg > .wp-block-cover + .wp-block-group,
.contenu_gutenberg > .wp-block-group + .wp-block-cover{
        margin-top: 0 !important;
}
.contenu_gutenberg > * + .wp-block-cover{
        margin-top: 65px !important;
}
.contenu_gutenberg .intro_pages.wp-block-group{
    margin-top: 0;
    margin-bottom: 0;
}
.contenu_gutenberg .intro_pages.wp-block-group + .wp-block-cover {
    margin-top: 50px !important;
}
.header-formation .intro_pages > *:last-child{
    margin-bottom: 45px;
}


/*** PAGE NOS LOCAUX ***/
body.page-id-860 .contenu_gutenberg{
    padding-top: 0;
}
.contenu_gutenberg .wp-block-group#mainContainer{
    margin: 0;
    padding: 0;
}
#colonnes-locaux{
    position: relative;
    margin: 0;
    padding: 0;
    gap: 0;
    display: block;
}
#mapSection{
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
}
#mapSection.is-fixed {
    position: fixed;
    top: 62px;
}
#mapSection.is-bottom {
    position: absolute;
    bottom: 0;
    top: auto;
    right: 0;
    width: 50%;
    height: calc(100vh - 62px);
}
#listSection,
#mapSection{
    flex-basis: unset !important;
    width: 50% !important;
}
#colonnes-locaux #listSection{
    padding: 30px;
}
#colonnes-locaux .wp-block-columns .wp-block-column.has-background{
    border-radius: 15px;
    overflow: hidden;
}
#colonnes-locaux .wp-block-columns .wp-block-column.has-background > *{
    padding: 0 15px;
    margin: 0;
    margin-bottom: 15px;
}
#colonnes-locaux .wp-block-columns .wp-block-column.has-background > *:last-child{
    margin-bottom: 30px;
}
#colonnes-locaux .wp-block-columns .wp-block-column.has-background > .wp-block-sliderberg-sliderberg,
#colonnes-locaux .wp-block-columns .wp-block-column.has-background > .wp-block-image{
    padding: 0;
    margin: 0;
}
#colonnes-locaux  .sliderberg-navigation-bar-bottom{
    display: none;
}
#colonnes-locaux h2{
    margin-top: 20px !important;
    margin-bottom: 20px !important;
    line-height: 120%;
    font-size: 1.6em;
    color: var(--bleu_fonce)
}

#mapSection #osm-map{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}


/* ************************ MAPS ************************ */
#osm-map{
    width: 100%;
    min-height: 500px;
}
/* ************************ PAGE CONTACT ************************ */


/* ************************ PAGE ERREUR (404) ************************ */


/* ************************ PAGE DEMARCHE RSE ************************ */
.titre-mobile{ 
    display: none;
    margin-top: 30px;
    margin-bottom: 30px;
}

#bandeau_demarche_rse {
    background: #08254b;
    background: radial-gradient(#0071B0, #08254b);
    position: relative;
    padding: 50px 5px;
    padding-top: 0;
    min-height: calc(100vh - 100px);
    overflow: hidden; /* Empêche la bulle de dépasser les limites */
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

#bandeau_demarche_rse .fil_ariane{
    display: none;
    transition: all 0.2s ease-in-out;
}

#bandeau_demarche_rse  .fil_ariane,
#bandeau_demarche_rse  .fil_ariane a{
    color: white;
    text-align: center;
}
#bandeau_demarche_rse .contener_principale {
    position: relative;
    max-width: 1550px;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 0;
}

#bandeau_demarche_rse .contener_principale h1{
    background-color: #ec6357;
    color: white;
    text-transform: uppercase;
    border-radius: 30px;
    text-align: center;
    padding: 8px 12px;
    max-width: fit-content;
    margin: 0 auto;
    font-size: 20px;
    opacity: 0;
    transition: all 0.2s ease-in-out;
}

#grille-demarche-rse{
    margin-left: auto;
    margin-right: auto;
    min-height: calc(100vh - 200px);
}

.parent {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: 1.5fr 2fr 1fr repeat(4, 0.5fr) 1.1fr;
    grid-column-gap: 5px;
    grid-row-gap: 5px;
}
.div1 { grid-area: 1 / 1 / 2 / 2; }
.div2 { grid-area: 1 / 2 / 3 / 3; }
.div3 { grid-area: 2 / 1 / 4 / 2; }
.div4 { grid-area: 3 / 2 / 7 / 3; }
.div5 { grid-area: 4 / 1 / 8 / 2; }
.div6 { grid-area: 7 / 2 / 9 / 3; }

.div1{ text-align: center;}
.div2 .bulle{ position: relative; margin-right: auto; margin-left: 0;}
.div3 .bulle{ position: relative; margin-right: 0; margin-left: auto;}
.div4 .bulle{ position: relative; margin-right: auto; margin-left: 0;}
.div5 .bulle{ position: relative; margin-right: 0; margin-left: auto;}
.div6 .bulle{ position: relative; margin-right: auto; margin-left: 0;}

#grille-demarche-rse .bulle{
    width: 100%;
    height: 100%;
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
    cursor: pointer;
}

.bulle .inner-bulle{
    position: relative;
    z-index: 2;
    opacity: 0;
    transition: all 0.2s ease-in-out;

}

.bulle img{
    max-width: 80px;
    display: block;
    margin: 0 auto;
}

.bulle h2{
    text-transform: uppercase;
    color: #ec6357;
    margin: 0px;
    line-height: 100%;
}
.bulle h2 p{
    margin-bottom: 0;
    line-height: 100%;
    text-align: center;
}
.contenu-bulle-01{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
    max-width: 358px;
    margin-right: 0;
    margin-left: auto;
}

.bulle:after{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border-radius: 50%;
    border: 2px solid white;
    box-shadow: inset 0 0 20px 1px rgb(255, 255, 255, 0.5);
    z-index: 1;
    transform-origin: 0;
    opacity: 0;
    transition: all 0.2s ease-in-out;
    box-sizing: border-box;
}

.bulle.animate:hover{
    animation: bubbleWobble 0.5s ease;
}

.bulle.animate .inner-bulle{
    animation: show 0.5s ease-out forwards;
}
.bulle.animate:after{
    animation: rise 2s linear forwards, sideways 2s ease-in-out forwards;
}

.div2 .bulle:after{ animation-delay: 0.2s }
.div2 .bulle .inner-bulle{ animation-delay: 2.2s }
.div3 .bulle:after{ animation-delay: 0.4s }
.div3 .bulle .inner-bulle{ animation-delay: 2.4s }
.div4 .bulle:after{ animation-delay: 0.6s }
.div4 .bulle .inner-bulle{ animation-delay: 2.6s }
.div5 .bulle:after{ animation-delay: 0.8s }
.div5 .bulle .inner-bulle{ animation-delay: 2.8s }
.div6 .bulle:after{ animation-delay: 1s }
.div6 .bulle .inner-bulle{ animation-delay: 3s }

.bulle.clicked{
    animation: bubblePop 0.4s ease-in-out forwards;
    animation-delay: 0s;
}


@keyframes rise {
  0% {
    transform: translateY(100%);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}


@keyframes sideways {
    0% {
        margin-left: 0;
    }
    25%{
        margin-left: -4%;
    }
    75%{
        margin-left: 4%;
    }
    0% {
        margin-left: 0;
    }
}


@keyframes show {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}

@keyframes bubbleWobble {
    0% {
        transform: scale(1);
    }
    20% {
        transform: scale(0.95);
    }
    40% {
        transform: scale(1.02);
    }
    60% {
        transform: scale(0.97);
    } 
    80% {
        transform: scale(1.05);
    } 
    100% {
        transform: scale(1);
    } 
}

@keyframes bubblePop {
    0% {
        transform: scale(1);
        opacity: 1;
    }
    20% {
        transform: scale(0);
        opacity: 0.6;
    }
    100% {
        transform: scale(0.5);
        opacity: 0;
    }
}

.popup {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none; /* Cachée par défaut */
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
}

.popup-content {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: transparent;
    border-radius: 10px;
    padding: 20px;
    text-align: center;
    max-width: 400px;
    width: 90%;
    transform: scale(0); /* Commence avec un zoom réduit */
    transition: transform 0.3s ease, opacity 0.3s ease; /* Effet de zoom et d'opacité */
    opacity: 0; /* Cachée par défaut */
    color: white;
}

.popup-content:before{
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 450px;
    height: 450px;
    background: #00569a;
    border: 2px solid white;
    border-radius: 50%;
    transform: translateY(-50%) translateX(-50%);
    box-shadow: inset 0 0 20px 1px rgb(255, 255, 255, 0.5);
}

.popup.open .popup-content {
  transform: scale(1); /* Zoom jusqu'à sa taille normale */
  opacity: 1;
}

.close {
  position: absolute;
  top: 10px;
  left: 50%;
  transform: translateX(-50%);
  cursor: pointer;
  font-size: 20px;
  font-weight: bold;
  color: white;
}

.popup-content h2{
    text-transform: uppercase;
    color: #ec6357;
    position: relative;
}
.popup-content  ul{
    padding: 0; 
}
.popup-content  ul li{
    position: relative;
    list-style: none;
    margin-bottom: 10px;
    margin-left: 0px;
}
.popup-content ul li span{
    position: relative;
}
.popup-content  ul li span:before{
    content: "";
    position: absolute;
    width: 8px;
    height: 8px;
    top: 7px;
    border: 1px solid #ec6357;
    left: -16px;
    border-radius: 50%;
}

@media only screen and (max-width: 950px) {
    #bandeau-mobile{display: block;}
    #bandeau-ecran{display: none;}
}

@media only screen and (max-width: 500px) {
    .titre-mobile{ display: block; }
    .contenu-bulle-01{ display: none; }
    .bulle:after{ box-shadow: inset 0 0 10px 1px rgb(255, 255, 255, 0.4); border: 1px solid white;}
    .bulle:hover:after{box-shadow: inset 0 0 15px 1px rgb(255, 255, 255, 0.6);}
    .el-preheader{ display:flex; flex-direction:column; align-items:flex-end; justify-content:center; }
    .el-preheader .sep-preheader{ display:none; }
    #header_pages > nav:first-child{ width: 60px; }
    #header_pages > nav:first-child > *{ width: 100%; }
    #header_pages > .menu_fixe{ width: 60px; }
    .preheader{ width: calc(100% - 120px); left: 80px; }
    #grille-demarche-rse{ min-height: 0;}
}

/* ************************ ARTICLES ************************ */
.contener_photo_article {
    padding: 0 30px 30px 30px;
    margin-bottom: 30px;
}
.contener_photo_article img {
    max-width: 100%;;
    width: 650px;
    margin: 50px auto 0 auto;
    display: block;
    text-align: center;
    box-shadow: 0 0 46px rgba(0,0,0,0.3);
}

/* ************************ FOOTER ************************ */
.wrapper_elearning {
    background-color: #ec6357;
    box-shadow: inset 0px -75px 145px rgba(231,65,58,0.9);
    padding: 50px 25px;
    overflow: hidden;
}
.contener_elearning {
    max-width: 600px;
    margin: 0 auto;
    position: relative;
}
.contener_elearning::before {
    content: "";
    position: absolute;
    top: -140px;
    left: -7vw;
    width: 280px;
    height: 300px;
    background-image: url(/wp-content/uploads/2021/10/plongeur_bulle_01.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.9;
}
.contener_elearning::after {
    content: "";
    position: absolute;
    bottom: -40px;
    right: -12vw;
    width: 150px;
    height: 300px;
    background-image: url(/wp-content/uploads/2021/10/bulles_blanches_01.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.3;
}
.contener_elearning img {
    width: 440px;
    margin: 25px auto;
    object-fit: contain;
    display: block;
}
.contener_elearning h2 {
    text-transform: uppercase;
    color: white;
    text-align: center;
    font-size: 2.6em;
    letter-spacing: 3px;
}
.contenu_elearning {
    text-align: center;
    max-width: 490px;
    margin: 0 auto;
}

/*** Bandeau Partenaires ***/
section#bandeau-partenaires{
    background-color: white;
}
#partenaires{
    padding: 15px 30px;
}
.slick-partenaires {
  margin: 30px auto;
  max-width: 1200px;
}
.partenaire-item {
  text-align: center;
  padding: 15px;
}
.partenaire-logo {
  width: 100%;
  height: 100px;
  object-fit: contain;
  object-position: center;
  filter: grayscale(100%);
  transition: filter 0.3s ease, transform 0.3s ease;
}
.partenaire-logo:hover {
  filter: grayscale(0%);
  transform: scale(1.05);
}

#grille-partenaires{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 40px;
}

#grille-partenaires .partenaire-item{
    width: 140px;
    height: 80px;
}

#grille-partenaires .partenaire-item .partenaire-logo{
    filter: grayscale(0%);
}

#footer {
    background-color: var(--bleu);
    padding: 40px 0 0 0;
    color: white;
    box-shadow: 0px 0px 5px 5px rgba(0, 0, 0, 0.1);
    position: relative;
    z-index: 2;
}

#menu-menufooter {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.contener_footer {
    padding: 40px 15px;
    border-top: solid 1px white;
    border-bottom: solid 1px white;
}
.plan_footer {
    max-width: 1400px;
    margin: 0 auto;
}
.plan_footer ul{
    padding: 0;
}
#menu-menufooter .menu-item-has-children {
    width: 20%;
    max-width: 220px;
    margin: 0 auto;
}
#menu-menufooter .menu-item-has-children > a {
    padding-bottom: 25px;
    color: white;
    font-family: 'Dosis', sans-serif;
    font-size: 1.2em;
    display: block;
    font-weight: 600;
}
#menu-menufooter li {
    list-style: none;
}
#menu-menufooter li a {
    color: white;
    text-decoration: none;
}
#menu-menufooter .sub-menu li {
    margin-left: 0;
    line-height: 150%;
    padding-right: 10px;
    padding-left: 0;
    transition: all 0.2s ease-in-out
}
#menu-menufooter .sub-menu a {
    font-size: 0.9em;
}
#menu-menufooter .sub-menu li:hover {
    padding-right: 0;
    padding-left: 10px;
}

.fil_ariane{
    padding: 15px;
    text-align: center;
    background: #D2D8E7;
}
.fil_ariane a{
    color: var(--bleu_fonce);
}


/* ************************ COPYRIGHT ************************ */
#copyright {
    text-align: center;
    padding: 25px;
    line-height: 150%;
}
#copyright a{
    color: white;
}
.lestudio {
    background-color: white;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
}
.lestudio img {
    margin: 5px;
}


/* *** FILS RESEAUX SOCIAUX *** */
.mea_reseaux_sociaux {
    position: relative;
    z-index: 0;
    padding: 25px 0;
    overflow: hidden;
}

.contener_reseaux_sociaux {
    max-width: 1600px;
    margin: 0 auto;
}

.mea_reseaux_sociaux h2 {
    text-align: center;
}

.mea_reseaux_sociaux h3 {
    text-transform: uppercase;
    font-size: 0.9em;
}

.fb_smartphone {
    display: none;
}

.fil_facebook {
    width: 30%;
    margin: 35px;
    position: relative;
    z-index: 3;
}

.mea_reseaux_sociaux::before {
    content: "";
    position: absolute;
    top: -212px;
    left: 20vw;
    z-index: 0;
    width: 200px;
    height: 350px;
    background-image: url(/wp-content/uploads/2021/10/bulles_bleues_01.svg);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.fil_facebook iframe {
    border: solid 10px white !important;
    border-radius: 15px;
    box-shadow: 0 0 25px rgba(29, 58, 143, 0.4);
    position: relative;
    z-index: 3;
}

.fil_instagram {
    width: 70%;
    margin: 35px;
    position: relative;
    z-index: 3;
}

#sb_instagram {
    background-color: #00569a;
    box-shadow: 0 0 25px rgba(29, 58, 143, 0.4);
}

.marker_instag {
    font-weight: 100;
    color: #00569a;
    font-size: 1.35em;
    font-family: 'Dosis', sans-serif;
    text-align: center;
    display: block;
    padding-top: 10px;
}

.fond_fil_reseaux_sociaux {
    position: absolute;
    top: 55%;
    left: 0;
    transform: translate(0, -50%);
    background-color: #00569a;
    width: 100%;
    height: 350px;
    z-index: 0;
}

.illu_vagues {
    background-image: url(/wp-content/uploads/2021/10/vagues_blanches_01.svg);
    background-size: contain;
    background-repeat: repeat;
    background-position: 100%;
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    animation: slide 70s linear infinite;
}

.sous_titre_fil_reseaux_sociau {
    background-color: white;
    padding: 15px;
}

.picto_fil_fb {
    width: 10px;
    margin-right: 10px;
}

.picto_fil_instag {
    width: 23px;
    margin-right: 10px;
}

/*** Plateaux techniques ***/
.plateaux_tech_detail #listSection{
    background-color: var(--bleu);
}
.coordonnes_centre {
    padding: 60px;
    border-radius: 600px;
    border: solid 5px white;
    text-align: center;
    color: white;
    width: 350px;
    height: 350px;
    margin: 0 auto 40px auto;
    position: relative;
}
.coordonnes_centre  .tel a, .coordonnes_centre  .mail a{
    text-decoration: none;
    padding-bottom: 10px;
    display: block;
    color: white;
}
.coordonnes_centre .site_web a {
    color: #ec6357;
    font-weight: bold;
}
.plateaux_tech_detail .map-section {
    height: 100% !important;
    min-height: 100% !important;
}
.facebook_centre img {
    width: 9px;
    object-fit: contain;
    margin: 15px auto 0 auto;
}

/*** Infobulle ***/
.leaflet-popup  h3{
    font-size: 20px;
    text-align: center;
}
.leaflet-popup  p{
    font-size: 14px;
    text-align: center;
}


/*******************************************/
/************** MEDIA QUERIES **************/
/*******************************************/

@media only screen and (min-width : 1300px) {
    .formation-block .wp-block-button{ width: 300px; font-size: 16px; }
    .formation-block .wp-block-button strong { font-size: 22px; }
    body.page-id-856 .colonnes-pleine-largeur .wp-block-buttons .wp-block-button__link{ min-width: 272px;}
}



/* ********** ECRANS EN DESSOUS DE 1550px ***********/
@media only screen and (max-width : 1550px) {
    #bloc-menu{width: calc(100% - 130px); }
    #bloc-vide{ display: none;}
    .menu_ordi .menu li{ width: auto;}
}
@media only screen and (max-width : 1500px) {
    .partie_secondaire{ width: 40%; padding: 45px;}
    .partie_principale{width: 60%;}
}


/* ********** ECRANS EN DESSOUS DE 1300px ***********/
@media only screen and (max-width : 1300px) {
    #page-contact .partie_secondaire,
    #page-contact .partie_principale .inner-partie-principale{
        padding: 25px;
    }
}


/* ********** ECRANS EN DESSOUS DE 1220px ***********/
@media only screen and (max-width : 1220px) {
    .liste_formations{ gap: 15px;}
    .element_formation{ width: calc(33% - 15px);}
}


/* ********** ECRANS EN DESSOUS DE 1023px ********** */
@media only screen and (max-width : 1023px) {
    .menu_ordi{ display: none; }
    .menu_mobile{ display: block; }
    .element_formation{ width: calc(50% - 8px);}
    .sticky-wrapper{ flex-wrap: wrap; }
    .list-section{ flex: 100%; }
    .map-section, .map-section.is-fixed, .map-section.is-bottom{ flex: 100%; width: 100%; height: 60vw; min-height: 60vw; position: relative; }
    #mapSection{ position: relative !important; width: 100% !important; height: 60vw !important; min-height: 60vw !important;}
    #listSection{ width: 100% !important; }
    #mapSection #osm-map{ min-height: 60vw !important;}
    .wrapper_parties{ flex-wrap: wrap;}
    .partie_secondaire{ width: 100%; padding: 45px; order: 2;}
    .partie_principale{width: 100%; order: 1;}
    #page-contact .partie_secondaire,
    #page-contact .partie_principale{ width: 100%;}
    .bandeau_tags{ display: none;}

}


/* ********** ECRANS EN DESSOUS DE 900px ********** */
@media only screen and (max-width : 900px) {
    #menu-menufooter{ gap: 30px; justify-content: flex-start;}
    #menu-menufooter .menu-item-has-children{ width: calc(50% - 15px); max-width: none; margin: 0; margin-bottom: 30px;}
    .contener_footer { padding: 40px 30px;}
    .wp-block-media-text.is-stacked-on-mobile {
        grid-template-columns: 100% !important;
    }
    .wp-block-media-text.is-stacked-on-mobile.colonnes-pleine-largeur>.wp-block-media-text__media {
        grid-row: 2 !important;
        grid-column: 1 !important;
        height: 60vw;
    }
    .wp-block-media-text.is-stacked-on-mobile.colonnes-pleine-largeur>.wp-block-media-text__content {
        grid-row: 1 !important;
        grid-column: 1 !important;
    }
}

/* ********** ECRANS EN DESSOUS DE 767px********** */
@media only screen and (max-width : 767px) {
    body { font-size: 0.9em; }
    section#mea-formations{ flex-direction: column; top: 0;}
    #mea-formations > *{ min-height: calc(50vh - 54px); }
    #formations-loisir #mea-formations > *{ padding: 15px; min-height: calc(50vh - 54px) !important;}
    .formation-block .inner-formation-block h2{ margin-bottom: 1em;}
    .contener_descendre{ display: none;}
    #bloc-bretagne{ top: 110px;}
    #bloc-bretagne img{ width: 120px;}
    .formation-block .inner-formation-block h2{ line-height: 1.1em; }
    body.home #navigation-principale{ background-color: white;}
    body.home #navigation-principale #bloc-logo svg path{fill: var(--bleu); }
    section#presentation-cap{ padding-top: 50px;} 

    .breadcrumb-with-dropdown > a,
    .breadcrumb-with-dropdown > span{ display: none; }

}


/* ********** ECRANS EN DESSOUS DE 600px ********** */
@media only screen and (max-width: 600px) {
    .el-preheader img{ display: none;}
    #menu-menufooter .menu-item-has-children{ width: 100%; max-width: none; margin: 0; margin-bottom: 30px;}
    .element_formation{ width: 100%;}
    .list-section{ padding: 15px;}
    .map-section, .map-section.is-fixed, .map-section.is-bottom{ height: 80vw; }
    .element_plateaux_tech a{ width: calc(50% - 5px)}
    .liste_plateaux_tech, .liste_plateaux_tech div{ width: 100%;}
    .partie_secondaire{ padding: 30px;}
    .partie_principale .inner-partie-principale{ padding: 30px;}
    .wp-block-columns.colonnes-sous-pages{ padding-left: 0; padding-right: 0;}
    .wp-block-buttons>.wp-block-button.wp-block-button__width-50{ width: auto !important;}
}


/* ********** ECRANS EN DESSOUS DE 480px ********** */
@media only screen and (max-width: 480px) {
    .element_plateaux_tech a,
    .liste_plateaux_tech, .liste_plateaux_tech div{ width: 100%;}
}