:root {
	--rosefonce: #c479a0;
	--roseClair: #eca6cb;
	--rosePale: #ecccd9;
	--bleufonce: #6c83cf;
	--bleuclair: #9ac7e8;
	--lavande:   #d5c7e8;
	--jauneClair: #ffff80;
	--jaune: #fff433;
	--violet:#9b58d0;
	--grisMoyen: hsl(0, 0%, 40%);
	--largeurSommaire: 100%;
	--largeurColonneDroite: 10%;
	--largeurPage: calc(100% - 2em);
	--largeurFleche: 3.5vw;
	--largeurTitre: calc(100% - 2em);
	--largeurRTA: min(5%, 10vw, 5%);
}
body {
background-color: var(--rosefonce);
font-family: "Verdana", "Arial", "Geneva", "sans-serif";
font-size: clamp(10px, 1em, 18px);
color: black;
}
.container {
display: flex;
flex-direction: column;
width: 100%;
align-items: flex-start;
gap: 1em;

}

div.sommaire {
    background-color : var(--rosePale);
	color:black;
	width: var(--largeurSommaire);
    font-size: clamp(14px, 1em, 14px);
    line-height: 3rem;
	text-align:left;
/*	  padding:1em;*/
 /*   position: sticky;*/
 /*   height: 100vh; */
}
 a {
    color: black;
	text-decoration: none;
	line-height: .5em;
}
div.titre1 {
    width: var(--largeurTitre);
	padding: 1rem;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement (si nécessaire) */
	background-color: var(--rosePale);
	border-bottom: solid;
	border-width: 2px;
	border-color: var(--bleufonce);
	}
div.titre2 {
    display: flex;
    justify-content: center; /* Centre horizontalement */
    align-items: center; /* Centre verticalement (si nécessaire) */
	background-color: var(--rosePale);
	margin-top:0;
	padding:1rem;
	border-bottom: solid;
	border-width: 1.5px;
	border-color: var(--bleufonce);
	}
div.page {
	width: calc(100% - 2em);
	font-size: clamp(14px, 1em, 24px);
	background-color:var(--rosePale);
	padding: 1em;
    }
 figcaption.doc {
	margin-top: .5rem;
    font-size: 0.9rem;
}
img {
	width: 100%;
 }
 img.article {
	width: 45%;
	}
h1,h2,h3,h4 {
	color: var(--bleufonce);
 }
  h1 {
	font-size: clamp(35px, 2.25em, 45px);
 }
 h2 {
	font-size: clamp(25px, 1.75em, 35px);
 }
 h3 {
	font-size: clamp(15px, 1.25em, 25px);
	margin-left:.1rem;
 }
 p.datesom{
	font-size: 0.9rem;
	margin-top: 0rem;
 }
 table, th, td {
	border: 1px solid black;
	width: auto;
 	text-align: center;
	padding: .15rem;
	font-size: 1rem;
	margin-top: 1vw;
	border-collapse: collapse;
}
ul.lien>li {
	margin-left: -0.5rem;
	color:black;
	list-style-type: circle;
	font-size: clamp(20px, 1rem, 26px);
    line-height: clamp(3rem, 1rem, .5rem);

}
ul.lien>li:hover {
	list-style: disc;
    color:black;
}

 /* Comportement */

 div.colonneDroite,
div#flecheh,
div#flecheb,
div.titre2
    {
		display: none;
    }	
div.pied {
	width: clamp(20%, 20%, 10%);
	display: flex;
	margin-left: auto;
	margin-right: auto;
}
/*
smartphone en paysage
*/
@media screen and (min-width: 900px) {
	:root {
		--largeurSommaire: 30%;
		--largeurColonneDroite: 10%;
		--largeurPage: 70%;
		--largeurFleche: 3.5vw;
		--largeurTitre: calc(100% - 2em);
	}
	.container {
		display: flex;
		flex-direction: row;
		width: 100%;
		align-items: flex-start;
		gap: 1em;
	}
	div.titre1 {
		display: none;
	}
	div.titre2 {
		display: flex;
	}
	div.sommaire {
		width: var(--largeurSommaire);
	}
	div.page {
		display:inline;
		width: var(--largeurPage);
	}
	figure{
		
		width:100%;	
	};
}
@media screen and (min-width: 1024px) {
	.container {
		display: flex;
		flex-direction: row;
		width: 100%;
		align-items: flex-start;
		gap: 1em;
		}
	/*,
	div#flecheh,
	div#flecheb */
	div.colonneDroite
	{ 
		display: flex;
		position: sticky;
		top:0;
	}
	div.sommaire {
		position: sticky;
    	top: 0;
    	max-height: 100vh;
    	overflow-y: auto;
		width:25%;
		line-height: .75rem;
		}
	div.page {
		width: 65%;
	}
	div.colonneDroite {
		flex-direction: column;
		width: 10%;
	}
}