/* #Page Styles
*  Override de certaines couleurs/grille et nouveaux styles
================================================== */
.pageEntete {
	background:#FDEFD5;
	margin-bottom:0;
}
.pageWebinaireSI .pageEntete {
	min-height:450px;
	background:url("../img/entetes/entete_activites_seances_info.jpg?hiver2025") center center #000 no-repeat;
	background-size:cover;
}
.pageEntete .sousTitre {
	position:relative;
	margin:20px 0;
}
.pageWebinaireSI .pageEntete .sousTitre {
    font-size:2.857142857142857em; /* 40/14 */
	line-height:1;
	font-weight:600;
	margin:10px 0 40px 0;
}
.pageWebinaireSI .pageEntete .sousTitre.sansDate {
	margin-bottom:40px;
}
.pageWebinaireSI .pageEntete .dateAccueil {
	display:inline-block;
    font-size:2em; /* 28/14 */
	line-height:1;
	font-weight:600;
	background-color:#000;
	background-color:rgba(0,0,0,0.8);
	padding:6px 15px;
	margin-bottom:25px;
	text-transform:uppercase;
	color:#fff;
}



/* Strate de l'intro/accroche */
.sPageAccroche {
	padding:40px 0;
	background-color: #F1F2EF;
	font-size:1.571428571428571em; /* 22/14 */
	line-height:1.3;
}
.sPageAccroche p {
	text-align:center;
	/* max-width:750px;
	margin:0 auto; */
}


/* Strate de l'intro split */
.sIntro {
	padding:20px 0;
	background-color: #52524F;
	color: #fff;
}

.sIntro .flex {
	display:flex;
	width:100%;
	flex-wrap:wrap;
	text-align: center;
}
.sIntro .texteIntro {
	font-size:1.785714285714286em; /* 25/14 */
	line-height:1.333333333333333; /* 40/30 */
	/* font-weight:700; */
	width: 50%;
	padding: 20px;
}
.sIntro .datesFutures {
	border-left: 2px dotted #fff;
	padding: 20px;
	width: 50%;
	font-size: 1.285714285714286em; /* 18/14 - nouvelle base pour ce contenu */
}
.sIntro .datesFutures li + li {
	margin-top: 20px;
}
.sIntro .datesFutures h2 {
	font-size:1.388888888888889em; /* 25/18 */
	line-height:1;
	color: #fff;
	margin: 0 0 10px 0
}
.sIntro .datesFutures .obligatoire {
	margin-bottom: 20px;
}
.sIntro .datesFutures .dateSeance {
	font-size:1.166666666666667em; /* 21/18 */
	line-height:1.3;
	font-weight: 700;
	text-transform: uppercase;
	margin-bottom: 5px;
}
.sIntro .datesFutures .titreSeance {
	margin-bottom: 0;
}
.sIntro .datesFutures a {
	color: #fff;
}




/* Strate des Webinaires */
.sWebinaires {
	position:relative;
	background-color:#F2F2F1;
}
.sWebinaires .categorie {
	background-color:#2E8804;
	color: #fff;
	font-size:1.785714285714286em; /* 25px / 14px */
	line-height: 1.2;
	letter-spacing: 1.4px;
	font-weight: 700;
	text-align: center;
	text-transform: uppercase;
	padding: 16px;
	margin: 0;
}
.sWebinaires h2 {
	font-family: 'Roboto Condensed', sans-serif;
	font-size:2.285714285714286em; /* 32px / 14px */
	font-weight:400;
	line-height:1.2;

	margin-bottom:30px;
	position:relative;
	padding-bottom:10px;
}
.sWebinaires h2:after {
	content:"";
	position:absolute;
	border-bottom:5px solid #2E8804;
	height:5px;
	width:55px;
	bottom:0;
	left:0;
}

.sWebinaires .flex {
	display:flex;
	width:100%;
	flex-wrap:wrap;
}
.sWebinaires .colTexte {
	display:flex;
	/*min-height:500px;
	height:500px;
	vertical-align:middle;*/
	align-self:center;
	width:50%;
	padding:60px 20px;
}
.sWebinaires .colTexte .contentWrap {
	max-width:430px;
	margin:0 95px 0 auto;
}
.sWebinaires .second .colTexte .contentWrap {
	/* Inversé */
	margin:0 auto 0 95px;
}

.sWebinaires .colTexte .contentWrap .g16 > *:first-child {
	margin-top:0;
}

.sWebinaires .tags {
	display:flex;
	flex-wrap: wrap;
	gap: 10px;
	list-style: none;
	margin: 15px 0 0 0;
	padding: 0;
}
.sWebinaires .tags > li {
	font-size: 0.9285714285714286em; /* 13/14 */
	line-height: 1;
	font-weight: 600;
	padding: 5px 13px 5px 13px;
	margin: 0;
	background: #D8D8D7;
	border-radius: 12px;
	white-space: nowrap;
}

