@import url('https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap');

:root{
	
	--bleu:#113B6A;
	--vert: #ADFFAD;
	--bleuClair: #C2DEFF;
	--gris: #D2D1D6;
	--violet: #190933;
	--grisTexte: #666;
	--noirTexte: #222;
	
	--bleuAlpha33:#113B6A33;
	--vertAlpha33: #ADFFAD33;
	--bleuClairAlpha33: #C2DEFF33;
	--grisAlpha33: #D2D1D633;
	--violetAlpha33: #19093333;
	
	--bleuAlphaEE:#113B6AEE;
	--vertAlphaEE: #ADFFADEE;
	--bleuClairAlphaEE: #C2DEFFEE;
	--grisAlphaEE: #D2D1D6EE;
	--violetAlphaEE: #190933EE;
	
}

*{margin:0;padding:0;}html{width:100%;box-sizing: border-box;font-size:100%;overflow-x:hidden;scroll-behavior: smooth;}img{border:none;}*, *:after, *:before{box-sizing: border-box;} 
body{background:#FFF;font-family: "Public Sans", sans-serif;font-weight:400;font-size:1.4rem;line-height:2rem;color:var(--noirTexte);text-align:center;} 

a{
	color: var(--bleu);
	text-decoration: none;
}
a:hover{
	text-decoration: underline;
}

p, ul{
	margin-bottom: 1.4rem;
}

li{
	margin: 0 0 1rem 2rem;
}

li ul{
	margin-top: 1rem;
}

p:last-child, ul:last-child, li:last-child{
	margin-bottom: 0;
}

h1{
	color: var(--bleu);
	font-weight: 900;
	font-size: 3rem;
	line-height: 3rem;
}

h2{
	font-size: 2rem;
	font-weight: 500;
	text-transform: uppercase;
}

h3{
	color: var(--bleu);
  	font-weight: 500;
}

table{border-collapse:collapse;margin:0 0 4ch 0;width:100%;}
td{border:1px solid #CCC;padding:1ch 2ch;}
table p{margin:0;}

#container{
	width: 100vw;
	min-height: 100vh;
	overflow-x: hidden;
}

.ban, .banMobile{
	display:flex;
	justify-content: space-between;
	align-items: stretch;
	
	box-shadow: 1px 1px 5px rgb(0,0,0,.2);
}

.banMobile{
	display:none;
}

.ban .logo{
	background: #FFF;
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 2ch;
	border-radius: 0 0 5px 0;
	
}

.ban .logo img{
	width: 6ch;
	height: auto;	
}

.ban .menu{
	display: flex;
	justify-content: center;
	gap: 2ch;
	align-items: center;
	background: var(--bleu);
	flex: 1;
	padding: 3ch;
	color: white
}

.ban .menu a{
	color: white;
	text-decoration:none;
	padding: .5ch 1ch;
	background: transparent;
	border-radius: 5px;
}
.ban .menu a:hover, .ban .menu a.on{
	background: var(--gris);
	color: var(--bleu);
}

.ban .recherche {
	background: var(--gris);
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 2ch;
}

.ban .recherche svg{
	width: 3ch;
	height: 3ch;
}

.ban .recherche svg .loupe{
	fill: var(--noirTexte)
}

.sousNav{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 20px;
	padding: 0 3ch 3ch 3ch;
}

.sousNav a{
	border: 2px solid var(--bleu);
	color: var(--bleu);
	padding: 5px 10px;
	border-radius: 0 0 5px 5px;
	background: var(--bleuAlpha33);
	border-top: none;
}

.sousNav a:hover, .sousNav a.on{
	color: #FFF;
	background: var(--bleu);
	text-decoration: none;
}

#hamburger{display:none;}

marquee.bandeauUne{
	background: var(--vert);
	color: rgb(0,0,0,.8);
	padding: 2ch;
	display: block;
	text-decoration:none;
}
.splashUne{
	width: 100%;
	height: 40vh;
	background-color: var(--gris);
	display: grid;
	grid-template-columns: 15ch 2fr 15ch;
	grid-template-rows: 1fr auto;
}

.splashUne .fond{
	width: 100%;
	height: 100%;
	overflow: hidden;
	grid-area: 1 / 1 / 3 / 4;
}
.splashUne .fond a{
	width: 100%;
	height: 100%;
	display: block;
}
.splashUne .fond a img.photo{
	width: 100%;
	object-fit: cover;
	height: 100%;
}

.splashUne .texte{
	grid-area: 2 / 2 / 3 / 3;
	background-color: var(--bleuAlphaEE);
	padding: 2ch;
	border-radius: 10px 10px 0 0;
	color: white;
	text-align: left;
	display: flex;
	flex-direction: column;
	gap: 1ch;
}

.splashUne .texte .titre{
	color: var(--bleuClair);
	font-weight: 900;
	font-size: 3rem;
	text-decoration: none;
}

.splashUne .texte .chapo, .splashUne .texte .chapo a{
	color: white;
	text-decoration: none;
}

.newsUne{
	display: flex;
	padding: 5ch 15ch;
	width: 100%;
	gap: 2.5ch 5ch;
	flex-wrap: wrap;
}
.newsUne > hr:last-child, .listeActualites > hr:last-child{
	display:none;
}

.newsUne .newsUneElement, .listeActualites .newsUneElement{
	flex: 1;
	text-align: left;
}

.newsUne .newsUneElement .photo, .listeActualites .newsUneElement .photo{
	width: 100%;
	border-radius: 10px;
}

.newsUne .newsUneElement .date,
.newsUne .newsUneElement .date a,
.listeActualites .newsUneElement .date,
.listeActualites .newsUneElement .date a{
	font-size: 1rem;
	color: var(--grisTexte);
	text-decoration:none;
	font-style: italic;
}

.newsUne .newsUneElement .titre,
.newsUne .newsUneElement .titre a,
.listeActualites .newsUneElement .titre,
.listeActualites .newsUneElement .titre a{
	font-size: 1.5rem;
	color: var(--bleu);
	text-decoration:none;
	font-weight: 900;
}

.newsUne .newsUneElement .chapo,
.newsUne .newsUneElement .chapo a,
.listeActualites .newsUneElement .chapo,
.listeActualites .newsUneElement .chapo a{
	font-size: 1.2rem;
	color: var(--noirTexte);
	text-decoration:none;
	font-weight: 400;
}

.newsUne .newsUneElement .chapo,
.newsUne .newsUneElement .chapo .chapoIn,
.listeActualites .newsUneElement .chapo,
.listeActualites .newsUneElement .chapo .chapoIn{
	display: -webkit-box;
    -webkit-line-clamp: 2; /* Number of lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}

.facebook{
	background-color: var(--grisAlpha33);
	background: url(assets/images/interface/bg-facebook.jpg) center no-repeat;
	background-size: 100%;
	padding: 5ch 15ch;
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 3ch;
}

.facebook a{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 3ch;
}

.facebook .logoFacebook{
	width: 5ch;
	height: 5ch;
}

.facebook .logoFacebook .logofb{
	fill: #3b5998;
}

.facebook a .texte{
	font-weight: 900;
	text-transform: uppercase;
	color: #3b5998;
	font-size: 3rem;
	line-height: 3rem;
	text-decoration: none;
}

.titreAgenda{
	padding: 5ch 5ch 0;
}



.agendaUne{
	display: grid;
	gap: 5ch;
	padding: 5ch 15ch;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	
	&:empty{
		display: none;
	}
}

.agendaUne > hr:last-child, .listeAgenda > hr:last-child{
	display:none;
}

.agendaUne .agendaUneElement, .listeAgenda .agendaUneElement{
	background-color: var(--violet);
	border-radius: 10px;
	overflow:hidden;
	text-align: left;
	flex: 1;
}

.agendaUne .agendaUneElement .image, .listeAgenda .agendaUneElement .image{
	display: grid;
	grid-template-rows: 20px auto 1fr;
	grid-template-columns: 20px auto 1fr;
}


.agendaUne .agendaUneElement .image .photo, .listeAgenda .agendaUneElement .image .photo{
	width: 100%;
	height: auto;
	display: block;
	grid-area: 1 / 1 / -1 / -1;
}
.agendaUne .agendaUneElement .image .dateLisible, .listeAgenda .agendaUneElement .image .dateLisible{
	grid-area: 2 / 2 / 3 / 3;
	display: block;
}

.agendaUne .agendaUneElement .image .dateLisible, .listeAgenda .agendaUneElement .image .dateLisible{
	background: var(--violetAlphaEE);
	color: #FFF;
	text-transform: uppercase;
	font-weight: 600;
	border-radius: 5px;
	border: 3px solid #FFF;
	padding: 5px 10px;
	grid-area: 2 / 2 / 3 / 3;
	font-size: 1rem;
	box-shadow: 2px 2px 5px rgb(0,0,0,.2);
}

.agendaUne .agendaUneElement a .titre, .listeAgenda .agendaUneElement a .titre{
	padding: 20px 20px 0;
	display: -webkit-box;
    -webkit-line-clamp: 1; /* Number of lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.agendaUne .agendaUneElement a .titre, .listeAgenda .agendaUneElement a .titre{
	font-size: 1.5rem;
	color: white;
	text-decoration:none;
	font-weight: 900;
}

.agendaUne .agendaUneElement a > .chapo, .listeAgenda .agendaUneElement a > .chapo{
	padding: 0 20px 20px;
}

.agendaUne .agendaUneElement a > .chapo, .listeAgenda .agendaUneElement a > .chapo{
	font-size: 1.2rem;
	color: white;
	text-decoration:none;
	font-weight: 400;
}

.agendaUne .agendaUneElement a > .chapo, .agendaUne .agendaUneElement a > .chapo .chapoIn, .listeAgenda .agendaUneElement a > .chapo, .listeAgenda .agendaUneElement a > .chapo .chapoIn{
	display: -webkit-box;
    -webkit-line-clamp: 2; /* Number of lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
.footer{
	display: flex;
	text-align: left;
	padding: 5ch 15ch;
	gap: 5ch;
	justify-content: space-between;
	align-items: stretch;
	background: var(--bleuClairAlpha33);
	border-top: 2px solid var(--bleuClair);
}

.footer p.entete{
	color: var(--bleu);
  	font-weight: 500;
}

.footer .liens, .footer .contact{
	display: flex;
	flex-direction: column;
	gap: 1ch;
}

.footer .liens{
	justify-content: space-between;
}

.footer .contact{
	border-left: 2px solid var(--bleuClair);
  	padding: 0 0 0 5ch;
}

.actualites{
	padding: 5ch 15ch;
	text-align: left;
}
.listeActualites{
	display: grid;
	gap: 5ch;
	flex-wrap: wrap;
	padding: 5ch 0 0 0;
	grid-template-columns: repeat(4, 1fr);
}

hr{
	flex-basis: 100%;
	height: 0;
	margin: 0;
	border: none;
}
.navig{
	display: flex;
	justify-content: center;
	width: 100%;
	gap: 5ch;
	grid-column-start: 1;
	grid-column-end: 5;
}
.navig a{
	display: flex;
	gap: 1ch;
	align-items: center;
}
.navig a svg{
	height: 2ch;
}
.navig a svg .fond{
	fill: var(--bleu);
}


.article{
	display: flex;
	gap: 3ch;
	flex-direction: column;
	text-align: left;
}

.article .imageban{
	width: 100%;
	max-height: 40vh;
}

.article .imageban img{
	width: 100%;
	object-fit: cover;
	height: 100%;
}

.article .titreEtDate, .article .textesEtImages{
	padding: 0 15ch;
}

.article .titreEtDate{
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 5ch;
	padding-top: 5ch;
}

.article:has(.imageban) .titreEtDate, .article:has(.imagebanAgenda) .titreEtDate, #container:has(.sousNav) .article:not(:has(.imageban)) .titreEtDate{
	padding-top: 0;
}

.article .titreEtDate .date{
	white-space: nowrap;
	font-style: italic;
	color: var(--grisTexte);
	text-align: right;
	font-size: 1.2rem;
	line-height: 1.2rem;
}

.article .textesEtImages .contenuTexte{
	display: flex;
	flex-direction: column;
	gap: 2ch;
}

.article .chapo{
	font-weight: 700;
}

.article .textesEtImages{
	display: flex;
	gap: 5ch;
	justify-content: space-between;
	padding-bottom: 5ch;
}

.article:has(.blocInfos) .textesEtImages {
	padding-bottom: 0;
}

.article .images{
	display: flex;
	flex-direction: column;
	gap: 2ch;
}

.article .images:not(:has(img)){
	display: none;
}

.article .images img{
	width: 20vw;
	border-radius: 10px;
}
.article .blocInfos{
	background-color: var(--gris);
	padding: 5ch 15ch;
}
.article h2{
	margin-bottom: 2rem;
}
.article h3{
	margin-bottom: 1.4rem;
}



.agenda{
	padding: 5ch 15ch;
	text-align: left;
}
.listeAgenda{
	display: grid;
	gap: 5ch;
	padding: 5ch 0 0 0;
	grid-template-columns: 1fr 1fr 1fr 1fr;
}

.article .imagebanAgenda{
	width: 100%;
	max-height: 40vh;
	display: grid;
	grid-template-columns: 15ch auto 1fr;
	grid-template-rows: 20px auto 1fr;
}

.article .imagebanAgenda a {
	grid-area: 1 / 1 / -1 / -1;
}
.article .imagebanAgenda .dateLisible {
	background: var(--violetAlphaEE);
	color: #FFF;
	text-transform: uppercase;
	font-weight: 600;
	border-radius: 5px;
	border: 3px solid #FFF;
	padding: 5px 10px;
	grid-area: 2 / 2 / 3 / 3;
	font-size: 1rem;
	box-shadow: 2px 2px 5px rgb(0,0,0,.2);
}

.article .imagebanAgenda img{
	width: 100%;
	object-fit: cover;
	height: 100%;
}

.membresConseil{
	display: flex;
	flex-wrap: wrap;
	gap: 4ch;
}

.membresConseil .membre{
	display: flex;
	flex-direction: column;
	align-items: center;
}

.imageMembre .photo{
	width: 13.4vw;
	border-radius: 10px;
}

.nomMembre{
	font-size: 1rem;
	line-height: 1rem;
	text-align: center;
}

.comptesrendus{
	display: flex;
	flex-wrap: wrap;
	gap: 4ch 10ch;
}

.comptesrendus .annee{
	
}

.bureau{
	width: 20vw;
	background: var(--vertAlphaEE);
	padding: 3ch;
	border-radius: 10px;
}

.imagePleineLargeur, .imagePleineLargeur .photo{
	width: 100%
}
fieldset{
	border: none;
	display: flex;
	gap: 2ch;
	margin-bottom: 3ch;
}

#ajaxSearch_input{
	font-size: 1.5rem;
	padding: 5px 10px;
	border-radius: 10px;
	border: 2px solid var(--grisTexte);
	height: 60px;
	width: 400px;
}

#ajaxSearch_submit{
	height: 60px;
	color: #FFF;
	background: var(--bleu);
	border-radius: 10px;
	border: none;
	font-size: 2rem;
	text-transform: uppercase;
	padding: 5px 20px;
	font-weight: 600;
	cursor: pointer;
}

.rechercheUneElement{
	display: flex;
	gap: 2ch;
	margin: 3ch 0;
	padding-bottom: 3ch;
	border-bottom: 2px solid var(--gris);
}

.rechercheUneElement .titre{
	font-size: 2rem;
	font-weight: 150;
	text-transform: uppercase;
}

.rechercheUneElement .photo{
	height: 10ch;
	border-radius: 10px;
}

@media screen and (max-width : 1440px){
	
	.imageMembre .photo{
		width: 14.9vw;
	}
}

@media screen and (max-width : 1080px){ 
	
	body{font-size: 2.8rem;line-height: calc(1.43 * 2.8rem);;}
	
	h1{font-size: 6rem;line-height: calc(1.43 * 6rem);}
	h2{font-size: 3.2rem;line-height: calc(1.43 * 3.2rem);}
	
	.newsUne .newsUneElement .titre, .newsUne .newsUneElement .titre a, .listeActualites .newsUneElement .titre, .listeActualites .newsUneElement .titre a{
		font-size: 3rem;
		line-height: calc(1.43 * 3rem);
	}
	.newsUne .newsUneElement > .chapo, .newsUne .newsUneElement > .chapo a, .listeActualites .newsUneElement > .chapo, .listeActualites .newsUneElement > .chapo a{
		font-size: 2.4rem;
		line-height: calc(1.43 * 2.4rem);
	}
	
	.newsUne .newsUneElement .date, .newsUne .newsUneElement .date a, .listeActualites .newsUneElement .date, .listeActualites .newsUneElement .date a{
		font-size: 2rem;
		line-height: calc(1.43 * 2rem);
	}
	
	.agendaUne .agendaUneElement .titre, .agendaUne .agendaUneElement .titre a, .listeAgenda .agendaUneElement .titre, .listeAgenda .agendaUneElement .titre a{
		font-size: 3rem;
		line-height: calc(1.43 * 3rem);
	}
	.agendaUne .agendaUneElement .image .dateLisible, .listeAgenda .agendaUneElement .image .dateLisible{
		font-size: 2rem;
		line-height: calc(1.43 * 2rem);
	}
	.agendaUne .agendaUneElement > .chapo, .agendaUne .agendaUneElement > .chapo a, .listeAgenda .agendaUneElement > .chapo, .listeAgenda .agendaUneElement > .chapo a{
		font-size: 2.4rem;
		line-height: calc(1.43 * 2.4rem);
	}

	.ban{
		display:none;
	}

	.banMobile{
		display:flex;
	}
	
	.banMobile .logo{
		background: #FFF;
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 1ch;
		border-radius: 0 0 5px 0;
	
	}

	.banMobile .logo img{
		width: 5ch;
		height: auto;	
	}

	.banMobile .menu{
		display: flex;
		justify-content: flex-end;
		gap: 2ch;
		align-items: center;
		background: var(--bleu);
		flex: 1;
		padding: 2ch;
		color: white
	}

	.banMobile .menu svg{
		width: 3ch;
		height: 3ch;
	}

	.banMobile .menu svg .fond{
		fill: #FFF;
	}

	.banMobile .recherche {
		background: var(--gris);
		display: flex;
		justify-content: center;
		align-items: center;
		padding: 2ch;
	}

	.banMobile .recherche svg{
		width: 3ch;
		height: 3ch;
	}

	.banMobile .recherche svg .loupe{
		fill: var(--noirTexte)
	}
	.sousNav{
		display:none;
	}
	
	#hamburger{
		display: flex;
		width: 100vw;
		height: 100vh;
		padding: 3ch;
		position: fixed;
		top: 0;
		left: -100vw;
		background: #FFF;
		flex-direction: column;
		text-align: left;
		gap: 3ch;
		transition: left .2s ease-in-out;
	}
	
	#hamburger .logoCroix{
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	
	#hamburger .logoCroix img{
		width: 6ch;
		height: auto;
	}
	
	#hamburger .logoCroix svg{
		width: 3ch;
		height: 3ch;
	}
	
	#hamburger .logoCroix svg .fond{
		fill: var(--bleu);
	}
	
	#hamburger .menu{
		display: flex;
		flex-direction: column;
		gap: 1.5ch;
	}
	
	.sousNavMobile{
		display: flex;
		flex-direction: column;
		padding-left: 1.5ch;
		gap: 1.5ch;
		border-left: 10px solid var(--bleuClair);
	}
	
	.splashUne{
		grid-template-columns: 3ch 1fr 3ch;
	}
	
	.splashUne .texte .titre{
		font-size: 3.5rem;
		line-height: calc(1.43 * 3.5rem);
	}
	.newsUne{
		padding: 3ch 3ch;
		flex-direction: column;
	}
	
	.newsUne .newsUneElement .photo, .listeActualites .newsUneElement .photo{
		height: 20vh;
		object-fit: cover;
	}
	
	.facebook{
		flex-direction: column;
		font-size: 1.1vw;
		padding: 3ch;
		gap: 1ch;
		background-size: auto 100%;
	}
	
	.titreAgenda {
	  padding: 3ch 3ch 0;
	}
	
	.agendaUne{
		padding: 3ch;
		grid-template-columns: 1fr;
	}
	
	.footer{
		flex-direction: column;
  		padding: 3ch;
	}
	
	.footer .contact {
		border-left: none;
		border-top: 2px solid var(--bleuClair);
		padding: 5ch 0 0 0;
	}
	
	.actualites{
		padding: 3ch;
	}
	
	.listeActualites{
		grid-template-columns: 1fr;
	}
	
	.navig{
		grid-column-end: 2;
	}
	
	.agenda{
		padding: 3ch;
	}
	
	.listeAgenda{
		flex-direction: column;
	}
	
	.article .titreEtDate, .article .textesEtImages{
		padding-left: 3ch;
		padding-right: 3ch;
		gap: 1ch;
		align-items: end;
	}
	
	.article .titreEtDate h1{
		align-self: flex-start;
	}
	
	.article .textesEtImages .bureau{
		width: 100%;
	}
	
	.imageMembre .photo {
		width: 36vw;
	}
	.nomMembre{
		font-size: 2rem;
		line-height: 2rem;
	}
	
	#container:has(.sousNav) .article:not(:has(.imageban)) .titreEtDate {
  		padding-top: 5ch;
	}
	
	table{
		font-size: 1.3rem;
	}
	td{
		border: 2px solid #CCC;
		padding: 0.5ch 1ch;
	}
	
	.article .imagebanAgenda{
		grid-template-columns: 3ch auto 1fr;
	}
	
}