@charset "utf-8";
/* CSS Document */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');


/*reinitialisation du template*/
.layout-container {
    max-width: 100%;
}
.layout-main {
	width:100%;
}

.views-view-grid.horizontal .views-row{
  border: 0;
  margin: 0;
  padding: 0;
}

#main-wrapper, .main-content-accueil{

	width: 100%;
	max-width: inherit;
	display: inline-block;

}

.block .content{
	margin-top:0;
}


.ligne{
	max-width:80%;
	margin:0 auto;
	padding:0 15px;

}
.ligne.ligne-titre {
	max-width:100%;
}
.ligne .ligne {
	padding:0;
	max-width:initial;
}

.main-content .section{
	padding:0;
}

article {
    width: 100%;
    position: relative;
}

/* general */
.view-fournisseur .view-content .views-row img, .social-sharing-buttons, #block-btncote img, a {
	transition: all 0.3s;
}

a:hover {
	border:none;
}

.main-content p {

}

.main-content h1 {

}

.main-content h2 {

}

.main-content h3 {

}
main {
    position: relative;
    z-index: 9;
}

/*Grille*/

.droite{
	justify-content: flex-end;
}

.gauche{
	justify-content: flex-start;
}

.pleine_largeur{
	max-width: inherit;
}

.colonne_1-1{
	width:100%;
}

.colonne_1-2{
	width:47.22%;
}

.colonne_1-3{
	width:29.63%;
}

.colonne_2-3{
	width:64.81%;
}

.colonne_1-4{
	width:20.83%;
}
.colonne_3-4{
	width:73.61%;
}

.colonne_1-5{
	width:16.25%;
}
.colonne_2-5{
	width:37.19%;
}

.colonne_3-5{
	width:53.44%;
}

.colonne_4-5{
	width:79.06%;
}
.flex {
	display:flex;
}
.margin {
	margin:auto;
}
.grille {
	display: grid;
	grid-template-columns: 1fr repeat(12, minmax(5px, 110px)) 1fr;
	grid-gap: 5px;
	width: 100%;
}

.fin{
	margin-right:0;
}
/*colonne fin*/
.align-left {
    float: left;
    display: block;
	margin-right:2em;
    width: auto;
}
.align-right {
    float: right;
    display: block;
	margin-left:2em;
    width: auto;
}


/*---------- RGPD --------------*/
#sliding-popup.sliding-popup-top{
	background: #5d5c5c;
}

#sliding-popup .popup-content{
	display: flex;
    padding: 7px 0;
}

#sliding-popup .popup-content #popup-text{
	margin: auto 20px auto 0;
	max-width: initial;
	text-align: center;
}
#sliding-popup .popup-content #popup-buttons{
	margin: auto 0;
	min-width: 180px;
}

#sliding-popup .popup-content #popup-buttons button{
	margin: auto 10px;
    border: 1px solid #fff;
    padding: 5px 16px;
    border-radius: 0;
    background: #fff;
    color: #2f2f2f!important;
    font-weight: 700;
    font-size: 13px;
}
#sliding-popup .popup-content #popup-buttons button:hover{
	background:transparent;
	color:#fff!important;
	text-shadow: none;
	box-shadow: none;
}
/*----------RGPD fin-----------*/

/*---------- Effets --------------*/
[type-animation="fondu"] {
	opacity: 0;
}

[type-animation="zoom"] {
	opacity: 0;
	transform: scale(0.6);
}

[type-animation="spirale"] {
	opacity: 0;
	transform-origin: top left;
	transform: rotate(145deg);
}

[type-animation="bas_haut"] {
	transform: translate(0px, 100px);
	opacity: 0;
}

[type-animation="haut_bas"] {
	transform: translate(0px, -100px);
	opacity: 0;
}

[type-animation="gauche_droite"] {
	transform: translate(-100px, 0);
	opacity: 0;
}

[type-animation="droite_gauche"] {
	opacity: 0;
	transform: translate(100px, 0);
}

.animated {
	transition-delay : 300ms;
	transition-duration : 1600ms;
	opacity: 1;
	transform: none;
}

/* --Siperfish modif --*/

ul#superfish-main {
    width: 100%;
    display: flex;
    /* iso maquette (Frame 208/2256:5392, primaryAxisAlignItems SPACE_BETWEEN
       entre le groupe [logo+liens] et le bouton "Portail CAIH") : flex-end
       collait TOUS les liens + le bouton contre le bord droit en un seul
       paquet, laissant un grand vide entre le logo et "Nos offres" au lieu
       que les liens demarrent juste apres le logo. flex-start + margin-left:
       auto sur le seul <li> du bouton (ci-dessous) reproduit le space-between
       a 2 groupes sans toucher au HTML (<ul> plat, tous les <li> au meme
       niveau). */
    justify-content: flex-start;
    font-size: 1.1em;
    white-space: nowrap;
    margin: 0;
}
ul#superfish-main li#main-menu-link-content43b9444b-6b7e-4ace-9a8e-20d0fc526d5e {
    margin-left: auto;
}
ul#superfish-main li {
	background:none;
}
ul#superfish-main li a, ul#superfish-main li a:visited, ul#superfish-main li>span {
	  background: none;
    border-radius: 0;
    text-shadow: none;
    font-weight: 400;
    color: #000;
    padding: 10px 20px;
    margin: 0;
    display: block;
    border: none;
    border-width: 0;
    cursor: pointer;
    font-size: 16px;
}

ul#superfish-main li .views-field-field-picto a {
	padding:0 20px;
}
/* CAIH-22 : bouton "Portail CAIH" iso maquette (2256:5454) - pilule bleue #006cd2
   avec icone cadenas lucide/lock-keyhole (fill blanc), au lieu du bleu marine
   #273a62 + picto raster precedents. */
ul#superfish-main li#main-menu-link-content43b9444b-6b7e-4ace-9a8e-20d0fc526d5e a {
    background-color: #006cd2;
    background-image: url(../images/icons/lock-keyhole.svg);
    background-position: 22px 50%;
    background-repeat: no-repeat;
    background-size: 18px;
    border-radius: 30px;
    color: #fff;
    /* iso maquette (2256:5454, padding 12/22/12/22) : padding-right heritait
       de 20px (generique ul#superfish-main) sans equivalent a gauche - texte
       colle au bord droit, gros vide a gauche derriere l'icone. Symetrique
       22px de base + 24px (boite icone) + 10px (gap) = 56px a gauche. */
    box-sizing: border-box;
    padding: 12px 22px 12px 56px;
}
ul#superfish-main li#main-menu-link-content43b9444b-6b7e-4ace-9a8e-20d0fc526d5e a:hover {
	  /* CAIH-36 : hover laisse a l'ancien cyan #3abccf alors que le fond par
	     defaut a ete corrige en bleu #006cd2 (CAIH-22, ci-dessus) - aligne
	     l'etat hover sur la meme couleur, pas de teinte hover distincte
	     verifiee sur la maquette. */
	  background-color:#006cd2;
	  color:#fff;
}

/* Bouton "Portail CAIH" toujours visible a cote du hamburger mobile
   (Figma Frame 927 / 2176:3754 : Link 2176:1599 (122x44, gap 10, padding
   6/12/6/12, radius 30, fill #006cd2, PAS d'icone - contrairement a la
   version desktop ci-dessus qui a le cadenas) + lucide/menu 2176:3751,
   gap 20px entre les deux). Le menu accordeon Superfish (toggle +
   #superfish-main-accordion) est injecte en JS et absent du HTML serveur,
   donc le vrai lien "Portail CAIH" n'existe qu'une fois ce menu deplie -
   invisible menu ferme. script.js clone ce lien (meme href/onclick, cf
   commentaire JS) dans un wrapper injecte juste avant le toggle. */
.mobile-header-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 20px;
    width: 100%;
    /* #block-navigationprincipale est en position:absolute;top:40px (regle
       heritee, @media max-width:990px) - valeur calibree pour le seul
       hamburger a l'origine, decalant tout le bloc sous le centre vertical
       du logo (iso maquette : logo + bouton + hamburger sur une meme ligne,
       Frame 878/2176:1536). #superfish-main-accordion (menu deplie) est un
       FRERE de ce wrapper (pas un enfant) dans le DOM Superfish - decaler
       #block-navigationprincipale lui-meme deplacerait aussi le menu ouvert
       (verifie : regression constatee). Offset scope ICI uniquement,
       mesure : centre logo 37.4px vs centre bloc nav (40+44/2=62px). */
    position: relative;
    top: -25px;
    /* pointer-events:none : ce wrapper est width:100% (pour que
       justify-content:flex-end pousse ses enfants a droite) et se
       superpose donc au logo a gauche (#block-navigationprincipale est
       position:absolute par-dessus le header) - la zone vide a gauche du
       bouton/hamburger interceptait le clic destine au logo en dessous,
       le rendant inutilisable en mobile sur toutes les pages (retour
       utilisateur). auto restaure sur les enfants pour qu'ils restent
       cliquables. */
    pointer-events: none;
}
.mobile-header-actions > * {
    pointer-events: auto;
}
.mobile-header-actions .mobile-portail-caih-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 122px;
    height: 44px;
    box-sizing: border-box;
    padding: 6px 12px;
    border-radius: 30px;
    background-color: #006cd2;
    border: 1px solid #006cd2;
    color: #ffffff !important;
    font-family: 'Poppins', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-decoration: none;
    text-transform: none;
    white-space: nowrap;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.mobile-header-actions .mobile-portail-caih-btn:hover {
    /* CAIH-36 : meme regression que le bouton desktop ci-dessus (CAIH-22) -
       l'etat hover etait reste sur l'ancien cyan #3abccf. */
    background-color: #006cd2;
    border-color: #006cd2;
    color: #ffffff !important;
}

ul#superfish-main .menu-cataloguecaih {
  border: 1px solid;
  border-radius: 30px;
  background-image: url('../images/downloadcatalogueblue.svg');
  background-position: 90% 50%;
  background-repeat: no-repeat;
  background-size: 20px;
  margin-left: 7em;
  font-weight: 600;
  padding-right:50px;
  background-color:transparent;
  border-color:#006cd2 !important;
  color: #006cd2 !important;
}

ul#superfish-main .menu-cataloguecaih:hover {
  background-image: url('../images/downloadcataloguewhite.svg');
  background-position: 90% 50%;
  background-repeat: no-repeat;
  background-size: 20px;
  background-color: #006cd2;
  color:#fff !important;
}

ul#superfish-main li.sfHover a,
ul#superfish-main li a:hover,
ul#superfish-main li a:focus,
ul#superfish-main li a:active,
ul#superfish-main li>span:hover{
    color: #006cd2;
}
ul#superfish-main li ul {
    background-color: white;
    padding: 20px;
    box-shadow: 5px 5px 3px #00000008;
    border: 1px solid #E5E5E5;
    border-radius: 5px;
    min-width: 215px;
}

ul#superfish-main li ul:before {
    content:"";
    position: absolute;
    left: 59px;
    top: -19px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 13px 20px 13px;
    border-color: transparent transparent white transparent;
    z-index: 9999;
}

ul#superfish-main li ul:after {
    content: "";
    position: absolute;
    left: 59px;
    top: -21px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 13px 21px 13px;
    border-color: transparent transparent #E5E5E5 transparent;
    z-index: 9998;
}

ul#superfish-main li:first-child ul {
    width: 650px !important;
    position: absolute;
    left: 0;
}
/*ul.sf-menu.sf-horizontal.sf-shadow li:nth-child(2) ul {
    width: 1200px !important;
    position: absolute;
    top: 80px;
    left: auto;
    right: -500px;
}
ul.sf-menu.sf-horizontal.sf-shadow li:nth-child(2) .view-content {
	display:flex;
	flex-wrap:wrap;
}
ul.sf-menu.sf-horizontal.sf-shadow li:nth-child(2) .view-content > .views-row {
	margin-bottom:20px;
	width:33.33%;
}
ul.sf-menu.sf-horizontal.sf-shadow li:nth-child(2) .view-content > .views-row .views-row {
	margin-bottom:0;
	width:100%;
}
*/
ul#superfish-main > li:first-child ul.sf-multicolumn ol {
/*	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;*/
	width:100% !important;
}
ul.sf-multicolumn > li {
	width:100% !important;
}
ul#superfish-main li.sf-depth-2 span, ul#superfish-main li.sf-depth-2 a, ul#superfish-main li.sf-depth-2 a:visited {
	color:#273A62;
	font-size:16px;
	font-weight:600;
	padding:10px 20px;
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3:first-child a {
	background-image:url(../images/icone-caih-laptop.svg);
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3:nth-child(2) a {
	background-image:url(../images/icone-caih-logiciel.svg);
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3:nth-child(3) a {
	background-image:url(../images/icone-caih-presta.svg);
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3:nth-child(4) a {
	background-image:url(../images/icone-caih-telecoms.svg);
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3:nth-child(5) a {
    background-image: url(../images/icone-caih-securite.svg);
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3:nth-child(6) a {
	background-image:url(../images/icone-caih-microsoft.svg);
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3:last-child a {
	background-image:url(../images/icone-caih-solution.svg);
}
ul#superfish-main > li:first-child ul.sf-multicolumn ol li.sf-depth-2 {
    width: 50% !important;
}
ul#superfish-main li.sf-depth-2 li.sf-depth-3 {
    width: 80% !important;
}
ul#superfish-main li.sf-depth-2 ol {
	display:block;
}
ul#superfish-main > li:first-child ol li.sf-depth-2 span,
ul#superfish-main > li:first-child ol li.sf-depth-2 a {
	padding:10px 0;
	text-align:left;
}
ul#superfish-main > li:first-child ol li.sf-depth-2 a {
    padding: 10px 0 20px 0;
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3 a {
    background-position: 10px 50%;
    background-repeat: no-repeat;
    background-size: 25px;
    color: black !important;
    font-size: 16px;
    font-weight: 400;
    padding: 15px 20px 15px 55px;
    text-align: left;
}
ul#superfish-main > li:first-child ol li.sf-depth-2 li.sf-depth-3 a:hover {
	color:#006cd2 !important;
}
ul#superfish-main li.sf-depth-2 span:hover,
ul#superfish-main li.sf-depth-2 a:hover,
ul#superfish-main li.sf-depth-2 li.sf-depth-3 a:hover {
	color:#006cd2 !important;
}
ul.sf-menu li:hover > ul, ul.sf-menu li.sfHover > ul {
	top:61px;
}
ul#superfish-main li .views-field-description__value p {
	color:#aab7b9;
	line-height:1.2;
    padding: 0 20px 10px;
}
ul#superfish-main li .views-field-name a {
    color: #fff;
    font-weight: 600;
    padding: 15px;
}
ul#superfish-main li .views-field-name a:hover {
	color:#006cd2;
}
ul#superfish-main li .views-field-field-picto img {
    display: block;
    margin-left: 11px;
    height: 45px;
    width: auto;
}
ul#superfish-main li .view-taxo-filles .views-field-name a {
    color: #aab7b9;
    font-size: 15px;
    padding: 5px 0 5px 15px;
}
ul#superfish-main li .views-field-view-taxonomy-term a {
	color:#006cd2;
	font-size:14px;
	padding:0 20px 10px;
	text-decoration:underline;
}
ul#superfish-main li .view-taxo-filles .views-field-name a:hover,
ul#superfish-main li .views-field-view-taxonomy-term a:hover {
	color:#fff;
}
ul.sf-menu.sf-style-white li:hover, ul.sf-menu.sf-style-white li.sfHover, ul.sf-menu.sf-style-white a:focus, ul.sf-menu.sf-style-white a:hover, ul.sf-menu.sf-style-white span.nolink:hover {
    background: transparent;
}
ul#superfish-main li .liens_menu a {
    border-top: 1px solid #fff;
    background-image: url(../images/fleche_droite-bleu.png);
    background-position: 95% center;
    background-repeat: no-repeat;
    background-size: 35px;
    color: #fff;
    padding: 15px 60px 15px 10px;
}
ul#superfish-main li .liens_menu a:hover {
	color:#006cd2;
}
#main-menu-link-content81ddf788-59c7-420f-a3a0-cf7bee572129 ul,
#main-menu-link-contentf8f63306-a4e0-4f8a-b2fe-f43a9bb3c345 ul {
	width: 260px !important;
}
/*---------- Effets fin --------------*/
body {
	background-color:#fff !important;
	font-family: 'Poppins', sans-serif;
  font-size: 16px;
  /* overflow-x:hidden - permet de restaurer les bandeaux hero plein-largeur
     (.hero-article/.hero-evenement/.hero-marche__intro, width:100vw +
     margin:calc(50% - 50vw)) sans reintroduire la scrollbar horizontale
     fantome : 100vw inclut la largeur de la scrollbar verticale
     (scrollbar classique non-overlay, Windows/Chrome), donc ces bandeaux
     debordent de quelques px au-dela du viewport visible - invisible/
     non-scrollable desormais grace a ce clip au niveau body, au lieu de
     supprimer le plein-largeur (retour utilisateur : le voulait bord a
     bord sur grand ecran, iso maquette node 2256:4193). */
  overflow-x: hidden;
}
.breadcrumb {
	font-family: 'Poppins', sans-serif;
    font-size: 16px;
}
.node-form label, .node-form .description, .node-form .form-wrapper .label,
header {
	font-family: 'Poppins', sans-serif;

}
a, a.link {
    text-decoration: none;
    border-bottom:none;
}
a[href]:hover {
	color:#006cd2;
}
#block-views-block-anciens-evenements-block-2 .views-field-view-node a,
#block-views-block-evenements-block-3 .views-field-view-node a,
.field--name-field-pour-s-inscrire a,
.view-evenements-page .views-field-view-node a,
.view-actualites .views-field-view-node a,
#views-exposed-form-recherche-marches-page-1 #edit-actions input,
.field--name-field-fiche-marche a,
.button,
.field--name-field-lien-d-adhesion a,
.field--name-field-demande-d-information a,
.adhesion a,
.info a,
.path-dons #block-formulaireexposerecherche-donspage-1 input.form-submit,
.page-node-type-proposition-de-don #block-webform input.form-submit,
.view-anciens-evenements .view-content .views-row .views-field-view-node a,
.view-evenements-page .view-evenements .views-row .views-field-view-node a,
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 h2 a,
.file--mime-application-pdf a,
.savoir_plus a,
ul.inline li a,
.views-field-field-lots a,
#block-views-block-evenements-block-2 .views-field-view-node a,
#block-views-block-evenements-block-1 .views-field-view-node a,
#block-asco-theme-views-block-evenements-block-2 .views-field-view-node a,
#node-proposition-de-don-form input.form-submit,
#block-views-block-slideshow-ok-block-1 .views-field-body a,
.view-taxonomy-term .view-content .field--name-field-lien a,
a.btn {
	background-color:#006cd2;
	border:1px solid #006cd2;
	border-radius:30px;
	color:#fff;
	font-size:16px;
	font-weight:500;
	padding:10px 45px 10px 20px;
	position:relative;
	text-align:center;
}

.view-evenements {

}
.field--name-field-fiche-marche a,
.field--name-field-lien-d-adhesion a {
	display:block;
}
.view-taxonomy-term .view-content .field--name-field-lien a:after,
.button:after,
#block-views-block-anciens-evenements-block-2 .views-field-view-node a:after,
#block-views-block-evenements-block-3 .views-field-view-node a:after,
.view-evenements-page .views-field-view-node a:after,
.view-actualites .views-field-view-node a:after,
#views-exposed-form-recherche-marches-page-1 #edit-actions input:after,
.field--name-field-fiche-marche a:after,
.button:after,
.field--name-field-lien-d-adhesion a:after,
.field--name-field-demande-d-information a:after,
.adhesion a:after,
.info a:after,
.path-dons #block-formulaireexposerecherche-donspage-1 input.form-submit:after,
.page-node-type-proposition-de-don #block-webform input.form-submit:after,
.view-anciens-evenements .view-content .views-row .views-field-view-node a:after,
.view-evenements-page .view-evenements .views-row .views-field-view-node a:after,
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 h2 a:after,
.file--mime-application-pdf a:after,
.savoir_plus a:after,
ul.inline li a:after,
.views-field-field-lots a:after,
#block-views-block-evenements-block-2 .views-field-view-node a:after,
#block-views-block-evenements-block-1 .views-field-view-node a:after,
#block-asco-theme-views-block-evenements-block-2 .views-field-view-node a:after,
#node-proposition-de-don-form input.form-submit:after,
a.btn:after {
	background-image:url(../images/fleche_blanche_droite.png);
	background-position:50% 50%;
	background-repeat:no-repeat;
	content:"";
	height:40px;
	margin-top:-20px;
	position:absolute;
	right:5px;
	top:50%;
	width:40px;
}

#views-exposed-form-recherche-marches-page-1 #edit-actions input {
	background-image:url(../images/Trace-433.svg);
	background-position:50%;
	background-repeat:no-repeat;
  padding: 0.860em;
  margin: 0 !important;
}

.view-taxonomy-term .view-content .field--name-field-lien a:hover,
.button:hover,
#block-views-block-anciens-evenements-block-2 .views-field-view-node a:hover,
#block-views-block-evenements-block-3 .views-field-view-node a:hover,
.view-evenements-page .views-field-view-node a:hover,
.view-actualites .views-field-view-node a:hover,
.field--name-field-fiche-marche a:hover,
.button:hover,
.field--name-field-lien-d-adhesion a:hover,
.field--name-field-demande-d-information a:hover,
.adhesion a:hover,
.info a:hover,
.path-dons #block-formulaireexposerecherche-donspage-1 input.form-submit:hover,
.page-node-type-proposition-de-don #block-webform input.form-submit:hover,
.view-anciens-evenements .view-content .views-row .views-field-view-node a:hover,
.view-evenements-page .view-evenements .views-row .views-field-view-node a:hover,
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 h2 a:hover,
.file--mime-application-pdf a:hover,
.savoir_plus a:hover,
ul.inline li a:hover,
.views-field-field-lots a:hover,
#block-views-block-evenements-block-1 .views-field-view-node a:hover,
#block-asco-theme-views-block-evenements-block-2 .views-field-view-node a:hover,
#block-views-block-evenements-block-2 .views-field-view-node a:hover,
#node-proposition-de-don-form input.form-submit:hover,
#block-views-block-slideshow-ok-block-1 .views-field-body a:hover,
a.btn:hover {
	background-color:#fff;
	color:#006cd2;
}
.view-taxonomy-term .view-content .field--name-field-lien a:hover:after,
.button:hover:after,
#block-views-block-anciens-evenements-block-2 .views-field-view-node a:hover:after,
#block-views-block-evenements-block-3 .views-field-view-node a:hover:after,
.view-evenements-page .views-field-view-node a:hover:after,
.view-actualites .views-field-view-node a:hover:after,
#views-exposed-form-recherche-marches-page-1 #edit-actions input:hover:after,
.field--name-field-fiche-marche a:hover:after,
.button:hover:after,
.field--name-field-lien-d-adhesion a:hover:after,
.field--name-field-demande-d-information a:hover:after,
.adhesion a:hover:after,
.info a:hover:after,
.path-dons #block-formulaireexposerecherche-donspage-1 input.form-submit:hover:after,
.page-node-type-proposition-de-don #block-webform input.form-submit:hover:after,
.view-anciens-evenements .view-content .views-row .views-field-view-node a:hover:after,
.view-evenements-page .view-evenements .views-row .views-field-view-node a:hover:after,
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 h2 a:hover:after,
.file--mime-application-pdf a:hover:after,
.savoir_plus a:hover:after,
ul.inline li a:hover:after,
.views-field-field-lots a:hover:after,
#block-views-block-evenements-block-1 .views-field-view-node a:hover:after,
#block-asco-theme-views-block-evenements-block-2 .views-field-view-node a:hover:after,
#block-asco-theme-views-block-evenements-block-2 views-field-view-node a:hover:after,
#block-views-block-evenements-block-2 .views-field-view-node a:hover:after,
#node-proposition-de-don-form input.form-submit:hover:after,
#block-views-block-slideshow-ok-block-1 .views-field-body a:hover:after,
a.btn:hover:after {
	background-image:url(../images/fleche_bleu_droite.png);
}
.field--name-field-demande-d-information a {
    float: left;
    display: block;
    width: 260px;
}
.button {
	background-image:none;
}
.button:hover,
.adhesion a:hover,
.info a:hover,
a.btn.bleu:hover {
	background-color:#fff;
	color:#006cd2;
}
.adhesion a {
    display: block;
	float: left;
    margin-right: 20px;
	padding:5px 30px;
    width: 90px;
}
.info a {
	display: block;
    float: left;
	padding:5px 30px;
    width: 240px;
}
a.btn.bleu {
	background-color:#006cd2;
	border:1px solid #006cd2;
}
a.btn.bleu:hover {
	background-color:#fff;
	color:#006cd2;
}
.bg_bleu {
	background-color:#006cd2;
	color:#fff;
}
.bg_bleu h3,
.bg_bleu p {
	color:#fff;
	margin-top:0;
}
.bg_bleu a.btn.blanc {
	background-color:#fff;
	border:1px solid #fff;
	color:#006cd2;
}
.bg_bleu a.btn.blanc:hover {
	background-color:#006cd2;
	color:#fff;
}
.bg_bleu div,
.bg_jaune div {
	padding:20px;
}
.bg_jaune {
	background-color:#006cd2;
	color:#000;
}
.bg_jaune h3,
.bg_jaune p {
	color:#000;
	margin-top:0;
}
.bg_jaune a.btn.blanc {
	background-color:#fff;
	border:1px solid #fff;
	color:#006cd2;
}
.bg_jaune a.btn.blanc:hover {
	background-color:#006cd2;
	color:#fff;
}
.txt_bleu_clair {
	color:#006cd2 !important;
}
.txt_bleu_fonce {
	color:#232f3e !important;
}
.txt_orange {
	color:#ee6a1a !important;
}
.txt_gros {
	font-size:1.2em;
}
.txt_petit {
	font-size:0.9em;
}
.text-formatted ul, .text-formatted ol {
    margin: 1em 0 1em 1em;
    padding: 0 0 0.25em 15px;
}
h1, h2, h3, h4 {
	line-height:1.3;
}
h2 {
	font-size:28px;
	font-weight:500;
}
h2 {
    font-size: 24px;
    font-weight: 600;
}
h1 a, h2 a {
    border-bottom: none;
    border: none;
}
h3 {
	color:#006cd2;
	font-size:20px;
	font-weight:500;
}

.region-sidebar-first #block-contenudelapageprincipale h3 {
	color:#000000;
	font-size:16px;
	font-weight:bold;
    line-height: 21px;
}

.region-sidebar-first #block-contenudelapageprincipale table {
    box-shadow: 0px 0px 50px #B8B8B833;
    font-family: 'Poppins';
    font-size: 14px;
    color: #002A3A;
    border-collapse: collapse;
    border-radius: 10px;
    overflow: hidden;
}

.region-sidebar-first #block-contenudelapageprincipale table tr:hover p {
    color: #006cd2;
}

.region-sidebar-first #block-contenudelapageprincipale table tr, .region-sidebar-first table tr:not(:last-child) td {
    background: white;
    border-bottom: 0.5px solid #707070;
}

.region-sidebar-first #block-contenudelapageprincipale table tr td {
    padding: 4px 9px 4px 17px;
}

#block-question {
	background-color:#006cd2;
}
#block-question .ligne {
	display:block;
	padding:0;
}
#block-question p {
	color:#fff;
	font-size:20px;
	margin-bottom:0;
	padding:10px 15px;
	text-align:center;
}

.region-header .block-superfish {
  width: calc(100% - 280px);
}
.region-header .views-exposed-form {
    max-width: 270px;
	  width:100%;
}
.region-header .views-exposed-form .form--inline .form-item {
	float:none;
}
.region-header .views-exposed-form label,
.region-header .views-exposed-form input.button {
	display:none;
}
.region-header .views-exposed-form input.form-text {
	border:2px solid #c4c5c8;
	padding:10px;
	width:100%;
}
.region-formulaire,
.region-header {
    display: flex;
    flex-wrap: wrap;
    position: relative;
}
.region-header {
  align-items: center;
  justify-content: right;
  height: 68px;
  padding: 0.357em 0;
  margin: 0 10%;
}

.region-header .site-branding__logo {
  position: relative;
  /* left:-121px (valeur d'origine, pre-refonte CAIH-22 flex) decalait le
     logo hors de sa propre boite flex, creant un vide de ~137px avant
     "Nos offres" - iso maquette (Frame 207/2256:5393, gap 33px logo<->liens)
     le logo doit rester dans le flux flex normal de .region-header. */
  left: 0;
}

ul.sf-menu.sf-vertical {
    width: auto;
}
ul.sf-menu.sf-vertical li:hover > ul, ul.sf-menu.sf-vertical li.sfHover > ul {
	border:1px solid #ddddde;
    left: 260px;
    top: 0;
}
ul#superfish-nos-offres-2,
ul#superfish-nos-offre--2 {
	padding-bottom:50px;
}
ul#superfish-nos-offres-2.sf-menu li,
ul#superfish-nos-offre--2.sf-menu li,
ul#superfish-nos-offre.sf-menu li {
	float:none;
}
ul#superfish-nos-offres-2.sf-menu a,
ul#superfish-nos-offres-2.sf-menu span.nolink,
ul#superfish-nos-offre--2.sf-menu a, ul#superfish-nos-offre--2.sf-menu span.nolink,
ul#superfish-nos-offre.sf-menu a, ul#superfish-nos-offre.sf-menu span.nolink {
	background-color:#fff;
	border-bottom:1px solid #ddddde;
	color:#404141;
	font-size:15px;
}

ul#superfish-nos-offre.sf-menu li.sfHover > a,
ul#superfish-nos-offre.sf-menu a.is-active,
ul#superfish-nos-offre.sf-menu a:hover,
ul#superfish-nos-offre.sf-menu span.nolink:hover {
	background-color:#006cd2;
	color:#fff;
}
ul#superfish-nos-offres-2.sf-menu a,
ul#superfish-nos-offres-2.sf-menu span.nolink {
	background-color:#c4c5c8;
	border-bottom:0;
}
l#superfish-nos-offre.sf-menu li ul li span.nolink,
ul#superfish-nos-offre.sf-menu li ul li a {
	background-color:#fff;
	border-bottom:1px solid #ddddde;
	color:#404141;
}
ul.sf-menu.sf-vertical .sf-sub-indicator:after {
    transform: scale(0.6);
}
.flexslider {
    margin: 0;
    background: transparent;
    border:none;
    position: relative;
    zoom: 1;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow:none;
    -o-box-shadow:none;
    box-shadow:none;
}
.flexslider .slides > li {
	position:relative;
}
/* CAIH-22 : hero reduit a 1 slide iso maquette (2256:5458) - le JS flexslider
   clone parfois le slide meme sans boucle/slideshow actifs ; on masque tout
   <li> au-dela du premier (reel) et on clippe le viewport par securite. */
#homepageslider.flexslider,
#homepageslider .flex-viewport {
	overflow: hidden;
}
/* CAIH-22 : #homepageslider (et sa chaine de wrappers Views) est en display:
   block, hauteur pilotee par son contenu ; .flex-viewport en height:100%
   sur un parent a hauteur "auto" s'effondre a 0 (les % de hauteur ne
   resolvent que contre un parent a hauteur explicite). Passe #homepageslider
   en position:absolute;inset:0 par rapport a .region-slideshow (positionne)
   pour court-circuiter toute la chaine de wrappers Views intermediaires. */
.path-frontpage #homepageslider.flexslider {
	position: absolute;
	inset: 0;
}
/* CAIH-22 : pour les utilisateurs avec l'acces aux liens contextuels (menu
   d'edition en survol), Drupal ajoute position:relative sur le wrapper
   ".contextual-region" du bloc Views - cet ancetre s'intercale alors comme
   nouveau "containing block" de #homepageslider a la place de
   .region-slideshow. Comme ce wrapper n'a lui-meme aucune hauteur explicite
   (son seul contenu vient d'etre sorti du flux normal ci-dessus), il
   s'effondre a 0 et l'image hero devient invisible - uniquement visible en
   etant connecte, jamais pour un visiteur anonyme. On neutralise ce
   position:relative pour restaurer .region-slideshow comme containing
   block réel. */
.path-frontpage .region-slideshow .contextual-region {
	position: static;
}
#homepageslider .slides > li ~ li {
	display: none !important;
}
#block-views-block-slideshow-ok-block-1 .views-field-body {
	display:flex;
	height:100%;
	position:absolute;
	top:0;
	width:100%;
}
@media (min-width: 992px) {
  .path-frontpage #block-views-block-slideshow-ok-block-1 .views-field-body {
    top: 0;
    height: 100%;
    padding-top: 100px;
    padding-bottom: 244px;
    box-sizing: border-box;
    align-items: center;
  }
}
#block-views-block-slideshow-ok-block-1 .views-field-body > div {
    margin: 60px auto 0;
    max-width: 80%;
    width: 100%;
}
/* CAIH-22 : le texte hero (titre+CTA) doit etre centre verticalement dans
   l'espace disponible entre le header et la carte recherche, pas colle en
   haut - align-items:center sur .views-field-body (ci-dessus) centre la
   colonne, mais le margin-top:60px fixe herite (ci-dessus aussi) la
   decalait quand meme vers le haut : neutralise pour ce contexte precis. */
@media (min-width: 992px) {
  .path-frontpage #block-views-block-slideshow-ok-block-1 .views-field-body > div {
      margin-top: 0;
  }
}
/* CAIH-22 : sur tres grand ecran, ce bloc restait cale sur "80% de la
   largeur, centre" independamment de la grille du reste de la page (header,
   #recherche) - le texte se retrouvait tasse a gauche d'un conteneur
   invisible bien plus large que lui. Aligne sur la meme grille max-width
   1312px centree que le header et #recherche. */
@media (min-width: 992px) {
  .path-frontpage #block-views-block-slideshow-ok-block-1 .views-field-body > div {
      width: calc(100% - 200px);
      max-width: 1800px;
  }
}
#block-views-block-slideshow-ok-block-1 h1, #block-views-block-slideshow-ok-block-1 h2 {
    color: #fff;
    font-size: 26px;
    font-weight: 500;
    line-height: 1.2;
    margin-bottom: 50px;
    width: 600px;
}
#block-views-block-slideshow-ok-block-1 h1 strong {
    display: block;
    font-size: 50px;
    font-weight: 500;
    margin-top: 20px;
}
#block-views-block-slideshow-ok-block-1 .views-field-body a {
    background-color: #006cd2;
    border: 1px solid #006cd2;
}
.flexslider .flex-direction-nav .flex-next,
.flexslider .flex-direction-nav .flex-prev {
	display:block !important;
    opacity: 1 !important;
}
.flex-direction-nav .flex-prev {
    left: 50px;
}
.flex-direction-nav .flex-next {
	right:50px;
}
.flex-direction-nav a:before,
.flex-direction-nav a.flex-next:before {
	background-image:url(../images/fleche_gauche-b.png);
	background-size:40px;
	content:"";
	height:50px;
	width:50px;
}
.flex-direction-nav a.flex-next:before {
	background-image:url(../images/fleche_droite-b.png);
}
.region-colonnegauche {
    float: left;
    width: 412px;
    position: relative;
    z-index: 99;
}

.region-colonnegauche input.form-text {
    color: #909090;
    border: none;
    border-radius: 30px;
    padding: 15px 20px;
    box-shadow: 0px 0px 6px #0000000D;
    font-size: 14px;
    font-family: 'Poppins';
}

#block-btncote {
    position: fixed;
    top: 110px;
    right: 10px;
    z-index: 99;
    height: 120px;
}
#block-btncote .ligne {
	display:block;
	padding:0;
}
#block-btncote .field--type-image img {
	margin:0;
}
#block-btncote img:hover {
	transform:scale(1.2);
	-moz-transform:scale(1.2);
	-webkit-transform:scale(1.2);
}
#block-propositiondedonform h2 {
	color:#fff;
	font-size:30px;
	font-weight:500;
	margin-bottom:20px;
	text-align:center;
}
.jcarousel-skin-default .jcarousel-control-next:after,
.jcarousel-skin-default .jcarousel-control-prev:after {
	content:none;
}
.jcarousel-skin-default .jcarousel-control-next,
.jcarousel-skin-default .jcarousel-control-prev {
	background-color:transparent;
	background-image:url(../images/fleche_gauche.png);
	background-position:center center;
	background-repeat:no-repeat;
	background-size:30px;
	bottom:10px;
	top:auto;
}
.jcarousel-skin-default .jcarousel-control-next {
	background-image:url(../images/fleche_droite.png);
}
#block-recherchepartheme .text-formatted ul,
#block-views-block-recherche-par-theme-block-1 .view-content {
	display:flex;
	flex-wrap:wrap;
	position:relative;
}
#block-recherchepartheme .text-formatted ul {
	margin:0;
	padding:0;
	gap: 10px;
}
/* CAIH-22 : .ligne (wrapper generique du theme) impose padding:0 15px qui
   grignotait 30px sur la largeur dispo des 6 cartes (1244px iso 2256:5473),
   faisant passer la 6e carte a la ligne. Neutralise ici uniquement. */
#block-recherchepartheme .ligne {
	padding-left: 0;
	padding-right: 0;
}
#block-recherchepartheme .text-formatted ul li {
	list-style:none;
}
/* CAIH-22 : carte unique blanche englobant recherche mots-cles + explorer par
   themes (Frame 868 / 2256:5461), au lieu de 2 regions cote a cote #E7EDF5.
   Scope a .path-frontpage : les blocs recherche1/recherche2 ne s'affichent
   que sur <front> (visibilite du bloc), mais #recherche est rendu dans
   page.html.twig sur TOUTES les pages (meme vide) - sans ce scope, chaque
   page hors accueil affichait une carte blanche vide (fond+ombre+padding)
   sans aucun contenu dedans. */
.path-frontpage #recherche {
	display: flex;
	flex-direction: column;
	gap: 32px;
	position: relative;
	background: #ffffff;
	border-radius: 20px;
	box-shadow: 0px 0px 10px 0px #0000001a;
	padding: 32px;
	box-sizing: border-box;
}
/* CAIH-22 : la carte recherche chevauche le bas de la photo hero, iso
   2256:5461 - carte de 315.04px de haut dont 244px par-dessus la photo et
   71px en dessous (calcul exact depuis les box Figma : le bas de la carte
   deborde de 71px sous le bas du cadre photo, donc le chevauchement REEL
   vers le haut est 315.04-71=244px, pas 71 - premiere version inversait
   les deux). Desktop uniquement (min-width:992px), mobile empile normalement. */
@media (min-width: 992px) {
  .path-frontpage #recherche {
      /* iso largeur du bloc "Nos marches" en dessous (.page-body-layout :
         max-width:1800px EXTERIEUR + padding:100px EXTERIEUR = contenu
         reduit de 200px meme au-dela de 1800px de viewport). L'ancien
         "width:calc(100% - 200px); max-width:1800px" plafonnait la LARGEUR
         (1800px), pas le contenu apres reduction - au-dela de ~2000px de
         viewport la carte recherche devenait jusqu'a 200px plus large que
         "Nos marches", desalignement visible en grand ecran. */
      width: calc(min(1800px, 100%) - 200px);
      margin-left: auto;
      margin-right: auto;
      /* -244px = calcul exact depuis les box Figma (voir commentaire CAIH-22
         ci-dessus). Porte a -280px (retour utilisateur en direct sur le
         rendu reel, ajuste une 2e fois depuis -344px). */
      margin-top: -280px;
      /* Ecart carte recherche -> "Nos marchés" mesure en Figma : bas de la
         carte recherche (Frame 868, y:-309+315.04=6.04) -> haut du titre
         "Nos marchés" (Frame 712, y:95) = 88.96px ≈ 89px. Aucune regle
         n'assurait cet espace jusqu'ici (uniquement le padding interne de
         la carte) - le gap etait donc 0px en pratique, pas 89px. */
      margin-bottom: 89px;
      z-index: 2;
  }
}
.region-formulaire:after {
    background-image: url(../images/bande_blanche.png);
    background-position: 100% 100%;
    background-repeat: no-repeat;
    background-size: 1150px;
    bottom: 0;
    content: "";
    height: 90px;
    position: absolute;
    right: 0;
    z-index: 2;
    width: 100%;
}
#recherche:after {
    background-size: 55%;
}

#block-catalogue .ligne.ligne-titre,
#recherche .ligne.ligne-titre {
	padding:0;
}
#block-recherchepartheme .ligne {
	display:block;
	max-width:100%;
}
#block-catalogue a.btn:after {
	background-image:url(../images/Groupe-3536.svg);
    right: 13px !important;
}
/* CAIH-22 : recherche mots-cles au-dessus, explorer par themes en dessous
   (2256:5463 puis 2256:5471), dans la carte blanche unique de #recherche. */
.region-recherche2 { order: 1; }
.region-recherche1 { order: 2; }
.region-recherche1 h2,
.region-recherche2 h2 {
	color: #6b6b6b;
	text-align: left;
	font: normal 400 16px/24px Poppins, sans-serif;
	width: 100% !important;
	margin: 0 0 14px;
}

.region-recherche2 .ligne {
    justify-content: flex-start !important;
}

.region-recherche2 input[value=Rechercher] {
    color: transparent !important;
}

#block-formulaireexposerecherche-marchespage-1-3 .content {
    padding-left: 0;
}
/* CAIH-22 : pilule recherche mots-cles iso 2256:5465 - input + bouton rond bleu.
   Le flex doit etre pose sur .form--inline (vrai parent direct des 2 wrappers
   input/bouton) et non sur <form> (qui n'a qu'un seul enfant, .form--inline,
   donc mettre le flex dessus ne distribuait rien : bouton colle a l'input,
   grand vide a droite au lieu d'etre pousse au bord). */
#block-formulaireexposerecherche-marchespage-1-3 .form--inline {
    display: flex;
    align-items: center;
    gap: 8px;
    border: 1px solid #cfcfd3;
    border-radius: 100px;
    background: #ffffff;
    padding: 12px 16px;
    box-sizing: border-box;
    margin: 0;
}
#block-formulaireexposerecherche-marchespage-1-3 .js-form-item-search-api-fulltext {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
}
/* Une regle heritee ".path-frontpage #views-exposed-form-recherche-marches-page-1
   .form--inline > div { margin-bottom:15px }" (@media max-width:1200px, partagee
   avec #views-exposed-form-recherche-reference-page-1) a une specificite plus
   forte (1 ID + 2 classes) que le margin:0 ci-dessus (1 ID + 1 classe) et gagne
   la cascade sous 1200px : le wrapper du texte se retrouve avec margin-bottom:15px
   sans margin-top, ce qui le pousse hors du centre vertical du flex align-items:
   center de la pilule (texte visuellement plus bas que le bouton loupe). */
#block-formulaireexposerecherche-marchespage-1-3 .js-form-item-search-api-fulltext {
    margin-bottom: 0 !important;
}
/* CAIH-22 : deux regles heritees generiques cibalient ".form--inline > div:
   last-of-type" (prevues pour un autre agencement de barre de recherche,
   partagees avec #views-exposed-form-recherche-reference-page-1 - non
   touchees pour ne pas regresser cette autre page) : l'une passe le wrapper
   du bouton en position:absolute (top:47/right:60), l'autre - plus
   specifique via .path-frontpage - en position:relative;right:80px;top:2px;
   width:81px. Cette derniere gagnait la cascade et decalait le bouton de
   80px vers la gauche, hors flux du flex du champ recherche (chevauchement
   avec l'input). Neutralise ici avec une specificite au moins egale, pour
   ce bloc precis uniquement (iso 2256:5468, bouton au bord droit, flush). */
#block-formulaireexposerecherche-marchespage-1-3 .form-actions,
.path-frontpage #block-formulaireexposerecherche-marchespage-1-3 .form--inline > div.form-actions {
    flex: 0 0 44px !important;
    width: 44px !important;
    margin: 0 !important;
    float: none !important;
    position: static !important;
    top: auto !important;
    right: auto !important;
}
/* CAIH-22 : .region-recherche2 select, .region-recherche2 input impose
   padding:16.73px + border-radius:26px (regle heritee, cf plus bas dans ce
   fichier) qui gonflait la pilule a 87px de haut au lieu de 68px (iso
   2256:5465) - neutralise ici pour ce champ precis. */
#block-formulaireexposerecherche-marchespage-1-3 .form-autocomplete {
    width: 100%;
    border: none;
    outline: none;
    background: transparent;
    padding: 0;
    border-radius: 0;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    color: #000000;
}
#block-formulaireexposerecherche-marchespage-1-3 input.form-submit {
    flex: 0 0 44px;
    width: 44px !important;
    height: 44px !important;
    border-radius: 50%;
    background: url(../images/icons/search-button.svg) center / 44px no-repeat !important;
    border: none !important;
    padding: 0 !important;
    margin: 0;
    cursor: pointer;
}

#block-views-block-recherche-par-theme-block-1 .views-row {
    background-color: #fff;
    margin: 1.3em;
}

#block-views-block-recherche-par-theme-block-1 .views-row:hover {
    background-color: #006cd2;
}

/* CAIH-22 : cartes "Explorer par themes" iso 2256:5471 - icone lucide + libelle,
   fond bleu tres clair #2d3f860d, radius10, plus de fond blanc/ombre/100x100px. */
#block-recherchepartheme .text-formatted ul li a,
#block-views-block-recherche-par-theme-block-1 .views-row a {
	color:#000;
	text-align:left;
}
/* CAIH-22 : align-items:flex-end + icone en background-image a offset fixe
   faisait deriver l'alignement entre cartes : l'icone reste a 12px du haut
   de CHAQUE a (coherent), mais le texte "colle au bas" de la hauteur PROPRE
   a chaque carte (qui varie selon 1 ou 2 lignes de libelle) au lieu d'etre
   cale juste sous l'icone - decalage visible entre cartes voisines. Passe
   en align-items:flex-start (texte juste sous l'icone, pousse vers le bas
   si 2 lignes) + a en height:100% pour occuper toute la hauteur du li,
   qui lui-meme s'etire (align-items:stretch par defaut du ul flex) a la
   hauteur de la carte la plus haute de sa ligne : les 6 cartes d'une meme
   ligne ont ainsi toutes la meme hauteur, icones alignees. */
#block-recherchepartheme .text-formatted ul li a {
    background-color: #2d3f860d;
    background-repeat: no-repeat;
    background-position: 14px 12px;
    background-size: 22px;
    border-radius: 10px;
    margin: 0;
    display: flex;
    align-items: flex-start;
    width: 100%;
    height: 100%;
    min-height: 74px;
    padding: 42px 14px 10px;
    box-sizing: border-box;
    font-size: 16px;
    line-height: 24px;
}
/* CAIH-22 : les 6 cartes etaient a largeur fixe (199px, iso 2256:5473) -
   correct a la largeur de reference Figma mais laissait un vide a droite
   des que le conteneur s'elargit (grand ecran). Passe en flex:1 pour que
   les cartes se partagent toujours toute la largeur disponible, sans vide. */
#block-recherchepartheme .text-formatted ul li {
    display: flex;
    flex: 1 1 0;
    min-width: 160px;
}
#block-recherchepartheme .text-formatted ul li a.materiels {
	background-image:url(../images/icons/monitor-cloud.svg);
}
#block-recherchepartheme .text-formatted ul li a.logiciels {
	background-image:url(../images/icons/code-xml.svg);
}
#block-recherchepartheme .text-formatted ul li a.telecoms {
	background-image:url(../images/icons/cloud-check.svg);
}
#block-recherchepartheme .text-formatted ul li a.securite {
	background-image:url(../images/icons/shield-check.svg);
}
#block-recherchepartheme .text-formatted ul li a.prestations {
	background-image:url(../images/icons/users-round.svg);
}
#block-recherchepartheme .text-formatted ul li a.microsoft {
	background-image:url(../images/icons/layout-grid.svg);
}

/* Chevron accordeon mobile a cote de "Explorer par themes" (Figma Frame 872
   / 2176:3994 : Frame 930 (2176:4026) titre + CaretRight 2176:4023 rotate
   (-90deg) = pointe vers le haut, fill #6b6b6b - asset exporte tel quel,
   deja oriente vers le haut dans le PNG/SVG Figma). Le titre + la liste de
   cartes viennent d'un champ WYSIWYG (CKEditor, body de
   #block-recherchepartheme) donc aucun attribut data-* n'est disponible a
   la source - script.js cible le h2 par son texte et bascule aria-expanded.
   Ouvert par defaut (comportement actuel inchange au chargement), mobile
   uniquement (le bloc equivalent desktop n'a pas ce chevron dans la
   maquette). */
#block-recherchepartheme .text-formatted button.explorer-themes-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    width: 100%;
    padding: 0;
    border: none;
    background: none;
    font: inherit;
    color: inherit;
    text-align: left;
    cursor: pointer;
}
.explorer-themes-chevron {
    flex: 0 0 20px;
    width: 20px;
    height: 20px;
    background: url('../images/icons/caret-up-gray.svg') center / contain no-repeat;
    transition: transform 0.2s ease;
}
#block-recherchepartheme .text-formatted button.explorer-themes-toggle[aria-expanded="false"] .explorer-themes-chevron {
    transform: rotate(180deg);
}
/* L'attribut IDL "hidden" (UA stylesheet, specificite [hidden] tres faible)
   est battu par les regles "#block-recherchepartheme .text-formatted ul"
   (display:flex, plusieurs occurrences a differents breakpoints) qui
   gardaient la grille visible malgre panel.hidden=true en JS - override
   explicite ici. */
#block-recherchepartheme .text-formatted ul[hidden] {
    display: none !important;
}

#views-exposed-form-recherche-marches-page-1 #edit-actions input:hover,
#block-catalogue a.btn:hover {
    background-color: #006cd2 !important;
    color: white;
}

#views-exposed-form-recherche-marches-page-1 #edit-actions input:hover,
#block-catalogue a.btn:hover {
  border: 1px solid #006cd2 !important
}

#block-views-block-recherche-par-theme-block-1 .views-row:hover a {
	color:#fff;
}
#block-views-block-recherche-par-theme-block-1 .views-row img {
    display: block;
    margin: 0 auto 10px;
    max-height: 50px;
	padding:20px 10px 0;
    width: auto;
}

#block-formulaireexposerecherche-marchespage-1-3 {
    position: relative;
    z-index: 2;
    /* padding: 1em 2em 2em 2em supprime - en double avec le padding:32px
       deja pose sur #recherche (la carte parente), inserait le champ de
       recherche 32px plus a l'interieur que "Explorer par themes" en
       dessous (qui n'a pas ce padding). Le mobile avait deja padding:0
       pour ce meme bloc (@media max-width, plus bas dans ce fichier). */
}

#block-formulaireexposerecherche-marchespage-1-3 .button, #block-catalogue a.btn {
    background-color: #273a62 !important;
    border: 1px solid #273a62 !important;
}

#block-catalogue a.btn {
    padding: 0.660em 3.5em 0.660em 1.5em;
}

.region-recherche2:before {
    background-color: #e7edf5;
    content: "";
    height: 100%;
    left: -1px;
    position: absolute;
    width: 1px;
    z-index: 1;
    top: 0;
}
ul.js-facets-checkbox-links {
    padding: 0;
}
.region-recherche2 div.facet-inactive {
    background-color: transparent;
    border-bottom: none;
    color: #aaa;
    padding: 0;
    width: 100%;
}
#views-exposed-form-recherche-marches-page-1 .form--inline,
#views-exposed-form-recherche-marches-par-categorie-d-adherents-page-1 .form--inline,
#views-exposed-form-recherche-reference-page-1 .form--inline{
    display: flex;
    justify-content: center;
}

#views-exposed-form-recherche-marches-par-categorie-d-adherents-page-1 .form--inline,
#views-exposed-form-recherche-reference-page-1 .form--inline{
  align-items: center;
}

#views-exposed-form-recherche-marches-par-categorie-d-adherents-page-1 .form--inline,
#views-exposed-form-recherche-reference-page-1 .form--inline{
  flex-wrap: wrap;
}

#views-exposed-form-recherche-marches-page-1 .form--inline > div,
#views-exposed-form-recherche-marches-par-categorie-d-adherents-page-1 .form--inline > div,
#views-exposed-form-recherche-reference-page-1 .form--inline > div{
    float: none;
    margin: 0;
    padding: 0;
    width: 100%;
}
#views-exposed-form-recherche-marches-page-1 .form--inline .js-form-type-select {
}
.path-frontpage #views-exposed-form-recherche-marches-page-1 .form--inline > div,
.path-frontpage #views-exposed-form-recherche-reference-page-1 .form--inline > div{
    width: 482px;
}
.path-frontpage #views-exposed-form-recherche-marches-page-1 .form--inline > div:last-of-type,
.path-frontpage #views-exposed-form-recherche-reference-page-1 .form--inline > div:last-of-type{
    width: 81px;
    position: relative;
    right: 80px;
    top:2px;
}
#views-exposed-form-recherche-marches-page-1 .form--inline > div:last-of-type,
#views-exposed-form-recherche-reference-page-1 .form--inline > div:last-of-type{
    float: none;
    width: 70px;
    position: absolute;
    top: 47px;
    right: 60px;
}

#edit-submit-recherche-marches--2 .form-actions input.button {
    color: transparent !important;
}

.path-nos-marches .region-colonnegauche .facet-inactive, .region-colonnegauche .facet-active {
    background-color: #F9F9FB;
    width: auto;
}

.path-nos-marches .region-colonnegauche div.facet-inactive li.facet-item label, .region-colonnegauche div.facet-active li.facet-item label {
    color: black;
    font-family: 'Poppins';
    text-transform: none;
}

.path-nos-marches .region-colonnegauche div.facet-inactive li.facet-item, .region-colonnegauche div.facet-active li.facet-item {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
    margin-bottom: 10px;
    width: 100%;
}

.path-nos-marches .region-colonnegauche #block-categoriecheckbox .content h3 {
  display: none;
}

.region-colonnegauche div.facet-active li.facet-item .facets-widget- {
    clear: both;
    margin-top: 10px;
    width: 100%;
}

.path-nos-marches .region-colonnegauche div.facet-active .facet-item__count {
    font-size: 14px;
}

.path-nos-marches .region-colonnegauche span.facet-item__count {
    padding-left: 5px;
}

.path-nos-marches .region-colonnegauche div.facet-active li.facet-item input {
    margin-right: 0.7em;
}

.path-nos-marches article .gauche,
.page-node-type-fournisseur article .gauche,
.block-views-blockmarches-suggeres-block-1 article .gauche,
.home-nos-marches-view .node--type-marche .gauche {
    width: 65%;
    padding: 30px 20px 30px;
}

.path-nos-marches article .gauche h2 a:after,
.page-node-type-fournisseur article .gauche h2 a:after,
.block-views-blockmarches-suggeres-block-1 article .gauche h2 a:after,
.home-nos-marches-view .node--type-marche .gauche h2 a:after {
    content: url(../images/arrow-right8.png);
    display:flex;
    align-items: center;
    justify-content: center;
    background-color: #006cd2;
    width: 40px;
    height: 40px;
    position: absolute;
    bottom: 0;
    right: 0;
    z-index:5;
    border-top-left-radius: 10px;
}

.path-nos-marches article .droite,
.block-views-blockmarches-suggeres-block-1 article .droite,
.page-node-type-fournisseur article .droite {
    width: 20%;
}

.path-nos-marches .views-row article .node__content,
.path-nos-marches article,
.page-node-type-fournisseur article,
.block-views-blockmarches-suggeres-block-1 article,
.path-nos-marches article .droite,
.block-views-blockmarches-suggeres-block-1 article .droite,
.page-node-type-fournisseur article .droite  {
    height: 100%;
}

#views-exposed-form-recherche-marches-par-categorie-d-adherents-page-1 .form--inline > div:last-of-type{
    float: none;
    width: 70px;
}
#views-exposed-form-recherche-marches-page-1 .form--inline .form-actions,
#views-exposed-form-recherche-marches-par-categorie-d-adherents-page-1 .form--inline .form-actions,
#views-exposed-form-recherche-reference-page-1 .form--inline .form-actions{
    clear: none;
}
.region-recherche2 select, .region-recherche2 input {
    padding: 16.73px;
    color: #666;
    max-width: 100%;
    width: 100%;
    border-radius: 26px;
}

.region-recherche2 input::placeholder {
    font-family: Poppins;
    font-size: 14px;
    color: #A4A4A4;
}

.region-recherche2 input.form-text {
    border: none;
}

.views-field-field-lots a:after,
.region-recherche2 #edit-actions input:after {
    background-image: url(../images/fleche_blanche_droite.png);
}
#block-catalogue .ligne {
  padding: 1em 2em 2em 2em;
  max-width: 100%;
  line-height: 0;
}

#block-catalogue h2 {
    width: 60%;
}

#block-catalogue p {
	margin:30px 0;
}
.region-formulaire {
	background-color:#f5f1f6;
	justify-content:space-around;
}
.region-formulaire:after {
    background-image: url(../images/bande_blanche2.png);
    background-position: 100% 0;
	background-size:55%;
    bottom: auto;
    top: 0;
}

body.path-frontpage {
  /* Homepage (Frame 695/892, root fill #fbfbfb) - meme fix que
     body.page-node-type-marche (CAIH-34, ligne ~9313) : le
     "body { background-color:#fff !important }" global (ligne 518) doit
     etre battu par un !important plus specifique. Scope a .path-frontpage
     pour ne pas affecter les autres pages. */
  background-color: #fbfbfb !important;
}
/* CAIH-22 : le header flotte en pilule blanche AU-DESSUS de la photo du hero
   (Frame 878, iso 2256:5391), la photo demarre tout en haut de la page.
   Uniquement en desktop (min-width:992px) : la maquette mobile (Frame 929,
   2176:3983) empile header puis hero SANS chevauchement ("header conserve"
   iso 2176:1536/3979, gap 0) - le header y reste dans le flux normal.
   Le header passe en position:absolute plutot qu'un margin-top negatif
   calibre sur une hauteur de header fixe : celle-ci varie trop selon la
   largeur (le menu passe sur 2 lignes en dessous de ~1250px) pour qu'une
   compensation en dur reste fiable a toutes les tailles d'ecran desktop. */
@media (min-width: 992px) {
  .path-frontpage .region-slideshow {
      min-height: 940px;
      position: relative;
      z-index: 1;
  }
  .path-frontpage .layout-container {
      position: relative;
  }
  .path-frontpage header[role="banner"] {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 3;
  }
  /* Pilule blanche flottante sur la photo hero - iso maquette Frame 878
     (2256:5391), UNIQUEMENT sur l'accueil : radius 999px, ombre, largeur
     reduite centree, car elle survole une image plein cadre. */
  .path-frontpage .region-header {
      height: auto;
      min-height: 68px;
      background: #ffffff;
      border-radius: 999px;
      box-shadow: 0px 0px 10px 0px #0000001a;
      box-sizing: border-box;
      /* CAIH-22 : meme formule que #recherche et .page-body-layout
         (ligne ~1283/8519) pour rester sur la meme grille au-dela de
         1800px de viewport - l'ancien "calc(100% - 200px); max-width:1800px"
         plafonnait 200px plus large que #recherche en tres grand ecran. */
      width: calc(min(1800px, 100%) - 200px);
      margin: 20px auto 0;
      padding: 16px 40px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      /* la regle de base ".region-header{justify-content:right}" (sitewide,
         ligne ~951) poussait TOUT le contenu (logo+liens+bouton) contre le
         bord droit de la pilule, laissant un vide a gauche avant le logo -
         iso maquette (Frame 878/2256:5391) le logo demarre juste apres le
         padding gauche, "Portail CAIH" reste a droite via son propre
         margin-left:auto (regle ul#superfish-main). */
      justify-content: flex-start;
  }
  /* Toutes les autres pages (ex. /philosophie-caih) : bandeau plat pleine
     largeur iso maquette Frame 878 (node 2342:249, meme composant reutilise
     par le template "Page contenu_template" 2109:3969) - PAS de pilule/
     radius/ombre ici, juste un fond blanc et le contenu inset par le
     padding (20px haut/bas, 100px cote, iso spec). Il n'y a pas de photo
     hero a survoler sur ces pages. */
  body:not(.path-frontpage) .region-header {
      background: #ffffff;
      box-sizing: border-box;
      min-height: 88px;
      max-width: 1800px;
      margin: auto;
      padding: 20px 100px;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-start;
  }
  /* #block-navigationprincipale n'a pas de largeur/flex explicite en desktop
     (seule la regle mobile @media max-width:990px en pose une) : par defaut
     flex:0 1 auto le laisse a la largeur naturelle de son contenu (~952px),
     plus courte que l'espace dispo dans la pilule - le bouton "Portail CAIH"
     (margin-left:auto sur son <li>, regle ul#superfish-main) se retrouvait
     flush au bord droit de CETTE boite trop etroite, pas au bord droit reel
     de la pilule (vide residuel a droite). flex:1 etire le bloc nav jusqu'au
     bord, le margin-left:auto interne fait alors le reste correctement. */
  #block-navigationprincipale {
      flex: 1 1 auto;
      min-width: 0;
  }
  /* CAIH-23/24/25 : les paragraphes homepage (marches, bannieres, actualites)
     rendent via .page-body-layout, capee a 1512px sitewide (Frame 657) - sur
     grand ecran ca laisse un vide bien plus large que le header/hero/recherche
     (deja elargis a 1800px ci-dessus). Meme cap ici pour rester iso entre
     "menu, paragraphe, header" (feedback deja valide sur CAIH-22). */
  .path-frontpage .page-body-layout {
      max-width: 1800px;
  }
}
.path-frontpage .region-slideshow {
    width: 100%;
    overflow: hidden;
    position: relative;
}
@media (max-width: 991px) {
  .path-frontpage .region-slideshow {
      min-height: 500px;
  }
}
/* CAIH-22 : voile blanc translucide iso mobile (Frame 928, 2176:3979,
   fill #ffffff66) pour garder le titre lisible sur la photo - le hero
   mobile n'a pas la decoupe diagonale blanche du desktop, juste ce voile
   uniforme.
   Pose sur ::before de .region-slideshow (loin dans l'arbre au-dessus de
   la photo) : la photo (div.flex-caption > img) est plusieurs niveaux plus
   bas, dans le contexte d'empilement PROPRE de .flex-caption (position:
   absolute;z-index:-1 ci-dessus) - le voile peignait donc AVANT (derriere)
   la photo malgre son z-index:0, invisible en pratique (verifie visuellement,
   photo pleinement saturee sans voile). Repose ici sur ::after de
   div.flex-caption, EXACT MEME element/contexte que l'IMG et le degrade
   desktop equivalent juste au-dessus (qui fonctionne, meme mecanisme) - un
   ::after peint apres l'IMG (enfant reel) dans le meme contexte, donc
   par-dessus, sans avoir besoin de jongler avec un z-index global. */
@media (max-width: 991px) {
  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.flex-caption::after {
      content: '';
      position: absolute;
      inset: 0;
      background: #ffffff66;
      pointer-events: none;
  }
  .path-frontpage #block-views-block-slideshow-ok-block-1 .views-field-body {
      position: relative;
      z-index: 1;
  }
}

/* CAIH-22 : photo plein cadre + voile degrade, iso Frame 695 (fills du
   noeud racine = IMAGE scaleMode STRETCH + GRADIENT_LINEAR, aucune forme
   diagonale/masque dans la maquette - fillGeometry du cadre est un simple
   rectangle). L'ancien decoupage diagonal (mask Rectangle-1606.png +
   drop-shadow navy, hors maquette) est retire au profit du degrade exact. */
.path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.flex-caption {
    position: absolute;
    inset: 0;
    z-index: -1;
}

@media (min-width: 992px) {
  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.flex-caption::after {
      content: '';
      position: absolute;
      inset: 0;
      background: linear-gradient(70.11deg, #ffffff66 44.9%, #ffffff00 52.77%);
  }
}

.path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.flex-caption > img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.path-frontpage #homepageslider > ol.flex-control-nav.flex-control-paging li a {
    width: 16px;
    background: #BFBFBF;
    border-radius: 4px;
    box-shadow: none;
}

.path-frontpage #homepageslider > ol.flex-control-nav.flex-control-paging li a.flex-active {
    width: 47px;
    background: #006cd2;
}

.path-frontpage #homepageslider > div.flex-viewport {
    height: 100%;
}
@media (max-width: 991px) {
  .path-frontpage #homepageslider > div.flex-viewport {
      min-height: 500px;
  }
}
.path-frontpage #homepageslider .slides,
.path-frontpage #homepageslider .slides > li {
    height: 100%;
}

.path-frontpage #homepageslider > ol.flex-control-nav {
    position: relative;
    top: -33px;
    margin: 0 10%;
    text-align: inherit;
}

.path-frontpage #homepageslider > ul.flex-direction-nav {
    display:none;
}

.path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > h1 {
    color:#000000;
    font-family: 'Poppins', sans-serif;
    font-size: 40px;
    font-weight: 600;
    line-height: 48px;
    width: auto;
    max-width: 618px;
    transition: all ease 0.3s;
}
/* CAIH-22 : #block-views-block-slideshow-ok-block-1 h1 strong (regle heritee)
   impose display:block + font-size:50px + margin-top:20px, ce qui force
   "informatiques" et "telecoms" (les 2 segments en <strong>, iso mixed
   characterStyleOverrides Figma) chacun sur leur propre ligne, et isole
   le "et" (span inline coince entre 2 blocs) sur une 3e ligne a lui seul -
   4 lignes au lieu des 2 lignes naturelles de la maquette. Neutralise ici :
   le <strong> redevient inline, seul son poids (800 vs 400/600) change. */
.path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > h1 strong {
    display: inline;
    font-size: inherit;
    font-weight: 800;
    margin-top: 0;
}
/* iso maquette mobile (Frame 935/2181:4135 : h1 2176:4028, Poppins 600
   30px, lh 42px) - 3 regles heritees a differents breakpoints (35px/25px/
   22px, aucune n'a de line-height propre donc heritent 48px de la regle
   desktop ci-dessus) forcaient un texte plus petit et un interligne trop
   grand par rapport a la taille, cassant le passage a 3 lignes attendu.
   !important necessaire pour battre les 3 tailles heritees (cascade par
   ordre de source, la plus etroite gagne normalement). */
@media (max-width: 991px) {
  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > h1 {
      font-size: 30px !important;
      line-height: 42px !important;
  }
}

#block-views-block-slideshow-ok-block-1 .views-field-body a {
    background-color: #006cd2;
    border: 1px solid #006cd2;
    /* iso maquette (Link 2176:4029, mobile) : padding 12/22/12/22, Poppins
       400 18px lh24 - le bouton heritait du style ".button" generique
       partage par des dizaines d'autres boutons du site (padding:10px 20px
       !important, font-size:16px, font-weight:500), plus petit/plus gras
       que la maquette. Scope a ce bouton precis uniquement. */
    padding: 12px 22px !important;
    font-size: 18px;
    font-weight: 400;
    line-height: 24px;
}

#block-views-block-slideshow-ok-block-1 .views-field-body a:hover {
    /* CAIH-36 : meme regression que les boutons Portail CAIH - le fond par
       defaut a ete corrige en #006cd2 juste au-dessus, mais l'etat :hover
       etait reste sur l'ancien cyan #006cd2. */
    background-color: #006cd2;
    border: 1px solid #006cd2;
    color:white;
}

.path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div {
    margin: 0 10%;
    /* CAIH-22 : regle heritee (max-width:990px, ligne ~6559) centrait le
       texte hero en mobile - la maquette (iPhone 17, 2181:4135) l'aligne a
       gauche comme le desktop. Cette regle-ci (non scopee a un media
       query) a une specificite superieure et gagne a toutes les tailles. */
    text-align: left;
}
/* CAIH-22 : la regle ci-dessus (margin:0 10%) est plus specifique que la
   grille max-width/auto posee plus haut et gagnait la cascade, recalant le
   texte hero a gauche au lieu de l'aligner sur la meme grille que le
   header/#recherche sur tres grand ecran. Reaffirme ici avec un selecteur
   de specificite equivalente. */
@media (min-width: 992px) {
  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div {
      /* CAIH-22 : meme formule que .region-header/#recherche (ligne ~1837/1283)
         pour rester sur la meme grille au-dela de 1800px de viewport. */
      width: calc(min(1800px, 100%) - 200px);
      margin-left: auto;
      margin-right: auto;
  }
}

.path-frontpage .caih-newsletter {
    background-image:url(../images/newsletter-caih.png);
    width: 100%;
    min-height: 467px;
    background-position-y: center;
    background-position-x: -800px;
    color: white;
    display: flex;
    align-items: center;
    justify-content: center;
}

.path-frontpage .caih-newsletter .region-newsletter {
    width: auto;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-type-email,
.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-item-nom-de-votre-etablissement {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    margin: 1.5em 1em;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-type-email label,
.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-item-nom-de-votre-etablissement label {
    font-size: 18px;
    font-weight: 600;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-type-email input,
.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-item-nom-de-votre-etablissement input {
    background-color: #132346;
    border: none;
    padding: 1em;
    border-radius: 5px;
    color: white;
    width: 100%;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form #edit-actions-submit, #block-views-block-slideshow-ok-block-1 .views-field-body a {
    padding: 10px 20px !important;
}
/* La regle ci-dessus et celle du CTA hero (plus haut dans ce fichier,
   ~ligne 1983) ciblent le meme element avec la meme specificite + toutes
   deux !important - celle-ci gagnait par ordre de source. Reaffirme ici,
   apres, le padding iso maquette (Link 2176:4029 : 12/22/12/22). */
#block-views-block-slideshow-ok-block-1 .views-field-body a {
    padding: 12px 22px !important;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-item {
    margin-bottom: 0;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-item-case-rgpd {
    display: inline-flex;
    align-items: flex-start;
    width: 65%;
}

.path-frontpage .caih-newsletter  #block-webform-4 .webform-submission-caih-newsletter-form .form-item-case-rgpd input {
    accent-color: #006cd2;
}

.path-frontpage .caih-newsletter  #block-webform-4 #edit-processed-text {
    text-align: center;
    font-size: 24px;
    font-weight: bold;
}

#block-titrebourse {
    padding: 30px 30px 0px;
    position: relative;
    width: 100%;
    z-index: 9;
}
#block-titrebourse .ligne {
	padding:0;
}
#block-titrebourse h2,
#block-titrebourse p {
	margin-bottom:30px;
}
#block-titrebourse a {
	margin-right:30px;
}
#block-titrebourse .field--type-image img {
	margin:auto;
}
.page-node-type-proposition-de-don #block-webform,
.region-content > div#block-views-block-les-derniers-don-block-1,
.region-content > div#block-propositiondedonform {
	background: rgb(39,58,98);
	background: linear-gradient(30deg, rgba(39,58,98,1) 53%, rgba(58,187,204,1) 100%);
    -webkit-box-shadow: 0 0 20px rgba(0, 0, 0 , 0.3);
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0 , 0.3);
    box-shadow: 0 0 20px rgba(0, 0, 0 , 0.3);
	margin-bottom:30px;
	padding:30px 2.5%;
	width:55%;
}
.page-node-type-proposition-de-don #block-webform {
    width: 95%;
    max-width: 1400px;
}
.page-node-50 #block-asco-theme-content {
	margin:0 auto;
	max-width:90%;
}
.region-content > div#block-views-block-les-derniers-don-block-1 {
	background:none;
    background-color: #fff;
    width: 20%;
}
#block-views-block-les-derniers-don-block-1 .ligne.ligne-titre,
#block-propositiondedonform .ligne.ligne-titre {
	padding:0;
}
.page-node-type-proposition-de-don #block-webform h2, #block-views-block-les-derniers-don-block-1 h2 {
    color: #000;
    text-align: center;
    width: 100%;
}
.page-node-type-proposition-de-don #block-webform h2 {
	color:#fff;
	margin:0 0 15px;
}
#block-views-block-les-derniers-don-block-1 .views-field-title a {
	color:#ee6a1a;
	display:block;
	font-size:18px;
	margin-bottom:30px;
	text-align:center;
}
#block-views-block-les-derniers-don-block-1 .views-field-title a:hover {
	color:#000;
}
#block-views-block-les-derniers-don-block-1 .view-footer a.btn {
    background-color: transparent;
    border-color: #000;
    color: #000;
    display: block;
    margin: 20px auto 40px;
    width: 150px;
}
#block-views-block-les-derniers-don-block-1 .view-footer a.btn:hover {
	background-color:#000;
	color:#fff;
}
#node-proposition-de-don-form .field--type-datetime input,
input.form-text:focus, input.form-tel:focus, input.form-email:focus, input.form-url:focus,
input.form-search:focus, input.form-file:focus, input.form-number:focus, input.form-color:focus, textarea.form-textarea:focus,
select:focus {
	outline:none;
}
#webform-submission-reponse-annonce-node-31-add-form,
#webform-submission-contact-node-46-add-form,
#node-proposition-de-don-form {
	color:#fff;
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
#webform-submission-reponse-annonce-node-31-add-form > div {
	display:flex;
}
#webform-submission-reponse-annonce-node-31-add-form label {
    color: #fff;
    display: block;
    font-size: 1em;
    margin-top: 15px;
    width: 120px;
}
#webform-submission-reponse-annonce-node-31-add-form select,
#webform-submission-reponse-annonce-node-31-add-form input {
	width:calc(100% - 120px);
}
#webform-submission-contact-node-46-add-form {
    background: rgb(39,58,98);
    background: linear-gradient(30deg, rgba(39,58,98,1) 53%, rgba(58,187,204,1) 100%);
    color: #fff;
    margin-bottom: 30px;
    margin-top: 30px;
    padding: 20px;
}
#webform-submission-contact-node-46-add-form .form-item,
#webform-submission-contact-node-46-add-form .form-actions,
#node-proposition-de-don-form .form-item, #node-proposition-de-don-form .form-actions {
    margin-top: 0;
    margin-bottom: 0;
}
#node-proposition-de-don-form .field--type-string-long,
#node-proposition-de-don-form .field--type-datetime,
#node-proposition-de-don-form .field--type-email,
#node-proposition-de-don-form .field--type-string {
	width:45%;
}
#node-proposition-de-don-form .field--type-string-long label,
#node-proposition-de-don-form .field--type-datetime h4.label,
#node-proposition-de-don-form .field--type-email label,
#node-proposition-de-don-form .field--type-string label {
	display:none;
}
#node-proposition-de-don-form .field--type-datetime input,
#node-proposition-de-don-form .field--type-email input,
#node-proposition-de-don-form .field--type-string input {
	border:none;
	color:#000;
	width:100%;
}
#webform-submission-contact-node-46-add-form .js-form-type-textarea {
	width:100%;
}
#webform-submission-contact-node-46-add-form .js-form-type-textarea textarea,
#webform-submission-contact-node-46-add-form .js-form-type-textfield input,
#webform-submission-contact-node-46-add-form .js-form-type-email input,
#webform-submission-contact-node-46-add-form .js-form-type-tel input {
	border:none;
    border-radius: 30px;
    color: #000;
    margin-bottom: 20px;
    width: 100%;
    min-height: 45px;
    padding-left: 10px;
}
#webform-submission-contact-node-46-add-form .js-form-type-textfield,
#webform-submission-contact-node-46-add-form .js-form-type-email,
#webform-submission-contact-node-46-add-form .js-form-type-tel {
	width:47.5%;
}
#webform-submission-contact-node-46-add-form .js-form-type-checkbox {
	margin-bottom:20px;
}
#webform-submission-contact-node-46-add-form .js-form-type-checkbox input {
	float:left;
}
#node-proposition-de-don-form details > .details-wrapper {
	padding:0;
}
#node-proposition-de-don-form .field--type-string select,
#node-proposition-de-don-form .field--type-string textarea {
	border:none;
}
.form-composite > .fieldset-wrapper > .description, .form-item .description {
	font-size:14px;
}
#node-proposition-de-don-form .field--type-entity-reference {
	float:left;
	width:45%;
}
#node-proposition-de-don-form .vertical-tabs {
	display:none;
}
#captcha {
	border:none;
	float:right;
	width:45%;
}
.g-recaptcha {
	float:right;
}
#node-proposition-de-don-form .field--type-entity-reference label {
	display:block;
	float:left;
	width:140px;
}
#node-proposition-de-don-form .field--type-entity-reference select {
	color:#000;
	width:calc(100% - 150px);
}
#node-proposition-de-don-form #captcha .details-description,
#node-proposition-de-don-form summary {
	display:none;
}
.page-node-type-proposition-de-don #block-webform input.form-submit,
#webform-submission-contact-node-46-add-form input.form-submit,
#node-proposition-de-don-form input.form-submit {
    background-color: transparent;
    background-image: none;
    border: 1px solid #fff;
    color: #fff;
    cursor: pointer;
    display: block;
	font-family:'Poppins', sans-serif;
	font-size:1em;
    width: 200px;
}
.page-node-type-proposition-de-don #block-webform input.form-submit:hover,
#webform-submission-contact-node-46-add-form input.form-submit:hover,
#node-proposition-de-don-form input.form-submit:hover {
	background-color:#fff;
	color:#ee6a1a;
}
.page-node-type-proposition-de-don .node--type-proposition-de-don .field__label,
.page-node-type-proposition-de-don .node--type-proposition-de-don .field--type-entity-reference .field__label {
    font-weight: bold;
    display: block;
    float: left;
    width: 220px;
}
#block-webform-2 {
    width: 45%;
    float: left;
}
#webform-submission-contact-node-46-add-form input.form-submit {
    background-color: #006cd2;
    border: 1px solid #006cd2;
    color: #fff;
    font-size: 16px;
    margin-bottom: 20px;
}
#webform-submission-contact-node-46-add-form input.form-submit:hover {
	background-color:#fff;
	color:#006cd2;
}
#block-contact {
    background-color: #fff;
    box-shadow: 0 0 30px rgb(0 0 0 / 20%);
    float: right;
	  margin: 30px 0;
    padding: 40px 2.5%;
    text-align: center;
    width: 375px;
}

#block-contact iframe {
  width: auto;
}

.page-node-46 .region-content {
  justify-content: space-evenly;
}

#block-contact .ligne {
	display:block;
}
#block-contact strong {
	color:#006cd2;
	font-size:20px;
}
.region-evenements {
	background-color:#fff;
	padding:30px 0 50px;
}
#block-views-block-anciens-evenements-block-1 {
    margin: 0 auto;
    max-width: 80%;
}
.jcarousel-skin-default .jcarousel-control-prev, .jcarousel-skin-default .jcarousel-control-next {
	box-shadow:none;
	-webkit-box-shadow:none;
	text-shadow:none;
}
#block-views-block-anciens-evenements-block-2 .view-header,
#block-views-block-evenements-block-3 .view-header,
#block-views-block-evenements-block-2 .view-header,
#block-views-block-evenements-block-1 .view-header,
.block-views-blockevenements-block-2 .view-header,
.block-views-blockmarches-block-1 .view-header,
.block-views-blockmarches-block-1 .view-content,
.block-views-blockmarches-suggeres-block-1 .view-header,
.block-views-blockmarches-suggeres-block-1 .view-content,
.block-views-blockevenements-block-2 .view-header,
.block-views-blockevenements-block-2 .view-content,
#block-views-block-evenements-block-1 .view-content,
#block-views-block-medias-block-1 .view-header,
#block-views-block-medias-block-1 .view-content {
    display: flex;
    flex-wrap: wrap;
    margin: 0 auto;
    max-width: 80%;
    padding: 20px 0;
    justify-content: space-between;
    align-items: center;
  @media (max-width: 768px) {
    flex-direction: column;
    align-items: stretch;
  }
}
#block-views-block-anciens-evenements-block-2 .view-header p,
#block-views-block-evenements-block-3 .view-header p,
#block-views-block-evenements-block-2 .view-header p,
#block-views-block-evenements-block-1 .view-header p,
.block-views-blockevenements-block-2 .view-header p,
#block-views-block-medias-block-1 .view-header p{
  margin: 0;
}
#block-views-block-anciens-evenements-block-2 h2,
#block-views-block-evenements-block-3 h2,
#block-views-block-evenements-block-2 h2,
.block-views-blockevenements-block-2 h2,
#block-views-block-evenements-block-1 h2 {
	margin-top:0;
	padding-right:150px;
}
#block-views-block-anciens-evenements-block-2 h2 {
	margin-top:0;
}
#block-views-block-anciens-evenements-block-2 p a,
#block-views-block-evenements-block-3 p a,
#block-views-block-evenements-block-2 p a,
#block-views-block-evenements-block-1 p a,
.block-views-blockmarches-block-1 .view-header a,
.block-views-blockevenements-block-2 p a,
#block-views-block-medias-block-1 p a {
	background-color:transparent !important;
	border-color:#006cd2 !important;
  color: #006cd2;
	margin-right:20px;
}

@media screen and (min-width: 720px) {
  #block-views-block-anciens-evenements-block-2 p a,
  #block-views-block-evenements-block-3 p a,
  #block-views-block-evenements-block-2 p a,
  #block-views-block-evenements-block-1 p a,
  .block-views-blockmarches-block-1 .view-header a,
  .block-views-blockevenements-block-2 p a,
  #block-views-block-medias-block-1 p a {
    width: initial;
  }

}

#block-views-block-anciens-evenements-block-2 p a:after,
#block-views-block-evenements-block-3 p a:after,
#block-views-block-evenements-block-2 p a:after,
#block-views-block-evenements-block-1 p a:after,
.block-views-blockevenements-block-2 p a:after,
.block-views-blockmarches-block-1 .view-header a:after,
#block-views-block-medias-block-1 p a:after{
	background-image: url(../images/fleche_bleu_droite.png);
}
#block-views-block-anciens-evenements-block-2 p a:hover,
#block-views-block-evenements-block-3 p a:hover,
#block-views-block-evenements-block-2 p a:hover,
.block-views-blockevenements-block-2 p a:hover,
.block-views-blockmarches-block-1 p a:hover,
#block-views-block-evenements-block-1 p a:hover,
#block-views-block-medias-block-1 p a:hover,
.block-views-blockmarches-block-1 .view-header a:hover{
	background-color: #006cd2 !important;
	color:#fff !important;
}
#block-views-block-anciens-evenements-block-2 p a:hover:after,
#block-views-block-evenements-block-3 p a:hover:after,
#block-views-block-evenements-block-2 p a:hover:after,
.block-views-blockevenements-block-2 p a:hover:after,
.block-views-blockmarches-block-1 p a:hover:after,
#block-views-block-evenements-block-1 p a:hover:after,
#block-views-block-medias-block-1 p a:hover:after,
.block-views-blockmarches-block-1 .view-header a:hover:after{
	background-image:url(../images/fleche_blanche_droite.png);
}
#block-views-block-anciens-evenements-block-2 .ligne,
#block-views-block-evenements-block-3 .ligne,
.block-views-blockevenements-block-2 .ligne,
#block-views-block-evenements-block-2 .ligne,
#block-views-block-anciens-evenements-block-1 .ligne {
	padding:0;
}
#block-views-block-anciens-evenements-block-2 .jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-2,
#block-views-block-evenements-block-3 .jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-2,
#block-views-block-evenements-block-2 .jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-2,
#block-views-block-evenements-block-1 .jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-2 {
	border:none;
	height:auto;
	padding-bottom:50px;
	width:100%;
    -webkit-border-radius: 0;
    -moz-border-radius: 0;
    border-radius: 0;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    box-shadow:none;
}
#block-views-block-anciens-evenements-block-2 .jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-2,
#block-views-block-evenements-block-3 .jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-2,
#block-views-block-evenements-block-2 .jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-2 {
	margin:0;
}
#block-views-block-anciens-evenements-block-2 .flexslider .slides img {
    max-height: 200px !important;
    width: auto;
}
.view-anciens-evenements .view-content,
.view-evenements-page .view-evenements .view-content {
    width: auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.view-anciens-evenements .view-content,
.view-evenements-page .view-evenements .view-content {
	margin-top:50px;
}
.view-anciens-evenements .view-content .views-row,
.view-evenements-page .view-evenements .views-row {
    -webkit-box-shadow: 0 0 20px rgb(0 0 0 / 30%);
    -moz-box-shadow: 0 0 20px rgba(0, 0, 0 , 0.3);
    box-shadow: 0 0 20px rgb(0 0 0 / 30%);
    float: none;
    height: auto;
    margin: 20px 20px 50px;
    padding-bottom: 10px;
    position: relative;
    width: 46%;
}
.jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-4,
.jcarousel-wrapper.jcarousel-skin-default.jcarousel-visible-3
{
    border: none;
	-webkit-border-radius:none;
	box-shadow:none;
	height:auto;
    max-width: 100%;
    margin: 0;
    padding: 0;
    width: 100%;
}
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel ul,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel ul,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel ul,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel ul,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel ul,
.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel ul,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel ul,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel ul{
	display:flex;
}
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel li,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel li,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel li,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel li,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel li,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel li,
.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel li,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel li{
    height: auto;
    margin: 20px 0 50px;
    padding-bottom: 60px;
    max-width: 100%;
	  position:relative;
    width: 260px;
}

.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel li,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel li {
  padding-bottom: 0;
  margin: 0 20px 0 0;
}

#block-views-block-anciens-evenements-block-2 h2, #block-views-block-evenements-block-3 h2, #block-views-block-evenements-block-2 h2, .block-views-blockevenements-block-2 h2, #block-views-block-evenements-block-1 h2 {
  margin-top: 0;
  padding-right: 0px;
}
@media screen and (min-width: 320px) {
  #block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel li,
  #block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel li,
  #block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel li,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel li,
  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel li,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel li,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel li,
  #block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel li {
    width: 300px;
  }

  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel li {
    padding-bottom: 0;
  }
}
@media screen and (min-width: 720px) {
  #block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel li,
  #block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel li,
  #block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel li,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel li,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel li,
  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel li,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel li,
  #block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel li {
    width: 380px;
  }

  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-prev,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-prev,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-prev,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-prev{
    left: 0 !important;
  }

  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-next,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-next,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-next{
    right: 0 !important;
  }
}

@media screen and (min-width: 992px) {
  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-prev,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-prev,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-prev,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-prev{
    left: -65px !important;
  }

  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-next,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-next,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-next{
    right: -65px !important;
  }
}
@media screen and (max-width: 720px) {
  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-prev,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-prev,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-prev,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-prev{
    left: -30px !important;
  }

  .block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
  .block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-next,
  .block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-next,
  #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-next{
    right: -30px !important;
  }
}

#block-views-block-anciens-evenements-block-2 li {
    padding-bottom: 60px;
}
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel li {
	width:300px;
}
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel li ul li,
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel li ul li,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel li ul li,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel li ul li,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel li ul li,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel li ul li,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel li ul li,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel li ul li,
.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel li ul li {
	float:none;
    margin:0;
    padding-bottom: 0;
    width: auto;
}
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel-control-prev,
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-prev,
.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel-control-prev,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel-control-prev,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-prev,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-next,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-prev,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-prev,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel-control-prev {
    background-color:transparent;
    background-size: 40px;
    border-radius: 0;
    border: none;
    height: 100%;
    left: 0;
    margin-top: 0;
    top: 0;
    width: 50px;
    z-index: 99;
  @media (min-width: 992px) {
    left: -65px;
  }
}

.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-prev,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-prev {
  left: 0 !important;
  @media (min-width: 1600px) {
    left: -65px !important;
  }
}

#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel-control-prev:hover,
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel-control-next:hover,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel-control-prev:hover,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel-control-next:hover,
.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-prev:hover,
.block-views-blockmarches-block-1  .jcarousel-skin-default .jcarousel-control-next:hover,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel-control-prev:hover,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel-control-next:hover,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-prev:hover,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-next:hover,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-prev:hover,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-next:hover,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-prev:hover,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-next:hover,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel-control-next:hover,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel-control-prev:hover{
    background-color: rgba(255,255,255, 0.7);
}
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-next,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-next,
.block-views-blockmarches-block-1 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel-control-next{
	left:auto;
	right: 0;
  @media (min-width: 992px) {
    right: -65px;
  }
}

.block-views-blockmarches-suggeres-block-1 .jcarousel-skin-default .jcarousel-control-next,
.block-views-blockevenements-block-2 .jcarousel-skin-default .jcarousel-control-next {
  right: 0 !important;
  @media (min-width: 1600px) {
    right: -65px !important;
  }
}
#block-views-block-anciens-evenements-block-2 .views-field,
#block-views-block-evenements-block-3 .views-field,
#block-views-block-evenements-block-2 .views-field,
.block-views-blockevenements-block-2 .views-field,
.block-views-blockmarches-suggeres-block-1 .views-field,
.view-anciens-evenements .view-content .views-row .views-field,
.view-evenements-page .view-evenements .views-row .views-field,
#block-views-block-evenements-block-1 .views-field {
	padding:0 10px;
}
#block-views-block-anciens-evenements-block-2 .views-field.views-field-type,
.view-evenements-page .views-field-type,
.view-actualites .views-field-type,
#block-views-block-evenements-block-3 .views-field.views-field-type,
.block-views-blockevenements-block-2 .views-field.views-field-type,
.block-views-blockmarches-suggeres-block-1 .views-field.views-field-type,
#block-views-block-evenements-block-2 .views-field.views-field-type,
#block-views-block-evenements-block-1 .views-field.views-field-type {
    background-color: #273a62;
    color: #fff;
    margin: 0 10px;
    padding: 5px 10px;
    text-align: left;
}
#block-views-block-anciens-evenements-block-2 .views-field.views-field-type.Actualité,
.view-actualites .views-field-type,
#block-views-block-evenements-block-3 .views-field.views-field-type.Actualité,
#block-views-block-evenements-block-2 .views-field.views-field-type.Actualité,
.block-views-blockevenements-block-2 .views-field.views-field-type.Actualité,
.block-views-blockmarches-suggeres-block-1 .views-field.views-field-type.Actualité,
#block-views-block-evenements-block-1 .views-field.views-field-type.Actualité {
	background-color:#3e65b2;
}
#block-views-block-anciens-evenements-block-2 .views-field.views-field-views-conditional-field,
.view-evenements-page .views-field-field-date-de-debut,
.view-actualites .views-field-created,
#block-views-block-evenements-block-3 .views-field.views-field-views-conditional-field,
.block-views-blockevenements-block-2 .views-field.views-field-views-conditional-field,
.block-views-blockmarches-suggeres-block-1 .views-field.views-field-views-conditional-field,
#block-views-block-evenements-block-2 .views-field.views-field-views-conditional-field,
#block-views-block-evenements-block-1 .views-field.views-field-views-conditional-field {
    color: #fff;
    font-size: 0.9em;
    position: absolute;
    right: 10px;
    z-index: 9;
    top: 7px;
}
#block-views-block-anciens-evenements-block-2 .views-field.views-field-field-image,
#block-views-block-evenements-block-3 .views-field.views-field-field-image,
.block-views-blockevenements-block-2 .views-field.views-field-field-image,
#block-views-block-evenements-block-2 .views-field.views-field-field-image,
.view-anciens-evenements .view-content .views-row .views-field-field-image,
.block-views-blockmarches-suggeres-block-1 .view-content .views-row .views-field-field-image,
.view-evenements-page .view-evenements .views-row .views-field-field-image,
#block-views-block-evenements-block-1 .views-field.views-field-field-image {
	padding:0;
}
#block-views-block-anciens-evenements-block-2 .views-field.views-field-field-date-de-debut,
#block-views-block-evenements-block-3 .views-field.views-field-field-date-de-debut,
.block-views-blockevenements-block-2 .views-field.views-field-field-date-de-debut,
#block-views-block-evenements-block-2 .views-field.views-field-field-date-de-debut,
#block-views-block-evenements-block-1 .views-field.views-field-field-date-de-debut,
.view-evenements-page .view-evenements .views-row .views-field-field-date-de-debut,
.view-anciens-evenements .view-content .views-row .views-field-field-date-de-debut{
    background-color: #006cd2;
	border-radius:20px;
    color: #fff;
    font-size: 15px;
    top: 20px;
    right: 20px;
    padding: 10px 15px;
    position: absolute;
    text-align: center;
    width: 170px;
}
.view-marches-suggeres .node--view-mode-teaser {
	background-color:#273a62;
    margin-bottom: 0;
    border-bottom: none;
	padding-top:20px;
}

.page-node-type-fournisseur #block-views-block-test-block-1 .view-test .view-empty > span {
  text-align: center;
  width: 100%;
  display: block;
  padding-bottom: 4em;
}

.view-marches-suggeres .flex-viewport {
	background-color:#273a62;
}
.view-marches-suggeres .flex-control-nav {
	bottom:5px;
}
.view-marches-suggeres .flex-control-paging li a.flex-active {
    background: #fff;
    background: rgba(255, 255, 255, 1);
}
.view-marches-suggeres .flex-control-paging li a {
    background: rgba(255, 255, 255, 0.5);
}
.node--view-mode-teaser .node__content {
    background-color: #fff;
    padding-bottom: 30px;
    font-size: 1em;
    line-height: 1.6;
    max-width: 400px;
    margin: 0px auto 30px;
    padding: 20px;
}
.node--view-mode-teaser .node__content .ligne {
	padding:0;
}
.node--type-evenement {
	position:relative;
}
.view-editeurs-securite .view-content,
.view-fournisseur .view-content,
.node--type-evenement .node__content {
	display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
.node--type-evenement .field--name-body .ligne {
	padding:0;
}
.node--type-evenement .field--name-field-media-image .ligne {
	padding:0;
}
.node--type-evenement .field--name-body div,
.node--type-evenement.node .field--type-image div {
	margin:auto;
}
/*.page-node-type-agenda .field--name-field-date-de-debut {
	left:20px;
	right:auto;
	top:20px;
}*/
#block-views-block-anciens-evenements-block-2 .views-field-title a,
#block-views-block-evenements-block-3 .views-field-title a,
#block-views-block-evenements-block-2 .views-field-title a,
.view-anciens-evenements .view-content .views-row .views-field-title a,
.view-evenements-page .view-evenements .views-row .views-field-title a,
#block-views-block-evenements-block-1 .views-field-title a,
#block-asco-theme-views-block-evenements-block-2 .views-field-title a{
	color:#000;
	display:block;
	font-size:20px;
	font-weight:600;
	margin:10px 0;
}
#block-views-block-anciens-evenements-block-2 .views-field-title a:hover,
#block-views-block-evenements-block-3 .views-field-title a:hover,
#block-views-block-evenements-block-2 .views-field-title a:hover,
.view-anciens-evenements .view-content .views-row .views-field-title a:hover,
.view-evenements-page .view-evenements .views-row .views-field-title a:hover,
#block-views-block-evenements-block-1 .views-field-title a:hover,
#block-asco-theme-views-block-evenements-block-2 .views-field-title a:hover{
	color:#006cd2;
}
#block-views-block-anciens-evenements-block-2 .views-field-view-node a,
#block-views-block-evenements-block-3 .views-field-view-node a,
.view-evenements-page .views-field-view-node a,
.view-actualites .views-field-view-node a,
#block-views-block-evenements-block-2 .views-field-view-node a,
.view-anciens-evenements .view-content .views-row .views-field-view-node a,
.view-evenements-page .view-evenements .views-row .views-field-view-node a,
#block-views-block-evenements-block-1 .views-field-view-node a,
#block-asco-theme-views-block-evenements-block-2 .views-field-view-node a{
	display:block;
	margin:10px 0 0;
	width:90px;
}
#block-views-block-anciens-evenements-block-2 .views-field-view-node a,
#block-views-block-evenements-block-3 .views-field-view-node a,
.view-evenements-page .views-field-view-node a,
.view-actualites .views-field-view-node a,
#block-views-block-evenements-block-2 .views-field-view-node a,
#block-views-block-evenements-block-1 .views-field-view-node a,
#block-asco-theme-views-block-evenements-block-2 .views-field-view-node a{
	bottom:0;
	left:0;
	position:absolute;
}
.region-chiffres {
	background-color:#fff;
	padding:50px 30px;
}
.region-chiffres .ligne {
	display:block;
}
.region-chiffres h2 {
	text-align:center;
}
.region-chiffres .text-formatted ul {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin:0;
	padding:0;
}
.region-chiffres ul li {
	list-style:none;
	margin-bottom:30px;
	text-align:center;
	width:33.33%;
}
.region-chiffres ul li:first-child,
.region-chiffres ul li:nth-child(3) {
	background-image:url(../images/picto_etablissement.png);
}
.region-chiffres ul li:nth-child(2) {
	background-image:url(../images/picto_ordinateur.png);
}
.region-chiffres ul li:last-child {
	background-image:url(../images/picto_cadis.png);
}
.region-chiffres ul li:nth-child(5) strong,
.region-chiffres ul li strong {
	color:#3e65b2;
	display:block;
	font-size:60px;
	font-weight:600;
}
.region-chiffres ul li:nth-child(4) strong,
.region-chiffres ul li:nth-child(2) strong {
	color:#273a62;
}
.region-chiffres ul li:nth-child(3) strong,
.region-chiffres ul li:last-child strong {
	color:#006cd2;
}
.path-editeurs-securite .view-editeurs-securite,
.path-fournisseurs .view-fournisseur {
	margin:0 auto;
	width:80%;
}
.view-editeurs-securite .views-exposed-form .form--inline,
.view-fournisseur .views-exposed-form .form--inline {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin: 0 auto 20px;
    max-width: 550px;
}
.view-editeurs-securite .views-exposed-form .form--inline #edit-actions input,
.view-fournisseur .views-exposed-form .form--inline #edit-actions input {
    margin-right: 0.6em;
    margin-top: 20px;
    padding: 5px 20px 5px 20px;
}
.view-editeurs-securite .views-exposed-form .form-actions,
.view-fournisseur .views-exposed-form .form-actions {
	margin-top:0;
}
.view-editeurs-securite .views-exposed-form .js-form-item-sort-by,
.view-fournisseur .views-exposed-form .js-form-item-sort-by {
	display:none;
}
.view-editeurs-securite .views-exposed-form select,
.view-fournisseur .views-exposed-form select {
    border: 1px solid #ccc;
    height: 32px;
}
.view-editeurs-securite .view-content .views-row,
.view-fournisseur .view-content .views-row {
	margin-bottom:20px;
	text-align:center;
	width:15%;
}
.view-editeurs-securite .view-content .views-row img,
.view-fournisseur .view-content .views-row img {
	display:block;
	margin:0 auto;
}
.view-editeurs-securite .view-content .views-row img:hover,
.view-fournisseur .view-content .views-row img:hover {
	transform:scale(1.1);
	-moz-transform:scale(1.1);
	-webkit-transform:scale(1.1);
}
.view-editeurs-securite .view-content .views-row:hover .views-field-title a,
.view-fournisseur .view-content .views-row:hover .views-field-title a {
	color:#fff;
}
.view-editeurs-securite .view-content .views-row .views-field-title a,
.view-fournisseur .view-content .views-row .views-field-title a {
	color:#333;
	display:block;
	font-size:16px;
	font-weight:600;
	padding:20px 20px 10px;
	text-align:center;
}
.view-editeurs-securite .view-content .views-row .views-field-field-logo img,
.view-fournisseur .view-content .views-row .views-field-field-logo img {
	display:block;
	margin:0 auto;
	padding:0px 20px 20px;
}
footer {
	clear:both;
}
.region-footer a.btn {
    /* display:block + width:80px (regle heritee, pensee pour l'ancien texte
       "Contact") remplace par inline-block SANS largeur : "Prenons contact"
       (2256:5814, texte iso maquette) est plus long, et pour un element
       display:block, width:auto = remplit tout le parent (pas "hug
       content" comme je le pensais au premier essai - ca donnait un
       bouton pleine largeur de la colonne Contact, 322px, avec un gros
       vide autour du texte centre) - retour utilisateur avec capture.
       inline-block se dimensionne naturellement sur son contenu. */
    display: inline-block;
    margin-top: 10px;
    white-space: nowrap;
}
/* CAIH-27 : bouton "Prenons contact" iso maquette (2256:5813/5814) - pilule
   bleue #006cd2 sans fleche (la classe .btn generique/site-wide a une fleche
   via a.btn:after partagee par des dizaines d'autres boutons, donc override
   scope ici plutot que touche a la regle globale). */
.region-footer a.btn {
    background-color: #006cd2;
    border-color: #006cd2;
    padding: 12px 22px;
    font-weight: 400;
}
.region-footer a.btn:after {
    display: none;
}
#block-footer {
    background-color: #f1f1f1;
    /* padding lateral 102px (Figma node 2253:2882, frame "Footer" : padding
       50/102/50/102) : #block-footer .ligne n'a que max-width+margin:auto
       (pas de width), donc en dessous du plafond (1800px) elle occupe 100%
       du conteneur et margin:auto n'a plus rien a repartir - logo/contact
       collaient au bord du viewport sur toute largeur < 1800px (aggrave
       par le passage 1700->1800px, la fenetre de largeurs concernees s'est
       elargie). Meme padding de securite que #block-footer2 juste en
       dessous (aligne sur la meme valeur Figma), applique ici sur le
       wrapper et non sur .ligne pour ne pas devier des 1308px pixel-parfait
       de la maquette (meme raisonnement que le commentaire sur
       #block-footer2 - la padding vit sur le FRAME Figma, pas sur le
       contenu interieur). */
    padding: 30px 102px;
    /* CAIH-27 : gap iso maquette entre la derniere section homepage
       (Chiffres cles, Frame 716) et le footer (Frame 892) - mesure via
       les coordonnees absolues Figma (memes x, meme frame parent) :
       chiffres-cles.y(2236)+height(382)=2618, footer.y=2778 -> 160px.
       Le flux naturel ne donnait que 60px, retour utilisateur confirme
       un ecart visible. */
    margin-top: 100px;
}
/* CAIH-27 : disposition 3 colonnes (logo/liens/contact) - le contenu
   WYSIWYG (#block-footer, body field) n'a que 2 <div> enfants (liens,
   contact), pas de 3e pour le logo : ajoute en ::before plutot que de
   toucher au contenu, meme image que la regle remplacee ci-dessus (aucun
   nouvel asset). Gap 271px (CAIH-41) : realigne sur une remesure du
   Figma actuel (Frame 868/2256:5747) - la valeur 200px precedemment
   validee en direct datait d'une lecture Figma a 40px, elle-meme
   depassee par le fichier Figma actuel. Decision utilisateur explicite
   de suivre le Figma actuel plutot que l'ancien choix visuel. */
#block-footer .ligne:not(.ligne-titre) {
    display: flex;
    align-items: flex-start;
    gap: 271px;
    max-width: 1308px;
    padding: 0;
    padding-bottom: 30px;
    background-image: none;
    /* box-shadow retire : present dans les donnees brutes du spec Figma
       (Frame 868/2256:5747) mais invisible sur le rendu reel de la
       maquette (verifie sur le PNG de reference aplati sur le vrai fond
       #f1f1f1 - carte totalement plate, confirme par retour utilisateur
       avec capture) - effet Figma sans fill qui ne rend pas visuellement,
       contrairement a un box-shadow CSS qui s'affiche meme sans fond. */
    /* CAIH-28 : separateur (Line 1, 2256:5815, #cfcfd3) deplace depuis
       #block-footer (ou il etait en pleine largeur, bord a bord de la
       page) vers ici : le trait doit avoir la meme largeur/alignement que
       le contenu (1308px centre), pas deborder sur toute la largeur du
       bandeau gris - retour utilisateur avec capture annotee montrant le
       trait plus large que les colonnes au-dessus et la barre "Mentions
       Legales" en dessous. padding-bottom 30px pour re-creer l'espace
       auparavant fourni par le padding vertical du bloc englobant. */
    border-bottom: 1px solid #cfcfd3;
}
#block-footer .ligne:not(.ligne-titre)::before {
    content: '';
    flex: 0 0 220px;
    height: 85px;
    background-image: url(../images/logo_footer.svg);
    background-position: left center;
    background-repeat: no-repeat;
    background-size: contain;
}
/* largeur "hug content" plafonnee a 224px (largeur du cadre Figma
   2256:5802, sert de limite de retour a la ligne pour "Nos origines /
   Notre philosophie") plutot qu'une largeur fixe : une largeur fixe
   laissait un vide interne (le lien le plus long ne fait que ~176-200px)
   qui s'ajoutait visuellement au gap flexbox de 40px, rendant l'espace
   colonne-liens -> colonne-contact plus large que logo -> colonne-liens
   alors que les deux doivent etre identiques (retour utilisateur). */
#block-footer .ligne:not(.ligne-titre) > div:first-of-type {
    flex: 0 0 200px;
}
#block-footer .ligne:not(.ligne-titre) > div:first-of-type a {
    color: #000000;
}
#block-footer .ligne:not(.ligne-titre) > div:last-of-type {
    flex: 1 1 322px;
    max-width: 322px;
}
#block-footer p {
	margin-bottom:10px;
}
#block-footer2 {
    background-color: #f1f1f1;
    /* padding laterale ajoutee ICI plutot que sur .ligne ci-dessous : .ligne
       mappe exactement le node Figma Frame 911 (2253:2952, padding propre
       0/0/0/0, largeur 1308px) - lui ajouter un padding l'aurait fait
       deriver de la spec (largeur > 1308px des que le viewport atteint la
       largeur de reference). Porter la marge sur le wrapper #block-footer2
       laisse Frame 911 pixel-perfect tout en protegeant "Mentions
       Legales"/icones du bord. Valeur 102px : le parent commun Figma des 2
       blocs footer (frame "Footer", node 2253:2882) a un padding
       50/102/50/102 - #block-footer2 est un block Drupal distinct sans
       node Figma propre pour cette valeur, donc on reprend celle du frame
       parent qui les englobe tous les deux (etait 20px, sous-estimee -
       retour utilisateur avec capture annotee montrant logo/icones colles
       au bord). */
    /* padding-top:0 (au lieu de 15px) - le gap au-dessus du separateur
       (#block-footer .ligne padding-bottom:30px) et le gap en dessous
       (#block-footer padding-bottom:30px, qui se poursuit apres le trait
       car celui-ci est a l'interieur de .ligne) doivent etre identiques ;
       les 15px d'origine s'ajoutaient par-dessus ces 30px deja presents,
       rendant l'espace du bas visiblement plus grand que celui du haut -
       retour utilisateur avec capture annotee.
       padding-bottom:30px (au lieu de 10px) - meme raisonnement : l'espace
       sous "Mentions Legales"/icones (bas de page) doit egaler l'espace
       au-dessus (30px, entre le separateur et la ligne), retour
       utilisateur avec capture DevTools. */
    padding: 0 102px 30px;
}
#block-footer2 p {
	margin:15px 0;
}
/* CAIH-28 : ligne basse iso maquette (Frame 911/2256:5816) - "Mentions
   Legales" a gauche, icones a droite (space-between), meme largeur/
   alignement que la carte du haut (Frame 868, CAIH-27). */
#block-footer2 .ligne:not(.ligne-titre) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 10px;
    max-width: 1308px;
    margin: 0 auto;
    padding: 0;
}
/* #block-footer2 p { margin:15px 0 } (regle heritee de l'ancien layout
   empile) gonflait la ligne a 54px au lieu de 44px (iso hauteur des
   icones) - neutralise ici, le <p> "Mentions Legales" n'a plus besoin de
   marge verticale en ligne horizontale. */
#block-footer2 .ligne:not(.ligne-titre) p {
    margin: 0;
}
/* CAIH-28 : couleur exacte iso maquette (Mentions Legales/2256:5818,
   #010101) - le lien n'a pas de couleur propre en base (WYSIWYG), donc il
   heritait du bleu de lien par defaut du site. */
#block-footer2 .ligne:not(.ligne-titre) a {
    color: #010101;
}
@media all and (min-width: 1440px) {
  /* footer (logo/liens/contact + Mentions Legales/icones) reste a 1308px
     sur grand ecran, plus etroit que le contenu de page desormais elargi
     a 1800px (#block-asco-theme-content, .node--type-marche/page,
     .hero-marche__card) - incoherent, retour utilisateur avec capture
     grand ecran. Place APRES les regles de base (memes selecteurs,
     meme specificite) pour gagner la cascade a l'ordre des regles. */
  #block-footer .ligne:not(.ligne-titre),
  #block-footer2 .ligne:not(.ligne-titre) {
      max-width: 1800px;
  }
}
.contact-footer {
	display:flex;
	gap: 10px;
}
/* Icones cassees en base (fichiers manquants, 404 : picto_linkedin.png,
   picto_contact2.png, picto_tel.png) - remplacees par le sprite SVG
   extrait de la maquette (Frame 910/2256:5819, 3 cercles bleus #006cd2 +
   picto blanc LinkedIn/mail/telephone), en sprite CSS (background-position)
   sur les <a> existants pour garder les liens (linkedin/contact/tel)
   fonctionnels sans toucher au contenu. */
.contact-footer img {
	display: none;
}
.contact-footer a {
	display: block;
	width: 44px;
	height: 44px;
	background-image: url(../images/icons/footer-social-sprite.svg);
	background-repeat: no-repeat;
}
.contact-footer a:nth-child(1) { background-position: 0 0; }
.contact-footer a:nth-child(2) { background-position: -54px 0; }
.contact-footer a:nth-child(3) { background-position: -108px 0; }
/* Pages taxo */
.node__content {
    margin-top: 0;
    font-size: 1em;
}
.region-slideshow {
	position:relative;
}
#block-filsdariane,
#block-asco-theme-breadcrumbs {
	background-color:#f2f2f2;
	padding:5px;
	position:relative;
	z-index:9;
}
.breadcrumb ol {
	font-style:italic;
    text-align: center;
}

.page-node-type-agenda #haut-evenement,
.page-node-type-evenement #haut-evenement {
    display:flex;
}

.page-node-type-agenda #haut-evenement #gauche,
.page-node-type-evenement #haut-evenement #gauche {
    width: 70%;
}
.page-node-type-agenda #haut-evenement #droite,
.page-node-type-evenement #haut-evenement #droite {
    width: 30%;
    margin-top: 20px;
}

.page-node-type-agenda #haut-evenement #gauche .ligne,
.page-node-type-evenement #haut-evenement #gauche .ligne {
    color: #273A62;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-date-de-debut,
.page-node-type-evenement #haut-evenement #droite .field--name-field-date-de-debut,
.page-node-type-agenda #haut-evenement #droite .field--name-field-event-type,
.page-node-type-agenda #haut-evenement #droite .field--name-field-lieu-de-l-evenement,
.page-node-type-evenement #haut-evenement #droite .field--name-field-event-type {
    background-color: #F6F6F6;
    padding: 0.7em 2.7em;
    border-radius: 5px;
    margin: 5px 0;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-pour-s-inscrire,
.page-node-type-evenement #haut-evenement #droite .field--name-field-pour-s-inscrire {
  background-color: #006cd2;
  padding: 0.7em 2.7em;
  border-radius: 5px;
  margin: 5px 0;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-pour-s-inscrire:hover,
.page-node-type-evenement #haut-evenement #droite .field--name-field-pour-s-inscrire:hover {
  background-color: white;
  border: 1px solid #006cd2;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-pour-s-inscrire:hover a,
.page-node-type-evenement #haut-evenement #droite .field--name-field-pour-s-inscrire:hover a {
  color: #006cd2;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-pour-s-inscrire,
.page-node-type-evenement #haut-evenement #droite .field--name-field-pour-s-inscrire {
  float: unset;
  text-align: center;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-pour-s-inscrire a,
.page-node-type-evenement #haut-evenement #droite .field--name-field-pour-s-inscrire a {
  background-color: transparent !important;
  border: none !important;
  padding: unset !important;
}

/*.page-node-type-agenda #haut-evenement #droite .field--name-field-pour-s-inscrire a:hover {
  background-color: #006cd2 !important;
  border:1px solid #006cd2 !important;
}*/

.page-node-type-agenda #haut-evenement #droite .field .field__label,
.page-node-type-evenement #haut-evenement #droite .field .field__label {
    text-transform: uppercase;
    display: inline-flex;
    position: relative;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-date-de-debut .field__label:before,
.page-node-type-evenement #haut-evenement #droite .field--name-field-date-de-debut .field__label:before {
    content: url('../images/calendar3-event.png');
    position: absolute;
    left: -27px;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-event-type .field__label:before,
.page-node-type-evenement #haut-evenement #droite .field--name-field-event-type .field__label:before {
    content: url('../images/building.png');
    position: absolute;
    left: -27px;
}

.page-node-type-agenda #haut-evenement #droite .field--name-field-lieu-de-l-evenement .field__label:before {
    content: url('../images/location.png');
    position: absolute;
    left: -27px;
}

.page-node-type-agenda #haut-evenement #droite .field .field__item .ligne,
.page-node-type-evenement #haut-evenement #droite .field .field__item .ligne {
    color: #747474;
    margin-top: 0.5em;
}

.page-node-type-agenda #haut-evenement #droite .groupe,
.page-node-type-evenement #haut-evenement #droite .groupe {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    flex-direction: column;
}

.page-node-type-agenda .groupe2 .field--type-text-with-summary,
.page-node-type-evenement .groupe2 .field--type-text-with-summary {
    width: 60% !important;
}

.page-node-type-agenda #block-titredepage h1,
.page-node-type-evenement #block-titredepage h1 {
    text-align: center !important;
}

.path-nos-marches .views-element-container.contextual-region .view-header {
    font-style: initial;
    color: black;
    font-weight: 300;
    font-size: 16px;
    width: 100%;
    text-align: center;
    margin: 2em 0 1em;
}

#block-titredepage h1, #block-asco-theme-page-title h1 {
    color: #273a62;
    font-size: 50px;
    font-weight: 600;
    text-align: center;
    background-color: #e7edf5;
    margin: 0;
    padding: 1em;
}

.page-node-type-marche #block-titredepage h1 {
  background-color: #f2f2f2;
}

#block-asco-theme-content {
    padding: 30px 0;
    position: relative;
    z-index: 9;
}
.page-node-285 #block-asco-theme-content,
.path-anciens-evenements #block-asco-theme-content,
.page-node-51 #block-asco-theme-content,
.page-node-54 #block-asco-theme-content,
.page-node-48 #block-asco-theme-content,
.page-node-49 #block-asco-theme-content,
.page-node-91 #block-asco-theme-content,
.page-node-145 #block-asco-theme-content,
.page-node-146 #block-asco-theme-content,
.page-node-47 #block-asco-theme-content {
	margin:0 auto;
	max-width:80%;
}
.page-node-type-evenement #block-asco-theme-content,
.page-node-type-marche #block-asco-theme-content ,
.page-node-type-agenda #block-asco-theme-content{
    padding:0;
}
.page-node-type-agenda .node__meta{
  display: none;
}
#block-asco-theme-content .content {
}
/*.node--view-mode-teaser {
	border:1px solid #232f3e;
	border-radius:20px;
	padding:20px;
}
.node--view-mode-teaser h2 {
	margin-top:0;
	padding-top:0;
}
.node--view-mode-teaser h2 a {
	color:#232f3e;
	font-size:22px;
	font-weight:600;
}
.node--view-mode-teaser h2 a:hover {
	color:#006cd2;
}
.node--view-mode-teaser p:last-of-type {
	margin-bottom:0;
}
.node__links {
    text-align: left;
    font-size: 1em;
}
ul.inline li {
    display: inline;
    padding: 0;
    list-style-type: none;
}
ul.inline li a {
    background-color: #232f3e;
    color: #006cd2;
    display: block;
    font-size: 16px;
    margin: 10px 0;
    width: 120px;
    padding: 5px 15px;
}
ul.inline li a:hover {
	background-color:#006cd2;
	color:#232f3e;
}*/
/* Pages marchés */
/*#block-asco-theme-content .ligne, .node--type-marche .ligne {*/
/*    display: block;*/
/*    max-width: 100%;*/
/*    padding: 0;*/
/*}*/
.page-node-54 #block-asco-theme-content .ligne,
.page-node-49 #block-asco-theme-content .ligne {
	display:flex;
}
.node .field--type-image {
    float: none;
    margin: 0;
}
.page-node-91 .colonne_1-3,
.page-node-54 .colonne_1-3 {
	display:flex;
	margin-bottom:20px;
}
.page-node-54 .colonne_1-1 {
	margin-bottom:30px;
}
.page-node-91 .colonne_1-1 h2 {
	margin-bottom:30px;
	text-align:center;
}
.page-node-91 .colonne_1-3 a,
.page-node-54 .colonne_1-3 a {
	margin:auto;
}
.page-node-91 .colonne_1-3 img,
.page-node-54 .colonne_1-3 img {
	display:block;
	height:auto;
	margin:auto;
	width:120px;
}
#pilliers {
    background-image: url(../images/pilliers.png);
    background-position: left center;
    background-repeat: no-repeat;
    font-weight: 500;
    margin: 40px auto 20px;
    padding: 20px 0 5px 265px;
    max-width: 750px;
}
.page-node-47.page-node-type-page .region-sidebar-first .ligne {
	display:flex;
	display:block;
}
.page-node-54.page-node-type-page .region-sidebar-first .ligne {
	display:flex;
}
.page-node-47 table {
	margin-bottom:50px;
}
.page-node-47 table tr {
    padding: 0.1em 0.6em;
    border-bottom: 1px solid #ccc;
    background: #efefef;
    background: transparent;
}
.page-node-47 .colonne_1-2 div img,
.page-node-47 .colonne_1-3 div img{
	max-width:260px;
}
.page-node-47 table td {
    padding-top: 20px;
    vertical-align: top;
}
.page-node-47 table td img {
	display:block;
	margin:0 auto;
}
.page-node-47 .colonne_1-2 > div,
.page-node-47 .colonne_1-3 > div {
	background-color:#f2f2f2;
	margin:0 auto 50px;
	padding:20px;
	text-align:center;
	width:260px;
}
.page-node-47 table td h3,
.page-node-47 table td h2,
.page-node-47 .colonne_1-2 div h3,
.page-node-47 .colonne_1-3 div h2,
.page-node-47 .colonne_1-2 div h2,
.page-node-47 .colonne_1-3 div h3 {
	text-align:center;
}
.page-node-47 table td h2,
.page-node-47 .colonne_1-3 div h2,
.page-node-47 .colonne_1-2 div h2 {
	margin-top:0;
}
.page-node-47 table td h2,
.page-node-47 .colonne_1-2 div h2, .page-node-47 .colonne_1-3 div h2 {
    background-color: #006cd2;
    color: #fff;
    margin-bottom: 0;
	margin-top:0;
    padding: 5px;
}
.node.node--type-marche .field--name-field-media-image,
.node.node--type-marche .field--type-image {
    float:right;
  @media (min-width: 991px) {
    margin: 0 0 0 1em;
  }
}
.node.node--type-marche .field--name-field-media-image,
.node.node--type-marche .field--type-image {
	clear:both;
    float: none;
  @media (min-width: 991px) {
    margin: 1em auto;
  }
}
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 .node--type-marche .field--type-datetime {
	display:flex;
	flex-wrap:wrap;
}
.node--type-marche .field--type-datetime > div {
	margin-right:10px;
}
.node--type-marche .field--type-datetime.field--name-field-date-de-fin {
	margin-bottom:20px;
}
.field--type-entity-reference {
	font-family:'Poppins', sans-serif;
}
.field--type-entity-reference .field__label, .field--type-entity-reference ul.links {
	font-size:1em;
}
/* Recherche */
#block-formulaireexposerecherche-donspage-1,
#block-formulaireexposerecherche-lotpage-1-2 {
	margin:0 auto;
	max-width:1400px;
	padding:0 20px;
}
#block-formulaireexposerecherche-donspage-1 .js-form-item,
#block-formulaireexposerecherche-lotpage-1-2 .js-form-item {
	width:100%;
}
#block-formulaireexposerecherche-donspage-1 input,
#block-formulaireexposerecherche-lotpage-1-2 input {
	padding:10px 5px;
	max-width:290px;
	width:100%;
}
#block-formulaireexposerecherche-lotpage-1-2 input.button,
#block-formulaireexposerecherche-lotpage-1-2 label {
	display:none;
}
.view-recherche-lot h3 {
	margin-bottom:0;
}
.view-recherche-lot h3 a {
    background-color: #ee6a1a;
    color: #fff;
    display: block;
    font-weight: 500;
    padding: 5px 20px;
	text-align:center;
}
.view-recherche-lot h3 a:hover {
	background-color:#006cd2;
}
.view-recherche-lot .views-row {
    background-color: #f2f2f2;
    border-bottom: 1px solid #ddddde;
	margin-bottom:10px;
    padding: 20px;
}
.view-recherche-lot .views-row p:last-of-type {
	margin-bottom:0;
}
.view-test .pager,
.view-recherche-lot .pager {
	margin-bottom:30px;
}
.page-node-type-page .region-sidebar-second .ligne,
.page-node-type-page .region-sidebar-first .ligne {
	display:block;
	max-width:100%;
	padding:0;
}
.page-node-54 .page-node-type-page .region-sidebar-first .ligne {
	display:flex;
}
/*.region-sidebar-first {
    background-color: #f5f1f6;
    border-bottom: 1px solid #ddddde;
    clear: both;
	display: flex;
    flex-wrap: wrap;
	margin-top:20px;
	padding:20px 10%;
    width: 80%;
}*/
.region-sidebar-second, .region-sidebar-first {
    background-color: transparent;
    border-bottom: none;
    display: block;
    float: left;
    margin-top: 0;
    padding: 50px 2.5% 50px 10%;
    width: 50%;
}
.page-node-289 .region-sidebar-first {
    float: none;
    margin-top: 0;
    padding: 50px 30px;
    width: 100%;
}
.region-sidebar-second {
    padding: 50px 10% 50px 2.5%;
    width: 22.5%;
}
.align-center .field--type-image img {
	display:block;
	margin:0 auto 10px;
}
.page-node-46 main aside,
.path-frontpage main aside,
.path-frontpage #block-nouscontacter,
.path-frontpage #block-decouvrirnosmarches {
	display:none;
}
/* CAIH-25b : le bloc "Contenu de la page principale" (field_corps_modulaire, cf.
   config/block.block.contenudelapageprincipale) est place en region sidebar_first
   (rendue en <aside>, quirk heritee documentee CAIH-29/30) et se retrouve donc
   masque par la regle generique ci-dessus sur la page d'accueil. On le reaffiche
   explicitement sans reactiver les autres asides (nouscontacter, decouvrirnosmarches)
   volontairement masques sur cette page. */
.path-frontpage main aside:has(#block-contenudelapageprincipale) {
	display: block;
}
#block-adherezaumarcheelodi,
#block-accedezauportailhelios,
#block-telechargezlecataloguedesediteurs,
#block-nouscontacter,
#block-decouvrirnosmarches {
	background-color:#273a62;
	color:#fff;
	margin-bottom:50px;
	padding:20px;
	text-align:center;
}

#block-nouscontacter,
#block-decouvrirnosmarches {
    border-radius: 15px;
    padding: 30px 20px;
    width: 247px;
}

#block-nouscontacter a.btn:after,
#block-decouvrirnosmarches a.btn:after {
    display:none;
}


#block-nouscontacter a.btn,
#block-decouvrirnosmarches a.btn {
    padding: 10px 20px;
}

#block-nouscontacter h2, #block-decouvrirnosmarches h2 {
    font-size: 18px;
}

#block-accedezauportailhelios,
#block-nouscontacter {
	background-color:#3e65b2;
	margin-bottom:0;
}
#block-accedezauportailhelios {
	margin-bottom:50px;
}
#block-decouvrirnosmarches .ligne {
	display:block;
}
#block-decouvrirnosmarches h2 {
	color:#fff;
	margin-top:10px;
	margin-bottom:40px;
}
#block-adherezaumarcheelodi h2,
#block-accedezauportailhelios h2,
#block-telechargezlecataloguedesediteurs h2,
#block-nouscontacter h2 {
	margin-bottom:20px;
	margin-top:10px;
}
#block-nouscontacter p:first-of-type {
	margin-bottom:30px;
}
#block-adherezaumarcheelodi a.btn,
#block-accedezauportailhelios a.btn {
	display:block;
}
#block-reinitialiserlesfiltres, .region-sidebar-first .views-exposed-form, div.facet-inactive, div.facet-active {
    background-color: #273a62;
    border-bottom: 1px solid #fff;
    color: #fff;
    padding: 0 20px 25px;
    width: auto;
}

.path-nos-marches div.facet-inactive, .path-nos-marches div.facet-active {
    border-bottom: none;
}

#block-formulaireexposerecherche-marchespage-1,
#block-asco-theme-formulaireexposerecherche-referencepage-1{
    background-color: #F9F9FB;
    padding: 40px 60px;
    position: relative;
}

.js input.form-autocomplete {
    background-image: none;
    background-repeat: no-repeat;
    background-position: 100% center;
}

#block-formulaireexposerecherche-marches-par-categorie-adherentspage-1{
	background-color:#273a62;
	padding:20px;
	position:relative;
}

#block-formulaireexposerecherche-marchespage-1 .form-actions,
#block-formulaireexposerecherche-marches-par-categorie-adherentspage-1 .form-actions
#block-asco-theme-formulaireexposerecherche-referencepage-1 .form-actions{
	position:absolute;
	right:20px;
	top:20px;
}
#block-formulaireexposerecherche-marchespage-1 .form-actions input.button,
#block-formulaireexposerecherche-marches-par-categorie-adherentspage-1 .form-actions input.button,
#block-asco-theme-formulaireexposerecherche-referencepage-1 .form-actions input.button
{
    background-color: transparent;
    background-image: url(../images/picto_loupe-grise.png);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 25px;
    border: none;
    display: block;
    height: 30px;
    font-size: 0px;
    width: 30px;
    margin-top: 4px;
}
#block-formulaireexposerecherche-marchespage-1 .form-actions input.button:hover,
#block-formulaireexposerecherche-marches-par-categorie-adherentspage-1 .form-actions input.button:hover
#block-asco-theme-formulaireexposerecherche-referencepage-1 .form-actions input.button:hover{
	background-size:25px;
	color:transparent;
}
.block-facet--checkbox h3 {
	color:#fff;
}
.groupe {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}
.view-taxonomy-term .view-header {
	padding:50px 0;
}
.view-taxonomy-term .view-header {
	font-style:italic;
	font-size:18px;
	margin-bottom:30px;
	text-align:center;
}

.view-test .view-header {
  font-style:italic;
  font-size:18px;
  margin-bottom:30px;
  text-align:left;
  padding: 0 10%;
}

.view-taxonomy-term .view-header .field--name-description {
    font-size: 14px;
    font-style: normal;
    text-align: left;
}
.view-taxonomy-term .view-header .field--name-description .ligne {
	display:block;
	max-width:100%;
	padding:0;
}
.view-taxonomy-term .view-header .field--name-field-media-image {
    width: 130px;
    float: right;
}
.view-taxonomy-term .view-header .content {
	flex-wrap:wrap;
	justify-content:space-between;
	margin:0 auto;
}
.view-recherche-marches .pager {
	margin-top:30px;
}

.view-taxonomy-term .groupe,
.view-recherche-marches .groupe {
    padding: 20px 0 10px 20px;
}

.path-nos-marches .view-recherche-marches .groupe,
.home-nos-marches-view .node--type-marche .groupe,
.block-views-blockmarches-suggeres-block-1 .node--type-marche .groupe {
    padding: 0px;
}

.path-nos-marches .view-recherche-marches .groupe .field--name-field-reference,
.home-nos-marches-view .node--type-marche .groupe .field--name-field-reference,
.block-views-blockmarches-suggeres-block-1 .node--type-marche .groupe .field--name-field-reference,
.page-node-type-fournisseur .node--type-marche .groupe .field--name-field-reference {
  display: flex;
  gap: 7px;
  color: white;
  margin-bottom: 2rem;
  label {
    font-weight: 500;
  }
}

.path-nos-marches article .droite img,
.page-node-type-fournisseur article .droite img,
.block-views-blockmarches-suggeres-block-1 article .droite img,
.home-nos-marches-view .node--type-marche .droite img {
    position: absolute;
    top: 0;
    height: 100% !important;
    object-fit: cover;
    right: -30px;
    clip-path: polygon(67% 0,100% 0,100% 100%,48% 100%);
    z-index: 0;
}

.path-nos-marches .gauche .field--name-field-dates-debut-fin,
.page-node-type-fournisseur .gauche .field--name-field-dates-debut-fin,
.block-views-blockmarches-suggeres-block-1 .gauche .field--name-field-dates-debut-fin,
.home-nos-marches-view .node--type-marche .gauche .field--name-field-dates-debut-fin {
    margin: 1em auto;
    display: inline-block;
    color: white;
    font-size: 12px;
    width: auto;
    white-space: nowrap;
}

.path-nos-marches .gauche .field--name-field-dates-debut-fin:before,
.page-node-type-fournisseur .gauche .field--name-field-dates-debut-fin:before,
.block-views-blockmarches-suggeres-block-1 .gauche .field--name-field-dates-debut-fin:before,
.home-nos-marches-view .node--type-marche .gauche .field--name-field-dates-debut-fin:before {
    content: url(../images/calendar2.png);
    float: left;
    margin-right: 1em;
}

.path-nos-marches .gauche .field.field--name-field-categorie.field--type-entity-reference,
.block-views-blockmarches-suggeres-block-1 .gauche .field.field--name-field-categorie.field--type-entity-reference,
.home-nos-marches-view .node--type-marche .gauche .field.field--name-field-categorie.field--type-entity-reference{
    margin:auto;
}

.path-nos-marches .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items,
.home-nos-marches-view .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items,
.block-views-blockmarches-suggeres-block-1 .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items,
.home-nos-marches-view .node--type-marche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items,
.page-node-type-fournisseur .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
}

 .path-nos-marches .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item,
 .home-nos-marches-view .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item,
 .block-views-blockmarches-suggeres-block-1 .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item,
 .page-node-type-fournisseur .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item,
 .home-nos-marches-view .node--type-marche .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item
{
    background-color: white;
    margin: 3px 2px;
    border-radius: 5px;
    border: 1px solid #006cd2;
 }

 .path-nos-marches .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item a,
 .home-nos-marches-view .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item a,
 .page-node-type-fournisseur .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item a,
 .block-views-blockmarches-suggeres-block-1 .gauche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item a,
 .home-nos-marches-view .node--type-marche .field.field--name-field-categorie.field--type-entity-reference.field--label-hidden.field__items .field__item a
 {
    color: #006cd2;
    text-decoration: none;
    font-size: 12px;
    font-weight: 600;
    padding: 1em;
    font-family: 'Poppins';
    white-space: nowrap;
}

/*.gauche, .droite {
	width:47.5%;
}
.droite {
	padding-top:50px;
}*/
.view-test .view-content,
.view-taxonomy-term .view-content,
.view-recherche-marches .view-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 10% 0 5%;
}
.view-taxonomy-term .view-content,
.view-test .view-content {
	margin-bottom:30px;
	padding:0 10%;
}
.view-taxonomy-term .view-content,
.view-taxonomy-term .view-content {
    padding: 50px 10%;
}
.view-taxonomy-term .view-content .views-row,
.view-test .view-content .views-row,
.view-recherche-marches .view-content .views-row,
.block-views-blockmarches-suggeres-block-1 .jcarousel-wrapper li,
.home-nos-marches-view .jcarousel-wrapper li {
    background-color: #273a62;
    overflow: hidden;
    margin-bottom: 30px;
    max-width: 45%;
}

.path-nos-marches .view-recherche-marches .view-content .views-row,
.page-node-type-fournisseur .view-test .view-content .views-row,
.block-views-blockmarches-suggeres-block-1 .jcarousel-wrapper li,
.home-nos-marches-view .jcarousel-wrapper li {
border-radius: 10px;
height: auto;
min-height: 308px;
}

.node--view-mode-en-tete .ligne{
	padding:0;
}

.view-recherche-marches .node--type-marche .ligne,
.page-node-type-fournisseur .node--view-mode-en-tete .ligne,
.home-nos-marches-view .node--type-marche .ligne,
.block-views-blockmarches-suggeres-block-1 .ligne {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
  padding: 0;
  max-width: 100%;
}

.view-recherche-marches .node--type-marche:after {
    background-image: url(../images/bande_blanche2.png);
    background-position: 0% 0px;
    background-repeat: no-repeat;
    background-size: 540px 70px;
    top: 0;
    content: "";
    height: 90px;
    position: absolute;
    left: 40%;
    z-index: 2;
    width: 100%;
}

.path-nos-marches .node--view-mode-en-tete:after,
.path-nos-marches .view-recherche-marches .node--type-marche:after {
    display:none;
}

.view-taxonomy-term .node--view-mode-en-tete .node__content,
.view-taxonomy-term .node--view-mode-en-tete header,
.view-recherche-marches .node--type-marche header,
.view-recherche-marches .node--type-marche .node__content {
	position:relative;
	z-index:9;
}
.view-taxonomy-term .node--type-marche h2,
.view-test .node--type-marche h2,
.view-taxonomy-term .node--view-mode-en-tete h2,
.block-views-blockmarches-block-1 .home-nos-marches-view h2,
.block-views-blockmarches-suggeres-block-1 h2,
.view-recherche-marches .node--type-marche h2 {
    font-size: 20px;
    margin-top: 0;
}

.block-views-blockmarches-block-1 .home-nos-marches-view .view-header h2,
.block-views-blockmarches-suggeres-block-1 .view-header h2 {
  font-size: 24px;
}

.view-taxonomy-term .node--type-marche h2 a,
.view-taxonomy-term .node--view-mode-en-tete h2 a,
.view-recherche-marches .node--type-marche h2 a,
.block-views-blockmarches-block-1 .home-nos-marches-view h2 a,
.block-views-blockmarches-suggeres-block-1 h2 a,
.page-node-type-fournisseur .view-test .node--type-marche h2 a
{
    color: #fff;
    display: block;
    padding-right: 20px;
}
.view-taxonomy-term .node--type-marche .field--name-field-media-image img,
.view-test .field--name-field-media-image img,
.view-taxonomy-term .node--view-mode-en-tete .field--type-image img,
.view-recherche-marches .field--type-image img,
.block-views-blockmarches-suggeres-block-1 .field--type-image img,
.block-views-blockmarches-block-1 .home-nos-marches-view .field--type-image img
{
    margin: 0 0 -16px;
}
.view-taxonomy-term .node--type-marche h2 a:hover,
.view-test .node--type-marche h2 a:hover,
.view-taxonomy-term .node--view-mode-en-tete h2 a:hover,
.view-recherche-marches .node--type-marche h2 a:hover,
.block-views-blockmarches-block-1 h2 a:hover
.block-views-blockmarches-suggeres-block-1 h2 a:hover
{
    color: #006cd2;
}
.view-taxonomy-term .node--type-marche .field--type-text-with-summary,
.view-taxonomy-term .node--type-marche p,
.view-taxonomy-term .node--type-marche li,
.view-taxonomy-term .node--type-marche h2,
.view-taxonomy-term .node--type-marche h3,
.view-test .node--type-marche .field--type-text-with-summary,
.view-test .node--type-marche p,
.view-test .node--type-marche li,
.view-test .node--type-marche h2,
.view-test .node--type-marche h3,
.view-taxonomy-term .node--view-mode-en-tete .field--type-text-with-summary,
.view-taxonomy-term .node--view-mode-en-tete p,
.view-taxonomy-term .node--view-mode-en-tete li,
.view-taxonomy-term .node--view-mode-en-tete h2,
.view-taxonomy-term .node--view-mode-en-tete h3,
.view-recherche-marches .node--type-marche .field--type-text-with-summary,
.block-views-blockmarches-block-1 .node--type-marche .field--type-text-with-summary,
.block-views-blockmarches-suggeres-block-1 .node--type-marche .field--type-text-with-summary,
.view-recherche-marches .node--type-marche p,
.view-recherche-marches .node--type-marche li,
.view-recherche-marches .node--type-marche h2,
.view-recherche-marches .node--type-marche h3 {
	color:#fff;
}
.view-taxonomy-term .node--type-marche .field--name-field-type,
.view-test .node--type-marche .field--name-field-type,
.view-taxonomy-term .node--view-mode-en-tete .field--name-field-type
{
    background-color: #006cd2;
    color: #fff;
    max-width: 200px;
    right: 0;
    position: absolute;
    text-align: center;
    top: 70px;
    padding: 5px 20px;
    z-index: 99;
}

.view-taxonomy-term .node--type-marche .daterange-timeline .after,
.view-taxonomy-term .node--type-marche .daterange-timeline,
.view-recherche-marches .node--type-marche .daterange-timeline .after,
.view-recherche-marches .node--type-marche .daterange-timeline {
	height:10px;
}
.view-taxonomy-term .node--type-marche .daterange-timeline .now:after,
.view-recherche-marches .node--type-marche .daterange-timeline .now:after {
    background-color: #fff;
    background-image: none;
    height: 8px;
    top: -5px;
	  width:7px;
}
.view-taxonomy-term .node--type-marche .daterange-timeline span,
.view-recherche-marches .node--type-marche .daterange-timeline span {
	top:20px;
}
.view-taxonomy-term .node--type-marche .field--name-field-categorie a,
.view-test .node--type-marche .field--name-field-categorie a,
.view-taxonomy-term .node--view-mode-en-tete .field--name-field-categorie a,
.view-recherche-marches .node--type-marche .field--name-field-categorie a {
	color:#fff;
	text-decoration:underline;
}
.field--name-lots-number {
	color:#fff;
	font-size:20px;
	font-weight:600;
	margin:10px 0 20px;
}

.home-nos-marches-view article,
.block-views-blockmarches-suggeres-block-1 .views-field-field-autres-marches-suggeres,
.home-nos-marches-view article > .node__content,
.block-views-blockmarches-suggeres-block-1 .views-field-field-autres-marches-suggeres > .field-content
{
  height: 100%;
}

.view-taxonomy-term .node--type-marche .field--name-field-media-image,
.view-test .node--type-marche .field--name-field-media-image,
.view-recherche-marches .node.node--type-marche .field--name-field-media-image,
.view-recherche-marches .node.node--type-marche .field--type-image {
	margin:0;
}
.pager__item {
    font-size: 15px;
}
#block-reinitialiserlesfiltres {
    margin: 0;
    padding-bottom: 0;
    padding-top: 17px;
}
ul.js-facets-checkbox-links {
    padding: 0 0 0.25em 0.5em;
}
div.facet-active h2
div.facet-inactive h2 {
	color:#000;
	font-size:18px;
	margin-bottom:10px;
}
div.facet-active ul, div.facet-inactive ul {
	margin:0;
	padding:0;
}
div.facet-active li.facet-item, div.facet-inactive li.facet-item {
    display: flex;
    flex-wrap: wrap;
    list-style: none;
	margin-bottom:5px;
    width: 100%;
}
div.facet-active li.facet-item label, div.facet-inactive li.facet-item label {
	color: #006cd2;
    font-weight: 600;
    text-transform: uppercase;
}
div.facet-active li.facet-item .facets-widget- label, div.facet-inactive li.facet-item .facets-widget- label {
	color: #909090;
    font-weight: 400 !important;
    text-transform: none;
}
div.facet-active li.facet-item .facets-widget-,
div.facet-inactive li.facet-item .facets-widget- {
	clear:both;
	margin-top:5px;
	width:100%;
}
div.facet-active li.facet-item input, div.facet-inactive li.facet-item input {
    margin-right: 0.5em;
    margin-top: 5px;
}
div.facet-active .facet-item__value,
div.facet-active .facet-item__count,
div.facet-inactive .facet-item__value,
div.facet-inactive .facet-item__count {
	font-size:16px;
}

.path-nos-marches main {
    background-color: #f9f9fb;
}

.path-nos-marches main .views-element-container {
    background-color: white;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul {
    background-color: white;
    margin: 2em;
    box-shadow: 0px 0px 6px #0000000D;
    border-radius: 10px;
    padding: 1.5em 2em 2em 3em;
    position:relative;
}

.path-nos-marches #categorie-reset-all  {
    visibility: hidden;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facets-reset > label
{
    position: absolute;
    top: -47px;
    right: 16px;
    color: #006cd2;
    font-weight: 300;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facets-reset > label > span.facet-item__count {
    display:none;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--expanded > label:after {
    content: url('../images/arrow-right-bold.svg');
    display: inline-block;
    transform: rotate(270deg);
    margin-left: 7px;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--collapsed > label:after {
    content: url('../images/arrow-right-bold.svg');
    display: inline-block;
    transform: rotate(90deg);
    margin-left: 7px;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--expanded > div.facets-widget- > ul > li > input,
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item > input
{
    position: absolute;
    opacity: 0;
    height: 0;
    width: 0;
}
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--expanded > div.facets-widget- > ul > li > label,
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item > label {
    position: relative;
    display: block;
    padding-left: 15px;
    cursor: pointer;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--expanded > div.facets-widget- > ul > li > label:before,
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item > label:before {
    content: '';
    position: absolute;
    margin-top: 3px;
    left: -13px;
    display: block;
    height: 15px;
    width: 15px;
    background-color: white;
    border-radius: 3px;
    border: 1px solid #909090;
}
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facets-reset > label:before {
    display:none;
}

.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--expanded > div.facets-widget- > ul > li > label > span.facet-item__value:before,
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item > label > span.facet-item__value:before {
    content: '';
    position: absolute;
    left: -7px;
    top: 4px;
    width: 4px;
    height: 9px;
    border: solid #006cd2;
    border-width: 0px 2px 2px 0;
    transform: rotate(45deg);
    opacity: 0;
}
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--expanded > div.facets-widget- > ul > li > input:checked + label > span.facet-item__value:before,
.path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item--expanded > input:checked + label span.facet-item__value:before {
    opacity: 1;
  }

  .path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facet-item--expanded > div.facets-widget- > ul > li > label:hover:before,
  .path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item > label:hover:before {
    background-color: rgb(236, 236, 236);
}

.path-nos-marches .view-recherche-marches .node--type-marche .field--name-field-type,
.block-views-blockmarches-suggeres-block-1 .node--type-marche .field--name-field-type,
.block-views-blockmarches-block-1 .node--type-marche .field--name-field-type,
.page-node-type-fournisseur .view-test .node--type-marche .field--name-field-type {
    background-color: #F3BA42;
    color: #fff;
    max-width: 200px;
    right: 0;
    position: absolute;
    text-align: center;
    top: 0;
    padding: 5px 20px;
    z-index: 99;
    border-bottom-left-radius: 10px;
    font-weight: bold;
}

.path-nos-marches .view-recherche-marches .view-content {
    justify-content: space-around !important;
}

.path-nos-marches .field--name-field-nombre-de-lots .ligne, .page-node-type-fournisseur .field--name-lots-number,
.block-views-blockmarches-block-1 .home-nos-marches-view .field--name-field-nombre-de-lots .ligne,
.block-views-blockmarches-suggeres-block-1 .field--name-field-nombre-de-lots .ligne,
.page-node-type-fournisseur .field--name-field-nombre-de-lots .ligne
{
    color: #fff;
    font-size: 12px;
    font-weight: 600;
    margin: 5px 0;
}

.path-nos-marches .field--name-field-nombre-de-lots .ligne,
.block-views-blockmarches-block-1 .home-nos-marches-view .field--name-field-nombre-de-lots .ligne,
.block-views-blockmarches-suggeres-block-1 .field--name-field-nombre-de-lots .ligne,
.page-node-type-fournisseur .field--name-field-nombre-de-lots .ligne
{
  &:after {
    content: ' lots'
  }
}

div.facet-active .facet-item__value::first-letter,
div.facet-inactive .facet-item__value::first-letter {
	text-transform:uppercase;
}
#block-reinitialiserlesfiltres .ligne {
	display:block;
}
#block-reinitialiserlesfiltres a,
a.facets-soft-limit-link {
    background-color: #fff;
    border: 1px solid #fff;
    border-radius: 20px;
    color: #ee6a1a;
    display: block;
    margin: 0 auto;
    padding: 5px 10px;
    text-align: center;
    width: 80px;
}
#block-reinitialiserlesfiltres a {
	width:170px;
}
#block-reinitialiserlesfiltres a:hover,
a.facets-soft-limit-link:hover {
	background-color:#ee6a1a;
	color:#fff;
}
/* Page évènement */
.region-content {
	display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
}
.region-content > div {
	width:100%;
}
.view-evenements-page .pager ul.js-pager__items {
	font-size:18px;
	padding:0;
	text-align:center
}
.pager .pager__item--previous a,
.pager .pager__item--next a {
	background-color:#006cd2;
	border:1px solid #006cd2;
	border-radius:20px;
	color:#fff;
	padding:3px 15px;
}
.pager .pager__item--previous a:hover,
.pager .pager__item--next a:hover {
	background-color:#fff;
	color:#006cd2;
}
.pager .pager__item--current {
	padding:3px 10px;
}
.path-dons .views-exposed-form .form--inline,
.view-evenements-page .views-exposed-form .form--inline {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	margin:20px auto;
	width:300px;
}
.path-dons .views-exposed-form .form--inline {
    width: 550px;
}
.path-dons #block-formulaireexposerecherche-donspage-1 .js-form-item{
    width: 380px;
}
.path-dons #block-formulaireexposerecherche-donspage-1 .form-actions {
    padding-top: 0;
}
.path-dons #block-formulaireexposerecherche-donspage-1 input.form-submit {
    background-color: #ee6a1a;
    background-image: none;
    border: 1px solid #ee6a1a;
    padding: 6px 30px;
}
.path-dons #block-formulaireexposerecherche-donspage-1 input.form-submit:hover {
    background-color: #fff;
	color:#ee6a1a;
}
.path-dons .views-exposed-form .form--inline label,
.view-evenements-page .views-exposed-form .form--inline label {
	float:left;
	margin-right:10px;
}
.path-dons .views-exposed-form .form--inline label {
	display:block;
	margin-top:10px;
}
.path-dons .view-recherche-dons .views-row {
	background-color:#f2f2f2;
	margin-bottom:20px;
}
.path-dons .view-recherche-dons .views-row .views-field-title a {
	background-color:#ee6a1a;
	color:#fff;
	display:block;
	font-size:18px;
	padding:5px;
	text-align:center;
}
.path-dons .view-recherche-dons .views-row .views-field-title a:hover {
	background-color:#aaa;
}
.path-dons .view-recherche-dons .views-row .views-field-field-description {
	padding:10px 20px 20px;
}
.view-evenements-page .views-exposed-form .form-actions {
    margin-top: 10px;
    padding-top: 0;
}
.view-evenements-page .view-footer .views-exposed-form {
	display:none;
}
/* Chiffres */
#chiffres {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-around;
}
#chiffres h2 {
	text-align:center;
	width:100%;
}
#chiffres .chiffres {
	text-align:center;
	width:33.33%;
}
#chiffres h3 {
	color:#999;
	margin-top:0;
}
#chiffres p {
	font-size:45px;
	font-weight:700;
	margin-bottom:0;
	margin-top:30px;
}
#chiffres .chiffresz:nth-of-type(5) p,
#chiffres .chiffresz:first-of-type p {
	color:#f3712c;
}
#chiffres .chiffresz:nth-of-type(2) p {
	color:#ffc048;
}
#chiffres .chiffresz:nth-of-type(3) p {
	color:#63bc46;
}
#chiffres .chiffresz:last-of-type p,
#chiffres .chiffresz:nth-of-type(4) p {
	color:#2ebacd;
}
/* Marchés */
.view-recherche-lot .view-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0 20px;
}
.marche {
    box-shadow: 0 0 20px rgb(0 0 0 / 30%);
    margin-bottom: 30px;
    padding-bottom: 30px;
    width: 47.5%;
}
.marche h2 {
	margin-top:0;
}
.marche .node__content {
	padding-top:0;
}
.marche div {
    padding: 0 20px;
}
.marche div {
    padding: 0 20px;
}
.marche h2.node__title a {
    background-image: url(../images/slide_caih.jpg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    display: block;
    color: #fff;
    padding: 40px 20px;
}
.marche h2.node__title a:hover {
	color:#006cd2;
}
.field--name-field-dates-debut-fin {
    margin-bottom: 40px;
    width: 100%;
}
.daterange-timeline {
  background-color:#006cd2;
  height: 8px;
  position:relative;
  border-radius: 10px;
  width: 100%;
  @media (min-width: 1150px) {
    width: 80%;
    margin: 0 3rem;
  }

}
.daterange-timeline div {
    margin-top: 0;
    margin-bottom: 30px;
	padding:0;
}
.daterange-timeline .ligne {
	padding:0 20px;
}
.marche div.daterange-timeline {
	padding:0;
}
.daterange-timeline .before,
.daterange-timeline .now,
.daterange-timeline .after {
	color:#bbc9cb;
	float:left;
	position:relative;
}
.daterange-timeline .now:after {
  content: "";
  display: block;
  height: 22px;
  left: 0;
  position: absolute;
  top: -7px;
  width: 22px;
  background-color: white;
  z-index: 99;
  border-radius: 50%;
}
.daterange-timeline .after,
.daterange-timeline .before {
    padding-left: 0;
    min-width: 86px;
    padding-right: 0;
    padding-top: 0;
    height: 8px;
}
.daterange-timeline span {
	display: block;
    position: relative;
    top: 30px;
}
.daterange-timeline .after {
	background-color:#006cd2;
    position: absolute;
    right: 0;
}
.page-node-type-marche .daterange-timeline .after {
    right: 20px;
}
.daterange-timeline .now {
/*    background-color: #fff;
    border-radius: 20px;
    display: block;
    padding: 0 20px;*/
}
.daterange-timeline .after span {
	float:right;
  word-wrap: normal;
  right: -35px;
  @media (min-width: 991px) {
    right: -50px;
  }
}
.daterange-timeline .before span {
  left: -15px;
  word-wrap: normal;
  @media (min-width: 991px) {
    left: -30px;
  }

}
.marche .field--name-body {
	clear:both;
}
#block-views-block-evenements-fournisseur-block-2 a,
.marche .views-field-title span {
    background-image: url(../images/puce_jaune.png);
    background-position: 0px 7px;
    background-repeat: no-repeat;
    background-size: 8px;
    padding-left: 15px;
    display: block;
}
.savoir_plus a {
    display: block;
    font-size: 16px;
    margin-top: 20px;
    padding: 5px 20px;
    width: 130px;
    float: left;
    margin: 20px 20px 20px 0;
}
.marche .subtitle {
	font-size: 18px;
    font-weight: 600;
    margin-bottom: 10px;
    padding: 0 40px;
}
.file--application-pdf {
    background-image: none;
    padding-left: 0;
    display: block;
    margin-bottom: 20px;
}
.marche .field--name-field-fichiers {
	margin-top:25px;
}
.file--mime-application-pdf a {
	background-color:#006cd2;
	border:1px solid #006cd2;
    margin-top: 20px;
    padding: 5px 20px;
}
.file--mime-application-pdf a:hover {
	background-color:#fff;
	color:#006cd2;
}
.field--name-field-fiche-marche .image-style-thumbnail {
	display:block;
	margin:10px;
}
.field--name-field-fiche-marche .image-style-thumbnail:hover {
	box-shadow:0 0 5px rgb(0 0 0 / 30%);
}
/*.page-node-type-marche .field--name-field-type {*/
/*	background-color: #f2f2f2;*/
/*    color: #000;*/
/*    font-size: 28px;*/
/*	padding:5px 30px 30px;*/
/*    text-align: center;*/
/*}*/
#haut-marche {
    background-color: #273a62;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 0;
    position: relative;
  .ligne {
    all: unset;
  }
}

.page-node-type-evenement #haut-marche,
.page-node-type-agenda #haut-marche{
	width:100%;
}
.page-node-type-agenda .thematique{
  margin-bottom: 10px;
}
.page-node-type-agenda .groupe2{
  margin: 0 auto;
  padding: 20px 2.5% 20px 10%;
}

.page-node-type-evenement .groupe2 {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	position:relative;
    width: 50%;
    padding: 20px 2.5% 50px 10%;
    font-size: 16px;
}

.page-node-type-evenement .groupe2 > div {
	display:flex;
	/*width:47.5%;*/
    width: 100%;
    justify-content: center;
}
.page-node-type-evenement .groupe2 > div.field--name-body {
	display:block;
	width:100%;
}
.page-node-type-evenement .groupe2 > div > div {
	margin:auto 0;
	padding:0;
}
.page-node-type-evenement .groupe2 > div.field--name-field-image-2  > div{
	margin:auto;
}
.page-node-type-evenement .field--name-field-description,
.page-node-type-agenda .field--name-field-description{
    color: #fff;
    font-size: 24px;
    font-weight: 600;
    margin-bottom: 20px;
    width: 100%;
}
.page-node-type-evenement .field--name-field-media-image,
.page-node-type-agenda .field--name-field-media-image{
	margin:auto;
}

/*.page-node-type-agenda .field--name-field-date-de-debut
{
    background-color: transparent;
    background-image: url(../images/picto_agenda.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 45px;
    border-radius: 0;
    color: #fff;
    font-size: 15px;
	margin:auto;
    top: auto;
    right: auto;
    padding-top: 65px;
    position: relative;
    text-align: center;
	width:auto;
  left: 0;
}*/

/*.page-node-type-agenda .field--name-field-lieu-de-l-evenement{
  background-color:transparent;
  background-image:url(../images/picto_lieu-evenement.png);
  background-position:top center;
  background-repeat:no-repeat;
  background-size:40px;
  color:#fff;
  font-size: 15px;
  margin:auto;
  padding-top: 65px;
  min-width: 40px;
  text-align: center;
}*/
/*.page-node-type-evenement .field--type-time-event {
    background-image: url(../images/picto_horaire.png);
    background-position: top center;
    background-repeat: no-repeat;
    background-size: 50px;
    border-radius: 0;
    color: #fff;
    font-size: 15px;
	margin:auto;
    padding: 65px 10px 0;
    position: relative;
    text-align: center;
}*/
.field--name-field-pour-s-inscrire {
	float:left;
	margin-right:20px;
	margin-top:20px;
}

.field--name-field-pour-le-revoir a {
    color: #fff;
    display: block;
    font-size: 15px;
    font-weight: 500;
    margin-top: 20px;
    text-transform: uppercase;
}
.field--name-field-pour-le-revoir a:hover {
	color:#006cd2;
}
.page-node-type-evenement .field--name-field-marche {
    bottom: -50px;
    display: flex;
    left: 7.5%;
    position: absolute;
}
.page-node-type-evenement .field--name-field-marche .ligne {
	padding:0;
}
.page-node-type-article .node--type-article .field--name-body ul li,
.page-node-type-evenement .node--type-evenement .field--name-body ul li {
	background-image:url(../images/puce_bleu.png);
    background-position: 0px 7px;
    background-repeat: no-repeat;
    background-size: 6px;
    list-style: none;
    padding-left: 15px;
}
.page-node-type-evenement .region-formulaire,
.page-node-type-agenda .region-formulaire {
    display: flex;
    padding-top: 30px;
}
.page-node-type-evenement .region-formulaire > div,
.page-node-type-agenda .region-formulaire > div {
	position:relative;
	width:47.5%;
	z-index:9;
}
.page-node-type-evenement .flexslider .slides > li,
.page-node-type-agenda .flexslider .slides > li {
    width: auto!important;
}
#gauche {
/*    display: flex;*/
    flex-wrap: wrap;
    justify-content: space-between;
    padding: 20px 2.5% 20px 10%;
    position: relative;
    width:37.5%;
    z-index: 9;
}
#droite {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    padding: 10px 10% 20px 2.5%;
    position: relative;
    width: 37.5%;
    z-index: 9;
}

#droite .ligne,
#gauche .ligne {
	display:block;
	padding:0;
}



.field--name-field-fournisseur .field__label,
.field--name-field-editeur .field__label,
.field--name-field-gains .field__label,
.field--name-field-duree .field__label,
.field--name-field-nombre-de-lots .field__label {
	font-size:20px;
}

.field--name-field-gains .field__item,
.field--name-field-duree .field__item,
.field--name-field-nombre-de-lots .field__item {
  font-size:14px;
}

.field--name-field-gains p {
	margin-bottom:0;
}

.views-field-field-lots-1 .views-label {
	display:block;
	float:left;
	margin-right:10px;
}
.views-field-field-lots a {
    background-color: transparent;
    border-color: #006cd2;
    color: #006cd2;
    display: block;
    width: auto;
    margin: 0;
    text-align: left;
}
.views-field-field-lots a:after {
    background-image: url(../images/fleche_bleu_bas.png);
}
.views-field-field-lots a:hover {
	background-color:#006cd2;
	color:#fff;
}
.views-field-field-lots a:hover:after {
	background-image:url(../images/fleche_blanche_bas.png);
}
.field--name-field-fiche-marche {
    margin-right: 10px;
}
#gauche .field--name-body,
#gauche .field--name-body p,
#gauche .field--name-body li {
	color:#bbc9cb;
}
.field--name-field-recap-lots {
    padding-top: 40px;
    width: 100%;
}
.field--name-field-description-longue {
    margin: 0 3em;
}
/*.node--type-lot {*/
/*    border: 1px solid #006cd2;*/
/*    margin: 30px auto 60px;*/
/*    width: 80%;*/
/*}*/
/*.node--type-lot .node__content {*/
/*    padding: 30px;*/
/*}*/
/*.node--type-lot h2 {*/
/*    background-color: #006cd2;*/
/*    color: #fff;*/
/*    margin-top: 0;*/
/*    padding: 20px;*/
/*    text-align: left;*/
/*}*/
/*.field--name-field-fournisseur, .field--name-field-editeur, .node--type-lot .field--name-body {*/
/*    float: left;*/
/*    padding: 0;*/
/*    width: calc(50% - 40px);*/
/*}*/
/*.field--name-field-fournisseur, .field--name-field-editeur {*/
/*    background-image: url(../images/picto_titulaires.svg);*/
/*    background-size: 50px;*/
/*    background-position: 20px 10px;*/
/*    background-repeat: no-repeat;*/
/*    padding-top: 0;*/
/*    padding-left: 80px;*/
/*    padding-right: 0;*/
/*}*/
/*.field--name-field-editeur {*/
/*	background-image:url(../images/picto_editeurs.svg);*/
/*	float:right;*/
/*}*/
/*.field--name-field-editeur .field__items, .field--name-field-fournisseur .field__items {*/
/*    display: flex;*/
/*    flex-wrap: wrap;*/
/*}*/
/*.field--name-field-fournisseur .field__label,*/
/*.field--name-field-editeur .field__label {*/
/*	color:#cbcbcb;*/
/*}*/
/*.field--name-field-fournisseur a {*/
/*    background-color: #cbcbcb;*/
/*    color: #000;*/
/*    display: block;*/
/*    margin-right: 5px;*/
/*    margin-bottom: 5px;*/
/*    padding: 10px 30px;*/
/*    text-align: center;*/
/*}*/
/*.field--name-field-editeur a {*/
/*	color:#333;*/
/*    display: block;*/
/*    margin-bottom: 5px;*/
/*    text-align: center;*/
/*}*/
/*.field--name-field-editeur a:hover {*/
/*	color:#006cd2;*/
/*}*/
/*.field--name-field-editeur .taxonomy-term h2 {*/
/*    background-color: transparent;*/
/*    font-weight: 500;*/
/*    margin: 0 10px 10px 0;*/
/*    padding: 0;*/
/*    font-size: 16px;*/
/*    text-transform: none;*/
/*}*/
/*.field--name-field-fournisseur a:hover {*/
/*	background-color:#006cd2;*/
/*	color:#fff;*/
/*}*/
.page-node-type-marche .node--type-marche .views-field-body {
	padding:10px 20px 0;
}
.page-node-type-marche .node--type-marche .node--type-fournisseur,
.page-node-type-marche .node--type-marche .views-field-field-fournisseur {
    padding: 10px 20px 30px;
}
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 h2 {
	margin-top:5px;
}
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 h2 a {
	background-color:#006cd2;
	border-color:#006cd2;
	font-size:16px;
}
.page-node-type-marche .node--type-marche .views-field-field-fournisseur-1 h2 a:hover {
	background-color:#fff;
	color:#006cd2;
}
.page-node-type-marche .node--type-marche .views-field-title {
    background-color: #006cd2;
    color: #fff;
	font-size:18px;
	font-weight:600;
    padding: 5px;
    text-align: center;
}
.social-sharing-buttons {
    background-image: url(../images/social_icon.svg);
    background-position: center center;
    background-repeat: no-repeat;
    background-size: 47px;
    margin: 0 0 15px;
    min-height: 50px;
    padding: 0;
}
.social-sharing-buttons a {
	margin:0;
	opacity: 0;
}
.social-sharing-buttons:hover,
.social-sharing-buttons:hover a {
	background-size:0px;
	opacity:1;
}
#block-views-block-evenements-block-2,
#block-views-block-marches-suggeres-block-1 {
    padding: 20px 7.5% 20px 2.5%;
    position: relative;
    width: 40%;
    z-index: 9;
}
#block-views-block-marches-suggeres-block-1 h2 {
    margin-bottom: 34px;
    margin-top: 0;
}
#block-views-block-evenements-block-2 {
    padding: 20px 2.5% 20px 7.5%;
}
.ckeditor-accordion-container > dl {
    border: none;
}
.ckeditor-accordion-container > dl dt > a {
    background-color: transparent;
    border: none;
    color: #ee6a1a;
    font-size: 18px;
	font-weight:600;
    text-align: left;
	padding: 10px 15px 10px 33px;
}
.ckeditor-accordion-container > dl dt > a:hover, .ckeditor-accordion-container > dl dt.active > a {
    background-color: #ee6a1a;
    color: #fff;
}
.ckeditor-accordion-container > dl dd {
	background-color:transparent;
    border:none;
	color:#333;
    padding: 15px 20px 20px;
}
.ckeditor-accordion-container > dl dd p:last-of-type {
	margin-bottom:0;
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:before,
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:after {
    background: #ee6a1a;
}
.ckeditor-accordion-container > dl dt:hover > a > .ckeditor-accordion-toggle:before,
.ckeditor-accordion-container > dl dt:hover > a > .ckeditor-accordion-toggle:after,
.ckeditor-accordion-container > dl dt.active > a > .ckeditor-accordion-toggle:before,
.ckeditor-accordion-container > dl dt.active > a > .ckeditor-accordion-toggle:after {
	background:#fff;
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:before {
    left: 0;
}
.ckeditor-accordion-container > dl dt > a > .ckeditor-accordion-toggle:after {
    right: 27px;
}
#block-views-block-evenements-fournisseur-block-2 {
    background-color: #f2f2f2;
}
#block-views-block-evenements-fournisseur-block-2 .ligne {
	padding:0;
}
#block-views-block-evenements-fournisseur-block-2 .content {
    padding: 10px;
}
#block-views-block-evenements-fournisseur-block-2 a:hover {
	color:#006cd2;
}
.node--type-fournisseur {
	margin:0 auto;
	max-width:1400px;
}
/*.node--type-fournisseur .node__content {*/
/*	display:flex;*/
/*	flex-wrap:wrap;*/
/*	justify-content:space-between;*/
/*}*/
.node--type-fournisseur .node__content > div {
	width:67.5%;
}
.node--type-fournisseur .node__content > div:last-child {
	display:flex;
	width:32.5%;
}
.node--type-fournisseur .node__content > div:last-child.field--name-field-media-image {
    text-align: center;
    display: block;
    width: 100%;
}
.node--type-fournisseur .ligne {
  all:unset;
}
.node--type-fournisseur .node__content > div:last-child > div {
	margin:auto;
}
/* Taxos */
.view-taxonomy-term .view-id-taxo_filles .views-row {
	width:33.33%;
}
.view-taxonomy-term .view-id-taxo_filles .views-field-name a {
    background-image: url(../images/slide_caih.jpg);
    background-size: 130%;
    border: 2px solid #006cd2;
    border-radius: 30px;
    color: #006cd2;
    display: block;
    font-weight: 600;
    margin: 10px 15px;
    padding: 10px;
    background-position: 0px 0;
}
.view-taxonomy-term .view-id-taxo_filles .views-field-name a:hover {
	background-color:#006cd2;
	background-image:none;
	color:#fff;
}
.page-node-51 .node--type-page p {
	margin-bottom:25px;
}
.page-node-51 .node--type-page a {
    background-image: url(../images/picto_presse.png);
    background-position: 0 -2px;
    background-repeat: no-repeat;
    background-size: 38px;
    color: #000;
    display: block;
    padding-left: 45px;
}
.page-node-51 .node--type-page a:hover {
	color:#006cd2;
}
.page-node-51 .node--type-page a strong {
	color:#006cd2;
	font-size:16px;
}
.views-field-field-editeur .item-list ul {
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
}
.views-field-field-editeur .item-list ul li {
	width:20%;
}
.views-field-field-editeur .item-list ul li a {
    border: 1px solid #006cd2;
    border-radius: 20px;
    display: block;
	margin:5px;
    padding: 5px;
    text-align: center;
}
.views-field-field-editeur .item-list ul li a:hover {
	background-color:#006cd2;
	color:#fff;
}
/* Actualités */
.view-evenements-page .view-content, .node--type-article .node__content, .view-actualites .view-content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    /* 80% -> 100% : ce conteneur est deja a l'interieur du wrapper de vue
       (.view-actualites/.view-evenements-page.view-display-id-page_1)
       plafonne a 1800px+padding:100px - un second plafond en % ici
       retrecissait la grille une deuxieme fois (retour utilisateur,
       double plafonnage visible sur grand ecran). */
    max-width: 100%;
    margin: 0 auto;
    padding: 50px 30px;
}
.view-evenements-page .view-content {
	justify-content:flex-start;
}
.node--type-article .node__content {
	padding:0 0 50px;
}
.node--type-article header {
    position: absolute;
    left: 10%;
    margin-left: 0;
    top: -60px;
    z-index: 99;
    width: 80%;
}
.node--type-article header .node__meta {
	color:#fff;
	font-family:'Poppins', sans-serif;
	font-size:15px;
}
.view-evenements-page .view-content .views-row, .view-actualites .view-content .views-row {
    background-color: #f2f2f2;
    margin-bottom: 50px;
    padding-bottom: 80px;
    position: relative;
    margin: 0 3.33% 30px 0;
    width: 30%;
}
.view-evenements-page .views-field-type,
.view-actualites .views-field-type {
	margin:0;
}
.view-evenements-page .views-field-title a,
.view-actualites .views-field-title a {
    color: #000;
    display: block;
    font-size: 20px;
    font-weight: 600;
    margin: 10px 0;
	padding:0 20px;
}
.view-evenements-page .views-field-title a:hover,
.view-actualites .views-field-title a:hover {
    color: #006cd2;
}
.view-evenements-page .views-field-body,
.view-actualites .views-field-body {
	padding:0 20px;
}
.view-evenements-page .views-field-view-node a,
.view-actualites .views-field-view-node a {
	bottom:20px;
	left:20px;
}
.node--type-article .node__content {
	position:relative;
}
.node--type-article .node__content > div {
	display:flex;
	width:45%;
}
.node--type-article .node__content > div.groupe {
	padding:30px 0;
	width:100%;
}
.node--type-article .node__content > div.groupe > div {
	display:flex;
	margin:0;
	padding:0;
	width:47.5%;
}
.node--type-article .node__content > div.groupe > div.field--name-field-description-longue {
	width:100%;
}
.node--type-article .node__content > div.groupe > div > div {
	margin:auto 0;
}
.node--type-article .node__content > div.groupe > div.field--name-field-image-2 > div {
	margin:auto;
}
.node--type-article .node__content > div.field--name-field-description-longue {
	display:block;
	padding:30px 0;
	width:100%;
}
.node--type-article .node__content > div > div {
	margin:auto;
}
.node--type-article .node__content > div > div.ligne {
	margin:0;
}
.node--type-article .node__content > div.field--name-body > div {
    margin: auto 0;
    padding: 60px 0 0;
}
.node--type-article .node__content .field--name-field-marche {
	width:100%;
}
.node--type-article .node__content .field--name-field-marche a {
    background-color: #3e65b2;
    color: #fff;
    left: 0;
    padding: 5px 10px;
    position: relative;
    top: auto;
}
.node--type-article .node__content .field--name-field-marche a:hover {
	background-color: #273a62;
}
/*RESPONSIVE*/
@media all and (max-width: 320px) {
 .region-recherche2 .content .btn:after {
    position:relative;
 }

 #block-catalogue a.btn:after {
    background-image: none !important;
    right: 0px !important;
}

#block-catalogue > div.content > div > div > div > p > a {
    padding: 10px 20px;
}

  #block-contact iframe {
    width: 246px !important;
    height: 246px !important;
  }
}

@media all and (max-width: 960px) {

  .path-frontpage .caih-newsletter #block-webform-4 .webform-submission-caih-newsletter-form .form-item-case-rgpd {
    max-width: 640px;
    padding: 0 1em;
    width: auto;
}

}

/*RESPONSIVE*/
@media all and (max-width: 600px) {
  .path-frontpage #views-exposed-form-recherche-marches-page-1 .form--inline > div:last-of-type,
  .path-frontpage #views-exposed-form-recherche-reference-page-1 .form--inline > div:last-of-type {
    width: 56px;
    right: 0;
    position: absolute;

  }

  .path-frontpage #views-exposed-form-recherche-marches-page-1 .form--inline,
  .path-frontpage #views-exposed-form-recherche-reference-page-1 .form--inline{
    position: relative;
  }

  #block-formulaireexposerecherche-marchespage-1-3 .content {
    padding-left: 0;
  }

  .region-recherche1 h2, .region-recherche2 h2 {
    font-size: 18px;
  }

    .path-nos-marches .field--name-lots-number {
        color: #fff;
        font-size: 12px;
        font-weight: 600;
        float:initial;
        margin: 0 0 1em 0;
    }

    .page-node-type-evenement #haut-evenement {
        flex-wrap: wrap;
        justify-content: center;
    }

    .page-node-type-evenement #haut-evenement #gauche, .page-node-type-evenement #haut-evenement #droite, .page-node-type-evenement .groupe2 {
        width: 100%;
    }

    .page-node-type-evenement .groupe2 {
        padding: 20px 10%;
    }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-choisissez-votre-thematique label {
    padding-right: 0!important;
  }

   }

@media all and (max-width: 768px) {
  h2{
    font-size: 20px;
  }

.path-frontpage #views-exposed-form-recherche-marches-page-1 .form--inline > div:last-of-type,
.path-frontpage #views-exposed-form-recherche-reference-page-1 .form--inline > div:last-of-type{
    margin: 0 !important;
}

.path-frontpage .caih-newsletter {
    background-position-x: right;
}

.path-frontpage .caih-newsletter #block-webform-3 .webform-submission-newsletter-form .form-type-email,
.path-frontpage .caih-newsletter #block-webform-3 .webform-submission-newsletter-form .form-item-nom-de-votre-etablissement,
.path-frontpage .caih-newsletter #block-webform-3 .webform-submission-newsletter-form .form-item-agree-personal-data {
 width: 90%;
}

.path-frontpage .caih-newsletter .region-newsletter, .page-node-type-agenda .groupe2 .field--type-text-with-summary {
    width: 100%;
}

  .page-node-type-agenda #haut-evenement {
    flex-wrap: wrap;
  }

  .page-node-type-agenda #haut-evenement #gauche, .page-node-type-agenda #haut-evenement #droite {
    width: 90%;
  }


  .page-node-type-agenda .groupe2 .field--name-field-pour-s-inscrire {
    margin: 2em 0;
    width: 100%;
  }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form {
    margin: 0 !important;
  }

}

@media all and (min-width: 1800px) {
  /* CAIH-22 : cette regle heritee retrecissait le conteneur des 6 cartes
     themes a 62% au-dela de 1800px, les repliant a nouveau sur 2 lignes
     (elles ont besoin de 1244px pleins, iso 2256:5473). #recherche est
     desormais plafonne a max-width:1512px (cf. regle plus bas) donc ce
     retrecissement n'a plus lieu d'etre - neutralise. */
  #block-recherchepartheme .text-formatted ul {
    width: auto;
  }
}
@media all and (max-width: 1700px) {
}
@media all and (max-width: 1600px) {
/*.region-header .views-exposed-form {
    width: 15%;
}
ul.sf-menu.sf-horizontal.sf-shadow li:first-child ul {
    width: 1230px !important;
    position: absolute;
    right: -790px;
}
ul#superfish-main li a, ul#superfish-main li a:visited, ul#superfish-main li>span {
    padding: 10px 5px;
    font-size: 16px;
}
*/
.flexslider {
	overflow:hidden;
}
.flexslider .views-field-field-image-slideshow {
    width: 1600px !important;
    position: relative;
}
}

@media all and (max-width: 1500px) {
  ul#superfish-main .menu-cataloguecaih {
    margin-left: 1em;
  }

  ul#superfish-main {
    white-space: normal;
    text-align: center;
    align-items: center;
  }

  ul#superfish-main li a, ul#superfish-main li a:visited, ul#superfish-main li>span {
    padding: 10px 10px;
  }
}

@media all and (max-width: 1400px) {

#block-titrebourse a {
    margin-right: 5px;
}
.view-taxonomy-term .view-content .views-row, .view-test .view-content .views-row, .view-recherche-marches .view-content .views-row {
    width: 47.5%;
}
}
@media all and (max-width: 1300px) {
.view-taxonomy-term .view-content, .view-test .view-content, .view-taxonomy-term .view-content, .view-recherche-marches .view-content {
    padding: 0 5%;
}
.view-taxonomy-term .view-content .views-row,
.view-test .view-content .views-row,
.view-recherche-marches .view-content .views-row,
.block-views-blockmarches-suggeres-block-1 .jcarousel-wrapper li,
.home-nos-marches-view .jcarousel-wrapper li
{
    max-width: 670px;
    width: 100%;
    margin: 0 auto 30px;
}
#block-nouscontacter a.btn,
#block-decouvrirnosmarches a.btn {
	display:block;
}

  .region-header .block:not(.site-branding) {
    position: relative;
  }

  .region-header .block, .region-header .block:not(.site-branding) {
    margin: 0;
  }

  .path-nos-marches article .droite img,
  .block-views-blockmarches-suggeres-block-1 .droite img,
  .page-node-type-fournisseur article .droite img {
    right: 0px;
  }

  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > h1 {
    font-size: 35px;
  }

  #block-views-block-slideshow-ok-block-1 h1, #block-views-block-slideshow-ok-block-1 h2 {
    width: 400px;
  }


}
@media all and (max-width: 1200px) {

.site-branding__logo img {
	max-width:200px;
}
#block-catalogue h2,
.path-frontpage #views-exposed-form-recherche-marches-page-1 .form--inline > div,
.path-frontpage #views-exposed-form-recherche-reference-page-1 .form--inline > div{
	margin-bottom:15px;
    width: 100%;
}
#block-catalogue p {
    margin: 20px 0;
}

#block-titrebourse a.btn {
	display:block;
	margin:0 auto 10px;
	max-width:200px;
}
#block-views-block-anciens-evenements-block-2 .jcarousel-skin-default .jcarousel li, #block-views-block-evenements-block-3 .jcarousel-skin-default .jcarousel li, #block-views-block-evenements-block-2 .jcarousel-skin-default .jcarousel li, #block-views-block-evenements-block-1 .jcarousel-skin-default .jcarousel li, #block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel li{
	width:300px;
}
.view-evenements-page .view-content .views-row, .view-actualites .view-content .views-row {
	width:45%;
}
.field--name-field-gains, .field--name-field-duree {
    float: none;
}
.views-field-field-lots-1, .field--name-field-gains, .field--name-field-duree {
    width: calc(100% - 80px);
}
.view-evenements-page .view-content, .node--type-article .node__content, .view-actualites .view-content {
    max-width: 100%;
    padding: 50px 30px;
}
.page-node-285 #block-asco-theme-content,
.path-anciens-evenements #block-asco-theme-content,
.page-node-51 #block-asco-theme-content,
.page-node-54 #block-asco-theme-content,
.page-node-48 #block-asco-theme-content,
.page-node-49 #block-asco-theme-content,
.page-node-91 #block-asco-theme-content,
.page-node-145 #block-asco-theme-content,
.page-node-146 #block-asco-theme-content,
.page-node-47 #block-asco-theme-content,
#block-views-block-anciens-evenements-block-1 {
    max-width: 90%;
}
.node--type-article header {
    left: 5%;
    width: 90%;
}
.region-sidebar-second {
    padding: 50px 5% 50px 2.5%;
    width: 27.5%;
}
.region-sidebar-first {
    padding: 50px 2.5% 50px 5%;
    width: 55%;
}
}

@media all and (min-width: 1440px) {
  #block-asco-theme-content {
    /* 1440px -> 1800px : meme plafond deja utilise pour le header/
       page-body-layout de la homepage (.path-frontpage, ligne ~1838/1887)
       - les pages marche/article/agenda (qui rendent via ce wrapper)
       restaient plus etroites qu'elles sur grand ecran, incoherent -
       retour utilisateur avec capture grand ecran. */
    max-width: 1800px;
  }
}

@media all and (max-width: 990px) {

  .region-header {
    justify-content: space-between;
    margin: auto;
  }

  .region-header .site-branding__logo {
    left: 0;
  }

  .path-nos-marches .region-colonnegauche #block-categoriecheckbox .content h3 {
    display: block;
    color: #006cd2;
    background-image: url(../images/chevron_bleu.png) !important;
  }

  .region-header .site-branding__logo {
    margin-left: 3em;
  }

  div.sf-accordion-toggle.sf-style-white a {
    padding: 0em 3em 0em 1em !important;
  }

  .path-nos-marches .region-colonnegauche #block-categoriecheckbox .content h3 {
    display: block;
    color: #006cd2;
    background-image: url(../images/chevron_bleu.png) !important;
  }

  .path-nos-marches #block-categoriecheckbox > div.content > div > div > ul {
    margin: 4em 1em 1em 1em;
  }

  .path-nos-marches #block-categoriecheckbox > div.content > div > div > ul > li.facet-item.facets-reset > label {
    top: -25px;
    right: 0;
  }

  .path-nos-marches .region-colonnegauche, .path-nos-marches .region-colonnegauche #views-exposed-form-recherche-marches-page-1 input,
  .path-nos-marches .region-colonnegauche, .path-nos-marches .region-colonnegauche #views-exposed-form-recherche-reference-page-1 input{
    width: 100%;
    max-width: unset;
  }

  .path-nos-marches .region-colonnegauche .facet-inactive, .region-colonnegauche .facet-active {
    width: auto;
    padding: 1em 25%;
  }

	/*grille*/
	.ligne{
		justify-content: space-around;
		flex-wrap:wrap;
		max-width:100%;
	}

	.colonne_1-1,
	.colonne_1-2,
	.colonne_1-3,
	.colonne_2-3,
	.colonne_1-4,
	.colonne_1-5,
	.colonne_2-5,
	.colonne_3-5,
	.colonne_4-5{
		width:97.22%;
	}
#block-navigationprincipale {
    margin: 0;
    position: absolute;
    top: 40px;
    right: 0;
    width: 100%;
}
div.sf-accordion-toggle.sf-style-white a {
    background: transparent;
    border: none;
    float:right;
    color: #fff;
}
div.sf-accordion-toggle.sf-style-white a.sf-expanded, ul.sf-menu.sf-style-white.sf-accordion li.sf-expanded {
    background: transparent;
	  float:right;
}
li.sf-clone-parent {
	display:none;
}
/* Icone hamburger iso maquette (lucide/menu, 2176:3751) : l'ancien glyph
   police "≡" (content pose par la lib Superfish elle-meme, hors ce fichier -
   neutralise ici via content:none) rendu a font-size:5em ecrasait la vraie
   icone (3 barres NOIRES egales, stroke 2px, 24x24) par un caractere flou
   en cyan #006cd2. Remplace par le SVG exporte tel quel en background-image,
   #superfish-main-toggle passe en boite flex dediee (span UA toujours
   masque, inutilise). */
div.sf-accordion-toggle.sf-style-white > a:after {
    content: none;
}
#superfish-main-toggle span {
    display: none;
}
#superfish-main-toggle {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    /* neutralise "div.sf-accordion-toggle.sf-style-white a { padding: 0em
       3em 0em 1em !important }" (mobile, ~ligne 5469) : le background-image
       se positionne sur la padding-box par defaut, donc ce padding
       asymetrique herite decalait l'icone hors du centre de la boite 44x44. */
    padding: 0 !important;
    box-sizing: border-box;
    background: url('../images/icons/lucide-menu.svg') center / 24px 24px no-repeat;
}
ul.sf-menu.sf-accordion.sf-expanded {
    /* top:30px (valeur d'origine) ajoutait un decalage compensant l'ancien
       glyph hamburger surdimensionne (font-size:5em qui debordait de sa
       boite) - devenu obsolete depuis le passage a l'icone SVG 44x44 nette :
       creait une bande vide sous le header (photo hero visible en dessous)
       avant le debut du menu deplie "Nos offres". */
    top: 0 !important;
}
ul.sf-menu.sf-style-white li, ul.sf-menu.sf-style-white.sf-navbar {
	text-align:left;
}
ul.sf-menu.sf-style-white a, ul.sf-menu.sf-style-white a:visited, ul.sf-menu.sf-style-white span.nolink {
    border: 0 none;
    border-radius: 0;
    border-bottom: 1px solid #006cd2;
    color:#006cd2;
    font-size: 1.2em;
    margin: 0;
    padding: 1em 10% 1em 2em;
    text-transform: uppercase;
    text-shadow: none;
    font-weight: 600;
    line-height: 1.3;
}
#superfish-main .sf-multicolumn li > ol > li.sf-depth-2 a, ul.sf-menu span.nolink, ul#superfish-main.sf-style-default li.sf-multicolumn-wrapper a {
	min-height:10px;
}

ul.sf-menu.sf-style-white.sf-accordion li li a, ul.sf-menu.sf-style-white.sf-accordion li li span.nolink {
	background-color:#006cd2;
	color:#fff;
	padding-left:3em;
	text-transform:none;
}
ul.sf-menu.sf-style-white.sf-accordion li ul li ul li a, ul.sf-menu.sf-style-white.sf-accordion li ul li ul li span.nolink {
	background-color:#fff;
	color:#3f1a45;
	padding-left:4em;
	text-transform:none;
}
span.menuparent,
.region-primary-menu .menu a.menuparent,
a.menuparent {
	background-color:#fff;
	background-image:url(../images/plus_menu.png);
	background-position:95% 50%;
	background-repeat:no-repeat;
}
ul.sf-menu.sf-style-white.sf-accordion li li a.menuparent,
ul.sf-menu.sf-style-white.sf-accordion li li span.nolink.menuparent {
    background-image: url(../images/plus_menu-b.png);
    background-position: 95% 50%;
	background-repeat:no-repeat;
}
ul.sf-menu.sf-style-white li.active-trail a {
	color:#006cd2;
}
/* CAIH-22 : bloc ci-dessous PAS SCOPE par erreur (hors de tout @media) -
   appliquait le layout mobile (colonne, grille 2 cartes/ligne) meme en
   desktop, d'ou les cartes qui se repliaient sur 2 colonnes et le
   #recherche{padding:20px} qui ecrasait le padding:32px desktop. Corrige
   en re-enveloppant dans @media (max-width:991px). */
@media (max-width: 991px) {
  /* Meme scope .path-frontpage que la regle desktop (ligne 1230) - sinon
     carte blanche vide (fond+padding+margin-bottom) sur toutes les pages
     hors accueil en mobile aussi. */
  .path-frontpage #recherche {
      display:flex;
      flex-direction:column;
      padding: 20px;
      /* gap iso maquette mobile (Frame "iPhone 17 - 1" 2176:1535, layout
         VERTICAL gap:74px entre le bloc recherche/explorer-par-themes et la
         section "Nos marches" suivante) - en desktop ce gap vient de
         ".path-frontpage #recherche { margin: -244px auto 89px }" scope
         @media (min-width:992px), donc absent ici : #recherche collait
         directement sous "Nos marches", sans espace. */
      margin-bottom: 74px;
  }
  /* re-affirme l'ordre recherche mots-cles puis explorer par themes
     (iso mobile 2176:3987/2176:3995) - la regle #recherche{display:block}
     plus haut neutraliserait sinon l'ordre flex pose en desktop. */
  .region-recherche2 { order: 1; }
  .region-recherche1 { order: 2; }
  .region-recherche1,
  .region-recherche2 {
      padding: 0;
      width: 100%;
  }
  /* cartes themes en grille 2 colonnes iso mobile (2176:3997-4020) -
     couleur d'icone/fond #3399cc (vs #2d3f86 desktop). */
  #block-recherchepartheme .text-formatted ul {
      gap: 10px;
  }
  #block-recherchepartheme .text-formatted ul li {
      flex: 0 0 calc(50% - 5px);
      min-width: 0;
  }
  #block-recherchepartheme .text-formatted ul li a {
      width: 100%;
      background-color: #3399cc0d;
  }
  #block-recherchepartheme .text-formatted ul li a.materiels { background-image: url(../images/icons/monitor-cloud-mobile.svg); }
  #block-recherchepartheme .text-formatted ul li a.logiciels { background-image: url(../images/icons/code-xml-mobile.svg); }
  #block-recherchepartheme .text-formatted ul li a.telecoms { background-image: url(../images/icons/cloud-check-mobile.svg); }
  #block-recherchepartheme .text-formatted ul li a.securite { background-image: url(../images/icons/shield-check-mobile.svg); }
  #block-recherchepartheme .text-formatted ul li a.prestations { background-image: url(../images/icons/users-round-mobile.svg); }
  #block-recherchepartheme .text-formatted ul li a.microsoft { background-image: url(../images/icons/layout-grid-mobile.svg); }
}

#block-views-block-anciens-evenements-block-2 h2, #block-views-block-evenements-block-3 h2, #block-views-block-evenements-block-2 h2, #block-views-block-evenements-block-1 h2 {
	padding-right:30px;
}
#block-views-block-anciens-evenements-block-2 .view-header,
#block-views-block-evenements-block-3 .view-header,
#block-views-block-evenements-block-2 .view-header,
#block-views-block-evenements-block-1 .view-header,
#block-views-block-evenements-block-1 .view-content,
.block-views-blockevenements-block-2 .view-content,
.block-views-blockmarches-block-1 .view-content,
#block-views-block-medias-block-1 .view-header,
#block-views-block-medias-block-1 .view-content
{
    display: block;
    max-width: 100%;
    padding: 20px 30px;
}
#block-catalogue h2 {
	text-align:center;
}
#block-views-block-evenements-block-1 h2 {
    margin-top: 0;
    padding-right: 0;
    margin-bottom: 30px;
}
.region-chiffres ul li {
    width: 50%;
}
.region-formulaire:after, #recherche:after {
	height:47px;
}
#block-footer .ligne:not(.ligne-titre) {
    gap: 24px;
}
#block-footer .ligne:not(.ligne-titre)::before {
    flex-basis: 160px;
    height: 62px;
}
#block-footer .ligne:not(.ligne-titre) > div:first-of-type {
    flex-basis: 180px;
}
.region-recherche2 select, .region-recherche2 input {
	width:100%;
}

  .path-frontpage #views-exposed-form-recherche-marches-page-1 .form--inline > .form-item-search-api-fulltext > input,
  .path-frontpage #views-exposed-form-recherche-reference-page-1 .form--inline > .form-item-search-api-fulltext > input{
    font-size: 14px !important;
  }

#block-catalogue {
	margin-bottom:30px;
}
/*#block-recherchepartheme .text-formatted ul li {
	margin:0 auto;
}*/
.region-colonnegauche {
    border-right: none;
    float: none;
    max-width: 310px;
    margin: 0 auto;
}

  #block-nouscontacter, #block-decouvrirnosmarches {
    width: 90%;
    padding: 50px 5%;
  }

.block-facet--checkbox h3 {
	background-image:url(../images/chevron_blanc.png);
	background-position:90% 50%;
	background-repeat:no-repeat;
	background-size:15px;
	cursor:pointer;
	padding-right:10%;
}
.block-facet--checkbox h3:hover {
	background-image:url(../images/chevron_bleu.png);
	color:#006cd2;
}
.view-taxonomy-term .view-content .views-row, .view-test .view-content .views-row, .view-recherche-marches .view-content .views-row {
    margin: 0 auto 30px;
}
.view-editeurs-securite .view-content .views-row,
.view-fournisseur .view-content .views-row {
    width: 30%;
}
.page-node-type-proposition-de-don #block-webform, .region-content > div#block-views-block-les-derniers-don-block-1, .region-content > div#block-propositiondedonform,
.region-content > div#block-views-block-les-derniers-don-block-1 {
    width: 80%;
}
#block-webform-2 {
    padding: 0 5%;
    width: 90%;
    float:none;
}
#block-contact {
    float: none;
	margin-right:0;
    width: 85%;
}
.block-facet--checkbox ul {
	display:none;
}
#gauche {
    padding: 20px 5%;
    width: 90%;
}
.field--name-field-dates-debut-fin {
	margin-top:50px;
}
#droite {
    padding: 10px 5% 20px;
    width: 90%;
}
.field--name-field-duree {
    margin-bottom: 10px;
}
.field--name-field-recap-lots {
    padding-top: 10px;
}
.view-evenements-page .view-content, .node--type-article .node__content, .view-actualites .view-content {
    max-width: 100%;
    padding: 30px 30px 50px;
}
.node--type-article .node__content > div {
    display: block;
    width: 100%;
}
.node--type-article .node__content > div img {
	display:block;
	margin:0 auto;
}
ul.sf-menu.sf-style-white li:hover, ul.sf-menu.sf-style-white li.sfHover, ul.sf-menu.sf-style-white a:focus, ul.sf-menu.sf-style-white a:hover, ul.sf-menu.sf-style-white span.nolink:hover {
    background: #fff;
}
.region-sidebar-second,
.region-sidebar-first {
    padding: 50px 5%;
    width: 90%;
}
.field--name-field-fournisseur, .field--name-field-editeur, .node--type-lot .field--name-body {
    float: none;
    width: auto;
    background-position: 0 0px;
}
.node--type-lot .field--name-body {
	padding:0;
}
.field--name-field-editeur {
    float: none;
}
.field--name-field-description-longue {
    margin: 1rem;
}
/*.node--type-lot {*/
/*	width:90%;*/
/*}*/
#block-views-block-evenements-block-2, #block-views-block-marches-suggeres-block-1 {
    padding: 20px 5%;
    width: 90%;
}
}

@media all and (max-width: 850px) {

}
@media all and (min-width: 851px) {

}


@media all and (max-width: 768px) {

.region-chiffres ul li {
	margin-bottom:10px;
    width: 100%;
}
/* Audit Oceane (CAIH28-FooterBottomMargins) : le padding-left/right:102px
   ajoute sur les wrappers #block-footer/#block-footer2 (node Figma desktop
   2253:2882) n'etait scope a aucun breakpoint - il s'additionnait au
   padding:20px deja pose ci-dessous sur .ligne (node Figma MOBILE dedie
   2181:4544, 50/20/50/20), ecrasant le contenu a ~130px de large sur un
   ecran 375px. Les 2 nodes Figma sont deux frames DIFFERENTS (desktop vs
   mobile), pas un seul plafond a faire cohabiter - neutralise le padding
   desktop des wrappers ici pour laisser .ligne seule gerer la marge
   mobile, iso ce qui etait deja valide avant ce correctif. */
#block-footer,
#block-footer2 {
	padding-left: 0;
	padding-right: 0;
}
/* iso maquette mobile (Footer 402px, Frame 868/2181:4545) : layout
   VERTICAL gap 40px, aucun counterAxisAlignItems CENTER dans le spec ->
   flush-left (pas centre) comme les autres sections du site en mobile. */
#block-footer .ligne:not(.ligne-titre) {
	flex-direction: column;
	align-items: flex-start;
	gap: 40px;
	/* iso marge de page mobile (Footer 402px, padding 50/20/50/20,
	   2181:4544) - padding-left:0 (regle precedente) collait le
	   contenu au bord de l'ecran, retour utilisateur avec capture. */
	padding: 0 20px;
	text-align: left;
}
#block-footer .ligne:not(.ligne-titre)::before {
	flex-basis: auto;
	width: 160px;
	background-position: left center;
}
/* meme oubli de marge que ci-dessus (#block-footer2 .ligne n'a pas de
   padding scope mobile du tout - regle desktop padding:0 s'appliquait
   partout) : "Mentions Legales" et les icones collaient au bord. */
#block-footer2 .ligne:not(.ligne-titre) {
	padding: 0 20px;
}
#block-footer .ligne:not(.ligne-titre) > div:first-of-type,
#block-footer .ligne:not(.ligne-titre) > div:last-of-type {
	flex-basis: auto;
	max-width: 100%;
}
#block-footer .ligne.ligne-titre {
	background-image:none;
	padding:0;
}
#block-footer2 p {
	text-align:center;
}
.contact-footer {
    display: flex;
    margin: 0 auto;
    width: 180px;
}
.region-footer a.btn {
    /* margin-auto (centrage) retire : le bouton "Contact" doit rester
       aligne a gauche, meme colonne que "Contact"/l'adresse au-dessus,
       pas centre dans la colonne - retour utilisateur avec capture. */
    margin: 10px 0 0;
}
#block-views-block-anciens-evenements-block-2 p a, #block-views-block-evenements-block-3 p a,
#block-views-block-evenements-block-2 p a, #block-views-block-evenements-block-1 p a,
.view-evenements p a{
    display: block;
    margin: 0 auto 10px;
}
.region-chiffres ul li:nth-child(5) strong, .region-chiffres ul li strong {
	font-size:40px;
}
#block-views-block-slideshow-ok-block-1 h1, #block-views-block-slideshow-ok-block-1 h2 {
	font-size:22px;
}
#block-views-block-slideshow-ok-block-1 h1 strong {
	font-size:22px;
}

#block-views-block-slideshow-ok-block-1 h1, #block-views-block-slideshow-ok-block-1 h2 {
	width:auto;
}
.view-taxonomy-term .groupe, .view-recherche-marches .groupe {
    padding: 20px 20px 10px 20px;
    margin: 0 auto;
    width: auto;
}
.groupe {
	display:block;
}
.gauche, .droite {
    width: 100%;
}
.view-taxonomy-term .node--type-marche .field--name-field-media-image img, .view-test .field--name-field-media-image img, .view-taxonomy-term .node--view-mode-en-tete .field--type-image img, .view-recherche-marches .field--type-image img,
.droite .field--name-field-media-image img {
	display:block;
	margin:0 auto;
}
.view-test .node--type-marche h2,
.view-taxonomy-term .node--view-mode-en-tete h2,
.view-recherche-marches .node--type-marche h2 {
	max-width:45%;
}
.view-editeurs-securite .view-content .views-row,
.view-fournisseur .view-content .views-row {
    width: 45%;
}
.view-editeurs-securite .views-exposed-form .form--inline,
.view-fournisseur .views-exposed-form .form--inline {
	display:block;
}
.view-editeurs-securite .views-exposed-form .form--inline #edit-actions input,
.view-fournisseur .views-exposed-form .form--inline #edit-actions input {
	margin-right:0;
	margin-top:0;
}
.view-evenements-page .view-content .views-row, .view-actualites .view-content .views-row {
    margin: 0 auto 30px;
    width: 100%;
}
.page-node-type-proposition-de-don #block-webform, .region-content > div#block-views-block-les-derniers-don-block-1, .region-content > div#block-propositiondedonform, .region-content > div#block-views-block-les-derniers-don-block-1 {
    width: 90%;
}
.align-center img,
.align-center,
.align-left img,
.align-right img,
.align-left,
.align-right {
    float: none;
    display: block;
    margin:0 auto 10px;
    width: auto;
}

.view-taxonomy-term .view-header .field--name-description {
	padding:0 15px;
    width:auto;
}
.view-taxonomy-term .view-header .field--name-field-media-image {
	display:block;
	float:none;
	margin:0 auto;
	width:auto;
}
.view-taxonomy-term .view-header .field--name-field-media-image img {
	display:block;
	margin:0 auto;
}
.view-taxonomy-term .view-header .content {
	display:block;
	max-width:100%;
}



}


@media all and (min-width: 560px){
}


@media all and (max-width: 475px) {
.view-test .node--type-marche .field--name-field-type, .view-taxonomy-term .node--view-mode-en-tete .field--name-field-type, .view-recherche-marches .node--type-marche .field--name-field-type {
	top:20px;
	right:auto;
}

  #block-recherchepartheme .text-formatted ul {
    width: 100%;
  }

  #block-recherchepartheme .text-formatted ul li a {
    font-size: 14px;
  }

.gauche {
	padding-top:70px;
}
.view-test .node--type-marche h2, .view-taxonomy-term .node--view-mode-en-tete h2, .view-recherche-marches .node--type-marche h2 {
    max-width: 100%;
}
#block-titredepage h1, #block-asco-theme-page-title h1 {
	font-size:34px;
}
#webform-submission-contact-node-46-add-form .js-form-type-textfield, #webform-submission-contact-node-46-add-form .js-form-type-email, #webform-submission-contact-node-46-add-form .js-form-type-tel,
#node-proposition-de-don-form .field--type-string-long, #node-proposition-de-don-form .field--type-datetime, #node-proposition-de-don-form .field--type-email, #node-proposition-de-don-form .field--type-string {
    width: 100%;
}
#block-views-block-slideshow-ok-block-1 .views-field-body a {
	display:block;
}

.path-frontpage .caih-newsletter #block-webform-3 #edit-processed-text {
    font-size: 16px;
}

  #block-views-block-slideshow-ok-block-1 h1, #block-views-block-slideshow-ok-block-1 h2 {
    margin-bottom: 0;
  }

  #block-recherchepartheme .text-formatted ul {
    width: 100%;
  }

  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > p {
    margin: 1em 0 !important;
  }
}
@media all and (max-width: 360px) {
#block-btncote {
    position: relative;
    top: auto;
    right: auto;
    z-index: 99;
    height: auto;
}
#block-btncote .ligne {
    display: flex;
	margin-top:0;
}
.path-nos-marches #block-btncote .ligne {
    display: flex;
	margin-top:3px;
}

}
/* INFORMATION Pour le twig"*/

#information{
	position:fixed;
	bottom:20px;
	left:0;
	min-width:200px;
	background:#fff;
	padding:10px;
	border:1px solid #ddd;
	z-index:200;
}

/*----------------------ENTETE DES MEDIAS-------------*/
.block-entete-medias{
  width: 100%;
  background: transparent linear-gradient(270deg, #3E65B2 0%, #3E65B1 0%, #273A62 100%) 0% 0% no-repeat padding-box;
  margin-bottom: 60px;
}

.block-entete-medias p{
  margin: 0;
}

.block-entete-medias .content{
  margin-left: 10%;
  height: 100%;
  display: flex;
}

.block-entete-medias .field--name-body{
  color: white;
  font-size: 34px;
  min-height: 300px;
  display: flex;
  align-items: center;
  width: 50%;
  padding: 20px;
}

.block-entete-medias .field--name-body .ligne{
  padding: 0;
}

.block-entete-medias .entete-bande-blanche{
  background-image: url(/themes/asco_theme/images/bande_blanche.png);
  height: 120px;
  width: 100%;
  z-index: 2;
  bottom: -2px;
  background-repeat: no-repeat;
  background-position-y: bottom;
  align-self: end;
  position: relative;
  background-size: cover;
}

@media all and (max-width: 990px) {
  .block-entete-medias .field--name-body {
    max-width: 100%;
    min-height: 200px;
    width: auto;
  }

  .block-entete-medias .content{
    flex-direction: column;
    justify-content: center;
    margin-left: 0;
  }

  .block-entete-medias .entete-bande-blanche{
    flex-direction: column;
  }

  .page-node-type-agenda .groupe2 {
    padding: 20px 5%;
  }
}


/*----------------------ETAPE DES CAROUSELS-------------*/
.carousel-step{
  display: flex;
  justify-content: center;
  padding-bottom: 4rem;
  padding-top: 20px;
}

.step{
  width: 10px;
  height: 10px;
  background: #273A62 0% 0% no-repeat padding-box;
  border-radius: 50%;
  margin-right: 10px;
}

.step-limit{
  width: 30px;
  height: 10px;
  background: #273A62 0% 0% no-repeat padding-box;
  border-radius: 20px;
}

/*----------------------CAROUSEL MEDIAS HOME-------------*/
.block-views-blockmedias-block-1{
  background: #F9F9FB 0% 0% no-repeat padding-box;
}

#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel li{
  margin: 0 20px 0 0;
  padding-bottom: 0;
  border-bottom: 0;
}

#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel-control-next,
#block-views-block-medias-block-1 .jcarousel-skin-default .jcarousel-control-prev{
  background-position-y: 70%
}

/*----------------------CARD-------------*/
.field--name-field-type-agenda .badge {
  background: #FFE6E9 0% 0% no-repeat padding-box;
  border-radius: 3px;
  font-size: 10px;
  width: max-content;
  font-weight: bold;
  padding: 3px 10px!important;
  max-width: 100%;
  margin: 0 5px 0 0;
}

.field--name-field-type-agenda .ligne{
  padding: 0!important;
  margin: 0 5px 0 0;
}

.field--name-field-thematique,
.field--name-field-type-agenda {
  margin: 0;
  display: inline-flex;
  flex-wrap: wrap;
}

.field--name-field-thematique .field__item .ligne{
  background: white;
  border-radius: 3px;
  font-size: 10px;
  margin: 0 5px 5px 0;
  width: max-content;
  color: #006cd2;
  max-width: 100%;
  font-weight: 500;
  border: 1px solid;
}

.field--name-field-thematique .field__item .ligne{
  padding: 2px 10px!important;
}

/*----------------------TEASER MEDIA-------------*/
.node--type-media.node--view-mode-teaser {
  height: 270px;
  margin-right: 20px;
  border-bottom: 0;
  margin-bottom: 0;
  padding-bottom: 0;
}

.node--type-media.node--view-mode-teaser a{
  color: white;
}

.node--type-media.node--view-mode-teaser h2{
  font-size: 20px;
}

.node--type-media.node--view-mode-teaser .wrapper-media {
  height: 100%;
  display: flex;
  align-items: end;
}

.node--type-media.node--view-mode-teaser .wrapper-media-visuel {
  position: absolute;
  z-index: 0;
  width: 100%;
  height: 100%;
}

.node--type-media.node--view-mode-teaser  .media-filtre{
  background: transparent linear-gradient(180deg, #00000000 0%, #000000 100%) 0% 0% no-repeat padding-box;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 1;
}

.node--type-media.node--view-mode-teaser .wrapper-media-visuel .field--name-field-visuel {
  height: 100%;
  margin: 0;
}

.node--type-media.node--view-mode-teaser .wrapper-media-visuel img {
  height: 100%!important;
  width: 100%;
  border-radius: 10px;
  object-fit: cover;
}

.node--type-media.node--view-mode-teaser .wrapper-media-visuel .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
  height: 100%;
  width: 100%;
  display: block;
}

.node--type-media.node--view-mode-teaser .wrapper-media-content {
  position: relative;
  padding: 20px;
  z-index: 2;
  width: 100%;
}

.node--type-media.node--view-mode-teaser .wrapper-media-type {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.node--type-media.node--view-mode-teaser .media-type{
  font-size: 14px;
}

.node--type-media.node--view-mode-teaser .media-icon-type{
  font-size: 30px;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: rgb(255,255,255, 0.7);
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 20%;
  left: 50%;
  transform: translate(-50%, -20%);
  z-index: 1;
}

.node--type-media.node--view-mode-teaser .media-icon-type.podcast::after{
  font: var(--fa-font-solid);
  content: "\f130";
  font-weight: 900;
  color: #006cd2;
}

.node--type-media.node--view-mode-teaser .media-icon-type.video::after{
  font: var(--fa-font-solid);
  content: "\f03d";
  font-weight: 900;
  color: #006cd2;
}

.node--type-media.node--view-mode-teaser .media-icon-type.white-book::after{
  font: var(--fa-font-solid);
  content: "\e0bb";
  font-weight: 900;
  color: #006cd2;
}

/*----------------------MEDIA-------------*/
.node--type-media .node__content {
  display: flex;
  justify-content: space-between;
  width: auto;
  max-width: 1600px;
  margin: 0 auto;
  padding: 50px 30px;
}

.node--type-media .node__content .wrapper-media-gauche {
  width: 40%;
}
.node--type-media .node__content .wrapper-media-droit {
  width: 55%;
}

.node--type-media .node__content .wrapper-media-meta {
  display: flex;
  justify-content: space-between;
  margin-bottom: 30px;
}

.node--type-media .node__content .wrapper-media-type {
  display: flex;
}

.node--type-media .node__content .title h2{
  margin: 0 0 0.5em;
}

.node--type-media .node__content .field--name-field-thematique{
  margin-right: 20px;
}

.node--type-media hr{
  border-color: #006cd2;
  margin-block-end: 0.8em;
}

.node--type-media .node__content .media-date-created{
  justify-self: end;
}

.node--type-media .node__content .field--name-field-lien .ligne {
  display: inline!important;
}

.node--type-media .node__content .field--name-field-lien a{
  color: black;
  text-decoration: underline;
}

.node--type-media .node__content .field--name-field-lien a:hover{
  text-decoration: none;
}

.node--type-media .node__content .field--name-field-lien::before{
  font: var(--fa-font-solid);
  content: "\f0c1";
  font-weight: 900;
  color: black;
  margin-right: 10px;
}

@media all and (max-width: 768px) {
  .node--type-media .node__content {
    display: block;
    max-width: 100%;
  }

  .node--type-media .node__content .wrapper-media-gauche {
    width: 100%;
  }

  .node--type-media .node__content .wrapper-media-droit {
    width: 100%;
    margin-bottom: 30px;
  }

  .node--type-media .node__content .field--name-field-thematique{
    display: block;
  }
}

/*----------------------PAGE LES MEDIAS-------------*/
/* Scope a .view-medias (pas juste .view-display-id-page_1) : "page_1" est
   l'ID de display generique que Drupal donne a tout affichage "Page" d'une
   vue - ce selecteur non scope s'appliquait par accident a une dizaine
   d'autres pages listing du site (actualites, articles, evenements, dons,
   nos-marches...), les plafonnant a 1400px/80% alors que le reste du site
   est a 1800px (retour utilisateur, analyse dediee). */
.view-medias.view-display-id-page_1{
  max-width: 1400px;
  width: 80%;
  margin: 0 auto;
}

.view-medias.view-display-id-page_1 .view-header{
  float: left;
}

.view-medias.view-display-id-page_1 .view-filters{
  float: right;
}

.view-medias.view-display-id-page_1 .view-content,
.view-medias.view-display-id-page_1 .view-empty{
  clear: both;
  margin-top: 20px;
  padding: 20px 0;
}

.view-medias.view-display-id-page_1 .view-content .views-row .views-col{
  margin-bottom: 20px;
  padding: 0;
  padding-right: 20px;
}

.block-modal .node--type-media .node__content,
.block-modal .node--type-media .node__content .field--name-field-type-de-media .ligne,
.block-modal .node--type-media .node__content .field--name-body .ligne,
.block-modal .node--type-media .node__content .field--name-field-lien .ligne{
  width: 100%;
  padding: 0;
  max-width: 100%;
}

@media all and (max-width: 990px) {
  .view-medias.view-display-id-page_1 .view-content .views-row .views-col{
    width: 100%!important;
    padding: 0;
  }
}

/* Pages listing simples (sans sidebar facettes) laissees sans plafond par
   la restriction ci-dessus - alignees sur le meme plafond 1800px que le
   reste du site (retour utilisateur). */
.view-actualites.view-display-id-page_1,
.view-articles.view-display-id-page_1,
.view-evenements-page.view-display-id-page_1,
.view-anciens-evenements.view-display-id-page_1,
.view-fournisseur.view-display-id-page_1,
.view-editeurs-securite.view-display-id-page_1 {
  max-width: 1800px;
  margin: 0 auto;
  padding: 0 100px;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .view-actualites.view-display-id-page_1,
  .view-articles.view-display-id-page_1,
  .view-evenements-page.view-display-id-page_1,
  .view-anciens-evenements.view-display-id-page_1,
  .view-fournisseur.view-display-id-page_1,
  .view-editeurs-securite.view-display-id-page_1 {
    padding: 0 20px;
  }
}
/* nos-marches/dons/nos-marches-par-adherent : sidebar facettes
   (.region-colonnegauche, region SEPAREE hors <main>, float:left 412px)
   suivie de .region-content en display:flex (CAIH-? ligne ~4491) qui
   forme un nouveau bloc de mise en forme et se decale donc naturellement
   a droite du float, sans besoin de margin-left calcule. Verifie via
   capture Playwright a 1920/2400px : sans plafond la colonne resultats
   grandit sans limite a droite du flottant - meme plafond 1800px que les
   pages listing simples, applique ici au conteneur de la vue (le sidebar
   414px reste en plus, hors de ce plafond, iso ce que faisait deja
   .view-medias avant ce correctif). .view-recherche-marches est aussi
   porte par le gabarit nos-marches-par-adherent (classe partagee dans le
   HTML de la vue), donc couvre les 2 URLs. */
.view-recherche-marches.view-display-id-page_1,
.view-recherche-dons.view-display-id-page_1 {
  max-width: 1800px;
  margin: 0 auto;
  padding: 0 100px;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  .view-recherche-marches.view-display-id-page_1,
  .view-recherche-dons.view-display-id-page_1 {
    padding: 0 20px;
  }
}

/*----------------------FORMULAIRE FILTRE VUES LES MEDIAS-------------*/
.path-medias .views-exposed-form select,
.path-medias .views-exposed-form input{
  background: #F9F9FB 0% 0% no-repeat padding-box;
  border-radius: 30px;
  padding: 10px 25px 10px 20px;
  color: #909090;
  border: none;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  min-width: 150px;
  cursor: pointer;
  font-size: 14px;
}

.path-medias .views-exposed-form select {
  max-width: 140px;
  min-width: auto;
}

.path-medias .views-exposed-form label{
  display: inline;
  font-size: 14px;
  font-weight: normal;
  margin-right: 5px;
}

.path-medias .views-exposed-form  .form--inline{
  display: flex;
  flex-wrap: wrap;
}

.path-medias .views-exposed-form .js-form-item {
  position: relative;
}

.path-medias  .views-exposed-form .js-form-type-select:after {
  font: var(--fa-font-solid);
  content: "\f0d7";
  font-weight: 900;
  position: absolute;
  right: 10px;
  top: 13px;
  color: #909090;
}

.path-medias .views-exposed-form .js-form-item-field-thematique-target-id{
  margin-left: 20px;
}

.path-medias .views-exposed-form .js-form-item-title:after {
  font: var(--fa-font-solid);
  content: "\f002";
  font-weight: 900;
  position: absolute;
  right: 20px;
  top: 15px;
  color: #909090;
}

.path-medias .views-exposed-form .js-form-item-sort-by{
 display: none;
}

@media all and (max-width: 768px) {
  .path-medias .views-exposed-form .js-form-item{
    width: 100%;
  }

  .path-medias .views-exposed-form select,
  .path-medias .views-exposed-form input{
    width: 100%;
  }

  .path-medias .views-exposed-form .js-hide{
    display: none;
  }

  .path-medias .views-exposed-form .js-form-item-field-thematique-target-id{
    margin-left: 0;
  }

}

/*----------------------BLOCK AGENDA-------------*/
.block-views-blockagenda-block-1{
  max-width: 1200px;
  width: 100%;
  position: relative;
  margin: 0 auto;
}

.block-block-groupgroupe-entete-page-medias .content-agenda{
  float: right;
  width: 500px;
  position: relative;
  z-index: 200;
  background: #F9F9FB 0% 0% no-repeat padding-box;
  box-shadow: 0px 10px 20px #3e65b229;
  border: 1px solid #D4DBEA;
  border-radius: 10px;
  margin-bottom: 30px;
  padding: 20px;
  position: relative;
  margin-top: -30%;
  height: 420px;
  /*overflow-y: scroll;
  -ms-overflow-style: none;   IE and Edge
  scrollbar-width: none;  Firefox */
}

#block-groupeentetepagemedias div.block-views-blockagenda-block-1 div.ligne-block.tabsContent .view-content {
  height: 360px;
  overflow: scroll;
  -ms-overflow-style: none;  /* IE and Edge */
  scrollbar-width: none;  /* Firefox */
}

#block-groupeentetepagemedias div.block-views-blockagenda-block-1 div.ligne-block.tabsContent .view-content::-webkit-scrollbar {
  display: none;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .menutabs {
  position: absolute;
  left: 160px;
  width: 120px;
  height: auto;
  z-index: 99;
  display: flex;
  justify-content: space-evenly;
}

.block-block-groupgroupe-entete-page-medias .content-agenda #color-calendar.calendartab.active {
  min-width: 500px;
  min-height: 345px;
  background: white;
  z-index: 201;
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 20px;
  display: block;
  border-bottom-right-radius: 10px;
  border-bottom-left-radius: 10px;
}

.block-block-groupgroupe-entete-page-medias .content-agenda #color-calendar {
  display: none;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .menutabs .menutabs-agenda {
  background-image: url(../images/viewagenda.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 25px;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .menutabs .menutabs-calendar {
  background-image: url(../images/view-month.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: 25px;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .menutabs .menutabs-agenda.active {
  background-image: url(../images/viewagenda-active.png);
}

.block-block-groupgroupe-entete-page-medias .content-agenda .menutabs .menutabs-calendar.active {
  background-image: url(../images/view-month-active.png);
}

.block-views-blockagenda-block-1 > .content-agenda > .menutabs > button.active {
  background-color: #006cd2;
}

.block-views-blockagenda-block-1 > .content-agenda > .menutabs > button:hover:not(button.active) {
  background-color: #d6ecef;
}

.block-views-blockagenda-block-1 .content-agenda .menutabs button {
  border: none;
  border-radius: 5px;
  background-color: #f9f9fb;
  padding: 1.3em 1.4em;
  cursor: pointer;
}

.block-block-groupgroupe-entete-page-medias .content-agenda::-webkit-scrollbar {
  display: none; /* Chrome, Safari and Opera */
}

.block-block-groupgroupe-entete-page-medias a{
 color: black;
}

.block-block-groupgroupe-entete-page-medias h2{
  margin-top: 0;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .view-header{
  float: left;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .view-filters{
  float: right;
  margin-bottom: 20px;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .view-content,
.block-block-groupgroupe-entete-page-medias .content-agenda .view-empty{
  clear: both;
}

.block-block-groupgroupe-entete-page-medias .content-agenda .views-exposed-form select{
  background: #FFFFFF;
  color: #909090;
  font-family: 'Poppins';
}

.block-block-groupgroupe-entete-page-medias .content-agenda .views-exposed-form .form-item{
  margin: 0;
}

@media all and (max-width: 500px) {
  .block-block-groupgroupe-entete-page-medias .content-agenda .menutabs {
    visibility: hidden;
  }

  .block-block-groupgroupe-entete-page-medias #color-calendar {
    visibility: hidden;
  }

  }


@media all and (max-width: 768px) {
  .block-views-blockagenda-block-1 .view-header,
  .block-views-blockagenda-block-1 .view-filters{
    float: unset;
  }

  .block-views-blockagenda-block-1 .content #color-calendar.calendartab.active {
    height: 310px;
    min-height: 360px;
    min-width: 100%;
    padding-top: 20px !important;
    padding: unset;
  }

  /*.block-block-groupgroupe-entete-page-medias .content-agenda .view-header {
    float: unset !important;
  }*/

  #block-groupeentetepagemedias div.block-views-blockagenda-block-1 div.ligne-block.tabsContent .view-content {
    height: 325px;
  }
}

@media all and (max-width: 990px) {
  .path-nos-marches  .view-recherche-marches .view-header {
    font-style: italic;
    font-size: 18px;
    margin-bottom: 30px;
    text-align: left;
    color: black !important;
    position: unset !important;
  }

  .path-nos-marches .view-recherche-marches .node--type-marche h2 {
    margin: 0 0 5px !important;
  }

  #block-views-block-slideshow-ok-block-1 .views-field-body > div {
    /* iso maquette mobile (Frame 935/2181:4135, largeur 358/402, marge
       ~20px) : deux regles heritees (margin:0 10% non scopee, et margin:
       0 5% @media max-width:426px, ~19-38px selon la largeur d'ecran)
       fixaient une marge EN POURCENTAGE combinee a un max-width:90% -
       le texte wrappait en 4 lignes ("achats" isole) au lieu de 3
       ("achats informatiques" ensemble sur la ligne 2, iso maquette).
       Chromium rend "informatiques" en gras plus large que le moteur
       Figma (ecart de rendu de police mesure empiriquement, cf audit
       Oceane sur le bouton "Portail CAIH") : le meme pourcentage qui
       tient sur 3 lignes dans Figma ne suffit plus ici. Marge fixe
       reduite a 15px (vs ~20px maquette, ecart mineur assume pour
       compenser ce rendu) + width en calc() plutot que max-width seul,
       pour garantir AUCUN debordement quelle que soit la largeur d'ecran
       (contrairement a un 1er essai en max-width:100% qui, combine aux
       marges en % heritees, faisait deborder "telecoms" hors du cadre -
       regression constatee et corrigee ici). !important necessaire pour
       battre les 2 regles de marge heritees.
       17px = marge MAX mesuree empiriquement qui tient encore sur 3 lignes
       (18px repasse a 4, "achats" isole) - demande explicite : plus de
       marge visible tout en gardant 3 lignes. */
    margin: 0 17px !important;
    width: calc(100% - 34px) !important;
    max-width: none;
    flex-shrink: 0;
    position: relative;
    text-align:center;
    display: flex;
    flex-direction: column;
    /* Centre verticalement texte+CTA dans les 475px de .views-field-body
       (demande explicite) - flex-end plaquait tout en bas, flex-start
       (1er essai) laissait un grand vide en bas de la photo. */
    justify-content: center;
  }

  #block-views-block-slideshow-ok-block-1 .views-field-body {
    height: 475px;
    justify-items: center;
  }

  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > p {
    margin: 1.5em 0;
  }

  .path-frontpage #homepageslider > ol.flex-control-nav {
    position: relative;
    bottom: 7px;
    top: -20px;
    left: inherit;
    text-align: center;
    margin: auto;
  }

  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > h1 {
    font-size: 25px;
    margin: 0;
    width: auto;
  }

  .block-views-blockagenda-block-1{
    height: auto;
    width: 90%;
    margin: auto;
    margin-top: -150px;
    z-index: 200;
    position: relative;
    display: flex;
    justify-content: center;
  }

  .block-block-groupgroupe-entete-page-medias .content-agenda{
    width: 100%;
    max-width: 100%;
    margin-top: 0;
  }

  .block-block-groupgroupe-entete-page-medias .content-agenda #color-calendar.calendartab.active {
    width: 100%;
    /*max-width: 100%;*/
    min-width: 100%;
    min-height: 370px;
    padding-top: 15px !important;
    padding: unset;
  }
}

/*----------------------CALENDRIER AGENDA-------------*/

.color-calendar {
  width: 100% !important;
  overflow: inherit !important;
}

.color-calendar .calendar__body {
  overflow: inherit !important;
}

.color-calendar.basic {
  box-shadow: none !important;
}

.color-calendar.basic .calendar__header, .color-calendar.basic .calendar__body {
  padding: unset !important;
}

.color-calendar .calendar__header, .color-calendar.basic .calendar__weekdays, .color-calendar .calendar__days {
  justify-content: space-between;
}

.color-calendar .calendar__days {
  grid-template-rows: repeat(6, minmax(30px, 45px)) !important;
}

.color-calendar .calendar__days .calendar__day-event .calendar__day-bullet {
  position: absolute;
  width: 40px !important;
  height: 40px !important;
  z-index: 0;
  border-radius: 5px !important;
  top: 0 !important;
  left: unset !important;
  transform: initial !important;
}

#color-calendar .calendar__days .info-event {
  position: absolute;
  top: 100%;
  width: 300px;
  max-height: calc(100vh - 150px);
  background-color: white;
  z-index: 999;
  padding: 1em;
  box-shadow: 0px 5px 10px #0000000D;
  border: 1px solid #E5E5E5;
  border-radius: 10px;
  font-family: 'Poppins';
  left: auto;
}

#color-calendar .calendar__days .info-event:after {
  content: '';
  position: absolute;
  top: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
}

#color-calendar .calendar__days .info-event.left:after {
  right: -20px;
}

#color-calendar .calendar__days .info-event.right:after {
  left: -20px;
}


#color-calendar .calendar__days .info-event h2 {
  font-size: 16px;
}

#color-calendar .calendar__days .info-event div {
  font-size: 13px;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
  padding: 0;
  max-width: 100%;
}

#color-calendar .calendar__days .info-event .calendrier-thematique {
  color: #006cd2;
  font-weight: 500;
  border: 1px solid;
  padding: 3px 6px!important;
}

#color-calendar .calendar__days .info-event span {
  border-radius: 3px;
  white-space: nowrap;
  padding: 4px 6px;
  font-size: 10px;
  font-weight: 600;
  margin-right: 5px;
}

#color-calendar .calendar__days .info-event span.type {
  background-color: #FFCBCB;
  color: #850816;
}

#color-calendar .calendar__days .info-event span.thematique {
  background-color: white;
  color: #006cd2;
  border: 1px solid #006cd2;
}

.color-calendar .calendar__days .calendar__day-event {
  position: relative;
  z-index: auto !important;
}

#color-calendar .calendar__day-event span.calendar__day-text {
  color: white !important;
  font-weight: bolder !important;
  z-index: 2;
}

#color-calendar .calendar__day-box {
  background-color: transparent !important;
  box-shadow: none !important;
}

#color-calendar .calendar__days .calendar__day {
  font-weight: inherit !important;
}

#color-calendar .calendar__weekdays .calendar__weekday {
  font-weight: 900 !important;
  opacity: unset !important;
  font-size: 14px !important;
}

#color-calendar .calendar__days .calendar__day-selected {
  color: black !important;
}

.color-calendar.basic .calendar__picker-year-today, .color-calendar.basic .calendar__picker-month-today {
  box-shadow: unset !important;
  background: #006cd2 !important;
}

#color-calendar .calendar__day.calendar__day-active.calendar__day-no-event {
  z-index: auto !important;
}

/*----------------------TEASER AGENDA-------------*/
.node--type-agenda.node--view-mode-teaser{
  border-bottom: 0;
  background-color: #FFFFFF;
  padding-bottom: 0;
}

.node--type-agenda.node--view-mode-teaser .wrapper-agenda{
  display: flex;
  justify-content: space-between;
}

.node--type-agenda.node--view-mode-teaser .wrapper-agenda .wrapper-date{
  background: #D3DBEC 0% 0% no-repeat padding-box;
  border-radius: 10px 0px 0px 10px;
  width: 12%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.node--type-agenda.node--view-mode-teaser  .wrapper-agenda .wrapper-date .date-day{
  text-align: center;
  font-size: 24px;
  color: #273A62;
  font-weight: bold;
}

.node--type-agenda.node--view-mode-teaser  .wrapper-agenda .wrapper-date .date-month{
  text-align: center;
  font-size: 16px;
  color: #273A62;
  text-transform: capitalize;
}

.node--type-agenda.node--view-mode-teaser  .wrapper-agenda .wrapper-agenda-content {
  width: 82%;
  padding: 10px 10px 10px 10px;
}

.node--type-agenda.node--view-mode-teaser  .wrapper-agenda .wrapper-agenda-content .field--name-title{
  font-size: 16px;
  font-weight: bold;
}

.node--type-agenda.node--view-mode-teaser  .wrapper-agenda .wrapper-agenda-content .field--name-field-description .ligne {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  margin: 0;
  padding: 0;
  max-width: 100%;
}

.node--type-agenda.node--view-mode-teaser  .wrapper-agenda .wrapper-agenda-type{
  display: inline-flex;
  margin-top: 10px;
}


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

.path-medias #block-webform-3 {
  max-width: 71%;
  margin: 1em auto 2em;
}

.path-medias #block-webform-3 .content {
  background: #006cd2;
  padding: 0.3em 0.5em;
  border-radius: 10px;
  color: white;
  font-family: 'Poppins';
  margin: 0 2em;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form {
  display:flex;
  align-items: center;
  margin: 0 2em;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-choisissez-votre-thematique,
.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-case-rgpd {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  position: relative;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-case-rgpd {
  align-items: flex-start !important;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form  #edit-processed-text {
  margin-right: 4em;
  border-right: 1px solid #ffffff96;
  padding: 0 1em;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-choisissez-votre-thematique {
  appearance: none;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-choisissez-votre-thematique {
  height: 70px;
  border-radius : 5px !important;
}
.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-choisissez-votre-thematique,
.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-email {
  padding: 12px 25px;
  border-radius: 30px;
  border: none;
  color: #909090;
  width: 100%;
  font-family: 'Poppins';
  font-size: 14px;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form  .form-item-choisissez-votre-thematique label {
  font-weight: 400;
  font-size: 14px;
  white-space: nowrap;
  padding-right: 2em;
}

.path-medias #block-webform-3 #edit-container-01 .form-item-email {
  width: 100%;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-case-rgpd input {
  margin-top: 5px;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-case-rgpd input:checked {
  accent-color: white;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container-01 {
  display: flex;
  position: relative;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container {
  max-width: 45%;
  width: 100%;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container-01 #edit-actions-submit {
  background-color: #273A62;
  padding: 10px 20px !important;
  border: 1px solid #273A62;
  margin: 0;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container-01 #edit-actions-submit:hover {
  background-color: #FFFFFF;
  color: #006cd2;
  border: 1px solid #006cd2;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container-01 #edit-actions--2 {
  position: absolute;
  right:0;
  padding-top: 0;
}

.path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container-01 #edit-actions--3 {
  position: absolute;
  right: -1px;
  top: 2px;
  padding-top: 0;
}

@media all and (max-width: 426px) {
  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container-01 #edit-actions--3 {
    position: unset !important;
  }

  .region-header .site-branding__logo {
    margin-left: 1em;
  }

  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div {
    margin: 0 5%;
  }

  .path-frontpage #homepageslider > div > ul > li.flex-active-slide > div.views-field.views-field-body > div > h1 {
    font-size: 22px;
  }

  #block-contact iframe {
    width: 272px;
    height: 272px;
  }
}

@media all and (max-width: 1600px) {
  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-choisissez-votre-thematique label {
    white-space: unset;
  }

}

@media all and (max-width: 990px) {

  .path-medias #block-webform-3 {
    max-width: 100%;
  }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-email {
    max-width: none;
    width: 100%;
  }

  .path-medias #block-webform-3 .content {
    border-radius: unset;
    margin: unset;
  }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form {
    flex-wrap: wrap;
    justify-content: center;
  }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-processed-text {
    margin-right: 0;
    text-align: center;
    border-right: none;
  }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container {
    max-width: none;
  }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form .form-item-choisissez-votre-thematique {
    justify-content: space-evenly;
    flex-wrap: wrap;
  }

  .path-medias #block-webform-3 .content .webform-submission-newsletter-thematique-form #edit-container-01 {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .path-nos-marches article .droite img,
  .page-node-type-fournisseur article .droite img,
  .block-views-blockmarches-suggeres-block-1 article .droite img,
  .home-nos-marches-view .node--type-marche .droite img {
    position: unset;
    clip-path: unset;
    width: 100% !important;
    height: 160px !important;
  }

  .path-nos-marches article .gauche,
  .page-node-type-fournisseur article .gauche,
  .block-views-blockmarches-block-1 .home-nos-marches-view .node--type-marche .gauche,
  .block-views-blockmarches-suggeres-block-1 .node--type-marche .gauche,
  .home-nos-marches-view .node--type-marche .gauche {
    width: 89%;
    padding: 14px;
  }

  .path-nos-marches article .droite,
  .page-node-type-fournisseur article .droite,
  .block-views-blockmarches-suggeres-block-1 article .droite,
  .home-nos-marches-view .node--type-marche .droite {
    width: 100%;
  }

  .view-medias.view-display-id-page_1 {
    width: 95%;
  }

  .path-nos-marches .view-recherche-marches .groupe,
  .page-node-type-fournisseur .view-test .groupe,
  .block-views-blockmarches-suggeres-block-1 .node--type-marche .groupe,
  .home-nos-marches-view .node--type-marche .groupe {
    display: flex;
    flex-direction: column-reverse;
  }

}

/*----------------------MODAL-------------*/
.block-modal{
  position: fixed;
  width: 100%;
  height: 100%;
  background: rgb(0,0,0, 0.3);
  z-index: 1000;
  top: 0;
  display: none;
}

.block-modal .content{
  max-width: 1400px;
  width: 100%;
  height: 100%;
  position: relative;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.block-modal .close:after{
  font: var(--fa-font-solid);
  content: "\f00d";
  font-weight: 900;
  font-size: 24px;
  cursor: pointer;
  position: absolute;
  right: 40px;
}

.block-modal .block-modal-body{
  padding: 30px 70px;
  background: #F9F9FB 0% 0% no-repeat padding-box;
  overflow-y: scroll;
  max-height: 800px;
  position: relative;
  width: 80%;
}

.block-modal .field--name-field-visuel .ligne{
  display: block;
  max-width: 100%;
  padding: 0;
}

.block-modal .field--name-field-visuel img{
  width: 100%;
}

@media all and (max-width: 990px) {
  .block-modal .ligne{
    justify-content: space-between;
  }

  #block-catalogue .ligne {
    padding: 0 0 2em 0;
  }

  #block-formulaireexposerecherche-marchespage-1-3 {
    padding: 0;
  }
}

@media all and (max-width: 768px) {

  .block-modal .block-modal-body{
    padding: 30px 30px;
    max-height: 700px;
  }

  .block-modal .close:after{
    font: var(--fa-font-solid);
    content: "\f00d";
    font-weight: 900;
    font-size: 24px;
    cursor: pointer;
    position: absolute;
    right: 40px;
  }

  .block-modal .close:after{
    right: 10px;
    top: 10px;
    bottom: 1px;
  }

  .block-modal .field--name-field-thematique{
    width: min-content;
  }
}
.page-node-type-marche .block-system-main-block .ligne {
  all:unset;
}
/* TYPE DE CONTENU : ACHETEUR */
.node--type-acheteur {
  display: flex;
  justify-content: center;
  @media (min-width: 426px) {
    justify-content: flex-start;
  }

  fieldset {
    all: unset;
  }
  .node__content {
    display: flex;
    flex-direction: row;
    gap: 10px;
    width: fit-content;
    padding: 10px 0;
    @media (min-width: 426px) {
      padding: 20px 30px;
    }
    @media (max-width: 425px) {
      align-items: center;
      flex-direction: column;
    }
    .field--name-field-photo {
      width: 65px;
      height: 65px;
      object-fit: cover;
      margin: 0;
      .field--name-field-media-image {
        margin: 0;
      }
      img {
        border-radius: 6px;
      }
    }
    .block_nom_prenom {
      display: flex;
      > .fieldset-wrapper {
        display: flex;
        gap: 5px;
        @media (max-width: 425px) {
          width: 100%;
          justify-content: center;
        }
      }
    }

    .field--name-field-nom {
      font-weight: bold;
      text-transform: uppercase;
      @media (max-width: 425px) {
        text-align: center;
      }
    }
    .field--name-field-fonction {
      padding-bottom: 10px;
      @media (max-width: 425px) {
        text-align: center;
      }
    }
    .field--name-field-email-de-contact .field__label, .field--name-field-telephone .field__label {
      display: inline-flex;
      gap: 10px;
      &:before {
        display:block;
        content: '';
        width: 20px;
        height: 20px;
        background-size: contain;
        background-repeat: no-repeat;
      }
    }
    .field--name-field-telephone {
      padding-top: 10px;
      a {
        color: #3B3B3B;
      }
    }
    .field--name-field-email-de-contact, .field--name-field-telephone {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
    }

    .field--name-field-email-de-contact .field__label{
      &:before {
        background-image: url(../images/mail.svg);
      }
    }
    .field--name-field-telephone .field__label {
      &:before {
        background-image: url(../images/phone.svg);
      }
    }
    .field--name-field-email-de-contact .field__label, .field--name-field-telephone .field__label {
      font-size: 14px;
    }
    .field--name-field-email-de-contact .field__item, .field--name-field-telephone .field__item {
      font-weight: 600;
      @media (min-width: 991px) {
        padding-left: 30px;
      }
    }
  }
}

/* REFONTE PAGE MARCHE */
.page-node-type-marche {
  #block-titredepage h1 {
    padding-bottom: 10rem;
  }
  .node__content > .field--name-field-reference {
    display: flex;
    justify-content: center;
    gap: 6px;
    font-size: 18px;
    color: #273A62;
    .field__label {
      font-weight: normal;
    }
  }

  .node--type-acheteur {
    .node__title {
      display: none;
    }
  }

  .field--name-field-lots {
    .field--name-field-fournisseur {
      .field__label {
        font-size: 16px;
        font-weight: bold;
        text-transform: uppercase;
        padding-bottom: 5px;
      }
      > .field__items {
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        gap: 1rem;
        align-items: stretch;
        > .field__item {
          border: 1px solid #BDBFC7;
          border-radius: 8px;
          padding: 10px;
          min-height: 75px;
          .node--type-fournisseur {
            padding: 0;
            display: flex;
            height: 100%;
            align-items: center;
            header {
              display: none;
            }
            .node__content {
              .field--name-field-media-image {
                all: unset;
                a {
                  display: block;
                }
              }
            }
          }
        }
      }
    }
  }

  .field--name-field-media-image {
    margin: 0;
  }

  #haut-marche {
    margin-top: 2rem;
    border-radius: 30px 30px 0 0;
    padding: 2rem;
    display: grid;
    gap: 2rem;
    color: #F9F9FB;
    grid-template-columns: 1fr;
    grid-template-rows: auto;
    grid-template-areas:
    "date"
    "duree"
    "gain"
    "lot"
    "block_FAS"
    "description";
    @media (min-width: 1150px) {
      margin: 2rem 50px;
      border-radius: 30px;
      padding: 3rem;
      grid-template-columns: repeat(6, 1fr);
      grid-template-areas:
    "date date date block_FAS block_FAS block_FAS"
    "duree duree gain gain lot lot"
    "description description description description description description";
    }

    fieldset {
      all: unset;
    }

    .block_bleu_1 > .fieldset-wrapper {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 1rem;
      justify-content: flex-start;
      @media (min-width: 1150px) {
        justify-content: flex-end;
      }

      .field--name-field-fiche-marche, .field--name-field-lien-d-adhesion {
        a {
          background-color: white;
          border: 1px solid white;
          color: #273A62;
          &:hover {
            background-color: #273A62;
            border: 1px solid white;
            color: white;
            &:after {
              filter: brightness(0) saturate(100%) invert(100%) sepia(8%) saturate(7439%) hue-rotate(181deg) brightness(100%) contrast(114%);;
            }
          }
          &:after {
            filter: brightness(0) saturate(100%) invert(19%) sepia(33%) saturate(1027%) hue-rotate(183deg) brightness(96%) contrast(92%);
          }
        }
      }
      .social-sharing-buttons a {
        filter: brightness(0) saturate(100%) invert(100%) sepia(8%) saturate(7439%) hue-rotate(181deg) brightness(100%) contrast(114%);;
      }
    }

    .field--name-field-gains,
    .field--name-field-duree,
    .field--name-field-nombre-de-lots {
      &:before {
        content: '';
        display: block;
        background-repeat: no-repeat;
        background-size: contain;
        width: 50px;
        height: 50px;
      }
    }
    .field--name-field-duree {
      .field__label {
        grid-area: label;
      }
      .field__item {
        grid-area: texte;
      }
      &:before {
        background-image: url(../images/duree-icon.svg);
        grid-area: icon-svg;
      }
    }
    .field--name-field-gains {
      .field__label {
        grid-area: label;
      }
      .field__item {
        grid-area: texte;
      }
      &:before {
        background-image: url(../images/picto_gains.svg);
        grid-area: icon-svg;
      }
    }
    .field--name-field-nombre-de-lots {
      .field__label {
        grid-area: label;
      }
      .field__item {
        grid-area: texte;
      }
      &:before {
        background-image: url(../images/picto_lots.svg);
        grid-area: icon-svg;
      }
    }

    .field--name-field-dates-debut-fin {
      grid-area: date;
    }
    .block_bleu_1 {
      grid-area: block_FAS;
    }
    .field--name-field-duree, .field--name-field-gains, .field--name-field-nombre-de-lots {
      display: grid;
      grid-template-columns: 0fr 1fr;
      grid-template-rows: 30px;
      gap: 0 1rem;
      grid-template-areas:
    "icon-svg label"
    "icon-svg texte";
    }
    .field--name-field-duree {
      grid-area: duree;
      @media (min-width: 1250px) {
        padding-left: 6rem;
      }
    }
    .field--name-field-gains {
      grid-area: gain;
      @media (min-width: 1250px) {
        padding: 0 3rem;
      }
    }
    .field--name-field-nombre-de-lots {
      grid-area: lot;
      @media (min-width: 1250px) {
        padding-right: 6rem;
      }
    }
    .field--type-text-with-summary {
      grid-area: description;
      font-size: 14px;
    }
  }

  /* Ancien style de ".field--name-field-nos-contacts-caih" (grille auto-fit,
     bordure #D4DBEA sur field__item) supprime : entre en collision de
     specificite avec la reimplementation CAIH-35 (Frame 696 / 2256:4201,
     cf. plus bas dans ce fichier) et produisait une double bordure autour
     de chaque carte + une grille au lieu du flex row attendu. */

  .field--name-field-lots {
    margin: 1rem;
    @media (min-width: 1150px) {
    margin: 3rem;
    }
  }

  .onglet-contacts {
    border:none;
    summary {
      background: #F3F3F3;
      list-style-type: none;
      font-weight: bold;
      font-size: 20px;
      text-transform: uppercase;
      padding: 1rem;
      position: relative;
      &[aria-expanded="false"] {
        border-radius: 8px;
      }
      &[aria-expanded="true"] {
        border-radius: 8px 8px 0 0;
        &:after {
          transform: rotate(180deg);
        }
      }
      &:after {
        content: '';
        display: block;
        background-image: url(../images/chevron-down.svg);
        background-repeat: no-repeat;
        background-size: contain;
        width: 20px;
        height: 20px;
        position: absolute;
        right: 15px;
        top: 22px;
      }
    }
    .details-wrapper {
      background: #F3F3F3;
      border-radius: 0 0 8px 8px;
      padding: 0 1rem;
      > .field--name-field-contacts {
        > .field__item {
          padding-bottom: 2rem;
          .paragraph--type--groupe-contacts-lot {
            .field--name-field-intitule {
              padding-bottom: 1rem;
            }
            .field--name-field-nom-du-titulaire {
              font-weight: bold;
              text-transform: uppercase;
            }
            .field--name-field-contacts {
              gap: 1rem 4rem;
              display: flex;
              flex-direction: row;
              flex-wrap: wrap;
            }
            .field--name-field-telephone a {
              color: #3B3B3B;
            }
          }
        }
        > .field__item:nth-child(2) {
          border-top: 2px solid #C2C2C2;
          padding-top: 2rem;
        }
      }
    }

  }
}

.block-views-blockevenements-block-1 {
  background: #F9F9FB;
  padding-top: 2rem;
}


.field--name-field-lots .field__item {
  border-bottom: 2px solid rgba(231, 237, 245, 1);
}

.field--name-field-lots .field__item .field__item {
  border-bottom: none;
}


.field--name-field-lots .field__item:last-of-type {
  border-bottom: none;
}

#tarteaucitronIcon #tarteaucitronManager img {
  width: 50px;
  height: 45px !important;
  object-fit: cover !important;
}

.page-node-type-marche {
  /* CAIH-34 : ce decalage -150px compensait la hauteur du bloc "Titre de page"
     generique (#block-titredepage), desormais masque pour ce type de contenu
     (cf. block.block.titredepage, bundle "marche" ajoute a la condition de
     visibilite) au profit du hero personnalise .hero-marche. Sans le bloc a
     compenser, ce decalage faisait chevaucher le hero sous le header. */
  .block-system-main-block {
    top: 0;
    margin-bottom: 0;
  }
  .block-views-blockmarches-suggeres-block-1 {
    background: #F9F9FB;
  }
  .view-evenements, .view-marches-suggeres {
    max-width: 1440px;
    margin: 0 auto;
    .view-header, .view-content {
      max-width: unset;
      margin: 1rem;
      @media (min-width: 1150px) {
        margin: 0 50px;
      }
    }
    .views-field-type.Actualité {
      padding: 5px 10px;
    }
    .jcarousel-skin-default .jcarousel ul {
      gap: 20px;
    }
    .views-field.views-field-type {
      margin: 0;
    }
    .views-field {
      padding: 0;
    }
  }
}

/* =========================================================
   CAIH-29 : Fil d'ariane (Frame 923) + Bandeau hero page contenu (Frame 652)
   ========================================================= */

/* Le contenu principal du type "page" est actuellement rendu dans la region
   "sidebar_first" (layout 2 colonnes Bartik heritee), pas "content" - CAIH-30
   doit restructurer cela proprement. En attendant, on redonne au type "page"
   toute la largeur de page pour que le hero soit fidele a la maquette. */
body.page-node-type-page .layout-sidebar-first {
  width: 100%;
  float: none;
  margin: 0;
}
body.page-node-type-page .region-sidebar-first {
  width: 100%;
  float: none;
  padding: 0;
}
body.page-node-type-page .layout-sidebar-second {
  display: none;
}
.node--type-page > .node__content {
  /* 1312px -> 1800px : le wrapper #block-asco-theme-content est desormais
     plafonne a 1800px (ci-dessus) sur grand ecran, cette colonne de texte
     restait a 1312px et sous-utilisait l'espace disponible - retour
     utilisateur avec capture grand ecran. */
  max-width: 1800px;
  margin: 0 auto;
  padding: 40px 100px 60px;
  box-sizing: border-box;
}

@media (max-width: 768px) {
  .node--type-page > .node__content {
    padding: 24px 20px 40px;
  }
}

/* --- Fil d'ariane --- */
.region-breadcrumb {
  /* 1512px -> 1800px : meme plafond que le reste de la page sur grand
     ecran (retour utilisateur, iso header/.hero-page-contenu/.page-body-layout). */
  max-width: 1800px;
  margin: 0 auto;
  padding: 20px 100px 0;
  box-sizing: border-box;
}
#block-filarianecaih .breadcrumb h2 {
  position: absolute;
  width: 1px;
  height: 1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
}
#block-filarianecaih .breadcrumb ol {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-style: normal;
  text-align: left;
}
#block-filarianecaih .breadcrumb li {
  display: inline-flex;
  align-items: center;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: normal;
  color: #020305;
}
#block-filarianecaih .breadcrumb li a {
  color: #020305;
  text-decoration: none;
}
#block-filarianecaih .breadcrumb li a:hover {
  text-decoration: underline;
}
#block-filarianecaih .breadcrumb li:not(:first-child)::before {
  content: '';
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  background: url('../images/icons/caret-right.svg') center / 8px 14px no-repeat;
  flex: 0 0 auto;
}

/* --- Bandeau hero --- */
.hero-page-contenu {
  /* 1512px -> 1800px (retour utilisateur : 1800 pas 1700) - meme plafond
     que le header (body:not(.path-frontpage) .region-header) et
     .page-body-layout sur grand ecran. */
  max-width: 1800px;
  margin: 30px auto 66.31px;
  padding: 0 100px;
  box-sizing: border-box;
}
.hero-page-contenu__card {
  position: relative;
  height: 510.35px;
  border-radius: 16px;
  background: #2d3f86;
  overflow: visible;
}
.hero-page-contenu__content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  height: 100%;
  gap: 39.3px;
}
/* CAIH-51 : 50/50 explicite (demande utilisateur) - flex:1 1 0% sur les deux
   colonnes partage l'espace disponible a parts strictement egales, a toute
   largeur d'ecran. Le padding-left vivait avant sur le CONTENEUR (avant les
   2 colonnes) : ca ajoutait une zone bleue morte devant le texte qui n'etait
   pas comptee dans le partage flex, rendant la moitie "texte" visuellement
   plus large que l'image malgre des colonnes de largeur egale. Deplacer le
   padding directement sur .text (meme avec box-sizing:border-box) faussait
   encore le partage flex (verifie empiriquement, ecart exactement egal au
   padding, 66.5px, quelle que soit la largeur) - le padding vit donc sur les
   ENFANTS de .text (jamais sur l'item flex lui-meme) pour que la limite
   bleu/image tombe exactement au milieu de la carte, prouve a 3 largeurs. */
.hero-page-contenu__text {
  flex: 1 1 0%;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.hero-page-contenu__text-inner {
  display: flex;
  flex-direction: column;
  gap: 20px;
  padding-left: 66.53px;
}
.hero-page-contenu__cta {
  padding-left: 66.53px;
}
.hero-page-contenu__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 40.185px;
  line-height: 48.222px;
  color: #ffffff;
}
.hero-page-contenu__desc {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 18.083px;
  line-height: 27px;
  color: #ffffff;
}
.hero-page-contenu__cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 30px;
  background: #ffffff;
  border: 1px solid #ffffff;
  box-sizing: border-box;
  color: #2d3f86;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: 24px;
  text-decoration: none;
  white-space: nowrap;
}
.hero-page-contenu__image {
  position: relative;
  flex: 1 1 0%;
  align-self: stretch;
  height: 100%;
  border-radius: 0 16px 16px 0;
  overflow: hidden;
}
.hero-page-contenu__image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 510.35px;
  /* Image recadree en 4:3 (mode media recadrage_4_3) : cover pour remplir
     le cadre (hauteur fixe, largeur variable) sans deformation - fill
     etirait l'image. */
  object-fit: cover;
}
.hero-page-contenu__deco {
  position: absolute;
  display: block;
  background: #ffffff33;
  pointer-events: none;
}
.hero-page-contenu__deco--corner {
  left: 246.14px;
  top: -120.56px;
  width: 82.93px;
  height: 82.93px;
  opacity: 0.8;
  z-index: 1;
}
.hero-page-contenu__deco--g1-a { left: 553.78px; top: 213px; width: 60.43px; height: 60.43px; z-index: 3; }
.hero-page-contenu__deco--g1-b { left: 458.78px; top: 331.28px; width: 60.43px; height: 60.43px; z-index: 3; }
.hero-page-contenu__deco--g1-c { left: 353px; top: 449.57px; width: 60.43px; height: 60.43px; z-index: 3; }
.hero-page-contenu__deco--g2-a { left: 162.78px; top: -32px; width: 60.43px; height: 60.43px; z-index: 3; }
.hero-page-contenu__deco--g2-b { left: 67.78px; top: 86.28px; width: 60.43px; height: 60.43px; z-index: 3; }
.hero-page-contenu__deco--g2-c { left: -38px; top: 204.57px; width: 60.43px; height: 60.43px; z-index: 3; }
.hero-page-contenu .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* =========================================================
   CAIH-31 : Bandeau hero template article (Frame 912 / 2109:6109)
   ========================================================= */
.hero-article {
  /* Bandeau plein-largeur (bord a bord) iso maquette : width:100vw +
     margin:calc(50% - 50vw) restaure (retour utilisateur, le voulait bord
     a bord sur grand ecran) - le debordement de quelques px du a 100vw
     incluant la largeur de la scrollbar verticale (scrollbar classique
     non-overlay, Windows/Chrome) est desormais neutralise par
     overflow-x:hidden sur body plutot qu'en sacrifiant le plein-largeur. */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
  background: #006cd20d;
  /* 1440px -> 1800px dans le calc : le contenu de page en dessous
     (.article-body-layout) est maintenant plafonne a 1800px, iso le reste
     de la page (header/.hero-page-contenu/.page-body-layout) - cette
     formule figeait encore le contenu du hero a 1240px (1440-200) sur
     grand ecran, desaligne du reste de la page. */
  padding: 50px max(100px, calc((100vw - 1800px) / 2 + 100px));
  display: flex;
  align-items: center;
  gap: 77px;
  font-style: normal;
}
.hero-article__text {
  flex: 0 0 661px;
  width: 661px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.hero-article__text-inner {
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.hero-article__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  color: #000000;
}
.hero-article__date {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 16px;
  color: #000000;
}
.hero-article__chapo {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: 27px;
  color: #000000;
}
.hero-article__image {
  /* CAIH-42 puis retour recette (2026-09) : l'image en position:absolute +
     height:100% s'appuyait sur une hauteur de pourcentage qui ne se resout
     pas de facon fiable quand ce conteneur tire sa propre hauteur d'un
     align-self:stretch (empiriquement : hauteur d'image a 0 sur une page ou
     le texte du hero est court, alors que l'image est bien chargee -
     naturalWidth/Height corrects). Teste aussi inset:0 seul (retombe sur la
     taille intrinseque du fichier, container ignore) et inset+100% combines
     (toujours 0). display:grid sur le conteneur + l'image en enfant de
     grille standard (pas absolute, pas de pourcentage) est le seul reglage
     qui a fiabilise le remplissage sur les deux pages testees : un item de
     grille s'etire par defaut (stretch) sans dependre d'une hauteur en %. */
  position: relative;
  display: grid;
  grid-template-rows: 100%;
  flex: 1 1 auto;
  align-self: stretch;
  min-height: 411px;
  border-radius: 16px;
  overflow: hidden;
}
/* Le champ media est rendu par Drupal avec plusieurs wrappers imbriques
   entre .hero-article__image et l'img (.field > .ligne > article.media >
   .field > .ligne > img) - chacun doit propager 100% de hauteur pour que
   l'img (grid stretch sur le 1er niveau seulement) atteigne bien le bas du
   conteneur, sinon elle se dimensionne sur son propre ratio naturel et
   laisse un espace vide non arrondi sous l'image (constate : 539px reels
   vs 581px de conteneur, gap explique par le ratio 800/500 applique a la
   largeur plutot que par la hauteur du conteneur). */
.hero-article__image > * {
  height: 100%;
}
.hero-article__image .field,
.hero-article__image .ligne,
.hero-article__image article.media {
  height: 100%;
}
.hero-article__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.hero-article .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* =========================================================
   CAIH-30 : Contenu principal + sidebar CTA (Frame 657 / 2342:340)
   ========================================================= */
.page-body-layout {
  display: grid;
  grid-template-columns: 310px 1fr;
  grid-template-areas: "sidebar content";
  column-gap: 81.375px;
  align-content: start;
  max-width: 1512px;
  margin: 0 auto;
  padding: 0 100px 60px;
  box-sizing: border-box;
}
@media all and (min-width: 992px) {
  /* 1512px -> 1800px : meme plafond que .path-frontpage .page-body-layout
     (ligne ~1886) pour les pages de contenu standard (hors accueil) -
     retour utilisateur avec DOM+capture grand ecran. Place ICI (apres la
     regle de base, meme specificite) pour gagner la cascade a l'ordre des
     regles - un ajout equivalent plus haut dans le fichier perdait contre
     cette regle de base malgre min-width:992px (meme bug que rencontre
     sur le footer plus tot dans la session). */
  .page-body-layout {
    max-width: 1800px;
  }
}
/* Sommaire + blocs CTA fusionnes dans UNE seule zone de grille (comme le Frame 698
   Figma, une seule colonne) : avant, le span de .page-body-layout__content sur 2
   lignes auto faisait que le navigateur dimensionnait la ligne "sommaire" bien plus
   haute que son contenu reel (jusqu'a 2x), creant un grand vide avant les CTA et
   desynchronisant le comportement sticky des deux blocs au scroll. */
.page-body-layout__sidebar {
  grid-area: sidebar;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 50.23px;
  position: sticky;
  top: 20px;
  align-self: start;
}
.page-body-layout__ctas {
  min-width: 0;
}
.page-body-layout__ctas > .field--name-field-sidebar-cta > .field__item + .field__item {
  margin-top: 50.23px;
}
.page-body-layout__content {
  grid-area: content;
  padding: 0;
  min-width: 0;
}
.page-body-layout__content--full {
  grid-column: 1 / -1;
}

/* Carte generique (sommaire + blocs CTA) */
.sommaire-liens,
.paragraph--type--bloc-cta {
  background: #006cd20d;
  border-radius: 16.07px;
  padding: 25.12px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 24.11px;
}
.sommaire-liens__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14.06px;
  line-height: 21.1px;
  color: #000000;
}
/* .sommaire-liens__list (CAIH-30, genere automatiquement depuis les titres
   du corps modulaire) partage exactement le style de .field--name-field-
   sommaire-liens (liens manuels/externes) - les deux peuvent cohabiter dans
   la meme boite "Sur cette page". */
.sommaire-liens .field--name-field-sommaire-liens,
.sommaire-liens__list {
  display: flex;
  flex-direction: column;
  gap: 16.07px;
}
.sommaire-liens .field--name-field-sommaire-liens + .field--name-field-sommaire-liens,
.sommaire-liens__list + .field--name-field-sommaire-liens {
  margin-top: 16.07px;
}
.sommaire-liens .field--name-field-sommaire-liens .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}
.sommaire-liens .field--name-field-sommaire-liens a,
.sommaire-liens__list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8.04px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16.07px;
  line-height: 16.07px;
  color: #000000;
  text-decoration: none;
}
/* CAIH-50 : le chevron etait rendu en noir (caret-right.svg) au lieu de
   l'accent bleu de la maquette (Figma "CaretRight", CTA Text 2342:347/348/
   349) - le fichier caret-right-blue.svg existait deja dans le theme mais
   n'etait pas branche ici.
   Pas de puce avant le libelle : le "Square" de la maquette (2342:344, cf.
   node fille "Square") a la propriete de composant "show Icon left"
   desactivee (visible=false cote API Figma) - verifie que ce n'est pas un
   ecart, l'icone n'existe pas dans le rendu reel. */
.sommaire-liens__list a::after {
  content: '';
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  background: url('../images/icons/caret-right-blue.svg') center / 20px 30px no-repeat;
}
/* CAIH-50 : variante "Decouvrir UniHA" (field_sommaire_liens, Colonne
   2342:350) - couleur et chevron distincts du reste du sommaire (accent
   rose #bd3f7a au lieu du bleu #006cd2), fidele a la maquette. La police
   Figma (Sofia Pro 500) n'est ni chargee ni auto-hebergee dans ce projet
   (aucun fichier .woff/.ttf, aucun import Google Fonts) - conservee en
   Poppins herite, ecart documente plutot que maquille (police a fournir
   par le design pour fermer cet ecart). */
.sommaire-liens .field--name-field-sommaire-liens a {
  color: #161829;
}
.sommaire-liens .field--name-field-sommaire-liens a::after {
  content: '';
  flex: 0 0 20px;
  width: 20px;
  height: 20px;
  background: url('../images/icons/caret-right-pink.svg') center / 20px 30px no-repeat;
}

/* Bloc CTA (paragraph) */
.paragraph--type--bloc-cta {
  display: flex;
  flex-direction: column;
  gap: 24.11px;
}
/* Variante avec field_bloc_cta_texte (ex. "Nous contacter", Colonne 2342:356) : gap
   interne plus resserre que la variante titre+lien seul (24.11px) - mesure Figma
   exacte titre->texte et texte->lien = 14.06px, pas le meme gap que le bloc sans texte. */
.paragraph--type--bloc-cta:has(.field--name-field-bloc-cta-texte) {
  gap: 14.06px;
}
.paragraph--type--bloc-cta .field--name-field-bloc-cta-titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 20.09px;
  line-height: 26.12px;
  color: #000000;
}
.paragraph--type--bloc-cta .field--name-field-bloc-cta-texte {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16.07px;
  line-height: normal;
  color: #000000;
}
.paragraph--type--bloc-cta .field--name-field-bloc-cta-lien a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  padding: 12px 22px;
  border-radius: 30.14px;
  background: #006cd2;
  border: 1.0046296119689941px solid #006cd2;
  box-sizing: border-box;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24.11px;
  text-decoration: none;
}
.paragraph--type--bloc-cta .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* Restylage du corps de contenu existant (titres de section) : ciblait
   ".page-body-layout__content h3" a l'origine, mais les titres de
   paragraphes (field_ts_titre, field_encart_titre...) sont rendus en
   simples <div>, jamais en <h3> - meme cause que le sommaire mort
   (CAIH-30). Valeurs Figma (2109:4002 et jumeaux 2342:364/368/371/374)
   deja correctes (800/24px), seul le selecteur etait faux. Scope a ce
   contexte de page uniquement : ces memes paragraphes sont reutilises
   ailleurs (homepage, marche...) avec potentiellement un autre style.
   "En lire plus" (Clausier de securite numerique) : lien insere a la
   main dans le texte riche, heritait du bleu lien global au lieu du
   #2d3f86/600 attendu. */
.page-body-layout__content .paragraph--type--texte-simple .field--name-field-ts-titre,
.page-body-layout__content .paragraph--type--encart-mise-en-avant .field--name-field-encart-titre,
.page-body-layout__content .paragraph--type--bandeau-cta .field--name-field-bcta-titre,
.page-body-layout__content .paragraph--type--video .field--name-field-video-titre,
.page-body-layout__content .field--name-field-ms-titre,
.page-body-layout__content .field--name-field-as-titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: 24px;
  line-height: normal;
  color: #000000;
  margin: 0 0 24.11px;
}
/* a[href] : les ancres CKEditor (<a id> sans href, module anchor_link)
   ne sont pas des liens et gardent le style du texte (retour recette). */
.text-formatted a:not([href]) {
  color: inherit;
  font-weight: inherit;
}
.page-body-layout__content .field--name-field-ts-texte a[href] {
  color: #2d3f86;
  font-weight: 600;
}
/* Video YouTube embarquee en iframe width/height fixes (560x315, non responsive
   par defaut) -> se met a l'echelle du conteneur en conservant le ratio 16:9 */
.page-body-layout__content iframe {
  max-width: 100%;
  aspect-ratio: 560 / 315;
  height: auto;
}

@media (max-width: 992px) {
  .page-body-layout {
    grid-template-columns: 1fr;
    grid-template-areas:
      "sommaire"
      "content"
      "ctas";
    padding: 0 20px 40px;
    row-gap: 32px;
  }
  /* Deballe le wrapper desktop pour retrouver l'ordre mobile de la maquette
     (Figma 2181:4865) : sommaire juste apres le hero, CTA juste avant le
     footer - sommaire.liens et .page-body-layout__ctas redeviennent des
     items de grille independants au lieu de rester groupes. */
  .page-body-layout__sidebar {
    display: contents;
  }
  .sommaire-liens {
    grid-area: sommaire;
  }
  .page-body-layout__ctas {
    grid-area: ctas;
  }
  .page-body-layout__content {
    grid-row: auto;
  }
}

/* =========================================================
   CAIH-33 : Bandeau hero template evenement (Frame 912 / 2268:3180)
   ========================================================= */
.hero-evenement {
  /* Bandeau plein-largeur (bord a bord) iso maquette : width:100vw +
     margin:calc(50% - 50vw) restaure, meme pattern que .hero-article
     ci-dessus - le debordement du a 100vw (largeur scrollbar verticale
     incluse) est neutralise par overflow-x:hidden sur body. */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  box-sizing: border-box;
  background: #006cd20d;
  /* 1440px -> 1800px : suit .hero-article ci-dessus, le contenu de page
     en dessous (.agenda-body-layout) est maintenant plafonne a 1800px. */
  padding: 50px max(100px, calc((100vw - 1800px) / 2 + 100px));
  display: flex;
  align-items: center;
  gap: 77px;
  font-style: normal;
}
.hero-evenement .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}
.hero-evenement__text {
  flex: 0 0 661px;
  width: 661px;
  display: flex;
  flex-direction: column;
  gap: 30px;
}
.hero-evenement__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  color: #000000;
}
.hero-evenement__chapo {
  margin-top: 15px;
}
.hero-evenement__chapo .field--name-field-description {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 500 !important;
  font-size: 18px !important;
  line-height: 27px !important;
  color: #000000 !important;
  margin-bottom: 0 !important;
  width: auto !important;
}
.hero-evenement__card {
  background: #fbfbfb;
  border-radius: 16px;
  padding: 20px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.hero-evenement__infos {
  display: flex;
  gap: 20px;
}
.hero-evenement__info {
  flex: 1 1 0;
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.hero-evenement__icon {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.hero-evenement__icon--calendar { background-image: url('../images/icons/calendar.svg'); }
.hero-evenement__icon--building { background-image: url('../images/icons/building.svg'); }
.hero-evenement__icon--pin { background-image: url('../images/icons/map-pin.svg'); }
.hero-evenement__info-text {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.hero-evenement__info-label {
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: normal;
  color: #020305;
}
.hero-evenement__info-value {
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 14px;
  line-height: normal;
  color: #020305;
}
/* Bug reel (CAIH-43, verification mecanisee /kamal, Figma node 2272:4003/
   2272:3508) : le wrapper .hero-evenement__cta est un simple <div> bloc
   sans regle CSS - il contenait un <a> inline-flex, qui participe au
   contexte de mise en forme EN LIGNE du parent et heritait donc de son
   espace de ligne/descendant (line-height du body), ajoutant ~20px de
   hauteur fantome au-dessus/en-dessous du bouton (mesure : 70px de div
   pour un lien de 50px). display:flex sur le wrapper le sort du contexte
   inline et supprime cet espace. Le vrai parent inline direct du <a> n'est
   pas .hero-evenement__cta mais le wrapper Drupal .field > .ligne imbrique
   dedans (structure de champ standard du theme) - display:flex doit cibler
   ce niveau precis, pas le wrapper personnalise. Second residu trouve : le
   wrapper .field herite d'une marge globale (20px en haut/a droite, hors
   theme) qui, en tant qu'item flex, s'ajoute a la hauteur du conteneur
   (44+20=64 mesure) - neutralisee ici. */
.hero-evenement__cta {
  display: flex;
}
.hero-evenement__cta .field {
  margin: 0;
}
.hero-evenement__cta .ligne {
  display: flex;
}
.hero-evenement__cta a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border-radius: 30px;
  background: #006cd2;
  border: 1px solid #006cd2;
  box-sizing: border-box;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  /* Hauteur fixe 44px (Figma Frame 2272:4003, cadre a taille figee, pas
     "hug contents") - line-height 24px + padding 12/12 + bordure 1/1 en
     border-box donnait 50px (mesure), 6px de trop vs le Figma. */
  height: 44px;
  line-height: 24px;
  text-decoration: none;
}
.hero-evenement__image {
  position: relative;
  flex: 1 1 auto;
  align-self: stretch;
  min-height: 411px;
  border-radius: 16px;
  overflow: hidden;
}
.hero-evenement__image img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 411px;
  object-fit: cover;
}

@media (max-width: 768px) {
  .hero-evenement {
    flex-direction: column;
    align-items: stretch;
    padding: 20px;
    gap: 24px;
  }
  .hero-evenement__text {
    flex: 0 0 auto;
    width: auto;
    gap: 20px;
  }
  .hero-evenement__title {
    font-size: 30px;
    line-height: 42px;
  }
  .hero-evenement__infos {
    flex-direction: column;
    gap: 16px;
  }
  .hero-evenement__cta a {
    width: 100%;
  }
  .hero-evenement__image {
    flex: 0 0 257px;
  }
  .hero-evenement__image img {
    height: 257px;
  }
}

@media (max-width: 768px) {
  .hero-article {
    flex-direction: column;
    align-items: stretch;
    padding: 20px;
    background: #3399cc0d;
    gap: 32px;
  }
  .hero-article__text {
    flex: 0 0 auto;
    width: auto;
  }
  .hero-article__title {
    font-size: 30px;
    line-height: 42px;
  }
  .hero-article__image {
    flex: 0 0 257px;
  }
  .hero-article__image img {
    height: 257px;
  }
}

@media (max-width: 768px) {
  .region-breadcrumb {
    padding: 20px 20px 0;
  }
  #block-filarianecaih .breadcrumb ol {
    gap: 4px;
  }
  #block-filarianecaih .breadcrumb li:not(:first-child)::before {
    margin-right: 4px;
  }

  .hero-page-contenu {
    padding: 0;
    margin-bottom: 34px;
  }
  .hero-page-contenu__card {
    height: auto;
    overflow: visible;
  }
  .hero-page-contenu__content {
    flex-direction: column;
    align-items: stretch;
    height: auto;
    padding: 65.92px 20px 0;
    gap: 0;
  }
  .hero-page-contenu__text {
    flex: 0 0 auto;
    width: auto;
  }
  .hero-page-contenu__text-inner,
  .hero-page-contenu__cta {
    padding-left: 0;
  }
  .hero-page-contenu__title {
    font-size: 30px;
  }
  .hero-page-contenu__cta a {
    width: 100%;
    border-color: #2d3f86;
  }
  .hero-page-contenu__image {
    order: 2;
    flex: 0 0 340px;
    align-self: auto;
    height: 340px;
    width: calc(100% + 40px);
    margin: 56px -20px 0;
    border-radius: 0 0 16px 16px;
  }
  .hero-page-contenu__image img {
    height: 340px;
  }
  .hero-page-contenu__deco--g1-a,
  .hero-page-contenu__deco--g1-b,
  .hero-page-contenu__deco--g1-c,
  .hero-page-contenu__deco--g2-a,
  .hero-page-contenu__deco--g2-b,
  .hero-page-contenu__deco--g2-c {
    display: none;
  }
}

/* =========================================================
   CAIH-32 : Corps modulaire article (Frame 701 / 2109:4108)
   ========================================================= */

/* --- Layout 2 colonnes (sidebar info + corps modulaire) --- */
.article-body-layout {
  display: grid;
  /* CAIH-42 : colonne de contenu fixee a 921px (iso Figma Frame 701/696 du
     template article, 310+81(gap)+921=1312, meme largeur que le bandeau
     hero/header) au lieu de 1fr qui etirait le contenu jusqu'au plafond
     1800px de ce conteneur - retour de recette demandant une grille
     resserree, confirme par mesure directe du fichier Figma. */
  grid-template-columns: 310px 921px;
  grid-template-areas: "info content";
  column-gap: 81px;
  align-content: start;
  /* 1512px -> 1800px : meme plafond que .page-body-layout/.marche-bas-de-page
     sur grand ecran (retour utilisateur). */
  max-width: 1800px;
  margin: 0 auto;
  padding: 60px 100px;
  box-sizing: border-box;
}
.article-body-layout__info {
  grid-area: info;
  min-width: 0;
  position: sticky;
  top: 20px;
  align-self: start;
}
.article-body-layout__content {
  grid-area: content;
  grid-row: 1;
  min-width: 0;
  padding: 0;
}
/* CAIH-33/34 : regle legacy ".node--type-article .node__content > div"
   (layout article pre-refonte, "groupe"/field-description-longue) matche
   sans le vouloir le nouveau wrapper field_corps_modulaire (lui aussi un
   div enfant direct de .node__content) et lui impose display:flex;width:45% -
   chaque paragraphe se retrouve ecrase dans une colonne etroite (largeurs
   erratiques 135-210px constatees), texte compresse sur une hauteur
   demesuree. Neutralise specifiquement pour ce wrapper (3 classes, plus
   specifique que le legacy 2 classes + type). */
.node--type-article .node__content > .field--name-field-corps-modulaire {
  display: block;
  width: 100%;
}
/* CAIH-42 : meme famille de bug que le fix CAIH-33/34 juste au-dessus, sur
   un autre element - .article-body-layout__content porte AUSSI la classe
   node__content (memes classes sur le meme <div>, cf node--article--full
   twig), donc la regle legacy ".node--type-article .node__content"
   (display:flex, max-width:100%, padding:50px 30px, iso ancienne grille
   actualites) s'appliquait directement dessus et ecrasait la largeur fixee
   par la grille (310px 921px ci-dessus) - vu en mesurant le rendu reel
   (921px attendus, 448px constates). Meme specificite (2 classes) que la
   regle legacy, place apres elle dans le fichier pour gagner la cascade. */
.node--type-article .article-body-layout__content {
  display: block;
  width: 100%;
  max-width: none;
  padding: 0;
}
.article-body-layout__content--full {
  grid-column: 1 / -1;
}
/* Retour recette (point 4.2.1) : la variante --full (sans sidebar "infos
   importantes", desormais toujours le cas sur les articles - cf. twig)
   s'etirait a pleine grille (1312px, 310+81+921) au lieu de rester a 921px
   centre, contrairement a la meme colonne sur le template evenement/agenda
   (CAIH-44, .agenda-body-layout .article-body-layout__content). Meme
   specificite que ".node--type-article .article-body-layout__content"
   ci-dessus (qui pose max-width:none) + place apres elle pour gagner la
   cascade a specificite egale. */
.node--type-article .article-body-layout__content--full {
  max-width: 921px;
  margin: 0 auto;
}
/* Sans colonne "infos importantes", la grille 310px + 81px + 921px restait
   en place et calee a gauche : la colonne 921px etait centree dans ces
   1312px et non dans la page (decalee a droite, debordement sous ~1310px).
   Sans sidebar, plus de grille : le margin auto ci-dessus centre dans la
   page. */
.article-body-layout--full {
  display: block;
}
/* CAIH-33 : corps modulaire agenda - colonne unique CENTREE (pas de sidebar
   "infos importantes" comme pour l'article - Figma Frame 701 / 2268:3262
   centre la colonne 921px dans l'espace disponible, ne la cale pas a gauche
   comme le ferait la grille 2 colonnes de l'article). */
.agenda-body-layout {
  /* 1512px -> 1800px : meme plafond que le reste de la page sur grand
     ecran (retour utilisateur). */
  max-width: 1800px;
  margin: 0 auto;
  padding: 60px 100px;
  box-sizing: border-box;
}
/* CAIH-44 : la largeur plafonnee avait ete retiree ci-dessus (retour
   utilisateur passe, "paragraphes trop etroits sur grand ecran"). Le
   cahier de recette suivant redemande explicitement le resserrement iso
   Figma (confirme par mesure directe : Frame 701/696 du template
   evenement, 921px centre) - remis en place sur confirmation explicite. */
.agenda-body-layout .article-body-layout__content {
  max-width: 921px;
  margin: 0 auto;
}
@media (max-width: 992px) {
  .agenda-body-layout {
    padding: 32px 20px;
  }
}
/* Gap entre paragraphes de field_corps_modulaire - regle GENERIQUE (pas
   scopee a .article-body-layout__content) : ce champ est reutilisable sur
   n'importe quel type de contenu (page, article, agenda...), le gap doit
   s'appliquer partout ou il est rendu, pas seulement sur le layout article. */
.field--name-field-corps-modulaire > .field__item + .field__item {
  margin-top: 48px;
}
/* CAIH-23/24/25/26 : sur l'accueil, l'ecart mesure en Figma entre chaque
   paragraphe homepage (marches -> bannieres -> actualites -> chiffres,
   Frame 892) est de 100px partout, pas le 48px generique sitewide. */
.path-frontpage .field--name-field-corps-modulaire > .field__item + .field__item {
  margin-top: 100px;
}
.article-body-layout__content .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

/* --- Sidebar "Informations importantes" --- */
.infos-importantes {
  background: #006cd20d;
  border: 1.0046296119689941px solid #2d3f86;
  border-radius: 16.07px;
  padding: 25.12px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 24.11px;
}
.infos-importantes__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 20px;
  line-height: 26px;
  color: #020305;
}
.infos-importantes__items {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.infos-importantes__item {
  display: flex;
  align-items: flex-start;
  gap: 8px;
}
.infos-importantes__icon {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.infos-importantes__icon--budget { background-image: url('../images/icons/hand-coins.svg'); }
.infos-importantes__icon--duree { background-image: url('../images/icons/calendar.svg'); }
.infos-importantes__icon--cloture { background-image: url('../images/icons/clock-alert.svg'); }
.infos-importantes__label {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 18px;
  line-height: normal;
  color: #020305;
}
.infos-importantes__value {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 300;
  font-size: 14px;
  line-height: normal;
  color: #020305;
}

@media (max-width: 992px) {
  .article-body-layout {
    grid-template-columns: 1fr;
    grid-template-areas:
      "info"
      "content";
    padding: 32px 20px;
    row-gap: 32px;
  }
  .article-body-layout__info {
    position: static;
    top: auto;
  }
  .article-body-layout__content {
    grid-row: auto;
  }
  .infos-importantes {
    background: #3399cc0d;
    border-color: #3399cc;
  }
  .infos-importantes__icon--budget,
  .infos-importantes__icon--duree,
  .infos-importantes__icon--cloture {
    filter: none;
  }
}

/* --- Paragraph : texte_simple --- */
.paragraph--type--texte-simple .field--name-field-ts-titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
  margin-bottom: 24px;
}
.paragraph--type--texte-simple .field--name-field-ts-texte {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #000000;
}
.paragraph--type--texte-simple .field--name-field-ts-texte ul {
  margin: 0;
  padding-left: 20px;
}

/* --- Paragraph : video --- */
.paragraph--type--video .field--name-field-video-titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
  margin-bottom: 24px;
}
.paragraph--type--video .field--name-field-video-media iframe {
  width: 100%;
  aspect-ratio: 560 / 315;
  height: auto;
}

/* --- Paragraph : encart_mise_en_avant --- */
.paragraph--type--encart-mise-en-avant {
  background: #006cd20d;
  border: 1px solid #2d3f86;
  border-radius: 16px;
  padding: 20px;
  box-sizing: border-box;
}
.paragraph--type--encart-mise-en-avant .field--name-field-encart-titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
  margin-bottom: 24px;
}
.paragraph--type--encart-mise-en-avant .field--name-field-encart-texte {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #000000;
}
.paragraph--type--encart-mise-en-avant .field--name-field-encart-texte ul {
  margin: 0;
  padding-left: 20px;
}

/* CAIH-42 : mise en forme des liens hypertexte dans le contenu actu - meme
   couleur/graisse que le pattern deja etabli ailleurs (#2d3f86/600, cf
   .page-body-layout__content .field--name-field-ts-texte a ci-dessus),
   qui manquait dans ce contexte article (liens en bleu navigateur par
   defaut). Pas de valeur Figma verifiee pour les citations (blockquote) -
   laisse en l'etat, a traiter une fois l'acces Figma disponible. */
.article-body-layout__content .field--name-field-ts-texte a[href],
.article-body-layout__content .field--name-field-encart-texte a[href] {
  color: #2d3f86;
  font-weight: 600;
}

/* --- Paragraph : image_pleine_largeur --- */
.paragraph--type--image-pleine-largeur img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 8px;
}

/* --- Paragraph : grille_images --- */
.paragraph--type--grille-images .field--name-field-gi-images {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
.paragraph--type--grille-images .field--name-field-gi-images img {
  /* Retour recette (4.2.4) : recadrage reel (module Crop) au lieu d'un
     object-fit:cover force sur une hauteur arbitraire (300px) qui
     ecrasait le cadrage choisi par l'editeur. Le ratio est desormais
     choisi par l'editeur (field_tia_ratio, meme ratio pour toutes les
     images du paragraphe = "meme hauteur") - plus de aspect-ratio fixe
     en CSS, la forme vient du recadrage serveur (Crop). object-fit:cover
     reste un filet de securite si jamais le fichier sert sans recadrage. */
  display: block;
  width: 100%;
  border-radius: 8px;
}
.paragraph--type--grille-images .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}

@media (max-width: 992px) {
  .paragraph--type--grille-images .field--name-field-gi-images {
    grid-template-columns: 1fr;
  }
}

/* --- Paragraph : bandeau_cta --- */
.paragraph--type--bandeau-cta {
  position: relative;
  overflow: hidden;
  background: #2d3f86;
  border-radius: 8px;
  padding: 30px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.paragraph--type--bandeau-cta .field--name-field-bcta-titre {
  position: relative;
  z-index: 1;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #ffffff;
}
.paragraph--type--bandeau-cta .field--name-field-bcta-texte {
  position: relative;
  z-index: 1;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: normal;
  color: #ffffff;
}
.paragraph--type--bandeau-cta .field--name-field-bcta-lien a {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 12px 22px;
  border-radius: 30px;
  background: #ffffff;
  border: 1px solid #ffffff;
  box-sizing: border-box;
  color: #2d3f86;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  text-decoration: none;
}
.paragraph--type--bandeau-cta__deco {
  position: absolute;
  display: block;
  width: 60.43px;
  height: 60.43px;
  background: #ffffff33;
  pointer-events: none;
  z-index: 0;
}
/* Ancrage bas-droite (pas haut-gauche) : sur un texte editorial reel plus
   long que le texte court du Figma, la carte grandit en hauteur - un ancrage
   top/left fige la cascade pres du haut d'une carte devenue haute (carres
   perdus loin du bas). Ancrer depuis right/bottom avec les MEMES distances
   au coin bas-droit mesurees sur le Figma (node 2268:3307) garde la cascade
   collee au coin bas-droit quelle que soit la hauteur reelle de la carte -
   CAIH-42 (carres "doivent etre a droite de l'encadre"). */
.paragraph--type--bandeau-cta__deco--a { right: 191.1px; bottom: 207.6px; }
.paragraph--type--bandeau-cta__deco--b { right: 96.1px; bottom: 89.3px; }
.paragraph--type--bandeau-cta__deco--c { right: -9.6px; bottom: -29px; }

@media (max-width: 992px) {
  .paragraph--type--bandeau-cta {
    margin-left: -20px;
    margin-right: -20px;
    width: calc(100% + 40px);
    padding: 20px;
    border-radius: 0;
  }
  /* Non reconverti en right/bottom : ces valeurs mobiles ne sont pas issues
     d'une extraction Figma dans cette session (pas de frame mobile fournie),
     hors perimetre de cette verification desktop - laissees telles quelles. */
  .paragraph--type--bandeau-cta__deco--a { left: 201px; top: -24.38px; }
  .paragraph--type--bandeau-cta__deco--b { left: 282px; top: 76.47px; }
  .paragraph--type--bandeau-cta__deco--c { left: 372.19px; top: 177.32px; }
}

/* =========================================================
   CAIH-25b : Section texte + image alterne (Frame 715 / 2256:5574)
   ========================================================= */
.paragraph--type--section-texte-image-alterne {
  display: flex;
  flex-direction: column;
  gap: 50px;
}
.paragraph--type--section-texte-image-alterne .field--name-field-stia-titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: normal;
  color: #000000;
}
.paragraph--type--section-texte-image-alterne .field--name-field-stia-items {
  display: flex;
  flex-direction: column;
  gap: 50px;
}

/* --- Paragraph : texte_image_alterne (item de la section ci-dessus) --- */
.paragraph--type--texte-image-alterne {
  display: flex;
  align-items: stretch;
  gap: 32px;
}
.paragraph--type--texte-image-alterne.position--droite {
  flex-direction: row-reverse;
}
.paragraph--type--texte-image-alterne.position--gauche {
  flex-direction: row;
}
.paragraph--type--texte-image-alterne__image {
  flex: 0 0 393px;
  min-width: 0;
}
/* CAIH-25b : l'<img> est enfoui dans une chaine de wrappers Drupal
   (.field > .ligne > article.media > .field > .ligne) tous en height:auto -
   un height:100% pose seulement sur l'<img> ne se resout contre aucune
   hauteur explicite (percentage height require une containing block a
   hauteur explicite a CHAQUE niveau). Propage height:100% sur toute la
   chaine pour que __image (hauteur fixee par align-items:stretch du flex
   parent, meme hauteur que la carte a cote) se transmette jusqu'a l'image. */
.paragraph--type--texte-image-alterne__image .field,
.paragraph--type--texte-image-alterne__image .ligne,
.paragraph--type--texte-image-alterne__image article.media {
  height: 100%;
}
.paragraph--type--texte-image-alterne__image img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 275px;
  object-fit: cover;
  border-radius: 16px;
}
.paragraph--type--texte-image-alterne__card {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 8px;
  padding: 40px;
  box-sizing: border-box;
  border-radius: 16px;
  background: #2d3f860d;
  border: 1px solid #2d3f86;
}
/* CAIH-47 : variante "texte seul" (pas d'image, Figma Frame 708/2253:2867) -
   plein largeur, sans le cadre/fond de la carte (absent de cette variante
   dans la maquette, uniquement les styles titre/texte deja existants). */
.paragraph--type--texte-image-alterne--no-image {
  display: block;
}
.paragraph--type--texte-image-alterne--no-image .paragraph--type--texte-image-alterne__card {
  padding: 0;
  border: none;
  background: none;
  border-radius: 0;
}
.paragraph--type--texte-image-alterne .field--name-field-tia-titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
}
.paragraph--type--texte-image-alterne .field--name-field-tia-texte {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: normal;
  color: #000000;
}
.paragraph--type--texte-image-alterne .field--name-field-tia-bouton {
  margin-top: 42px;
}
.paragraph--type--texte-image-alterne .field--name-field-tia-bouton a {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #006cd2;
  text-decoration: none;
}
.paragraph--type--texte-image-alterne .field--name-field-tia-bouton a::after {
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  flex: 0 0 20px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url(../images/icons/caret-right-blue.svg);
  background-size: 8px 14px;
}
.paragraph--type--texte-image-alterne .field--name-field-tia-position {
  display: none;
}

/* =========================================================
   CAIH-48 : Texte + image (actu), titre englobant - duplique de
   texte_image_alterne iso Figma (node 2253:2867, pages actualite) :
   titre pleine largeur au-dessus, ligne image+texte SANS cadre/fond de
   carte (Frame 709/711 sans fill ni stroke dans le Figma), image sans
   arrondi (cornerRadius absent), gap 24px (titre->ligne ET image->texte,
   Frame 708/709/711 layoutMode gap=24 releve directement sur le fichier
   Figma), texte 16px/400 (pas 18px comme l'ancien composant).
   ========================================================= */
.paragraph--type--texte-image-actu {
  display: flex;
  flex-direction: column;
  gap: 24px;
}
.paragraph--type--texte-image-actu__titre {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
}
.paragraph--type--texte-image-actu__row {
  display: flex;
  align-items: stretch;
  gap: 24px;
  min-height: 300px;
}
.paragraph--type--texte-image-actu.position--droite .paragraph--type--texte-image-actu__row {
  flex-direction: row-reverse;
}
.paragraph--type--texte-image-actu.position--gauche .paragraph--type--texte-image-actu__row {
  flex-direction: row;
}
.paragraph--type--texte-image-actu__image {
  flex: 0 0 448px;
  min-width: 0;
}
.paragraph--type--texte-image-actu__image .field,
.paragraph--type--texte-image-actu__image .ligne,
.paragraph--type--texte-image-actu__image article.media {
  height: 100%;
  margin: 0;
}
.paragraph--type--texte-image-actu__image img {
  display: block;
  width: 100%;
  /* hauteur FIXE (pas 100%) : height:100% d'un ancetre flex sans taille
     definie retombe sur le ratio intrinseque de la photo source (constate :
     319px au lieu de 300px), ce qui empeche object-fit:cover de recadrer -
     Frame 707 du Figma est un cadre fixe 448x300, pas un ratio libre. */
  height: 300px;
  margin: 0;
  object-fit: cover;
  /* pas d'arrondi : cornerRadius absent sur Frame 707 dans le Figma,
     contrairement a l'image de texte_image_alterne (16px). */
  border-radius: 0;
}
.paragraph--type--texte-image-actu__texte {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.paragraph--type--texte-image-actu__texte .field--name-field-tia-actu-texte {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #000000;
}
@media (max-width: 768px) {
  .paragraph--type--texte-image-actu__row,
  .paragraph--type--texte-image-actu.position--gauche .paragraph--type--texte-image-actu__row,
  .paragraph--type--texte-image-actu.position--droite .paragraph--type--texte-image-actu__row {
    flex-direction: column;
  }
  .paragraph--type--texte-image-actu__image {
    flex-basis: auto;
  }
  .paragraph--type--texte-image-actu__image img {
    min-height: 0;
    aspect-ratio: 448 / 300;
  }
}

@media (max-width: 768px) {
  .paragraph--type--section-texte-image-alterne .field--name-field-stia-titre {
    font-size: 28px;
  }
  .paragraph--type--section-texte-image-alterne .field--name-field-stia-items {
    gap: 32px;
  }
  .paragraph--type--texte-image-alterne,
  .paragraph--type--texte-image-alterne.position--gauche,
  .paragraph--type--texte-image-alterne.position--droite {
    flex-direction: column;
    gap: 20px;
  }
  .paragraph--type--texte-image-alterne__image {
    flex-basis: auto;
  }
  .paragraph--type--texte-image-alterne__image img {
    min-height: 0;
    aspect-ratio: 362 / 275;
    border-radius: 8px;
  }
  .paragraph--type--texte-image-alterne__card {
    gap: 20px;
    padding: 20px;
    border-radius: 8px;
    background: #f5fafc;
    border-color: #3399cc;
  }
  .paragraph--type--texte-image-alterne .field--name-field-tia-bouton {
    margin-top: 0;
  }
  .paragraph--type--texte-image-alterne .field--name-field-tia-bouton a {
    display: inline-flex;
    width: fit-content;
    padding: 12px 22px;
    border-radius: 30px;
    background: #006cd2;
    border: 1px solid #006cd2;
    box-sizing: border-box;
    color: #ffffff;
    line-height: 24px;
  }
  .paragraph--type--texte-image-alterne .field--name-field-tia-bouton a::before,
  .paragraph--type--texte-image-alterne .field--name-field-tia-bouton a::after {
    display: none;
  }
}


/* =========================================================
   CAIH-23 : Marches selectionnes (Frame 712 / 2256:5505)
   ========================================================= */
.marches-selectionnes__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 32px;
}
.marches-selectionnes__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: normal;
  color: #000000;
}
.marches-selectionnes__link a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 30px;
  background: #006cd2;
  border: 1px solid #006cd2;
  box-sizing: border-box;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-decoration: none;
  white-space: nowrap;
}
.marches-selectionnes__grid {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding-bottom: 4px;
  /* CAIH-23 : la maquette ne montre aucune scrollbar, seuls les 2 boutons
     ronds (.carousel-nav) pilotent le defilement - masquer la scrollbar
     native qu'overflow-x:auto affiche sinon (retour utilisateur avec
     capture montrant la barre grise sous les cartes, absente du Figma). */
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge legacy */
  /* La derniere carte (partiellement visible) doit filer jusqu'au bord
     reel de l'ecran, desktop et mobile (confirme sur Figma, node
     2256-5505 desktop / 2181-4254 mobile : pas de bordure de fin, ca
     continue au scroll) - le conteneur normal (.page-body-layout /
     .marche-bas-de-page, padding 100px desktop, plafond 1800px) coupait
     la carte bien avant le bord reel, laissant un vide visible au-dela
     (retour utilisateur avec capture DevTools). Deborde uniquement a
     droite (pas de margin-left : la 1ere carte reste alignee sous le
     titre) en etirant la largeur du conteneur jusqu'au bord reel du
     viewport - meme distance que le calc deja utilise pour .hero-article
     (padding 100px + demi-ecart au-dela du plafond 1800px). */
  width: calc(100% + max(0px, (100vw - 1800px) / 2) + 100px);
}
.marches-selectionnes__grid::-webkit-scrollbar {
  display: none; /* Chrome/Safari/Edge Chromium */
}
.marches-selectionnes__grid > * {
  flex: 0 0 auto;
}
@media (max-width: 992px) {
  .marches-selectionnes__grid {
    /* meme raisonnement que ci-dessus, gouttiere mobile 20px (pas de
       plafond 1800px actif sous 992px). */
    width: calc(100% + 20px);
  }
}

/* Carte marche (teaser) - Frame 884, gap racine 29px */
.marche-card {
  flex: 0 0 300px;
  width: 300px;
  box-sizing: border-box;
  background: #ffffff;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 29px;
}
.marche-card__top {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.marche-card__title-block {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.marche-card__tag {
  align-self: flex-start;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  background: rgba(229, 229, 231, 0.5);
  border-radius: 100px;
  padding: 8px 12px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: normal;
  color: #000000;
  text-transform: uppercase;
}
.marche-card__tag-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #2d3f86;
  flex: 0 0 auto;
}
.marche-card__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: normal;
  color: #000000;
}
.marche-card__title a {
  color: inherit;
  text-decoration: none;
}
.marche-card__meta {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  color: #454754;
}
.marche-card__desc {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #74757f;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
/* Le champ field_description_longue est rendu par Drupal dans un wrapper
   .ligne (regle globale : max-width 80% + margin:0 auto + padding 0 15px,
   pensee pour du contenu pleine page) - dans la carte de 268px ca centre
   et retrecit le texte au lieu de suivre la largeur de la carte (iso
   maquette Figma 2256:4711/2256:5511 : texte pleine largeur, sans retrait). */
.marche-card__desc .ligne {
  max-width: initial;
  margin: 0;
  padding: 0;
}
.marche-card__desc p {
  margin: 0;
}
/* .field--name-field-description-longue { margin: 0 3em } (regle globale,
   pensee pour la fiche marche "full") fuit dans la carte teaser : le
   <article> du teaser n'a pas la classe node--type-marche qui neutralise
   cette regle ailleurs (node--type-marche .field--name-field-description-longue
   { margin:0 }). Prend 48px de retrait de chaque cote sans ce reset. */
.marche-card__desc .field--name-field-description-longue {
  margin: 0;
}
.marche-card__cta {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #006cd2;
  text-decoration: none;
}
.marche-card__cta::after {
  content: '';
  width: 20px;
  height: 20px;
  background: url('../images/icons/caret-right.svg') center / 8px 14px no-repeat;
}

/* =========================================================
   CAIH-25 : Actualites selectionnees (Frame 713 / 2256:5592)
   ========================================================= */
.actualites-selectionnees__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  margin-bottom: 32px;
  flex-wrap: wrap;
}
.actualites-selectionnees__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: normal;
  color: #000000;
}
.actualites-selectionnees__link {
  display: flex;
  gap: 20px;
}
.actualites-selectionnees__link a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 12px 22px;
  border-radius: 30px;
  background: #006cd2;
  border: 1px solid #006cd2;
  box-sizing: border-box;
  color: #ffffff;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  text-decoration: none;
  white-space: nowrap;
}
.actualites-selectionnees__grid {
  display: flex;
  gap: 20px;
  overflow-x: auto;
  scroll-behavior: smooth;
  padding-bottom: 4px;
  /* CAIH-25 : meme raison que .marches-selectionnes__grid ci-dessus -
     scrollbar native masquee, seuls les boutons ronds pilotent. */
  scrollbar-width: none;
  -ms-overflow-style: none;
  /* meme raison que .marches-selectionnes__grid ci-dessus : la derniere
     carte doit filer jusqu'au bord reel de l'ecran (Figma 2256-5592
     desktop / meme principe mobile que CAIH-23), pas s'arreter au
     padding du conteneur (.page-body-layout/.marche-bas-de-page). */
  width: calc(100% + max(0px, (100vw - 1800px) / 2) + 100px);
}
.actualites-selectionnees__grid::-webkit-scrollbar {
  display: none;
}
.actualites-selectionnees__grid > * {
  flex: 0 0 auto;
}
/* Paragraphes "promus" (liste fournie par une vue via field_vue) : core
   enveloppe la sortie de la vue dans un div.views-element-container - on le
   neutralise pour que les cartes restent les elements flex du carrousel,
   exactement comme dans les paragraphes "selectionnes". */
.marches-selectionnes__grid > .views-element-container,
.actualites-selectionnees__grid > .views-element-container {
  display: contents;
}
.marches-selectionnes__grid > .views-element-container > *,
.actualites-selectionnees__grid > .views-element-container > * {
  flex: 0 0 auto;
}
@media (max-width: 992px) {
  .actualites-selectionnees__grid {
    width: calc(100% + 20px);
  }
}

/* Carte actualite/evenement (teaser article + agenda) - Frame 884, 340px,
   gap racine 20px (different du 29px des cartes marche) */
.actu-card {
  flex: 0 0 340px;
  width: 340px;
  box-sizing: border-box;
  background: #ffffff;
  border-radius: 16px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.actu-card__media-block {
  display: flex;
  flex-direction: column;
  gap: 20px;
}
.actu-card__top-block {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.actu-card__tag-row {
  display: flex;
  align-items: center;
  gap: 10px;
}
.actu-card__tag {
  display: inline-flex;
  align-items: center;
  background: rgba(229, 229, 231, 0.5);
  border-radius: 100px;
  padding: 8px 12px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 12px;
  line-height: normal;
  color: #000000;
  text-transform: uppercase;
  white-space: nowrap;
}
.actu-card__date {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 18px;
  color: #454754;
  white-space: nowrap;
}
.actu-card__image img {
  display: block;
  width: 100%;
  height: 141px;
  object-fit: cover;
  border-radius: 4px;
}
.actu-card__content {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.actu-card__title-block {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.actu-card__title {
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: normal;
  color: #000000;
}
.actu-card__title a {
  color: inherit;
  text-decoration: none;
}
.actu-card__desc {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #74757f;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.actu-card__cta {
  margin-top: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #006cd2;
  text-decoration: none;
}
.actu-card__cta::after {
  content: '';
  width: 20px;
  height: 20px;
  background: url('../images/icons/caret-right.svg') center / 8px 14px no-repeat;
}

/* =========================================================
   Navigation carousel partagee (fleches, Frame 891/890)
   ========================================================= */
.carousel-nav {
  display: flex;
  justify-content: flex-end;
  gap: 10px;
  margin-top: 10px;
}
.carousel-nav__btn {
  width: 48px;
  height: 48px;
  border-radius: 30px;
  border: none;
  box-sizing: border-box;
  padding: 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  position: relative;
}
.carousel-nav__btn::before {
  content: '';
  display: block;
  width: 6px;
  height: 12px;
  background-color: currentColor;
  -webkit-mask: url('../images/icons/chevron-left.svg') center / contain no-repeat;
  mask: url('../images/icons/chevron-left.svg') center / contain no-repeat;
}
.carousel-nav__btn--prev {
  background: #cfcfcf;
  color: #454754;
}
.carousel-nav__btn--next {
  background: #006cd2;
  color: #ffffff;
}
.carousel-nav__btn--next::before {
  transform: rotate(180deg);
}

@media (max-width: 992px) {
  .marches-selectionnes__header,
  .actualites-selectionnees__header {
    flex-direction: column;
    align-items: flex-start;
  }
  /* Les 2 boutons "Tous les evenements"/"Toutes les actualites"
     debordaient de l'ecran en mobile - display:flex sans wrap +
     white-space:nowrap sur les <a>, aucune des 2 largeurs ne pouvait
     jamais tenir cote a cote sur un ecran etroit. Empiles pleine largeur
     (CAIH-25 uniquement : 2 boutons, vraie contrainte d'overflow).
     CAIH-23 n'a qu'1 seul bouton "Decouvrir tous nos marches" - le node
     Figma mobile dedie (2181:4254, "Link" 2181:4257) le specifie en
     sizing HUG (269px, comme le desktop), PAS en pleine largeur : etendre
     ce meme traitement full-width au bouton unique etait une deviation
     non voulue de la maquette. */
  .actualites-selectionnees__link {
    width: 100%;
    flex-direction: column;
    gap: 12px;
  }
  .actualites-selectionnees__link a {
    width: 100%;
  }
  /* Pas de largeur en % ici : la maquette mobile (Figma "iPhone 17",
     node 2181:4254 pour les marches / 2272:5457 pour les actualites)
     garde les memes largeurs figees qu'en desktop - 300px (.marche-card)
     et 340px (.actu-card), verifie sur les deux extractions. Les regles
     de base plus haut s'appliquent donc telles quelles en mobile, la
     carte suivante restant partiellement visible grace au carousel
     scrollable (overflow-x: auto), pas a un pourcentage. Un ancien
     essai en 80% ici faisait deborder les cartes (jusqu'a ~790px de
     large a l'approche de 992px) - retire. */
}

/* =========================================================
   CAIH-26 : Chiffres cles (Frame 716 / 2256:5701)
   ========================================================= */
.chiffres-cles {
  position: relative;
}
.chiffres-cles__deco {
  display: none;
}
/* Cascade de 3 carres decoratifs (Group 2, 2256:5702) en bas a gauche de la
   section - fill #2d3f86 a 10% d'opacite, 80.27px chacun. Positions
   mesurees en Figma relatives au bord gauche de la SECTION PLEINE LARGEUR
   (frame 1512px de reference, bord a bord d'ecran) : carre 1 (x:143.77,
   y:0), carre 2 (x:61.23, y:150.98), carre 3 (x:-20.04, y:301.96, deborde
   legerement hors du cadre). Purement decoratif et non fourni en version
   mobile par la maquette -> reserve au desktop pour eviter tout
   chevauchement avec les cartes empilees.
   inset:0 calait ce calque sur .chiffres-cles, qui est contraint dans le
   conteneur central (retour utilisateur : carres coinces dans la colonne
   au lieu de toucher le bord reel de l'ecran) - retour en pleine largeur
   via la technique 50%/-50vw (independant de la largeur du conteneur
   parent), les positions px des carres redeviennent alors relatives au
   vrai bord gauche de l'ecran comme prevu par Figma. */
@media (min-width: 992px) {
  .chiffres-cles__deco {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    left: 50%;
    width: 100vw;
    margin-left: -50vw;
    z-index: -1;
    overflow: hidden;
    pointer-events: none;
  }
  .chiffres-cles__deco-square {
    position: absolute;
    width: 80.27px;
    height: 80.27px;
    background: #2d3f861a;
  }
  .chiffres-cles__deco-square--1 {
    left: 143.77px;
    top: 0;
  }
  .chiffres-cles__deco-square--2 {
    left: 61.23px;
    top: 150.98px;
  }
  .chiffres-cles__deco-square--3 {
    left: -20.04px;
    top: 301.96px;
  }
}
.chiffres-cles__title {
  margin: 0 0 32px;
  text-align: left;
  font-family: 'Poppins', sans-serif;
  font-weight: 800;
  font-size: 36px;
  line-height: normal;
  color: #000000;
}
/* Mobile (node Figma 2181:4455, Frame 716 mobile 2181:4450) : titre a
   28px, pas 36px - confirme par extraction Figma dediee au node mobile
   (absent du frame 716 desktop qui reste a 36px). */
@media (max-width: 991px) {
  .chiffres-cles__title {
    font-size: 28px;
  }
}
/* CAIH-26 : le titre Figma desktop (box x:483, Frame 716) n'est pas
   flush-left avec le reste des sections : son centre horizontal
   (483+546/2=756) coincide exactement avec le centre du bloc de cartes
   centre (justify-content:center ci-dessous) - donc centrer le titre dans
   le meme conteneur reproduit l'alignement mesure. En mobile (iPhone 17,
   2181:4455) le titre repasse flush-left comme les autres sections. */
@media (min-width: 992px) {
  .chiffres-cles__title {
    text-align: center;
    /* gap titre -> grille de cartes mesure a 50px dans Frame 716
       (2256:5701, layout VERTICAL gap 50px) - 32px ne couvrait que le
       mobile (non verifie ici, laisse tel quel). */
    margin-bottom: 50px;
  }
}
.chiffres-cles__grid > .field {
  display: grid;
  /* Cartes largeur fixe 353px iso maquette (Frame 713/908/909), pas 1fr :
     a 1fr les cartes s'etirent (416px mesure a 1312px de conteneur) et le
     libelle passe sur 2 lignes des que le viewport retrecit un peu, alors
     que le libelle le plus long ("M€ TTC de volume d'achat annuel.") tient
     sur 1 seule ligne dans les 313px interieurs mesures en Figma (353-2*20
     de padding). justify-content:center reproduit la marge symetrique
     ~92.5px mesuree de chaque cote de la grille dans le Frame 892 (1308px). */
  grid-template-columns: repeat(3, 353px);
  justify-content: center;
  gap: 32px;
}
/* .ligne (wrapper generique du theme, ligne 33) impose max-width:80% +
   margin:auto + padding:0 15px qui casserait la grille des cartes - meme
   neutralisation que #block-recherchepartheme (CAIH-22, ligne 1145). */
.chiffres-cles__grid .ligne {
  max-width: 100%;
  margin: 0;
  padding: 0;
}
.chiffre-cle {
  background: #ffffff;
  border-radius: 8px;
  padding: 20px;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.chiffre-cle__top {
  display: flex;
  align-items: center;
  gap: 8px;
}
.chiffre-cle__icon {
  width: 30px;
  height: 30px;
  flex: 0 0 auto;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}
.chiffre-cle__icon--hand-coins { background-image: url('../images/icons/hand-coins.svg'); }
.chiffre-cle__icon--contact-round { background-image: url('../images/icons/contact-round.svg'); }
.chiffre-cle__icon--badge-euro { background-image: url('../images/icons/badge-euro.svg'); }
.chiffre-cle__icon--badge-check { background-image: url('../images/icons/badge-check.svg'); }
.chiffre-cle__icon--briefcase-business { background-image: url('../images/icons/briefcase-business.svg'); }
.chiffre-cle__icon--user-round { background-image: url('../images/icons/user-round.svg'); }
.chiffre-cle__valeur {
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 32px;
  line-height: normal;
  color: #000000;
}
.chiffre-cle__libelle {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 18px;
  line-height: normal;
  color: #000000;
}
@media (max-width: 992px) {
  .chiffres-cles__grid > .field {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}
@media (max-width: 575px) {
  .chiffres-cles__grid > .field {
    grid-template-columns: 1fr;
  }
}

/* =========================================================
   CAIH-34 : Bandeau hero fiche marche (Frame 912 / 2256:4120)
   ========================================================= */
body.page-node-type-marche {
  /* Frame "Marche" (2256:4118), fill #fbfbfb sur toute la page - le
     "body { background-color:#fff !important }" global (ligne 518) doit
     etre battu par un !important plus specifique, pas juste par l'ordre
     des regles. Scope au type "marche" pour ne pas affecter les autres
     types de contenu (hors perimetre CAIH-34/35). */
  background-color: #fbfbfb !important;
}
.hero-marche__intro {
  /* Bandeau plein-largeur (bord a bord) iso maquette (Frame 652/2256:4193,
     1512px pleine largeur, fill #006cd20d) : width:100vw + margin
     calc(50% - 50vw) restaure, meme pattern que .hero-article/CAIH-31 et
     .hero-evenement/CAIH-33 - le debordement du a 100vw (largeur
     scrollbar verticale incluse, scrollbar classique non-overlay
     Windows/Chrome) est desormais neutralise par overflow-x:hidden sur
     body plutot qu'en sacrifiant le plein-largeur (retour utilisateur sur
     grand ecran : le voulait bord a bord, pas limite au conteneur). */
  width: 100vw;
  margin-left: calc(50% - 50vw);
  margin-right: calc(50% - 50vw);
  background: #006cd20d;
  /* padding-bottom 203px (pas 50) : mesure au pixel sur le PNG Figma, le
     fond bleu clair fait 332px de haut au total (pas juste la hauteur du
     titre), soit 153px de PLUS que le point ou le titre+reference se
     terminent (50 padding-top + 79 bloc titre + 50 gap = 179) - le fond
     clair chevauche donc le haut de la carte foncee sur 153px (visible
     dans les marges de chaque cote, la carte etant plus etroite que le
     bandeau). La carte est remontee du meme montant (margin-top negatif)
     pour ne pas ajouter d'espace visuel entre le titre et la carte. */
  /* 1440px -> 1800px : suit .hero-marche__card/.node--type-marche >
     .node__content, plafonnes a 1800px, sinon le titre restait aligne sur
     une colonne plus etroite que le contenu en dessous. */
  padding: 50px max(100px, calc((100vw - 1800px) / 2 + 100px)) 203px;
  box-sizing: border-box;
  position: relative;
  z-index: 1;
  /* Titre + reference centres (mesure pixel sur le PNG Figma : centre du
     texte = 1511.5px sur une largeur de 3024px, soit EXACTEMENT le centre
     de la page) - vrai a la fois desktop et mobile, pas seulement mobile
     comme suppose a tort precedemment. */
  text-align: center;
}
.hero-marche__title {
  margin: 0 0 15px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 40px;
  line-height: 48px;
  color: #000000;
}
.hero-marche__reference {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 16px;
  color: #000000;
}
.hero-marche__card {
  /* 1312px -> 1800px : meme raisonnement que .node--type-page/
     .node--type-marche > .node__content ci-dessous - suit la meme colonne
     elargie sur grand ecran (retour utilisateur avec capture). */
  max-width: 1800px;
  /* margin:auto seul ne cree de marge que si le viewport depasse 1800px -
     entre 992px et 1800px (la quasi-totalite des ecrans desktop reels), la
     carte touchait directement les bords du viewport (#block-asco-theme-content
     a padding:0 pour les pages marche, cf. ligne ~3495) au lieu de la marge
     visible sur la maquette (2256:4118) - meme formule que .hero-marche__intro
     plus haut (plancher 100px, grandit au-dela de 1800px). */
  margin: -153px max(100px, calc((100vw - 1800px) / 2 + 100px)) 0;
  padding: 50px;
  box-sizing: border-box;
  border-radius: 30px;
  background: #2d3f86;
  display: flex;
  flex-direction: column;
  gap: 40px;
  position: relative;
  z-index: 2;
}
/* Jauge de dates + boutons d'action SUR LA MEME LIGNE (Figma Frame 220 /
   2256:4330 : layout HORIZONTAL, gap 104px) - erreur initiale corrigee :
   ces 2 blocs avaient ete empiles en 2 lignes separees au lieu d'etre
   cote a cote. */
.hero-marche__top {
  display: flex;
  align-items: center;
  gap: 104px;
  /* nowrap : .hero-marche__timeline peut retrecir (flex-shrink via
     "flex: 0 1 519px") pour laisser la place aux boutons plutot que de
     passer les boutons a la ligne - eviter le wrap ici, deja gere en
     mobile via display:contents. */
  flex-wrap: nowrap;
}
.hero-marche__timeline {
  /* Largeur figee proche du Group 2 Figma (519px) plutot que flex:1 qui
     etirait la jauge sur tout l'espace restant (trop large, decalait
     visuellement les boutons a droite). */
  flex: 0 1 519px;
  min-width: 300px;
}
.hero-marche__timeline .field--name-field-dates-debut-fin {
  margin-bottom: 0;
}
.hero-marche__actions {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

/* Jauge de dates (daterange-timeline, deja construite CAIH-34 - JS calcule
   deja le pourcentage ecoule via .before/.now/.after, ici uniquement le
   restylage visuel : barre blanche pleine largeur + curseur rond.
   Scope .hero-marche__timeline obligatoire : un habillage generique
   .daterange-timeline preexistant (background teal, .after en
   position:absolute + float, .page-node-type-marche .daterange-timeline
   .after) a une specificite egale ou superieure et gagnait sinon, quel
   que soit l'ordre dans le fichier - cf. lignes ~3994-4079. */
.hero-marche__timeline .daterange-timeline {
  display: flex;
  align-items: flex-start;
  min-width: 300px;
  width: auto;
  padding: 0;
  margin: 0;
  position: relative;
  background: none;
  border-radius: 0;
  height: auto;
}
/* .before/.after portent 2 choses en flux normal (colonne) : la barre
   (pseudo-element ::before, 8px) puis le texte de date - pas de
   position:absolute, pour que la hauteur totale (bar+gap+texte = 55px,
   Figma Frame 220) soit une vraie hauteur de boite et que le gap:40px vers
   la ligne stats en dessous (.hero-marche__card) s'applique correctement.
   Une 1ere version en position:absolute donnait la bonne valeur au pixel
   mais le texte "debordait" hors de la boite mesuree, ecrasant le gap
   visuel avec la ligne suivante. */
.hero-marche__timeline .daterange-timeline .before,
.hero-marche__timeline .daterange-timeline .after {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: auto;
  min-width: 0;
  margin: 0;
  background: none;
  float: none;
  position: static;
  padding: 0;
}
/* Le JS (daterange_timeline.js) pose un style="width:X%" en ligne sur
   .before - pour un marche deja expire, X est clampe a 100. Sans plafond,
   .before (largeur=100% du conteneur) ne laisse plus AUCUNE place a
   .after (flex:1, base 0%) : la date de fin ("26/10/2025") se retrouvait
   avec une boite de largeur 0 et debordait hors de l'ecran en mobile
   (defilement horizontal). max-width reserve la place minimale pour le
   curseur + la 2e date, quel que soit le pourcentage JS. */
.hero-marche__timeline .daterange-timeline .before {
  max-width: calc(100% - 110px);
}
.hero-marche__timeline .daterange-timeline .before::before,
.hero-marche__timeline .daterange-timeline .after::before {
  content: '';
  display: block;
  height: 8px;
  background: #ffffff;
}
.hero-marche__timeline .daterange-timeline .before::before {
  border-radius: 4px 0 0 4px;
}
.hero-marche__timeline .daterange-timeline .after {
  flex: 1;
  right: auto;
}
.hero-marche__timeline .daterange-timeline .after::before {
  border-radius: 0 4px 4px 0;
}
.hero-marche__timeline .daterange-timeline .now {
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  margin: -7px -11px 0;
  border-radius: 50%;
  background: #2d3f86;
  border: 3px solid #ffffff;
  box-sizing: border-box;
  z-index: 1;
  float: none;
}
.hero-marche__timeline .daterange-timeline .now:after {
  content: none;
}
.hero-marche__timeline .daterange-timeline .before span,
.hero-marche__timeline .daterange-timeline .after span {
  display: block;
  position: static;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #f9f9fb;
  white-space: nowrap;
  float: none;
}
.hero-marche__timeline .daterange-timeline .after span {
  text-align: right;
}

.hero-marche__action .media,
.hero-marche__action .field {
  margin: 0;
}
.hero-marche__action a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 11px 20px;
  border-radius: 30px;
  background: #f9f9fb;
  border: 1px solid #2d3f86;
  box-sizing: border-box;
  font-family: 'Poppins', sans-serif;
  font-weight: 500;
  font-size: 16px;
  line-height: 24px;
  color: #2d3f86;
  text-decoration: none;
  white-space: nowrap;
}
.hero-marche__action a::after {
  /* L'asset extrait de Figma est deja la version finale (post-rotation
     dans la maquette) : il pointe deja a droite tel quel - ne PAS lui
     appliquer de rotation en plus (ca le faisait pointer vers le bas).
     position/right/top/margin-top remis a plat : une regle heritee tres
     ancienne du site (.field--name-field-fiche-marche a:after, meme
     specificite CSS 0-1-1, definie plus haut dans le fichier) met ce
     pseudo-element en position:absolute; right:5px; top:50%;
     margin-top:-20px - comme je ne redefinissais pas ces proprietes, elles
     restaient actives et sortaient l'icone du flux flex, la faisant
     chevaucher la fin du texte au lieu d'ecarter la boite du bouton. */
  content: '';
  display: block;
  position: static;
  right: auto;
  top: auto;
  margin-top: 0;
  flex: 0 0 25px;
  width: 25px;
  height: 25px;
  background: url('../images/icons/arrow-up-circle.svg') center / contain no-repeat;
}
.hero-marche__share {
  flex: 0 0 auto;
  margin-left: auto;
}
.hero-marche__share .social-sharing-buttons {
  display: flex;
  gap: 10px;
  margin: 0;
}
.hero-marche__share .social-sharing-buttons-button {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 30px;
  background: #f9f9fb;
  border: 1px solid #2d3f86;
  box-sizing: border-box;
}
.hero-marche__share .social-sharing-buttons-button svg {
  width: 20px;
  height: 20px;
}

.hero-marche__stats {
  display: flex;
  flex-wrap: wrap;
  gap: 101px;
}
.hero-marche__stat {
  display: flex;
  align-items: center;
  gap: 30px;
}
.hero-marche__stat--lots {
  gap: 21px;
}
.hero-marche__stat-icon {
  flex: 0 0 50px;
  width: 50px;
}
.hero-marche__stat-label {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 20px;
  line-height: 30px;
  color: #f9f9fb;
}
.hero-marche__stat-value {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #f9f9fb;
}
.hero-marche__description {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #f9f9fb;
}
.hero-marche__description p {
  margin: 0 0 10px;
}

@media (max-width: 992px) {
  .hero-marche__intro {
    padding: 32px 20px;
    text-align: center;
  }
  .hero-marche__title {
    font-size: 28px;
    line-height: 34px;
  }
  .hero-marche__card {
    border-radius: 0;
    padding: 24px 20px;
    max-width: 100%;
    /* Le margin-top:-153px (desktop, CAIH-34) fait chevaucher la carte
       sur le bas du bandeau clair - correct en desktop (fond etendu a
       332px), mais en mobile le bandeau ne fait que 163px : ce meme
       -153px faisait passer la carte QUASIMENT PAR-DESSUS le titre
       (opaque), le rendant invisible. Reinitialise a 0 en mobile - la
       marge horizontale max(100px, ...) ci-dessus (desktop) est aussi
       remise a 0 ici, deja geree par le padding 20px mobile. */
    margin: 0;
  }
  /* .hero-marche__top n'existe que pour aligner jauge+boutons cote a cote
     en desktop (Figma Frame 220) - sur mobile ils redeviennent 2 blocs
     independants empiles (Figma 2272:5139), "display:contents" deballe
     le wrapper sans toucher au DOM pour que l'ordre CSS ci-dessous marche. */
  .hero-marche__top {
    display: contents;
  }
  .hero-marche__timeline {
    /* Reset du "flex: 0 1 519px" desktop : dans la ligne horizontale
       desktop (.hero-marche__top), ce flex-basis controle la LARGEUR ;
       mais en mobile, .hero-marche__top est display:contents et le
       conteneur flex reel devient .hero-marche__card en colonne
       (flex-direction:column) - le meme flex-basis s'appliquait alors a
       la HAUTEUR, donnant une jauge de 519px de haut au lieu de sa
       hauteur naturelle (~80px). */
    flex: 0 0 auto;
    min-width: 0;
    width: 100%;
  }
  .hero-marche__timeline .daterange-timeline {
    width: 100%;
    min-width: 0;
  }
  .hero-marche__action--fiche {
    flex: 1 1 100%;
  }
  .hero-marche__action--fiche a {
    width: 100%;
  }
  .hero-marche__action--adherer {
    flex: 1 1 auto;
  }
  .hero-marche__action--adherer a {
    width: 100%;
  }
  .hero-marche__share {
    margin-left: 0;
  }
  .hero-marche__stats {
    flex-direction: column;
    gap: 20px;
  }
  /* Ordre mobile different du desktop (Figma 2272:5139) : jauge de dates,
     PUIS statistiques, PUIS boutons d'action, PUIS description - alors que
     desktop est jauge/boutons/statistiques/description. */
  .hero-marche__timeline {
    order: 1;
  }
  .hero-marche__stats {
    order: 2;
  }
  .hero-marche__actions {
    order: 3;
  }
  .hero-marche__description {
    order: 4;
  }
}

/* =========================================================
   CAIH-35 : Nos contacts CAIH + Lots avec accordeon (Frame 696 / 2256:4201)
   ========================================================= */
/* Alignement avec le hero (.hero-marche__card fait 1312px centre - cf.
   CAIH-34) : le contenu sous le hero (Points forts, Nos contacts CAIH,
   Lot X...) heritait de marges heritees incoherentes (field_description_longue
   margin:3em, field_lots margin:3em en desktop via .page-node-type-marche)
   qui le decalaient de 16px par rapport au hero et le retrecissaient de 32px
   au lieu de suivre la meme colonne de 1312px. */
/* Scope a .page-node-type-marche (page complete d'un marche) : sans ce
   prefixe, ce selecteur matchait aussi les cartes .node--type-marche en
   mode teaser (node--view-mode-en-tete) dans les vues listing (/nos-marches,
   marches suggeres...) - le margin horizontal max(100px, ...) y ecrasait
   quasiment toute la largeur d'une carte de ~316px, ecrasant le contenu a
   ~117px (retour utilisateur : cartes "completement petees" sur /nos-marches). */
.page-node-type-marche .node--type-marche > .node__content {
  /* 1312px -> 1800px : suit .hero-marche__card ci-dessus, meme colonne
     elargie sur grand ecran (retour utilisateur avec capture). */
  max-width: 1800px;
  /* margin-top 60px : gap entre grandes sections de la page (Figma
     Frame 695 / 2256:4119, layout VERTICAL gap:60px entre le hero et
     "Nos contacts CAIH"/Lots) - sans lui "Points forts" etait colle
     directement sous la carte foncee.
     margin horizontale : meme correctif que .hero-marche__card ci-dessus -
     "auto" seul ne cree de marge qu'au-dela de 1800px de large, laissant
     "Points forts"/"Nos contacts CAIH" toucher les bords du viewport entre
     992px et 1800px (retour utilisateur avec capture, node 2256:4118). */
  margin: 60px max(100px, calc((100vw - 1800px) / 2 + 100px)) 0;
  box-sizing: border-box;
}
@media (max-width: 992px) {
  .page-node-type-marche .node--type-marche > .node__content {
    /* Marge horizontale desktop (max(100px, ...) ci-dessus) remise a 0 -
       le padding 20px ci-dessous suffit en mobile, comme avant. */
    margin: 60px 0 0;
    padding: 0 20px;
  }
}
.node--type-marche .field--name-field-description-longue,
.page-node-type-marche .field--name-field-lots {
  margin: 0;
}
.field--name-field-nos-contacts-caih {
  /* Frame 696 (2256:4201) : gap 48px avant le premier "Lot". */
  margin-bottom: 48px;
}
.field--name-field-nos-contacts-caih > .field__label {
  margin: 0 0 22px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
}
.field--name-field-nos-contacts-caih > .field__items {
  display: flex;
  flex-wrap: wrap;
  gap: 50px;
}
.contact-caih-card {
  display: flex;
  gap: 10px;
  width: 355px;
  box-sizing: border-box;
  padding: 20px 30px;
  border-radius: 8px;
  border: 1px solid #2d3f86;
  /* Fond blanc explicite (CAIH-42, retour visuel direct) : le Figma
     n'a pas de fill sur ce frame, mais sans fond la carte se fond dans
     l'arriere-plan de la page. */
  background: #ffffff;
}
.contact-caih-card__photo,
.contact-caih-card__photo img {
  flex: 0 0 65px;
  width: 65px;
  height: 65px;
  border-radius: 6px;
  object-fit: cover;
}
.contact-caih-card__photo--placeholder {
  background: url('../images/icons/contact-avatar-placeholder.svg') center / contain no-repeat;
}
.contact-caih-card__body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* flex-item : min-width:auto par defaut empeche le contenu de retrecir
     sous sa largeur intrinseque - l'email (chaine sans espace) poussait
     alors la carte en debordement au lieu de passer a la ligne. */
  min-width: 0;
}
.contact-caih-card__identite {
  /* Frame 204 du Figma (2256:4477) : gap 0 entre NOM et Prenom - un
     bloc a part du reste (mail/tel), qui garde son propre gap 10px
     herite de .contact-caih-card__body. Bug reel corrige (CAIH-42,
     retour visuel direct) : nom/prenom etaient des enfants directs du
     meme flex que les lignes mail/tel, heritant a tort du gap 10px
     entre eux au lieu de 0. */
  display: flex;
  flex-direction: column;
  gap: 0;
}
.contact-caih-card__nom,
.contact-caih-card__prenom {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: #3b3b3b;
}
.contact-caih-card__nom {
  font-weight: 700;
}
.contact-caih-card__prenom {
  font-weight: 400;
}
.contact-caih-card__field {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}
/* Le wrapper de champ Drupal (.field, enfant flex direct de la ligne
   icone+texte) garde min-width:auto par defaut et refuse de retrecir sous
   la largeur du contenu - l'email (chaine sans espace) poussait donc la
   carte en debordement malgre overflow-wrap sur le texte plus bas. */
.contact-caih-card__field > .field {
  min-width: 0;
}
.contact-caih-card__field::before {
  content: '';
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background: center / contain no-repeat;
}
.contact-caih-card__field--mail::before {
  background-image: url('../images/icons/mail-outline.svg');
}
.contact-caih-card__field--tel::before {
  background-image: url('../images/icons/phone-outline.svg');
}
.contact-caih-card__field .field__label {
  display: block;
  margin: 0;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: normal;
  color: #3b3b3b;
}
.contact-caih-card__field .field__item,
.contact-caih-card__field .ligne {
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 600;
  font-size: 16px;
  line-height: 24px;
  color: #3b3b3b;
  overflow-wrap: break-word;
  min-width: 0;
}
.contact-caih-card__field a {
  /* La regle globale "a, .link { color:#0071b3 }" cible le <a> explicitement
     et gagne toujours sur l'heritage depuis .field__item/.ligne ci-dessus,
     peu importe la specificite : il faut re-cibler le <a> lui-meme. */
  color: #3b3b3b;
}

/* --- Lot X : [titre] --- */
.field--name-field-lots {
  counter-reset: lot;
}
.lot-marche {
  /* Frame 696 (2256:4201) : gap VERTICAL de 48px entre les sections
     (contacts -> lot 1 -> lot 2...). Chaque lot se termine par sa propre
     ligne separatrice ("Line 6", 30px sous le bouton Contacts), puis 48px
     avant le titre du lot suivant : marge, pas padding, pour ne pas
     dedoubler l'espacement. */
  display: block;
  margin-bottom: 48px;
  border-bottom: 2px solid #e7edf5;
  padding-bottom: 30px;
  counter-increment: lot;
}
/* :last-of-type sur .lot-marche ne fonctionne pas : chaque lot est enfant
   unique de son propre wrapper .field__item > .ligne (pas un vrai sibling
   des autres .lot-marche), donc TOUS matchent :last-of-type. On cible le
   dernier .field__item du champ a la place. */
.field--name-field-lots > .field__item:last-child .lot-marche {
  margin-bottom: 0;
  border-bottom: none;
  padding-bottom: 0;
}
.lot-marche__title {
  margin: 0 0 10px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
}
.lot-marche__title::before {
  content: "Lot " counter(lot) " : ";
}
.lot-marche__container {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.lot-marche__logos .field--name-field-fournisseur > .field__label {
  display: block;
  margin-bottom: 5px;
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: 24px;
  color: #3b3b3b;
  text-transform: uppercase;
}
.lot-marche__logos .field--name-field-fournisseur > .field__items,
.lot-marche__logos .field__items {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}
.lot-marche__logos .field--name-field-media-image {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100px;
  height: 100px;
  box-sizing: border-box;
  padding: 12.6px;
  border-radius: 8px;
  border: 0.63px solid #bdbfc7;
}
.lot-marche__logos .field--name-field-media-image img {
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;
  object-fit: contain;
}
.lot-marche__description {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 16px;
  line-height: normal;
  color: #000000;
}
.lot-marche__contacts-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  margin-top: 30px;
  padding: 20px;
  box-sizing: border-box;
  border-radius: 8px;
  border: none;
  background: #f3f3f3;
  cursor: pointer;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
  text-transform: uppercase;
}
.lot-marche__contacts-chevron {
  flex: 0 0 24px;
  width: 24px;
  height: 24px;
  background: url('../images/icons/chevron-up.svg') center / contain no-repeat;
  transform: rotate(180deg);
  transition: transform 0.2s ease;
}
.lot-marche__contacts-toggle[aria-expanded="true"] .lot-marche__contacts-chevron {
  transform: rotate(0deg);
}
.lot-marche__contacts-toggle[aria-expanded="true"] {
  border-radius: 8px 8px 0 0;
}
/* Contenu du panel (paragraphes groupe_contacts_lot > contact_lot) : jamais
   stylé jusqu'ici (rendu en texte brut). Valeurs reprises du seul frame
   "panel ouvert" disponible (mobile, Frame 254/258 - 2272:5358) : fond
   #f3f3f3 continu avec le bouton, "TITULAIRES" en gras/majuscule, contacts
   en grille (nom societe gras + nom/mail/tel en dessous), telephone en gris
   (pas de lien bleu) pour rester coherent avec les 3 lignes texte du spec. */
.lot-marche__contacts-panel {
  padding: 20px;
  background: #f3f3f3;
  border-radius: 0 0 8px 8px;
}
.lot-marche__contacts-panel .field--name-field-intitule {
  margin: 0 0 15px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #3b3b3b;
  text-transform: uppercase;
}
.lot-marche__contacts-panel .field--name-field-contacts.field__items {
  display: flex;
  flex-flow: row wrap;
  gap: 20px 60px;
}
.paragraph--type--contact-lot .field--name-field-nom-du-titulaire {
  margin: 0 0 4px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 16px;
  line-height: 24px;
  color: #3b3b3b;
  text-transform: uppercase;
}
.paragraph--type--contact-lot .field--name-field-nom,
.paragraph--type--contact-lot .field--name-field-mail,
.paragraph--type--contact-lot .field--name-field-telephone {
  font-family: 'Poppins', sans-serif;
  font-weight: 400;
  font-size: 14px;
  line-height: 21px;
  color: #3b3b3b;
}
.paragraph--type--contact-lot .field--name-field-telephone a {
  color: #3b3b3b;
  text-decoration: none;
}

/* Bas de page marche (CAIH-35) : "Restez informes" + "Nos autres marches
   suggeres" - paragraphes marches_selectionnes/actualites_selectionnees
   (CAIH-23/25) reutilises tels quels, embarques hors field_corps_modulaire
   (le type "marche" n'a pas ce champ) donc sans le wrapper de largeur
   habituel : on lui donne la meme grille que le reste de la page. */
.marche-bas-de-page {
  /* 1512px -> 1800px : "Restez informes" + "Nos autres marches suggeres"
     restaient a l'ancien plafond sur grand ecran, pas suivi lors de
     l'elargissement de .node--type-marche > .node__content (ce wrapper
     est un SIBLING, pas un enfant, embarque hors field_corps_modulaire
     - cf. commentaire ci-dessus) - retour utilisateur avec capture. */
  max-width: 1800px;
  margin: 0 auto;
  padding: 60px 100px;
  box-sizing: border-box;
}
@media (max-width: 992px) {
  .marche-bas-de-page {
    padding: 32px 20px;
  }
}

@media (max-width: 992px) {
  /* Frame 252 mobile (2272:5285) : cartes empilees pleine largeur, bordure
     plus claire (#d4dbea, pas #2d3f86), padding uniforme 20px (pas 20/30),
     libelle de section 24px/600 (pas 23px/700), valeurs mail/tel 14px
     (pas 16px) - tout differe du desktop, ecarts confirmes par le spec. */
  .field--name-field-nos-contacts-caih > .field__label {
    font-size: 24px;
    font-weight: 600;
    line-height: 31.2px;
  }
  .field--name-field-nos-contacts-caih > .field__items {
    flex-direction: column;
  }
  .contact-caih-card {
    width: 100%;
    padding: 20px;
    border-color: #d4dbea;
  }
  .contact-caih-card__field .field__item,
  .contact-caih-card__field .ligne {
    font-size: 14px;
  }
}

/* =========================================================
   CAIH-42 : Paragraphe "Card contact" (corps modulaire) - reutilise a
   l'identique le style .contact-caih-card / grille deja en place pour
   field_nos_contacts_caih (Figma node 2256:4201), meme gap 50px.
   ========================================================= */
.card-contact__titre {
  margin: 0 0 22px;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  font-size: 23px;
  line-height: normal;
  color: #000000;
}
/* Bug reel (retour visuel direct, CAIH-42) : le flex doit cibler le
   wrapper de champ Drupal REEL (.field--name-field-cc-contacts, enfant
   direct de .card-contact__items) - flex sur .card-contact__items seul
   n'a aucun effet car il n'a qu'un enfant (ce wrapper), les 3 field__item
   restaient empiles en bloc SANS marge entre eux (gap mesure -355px,
   litteralement colles). Meme pattern que .field--name-field-nos-contacts-caih
   > .field__items deja en place ailleurs sur le site. */
.card-contact__items > .field--name-field-cc-contacts {
  display: flex;
  flex-wrap: wrap;
  gap: 50px;
}
/* Pages editoriales uniquement (page, article, evenement) : NOM Prenom sur
   une ligne, fonction en dessous. Les marches (field_nos_contacts_caih)
   gardent NOM / Prenom empiles et pas de fonction. */
.contact-caih-card__fonction {
  display: none;
}
.card-contact .contact-caih-card__identite {
  flex-flow: row wrap;
  column-gap: 0.3em;
}
/* Retour recette : "Prenom NOM", les deux en gras (ordre visuel seulement,
   le template est partage avec les cartes des marches qui gardent NOM/Prenom). */
.card-contact .contact-caih-card__prenom {
  order: -1;
  font-weight: 700;
}
.card-contact .contact-caih-card__fonction {
  display: block;
  flex-basis: 100%;
  font-family: 'Poppins', sans-serif;
  font-size: 16px;
  line-height: 24px;
  color: #3b3b3b;
}
@media (max-width: 992px) {
  .card-contact__titre {
    font-size: 24px;
    font-weight: 600;
    line-height: 31.2px;
  }
  .card-contact__items {
    flex-direction: column;
  }
}