/*
 * ============================================================================
 * main.css — ArtistikRezo Club
 * Feuille de styles principale du front office
 * ============================================================================
 *
 * SOMMAIRE
 * --------
 *  1.  Variables CSS
 *  2.  Icon font (club)
 *  3.  Base & typographie globale
 *  4.  Boutons & bordures
 *  5.  Utilitaires typographie
 *  6.  Utilitaires espacement
 *  7.  Structure & mise en page
 *  8.  Styles CMS (TinyMCE)
 *  9.  Page accueil
 * 10.  Connexion & authentification
 * 11.  Contact
 * 12.  Navigation & menu mobile
 * 13.  Evenements — liste & filtres
 * 14.  Evenements — fiche & reservation
 * 15.  Inscription & abonnements
 * 16.  Mon compte & profil
 * 17.  Accueil legacy
 * 18.  Footer
 * 19.  Plugins & composants tiers
 * 20.  Formulaires & divers
 * 21.  Utilitaires responsive
 * 22.  Media queries legacy
 * 23.  Impression
 *
 * ARCHIVE — styles commentés (référence historique, fin de fichier)
 *
 * ============================================================================
 */


/* ========================================================================== */
/* 01. VARIABLES CSS */
/* ========================================================================== */

:root {
	/* Couleurs charte */
	--color-rouge: rgba(193, 3, 3, 1);
	--color-marron: rgba(103, 40, 37, 1);
	--color-saumon: rgba(209, 137, 130, 1);
	--color-blanc: rgba(255, 255, 255, 1);
	--color-noir: rgba(0, 0, 0, 1);
	--color-gris: rgba(217, 217, 217, 1);

	/* Tailles de texte — petites */
	--font-xs: 1.2rem;
	--lineh-xs: 1.6rem;
	--font-s: 1.6rem;
	--lineh-s: 2rem;

	/* Tailles de texte — corps (note : --font-m / --lineh-m redéfinis ci-dessous) */
	--font-m: 1.3rem;
	--lineh-m: 1.8rem;
	--font-l: 1.6rem;
	--lineh-l: 2.4rem;

	/* Tailles de texte — titres (écrase la première définition de --font-m) */
	--font-m: 2rem;
	--lineh-m: 2.8rem;
	--font-xl: 2.4rem;
	--lineh-xl: 3rem;
}

/* ========================================================================== */
/* 02. ICON FONT (club) */
/* ========================================================================== */

@font-face {
	font-family: "club";
	src: url("../fonts/club.woff") format("woff");
	font-weight: normal;
	font-style: normal;
	font-display: block;
}

[class^="icon-"], [class*=" icon-"] {
	/* use !important to prevent issues with browser extensions that change fonts */
	font-family: 'club' !important;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;
  
	/* Better Font Rendering =========== */
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
  }

.icon-mail:before {
	content: "\e909";
  }

.icon-pin:before {
	content: "\e90a";
  }

.icon-tel:before {
	content: "\e90b";
  }

.icon-arrow:before {
	content: "\e903";
  }

.icon-edit:before {
	content: "\e904";
  }

.icon-time:before {
	content: "\e905";
  }

.icon-search:before {
	content: "\e906";
  }

.icon-quote:before {
	content: "\e907";
  }

.icon-star:before {
	content: "\e908";
  }

.icon-facebook:before {
	content: "\e900";
  }

.icon-linkedin:before {
	content: "\e901";
  }

.icon-instagram:before {
	content: "\e902";
  }

/* ========================================================================== */
/* 03. BASE & TYPOGRAPHIE GLOBALE */
/* ========================================================================== */

/* --- Document & corps --- */
html{
	font-size: 62.5%;
	scroll-behavior: smooth;
}

body{
	position: relative;
	font-family: "Carlito", sans-serif;
    font-size: var(--font-l);
    line-height: var(--lineh-l);
    color: var(--color-noir);
	letter-spacing: 0.8px;
	font-weight: 500;
}

p{
	margin-bottom: 1.5rem;
}

img{
	max-width:100%;
	/*width: 100%;*/
	vertical-align:bottom;
	height: auto;
}

/* --- Liens --- */
a{
	color: var(--color-noir);
	text-decoration:none;
	transition: background 300ms ease, color 400ms, opacity 300ms ease;
}

.content-desc p a{
	text-decoration: underline!important;
}

.section-img-txt a:hover,
.section-titre-img a:hover,
.section-img-txt a,
.section-titre-img a{
	text-decoration:underline;
}

a:hover,
a:active{
	text-decoration: none;
	outline:0;
}

p a:hover,
p a:active{
	text-decoration: underline;
	outline:0;
}

:hover{
	transition: color 400ms, opacity 300ms ease;
	-webkit-transition: color 400ms, opacity 300ms ease;
	-moz-transition: color 400ms, opacity 300ms ease;
	-ms-transition: color 400ms, opacity 300ms ease;
	-o-transition: color 400ms, opacity 300ms ease;
}

a.nohover{
	text-decoration: none!important;
}

input:focus{
	outline:0;
	border:1px solid var(--color-noir);
}

/* --- Titres --- */
h1, h2, h3, h4, h5, h6 {
	font-family: "Carlito", sans-serif;
	font-variation-settings:
    "wdth" 125,
    "wght" 800;
}

h1{
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	margin-bottom: 1.5rem;
}

h2{
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	margin-bottom: 1.5rem;
}

h3{
	font-size: var(--font-l);
	line-height: var(--lineh-l);
}

h4{
	font-size: var(--font-m);
	line-height: var(--lineh-m);
}

/* --- Listes --- */
.onglets ul{
	list-style: none;
	padding: 0;
	margin: 0;
}
ul{
	margin: 1em 0.5em;
	padding-left: 0.5em;
}

ul.no-list{
	list-style: none;
	padding: 0;
	margin: 0;
}

p + ul{
	margin-top: 0.5rem;
}

p:has(+ ul) {
	margin-bottom: 0.5rem;
}

strong{
	font-weight: 600!important;
}

/* ========================================================================== */
/* 04. BOUTONS & BORDURES */
/* ========================================================================== */

/* --- Boutons charte (.btn) --- */
.inline-btn{
	 gap: 30px;
}

.btn{
	position: relative;
	display: inline-block;
	padding: 0.5rem 2rem;
	border: 1px solid var(--color-rouge);
	text-decoration: none!important;
	transition: all 0.3s ease-in-out;
	border-radius: 3rem;
	color: var(--color-rouge);
	width: 100%;
	text-decoration: none!important;
	background: none;
	text-align: center;
}

.btn-small{
	width: auto;
	display: inline-block;
	padding: 0.5rem 1rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
}

.btn-rouge{
	background: var(--color-rouge);
	color: var(--color-blanc);
}

.btn:hover{
	box-shadow: 0 0.4rem 1rem rgba(0, 0, 0, 0.15);
}

.btn-group{
	display: flex;
	justify-content: flex-end;
	gap: 1rem;
}

.btn-group .btn{
	width: auto;
}

/* --- Bordures utilitaires --- */
.rounded{
	border-radius: 3rem;
}

.border-left{
	border-left: 1px solid var(--color-gris);
}

.border-right{
	border-right: 1px solid var(--color-gris);
}

.border-top{
	border-top: 1px solid var(--color-gris);
}

.border-bottom{
	border-bottom: 1px solid var(--color-gris);
}

/* ========================================================================== */
/* 05. UTILITAIRES TYPOGRAPHIE */
/* ========================================================================== */

/* --- Graisses --- */
strong,
.txt-bold{
	font-weight: 800!important;
	font-variation-settings: "wght" 800;
}

.txt-xlight{
	font-weight: 200!important;
}

.txt-light{
	font-weight: 300!important;
	font-variation-settings: "wght" 300;
}

.txt-regular{
	font-weight: 400!important;
}

.txt-medium strong,
.txt-medium{
	font-weight: 500!important;
}

.txt-sbold{
	font-weight: 600!important;
}

.txt-xbold{
	font-weight: 900!important;
}

.txt-ital{
	font-style: italic;
}

/* --- Tailles de texte --- */
.txt-xs{
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
}

.txt-s{
	font-size: var(--font-s);
	line-height: var(--lineh-s);
}

.txt-m{
	font-size: var(--font-m);
	line-height: var(--lineh-m);
}

.txt-xm{
	font-size: var(--font-xm);
	line-height: var(--lineh-xm);
}

.txt-l{
	font-size: var(--font-l);
	line-height: var(--lineh-l);
}

.txt-ml{
	font-size: var(--font-ml);
	line-height: var(--lineh-ml);
}

.txt-xl{
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
}

.txt-xxl{
	font-size: var(--font-xxl);
	line-height: var(--lineh-xxl);
	font-variation-settings: "wdth" 150, "wght" 400;
}

.txt-noir{
	color: var(--color-noir);
}

.txt-orange{
	color: var(--color-orange);
}

.txt-blanc a,
.txt-blanc{
	color: var(--color-blanc);
}

.txt-gris{
	color: var(--color-gris);
}

.txt-up{
	text-transform: uppercase!important;
}

.txt-space{
	letter-spacing: 0.05rem;
}

.txt-xspace{
	letter-spacing: 0.1rem;
}

.txt-balance{
	text-wrap:balance;
}

.txt-extend{
	font-family: "Carlito", sans-serif;
	font-variation-settings: "wdth" 125, "wght" 800;
}

/* ========================================================================== */
/* 06. UTILITAIRES ESPACEMENT */
/* ========================================================================== */

/* --- Padding vertical --- */
.pt15{
    padding-top: 0.5em;
}

.pt30{
    padding-top: 1.5em;
}

.pt50{
    padding-top: 2.5em;
}

.pt100{
    padding-top: 5em;
}

.pb0{
    padding-bottom: 0;
}

.pb15{
    padding-bottom: 0.5em;
}

.pb30{
    padding-bottom: 1.5em;
}

.pb50{
    padding-bottom: 2.5em;
}

.pb100{
    padding-bottom: 5em;
}

/* --- Margin vertical --- */
.mt5{
    margin-top: .5em;
}

.mt15{
    margin-top: 1em;
}

.mt30{
    margin-top: 1.5em;
}

.mt50{
    margin-top: 2.5em;
}

.mt100{
    margin-top: 5em;
}

.mb0{
	margin-bottom: 0;
}

