@import "UECBV2_Header.css";
@import "UECBV2_Footer.css";
@import "Cookies.css";

:root {
	--bgColor: #f7f7f7;
	--white: #ffffff;
	--TransparentbgColor: rgba(255, 255, 255, 0.6);
	--PanelBgColor: white;
	--AccentColor: #a11515;
    --AccentColor-light: #9b5a5a;
	--TransparentAccentColor: rgba(161, 21, 21, 0.8);
	--AccentFontColor: #fffbfb;
	--HorizontalPadding: 5%;
	--HeaderHeight: 80px;
	scroll-padding: var(--Scroll_Padding);
	scroll-behavior: smooth;
	font-size: 15px;
	--globalHorizontalPadding: 25px

}

h1, h2, h3 {
	margin-block-start: 0px;
    margin-block-end: 0px;
	margin-bottom: 30px;
}

/* Les h2 qui sont précédé d'une image -> Img + texte */ 
img + h2 {
	margin-top: 0px;
}

h1 {
	color: #1C1C1C;
	text-transform: uppercase;
	font: normal normal bold 30px/35px Figtree;
	letter-spacing: 0px;
}

h2 {
	color: #A11515;
	font: normal normal bold 25px/35px Figtree;
	letter-spacing: 0px;
}

h3 {
	color: #A11515;
	font: normal normal bold 20px/35px Figtree;
	letter-spacing: 0px;
}

ul {
	margin-block-start: 0px;
    margin-block-end: 0px;
}


ul li {
	list-style-type: none;
	text-align: left;
	font: normal normal 500 17px/20px Figtree;
}


.sub-section-wrapper ul li:last-child {
	margin-bottom: 30px;
}

.sub-section-wrapper ul li:is(:last-of-type){
	margin-bottom: 0px;
}

.sub-section-wrapper ul li {
	text-align: left;
	font: normal normal 300 17px/40px Figtree;
	letter-spacing: 0px;
	color: #000000;
}

ul li::before {
	text-decoration: none;
	color: #A11515;
}

p.no-data {
	margin-bottom: 0px;
}

/* .sub-section-wrapper p:is(:last-of-type){
	margin-bottom: 0px;
} */


/** Dans le <ul> "DocList" on met du margin sur le dernier <li> comme séparateur entre les accordéons **/
.sub-section-wrapper ul.DocList li:last-child {
  margin-bottom: 30px;
}
/** Dans le <div> "Detail_Texte" on met du margin sur chaque élement sauf le dernier **/
.DocList > *:last-child {
  margin-bottom: 0px;
}

.Detail_Text > *:last-child {
  margin-bottom: 0px;
}
.Detail_Text > * {
  margin-bottom: 30px;
}

.Detail_Text p:has(img) {
	margin-bottom: 0px;
}

p {
	margin-block-start: 0px;
    margin-block-end: 0px;
	margin-bottom: 30px;
	text-align: left;
	font: normal normal 300 17px/30px Figtree;
	letter-spacing: 0px;
	color: #000000;
}

.Right_Menu p {
	text-align: left;
	font: normal normal 400 17px/20px Figtree;
	letter-spacing: 0px;
	color: #A11515;
}

.sub-section-wrapper img {
	float: left;
	margin-right: 80px;
	margin-bottom: 50px;
	width: 540px;
	height: 100%;
	border-radius: 30px;
	object-fit: cover;
}

.margin-bottom-sm {
	margin-bottom: 80px;
}

@media screen and (max-width:900px){
	.sub-section-wrapper img {
		margin-right: 0px;
		width: 100%;
	}
} 

@media screen and (min-width: 700px) {
	:root {
		font-size: 16px;
		--globalHorizontalPadding:50px;
	}
}
@media screen and (min-width: 100px) {
	:root {
		font-size: 18px;
	}
}
@media screen and (min-width: 1500px) {
	:root {
		font-size: 20px;
		--globalHorizontalPadding:75px;
	}
}

@media screen and (min-width: 700px) {

	.Section.M_FullWidth {
		border-radius: 30px;
	}
}

.footer-wrapper {
	display: flex;
	flex-direction: column;
	gap: 15px;
	align-items: center;
	text-align: center;


	/* max-width: none; */
}

.footer-global-wrapper {
	padding: 25px var(--globalHorizontalPadding) 25px var(--globalHorizontalPadding);
	min-height: 70px;
	display: flex;
	flex-direction: column;
	gap:15px;
	align-items: center;
	justify-content: space-between;
	background: #A11515 0% 0% no-repeat padding-box;
	
	a {
		color: #FFFBFB;
		font: normal normal normal 14px/20px Figtree;
		letter-spacing: 0.68px;
	}
}

.Contact-Form-Wrapper {
	padding:100px;
	width:100%;
	max-width:710px;
}

.Main_Content {
	/* margin-top: 32px;
	margin-bottom: 100px; */
	padding : 30px var(--globalHorizontalPadding) 100px var(--globalHorizontalPadding);
}

.texts-wrapper {
	display:flex;
	flex-direction:column;
	gap:30px;
}

.texts-title {
	font: normal normal bold 30px/35px Figtree;
	letter-spacing: 0px;
	color: #1C1C1C;
}

