:root {
	--largeur-base: 1000px;
	--largeur-content: calc(var(--largeur-base)*0.7);
	--largeur-aside: calc(var(--largeur-base)*0.25);
	--gouttiere-layout: calc(var(--largeur-base) - var(--largeur-content) - var(--largeur-aside));
	--margin-more-petit-ecran: calc(var(--largeur-content) + var(--largeur-aside) + var(--gouttiere-layout)*1.9);
	--padding-container: 1.5em;
}
body {
	width: 100%!important;
	max-width: 100%!important;
}
body.sans_logo {
	padding-top: var(--hauteur_barre);
	margin-top:  calc(var(--gouttiere-layout)/2);
}

#skiplink {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}
.container {
	display: flex;
	flex-direction: row;
	column-gap: var(--gouttiere-layout);
	padding: 0 var(--padding-container);
	justify-content: center;
	margin: 0 auto;
}

.content{
	flex-basis: var(--largeur-content);
}
.aside {
	flex-basis: var(--largeur-aside);
	width:auto;
	flex-shrink: 1;
}
/* Si pas de troisième colonne, répartir l'espace  gagné entre les autre colonnes */
.without-more .content {
	flex-basis: calc(var(--largeur-content) + var(--largeur-aside) * 0.10);
}
.without-more .aside {
	flex-basis: calc(var(--largeur-aside)*1.9);
}

/* Gestion de la une*/
.une-2 .posts {
	display:flex;
	column-gap: calc(var(--gouttiere-layout)/2);
}
.une-2 .post {
	flex-basis: calc(var(--largeur-content)/2);
}





@media (max-width: 820px) {

	.container {
		flex-direction: column;
	}

	#skiplink {
		clip: none;
		width: auto;
		height: auto;
		position: static;
	}
	#skiplink ul {
		padding-left: calc(var(--gouttiere-layout)*0.3 + var(--padding-container));
		padding-bottom: 0px;
		font-size: 0.6em;
		flex-wrap: wrap;
	}

	/* Bien distinguer le .aside du reste */
	.aside {
		margin-top: 1em;
		padding-top: 1em;
		border-top: 1px solid #4F4039;
	}
	.container,  .content,  .aside {
		width: 100%!important;
		max-width: 100%!important;
		flex-basis:auto!important;
	}
}