.mb5{
	margin-bottom: .5em;
}

.mb15{
    margin-bottom: 1em;
}

.mb30{
    margin-bottom: 1.5em;
}

.mb50{
    margin-bottom: 2.5em;
}

.mb100{
    margin-bottom: 5em;
}

/* --- Espacement horizontal desktop (≥ 992px) --- */
@media only screen and (min-width:992px){
	.pr0{
		padding-right: 0!important;
	}
	.pl0{
		padding-left: 0!important;
	}
	.mr0{
		margin-right: 0!important;
	}
	.ml0{
		margin-left: 0!important;
	}
	.plr0{
		padding-left: 0!important;
		padding-right: 0!important;
	}
	.mlr0{
		margin-left: 0!important;
		margin-right: 0!important;
	}
	.pr15 {
		padding-right: 1.5em !important;
	  }
	.pl15 {
		padding-left: 1.5em !important;
	  }
	.pr30 {
		padding-right: 2.5em !important;
	  }
	.pl30 {
		padding-left: 2.5em !important;
	  }
	.pr50 {
		padding-right: 5em !important;
	  }
	.pl50 {
		padding-left: 5em !important;
	  }
	.plr5{
		padding-left: 5%!important;
		padding-right: 5%!important;
	}
	.plr6{
		padding-left: 6%!important;
		padding-right: 6%!important;
	}
	.plr8{
		padding-left: 8%!important;
		padding-right: 8%!important;
	}
	.plr10{
		padding-left: 10%! important;
		padding-right: 10%!important;
	}
	.plr12{
		padding-left: 12%! important;
		padding-right: 12%!important;
	}
	.plr15{
		padding-left: 15%! important;
		padding-right: 15%!important;
	}
}

/* --- Espacement horizontal mobile (≤ 991px) --- */
@media only screen and (max-width:991px){
	.plr5-mobil{
		padding-left: 30px!important;
		padding-right: 30px!important;
	}
}

/* ========================================================================== */
/* 07. STRUCTURE & MISE EN PAGE */
/* ========================================================================== */

/* --- Conteneur principal --- */
.content{
	min-height: 75vh;
}

/* --- Flexbox utilitaires --- */
.d-flex-between{
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.d-flex-center{
	display: flex;
	flex-direction: column;
	justify-content: center;
}

.d-flex-h{
	display: flex;
	flex-direction: column;
	height: 100%;
}

/* --- Intégrations vidéo (embed) --- */
.wp-block-embed__wrapper,
.embed-container{ 
    position: relative;
    padding-bottom: 56.25%;
	margin: 1.5rem 0 3rem 0;
    overflow: hidden;
    max-width: 100%;
    height: auto;
}

.wp-block-embed__wrapper iframe,
.embed-container iframe,
.embed-container object,
.embed-container embed{ 
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.single .item-content iframe{
	width: 100%;
}

/* --- Images responsive --- */
.img-fit,
.img-fit img{
	overflow: hidden;
	object-fit: cover;
	width: 100%;
	/*height: 100%;*/
}

.img-fit.img-pano img{
	aspect-ratio: 16/9;
}

.img-fit.img-wide img{
	aspect-ratio: 16/7;
}

.content .affiche img{
	width: 100%!important;
	height: auto!important;
	border-radius: 3rem;
}

.content .home_slogan{
	/*width:550px;*/
	text-align:left;
	padding:5px 15px 5px 0;
	margin:20px 0 30px 0px;
	background-color:#fff;
}

.content-full .home_slogan{
	width:600px;
	text-align:right;
	padding:5px 0 0 10px;
}

/* ========================================================================== */
/* 08. STYLES CMS (TinyMCE) */
/* ========================================================================== */

/* --- Composants éditoriaux --- */
.fs-page-break {
    display: block;
    border: none;
    border-top: 2px dashed var(--color-rouge);
    margin: 2em 0;
    color: transparent;
    height: 0;
}

/* --- Couleurs de texte CMS --- */
.txt-rouge {
    color: var(--color-rouge);
}

.txt-marron {
    color: var(--color-marron);
}

.txt-saumon {
    color: var(--color-saumon);
}

.fs-texte-intro {
    display: block;
    font-size: var(--font-l);
    font-weight: bold;
    line-height: var(--lineh-l);
}

.fs-encadre {
    display: block;
    border: 2px solid var(--color-rouge);
    padding: 1em 1.5em;
    margin: 1em 0;
}

.fs-texte-petit {
    font-size: var(--font-xs);
    line-height: var(--lineh-xs);
    color: #666666;
}

.fs-bouton {
    display: inline-block;
    padding: 1rem 3rem;
    border: 1px solid var(--color-rouge);
    border-radius: 3rem;
    background: var(--color-rouge);
    color: var(--color-blanc);
    text-decoration: none !important;
    text-align: center;
    font-size: var(--font-s);
    line-height: var(--lineh-s);
	text-decoration: none !important;
}
.fs-bouton a {
    color: var(--color-blanc) !important;
}
/* ========================================================================== */
/* 09. PAGE ACCUEIL */
/* ========================================================================== */

/* --- Bloc témoignages --- */
.home-temoignages{
	position: relative;
}

@media only screen and (min-width: 992px){
	.home-temoignages::before{
		font-family: "club";
		content: "\e907";
		position: absolute;
		top: 0;
		left: -8rem;
		width: 100%;
		height: 100%;
		color: var(--color-rouge);
		font-size: 6rem;
	}
	
	.home-temoignages::after{
		font-family: "club";
		content: "\e907";
		position: absolute;
		bottom: 0;
		right: -5rem;
		transform: rotate(180deg);
		color: var(--color-rouge);
		font-size: 6rem;
	}
}

/* --- Bloc association --- */
.home-association strong{
	color: var(--color-rouge);
}

@media only screen and (min-width: 992px){
	.home-temoignages .item_content{
		display: flex;
		flex-wrap: wrap;
		gap: 2rem 5rem;
	}
	.home-temoignages .item_content p{
		width: calc(50% - 3rem);
	}
}

/* ========================================================================== */
/* 10. CONNEXION & AUTHENTIFICATION */
/* ========================================================================== */

/* --- Formulaire de connexion --- */
.login label{
	display: block;
	margin-bottom: 0.5rem;
}

.login input[type="text"],
.login input[type="password"]{
	width: 100%;
	padding: 0.5rem 2rem;
	border: none;
	background-color: var(--color-gris);
	border-radius: 5rem;
}

.login input[type="submit"]{
	background-color: var(--color-rouge);
	color: var(--color-blanc);
	border: none;
	border-radius: 5rem;
	padding: 0.5rem 2rem;
}

.login_txt {
	position: relative;
	background-color: var(--color-blanc);
	border: 2px solid var(--color-rouge);
	border-radius: 4rem;
	padding: 3.5rem 4rem;
	margin: 0 1.6rem 1.6rem 0;
	box-shadow: 1.6rem 1.6rem 0 0 var(--color-rouge);
}

.login_txt h2 {
	text-transform: uppercase;
	font-weight: 700;
	letter-spacing: 0.12em;
	margin: 0 0 2.5rem;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	color: var(--color-noir);
}

.login_txt p {
	margin: 0;
}

@media only screen and (max-width: 768px) {
	.login_txt {
		border-radius: 2.5rem;
		padding: 2.5rem 2rem;
		box-shadow: 1rem 1rem 0 0 var(--color-rouge);
		margin-top: 2rem;
	}

	.login_txt h2 {
		font-size: var(--font-l);
		line-height: var(--lineh-l);
		margin-bottom: 1.5rem;
	}
}

.mod_login{
	position:absolute;
	top:-30px;
	right:40px;
	width:200px;
}

.bloc-register{
	background-color:#ccc;
	padding:25px;
	margin:25px 0;
}

.bloc-register ul{
	margin:25px 0 5px 20px;
	color:#000;
}

.bloc-register ul li{
	color:#fff;
	font-weight:bold;
	font-size:16px;
	padding:5px 0;
	list-style:disc;
}

.bloc-register ul li span{
	color:#000;
}

.mod_login_form{
	margin-bottom:5px;
}

.mod_passw_form input,
.mod_login_form input{
	padding:2px;
	background-color:#e3e4e5;
	border:none;
}

.mod_passw_form{
	float:left;
}

.mod_login .fs-button{
	margin:0;
}

.login{
	padding:20px 0;
}

.login_btn{
	padding:5px;
	margin:10px 10px 0 0;
	text-transform:uppercase;
	font-size:11px;
	background-color:#333;
	color:#fff;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border:none;
	cursor:pointer;
}

/* ========================================================================== */
/* 11. CONTACT */
/* ========================================================================== */

.item-tel,
.item-mail,
.item-pin {
	display: flex;
	align-items: center;
	gap: 1rem;
}

.item-tel::before {
	font-family: "club";
	content: "\e90b";
	color: var(--color-rouge);
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
}

.item-mail::before {
	font-family: "club";
	content: "\e909";
	color: var(--color-rouge);
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
}

.item-pin::before {
	font-family: "club";
	content: "\e90a";
	color: var(--color-rouge);
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
}

/* ========================================================================== */
/* 12. NAVIGATION & MENU MOBILE */
/* ========================================================================== */

/* --- Logo --- */
.logo{
	padding:5px;
	max-width: 125px;
}
/* --- Menu principal --- */
ul.nav{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 1vw;
	border-bottom: 1px solid var(--color-noir);
}

ul.nav li a{
	position:relative;
	overflow:hidden;
	padding:1rem;
	display:block;
	color:var(--color-noir);
	font-size:1.5rem;
	font-weight: 700;
}
ul.nav li a.btn{
	color:var(--color-blanc)!important;
	padding:1rem 2rem!important;
}

.header-nav-col {
	position: relative;
}
.header-nav-col ul{
	list-style: none;
	margin: 0;
	padding: 0;
}
.burger-btn,
.mobile-nav-close,
.mobile-nav-overlay {
	display: none;
}

@media only screen and (max-width: 991px) {
	.header-nav-col {
		display: flex;
		align-items: flex-start;
		justify-content: flex-end;
		min-height: 5rem;
	}

	.burger-btn {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		gap: 0.5rem;
		position: relative;
		z-index: 10001;
		width: 4.4rem;
		height: 4.4rem;
		margin-top: 1rem;
		padding: 0;
		border: 0;
		background: transparent;
		cursor: pointer;
	}

	.burger-btn__bar {
		display: block;
		width: 2.6rem;
		height: 0.2rem;
		background-color: var(--color-noir);
		border-radius: 0.2rem;
		transition: transform 0.35s ease, opacity 0.25s ease, width 0.35s ease;
		transform-origin: center;
	}

	.burger-btn.is-active .burger-btn__bar:nth-child(1) {
		transform: translateY(0.7rem) rotate(45deg);
	}

	.burger-btn.is-active .burger-btn__bar:nth-child(2) {
		opacity: 0;
		width: 0;
	}

	.burger-btn.is-active .burger-btn__bar:nth-child(3) {
		transform: translateY(-0.7rem) rotate(-45deg);
	}

	.mobile-nav-overlay {
		display: block;
		position: fixed;
		inset: 0;
		/*z-index: 9999;*/
		/*background-color: rgba(0, 0, 0, 0.45);*/
		opacity: 0;
		visibility: hidden;
		transition: opacity 0.4s ease, visibility 0.4s ease;
	}

	.mobile-nav-overlay.is-visible {
		opacity: 1;
		visibility: visible;
	}

	#menu {
		position: fixed !important;
		top: 0;
		right: 0;
		left: auto;
		width: min(85vw, 32rem);
		height: 100vh;
		height: 100dvh;
		margin: 0 !important;
		padding: 7rem 2.5rem 3rem;
		z-index: 10000;
		background-color: var(--color-blanc);
		box-shadow: -0.8rem 0 3rem rgba(0, 0, 0, 0.15);
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		visibility: visible;
		transform: translateX(100%);
		transition: transform 0.5s cubic-bezier(0.77, 0, 0.18, 1);
		will-change: transform;
	}

	#menu.is-open {
		transform: translateX(0);
		pointer-events: auto;
	}

	.mobile-nav-close {
		display: flex;
		align-items: center;
		justify-content: center;
		position: absolute;
		top: 1.5rem;
		right: 1.5rem;
		width: 4rem;
		height: 4rem;
		padding: 0;
		border: 0;
		background: transparent;
		color: var(--color-noir);
		font-size: 3.2rem;
		line-height: 1;
		cursor: pointer;
	}

	#menu ul.nav {
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 0;
		margin: 0;
		padding: 0;
		border-bottom: 0;
	}

	#menu ul.nav li {
		float: none;
		width: 100%;
		opacity: 0;
		transform: translateX(2rem);
		animation: none;
	}

	#menu:not(.is-open) {
		pointer-events: none;
	}

	#menu.is-open ul.nav li {
		animation: mobileNavCurtainItem 0.45s cubic-bezier(0.77, 0, 0.18, 1) forwards;
	}

	#menu.is-open ul.nav li:nth-child(1) { animation-delay: 0.12s; }
	#menu.is-open ul.nav li:nth-child(2) { animation-delay: 0.18s; }
	#menu.is-open ul.nav li:nth-child(3) { animation-delay: 0.24s; }
	#menu.is-open ul.nav li:nth-child(4) { animation-delay: 0.30s; }
	#menu.is-open ul.nav li:nth-child(5) { animation-delay: 0.36s; }
	#menu.is-open ul.nav li:nth-child(6) { animation-delay: 0.42s; }
	#menu.is-open ul.nav li:nth-child(7) { animation-delay: 0.48s; }

	#menu ul.nav li a {
		padding: 1.4rem 0;
		font-size: 1.5rem;
		border-bottom: 1px solid var(--color-gris);
	}

	#menu ul.nav li:last-child a {
		border-bottom: 0;
	}

	body.mobile-nav-open {
		overflow: hidden;
	}
}