.texts-subtitle {
	font: normal normal bold 25px/35px Figtree;
	letter-spacing: 0px;
	color: #A11515;
}

.texts-txt {
	font: normal normal 300 20px/30px Figtree;
	letter-spacing: 0px;
	color: #000000;
}

.txt-n-img-wrapper {
	display:flex;
	flex-direction:column;
	gap:40px;
}

.txt-n-img-img {
	max-height:350px;
	width:100%;
	border-radius: 30px;
}

.section-wrapper {
	display:flex;
	flex-direction:column;
	gap:40px;
}

.sub-section-wrapper {
	padding:50px;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	border-radius:30px;
	display:flex;
	flex-direction:column;
	/* gap:40px; */
}

.EventsSlider img {
	background-color: var(--bgColor);
}
.Main_Content {
	position: relative;
	/* margin-bottom: 80px; */
	margin-top: 0px;
}
a {
	color: var(--AccentColor);
	text-underline-offset: 0.3rem;
}
li:not([class]) {
	list-style: none;
	position: relative;
	&::before {
		content: "\25CF";
		position: absolute;
		left: -1.3rem;
		/* translate: 0px -50%; */
		display: inline-block;
		top: -0.1rem;
	}
}
a:has(> button) {
	display: block;
	text-decoration: none;
}
.Not_Underlined {
	text-decoration: none;
}
.Default_Picture {
	opacity: 75%;
	/* backdrop-filter: invert(10%); */
}
body {
	height: calc(100% - var(--heightBandeauVersion));
	width: 100%;
	margin: 0px auto;
	background-color: var(--bgColor);
	font-family: "figtree", sans-serif;
}

.Maj {
	text-transform: uppercase;
}

.Section {
	background-color: var(--PanelBgColor);
	margin-bottom: 50px;
	display: grid;
	grid-template-columns: 1fr;
	height: fit-content;
	gap: 30px;
}

.Panel {
	box-sizing: border-box;
	height: fit-content;
	overflow: hidden;
	width: 100%;
	height: fit-content;
	max-height: 100%;
	overflow: hidden;
	/* margin-top: 15px; */
	padding: 0px;
}
.divGalerie {
	display: grid;
	gap: 10px;
	a {
		overflow: hidden;
		border-radius: 25px;
		img {
			border-radius: 0px;
		}
	}
	grid-template-columns: repeat(5, 1fr);
	grid-auto-rows: 1fr;
	img,
	video {
		height: 100%;
		width: 100%;
		object-fit: cover;
	}
}
.Video_Galerie {
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	video {
		object-fit: cover;
		max-height: 350px;
	}
}
.Panel img {
	width: 100%;
	object-fit: cover;
}
.ContactForm {
	display: flex;
	flex-direction: column;
	gap: 30px;
	/* max-width: 710px; */
	line-height: 1.5rem;
	/* width: 100%; */

	.ContactForm_Wrapper {
		display: flex;
		flex-direction: column;
		gap:30px;
	}

	input {
		border: none;
		border-bottom: solid 1px var(--AccentColor);
		font-size: inherit;
  		font-family: inherit;
  		color: inherit;
		width: 100%;
		outline: none;
		padding-block: 10px;
		/* padding-inline: 12px; */
	}
	textarea {
		font-size: inherit;
  		font-family: inherit;
		color: inherit;
		width: 100%;
		height: 10rem;
		box-sizing: border-box;
		resize: none;
		display: block;
		padding: 1rem;
		border-radius: 30px;
		border: solid 1px var(--AccentColor);
		margin-top: 0.5rem;
	}

	textarea:focus {
		border: solid 1px var(--AccentColor);
		outline: none;
	}

	label:has(textarea) {
		margin-top: 2rem;
		margin-bottom: 1rem;
	}
	label:has(textarea):focus {
		font-size: 16px;
		line-height: 20px;
		opacity: 0.68;
	}
	button {
		margin-left: auto;
		margin-right: auto;
	}
}
div:has(> .AbsoluteLabel) {
	position: relative;
}
.AbsoluteLabel,
label:has(+ textarea),
label:has(+ .form-wrapper) {
	position: relative;
}
.AbsoluteLabel {
	position: absolute;
	transition: all 0.2s;
	cursor: text;
	user-select: none;
	bottom: 10px;
	font-size: 15px;
	font-weight: 300;
	opacity: 0.8;
	font: normal normal 300 17px/30px Figtree;

}
.AbsoluteLabel:has(+ :focus, + .nonvide) {
	font-size: 0.8rem;
	opacity: 60%;
	bottom: 100%;
	line-height: 1em;
}

.Page_Contact_Wrapper {
	display: flex;
	flex-direction: column;
	gap:30px;
}

.Page_Contact_Global_Wrapper {
	display:flex;
	flex-direction:column;
	gap: 100px;
	background: #FFFFFF 0% 0% no-repeat padding-box;
	padding:40px;
	border-radius: 30px;
}

.home-scroll-btn {
	font-size: 1.75rem;
	translate: 12px -6px;
}

.logo-footer {
	width:25px;
	height:25px;
}

#SendMail_Btn {
	width: 100%;
}

