@media (min-width: 640px) { 
	blockquote.spip { margin-bottom: 2em; padding-left: 3.5rem;  font-size: 1.25em; line-height: 1.5em; background-size: 50px 50px; }
}

@media screen and (max-width: 960px) { 
	#navprincipale button.burger[aria-expanded="true"] + #menuburger { visibility:visible; opacity: 1; color: var(--coul-fond);}
	#menuburger { z-index: 1100; visibility: hidden; opacity: 0; position: fixed; top: 0; right: 0; 
		padding-top: 5rem; overflow-y: scroll; width: 100%; height: 100%; text-align: center; background: var(--coul-texte);
		overscroll-behavior-y: contain; overflow-y: auto;
		transition: opacity 0.35s; }
	#menuprincipal { padding-top: var(--marge-l); font-size: 1.25rem;}
	#menuprincipal a { padding: var(--marge-s); }

	#focus { margin-bottom: var(--marge-l); }
	#focus .visuel { border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
	#focus header { border: 1px solid; border-top-left-radius: 0; border-top-right-radius: 0; border-top: 0;}

	.articles.actualites { margin-left: auto; margin-right: auto; max-width: 360px; }

}

@media (min-width: 960px) { 

	#header { position: fixed; z-index: 20; top: 0; padding-top: 10px ; width: 100%;
		box-shadow: 0 8px 10px 1px rgba(0,0,0,0.06); background:rgba(255, 255, 255, .3);
		transition: background var(--duree-transition), transform var(--duree-transition);}
	#header.cachee { transform: translateY(-100%); }
	#header.defile { background: var(--coul-fond); }
	#header .container { display: flex; justify-content: space-between; align-items: center; gap: var(--marge-l); }
	#navprincipale button.burger { display: none ; }
	#menuprincipal { display: flex; justify-content: space-between; gap: var(--marge); }

	#fildariane { margin-top: 6rem; }

	#focus { border: 10px solid var(--coul-fond); }
	#focus .container { position: relative; margin-bottom: var(--marge-l); }
	#focus header { z-index: 10; position: absolute; bottom: -5rem; right: 0; padding: var(--marge-l); max-width: 40vw;
	  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px; }

	#actus { margin-bottom: 13rem; margin-top: var(--marge-l); padding-top: var(--marge-l); }
	#actus .cartouche { margin: 0; width: 45%; }
	#actus .liste-items { margin-top: -13rem; display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(6, 1fr);
		gap: 0 var(--marge-l); }
	#actus .liste-items li:nth-of-type(1) { grid-row: span 3 / span 3; grid-row-start: 2;}
	#actus .liste-items li:nth-of-type(2) {grid-row: span 3 / span 3; grid-column-start: 2;}
	#actus .liste-items li:nth-of-type(3) { grid-row: span 3 / span 3; grid-column-start: 2; grid-row-start: 4;}
	#actus .voirtout { margin-top: -20rem; width: 45%; text-align: center; }

	.article_actualites header.cartouche { position: relative; }
	.article_actualites h1 { max-width: 80%; }
	header.cartouche .motclef { position: absolute; bottom: 50%; right: 0; }

	.liste.actualites a.bloc-picto { display: flex; gap: var(--marge-l); }
	.liste.actualites .texte_article { flex: 1; }

	#missions { padding-top: var(--marge-l);}

}

@media (max-width: 640px) { 

	/* layout */
	.container { display:inherit; }

	.header .spip_logo_site, .header #slogan { width:100%; text-align:center; }

	figure figcaption .legende { font-size:0.8em; }

	.resultats-recherche { margin:auto; max-width:360px; }
	.resultats-recherche .item a:link { display: block; }
	.resultats-recherche .vignette_zcm { margin:0 0 1em 0; width: auto; }

}