@keyframes mobileNavCurtainItem {
	from {
		opacity: 0;
		transform: translateX(2rem);
	}
	to {
		opacity: 1;
		transform: translateX(0);
	}
}

/* ========================================================================== */
/* 13. EVENEMENTS — LISTE & FILTRES */
/* ========================================================================== */

/* --- En-tête & carousel bxSlider --- */
.entete{
	font-size: 20px;
	line-height: 26px;
}

.bx-wrapper .bx-viewport {
    background: #fff none repeat scroll 0 0;
    border: none;
    box-shadow:none;
    left:0;
}

.bx-wrapper .item-slide{
	max-height:300px;
	overflow:hidden;
}

.bx-wrapper .item-desc{
	position:absolute;
	bottom:0;
	padding:10px;
	/*background-color: rgba(0, 0, 0, 0.6);*/
	color:#fff;
}

.bx-wrapper .item-desc h2,
.bx-wrapper .item-desc p,
.bx-wrapper .item-desc a{
	color:#fff;
}

.bx-wrapper .bx-controls-direction a {
    height: 105px;
    margin-top: -16px;
    top: 35%;
    width: 55px;
}

.bx-wrapper .bx-prev {
    background: rgba(0, 0, 0, 0) url("../images/prev.png") no-repeat 0 0;
}

.bx-wrapper .bx-next {
    background: rgba(0, 0, 0, 0) url("../images/next.png") no-repeat 0 0;
}

.bx-wrapper .bx-prev:hover,
.bx-wrapper .bx-next:hover {
    background-position: 0 0;
}

/* --- Cartes événement (.item) --- */
.item{
	border-bottom: 1px solid var(--color-noir);
}

.item img{
	border-radius: 3rem;
}

h2.event_titre{
	position:relative;
	z-index:1;
}

p.quota{
	background-color:#e3e4e5;
	padding:5px;
}

/* --- Actions liste (lire suite, réserver, lien article) --- */
a.readm{
	display:inline-block;
	padding:5px;
	text-transform:uppercase;
	font-size:11px;
	background-color:#333;
	color:#fff;
	border-radius: 4px;
	cursor:pointer;
}

a.readm:hover{
	background-color:#d62284;
}

a.btn_reserv{
	background-color:var(--color-rouge);
	color:var(--color-blanc);
}

a.lien_ar{
	background:none;
	color:var(--color-noir);
}

/* --- Colonne filtres & recherche --- */
.desc h3{
	font-size:12px;
	text-transform:none;
	padding-top:5px;
	font-weight:normal;
	line-height:20px;
	text-decoration:underline;
}

.desc h4{
	font-size:12px;
	padding:2px 5px;
	margin-bottom:10px;
	font-weight:normal;
	line-height:20px;
	background-color:#d0d2c4;
	text-transform:uppercase;
}

.filter{
	position: sticky;
	top: 60px;
}

.filter-search {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 0.8rem;
	margin-bottom: 2.5rem;
}

.filter-search__label {
	display: flex;
	align-items: center;
	gap: 0.8rem;
	margin: 0;
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	font-weight: 600;
	color: var(--color-noir);
	white-space: nowrap;
	cursor: text;
}

.filter-search__label .icon-search {
	font-size: 2.4rem;
	line-height: 1;
}

.filter-search__input {
	flex: 1;
	padding: 0.5rem 1rem;
	border-radius: 3rem;
	min-width: 0;
	border: none;
	background: transparent;
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	font-weight: 600;
	color: var(--color-noir);
	outline: none;
}

.filter-search__input:focus {
	outline: none;
}

.filter-search .error_list {
	flex-basis: 100%;
	margin: 0;
}

/* --- Datepicker jQuery UI (#datepicker) --- */
#datepicker .ui-datepicker {
	width: 100%;
	padding: 0;
	border: 1px solid var(--color-gris);
	border-radius: 1.2rem;
	overflow: hidden;
	box-shadow: 0 0.2rem 0.8rem rgba(0, 0, 0, 0.08);
	background: var(--color-blanc);
	font-family: inherit;
}

#datepicker .ui-datepicker-header {
	background: var(--color-noir);
	border: none;
	border-radius: 0;
	padding: 1rem 2.5rem;
	color: var(--color-blanc);
}

#datepicker .ui-datepicker-title {
	display: flex;
	justify-content: center;
	margin: 0;
	font-size: var(--font-xs);
	line-height: 1.4;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--color-blanc);
}

.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
  width: 25%;
}

#datepicker .ui-datepicker-title select {
	margin: 0 0.2rem;
	padding: 0;
	background: transparent;
	border: none;
	color: var(--color-blanc);
	font-weight: 700;
	font-size: 1.4rem;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

#datepicker .ui-datepicker-prev,
#datepicker .ui-datepicker-next {
	top: 50%;
	width: 2.4rem;
	height: 2.4rem;
	margin-top: -1.2rem;
	background: transparent;
	border: none;
	border-radius: 50%;
	cursor: pointer;
}

#datepicker .ui-datepicker-prev {
	left: 0.6rem;
}

#datepicker .ui-datepicker-next {
	right: 0.6rem;
}

#datepicker .ui-datepicker-prev-hover,
#datepicker .ui-datepicker-next-hover {
	top: 50%;
	background: rgba(255, 255, 255, 0.12);
	border: none;
}

#datepicker .ui-datepicker-header .ui-icon {
	filter: brightness(0) invert(1);
}

#datepicker .ui-datepicker-calendar {
	width: 100%;
	margin: 0 0 2rem 0;
	border-collapse: collapse;
	font-size: 1.4rem;
}

#datepicker .ui-datepicker-calendar thead th {
	padding: 1rem 0.3rem 0.8rem;
	font-weight: 600;
	font-size: 1.2rem;
	color: var(--color-noir);
	border: none;
	border-bottom: 1px solid var(--color-gris);
	background: transparent;
}

#datepicker .ui-datepicker-calendar thead th:nth-child(7) {
	color: var(--color-rouge);
}

#datepicker .ui-datepicker-calendar tbody td {
	padding: 0.15rem;
	border: none;
	text-align: center;
}

#datepicker .ui-datepicker-calendar td span,
#datepicker .ui-datepicker-calendar td a,
#datepicker .ui-datepicker-calendar td a.ui-state-default {
	display: inline-block;
	padding: 0.5rem 1rem;
	text-align: center;
	text-decoration: none;
	border: none;
	background: transparent;
	color: var(--color-noir);
	font-weight: 500;
	border-radius: 50%;
}

#datepicker .ui-datepicker-calendar td:nth-child(7) a {
	color: var(--color-rouge);
	font-weight: 700;
}

#datepicker .ui-datepicker-other-month span {
	color: #cccccc;
}