.sWebinaires .boiteInscription {
	position:relative;
	display:flex;
	justify-content:space-between;
	align-items:center;
	width:100%;
	padding:20px;
	background-color:#fff;
	margin-top: 30px;
}
.sWebinaires .boiteInscription + .boiteInscription {
	margin-top:2px;
}
.sWebinaires .boiteInscription + h2 {
	margin-top:50px; /* S'il y a un autre webinaire qui suit */
}
.sWebinaires .boiteInscription + .boiteInscription:before {
	content:"OU";
	display:block;
	position:absolute;
	left:50%;
	top:0;
	margin-top:-17px;
	margin-left:-17px;
	background-color:#F2F2F1;
	border-radius:50%;
	width:34px;
	height:34px;
	line-height:34px;
	text-align:center;
}
.sWebinaires .boiteInscription p {
	margin:0;
}
.sWebinaires .boiteInscription .date {
	font-size:1.285714285714286em; /* 18/14 */
	font-weight:600;
	padding-right:10px;
}
.sWebinaires .boiteInscription .date > strong {
	font-weight:600;
}
.sWebinaires .boiteInscription .inscription {
	flex-shrink:0;
}
.sWebinaires a.button {
	max-width:400px;
	background-color:#2E8804;
	padding:8px 15px;
	font-size:1.285714285714286em; /* 18/14 */
	font-weight:600;
	/*color:#000;*/
}
.sWebinaires a.button:hover,
.sWebinaires a.button:focus {
	background-color:#000;
	color:#fff;
}
.sWebinaires .colImg {
	display:flex;
	flex-grow:1;
	background:url(../img/activites_seances_info/bg_image1.jpg?hiver2025) right center no-repeat;
	background-size:cover;
	aspect-ratio: 6 / 7;
}
.sWebinaires .parcoursPerso .colImg {
	background:url(../img/activites_seances_info/bg_image2.jpg?hiver2025) right center no-repeat;
	background-size:cover;
}
.sWebinaires .programmes .colImg {
	background:url(../img/activites_seances_info/bg_image3.jpg?hiver2025) center center no-repeat;
	background-size:cover;
	/*aspect-ratio: 1 / 2;*/
}
.sWebinaires .colImg img {
	width:100%;
	height:auto;
}




/*********************/
/* Le CSS responsive */
/*********************/
@media only screen and (max-width: 1279px) {
	.sWebinaires .colTexte .contentWrap,
	.sWebinaires .second .colTexte .contentWrap {
		margin:0 auto;
	}

	/*.pageWebinaireSI .pageEntete {
		background-image:url("../img/entetes/entete_activites_seances_info_medium.jpg?hiver2025");
	}*/
}

@media only screen and (max-width: 1023px) {
	.pageWebinaireSI .pageEntete {
		min-height:300px;
	}
}

/* #Tablet (Portrait)
================================================== */

/* Note: Design for a width of 768px */
@media only screen and (min-width: 768px) and (max-width: 959px) {

}

/* Mobile portrait/paysage (320px à 767px) */
@media only screen and (max-width: 768px){
	/* Strate des Webinaires */
	.sWebinaires .colTexte .contentWrap,
	.sWebinaires .second .colTexte .contentWrap {
		max-width:none;
	}
}

@media only screen and (max-width: 767px) {
	.pageWebinaireSI .pageEntete {
		background-image:url("../img/entetes/entete_activites_seances_info_mobile.jpg?hiver2025");
		min-height: 400px;
	}

	.pageEntete h1.titrePage {
		margin-bottom:20px;
	}
	.pageWebinaireSI .pageEntete h1.titrePage {
		font-size:3.214285714285714em; /* 45/14 - titre court/seul */
		margin-bottom:10px;
	}
	.pageWebinaireSI .pageEntete .sousTitre {
		font-size:1.785714285714286em; /* 25/14 */
		margin-bottom:20px;
	}
	.pageWebinaireSI .pageEntete .dateAccueil {
		font-size:1.785714285714286em; /* 25/14 */
	}
	/*.pageEntete p.accroche {
		font-size:20px;
		margin:0 0 40px 0;
		padding-top:20px;
	}*/


	.sIntro {
		/*font-size:1.571428571428571em; /* 22/14 */
	}
	.sPageAccroche,
	.sIntro .texteIntro {
		font-size:1.571428571428571em; /* 22/14 */
	}
	.sIntro .datesFutures {
		font-size:1.142857142857143em; /* 16px / 14px */
	}


	/* Strate des Webinaires */
	.sWebinaires .colTexte {
		/*height:auto;*/
		/*display:block;*/
	}
	.sWebinaires .colTexte,
	.sWebinaires .second .colTexte {
		width:100%;
		padding:40px 0;
	}
	.sWebinaires .second {
		/* Image après - inverse les strate */
		flex-direction:column-reverse;
	}
	.sWebinaires ul,
	.sWebinaires ul li:last-child {
		margin-bottom:0;
	}
	.sWebinaires .colImg {
		width:100%;
		background-image:url(../img/activites_seances_info/bg_image1_mobile.jpg?hiver2025);
		aspect-ratio: 3 / 2;
	}
	.sWebinaires .parcoursPerso .colImg {
		background-image:url(../img/activites_seances_info/bg_image2_mobile.jpg?hiver2025);
	}
	.sWebinaires .programmes .colImg {
		background-image:url(../img/activites_seances_info/bg_image3_mobile.jpg?hiver2025);
		aspect-ratio: 3 / 2;
	}

}


/* #Mobile (Mini tablette)
================================================== */

@media only screen and (max-width: 599px) {
	.sIntro .texteIntro {
		width: 100%;
		/* padding: 0 0 30px 0; */
	}
	.sIntro .datesFutures {
		border-left: 0;
		/* padding: 0; */
		width: 100%;
	}
}


@media only screen and (max-width: 479px) {
	.sWebinaires .boiteInscription {
		display:block;
	}

	.sWebinaires .boiteInscription .date + p {
		margin-top:15px;
	}
}


@media only screen and (min-width: 1671px) {
	.pageWebinaireSI .pageEntete {
		background-image:url("../img/entetes/entete_activites_seances_info_large.jpg?hiver2025");
	}
}

/* Styles d'impression */
@media print {

}