/* Même valeurs que dans le footer (.Contact_Wrapper #Informations, ...) */
.Page_Contact_Wrapper #Informations,
.Page_Contact_Wrapper #Adress,
.Page_Contact_Wrapper #Telecom,
.Page_Contact_Wrapper #Email {
	text-decoration: none;
	font: normal normal 300 17px/30px Figtree;
	color: #1C1C1C;
	letter-spacing: 0px;
}


#Contact_Bottom {
	display: flex;
	flex-direction: column;
	gap:60px;
	/* max-width: 710px; */
	width: 100%;
	word-break: break-word;
	iframe {
		height: 293px;
		border-radius: 30px;
		flex: 1;
		flex-basis: 20rem;
	}
}
#Contact_info {
	margin-top: auto;
	margin-bottom: auto;
}
#Resume {
	padding: 50px 5%;
}
button:not(.boutonCookiesRight, .boutonCookies, .modal-cookies-button2) {
	display: flex;
	align-items: center;
	justify-content: center;
	text-transform: uppercase;
}

button {
	cursor: pointer;
	background: transparent;
	border : 0.09375rem solid var(--AccentColor); /* 1.875px */
	font-family: "Figtree", sans-serif;
	font-size: 0.85rem;
	color: var(--AccentColor);
	border-radius: 5px;
	padding: 8px 20px;
	font-weight: 450;
		.material-symbols-outlined {
		font-size: 1rem;
		font-weight: 400;
	}
	&:not(.modal-cookies-button2):hover {
		& {
			&:not(&.Red_Btn) {
				background-color: var(--AccentColor);
				color: var(--AccentFontColor);
			}
			&.Red_Btn {
				background-color: transparent;
				color: var(--AccentColor);
			}
		}
	}
	&.Red_Btn {
		background-color: var(--AccentColor);
		color: var(--AccentFontColor);
	}
}

p.Button_Arrow {
	padding-left: 20px;
	margin: 0px !important;
	color: var(--AccentColor);
}

button:hover p.Button_Arrow {
	color: var(--AccentFontColor)
}

p.Button_Arrow {
	color: var(--AccentColor);
}

.Red_Btn p.Button_Arrow {
	color : var(--AccentFontColor)
}

.Red_Btn:hover p.Button_Arrow {
	color: var(--AccentColor);
}

dialog.modal {
	border-radius: 12px;
	border: none;
	padding: 2.5rem;
	width: 500px;
	max-width: calc(100% - (2 * 1.25rem));
	min-width: 250px;
	box-sizing: border-box;
}
dialog.modal::backdrop {
	background: rgba(0, 0, 0);
	opacity: 0.56;
}
#Resume {
	h2 {
		margin-top: 10px;
		margin-bottom: 30px;
	}
	button {
		width: 100%;
		margin-top: 10px;
		margin-bottom: 10px;
	}
}

#Intro {
	margin-top: none;
	position: relative;
	.Head {
		position: relative;
	}

	h1 {
		padding-left: 5%;
		padding-right: 5%;
		text-align: left;
		margin-top: 35px;
		margin-bottom: 45px;
		height: fit-content;
		width: 90%;
		font-size: 8vw;
		font-weight: 700;
		display: inline-block;
		color: var(--AccentColor);
	}

	.Scroll_Down {
		align-items: end;
		display: flex;
		flex-direction: column;
		/* position: absolute; */
		right: 25%;
		bottom: 50px;
		color: var(--AccentColor);

		* {
			padding: 0px;
			margin: 0px;
		}

		.material-symbols-outlined {
			position: relative;
			left: -0.5rem;
			font-size: 8vw;
			font-weight: 600;
			width: fit-content;
		}
	}

	img {
		max-width: 100%;
		height: 100%;
		height: 500px;
		object-fit: cover;
		object-position: bottom;
	}
}

.Section {
	&#Resume,
	&#Home_News,
	&#Events {
		img {
			width: 100%;
			object-fit: cover;
		}
	}
}

.ImgPanel {
	/* max-height: 160px; */
	border-radius: 10px;
	overflow: hidden;
}

.News_Section,
.Events_Section {
	/* margin-bottom: 0px; */
	background-color: transparent;
	button {
		height: 100%;
		width: 100%;
	}
	.Button_Wrapper {
		display: flex;
		gap: 10px;
		align-items: stretch;
		a {
			width: 100%;
		}
		button {
			height: 100%;
			width: 100%;
		}
	}
	/* .Panel:not(:last-of-type) {
		margin-bottom: 100px;
	} */
	.Panel > p {
		-webkit-line-clamp: 3;
		-webkit-box-orient: vertical;
		display: -webkit-box;
		overflow: hidden;
		font-weight: 300;
		font-size: 1.15rem;
		margin: 40px 0px;
	}
}