#datepicker .ui-datepicker-calendar td a.ui-state-hover {
	background: var(--color-gris);
	color: var(--color-noir);
}

#datepicker .ui-datepicker-calendar td:nth-child(7) a.ui-state-hover {
	color: var(--color-rouge);
}

#datepicker .ui-datepicker-calendar td a.ui-state-active {
	background: var(--color-rouge);
	color: var(--color-blanc);
	font-weight: 700;
}

#datepicker .ui-datepicker-calendar td.ui-datepicker-today a {
	font-weight: 700;
}

.onglets{
	border-bottom:1px solid #999;
}

.onglets ul {
	display:flex;
	flex-wrap:wrap;
	justify-content: flex-start;
	gap:8px;
	padding-left: 0;
	margin-left: 0;
	padding-bottom: 1rem;
}

.onglets ul li a{
	padding:5px 10px 5px 0;
	margin-right:5px;
	text-transform:uppercase;
}

.onglets ul li.active a{
	color:var(--color-rouge);
}
@media only screen and (min-width: 992px){
	.onglets ul {
		justify-content: space-between;
		gap:20px;
	}	
}
/* ========================================================================== */
/* 14. EVENEMENTS — FICHE & RESERVATION */
/* ========================================================================== */

/* --- Créneaux horaires (fiche événement) --- */
.horaire-slot {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 2rem;
	padding: 2rem 0;
	border-bottom: 1px solid var(--color-gris);
}

.horaire-slot:first-child {
	border-top: 1px solid var(--color-gris);
}

.horaire-slot__date {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	flex: 1;
	min-width: 0;
}

.horaire-slot__day {
	font-size: 8rem;
	line-height: 1;
	font-weight: 800;
	color: var(--color-noir);
}

.horaire-slot__meta {
	display: flex;
	flex-direction: column;
	gap: 0.4rem;
}

.horaire-slot__weekday,
.horaire-slot__month {
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	font-weight: 600;
	color: var(--color-noir);
}

.horaire-slot__time {
	display: flex;
	align-items: center;
	gap: 0.6rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: #999999;
}

.horaire-slot__time .icon-time {
	font-size: 1.6rem;
	line-height: 1;
}

.horaire-slot__actions {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	flex-shrink: 0;
}

.horaire-slot__actions span {
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
}

.horaire-slot__form {
	display: flex;
	align-items: center;
	gap: 1.5rem;
	margin: 0;
}

.horaire-slot__places {
	min-width: 12rem;
	padding: 0.5rem 2rem;
	border: 1px solid var(--color-noir);
	border-radius: 3rem;
	background: var(--color-blanc);
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
	cursor: pointer;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23000' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1.2rem center;
	padding-right: 3rem;
}

.horaire-slot__submit.btn {
	width: auto;
	white-space: nowrap;
}

.horaires-list {
	margin-top: 2rem;
}

/* --- Responsive créneaux (≤ 768px) --- */
@media only screen and (max-width: 768px) {
	.horaire-slot {
		flex-direction: column;
		align-items: flex-start;
		gap: 1.5rem;
	}

	.horaire-slot__actions,
	.horaire-slot__form {
		width: 100%;
		justify-content: flex-start;
	}

	.horaire-slot__submit.btn {
		flex: 1;
	}
	.affiche{
		text-align: center;
	}
	.affiche img{
		max-width: 260px!important;
	}
}

/* --- Formulaire réservation & validation --- */
.reserv{
	clear:both;
}

.reserv input:not(.horaire-slot__submit):hover{
	background-color:#d62284;
}

input.fs_save{
	margin:10px 0!important;
}

.avert_places{
	display:block;
	font-size:12px;
	padding:5px 0;
}

.metteur_en_scene p{
	margin-bottom: 5px!important;
}

.page-evenement-validation{
	text-align: center;
}

.page-evenement-validation h2{
	color: var(--color-rouge);	
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 600;
	margin-bottom: 2rem;
}

/* --- Encart inscription visiteur (doc 14025) --- */

.subscribe-card--guest-cta {
	height: 100%;
	display: flex;
	flex-direction: column!important;
	justify-content: center!important;
	align-items: center!important;
	margin: 0 1.6rem 1.6rem 0;
	padding: 2.5rem 2rem 2rem;
}
.subscribe-card--guest-cta .subscribe-card__body {
	gap: 1.5rem;
}
.subscribe-card__cta-title {
	margin: 0;
	padding: 0;
	border: none;
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	font-weight: 800;
	text-transform: none;
	letter-spacing: normal;
	text-align: center;
	color: var(--color-noir);
}
.subscribe-card--guest-cta .subscribe-card__btn {
	width: auto;
	min-width: 14rem;
	align-self: center;
}
@media only screen and (min-width: 992px) {
	.subscribe-card--guest-cta {
		max-width: 80%;
	}
}
@media only screen and (max-width: 992px) {
	.evenement-guest-layout__aside {
		margin-bottom: 2rem;
	}
	.subscribe-card--guest-cta {
		margin-right: 1rem;
		margin-bottom: 1rem;
		box-shadow: 1rem 1rem 0 0 var(--color-rouge);
	}
}

/* ========================================================================== */
/* 15. INSCRIPTION & ABONNEMENTS */
/* ========================================================================== */

/* --- Grille des formules d'abonnement --- */
.subscribe-plans {
	display: flex;
	flex-direction: column;
	gap: 3rem;
}

.subscribe-plans__row {
	display: grid;
	gap: 5rem;
}

.subscribe-plans__row--main {
	grid-template-columns: repeat(3, 1fr);
}

.subscribe-plans__row--secondary {
	grid-template-columns: repeat(2, 1fr);
}

.subscribe-card {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	position: relative;
	background: var(--color-blanc);
	border: 2px solid var(--color-noir);
	border-radius: 2.4rem;
	padding: 2.5rem 2rem 2rem;
	margin: 0 1.6rem 1.6rem 0;
	text-align: center;
}

.subscribe-card--ami {
	border-color: #e8c4bf;
	/*box-shadow: -1.6rem 1.6rem 0 0 #f0d4cf;*/
}

.subscribe-card--mecene {
	border-color: var(--color-rouge);
	/*box-shadow: -1.6rem 1.6rem 0 0 #f0d4cf;*/
}

.subscribe-card--jeune,
.subscribe-card--jeune-26-ans,
.subscribe-card--bienfaiteur {
	border-color: var(--color-marron);
	/*box-shadow: -1.6rem 1.6rem 0 0 var(--color-marron);*/
}

.subscribe-card--mecene {
	/*box-shadow: -1.6rem 1.6rem 0 0 var(--color-rouge);*/
}

.subscribe-card--jeune {
	/*box-shadow: -1.6rem 1.6rem 0 0 var(--color-marron);*/
}

.subscribe-card--groupe {
	/*box-shadow: -1.6rem 1.6rem 0 0 var(--color-gris);*/
	border-color: var(--color-gris);
}

.subscribe-card--parrain {
	margin-left: auto;
	margin-right: auto;
}
@media only screen and (min-width: 992px) {	
	.subscribe-card--parrain {
		max-width: 50%;
		margin-left: auto;
		margin-right: auto;
	}
}

.subscribe-card__title {
	margin: 0 0 1.5rem;
	padding-bottom: 1rem;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--color-noir);
	border-bottom: 1px solid var(--color-noir);
}

.subscribe-card__body {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.8rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
}

.subscribe-card__body p {
	margin: 0;
}

.subscribe-card__plus {
	font-size: var(--font-l);
	line-height: 1;
	font-weight: 700;
}

.subscribe-card__price {
	margin-top: 0.5rem;
}

.subscribe-card__price strong {
	display: block;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 800;
}

.subscribe-card__price span {
	display: block;
	margin-top: 0.3rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	font-weight: 600;
}

.subscribe-card__btn.btn {
	width: auto;
	min-width: 14rem;
	margin-top: 1rem;
}

.subscribe-card--horizontal {
	text-align: left;
}

.subscribe-card--horizontal .subscribe-card__title {
	text-align: center;
}

.subscribe-card__content {
	display: flex;
	align-items: center;
	gap: 2rem;
}

.subscribe-card--horizontal .subscribe-card__body {
	flex: 1;
	align-items: flex-start;
}

.subscribe-card__body--groupe {
	align-items: flex-start;
	min-height: 12rem;
}

.subscribe-card__body--groupe .subscribe-card__btn {
	margin-top: auto;
	align-self: flex-end;
}

.subscribe-card__body--parrainage {
	align-items: center;
	text-align: center;
	gap: 1.2rem;
}

.subscribe-form-intro {
	font-size: var(--font-l);
	line-height: var(--lineh-l);
}

/* --- Page de paiement (boutons PayPal) --- */

.subscribe-payment__header {
	margin-bottom: 3rem;
}

.subscribe-payment__title {
	margin: 0 0 1rem;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--color-noir);
}

.subscribe-payment__options {
	display: grid;
	gap: 3rem;
	max-width: 90rem;
	margin: 0 auto;
	grid-template-columns: repeat(2, 1fr);
}

.subscribe-payment__card:only-child {
	grid-column: 1 / -1;
	max-width: 42rem;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}
.subscribe-payment__card {
	margin: 0;
	padding: 2.5rem 2rem;
}

.subscribe-payment__label {
	margin: 0 0 1.5rem;
	padding-bottom: 1rem;
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--color-noir);
	border-bottom: 1px solid var(--color-noir);
}

.subscribe-payment__paypal {
	display: flex;
	flex-direction: column;
	align-items: center;
	min-height: 5rem;
}

.subscribe-payment__empty {
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	color: var(--color-noir);
}

/* --- Formulaire d'inscription --- */

.subscribe-register__form {
	background: var(--color-blanc);
	border: 2px solid var(--color-rouge);
	border-radius: 2.4rem;
	padding: 3rem 3.5rem 2.5rem;
}

.subscribe-register__title {
	margin: 0 0 2.5rem;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 800;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--color-rouge);
}

.subscribe-register__field {
	margin-bottom: 1.6rem;
}

.subscribe-register__label {
	display: block;
	margin-bottom: 0.6rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	font-weight: 600;
	color: var(--color-rouge);
}

