/*
Theme Name: cagv55
Theme URI: https://www.verdun.fr

/* Importation de la police Catamaran depuis Google Fonts */
/*@import url('https://fonts.googleapis.com/css2?family=Catamaran:wght@400;500;600;700&display=swap'); */




* {
font-family: 'Catamaran-Regular';
}


html
 {
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
  height: 100%;
  font-size:16px;
  color:#2D2D2D;
}

body {
  margin-left:0;
  margin-right:0;
  overflow-x: hidden;
  /*background-image: url("/wp-content/themes/cagv55/img/main.png");  */
  /*background : #fff;*/
  color:#2D2D2D;
  font-family: 'Catamaran', sans-serif;
  text-align: justify-content-start;
  word-spacing: -0.1em;
}

/***********************************************************************/
/****************Bouton retour top*************************************/
/**********************************************************************/

#btn-back-to-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    display: none; /* Cache le bouton au départ */
    z-index: 1000; /* Assure que le bouton reste visible au-dessus d'autres éléments */
}

.rond {
    background-color: #007bff;
    border: none;
    border-radius: 50%;
    padding: 10px;
    color: white;
    font-size: 18px;
    cursor: pointer;
}

.rond:hover {
    background-color: #0056b3;
}


/*ul.two-columns {
    display: flex;          
    flex-wrap: wrap;        
    list-style-type: disc;  
    padding: 0;
    margin: 0;
    column-gap: 2rem;       
}

ul.two-columns li {
    width: 50%;             
    box-sizing: border-box; 
    padding: 0.2rem 0;      
}*/
		
		
.overlay-image {
    position: absolute; /* Permet de superposer l'image */
    top: 656px; /* Ajustez la position verticale */
    left: 0; /* Ajustez la position horizontale */
    width: 100%; /* Remplit toute la largeur du carrousel */
    height: 90px; /* Remplit toute la hauteur du carrousel */
    background-size: cover; /* Couvre toute la zone */
    background-position: center; /* Centre l'image */
    opacity: 1; /* Ajustez l'opacité selon vos besoins (0 à 1) */
    z-index: 999; /* Réduit le z-index pour que les liens soient au-dessus */
    pointer-events: none; /* Empêche l'image d'interférer avec les événements de la souris */
}

/* Media Queries pour gérer les tailles d'écran */
@media (max-width: 768px) {
    .overlay-image {
        display: none;
        background-size: contain; /* Garde l'image dans les proportions et évite les coupures sur petits écrans */
        opacity: 1; /* Optionnel : Ajuste l'opacité sur petits écrans */
    }
}

@media (max-width: 576px) {
    .overlay-image {
        display: none;
        background-size: cover;
        height: auto; /* Assurez-vous que la hauteur s'adapte */
        min-height: 50vh; /* Ajuste la hauteur minimum pour l'image sur les petits écrans */
    }
}