.Section#Events {
	gap: 0px;
	h1 {
		padding-left: 5%;
		padding-right: 5%;
		margin-top: 50px;
		margin-bottom: 50px;
	}

	.EventsSlider {
        scroll-snap-type: x mandatory;
        
		> .Panel {
			scroll-snap-align: center;
		}
		scroll-behavior: smooth;
		overflow-x: scroll;
		display: flex;
		padding-left: 10%;
		padding-right: 10%;
		gap: 20px;
		scrollbar-width: none;
	}
	.Panel {
		&:first-child {
			margin-left: auto;
			margin-right: auto;
		}
		flex-shrink: 0;
		width: 100%;
		position: relative;
	}

	h3 {
		font-size: 17px;
		margin: 0px;
		color: #c2c2c2;
		height: 20px;
	}

	.Img_Wrapper {
		position: relative;
		border-radius: 5px;
		overflow: hidden;

		&.Active:hover {
			.Text_Bg {
				background-color: #5c5c5c81;
			}

			p {
				display: block;
				height: 100%;
			}
		}
	}

	.Text_Bg {
		box-sizing: border-box;
		position: absolute;
		height: 100%;
		width: 100%;
		overflow: hidden;
		padding: 25px;
	}

	img {
		height: 160px;
		/* max-width: 50%; */
		/*Mediaquery*/
	}
	.Text {
		font-size: 1rem;
		margin-top: 40px;
		.Event_Title {
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			display: -webkit-box;
			overflow: hidden;
			margin-top: 20px;
			height: 3.4rem;
		}
	}
	#DotBar {
		margin-left: auto;
		margin-right: auto;
		padding: 0px;
		display: flex;
		flex-direction: row;
		list-style: none;
		div {
			cursor: pointer;
			transition: background-color 0.2s;
			/* display: block; */

			width: 10px;
			height: 10px;
			background-color: black;
			border-radius: 50%;

			/* border: solid 1px black; */
			margin: 0px 5px;
		}
		div:hover {
			background-color: var(--AccentColor);
		}
		div.Active {
			background-color: var(--AccentColor);
		}
	}
	.Text {
		a:has(Button) {
			display: block;
			width: 100%;
			height: fit-content;
			margin-top: 30px;
			margin-bottom: 30px;
		}
	}
	button {
		display: flex;
		align-items: center;
		justify-content: center;
		font-size: 15px;
	}
	.Info_Btn {
		width: 100%;
		position: relative;
	}
	.All_Btn {
		width: 100%;
		margin: 0px;
	}

	.Desktop_Hidden p {
		box-sizing: border-box;
		display: none;
		margin: 0px;
		width: 100%;
		overflow-y: hidden;
		padding: 0px;
	}

	.Event_Footer {
		> a {
			margin: 50px 5%;
			width: 90%;
			height: fit-content;
		}
		display: flex;
		flex-direction: column;
	}
}

.Mobile_Hidden {
	display: none;
}
#AllNews {
	.Panel > p {
		-webkit-line-clamp: 3;
		max-height: 90px;
		font-size: 25px;
	}
}
.News_Section {
	img {
		background-color: white;
	}
}
.Event_Desc {
	text-align: left;
	max-width: 40rem;
	margin-bottom: 5rem;
}
.Events_LowerPart_Wrapper {
	display: flex;
	margin-bottom: 5rem;
	gap: 5rem;
	flex-wrap: wrap;
}
#EventsAgenda {
	width: 20.8rem;
	height: 20.8rem;
	object-fit: cover !important;
}
.Info_Pratiques_Text {
	text-align: right;
	max-width: 100%;
}
#Event_Map {
	width: 100%;
	height: 20rem;
	border-radius: 30px;
}
.SectionTitle {
	margin-top: 0;
	margin-bottom: 2rem;
	text-transform: uppercase;
}
.Section {
	&.Events_Section,
	&.News_Section {
		h1 {
			margin-top: 0px;
			margin-bottom: 40px;
		}
	}
	&.Events_Section {
		background-color: var(--PanelBgColor);
		img {
			border-radius: 30px;
		}
		.Text {
			a {
				-webkit-line-clamp: 3;
				-webkit-box-orient: vertical;
				display: -webkit-box;
				overflow: hidden;
				width: fit-content;
				height: 4.5rem;
				margin-bottom: 10px;
				align-content: center;
			}
			width: 100%;
			margin: 0px;
			&,
			.Description {
				line-height: 1.5rem;
				font-size: 1rem;
			}
		}
		.Button_Wrapper {
			a {
				height: auto;
			}
		}
		h3 {
			margin: 10px 0px;
			color: var(--AccentColor);
		}
		h2 {
			margin-bottom: 15px;
			font-size: 25px;
		}
	}
}
.Description {
	width: 100%;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;
	font-weight: 300;
	margin-bottom: 25px;
}
.Maj {
	text-transform: uppercase;
}
#SearchResult_Section {
	ul {
		padding-left: 0px;
		list-style: none;
	}
	li {
		margin-bottom: 0.5rem;
	}
}
.MemberMap {
	position: relative;
	img {
		width: 100%;
	}
}
.puce {
	position: absolute;
	display: flex;
	z-index: 1;
	font-size: 0.6rem;
	font-weight: bold;
	text-align: center;
	transform: translate(-50%, -50%);
	> a {
		line-height: 1rem;
		width: 1rem;
		background-color: var(--AccentColor);
		height: 1rem;
		border-radius: 50%;
		color: var(--AccentFontColor);
		text-decoration: none;
	}
}
.pays {
	top: 100%;
	left: 50%;
	transform: translate(-50%);
	position: absolute;
	z-index: 20;
	/* font-size: 12px; */
	letter-spacing: -1px;
	text-align: center;
	text-transform: uppercase;
	font-weight: normal;
	white-space: nowrap;
}
.WSHeader1 {
	word-break: break-word;
	display: block;
	margin: auto;
	margin-bottom: 1rem;
	margin-top: 2.5rem;
	width: fit-content;
	text-align: center;
	font-size: 1.5rem;
	font-weight: 700;
}