.subscribe-register__form input.hasDatepicker,
.subscribe-register__form input[type="text"],
.subscribe-register__form input[type="email"],
.subscribe-register__form input[type="password"],
.subscribe-register__form select {
	display: block;
	width: 100%;
	padding: 1rem 1.4rem;
	border: 1px solid var(--color-saumon);
	border-radius: 3rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
	background: var(--color-blanc);
	box-sizing: border-box;
}

.subscribe-register__field--date input[type="text"] {
	max-width: 100%;
}

.subscribe-register__form select {
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath fill='%23b22122' d='M1 1l5 5 5-5'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1.4rem center;
	padding-right: 3rem;
	cursor: pointer;
}

.subscribe-register__form select:invalid {
	color: var(--color-rouge);
}

.subscribe-register__form select option {
	color: var(--color-noir);
}

.subscribe-register__form input:focus,
.subscribe-register__form select:focus {
	outline: 2px solid var(--color-rouge);
	outline-offset: 2px;
}

.subscribe-register__form .error_list {
	margin: 0.4rem 0 0;
	padding: 0;
	list-style: none;
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
	color: var(--color-rouge);
}

.subscribe-register__actions {
	margin-top: 2rem;
}

.subscribe-register__submit {
	width: 100%;
	padding: 1rem 2rem;
	font-size: var(--font-m);
	line-height: var(--lineh-m);
	font-weight: 700;
	border: none;
	cursor: pointer;
}

.subscribe-register__submit:hover {
	color: var(--color-blanc);
}

.subscribe-register__legal {
	margin: 1.6rem 0 0;
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
	text-align: center;
	color: var(--color-marron);
}

.subscribe-register__legal-link {
	display: block;
	margin-top: 0.4rem;
	color: var(--color-marron);
	text-decoration: underline;
}

.subscribe-register__row {
	display: flex;
	flex-wrap: wrap;
	gap: 1.6rem;
	margin-bottom: 1.6rem;
}

.subscribe-register__field--half {
	flex: 1 1 calc(50% - 0.8rem);
	margin-bottom: 0;
	min-width: 14rem;
}

.subscribe-register__field--date select,
.subscribe-register__field--preferences ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.subscribe-register__field--date select {
	flex: 1 1 0;
	min-width: 0;
}

.subscribe-register__field--date > select,
.subscribe-register__field--date > span {
	display: inline-flex;
}

.subscribe-register__field--date {
	display: flex;
	flex-direction: column;
	gap: 0.6rem;
}

.subscribe-register__field--date select {
	display: block;
	width: 100%;
}

.subscribe-register__field--preferences ul {
	display: flex;
	flex-direction: column;
	gap: 0.8rem;
}

.subscribe-register__field--preferences li {
	display: flex;
	align-items: flex-start;
	gap: 0.8rem;
}

.subscribe-register__field--preferences li label {
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	font-weight: 400;
	color: var(--color-noir);
}

.subscribe-register__checks {
	margin-top: 0.4rem;
}

.subscribe-register__check {
	display: flex;
	align-items: flex-start;
	gap: 0.8rem;
	margin-bottom: 1.2rem;
}

.subscribe-register__check input[type="checkbox"] {
	flex: 0 0 auto;
	width: 1.6rem;
	height: 1.6rem;
	margin-top: 0.2rem;
	accent-color: var(--color-rouge);
}

.subscribe-register__check label {
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	font-weight: 400;
	color: var(--color-noir);
}

.subscribe-register__check a {
	color: var(--color-rouge);
	text-decoration: underline;
}

.subscribe-register__mandatory {
	margin: 0 0 1.6rem;
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
	text-align: right;
	color: var(--color-marron);
}

.subscribe-register__form label:not(.subscribe-register__label) {
	font-weight: 400;
}

.subscribe-register__readonly-value {
	margin: 0;
	padding: 1rem 1.4rem;
	border: 1px solid rgba(209, 137, 130, 0.35);
	border-radius: 3rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-marron);
	background: rgba(217, 217, 217, 0.2);
}

.subscribe-register__actions.btn-group {
	justify-content: flex-end;
}

.subscribe-register__actions.btn-group .btn {
	width: auto;
}

@media only screen and (max-width: 575px) {
	.subscribe-register__actions.btn-group {
		flex-direction: column;
	}

	.subscribe-register__actions.btn-group .btn {
		width: 100%;
	}
}

@media only screen and (max-width: 992px) {
	.subscribe-register__form {
		padding: 2rem 1.6rem 1.6rem;
	}

	.subscribe-register__field--half {
		flex: 1 1 100%;
	}

	.subscribe-plans__row--main,
	.subscribe-plans__row--secondary {
		grid-template-columns: 1fr;
	}

	.subscribe-payment__options {
		grid-template-columns: 1fr;
	}

	.subscribe-card {
		margin-right: 1rem;
		margin-bottom: 1rem;
		box-shadow: 1rem 1rem 0 0 var(--color-gris);
	}

	.subscribe-card--ami {
		box-shadow: 1rem 1rem 0 0 #f0d4cf;
	}

	.subscribe-card--bienfaiteur,
	.subscribe-card--jeune {
		box-shadow: 1rem 1rem 0 0 var(--color-marron);
	}

	.subscribe-card--mecene {
		box-shadow: 1rem 1rem 0 0 var(--color-rouge);
	}

	.subscribe-card--parrainage {
		box-shadow: 1rem 1rem 0 0 var(--color-noir);
	}

	.subscribe-card__content {
		flex-direction: column;
	}

	.subscribe-card__body--groupe .subscribe-card__btn {
		align-self: flex-start;
	}
}

.bloc_choix{
	/*height:380px;*/
	width:940px;
	display:table;
	border-collapse: separate;
	border-spacing: 10px;
}

.bloc_choix_reg{
	float:left;
	background-color:#e2e2e2;
	margin-bottom:10px;
	height:240px;
}

.choix{
	display:table-cell;
	position:relative;
	width:30%;
	margin:3px;
	padding:10px 5px 50px 10px;
	border:3px solid #e2e2e2;
	background-color:#fff;
}

.choix-bis{
	width:60%;
}

.choix-style-1{
	border:3px solid #066e8b;
	box-shadow: -5px 5px #9cc5d1;
}

.choix-style-2{
	border:3px solid #cd1719;
	box-shadow: -5px 5px #f5a7a9;
}

.choix ul li,
.choix p{
	font-size:11px;
}

.choix p,
.choix ul li{
	line-height:14px;
	padding-bottom:5px
}

.choix span,
.choix ul li span{
	color:#e02831;
}

.choix .prix{
	position:absolute;
	bottom:10px;
	clear:both;
	float:left;
	border:1px solid #ccc;
	margin-:10px;
	padding:2px 4px;
	background-color:#eee;
	font-size:10px;
}

.choix .prix2{
	position:absolute;
	bottom:10px;
	left:80px;
	border:1px solid #ccc;
	margin-left:5px;
	padding:2px;
	background-color:#eee;
	font-size:10px;
}

.coupon_form .btn{
	border:1px solid #ccc;
	padding:2px 4px;
	margin-top:5px;
	background-color:#eee;
}

/* ========================================================================== */
/* 16. MON COMPTE & PROFIL */
/* ========================================================================== */

/* --- En-tête profil utilisateur --- */
.profil-header {
	margin-bottom: 2rem;
}

.profil-header__top {
	display: flex;
	align-items: center;
	gap: 1.2rem;
	margin-bottom: 1.5rem;
}

.profil-avatar {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	width: 6rem;
	height: 6rem;
	border: 2px solid var(--color-noir);
	border-radius: 50%;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1;
	color: var(--color-noir);
}

.profil-header__name {
	margin: 0;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 700;
	color: var(--color-noir);
}

.profil-header__edit.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: auto;
	min-width: 0;
	padding: 0.6rem 0.8rem;
	margin-left: 0.4rem;
}

.profil-header__edit .icon-edit {
	font-size: 1.8rem;
	line-height: 1;
}

.profil-header__adhesion,
.profil-header__statut {
	margin: 0 0 0.6rem;
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	color: var(--color-noir);
}

.profil-header__adhesion strong {
	font-weight: 800;
}

/* --- Accordéon réservations (profil) --- */
.profil-accordion__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.4s ease;
}

.profil-accordion__panel.is-open {
	grid-template-rows: 1fr;
}

.profil-accordion__panel-inner {
	overflow: hidden;
	min-height: 0;
	opacity: 0;
	transform: translateY(-0.8rem);
	transition: opacity 0.35s ease, transform 0.4s ease;
}

.profil-accordion__panel.is-open .profil-accordion__panel-inner {
	opacity: 1;
	transform: translateY(0);
}

.profil-accordion__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 0;
	border: 0;
	background: none;
	font: inherit;
	font-weight: inherit;
	color: inherit;
	text-align: left;
	cursor: pointer;
}
.profil-accordion__toggle:focus {
	outline: none;
}
.profil-accordion__toggle:focus-visible {
	outline: 2px solid var(--color-rouge);
	outline-offset: 2px;
}

.profil-accordion__icon {
	flex-shrink: 0;
	margin-left: 1rem;
	font-size: 5rem;
	line-height: 1;
	transition: transform 0.3s ease;
}

.profil-accordion__toggle[aria-expanded="true"] .profil-accordion__icon {
	transform: rotate(180deg);
}

@media (prefers-reduced-motion: reduce) {
	.profil-accordion__panel,
	.profil-accordion__panel-inner,
	.profil-accordion__icon {
		transition: none;
	}

	.profil-accordion__panel-inner {
		opacity: 1;
		transform: none;
	}
}