@media (max-width: 320px) {
    /* Ajustement de l'image superposée pour les très petits écrans */
    .overlay-image {
        display: none;
        background-size: cover;
        height: 30vh; /* Réduit encore la hauteur à 30% de l'écran pour de très petits écrans */
        opacity: 1; /* Vous pouvez ajuster l'opacité si nécessaire */
    }
}
		
		
.fond-enunclic {
   background: linear-gradient(to left, #00aa8d, #477ec0 95%, 100%, #333 65%);
   color: #fff;
  padding: 0px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  border: 0px solid #ddd;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  margin: 0 10px;
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 1; /* Centrer verticalement le texte */
  clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
  	
}
		
		
.fond-enunclic:hover {
  background-image: linear-gradient(94.79deg, #54C3A0 2.4%, #009AD0 109.99%);
  color: #fff;
  padding: 0px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  border: 0px solid #ddd;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  margin: 0 10px;
  display: inline-block;
  width: 150px;
  height: 150px;
  line-height: 1; /* Centrer verticalement le texte */
  clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
}	
		
		
/* Style pour le bouton rond */
.round-button {
    display: flex;
    justify-content: center;  /* Centre l'icône horizontalement */
    align-items: center;      /* Centre l'icône verticalement */
    width: 50px;              /* Largeur du bouton (ajuste selon ta préférence) */
    height: 50px;             /* Hauteur du bouton (ajuste selon ta préférence) */
    border-radius: 50%;       /* Pour que le bouton soit rond */
    padding: 0;               /* Enlève les marges internes */
}

/* Enlève toute marge ou padding de <h5> */
.round-button h5 {
    margin: 0;                /* Enlève les marges par défaut du h5 */
    padding: 0;               /* Enlève les marges internes du h5 */
}

/* Optionnel : ajuster l'icône à l'intérieur du bouton */
.round-button i {
    font-size: 24px;          /* Ajuste la taille de l'icône selon ton besoin */
}


/*----------------------------------------*/
/* Typos
/*----------------------------------------*/


@font-face {
	font-family:'Catamaran-Black';
	src: url('/wp-content/typo/Catamaran-Black.eot');
	src: url('/wp-content/typo/Catamaran-Black.eot?#iefix') format('embedded-opentype'),
	     url('/wp-content/typo/Catamaran-Black.woff') format('woff'),
	     url('/wp-content/typo/Catamaran-Black.ttf') format('truetype'),
	     url('/wp-content/typo/Catamaran-Black.svg#Catamaran-Black') format('svg');
        font-weight: normal;
        font-style: normal;
}



@font-face {
	font-family:'Catamaran-Bold';
	src: url('/wp-content/typo/Catamaran-Bold.eot');
	src: url('/wp-content/typo/Catamaran-Bold.eot?#iefix') format('embedded-opentype'),
	     url('/wp-content/typo/Catamaran-Bold.woff') format('woff'),
	     url('/wp-content/typo/Catamaran-Bold.ttf') format('truetype'),
	     url('/wp-content/typo/Catamaran-Bold.svg#Catamaran-Bold') format('svg');
}

@font-face {
	font-family:'Catamaran-Light';
	src: url('/wp-content/typo/Catamaran-Light.eot');
	src: url('/wp-content/typo/Catamaran-Light.eot?#iefix') format('embedded-opentype'),
	     url('/wp-content/typo/Catamaran-Light.woff') format('woff'),
	     url('/wp-content/typo/Catamaran-Light.ttf') format('truetype'),
	     url('/wp-content/typo/Catamaran-Light.svg#Catamaran-Light') format('svg');
}

@font-face {
	font-family:'Catamaran-Regular';
	src: url('/wp-content/typo/Catamaran-Regular.eot');
	src: url('/wp-content/typo/Catamaran-Regular.eot?#iefix') format('embedded-opentype'),
	     url('/wp-content/typo/Catamaran-Regular.woff') format('woff'),
	     url('/wp-content/typo/Catamaran-Regular.ttf') format('truetype'),
	     url('/wp-content/typo/Catamaran-Regular.svg#Catamaran-Regular') format('svg');
}



@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('/wp-content/typo/glyphicons-halflings-regular.eot');
  src: url('/wp-content/typo/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/wp-content/typo/glyphicons-halflings-regular.woff2') format('woff2'), 
       url('/wp-content/typo/glyphicons-halflings-regular.woff') format('woff'), url('/wp-content/typo/glyphicons-halflings-regular.ttf') format('truetype'), 
	   url('/wp-content/typo/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}


@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('/wp-content/typo/glyphicons-halflings-regular.eot');
  src: url('/wp-content/typo/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('/wp-content/typo/glyphicons-halflings-regular.woff2') format('woff2'), 
       url('/wp-content/typo/glyphicons-halflings-regular.woff') format('woff'), url('/wp-content/typo/glyphicons-halflings-regular.ttf') format('truetype'), 
	   url('/wp-content/typo/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}





/*********************************************/
/*****************BACKGROUND********************/
/**********************************************/

.bckg-gradient {
	/*background: linear-gradient(to right, #83b953, #3e9864 75%, 100%, #333 75%);*/
    background: linear-gradient(to left, #00aa8d, #477ec0 95%, 100%, #333 65%);
}



.bckg-gradient-environnement {
	background: linear-gradient(to right, #83b953, #3e9864 75%, 100%, #333 75%);   
}


.bg-light {
	    background-color: #f3f3f3!important;
}

#bckg-gradient-agenda {
-webkit-clip-path: polygon(56% 3%, 100% 14%, 93% 48%, 38% 58%, 4% 44%, 0 17%);
clip-path: polygon(56% 3%, 100% 14%, 93% 48%, 38% 58%, 4% 44%, 0 17%);
background: linear-gradient(to right, #83b953, #3e9864 75%, 100%, #333 75%);	
width:200px;
height:150px;
}


.bg-primary {
    background-color: #003f51 !important;
}


.bg-secondary {
   background-color: #ddde3a !important;
}


.bg-tertiary {
   background-color: #0eb6a0 !important;
}


/****************************************************/
/*******************OFFCANVAS**************************/
/*****************************************************/

.offcanvas-close {
  background-color: white;
  background-image: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e");
  background-position: center;
  background-size: 1em auto;
  background-repeat: no-repeat;
}


.menu-icon {
            transition: transform 0.3s ease;
        }

        .menu-icon.menu-icon-open {
            transform: rotate(90deg);
        }
		
		.offcanvas-close {
		  position: absolute;
		  top: 0;
		  right: 0;
		  margin: 0;
		  border: none;
		}
		


 .btn-left-align {
        text-align: left;
 }
    
.menu-item {
        font-size: 18px; /* Modifier la taille de police selon vos besoins */
		color:#fff;
}



.menu-item li {
  display: inline-block;
  margin-right: 10px;
}

.menu-item li a {
  color: pink;
  text-decoration: none;
  transition: color 0.3s;
}

.menu-item li a:hover {
  color: red;
}


.menu-icon.menu-icon-open {
  transform: rotate(90deg);
}


.collapsed .submenu {
  display: block;
}

.menu-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 10px;
  text-align: center;
  vertical-align: middle;
}


.list-group-item:hover {
     color: #96c13c;
    font-size: 1.5rem;
}

    
.submenu {
        padding-left: 20px; 
 }


 ul.list-unstyled li {
        list-style-type: none; /* Supprimer les puces par défaut */
}


.btn-primary {
    color: #fff;
    background-color: #003f51 ;
    border-color: #003f51 ;
}


.offcanvas {
height: 100%;
}
	
	
.offcanvas.active {
  transform: translateX(0);
}

.offcanvas-content {
  /* Styles du contenu du offcanvas */
}

.close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  padding: 5px 10px;
  color:#fff;
  border: none;
  cursor: pointer;
}

.close-button:hover {
  color: #fff;
}

.btn-offcanvas {
    color: #fff;
    font-size: 1.5rem;
   
}


.custom-img {
  height: 200px; /* Définissez la hauteur souhaitée */
  object-fit: cover; /* Ajuste l'image pour remplir le conteneur en conservant les proportions */
}




.round-button {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    display: flex;
    justify-content: center;
    align-items: center;
}

.round-button i {
    margin: 0; /* Reset any default margin on the icon */
}


.offcanvas {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 0, 0, 0.7); /* Fond semi-transparent */
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow-y: auto;
	overflow-x: hidden; /* Masque le défilement horizontal */
}



/*********************************************/
/*****************STYLES TITRES*********************/
/**********************************************/


h1, .h1 {
color: #1a999f;
font-size:1.7rem;
font-family:'Catamaran-bold';
}


h2, h3, .h2 , .h3{
color: #1a999f;
font-family:'Catamaran-bold';
font-size:1.5rem;
}



h4, h6, .h3, .h4, .h6 {
     color: #96c13c;
}


h5, .h5 {
     color: #1bb9a1;
}


h6 {
	font-size:0.8rem;
}


.display-4 {
    font-size: 2rem;
    font-weight: 300;
    line-height: 1.2;
}



.with-vertical-bar::before {
    content: '';
    display: inline-block;
    width: 7px; 
    height: 30px; 
    margin-right: 15px;
	background: #0eb6a0;
}

p {
    text-align: justify;
}

h1, h2, h3, h4, h5, h6 {
    text-align: left; /* ou center si tu veux les centrer */
}

.content p {
    text-align: justify;
}

.content h1, .content h2, .content h3, .content h4, .content h5, .content h6 {
    text-align: left;
}

p strong, p b {
    font-weight: 700 !important;
    font-family: 'Catamaran-Bold';
}


/***************************************************/
/*****************STYLES CONTENT*********************/
/**************************************************/

.content a[href$=".pdf"] {
    position: relative;
    display: inline-block;    
    color: #666;
    text-decoration: none;
    padding-left: 47px;     
	vertical-align: top;
	line-height:2.2;
}

.content a[href$=".pdf"]::before {
    position: absolute;
    top:0;
    left: 0; 
    content: "\f019";
    font-family: "FontAwesome";  
    color: #fff;
    background-color: #1a999f;   
    border-radius: 50%;
    margin-right: 8px; /* Ajoute une marge à droite de l'icône */
	width:32px;
	height:32px;
	padding: 0px 7px;
	margin-left:10px;
	vertical-align: top; 	
}


.content ul li {
    list-style: none;
    padding: .2rem 0 .2rem 1rem;
    position: relative;	
}

.content ul li::before {
    content: "\f105"; 
    font-family: "Font Awesome 5 Free"; 
    font-weight: 900; 
    position: absolute; 
    left: 0; 
    top: 0; 
    margin-top: 2px;
    color: #1a999f;
}


.content a {
    text-transform: none;
    position: relative;
    text-decoration: underline;
   
}

.content a:hover {
    text-transform: none;
    position: relative;
    text-decoration: underline;    
	color:#1a999f;
}


.no-pdf-style a[href$=".pdf"] {
  position: static !important;
  display: inline !important;
  color: inherit !important;
  text-decoration: underline !important;
  padding-left: 0 !important;
  vertical-align: baseline !important;
  line-height: normal !important;
}

.no-pdf-style a[href$=".pdf"]::before {
  content: none !important;
  display: none !important;
}



p.encadre {
    
	font-size: 1.5rem;
    font-weight: 300;
    font-style: normal;
    background-color: rgba(0,63,81,0.9);
    color: #fff;
    display: block;
    margin: 30px 0px 50px 0px;
    max-width: 100%;
    min-height: 125px;
    padding: 30px 40px 30px 142px;
    position: relative;
	
	
	
}

p.encadre::before {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 102px;
    background-color: rgba(0,63,81,0.5);   
    background-image: url(data:image/svg+xml,%3Csvg%20fill%3D%22%23fff%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20viewBox%3D%220%200%20352%20512%22%3E%3Cpath%20d%3D%22M176%2080c-52.94%200-96%2043.06-96%2096%200%208.84%207.16%2016%2016%2016s16-7.16%2016-16c0-35.3%2028.72-64%2064-64%208.84%200%2016-7.16%2016-16s-7.16-16-16-16zM96.06%20459.17c0%203.15.93%206.22%202.68%208.84l24.51%2036.84c2.97%204.46%207.97%207.14%2013.32%207.14h78.85c5.36%200%2010.36-2.68%2013.32-7.14l24.51-36.84c1.74-2.62%202.67-5.7%202.68-8.84l.05-43.18H96.02l.04%2043.18zM176%200C73.72%200%200%2082.97%200%20176c0%2044.37%2016.45%2084.85%2043.56%20115.78%2016.64%2018.99%2042.74%2058.8%2052.42%2092.16v.06h48v-.12c-.01-4.77-.72-9.51-2.15-14.07-5.59-17.81-22.82-64.77-62.17-109.67-20.54-23.43-31.52-53.15-31.61-84.14-.2-73.64%2059.67-128%20127.95-128%2070.58%200%20128%2057.42%20128%20128%200%2030.97-11.24%2060.85-31.65%2084.14-39.11%2044.61-56.42%2091.47-62.1%20109.46a47.507%2047.507%200%200%200-2.22%2014.3v.1h48v-.05c9.68-33.37%2035.78-73.18%2052.42-92.16C335.55%20260.85%20352%20220.37%20352%20176%20352%2078.8%20273.2%200%20176%200z%22%3E%3C%2Fpath%3E%3C%2Fsvg%3E);
    background-position: center 3rem;
    background-repeat: no-repeat;
    background-size: 35px 51px;
    content: "";
    display: block;
}



.letter-spacing {
	letter-spacing:2px;
	
}


.alert-danger {
    color: #ffffff;
    background-color: #ab010d;
    border-color: none;
}
.alert {
    padding: 10px;
    margin-bottom: 20px;
    border: 1px solid transparent;
    border-radius: 4px;
}


#annule{
	position:absolute;
	top:170px;
	left:80px;
	padding-right:20px;
	padding-left:20px;
	padding-bottom:5px;
	z-index:200;
	background:#fff;
	color:red;
	transform: rotate(-20deg);
	border-radius:10px;
	border-style:solid 10px;
	border-color: rgba(229, 2, 3, 1);
}



/*----------------------------------------*/
/* Colors TEXT
/*----------------------------------------*/

a {
    color: #fff;
    text-decoration: none;
    background-color: transparent;
}

a {
  /*color: #96c13c;*/
  color: inherit;
  text-decoration: none;
  
}

a:hover,
a:focus {
  color: #96c13c;
  color: inherit;
  text-decoration: none;
}

a:focus {
  outline: 5px auto -webkit-focus-ring-color;
  outline-offset: -2px;
}


.text-primary {
    color: #023f51 !important;
}

.text-secondary {
    color: #2ea79b!important;	
    font-family: 'Catamaran-Bold';
}

.text-tertiary {
    color: #1bb9a1!important;
}

.text-icon {
    color: #1a999f!important;
}



a[target="_blank"] {
   
	color:#023f51;
	 font-weight:bold;
	 text-decoration:none;
	
}



a[target="_enunclic"] {
   
	color:#ffffff;

}

a[target="_publication"] {
   
	color:#96c13c;
	 font-weight:bold;
	 text-decoration:none;
	
}

a[target="_publication"]:hover {
   
	color:#96c13c;
	 font-weight:bold;
	 text-decoration:none;
	
}


/*********************************************/
/*******************CARDS***********************/
/************************************************/
.card {
  /*margin-bottom: 20px;
  background-color: #fff;
  border: 1px solid transparent;
  border-radius: 0px;
  -webkit-box-shadow: 0 1px 1px rgba(0, 0, 0, .05);
  box-shadow: 0 1px 1px rgba(0, 0, 0, .05);*/
  
  /*background: linear-gradient(to right, #11b7a0, #59c8a7, 100%, #333 75%) border-box;*/
   
    /*border-bottom: solid transparent;*/
  
  /*max-height: 380px; /* Ajustez la valeur en fonction de vos besoins */
  /*overflow: hidden;*/
  border-radius: 0px;
  border-bottom: 8px solid #1a999f;
   
}



.card-header {
    padding: .5rem 1rem;
    margin-bottom: 0;
    background-color: rgba(0, 0, 0, .03);
    /*border-bottom: 0px solid rgba(0, 0, 0, .125);*/
}





/*********************************************/
/*****************BOUTONS*********************/
/**********************************************/

.btn-check:active+.btn-outline-primary, .btn-check:checked+.btn-outline-primary, .btn-outline-primary.active, .btn-outline-primary.dropdown-toggle.show, .btn-outline-primary:active {
    color: #fff;
    background-color: #003f51 ;
    border-color: #003f51 ;
}




.btn-secondary {
    color: #fff;
    background-color: #0eb6a0;
    border-color: #0eb6a0;
	border-radius:0px;
}



.btn-info {
    color: #fff;
    background-color: #96c13c;
    border-color: #96c13c;
}

.btn-info:hover{
	background-color:#96c13c;
	border-color:#96c13c
	opacity : 0.5
}


.btn-outline-light:hover {
    color: #fff;
    background-color: transparent;
    border-color: #fff;
}


.btn-light:hover {
    color: #fff;
    background-color: #023f51;
    border-color: #023f51;
}





.btn {
    color: inherit;
}


.btn:link, .btn:hover, .btn:visited, .btn:active {
	
	color: #ffffff;  
	

}



.btn-outline-primary, .btn-outline-primary:hover {
  color: #2ea79b;
  background: #ffffff;
  border-color: #2ea79b;
}


.btn-outline-secondary, .btn-outline-secondary:hover {
    color: #fff;
    background: transparent;
    border-color: #fff;
}



.btn-lg,
.btn-group-lg > .btn {
  padding: 30px 30px 30px 30px;
  font-size: 18px;
  line-height: 1.3333333;
  border-radius: 0px;
}


/* Supprime la flèche par défaut de Bootstrap */
.accordion-button::after {
    background-image: none !important; /* Désactive l'icône par défaut */
    font-family: "Font Awesome 6 Free"; /* Assure l'utilisation de FontAwesome */
    font-weight: 900;
    content: "+"; /* Icône FontAwesome "+" */
    font-size: 1.2rem;
    color: white !important; /* Assure une couleur blanche */
    transition: transform 0.3s ease-in-out;
    display: inline-block;
}

/* Change le "+" en "-" lorsque l'accordéon est ouvert */
.accordion-button:not(.collapsed)::after {
    content: "\f068"; /* Icône FontAwesome "-" en code unicode */
    font-family: "Font Awesome 6 Free"; /* Assure l'utilisation de FontAwesome */
}

 /*******************************/
 /**********BADGE*********/
 /********************************/

.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #023f51;
    border-radius: 0px;
	list-style: none;
	margin-left: 20px;
	text-transform: uppercase; 
}




.badge {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #96c13c;
    border-radius: 3px;
	list-style: none;
	margin-left: 20px;
}


.badge-demos {
    display: inline-block;
    min-width: 10px;
    padding: 3px 7px;
    font-size: 12px;
    font-weight: bold;
    line-height: 1;
    color: #fff;
    text-align: center;
    white-space: nowrap;
    vertical-align: middle;
    background-color: #284889;
    border-radius: 3px;
	list-style: none;
	margin-left: 20px;
}


/********************************************************/
/*****************carousel header a la une*************/
/********************************************************/

  /* Style par défaut pour les grands écrans */
  .carousel-item header {
    width: 100vw;
    height: 420px; /* Hauteur par défaut */
    position: relative;
    overflow: hidden; /* S'assure que la vidéo ou l'image ne dépasse pas */
  }

  /* Style pour les vidéos */
  .carousel-item video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 420px;
    object-fit: cover; /* Garde la vidéo en mode "cover" */
    z-index: 1;
  }

  /* Style pour les images */
  .carousel-item .background-image {
    background-size: cover;
    background-position: center;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
  }

  /* Media query pour les écrans plus petits (inférieurs à 728px) */
  @media (max-width: 728px) {
    .carousel-item header {
      height: 300px; /* Hauteur réduite pour les petits écrans */
    }
  }

  /* Contenu textuel en superposition */
  .carousel-item .content {
    position: absolute;
    z-index: 2; /* Le texte doit être au-dessus de la vidéo ou de l'image */
  }
	
	
	@media (min-width: 768px) {
    .carousel-item .content {
        bottom: 60px; /* Appliqué uniquement à partir des écrans >= 992px */
    }
}
	
	
	
	
	
/****************************************/
/*********MASONRY-GRID******************/
/**********************************/
	
	
.card-img-top {
    width: 100%;
    height: auto; 
	object-fit: cover; /* Recadre l'image pour qu'elle remplisse l'espace sans déformation */
}

/* Styles pour les cartes */
.card {
    flex: 1 1 calc(25% - 1rem); /* Quatre cartes par ligne */
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    box-sizing: border-box; /* Pour un calcul correct des dimensions */
}
	
.masonry-grid {
	position: relative;
    width: 100%;
    /*height: 1078.72px;*/
	display: flex;
    flex-wrap: wrap;
    gap: 1rem; /* Ajustez l'espace entre les éléments */
}


@media (max-width: 768px) {
    .card {
        flex: 1 1 calc(50% - 1rem); /* 2 cartes par ligne sur petits écrans */
    }
}

@media (max-width: 480px) {
    .card {
        flex: 1 1 100%; /* 1 carte par ligne sur très petits écrans */
    }
}
	
	


/************************************************/
/***************** The sidebar menu**************/
/***********************************************/

.sidebar
{
    height:250px;
    padding:15px;
}
.stick {
    position: fixed;
    /*width: 26.7%;*/
	width:340px;
    top: 140px;
}

.abs {
    position: absolute;
    bottom: 0px;
    width: 92.5%;
}

.submenu-item{
    padding-left:20px;
}






/*********************************************/
/*****************AGENDA*********************/
/**********************************************/

.owl-prev, .owl-next {
    font-size: 24px; /* Ajustez la taille de la police selon vos besoins */
    color: #000000; /* Couleur des flèches */
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.owl-prev {
    left: 0;
}

.owl-next {
    right: 0;
}

.small-round-button {
	  width: 45px;
	  height: 45px;  
	  padding: 0;
	  border-radius: 50%;
	  margin-right:10px;
	}


.event-dates {
	  position: absolute;
	  top: 0px;
	  left: 0;
	  color: white;
	  font-size: 14px;
}



 /* Centrage des dates et de la flèche */
  .date-range {
    display: flex;
    justify-content: center;
    align-items: center; /* Centrer verticalement les éléments */
  }

  
  /* Centrer la flèche */
  .arrow {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0 15px; /* Espace autour de la flèche */
  }

  /* Style de la flèche */
  .arrow i {
    font-size: 24px;
    color: #333;
  }





/****************************************************************/
/**************************OVERLAY*********************************/
/****************************************************************/

	.image-container {
		position: relative;
		overflow: hidden; /* Empêche l'overlay de sortir du conteneur */
	}

	.overlay {
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(14, 182, 160, 0.7); /* Couleur de fond de l'overlay */
		opacity: 0; /* Opacité initiale (invisible) */
		transition: opacity 0.3s ease; /* Transition pour une animation fluide */
		display: flex;
		justify-content: center;
		align-items: center;
		color: #fff; /* Couleur du texte de l'overlay */
		font-size: 24px; /* Taille de police du texte de l'overlay */
		box-sizing: border-box; /* Inclure la taille des bordures et du padding dans la largeur et la hauteur */
		padding: 0px; /* Espace autour du contenu de l'overlay */
		margin:0px;
	}

	.overlay i {
		font-size: 36px; /* Taille de l'icône */
	}

	/* Style pour l'image */
	.image-container img {
		display: block;
		width: 100%;
		height: 100%;
		object-fit: cover; /* Ajuste la taille de l'image pour couvrir tout le conteneur */
	}

	/* Style pour le lien */
	.image-container a {
		display: block;
		width: 100%;
		height: 100%;
	}

	.image-container:hover .overlay {
		opacity: 1; /* Rendre l'overlay visible au survol */
	}




/*----------------------------------------*/
/*FORMULAIRE CONTACT
/*----------------------------------------*/

.wpcf7 label {
	display: block;
	width: 100%;
}

.wpcf7 input, .wpcf7 select, .wpcf7 textarea, .wpcf7 text{
	display: block;
	width: 100%;
	padding: 0.5rem 0.75rem;
	font-size: 1rem;
	line-height: 1.25;
	color: #464a4c;
	background-color: #fff;
	background-image: none;
	-webkit-background-clip: padding-box;
	background-clip: padding-box;
	border: 1px solid rgba(0, 0, 0, 0.15);
	border-radius: 0.25rem;
	-webkit-transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
	transition: border-color ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
	-o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
	transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
	transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s, -webkit-box-shadow ease-in-out 0.15s;
}

.wpcf7 textarea::-ms-expand, .wpcf7 input::-ms-expand {
	background-color: transparent;
	border: 0;
}

.wpcf7 select:focus, .wpcf7 textarea:focus, .wpcf7 input:focus {
	color: #464a4c;
	background-color: #fff;
	border-color: #5cb3fd;
	outline: none;
}

.wpcf7 textarea::-webkit-input-placeholder, .wpcf7 input::-webkit-input-placeholder {
	color: #636c72;opacity: 1;
}

.wpcf7 textarea::-moz-placeholder, .wpcf7 input::-moz-placeholder {
	color: #636c72;
	opacity: 1;
}

.wpcf7 textarea:-ms-input-placeholder, .wpcf7 input:-ms-input-placeholder {
	color: #636c72;
	opacity: 1;
}

.wpcf7 textarea::placeholder, .wpcf7 input::placeholder {
	color: #636c72;
	opacity: 1;
}

.wpcf7 textarea:disabled, .wpcf7 textarea[readonly], .wpcf7 input:disabled, .wpcf7 input[readonly] {
	background-color: #eceeef;
	opacity: 1;
}

.wpcf7 textarea:disabled, .wpcf7 input:disabled {
	cursor: not-allowed;
}

select.wpcf7 textarea:not([size]):not([multiple]), select.wpcf7 input:not([size]):not([multiple]) {
	height: calc(2.25rem + 2px);
}

select.wpcf7 textarea:focus::-ms-value, select.wpcf7 input:focus::-ms-value {
	color: #464a4c;
	background-color: #fff;
}

.wpcf7 input[type="submit"] {
	cursor: pointer !important;
	margin-top: 0.5rem;
	display: inline-block;
	font-weight: normal;
	line-height: 1.25;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	display: block;
	width: 100%;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	border: 1px solid transparent;
	padding: 0.5rem 1rem;
	font-size: 1rem;
	border-radius: 0.25rem;
	-webkit-transition: all 0.2s ease-in-out;
	-o-transition: all 0.2s ease-in-out;
	transition: all 0.2s ease-in-out;
	color: #292b2c;
	background-color: #96c13c;
	border-color: #ccc;
}

.wpcf7 input[type="submit"]:focus, .wpcf7 input[type="submit"]:hover {text-decoration: none;}
.wpcf7 input[type="submit"]:focus, .wpcf7 input[type="submit"].focus {outline: 0;-webkit-box-shadow: 0 0 0 2px rgba(2, 117, 216, 0.25);box-shadow: 0 0 0 2px rgba(2, 117, 216, 0.25);}
.wpcf7 input[type="submit"].disabled, .wpcf7 input[type="submit"]:disabled {cursor: not-allowed;opacity: .65;}
.wpcf7 input[type="submit"]:active, .wpcf7 input[type="submit"].active {background-image: none;}
.wpcf7 input[type="file"]{border: 0 !important;}
.wpcf7 input[type="checkbox"]{display:inline;width:auto;-webkit-box-sizing: border-box;box-sizing: border-box;padding: 0;}



/* Enveloppement personnalisé autour du bouton radio */
.wpcf7 .radio-wrapper {
    display: inline-block;
    margin-right: 8px;
}

.wpcf7 input[type="radio"] {
    display: inline-block;
    vertical-align: middle;
}




/* Paramètres globaux */
body {
  font-family: 'Catamaran', sans-serif; /* Utilisation de la police Catamaran */
  line-height: 1.6; /* Espacement entre les lignes */
  color: #666; /* Couleur du texte (gris foncé pour améliorer la lisibilité) */
  margin: 0; /* Retirer les marges par défaut */
  padding: 0; /* Retirer les paddings par défaut */
}

/* Titres principaux */
h1, h2, h3 {
  font-family: 'Catamaran', sans-serif; /* Police Catamaran */
  font-weight: 700; /* Poids gras pour les titres */
  color: #2ea79b; /* Couleur plus foncée pour les titres */
  letter-spacing: 1px; /* Espacement des lettres */
  /*text-transform: uppercase; /* Mise en majuscule pour les titres */
  margin-bottom: 20px; /* Espacement sous les titres */
}

/* Taille des titres */
h1 {
  font-size: 3rem; /* Taille du H1 */
  line-height: 1.2;
}

h2 {
  font-size: 2.5rem; /* Taille du H2 */
  line-height: 1.3;
}

h3 {
  font-size: 2rem; /* Taille du H3 */
  line-height: 1.4;
}

/* Sous-titres */
h4, h5 {
  font-family: 'Catamaran', sans-serif; /* Police Catamaran pour les sous-titres */
  font-weight: 600; /* Poids semi-gras pour les sous-titres */
  color: #2ea79b; /* Gris moyen */
  letter-spacing: 0.5px; /* Espacement léger des lettres */
  margin-bottom: 15px; /* Espacement sous les sous-titres */
}

/* Taille des sous-titres */
h4 {
  font-size: 1.75rem; /* Taille du H4 */
}

h5 {
  font-size: 1.5rem; /* Taille du H5 */
}

/* Paragraphe */
p {
  font-size: 1rem; /* Taille du texte de base */
  line-height: 1.8; /* Espacement entre les lignes du texte */
  margin-bottom: 15px; /* Espacement entre les paragraphes */
}

/* Liens */
a {
  text-decoration: none; /* Retirer le soulignement */
}

a:hover {
  text-decoration: underline; /* Souligner les liens au survol */
  color: #2ea79b; /* Couleur du lien au survol */
}

/* Espacement global */
h1, h2, h3, h4, h5, p {
  margin-left: 0px;
  margin-right: 0px;
}

.breadcrumb a {
    color: white !important;
    text-decoration: none;
}

.breadcrumb a:hover,
.breadcrumb a:focus,
.breadcrumb a:active {
    color: white !important;
    text-decoration: underline; /* Optionnel : ajoute un soulignement au survol */
}


.tooltip-inner {
    background-color: #2ea79b; /* Rouge tomate par exemple */
    color: white; /* Texte blanc */
  }

/* Changer la couleur de la bordure du tooltip (facultatif) */
  .tooltip.bs-tooltip-top .tooltip-arrow::before {
    border-top-color: #2ea79b; /* Rouge tomate */
  }
  .tooltip.bs-tooltip-right .tooltip-arrow::before {
    border-right-color: #2ea79b; /* Rouge tomate */
  }
  .tooltip.bs-tooltip-bottom .tooltip-arrow::before {
    border-bottom-color: #2ea79b; /* Rouge tomate */
  }
  .tooltip.bs-tooltip-left .tooltip-arrow::before {
    border-left-color: #2ea79b; /* Rouge tomate */
  }



/* --- Responsive Design --- */

/* Tablettes (écrans entre 600px et 1024px) */
@media (max-width: 1024px) {
  h1 {
    font-size: 2.5rem; /* Réduire la taille du H1 */
  }

  h2 {
    font-size: 2.2rem; /* Réduire la taille du H2 */
  }

  h3 {
    font-size: 1.8rem; /* Réduire la taille du H3 */
  }

  h4 {
    font-size: 1.5rem; /* Réduire la taille du H4 */
  }

  h5 {
    font-size: 1.3rem; /* Réduire la taille du H5 */
  }

  p {
    font-size: 0.95rem; /* Réduire la taille du texte de base */
  }
}

/* Smartphones (écrans jusqu'à 600px) */
@media (max-width: 600px) {
  h1 {
    font-size: 2rem; /* Taille encore plus petite pour les petits écrans */
  }

  h2 {
    font-size: 1.8rem; /* Ajuster la taille du H2 */
  }

  h3 {
    font-size: 1.5rem; /* Ajuster la taille du H3 */
  }

  h4 {
    font-size: 1.3rem; /* Ajuster la taille du H4 */
  }

  h5 {
    font-size: 1.2rem; /* Ajuster la taille du H5 */
  }

  p {
    font-size: 0.9rem; /* Réduire la taille du texte de base pour petits écrans */
  }

  /* Ajustement des marges pour plus de lisibilité sur petits écrans */
  h1, h2, h3, h4, h5, p {
    margin-left: 10px;
    margin-right: 10px;
  }
}


/* Style général du chapô */
.chapo {
  font-family: 'Catamaran', sans-serif; /* Police Catamaran */
  font-weight: 500; /* Poids moyen pour une lecture fluide */
  font-size: 1.5rem; /* Taille légèrement plus grande que le texte normal */
  line-height: 1.7; /* Espacement des lignes pour une bonne lisibilité */
  color: #2C3E50; /* Couleur du texte plus foncée pour plus de contraste */
  margin-bottom: 20px; /* Espacement sous le chapô */
  padding: 15px 20px; /* Marges internes pour donner de l'espace */
  /*border-left: 4px solid #3498DB; /* Bordure bleue à gauche pour le style */
  /*border-radius: 8px; /* Coins arrondis pour un effet plus doux */
  text-align: justify; /* Justification du texte pour une présentation soignée */
}

.chapo {
    display: flex;
    flex-direction: row;  /* Disposition en ligne pour l'image et le texte */
    align-items: center;  /* Alignement vertical centré */
    width: 100%;  /* Prendre toute la largeur disponible */
    max-width: 100%;  /* Fixer une largeur maximale */
    
}

.chapo img {
    width: 800px;  /* Largeur fixe */
    height: 200px; /* Hauteur fixe */
    object-fit: cover; /* Assure que l'image couvre bien le conteneur sans déformation */
}


.chapo-text {
    font-size: 16px; /* Taille de police fixe */
    line-height: 1.5; /* Hauteur de ligne pour le confort de lecture */
    color: #666; /* Couleur du texte */
    text-align: justify; /* Alignement justifié du texte */
    max-width: 60%; /* Limite la largeur du texte à 60% de son conteneur */
    width: 100%; /* Garantir que le texte prend toute la largeur disponible jusqu'à la limite définie */
    margin-left: 15px; /* Ajouter un petit espace entre le texte et l'image */
}

/* Style du chapô en format plus mobile-friendly */
@media (max-width: 600px) {
  .chapo {
    font-size: 1.1rem; /* Réduire la taille sur les petits écrans */
    padding: 10px 15px; /* Réduire les espacements pour les petits écrans */
    margin-bottom: 15px; /* Réduire l'espacement sous le chapô */
  }
}




/*----------------------------------------*/
/* Concours vitrines
/*----------------------------------------*/


.scrollup {
    position: fixed;   /* Fixe le bouton en bas à droite */
    right: 30px;       /* Décalage par rapport au bord droit */
    bottom: 20px;      /* Décalage par rapport au bas de la page */
    display: none;     /* Cacher initialement le bouton */
    z-index: 999999999999;     /* Assurer que le bouton reste au-dessus des autres éléments */
}

.scrollup button {
    border: none;
    outline: none;
    background-color: #333; /* Couleur de fond du bouton */
    color: #fff;            /* Couleur du texte (ici l'icône) */
    width: 50px;            /* Largeur du bouton */
    height: 50px;           /* Hauteur du bouton */
    border-radius: 50%;     /* Bordure arrondie pour un bouton circulaire */
    font-size: 20px;        /* Taille de l'icône */
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;       /* Curseur pointeur pour montrer que c'est cliquable */
}

.scrollup button:hover {
    background-color: #96c13c; /* Changer la couleur de fond au survol */
}

.scrollup i {
    font-size: 24px; /* Taille de l'icône */
}




.participant-gallery {
    display: flex;
    flex-wrap: wrap;
    gap: 10px; /* Espace entre les images */
}

.participant-gallery .gallery-item {
    flex: 1 1 30%; /* Ajustez la taille des images selon vos besoins */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    border-radius: 5px;
    overflow: hidden;
}

.participant-gallery img {
    display: block;
    width: 100%; /* Les images remplissent l'espace de leur conteneur */
    height: auto; /* Garder le ratio */
}



/***********************************************/
/************SWIPER*****************************/
/***********************************************/
  
    .swiper-container {
      width: 100%; 
      max-width: 1300px; 
      margin: 0 auto; 
	  /*overflow: hidden;*/
	 position:relative;
    }
		
	
    .swiper-slide {
      display: flex;
      justify-content: center;
      align-items: center;
    }
	
	

.swiper-button-prev::after,
.swiper-button-next::after {
    content: none;
}



.swiper-button-prev,
.swiper-button-next {
  width: 50px;          
  height: 50px;         
  background-color: #0eb6a0; 
  color: #fff;          
  border: 0;            
  outline: none;        
  padding: 0;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 6px rgba(0,0,0,0.1);
}


.swiper-button-prev svg,
.swiper-button-next svg {
  width: 60%;    
  height: 60%;
}

.swiper-button-prev:hover,
.swiper-button-next:hover {
  background-color: var(--bg-tertiary-hover); 
}

/* Réduction taille sur mobile */
@media (max-width: 576px) {
  .swiper-button-prev,
  .swiper-button-next {
    width: 24px;
    height: 24px;
  }
}





/*************************************************************/
/************gestion des cards *******************************/
/**************************************************************/
	
			
    .card {
		  background-color: white;
		  border: 1px solid #ddd;
		  border-radius: 10px;
		  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
		  display: flex;
		  flex-direction: column;
		  align-items: center;
		  justify-content: flex-start; 
		  text-align: center;
		  padding: 0px;
		  margin: 0px;
		  transition: transform 0.3s ease;
		}
	  
	  .card:hover {
      transform: translateY(-10px);
    }

.card img {
  object-fit: cover;
  margin-bottom: 10px;
}

.card h3 {
  font-size: 18px;
  margin: 10px 0;
}

.card p {
  font-size: 14px;
  color: #666;
}

.event-dates {
  display: flex;
  justify-content: center; /* Centrer horizontalement */
  align-items: center; /* Centrer verticalement */
  margin-bottom: 15px; /* Ajouter de l'espace entre les dates et le titre */
  top: 30px;  /* Position verticale */
  left: 40%;  /* Positionne l'élément à 50% de la largeur de son conteneur */
  transform: translateX(-50%); 
}

.badge-event {
  background-color: #0eb6a0; /* Couleur de fond */
   color: #fff;
  padding: 0px;
  font-size: 22px;
  font-weight: bold;
  text-align: center;
  border: 0px solid #ddd;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  margin: 0 10px;
  display: inline-block;
  width: 75px;
  height: 75px;
  line-height: 1; /* Centrer verticalement le texte */
  clip-path: polygon(50% 0%, 83% 12%, 100% 43%, 94% 78%, 68% 100%, 32% 100%, 6% 78%, 0% 43%, 17% 12%);
}

  .complet-overlay {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(-10deg);
  background-color: rgba(255, 0, 0, 0.8);
  color: white;
  font-size: 24px;
  font-weight: bold;
  padding: 10px 20px;
  border-radius: 5px;
  text-transform: uppercase;
  z-index: 10;
}


.card {
  /*height: 450px; */
  overflow: hidden;
}
.card-img-top {
  width: 100%;
  height: 100%;
  object-fit: cover;
}









/********************************/
/*****Couleur par direction**********/
/*************************************/

:root {
    --color-culture: #892ea7;
    --color-sport: #0c2d69;	
	
	/* Logos */
    --logo-default: url('logo.png');
    --logo-culture: url('logo-culture.png');
    --logo-sport: url('logo-sport.png');
}

/* Tous les titres avec data-theme utilisent Catamaran-Black */
h1[data-theme],
h2[data-theme],
h3[data-theme] {
    font-family: 'Catamaran-Black', sans-serif !important;
    margin-bottom: 20px;
    letter-spacing: 1px;
}

/* Couleur selon la direction */
h1[data-theme="culture"],
h2[data-theme="culture"],
h3[data-theme="culture"] {
    color: var(--color-culture) !important;
}

h1[data-theme="sport"],
h2[data-theme="sport"],
h3[data-theme="sport"] {
    color: var(--color-sport) !important;
}


/* BOUTON CULTURE */
.btn-theme-culture {
    color: #fff;
    background-color: var(--color-culture);
    border-color: var(--color-culture);
}

.btn-theme-culture:hover,
.btn-theme-culture:focus {
    background-color: var(--color-culture);
    border-color: var(--color-culture);
    opacity: 0.8;
}

/* Version outline */
		
.btn-outline-culture {
    color: var(--color-culture) !important;
    background-color: transparent !important;
    border: 2px solid var(--color-culture) !important;
}

.btn-outline-culture:hover,
.btn-outline-culture:focus {
    background-color: var(--color-culture) !important;
    color: #fff !important;
}	




/* BOUTON SPORT */
.btn-theme-sport {
    color: #fff;
    background-color: var(--color-sport);
    border-color: var(--color-sport);
}

.btn-theme-sport:hover,
.btn-theme-sport:focus {
    background-color: var(--color-sport);
    border-color: var(--color-sport);
    opacity: 0.8;
}

/* Version outline */
.btn-outline-sport {
    color: var(--color-sport);
    background-color: transparent;
    border: 2px solid var(--color-sport);
}

.btn-outline-sport:hover,
.btn-outline-sport:focus {
    background-color: var(--color-sport);
    color: #fff;
}



/* Logo par défaut */
header img.logo {
    content: var(--logo-default);
}

/* Logo culture */
header[data-theme="culture"] img.logo {
    content: var(--logo-culture);
}

/* Logo sport */
header[data-theme="sport"] img.logo {
    content: var(--logo-sport);
}