/* .Detail_Title {
	font-size: 3rem;
	font-weight: 400;
	max-width: 56.9rem;
	margin-bottom: 0;
} */
.Section.Panel_Section {

	padding: 35px;
	box-sizing: border-box;
	gap: 0px;

	.DocList {
		padding-left: 0px;
		margin: 0px;
		display: flex;
		flex-direction: column;
		gap: 10px;
		padding-left: 1.5rem;
		line-height: 1.5rem;
		li a {
			word-wrap: break-word;
			line-break: anywhere;
			text-decoration: none;
			&:hover {
				text-decoration: underline;
			}
		}
	}
	> a {
		width: fit-content;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 50px;
		button {
			width: 100%;
		}
		margin-top: 45px;
		position: initial;
	}
	background-color: var(--PanelBgColor);
	#Date,
	#Location,
	#RelType {
		text-transform: uppercase;
		font-size: 1rem;
	}
	#Date {
		color: var(--AccentColor);
	}
	#Location,
	#RelType {
		color: #c2c2c2;
	}
	.Panel {
		.Img_Wrapper {
			border-radius: 20px;
			overflow: hidden;
		}
	}
	iframe {
		max-width: 100%;
	}
	.Button_Wrapper {
		display: flex;
		height: fit-content;
		flex-direction: column;
		gap: 15px;
		width: 100%;
		a {
			width: fit-content;
			button {
				height: 100%;
			}
		}
	}
	ul {
		list-style-type: disc;
		> li::before {
			/* font-size: 1.3rem; */
		}
		padding-left: 1.4rem;
		li::before {
			color: var(--AccentColor);
		}
		> li:not(ul ul > li) > ul {
			padding-left: 1.1rem;
			> li::before {
				content: "\25A0";
				font-size: 1rem;
			}
			> li ul {
				padding-left: 1.1rem;
				> li::before {
					content: "\25CB";
					font-size: 1rem;
				}
			}
		}
	}
	h2,
	.TitreTexteSection {
		font-size: 1.25rem;
		font-weight: 700;
		color: var(--AccentColor);
	}
	.Detail_Header {
		margin-bottom: 2rem;
		font-size: 1.25rem;
		img {
			margin-top: 2rem;
			max-height: 500px;
		}
	}
	.Detail_Text {
		font-weight: 300;
		text-align: justify;
		line-height: 1.5rem;
		a {
			text-decoration: none;
			&:hover {
				text-decoration: underline;
			}
		}
	}
	.News_Wrapper .Article,
	.Events_Wrapper .Panel {
		&:not(:last-of-type) {
			margin-bottom: 0px;
		}
	}
	&:not(#Page_Section) .Panel img {
		height: 220px;
		background-color: var(--bgColor);
        display: block;
	}
	&#Page_Section .Detail_Text img {
		border-radius: 15px;
		max-width: 100%;
		object-fit: contain;
	}
	.Detail_Header img {
		height: auto;
		border-radius: 30px;
		width: 100%;
		object-fit: cover;
	}
}
.MemberDesc img {
	display: none !important;
	max-width: 100%;
	object-fit: contain;
	height: fit-content;
}
.Panel_Title {
	display: -webkit-box;
	-webkit-line-clamp: 4;
}
.Section.Panel_Section .Panel_Title {
	display: -webkit-box;
	-webkit-box-orient: vertical;
	color: black;
	overflow: hidden;
	margin-bottom: 20px;
	text-transform: uppercase;
}

.Panel_Grid {
	padding: 20px 5%;
	display: grid;
	gap: 30px;
}
.ListItem_Wrapper {
	display: flex;
	row-gap: 1.5rem;
	flex-direction: column;
}
/*.Section.Panel_Section#MemberList {*/
/* flex-basis: 450px; */
.ListItemLogo {
	background-color: var(--PanelBgColor);
	width: 5rem;
	height: 5rem;
	display: inline-block;
	flex-shrink: 0;
	border-radius: 10px;
	object-fit: contain;
	margin-right: 2rem;
}
#LeftSide_Wrapper {
	position: sticky;
	top: 120px;
	height: fit-content;
	z-index: 1;
}

ul.text-list li {
	font: normal normal 300 20px/40px Figtree;

}



.Left_Side {
	.Detail_Text {
		font-size: 1rem;
		line-height: 1.5rem;
		text-align: justify;
		width: 100%;
		margin: 0px;
		padding: 2rem;
		background-color: var(--PanelBgColor);
		justify-self: end;
		box-sizing: border-box;
	}
	.Section {
		padding-right: 0;
		margin-bottom: 0 !important;
		overflow-y: scroll;
		scrollbar-width: none;
	}
	display: grid;
	grid-template-rows: auto 1fr;
	flex: 11;
}

a{
    cursor: pointer;
}

.ListItemDetail_Part ul li {
	margin-bottom: 8px;
}