/* --- FAQ accordéon --- */
.faq-accordion {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.faq-item {
	background: var(--color-blanc);
	border: 1px solid rgba(0, 0, 0, 0.12);
	border-radius: 1rem;
	overflow: hidden;
}

.faq-item__heading {
	margin: 0;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
}

.faq-accordion__toggle {
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	padding: 1.6rem 2rem;
	border: 0;
	background: none;
	font: inherit;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 400;
	color: var(--color-noir);
	text-align: left;
	cursor: pointer;
}

.faq-item.is-open .faq-accordion__toggle {
	color: var(--color-rouge);
	font-weight: 700;
}

.faq-accordion__toggle:focus {
	outline: none;
}

.faq-accordion__toggle:focus-visible {
	outline: 2px solid var(--color-rouge);
	outline-offset: 2px;
}

.faq-accordion__title {
	flex: 1;
	padding-right: 1rem;
}

.faq-accordion__icon {
	flex-shrink: 0;
	font-size: 2rem;
	line-height: 1;
	color: var(--color-noir);
	transition: transform 0.3s ease;
}

.faq-item.is-open .faq-accordion__icon {
	transform: rotate(180deg);
}

.faq-accordion__panel {
	display: grid;
	grid-template-rows: 0fr;
	transition: grid-template-rows 0.4s ease;
}

.faq-accordion__panel.is-open {
	grid-template-rows: 1fr;
}

.faq-accordion__panel-inner {
	overflow: hidden;
	min-height: 0;
	opacity: 0;
	transform: translateY(-0.5rem);
	transition: opacity 0.35s ease, transform 0.4s ease;
}

.faq-accordion__panel.is-open .faq-accordion__panel-inner {
	opacity: 1;
	transform: translateY(0);
}

.faq-item__answer {
	padding: 0 2rem 1.6rem;
	color: var(--color-noir);
	font-size: var(--font-s);
	line-height: var(--lineh-s);
}

@media (prefers-reduced-motion: reduce) {
	.faq-accordion__panel,
	.faq-accordion__panel-inner,
	.faq-accordion__icon {
		transition: none;
	}

	.faq-accordion__panel-inner {
		opacity: 1;
		transform: none;
	}
}

/* --- Liste parrainages --- */
.parrainage-page {
	margin-top: 2rem;
}

.parrainage-list {
	display: flex;
	flex-direction: column;
	gap: 1rem;
}

.parrainage-card {
	background: var(--color-blanc);
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 1rem;
	padding: 1.6rem 2rem;
	transition: box-shadow 0.25s ease, border-color 0.25s ease;
}

.parrainage-card:hover {
	border-color: rgba(178, 33, 34, 0.25);
	box-shadow: 0 0.4rem 1.2rem rgba(0, 0, 0, 0.06);
}

.parrainage-card__header {
	display: flex;
	align-items: flex-start;
	justify-content: space-between;
	gap: 1.2rem;
	margin-bottom: 1.2rem;
}

.parrainage-card__email {
	margin: 0;
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	font-weight: 700;
	color: var(--color-marron);
	word-break: break-word;
}

.parrainage-card__badge {
	flex-shrink: 0;
	display: inline-block;
	padding: 0.4rem 1rem;
	border-radius: 3rem;
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	white-space: nowrap;
}

.parrainage-card__badge--attente {
	background: rgba(209, 137, 130, 0.2);
	color: var(--color-marron);
}

.parrainage-card__badge--valide {
	background: rgba(178, 33, 34, 0.12);
	color: var(--color-rouge);
}

.parrainage-card__meta {
	display: flex;
	flex-wrap: wrap;
	gap: 1.6rem 3rem;
	margin: 0;
}

.parrainage-card__meta-item {
	margin: 0;
}

.parrainage-card__meta-item dt {
	margin: 0 0 0.2rem;
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.04em;
	color: var(--color-saumon);
}

.parrainage-card__meta-item dd {
	margin: 0;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
}

.parrainage-list__empty {
	margin: 0;
	padding: 2rem;
	border: 1px dashed rgba(0, 0, 0, 0.15);
	border-radius: 1rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-marron);
	text-align: center;
	background: rgba(217, 217, 217, 0.2);
}

.parrainage-page__actions {
	margin-top: 2.5rem;
}

.parrainage-page__actions .btn {
	width: auto;
}

@media (max-width: 575px) {
	.parrainage-card {
		padding: 1.4rem 1.6rem;
	}

	.parrainage-card__header {
		flex-direction: column;
		align-items: flex-start;
		gap: 0.8rem;
	}

	.parrainage-card__meta {
		flex-direction: column;
		gap: 0.8rem;
	}

	.parrainage-page__actions .btn {
		width: 100%;
	}
}

/* --- Formulaire parrainage --- */
.parrainage-form {
	margin-top: 2rem;
	max-width: 64rem;
	background: var(--color-blanc);
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 1rem;
	padding: 2.4rem;
}

.parrainage-form__title {
	margin: 0 0 2rem;
	font-size: var(--font-xl);
	line-height: var(--lineh-xl);
	font-weight: 700;
	color: var(--color-marron);
}

.parrainage-form__field {
	margin-bottom: 1.6rem;
}

.parrainage-form__label {
	display: block;
	margin-bottom: 0.6rem;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	font-weight: 600;
	color: var(--color-rouge);
}

.parrainage-form textarea,
.parrainage-form input[type="text"],
.parrainage-form input[type="email"] {
	display: block;
	width: 100%;
	min-height: 12rem;
	padding: 1.2rem 1.4rem;
	border: 1px solid var(--color-saumon);
	border-radius: 1rem;
	font-family: inherit;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
	background: var(--color-blanc);
	box-sizing: border-box;
	resize: vertical;
}

.parrainage-form textarea:focus,
.parrainage-form input[type="text"]:focus,
.parrainage-form input[type="email"]:focus {
	outline: 2px solid var(--color-rouge);
	outline-offset: 2px;
}

.parrainage-form textarea::placeholder {
	color: rgba(103, 40, 37, 0.45);
}

.parrainage-form__hint {
	margin: 0.8rem 0 0;
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
	color: var(--color-saumon);
}

.parrainage-form .error_list,
.parrainage-form ul.error_list {
	margin: 0.4rem 0 0;
	padding: 0;
	list-style: none;
	font-size: var(--font-xs);
	line-height: var(--lineh-xs);
	color: var(--color-rouge);
}

.parrainage-form__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 1rem;
	margin-top: 2rem;
}

.parrainage-form__actions .btn {
	width: auto;
}

@media (max-width: 575px) {
	.parrainage-form {
		padding: 1.6rem;
	}

	.parrainage-form__actions {
		flex-direction: column;
	}

	.parrainage-form__actions .btn {
		width: 100%;
	}
}

/* --- Cartes réservation (profil) --- */
.profil-reservation-item__title {
	margin: 0 0 0.4rem;
	font-size: var(--font-l);
	line-height: var(--lineh-l);
	color: var(--color-noir);
}

.profil-reservation-item__horaire,
.profil-reservation-item__places {
	margin: 0 0 0.3rem;
	color: var(--color-noir);
}

.profil-reservation-item__meta {
	margin: 0.6rem 0 0;
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
}

.profil-reservation-item__meta .addthisevent {
	display: inline-block;
	margin-right: 1rem;
}

.profil-reservation-item__delete {
	font-size: var(--font-s);
	line-height: var(--lineh-s);
	color: var(--color-noir);
	text-decoration: underline;
}

/* --- Notation événement (étoiles) --- */
.event-rating__label {
	margin: 0;
	color: var(--color-noir);
}

.event-rating__stars {
	display: inline-flex;
	flex-direction: row;
	gap: 0.4rem;
}

.event-rating__input {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.event-rating__star {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	cursor: pointer;
	line-height: 1;
}

.event-rating__star-svg {
	display: block;
	width: 2.4rem;
	height: 2.4rem;
}

.event-rating__star-shape {
	fill: var(--color-blanc);
	stroke: #f5a623;
	stroke-width: 1.5;
	stroke-linejoin: round;
	transition: fill 0.15s ease;
}

.event-rating__stars--readonly .event-rating__star {
	cursor: default;
	pointer-events: none;
}

.event-rating__stars--readonly.event-rating__stars--note-1 .event-rating__star:nth-of-type(-n+1) .event-rating__star-shape,
.event-rating__stars--readonly.event-rating__stars--note-2 .event-rating__star:nth-of-type(-n+2) .event-rating__star-shape,
.event-rating__stars--readonly.event-rating__stars--note-3 .event-rating__star:nth-of-type(-n+3) .event-rating__star-shape,
.event-rating__stars--readonly.event-rating__stars--note-4 .event-rating__star:nth-of-type(-n+4) .event-rating__star-shape,
.event-rating__stars--readonly.event-rating__stars--note-5 .event-rating__star:nth-of-type(-n+5) .event-rating__star-shape {
	fill: #f5a623;
}

.profil-reservations-list .event-rating__stars:has(.event-rating__input:nth-of-type(1):checked) .event-rating__star:nth-of-type(-n+1) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__input:nth-of-type(2):checked) .event-rating__star:nth-of-type(-n+2) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__input:nth-of-type(3):checked) .event-rating__star:nth-of-type(-n+3) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__input:nth-of-type(4):checked) .event-rating__star:nth-of-type(-n+4) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__input:nth-of-type(5):checked) .event-rating__star:nth-of-type(-n+5) .event-rating__star-shape {
	fill: #f5a623;
}

.profil-reservations-list .event-rating__stars:has(.event-rating__star:nth-of-type(1):hover) .event-rating__star:nth-of-type(-n+1) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__star:nth-of-type(2):hover) .event-rating__star:nth-of-type(-n+2) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__star:nth-of-type(3):hover) .event-rating__star:nth-of-type(-n+3) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__star:nth-of-type(4):hover) .event-rating__star:nth-of-type(-n+4) .event-rating__star-shape,
.profil-reservations-list .event-rating__stars:has(.event-rating__star:nth-of-type(5):hover) .event-rating__star:nth-of-type(-n+5) .event-rating__star-shape {
	fill: #f5a623;
}

.profil-reservations-list .event-rating__input:focus-visible + .event-rating__star .event-rating__star-shape {
	fill: #f5a623;
}

a.btn-parrain{
	background-color: #e02831;
	padding:4px 10px;
	color:#fff;
	text-transform:uppercase;
	font-size:12px;
}

/* --- Responsive cartes réservation (≤ 991px) --- */
@media (max-width: 991px) {
	.profil-reservation-item__carte {
		padding: 1.6rem 0;
		border-left: none;
		border-right: none;
		border-top: 1px solid #d9d9d9;
		border-bottom: 1px solid #d9d9d9;
	}
}

/* --- Tableaux profil & mot de passe oublié --- */
table.profil{
	width:98%;
}

table.profil th{
	width:30%;
	padding:5px;
	text-align:right;
	font-size:12px;
}

table.datalist td.col-sep {
	height:20px;
    border: none;
	background-color:#fff;
}

table.forgetpassw input,
table.forgetpassw td{
	float:right!important;
}

table.forgetpassw .error_list{
	position:absolute;
	margin-top:-20px;
	color:red;
}