.Member_Chapters {
	li::before {
		top: -0.1rem;
	}
	a {
		/* line-height: 1.5rem; */
		color: black;
		text-decoration: none;
		&:hover {
			text-decoration: underline;
		}
	}
	ul {
		display: flex;
		flex-direction: column;
		row-gap: 0.3rem;
		margin: 0;
	}
}
.ShowMore_Btn {
	user-select: none;
	display: grid;
	position: absolute;
	right: 1rem;
	height: 1.5rem;
	width: 1.5rem;
	cursor: pointer;
	> * {
		/* color: white !important; */
		color: white;
	}
	background-color: var(--AccentColor);
	border-radius: 50%;
	align-items: center;
	justify-items: center;
	transition: color 0.3s, transform 0.3s;
}
#MemberList {
	row-gap: 1rem;
}
.DocTitle {
	user-select: none;
	cursor: pointer;
	position: relative;
	background-color: var(--bgColor);
	padding: 0.8rem;
	padding-left: 1.5rem;
	padding-right: 4rem;
	margin-bottom: 0.5rem;
	border-radius: 20px;

	h2 {
		margin: 0px;
	}
	.ShowMore_Btn {
		height: 1.5rem;
		width: 1.5rem;
		right: 2rem;
		top: 50%;
		translate: 0px -50%;
		background-color: var(--AccentColor);
		span {
			color: var(--PanelBgColor) !important;
		}
	}
}
.Section.Panel_Section .DocCategory {
	.DocList {
		display: none;
		padding-left: 3rem;
		padding-bottom: 1rem;
		a {
			word-wrap: break-word;
			text-underline-offset: 0.3rem;
		}
		li::before,
		a {
			color: black;
		}
	}
}
.ListItem {
	display: grid;
	row-gap: 1rem;

	padding: 2rem;
	background-color: var(--bgColor);
	border-radius: 30px;
	word-wrap: anywhere;
}
.ListItemLogo_Part {
	display: grid;
	grid-template-columns: auto 1fr;

	h1 {
		margin-block: 0px;
		align-self: center;
	}
}
.MemberDesc {
	margin-top: 1.5rem;
	position: relative;
	> div {
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		overflow: hidden;
		font-size: 0.9rem;
		margin: 0px;
		width: 84%;
	}
	.ShowMore_Btn {
		right: 0px;
		top: 0px;
		/* translate: 0px -50%; */
		width: 2rem;
		height: 2rem;
		span {
			font-size: 1.5rem;
			translate: 0px 0.1rem;
		}
	}
}
.ListItemDetail_Part {
	width: 100%;
	h1 {
		margin: 0px;
	}
	ul {
		padding: 0px !important;
		list-style-type: none !important;
		line-height: 1.7rem;
	}
}
#Page_404 {
	display: grid;
	align-content: center;
	min-height: calc(100vh - 110px - 6rem - var(--heightBandeauVersion));

	.WSHeader1 {
		margin-inline: auto;
		margin-block: 1.563rem;
		text-align: center;
	}
	.Detail_Text {
		margin-inline: auto;
		margin-bottom: 3.125rem;
		text-align: center;
		text-wrap: balance;
	}
	.nb404 {
		font-weight: 700;
		font-size: 7.5rem;
		line-height: 9rem;
		text-align: center;
		color: var(--AccentColor);
	}
	& > a {
		margin-block: 0px;
	}
}

.TitreTexteSection {
	margin-top: 2rem;
	margin-bottom: 1rem;
}

.header-global-wrapper {
	display: grid;
	grid-template-columns: repeat(3, auto);
    grid-template-rows: repeat(2, auto);
	align-items: center;
	padding-top: 15px;
	padding-left: var(--globalHorizontalPadding);
	padding-right: var(--globalHorizontalPadding);
	justify-content: space-between;
}


.ListItemDetail_Part ul li {
	display: flex;
	flex-direction: row;
	gap: 10px;
}
.ListItemDetail_Part ul li div,
.ListItemDetail_Part a,
.ListItemDetail_Part div {
	font: normal normal 300 17px/20px Figtree
}



ul li:has(.telecom-detail){

}

@media screen and (min-width: 500px){
	.footer-wrapper {
		display: flex;
		flex-direction: row;
		gap: 15px;
		align-items: center;
		max-width: min-content;
	}

	
	.footer-global-wrapper {
		padding: 25px var(--globalHorizontalPadding) 25px var(--globalHorizontalPadding);
		min-height: 20px;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: space-between;
		background: #A11515 0% 0% no-repeat padding-box;
	}

}

@media screen and (min-width: 700px) {

	.Section.Panel_Section {
		padding: 100px;
	}

	.Left_Side .Section {
		max-height: 80vh;
	}
	.WSHeader1 {
		margin-left: 0;
		margin-right: 0;
	}
	.Panel_Grid {
		display: grid;
		gap: 30px;
		padding: 0px;
	}
	.Info_Pratiques_Text {
		text-align: left;
		max-width: 30rem;
	}
	:not(#OrgMember_Page #MemberList) > .ListItem_Wrapper {
		grid-template-columns: repeat(auto-fit, minmax(25rem, 1fr));
	}
	.News_Wrapper,
	.Panel_Grid {
		grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
		margin-bottom: 4rem;
	}
	.Panel_Grid {
		column-gap: 30px;
		row-gap: 60px;
		.Panel {
			border-radius: 0px !important;
		}
	}
	.Panel_Grid {
		&.News_Wrapper {
			.Panel_Title {
				-webkit-line-clamp: 4;
				height: 5.9rem;
			}
		}
	}
	.Left_Side .Detail_Text {
		border-radius: 30px;
		margin-bottom: 1.5rem;
	}
	#OrgMember_Page {
		display: flex;
		flex-wrap: wrap;
		gap: 2rem;
	}
	.Section.Panel_Section#MemberList {
		margin-bottom: 0px;
		flex: 10;
		flex-basis: 501px;
		padding-left: 3rem;
		padding-right: 3rem;
	}
	#LeftSide_Wrapper {
		margin-left: auto;
		margin-right: auto;
		top: 130px;
		width: 100%;
		min-width: 25rem;
		.Panel_Section {
			padding-right: 0px;
		}
	}
	.MemberMap {
		img {
			border-radius: 30px;
		}
		width: 100%;
		/* height: 27.2rem; */
	}
	.Section.Panel_Section .Panel_Title {
		height: 3rem;
		-webkit-line-clamp: 2;
		font-weight: normal;
	}
	#Resume {
		padding: 0px;
	}
	.EventsSlider img {
		background-color: transparent;
	}
	h1 {
		font-size: 1.5rem;
	}
	#Events img,
	#Events .ImgPanel {
		border-radius: 0px !important;
		max-height: initial;
	}

	.Section {

		padding:30px 100px 80px 100px;

		&:not(#Intro) {
			margin-bottom: 80px;
		}

		&:not(.News_Section, .Events_Section, #Page_Section) .Panel {
			border-radius: 30px;
			height: 100%;
			display: flex;
			flex-direction: column;

			/* width: 100%; */
			&:not(.ImgPanel) {
				background-color: var(--PanelBgColor);
			}
		}

		background-color: transparent;
		padding: 0px;
	}
	#Intro {
		height: calc(100lvh - 160px);
		max-height: 39rem;
		min-height: 30rem;

		.Panel {
			position: relative;
			.Head {
				position: absolute;
				background-color: rgba(255, 255, 255, 0.418);
				width: 100%;
				height: 200px;
			}
			h1 {
				font: normal normal bold 2rem Figtree;
				max-width: 1000px;
				width: auto;
				padding-left: 0px;
				padding-right: 0px;
				margin-bottom: 35px;
				margin-left: 5.8rem;
				margin-right: 38%;
			}

			.Scroll_Down {
				right: 10%;

				* {
					padding: 0px;
					margin: 0px;
				}
				.Mobile_Hidden {
					display: block;
				}
				.material-symbols-outlined {
					font-size: 1.5rem;
				}
			}

			img {
				object-fit: cover;
				flex-grow: 1;
			}
		}
	}
	.Main_Content > h1 {
		margin-bottom: 60px;
		margin-top: 100px;
	}

	.Main_Content > .Panel_Section > h1 {
		margin-bottom: 60px;
		/* margin-top: 100px; */
	}



	.Text {
		box-sizing: border-box;
		padding: 70px 50px 70px 50px;
		/* width: 80%;
		padding: 20px 0px;
		margin: auto 10%; */

		H2 {
			margin: 0px;
			font-weight: 700;
			width: 100%;
			text-transform: uppercase;
		}
	}

	.Section#Resume {

		.ImgPanel {
			/* width: 35vw; */
			/* max-width: 460px;  */
			grid-row: 1;
			grid-column: 1;
			max-height: 250px;
			img {
				height: 100%;
			}
		}
		/* .Text p {
			font-size: 20px;
		} */
		.Panel:not(.ImgPanel) {
			width: 100%;
		}

		button {
			padding-left: 30px;
			padding-right: 30px;
			width: fit-content;
		}
	}

	.News_Section {
		&#AllNews {
			.Panel > p {
				-webkit-line-clamp: 4;
				height: 120px;
				max-height: 120px;
			}
		}
		position: relative;
		img {
			height: 300px;
			border-radius: 30px;
		}
		.Panel > p {
			height: 90px;
			/* margin: 20px 0px; */
		}
		> a {
			position: absolute;
			right: 0px;
			bottom: 0px;
			.Mobile_Hidden {
				display: flex;
			}
		}
		.Button_Wrapper {
			.Button_Arrow {
				display: initial;
			}
			a {
				width: initial;
			}
			button {
				width: 100%;
			}
		}
	}
	.Section#Events {
		h1 {
			text-align: left;
			padding-left: 0px;
			padding-right: 0px;
		}

		.EventsSlider {
			padding-left: 0px;
			padding-right: 0px;
			gap: 100px;
		}

		.Panel {
			display: flex;
			height: fit-content;
			flex-direction: row !important;
			max-height: 500px;
			height: 500px;
			width: 100%;
			> * {
				flex: 1 1 50%;
			}
			.Img_Wrapper {
				width: 100%;
				min-width: 30vw;

				.ImgPanel {
					max-height: initial;
					object-fit: cover;
					height: 100%;
					width: 100%;
				}
			}
			.Mobile_Hidden {
				display: -webkit-box;
			}
			.Text {
				h3:last-of-type {
					color: var(--AccentColor);
				}

				margin: 0px;
				padding: 7%;
				button {
					padding-left: 30px;
					padding-right: 30px;
					width: fit-content;
					p {
						width: fit-content;
					}
				}
				div {
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 3;
					overflow: hidden;

					p {
						line-height: 30px;
						width: 90%;
						font-size: 20px;
					}
				}
			}
			a {
				font-size: 30px;
				text-transform: uppercase;
				font-weight: 600;
			}
		}
		.Event_Footer {
			margin-top: 40px;
			position: relative;
			flex-direction: row;
			align-items: center;
			justify-content: center;
			height: 100%;
			#DotBar {
				margin: 0px;
			}
			> a {
				position: absolute;
				width: fit-content;
				right: 0px;
				margin: 0px;
			}
		}
	}
	.Section.Panel_Section {
		/* padding-left: 3rem;
		padding-right: 3rem; */
		.Description {
			height: 6rem;
			-webkit-line-clamp: 5;
		}
	}
	.Section {
		&.Events_Section,
		&.News_Section {
			/* h1 {
				text-align: initial;
			} */
		}
		&.Events_Section {
			.Panel:not(#First_Event) .Button_Wrapper {
				flex-direction: column;
				button {
					padding-left: 55px;
					padding-right: 55px;
				}
				a {
					height: auto;
				}
			}
			.Description {
				-webkit-line-clamp: 4;
				margin-bottom: 25px;
			}
		}
	}
	#FutureEvent {
		.Panel_Grid .Panel:first-of-type {
			margin-bottom: 80px;
			height: 550px;
			gap: 25px;
			width: 100%;
			display: grid;
			grid-column-start: 1;
			grid-column-end: -1;
			grid-template-columns: 55% 40%;
			justify-content: space-between;
			.Img_Wrapper {
				grid-column-start: 1;
				grid-row: 1 / span 2;
				img {
					height: 100%;
					min-width: 0px;
				}
			}
			.Text_Wrapper {
				grid-column-start: 2;
				align-self: flex-end;
			}
			.Description {
				-webkit-line-clamp: 5;
				height: fit-content;
				max-height: 170px;
			}
			.Button_Wrapper {
				flex-direction: row;
				width: 100%;
				flex-wrap: wrap;
				button {
					width: 100%;
				}
				a:has(.Info_Btn) {
					flex: 3 0 0;
				}
				a:has(.Register_Btn) {
					flex: 2 0 0;
				}
			}
		}
	}

	.footer-wrapper {
		display: flex;
		flex-direction: row;
		gap: 30px;
		/* align-items: center; */
		max-width: none;
	}
}