/* ========================================================================== */
/* 17. ACCUEIL LEGACY */
/* ========================================================================== */

.video_home{
	margin-left:20px;
}

.home_slogan h2{
	font-size:25px;
	margin-bottom: 10px;
	font-weight:normal;
}

.home_slogan p{
	font-size:20px;
	font-weight:normal;
}

.home_top{
	/*background: url("../images/top_home.png") top center no-repeat;*/
	margin-top:20px;
	/*padding:280px 0 0 30px;*/
}

.home_top p{
	line-height:18px;	
}

.reg_btn{
	position:absolute;
	top:270px;
	left:475px;
}

.video_btn{
	/*
	position:absolute;
	top:120px;
	left:670px;
	*/
}

.reg_btn a{
	color:#fff;
	font-size:24px;
}

.col1,
.col2{
	float:left;
}

.col3{
	float:right;
	width:23%;
}

.col3 span{
	background-color:#000;
	padding:2px;
	color:#fff;
	font-size:22px;
	line-height:34px;
}

.col1{
	padding-top:100px;
	text-align:right;
}

.col2{
	padding:0;
	width:75%;
}

.col2 img{
	width:100%;
}

.fs-button input.btn_ok{
	float:left;
	margin:0 0 0 5px;
	padding:2px;
	border:none;
}

/* ========================================================================== */
/* 18. FOOTER */
/* ========================================================================== */

.footer{
	padding:15px 0;
	background-color:#f2f2f0;
}

.footer .nav{
	margin:0 auto 0 auto;
}

.footer ul {
	display: flex;
	flex-wrap: wrap;
	margin-right:20px;
	margin-left: 0;
	padding: 0;
	gap: 2vw;
	list-style: none;
}

.footer ul li{
	margin-right:20px;
}

.footer ul li a{
	color:#000;
}

.footer li.btn_social{
	padding:0;
}

/* ========================================================================== */
/* 19. PLUGINS & COMPOSANTS TIERS */
/* ========================================================================== */

/* --- Boutons fsWidgets (legacy) --- */
.fs-button a {
    margin: 10px 0 0 0;
    padding: 5px;
    background-color: #333333;
    border: medium none;
    color: #FFFFFF;
    cursor: pointer;
    float: left;
    font-size: 11px;
	line-height:16px;
    text-transform: uppercase;
}

span.red{
	color:red;
	line-height:16px;
}

.fs-button input,
.reserv input:not(.horaire-slot__submit){
	/*float:left;*/
	padding:5px;
	margin:0 10px 0 0;
	text-transform:uppercase;
	font-size:11px;
	background-color:#333;
	color:#fff;
	/*
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	*/
	border:none;
	cursor:pointer;
}

/* --- Pagination --- */
.pager a.fsPagerLink{
	padding:5px 2px;
}

.pager a.fsPagerLink_nbr{
	padding:4px;
	/*border:1px solid #999;*/
	text-decoration:underline;
}

.pager a.fsPagerLink_nbr:hover{
	background-color:#eee;
	transition: background-color 0.3s ease-out 0s, color 0.15s ease-out 0s;
}

.bloc-payp{
	clear:both;
	padding:20px;
	border:1px solid #999;
}

/* --- AddThisEvent (ajout au calendrier) --- */
.addthisevent-drop 						{display:inline-block;position:relative;z-index:999998;color:#333!important;background:#f4f4f4 url(http://www.addthisevent.com/gfx/icon-calendar-t1.png) no-repeat 9px 50%;text-decoration:none;border:1px solid #d9d9d9;color:#555;font-size:11px;text-decoration:none;padding:9px 12px 8px 35px;-moz-border-radius:2px;-webkit-border-radius:2px;}

.addthisevent-drop:hover 				{border:1px solid #aab9d4;color:#555;text-decoration:none;}

.addthisevent-drop:active 				{top:1px;}

.addthisevent-selected 					{background-color:#f7f7f7;}

.addthisevent_dropdown 					{width:200px;position:absolute;z-index:99999;padding:6px 0px 0px 0px;background:#fff;text-align:left;display:none;margin-top:-2px;margin-left:-1px;border-top:1px solid #c8c8c8;border-right:1px solid #bebebe;border-bottom:1px solid #a8a8a8;border-left:1px solid #bebebe;-moz-border-radius:2px;-webkit-border-radius:2px;-webkit-box-shadow:1px 3px 6px rgba(0,0,0,0.15);-moz-box-shadow:1px 3px 6px rgba(0,0,0,0.15);box-shadow:1px 3px 6px rgba(0,0,0,0.15);}

.addthisevent_dropdown span 			{width:175px;display:block;line-height:110%;background:#fff;text-decoration:none;font-size:12px;color:#6d84b4;padding:8px 10px 9px 15px;}

.addthisevent_dropdown span:hover 		{background:#f4f4f4;color:#6d84b4;text-decoration:none;font-size:12px;}

.addthisevent span 						{display:none!important;}

.addthisevent-drop ._url,.addthisevent-drop ._start,.addthisevent-drop ._end,.addthisevent-drop ._summary,.addthisevent-drop ._description,.addthisevent-drop ._location,.addthisevent-drop ._organizer,.addthisevent-drop ._organizer_email,.addthisevent-drop ._facebook_event,.addthisevent-drop ._all_day_event {display:none!important;}

.addthisevent_dropdown .copyx 			{width:200px;height:21px;display:block;position:relative;cursor:default;}

.addthisevent_dropdown .brx 			{width:180px;height:1px;overflow:hidden;background:#e0e0e0;position:absolute;z-index:100;left:10px;top:9px;}

.addthisevent_dropdown .frs 			{position:absolute;top:5px;cursor:pointer;right:10px;padding-left:10px;font-style:normal;font-weight:normal;text-align:right;z-index:101;line-height:110%;background:#fff;text-decoration:none;font-size:9px;color:#cacaca;}

.addthisevent_dropdown .frs:hover 		{color:#6d84b4;}

.addthisevent 							{visibility:hidden;}

.fs-button{display:inline-block; cursor:pointer; margin:0 0 3px 0;}

.fs-button span{width:7px;display:block;float:left;}

.fs-button .l{display:none;}

.fs-button .r{display:none;}

.fs-button input{}

.fs-button:hover .l{background-position: left center;padding:0;margin:0px;}

.fs-button:hover .r{background-position: right center;}

.fs-button:hover input{background-position: center center;}

.fs_icon_button .l{width: 25px;}

.fs_icon_button .l:after{left: 8px; position: relative; top: 4px;}

.fs_save .l:after{content: url("/images/fsw/save.png");}

.fs_save_and_add .l:after{content: url("/images/fsw/new.png");}

.fs_save_and_list .l:after{content: url("/images/fsw/liste.png");}

.fs_save_and_duplicate .l:after{content: url("/images/fsw/duplicate.png");}

.fs_save_and_clone .l:after{content: url("/images/fsw/duplicate.png");}

.fs_art_link a:before{position:relative;top: 4px;margin-right: 4px;}

/* --- Icônes actions admin (fs_link, fs_delete, fs_liste…) --- */
a.fs_link:before {    bottom: -2px;    line-height: inherit;    margin: 0;    padding: 0 3px 0 0;    position: relative;    vertical-align: middle;}

a.fs_link_edit:before {content: url("/images/fsw/edit.png");}

a.fs_link_delete:before {content: url("/images/fsw/delete.png");}

a.fs_link_add:before {content: url("/images/fsw/new.png");}

a.fs_link_duplicate:before {content: url("/images/fsw/duplicate.png");}

a.fs_link_clone:before {content: url("/images/fsw/duplicate.png");}

a.fs_link_mail:before {content: url("/images/fsw/email_add.png");}

a.fs_link_show:before {content: url("/images/fsw/eye.png");}

.fs_delete a:before{content: url("/images/fsw/delete.png");}

.fs_liste a:before{content: url("/images/fsw/liste.png");}

.fs_new a:before{content: url("/images/fsw/new.png");}

input.fs_icon_button {cursor:pointer!important;}

.admin-debug{border: 1px dotted black; margin: 5px; padding: 5px;}

/* ========================================================================== */
/* 20. FORMULAIRES & DIVERS */
/* ========================================================================== */

/* --- Listes à cases à cocher --- */
ul.checkbox_list li {
	float:left;
}

@media (min-width:720px) and (max-width: 962px){
	ul.checkbox_list{
		width:1%;	
	}
	input#sf_guard_user_preference_list_2 {
		margin-left: 29%;
	}
	.obj_left {
		float: none;
	}
}

/* ========================================================================== */
/* 21. UTILITAIRES RESPONSIVE */
/* ========================================================================== */

/* --- Tablette & mobile (≤ 768px) — utilitaires espacement --- */
@media only screen and (max-width:768px){
	.full-m{
		padding: 0!important;
	}
	.center-mobil{
		text-align: center!important;
	}
	.hidden-sm{
		display: none;
	}
    .mt50{
        margin-top: 1.5em;
    }
	.mb30{
		margin-bottom: 1em;
	}
    .pt30{
        padding-top: 1em;
    }
    .mb50{
        margin-bottom: 1.5em;
    }
	.mt100{
		margin-top: 2.5em;
	}
	.mb100{
		margin-bottom: 2.5em;
	}
    .pt50{
        padding-top: 1.5em;
    }
    .pb30{
        padding-bottom: 1em;
    }
    .pb50{
        padding-bottom: 1.5em;
    }
	.pb100{
		padding-bottom: 2em;
	}
    .pt100{
        padding-top: 2em;
    }
	.mt0-mobil{
		margin-top: 0;
	}
	.mb0-mobil{
		margin-bottom: 0;
	}
	.pt0-mobil{
		padding-top: 0;
	}
	.pb0-mobil{
		padding-bottom: 0;
	}
	.pb100-mobil{
		padding-bottom: 5rem;
	}
    .pt100-mobil{
        padding-top: 5rem;
    }
	.mb50-mobil{
		margin-bottom: 2.5rem;
	}
	.mt50-mobil{
		margin-top: 2.5rem;
	} 
	.mb100-mobil{
		margin-bottom: 5rem;
	}
	.mt100-mobil{
		margin-top: 5rem;
	}
}

/* --- Padding horizontal mobile (≤ 992px) --- */
@media only screen and (max-width:992px){
	.plr0-mobil{
		padding-left: 0!important;
		padding-right: 0!important;
	}
	.plr1-mobil{
		padding-left: 5%!important;
		padding-right: 5%!important;
	}
	.plr5-mobil{
		padding-left: 10%!important;
		padding-right: 10%!important;
	}
}

/* --- Ancrage scroll (≥ 320px) --- */
@media only screen and (min-width:320px){
	section{
		scroll-margin-top: 5em;
	}
	.scroll-margin{
		scroll-margin-top: 10em;
	}
}

/* --- Flex centré desktop (≥ 769px) --- */
@media only screen and (min-width:769px){
	.d-flex-center{
		display: flex;
		flex-direction: column;
		justify-content: center;
	}
}

/* ========================================================================== */
/* 22. MEDIA QUERIES LEGACY */
/* ========================================================================== */

/* --- Mobile étroit (< 720px) — champs & tableaux --- */
@media (max-width:719px){
input{
	-webkit-background-color:rgb(250, 255, 189);
	width:100%;	
}
table.datalist{
	overflow-x: auto;
	display: block;
	}
}

/* --- Tablette / petit desktop (< 890px) --- */
@media (max-width:890px){
	.obj_left {
    float: none;
	}
	.video_btn{
		display:none;	
	}

	a.art-button img {
	  height: 20px;
	  width: 20px;
	}
	.bloc-payp {
	  height: 100px;
	}
	select {
	  width: 100%;
	}
	.pager img{
		width:5%;	
	}
	.onglets{
		height:100px;	
	}
	.desc {
	  width: 100%;
	}
	.content .home_slogan {
	  width: 90%;
	  text-align: left;
	}
	p.quota {
	  width: 50%;
	  margin-bottom:15%;
	}
	.filter{
		margin-top:0px;
	}
	a.lien_ar {
		width:50%;
	}
	input#sf_guard_user_preference_list_3 {
		margin-left: 7.1%;
	}
	input#sf_guard_user_preference_list_4 {
		margin-left: 1.4%;
	}
	input#sf_guard_user_preference_list_2 {
		margin-left: 85%;
	}
	table.profil{
		font-size:11px;	
	}
	.bloc_choix{
		/*margin-bottom:1270px;	*/
	}
	.bloc-payp{
		/*margin-top:370%;*/
	}
	.choix{
		width:90%;
		height:79%;	
	}
	.bloc_choix{
		width:100%;	
	}
	#wrapper{
		width:320px!important;	
	}
	#container{
		width:100%;	
	}
	.footer .nav{
		width:100%!important;	
	}

	#menu{
		width:100%;	
		/*height:340px;*/
		z-index: 55;
	}
	ul.nav{
		margin-left:0px;
	}
	.home_top {
		 background: none;
		 margin-top: 0px; 
		 padding: 0px; 
		}
	.content-full .home_slogan {
		 width: 90%;
		 text-align: left;
		 padding: 5px 0 0 10px;
		 font-size:1em;
		 margin-bottom: 2%;
	}
	.col2 {
		float: none;
		width: 280px;
		margin-left:-13%;
	}
	.video_btn{
		top:60px;
		left:10px;	
	}
	.col1{
		padding-top:2%;	
	}
	ul.nav li{
		float:none;	
	}
	.mod_login{
		right:0px;
		top:-21.5%;
		width:145px;
		left:52%;	
	}
	.mod_passw_form input, .mod_login_form input{
		width:95%;
		padding:0px;
	}
	.footer .nav{
		width:320px;	
	}
	#sfWebDebug{
		display:none;	
	}
	.dev_bar{
		display:none;
	}
	ul.nav li a{
		padding:10px;
	}

}

/* --- Layout legacy par largeur d'écran (350px – 962px) --- */
@media (min-width:350px) and (max-width:384px){
#wrapper{
	width:360px!important;	
}
#container{
	width:100%;	
}
.col2 {
	float: none;
	width: 330px;
}
.col1{
	width:340px;
	text-align:left;
	padding-left:4%;	
}
}

@media (min-width:385px) and (max-width:430px){
#wrapper{
	width:385px!important;	
}
#container{
	width:100%;	
}
.col2 {
	float: none;
	width: 367px;
}
.col1{
	width:369px;
	text-align:left;
	padding-left:4%;	
}
}

@media (min-width:431px) and (max-width:550px){
	#wrapper{
		width:431px!important;	
	}
	#container{
		width:100%;	
	}
}

@media (min-width:538px){
table.datalist {
  overflow-x: visible;
  display: block;
  /*margin-left: -18%;*/
}	
}

@media (min-width:551px) and (max-width:651px){


	img.giigokopkpzaauannbnb {
	  height: 5em;
	}
	input[type="image"] {
	  width: 40%;
	  height:0%;
	}
	.pager img {
	  width: 3%;
	}
	#menu{
		height:205px;	
	}
	#wrapper{
		width:551px!important;	
	}
	#container{
		width:100%;	
	}
	.col2 {
		float: left;
		width: 495px;
		margin-left:-7%;
	}
	.col1{
		width:405px;
		text-align:left;
		padding-left:4%;	
	}
	.logo{
		width:50%;
		margin-bottom:2%;
	}
	ul.nav{
		margin-left:1.3%;
	}
	ul.nav li{
		float:left;
		width:33%;
	}
	.col3 {
	  width: 40%;
	}
	table.datalist {
	  margin-left: -1%;
	}
}

@media (min-width:652px) and (max-width:752px){
	.mod_login {
	  top: -39.5%;
	}
	.reg_btn{
		display:none;	
	}
	img.giigokopkpzaauannbnb {
	  height: 5em;
	}
	input[type="image"] {
	  width: 40%;
	  height:0%;
	}
	.pager img {
	  width: 3%;
	}
	#menu{
		height:140px;
		margin-bottom:20%;	
	}
	#wrapper{
		width:652px!important;	
	}
	#container{
		width:100%;	
	}
	.col2 {
		float: left;
		width: 595px;
		margin-left:-7%;
	}
	.col1{
		width:505px;
		text-align:left;
		padding-left:4%;
		margin-top: -22%;	
	}
	.logo{
		width:50%;
		margin-bottom:2%;
	}
	ul.nav{
		margin-left:1.3%;
	}
	ul.nav li{
		float:left;
		width:33%;
	}
	.col3 {
	  width: 40%;
	}
	table.datalist {
	  margin-left: -1%;
	}
}

@media (min-width:753px) and (max-width:962px){
	.pager img {
	  width: 2%!important;
	}
	.obj_left {
		float: none;
	}
	.content img {
	  /*width: 50%;*/
	  height: 100%;
	}
	.choix {
	  width: 25%;
	  height:92%;
	}
	input#sf_guard_user_preference_list_4 {
	  margin-left: 4%;
	}
	input#sf_guard_user_preference_list_3 {
	  margin-left: 14%;
	}
	.home_slogan {
		font-size:1.5em;
		text-align:center!important;	
	}
	.mod_login {
	  right: 0px;
	  top: -26.5%;
	  width: 27.5%;
	  left: 52%;
	}
	img.giigokopkpzaauannbnb {
	  height: 5em;
	}
	input[type="image"] {
	  width: 40%;
	  height:0%;
	}
	.pager img {
	  width: 3%;
	}
	#menu{
		height:69px;	
	}
	#wrapper{
		width:753px!important;

	}
	.reg_btn{
		display:none;	
	}
	#container{
		width:100%;	
	}
	.col2 {
		float: left;
		width: 50%;
		margin-left:-7%;
	}
	.col1{
		width:752px;
		text-align:left;
		padding-left:1%;
		margin-top: -2%;	
	}
	.logo{
		width:40%;
		margin-bottom:2%;
	}
	ul.nav{
		margin-left:1.3%;
	}
	ul.nav li{
		float:left;
	}
	.col3 {
	  width: 40%;
	  padding-top:3%;
	}
	table.datalist {
	  margin-left: -1%;
	}
	.bloc_choix {
	  /*margin-bottom: 430px;*/
	}
	.video_btn {
	display:none;
	}

}

@media (min-width:890px) and (max-width:962px){
	.mod_login {
	  right: 0px;
	  top: -16.5%;
	  width: 100%;
	  left: 52%;
	}
}

/* ========================================================================== */
/* ARCHIVE — styles commentés (référence historique) */
/* ========================================================================== */

/*
 * Couleurs par catégorie d'événement (désactivé — conservé pour référence)
 *
 * .evenement_categorie2 p.quota,
 * .evenement_categorie2 .desc h4,
 * .evenement_categorie2 h2.event_titre { background-color:#F79E71; }
 * .evenement_categorie3 p.quota,
 * .evenement_categorie3 .desc h4,
 * .evenement_categorie3 h2.event_titre { background-color:#EEE7A5; }
 * .evenement_categorie4 p.quota,
 * .evenement_categorie4 .desc h4,
 * .evenement_categorie4 h2.event_titre { background-color:#A9BE74; }
 * .evenement_categorie5 p.quota,
 * .evenement_categorie5 .desc h4,
 * .evenement_categorie5 h2.event_titre { background-color:#578CAF; }
 * .onglets ul li:nth-child(2) a { background-color: #F79E71; }
 * .onglets ul li:nth-child(3) a { background-color: #EEE7A5; }
 * .onglets ul li:nth-child(4) a { background-color: #A9BE74; }
 * .onglets ul li:nth-child(5) a { background-color: #578CAF; }
 */

/* ========================================================================== */
/* 23. IMPRESSION */
/* ========================================================================== */

@media print{
	*{
		background:transparent !important;
		color:#000 !important;
		box-shadow:none !important;
		text-shadow:none !important;
	}
	a,
	a:visited{
		text-decoration:underline;
	}
	a[href]:after{
		content:" (" attr(href) ")";
	}
	abbr[title]:after{
		content:" (" attr(title) ")";
	}
	.ir a:after,
	a[href^="javascript:"]:after,
	a[href^="#"]:after{
		content:"";
	}
	pre,blockquote{
		page-break-inside:avoid;
	}
	thead{
		display:table-header-group;
	}
	tr,img{
		page-break-inside:avoid;
	}
	img{
		max-width:100% !important;
	}
	@page{
		margin:0.5cm;
	}
	p,
	h2,
	h3{
		orphans:3;
		widows:3;
	}
	h2,
	h3{
		page-break-after:avoid;
	}
}

/* ========================================================================== */