@media screen and (min-width: 1200px) {

	.Section#Resume {
        & .ImgPanel {
			max-height: none;
			max-width: 540px;
        
		}
	}


	.Text {
		padding: 140px 100px 140px 100px;
	}

	.Section#Resume {
		grid-template-columns: auto auto;
	}

	Section#Resume {
        .ImgPanel {
			max-width: none;
			width: 100%;
		}
	}
/* 
	.ImgPanel {
		height: 100%;
		max-height: none;
		min-width: 460px;
	} */

	.Desktop_Hidden {
		display: none;
	}

	body {
		.Main_Content {
			padding : 30px var(--globalHorizontalPadding) 100px var(--globalHorizontalPadding);
		}
	}

	.section-wrapper {
		display:flex;
		flex-direction:column;
		gap:80px;
	}

	.txt-n-img-img {
		max-height:535px;
		width:540px;
	}

	.txt-n-img-wrapper {
		display:flex;
		flex-direction:row;
		gap:80px;
	}

	.sub-section-wrapper {
		padding: 100px;
		background: #FFFFFF 0% 0% no-repeat padding-box;
		border-radius: 30px;
		display: flex;
		flex-direction: column;
		/* gap: 80px; */
	}


	.Page_Contact_Global_Wrapper {
		background: #FFFFFF 0% 0% no-repeat padding-box;
		border-radius: 30px;
		padding:100px;
		display:flex;
		flex-direction:row;
		gap:100px;	
	}

	.ContactForm {
		display: flex;
		flex-direction: column;
		gap: 30px;
		max-width: 710px;
		line-height: 1.5rem;
		width: 100%;
		min-height: 100%;
		justify-content: space-between;


		.ContactForm_Wrapper {
			display: flex;
			flex-direction: row;
			gap:30px;
		}
	}

}

@media screen and (min-width: 1300px) {
	.Mobile_Hidden {
		display: block;
	}
}

.modalDialog_contentDiv{
    padding: 1rem;
    border-radius: 30px;
    background-color: var(--white);
    font-family: "figtree", sans-serif;
    box-shadow: 0px 0px 6px var(--AccentColor);
    border: none;
	max-width: calc(100% - 4rem);
	margin-inline: auto;
	left: 0 !important;
	right: 0 !important;
	height: auto !important;
}
.modalDialog_transparentDivs{
    z-index: 25;
}
#DHTMLSuite_modalBox_contentDiv p{
    margin-block: 10px;
}
#DHTMLSuite_modalBox_contentDiv button {
	/* position: absolute;
	bottom: 1rem;
	right: 1rem;
	left: 1rem; */
	width: 100%;
}