@charset "UTF-8";

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

	html {
		/*font-size: 100%;*/
	}

	/* grid */
	#grid div { width: 25%; }

	/* désactivation des hover */

	a:hover { color: DodgerBlue; }

	/* - - - - - HEADER - - - - - */

	header {
		position: static;
		pointer-events: auto;
		padding: 0;
	}

	header .hamburger { display: none; }

	header h1 {
		float: none;
		margin: 4rem 0;
	}
	header h1 img {
		height: 7rem;
		margin: 0 auto;
	}

	header #menu {
		display: block !important;
		position: static;
		margin: 4rem 0;
		padding: 0;
	}

	header #menu nav { display: block; }

	header #menu nav ul {
		display: block;
		width: auto;
		margin: 0;
	}

	header #menu nav ul > li { display: block; }

	header #menu nav ul > li h2 {
		text-align: center;
		width: auto;
		padding: 1rem 0.25rem;
		border-right: none;
		border-bottom: 2px solid;
	}
	header #menu nav ul > li:first-child h2 {
		border-top: 2px solid;
	}

	header #menu nav ul > li ol { display: none; }

	header #menu nav .close { display: none; }

	header a:hover { color: inherit; }
	header li.active a:hover { color: DodgerBlue; }

	/* social networks */

	#menu .social h2 { display: none; }

	#menu .social ol {
		display: flex;
		justify-content: center;
		width: auto;
		margin: 1rem auto 0 auto;
		padding: 0;
	}

	#menu .social ol li { margin: 0 0.5rem; }

	#menu .social span { display: none; }
	#menu .social img { display: block; height: 2rem; }

	/* information pop-up + newsletter */

	#menu .popup, #menu .networks #newsletter { display: none; }

	/* - - - - - MAIN - - - - - */

	/* information pop-up */

	.popup a:hover { color: white; }

	body > .popup {
		position: static;
		padding: 0;
		pointer-events: none;
		z-index: 4;
	}

	body > .popup p {
		width: 100%;
	}

	body > .popup p:after {
		left: 50%;
		margin-left: -1rem;
	}

	/* title */

	.main h1 {
		font-size: 3.5rem;
		margin: 4rem 0;
	}

	/* figure */

	.main > figure {
		width: 100%;
		margin: 0 0 1rem 0;
	}

	.main > figure.hasCaption,
	section > figure.hasCaption,
	.article-simple > figure.hasCaption,
	.bloc-image figure.hasCaption {
		border-color: DodgerBlue	}

	figure.zoom:hover { color: inherit; }

	/* introduction */

	.main .introduction {
		/*text-align: left;*/
		width: 100%;
		padding: 0;
		border: none;
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}

	section > .texte {
		text-align: left;
		-webkit-hyphens: none;
		-moz-hyphens: none;
		-ms-hyphens: none;
		hyphens: none;
	}

	/* - - - - - SECTIONS - - - - - */

	section > figure {
		width: 66.66%;
		margin: 0 16.66% 1rem 16.66%;
	}

	figure .ghost,
	.galerie figure img {
		position: absolute;
		pointer-events: auto;
	}

	/* title & subtitle */

	section > h2 { font-size: 3rem; }

	section > .sous-titre {
		width: 100%;
		margin: 1rem 0;
		-webkit-hyphens: auto;
		-moz-hyphens: auto;
		-ms-hyphens: auto;
		hyphens: auto;
	}

	section > h2 + .texte,
	section > h2 + .events,
	section > h2 + .galerie,
	section > h2 + .video { margin-top: 0 !important; }

	/* text */

	section > .texte {
		width: 100%;

		margin: 0 0 1rem 0;
		padding: 0;
		border: none;

		column-count: 1;
		-moz-column-count: 1;
		-webkit-column-count: 1;
	}

	/* section calendrier */

	.section-calendrier { display: none; }

	/* section events */

	section > .events {
		display: block;
	}

	.events > .event {
		color: black;
		display: block;
		width: 100%;
		padding: 1rem 0;
		border-left: none;
		border-bottom: 2px solid;
		border-color: DodgerBlue;
	}
	.events > .event:first-child { padding-top: 0; }
	.events > .event:hover { color: black; }
	.events > .event[data-order="6"] { display: none; }

	.events > .event h3 strong {
		text-shadow: none !important;
		color: DodgerBlue;
	}

	/* section galerie */

	section > .galerie {
		margin: 1rem 0 -1rem 0 !important;
		justify-content: flex-start !important;
	}
	section > .galerie-4,
	section > .galerie-5,
	section > .galerie-6,
	section > .galerie-7,
	section > .galerie-8 {
		margin: 1rem -0.5rem -0.5rem 0 !important;
	}

	section > .galerie-2 figure,
	section > .galerie-3 figure {
		width: 100%;
		margin-right: 0;
	}
	section > .galerie-4 figure,
	section > .galerie-5 figure,
	section > .galerie-6 figure,
	section > .galerie-7 figure,
	section > .galerie-8 figure {
		width: calc(50% - 0.5rem);
		width: -webkit-calc(50% - 0.5rem);
		margin: 0 0.5rem 0.5rem 0;
	}

	/* section video */

	section > .video {
		width: 100%;
		margin: 0;
		border-color: DodgerBlue;
	}
	article > .video {
		border-color: DodgerBlue;
	}

	.video .triangle {
		height: 4rem;
		width: 4rem;
		stroke-width: 10;
		stroke: DodgerBlue;
	}

	.video:hover { border-color: DodgerBlue; }
	.video:hover .triangle { stroke: DodgerBlue; }

	/* - - - - - SECTION À ARTICLE - - - - - */

	article {
	    width: 100% !important;
		margin: 4rem 0 !important;
	    flex-wrap: wrap !important;
	}

	article > .bloc-titre {
		width: 100% !important;
		padding: 0 !important;
	}
	article > .bloc-titre .sous-titre { margin: 1rem 0 !important; }

	/* article simple */

		/* flexbox order */
		.article-simple > .bloc-titre { order: 1; }
		.article-simple > .texte { order: 3; }
		.article-simple > .figcontainer { order: 2; }

		/* 1. bloc-titre */

		.article-simple > .bloc-titre { margin: 0; }
		.article-simple > .bloc-titre .sous-titre { margin-bottom: 0 !important; }

		/* 2. texte */

		.article-simple > .texte {
			width: 100%;
			margin-top: 1rem;
			padding: 0;
			border: none;
		}

		/* 3. figure */

		.article-simple > figure,
		.article-simple.sans-titre > figure {
			width: 50%;
			margin: 1rem 25% 0 25%;
		}

	/* article lien */

		/* flexbox order */
		.article-lien > .bloc-titre { order: 1; }
		.article-lien > .description { order: 3; }
		.article-lien > .lien { order: 2; }

		.article-lien .lien,
		.article-lien.sans-titre .lien {
			text-align: center;
			width: 50%;
			margin: 1rem auto 0 auto;
			transform: none; -ms-transform: none; -webkit-transform: none;
			color: DodgerBlue;
		}
		.article-lien .lien:hover {
			color: DodgerBlue;
		}

		.article-lien .description {
			width: 100%;
			margin-top: 2rem;
			padding: 0;
			border: none;
		}

	/* article galerie */

	/* 2. galerie */

	.article-galerie > .galerie-2,
	.article-galerie > .galerie-3 { width: 100%; }

	.article-galerie > .galerie-4,
	.article-galerie > .galerie-5,
	.article-galerie > .galerie-6 {
		width: calc(100% + 0.5rem);
		width: -webkit-calc(100% + 0.5rem);
		margin: 0 -0.5rem -0.5rem 0;
	}

	.article-galerie > .galerie-2 figure,
	.article-galerie > .galerie-3 figure {
		width: 100%;
		margin-right: 0;
	}
	.article-galerie > .galerie-4 figure,
	.article-galerie > .galerie-5 figure,
	.article-galerie > .galerie-6 figure {
		width: calc(50% - 0.5rem);
		width: -webkit-calc(50% - 0.5rem);
		margin: 0 0.5rem 0.5rem 0;
	}

	/* article video */

	.article-video > .video {
		width: 100%;
		margin: 0;
	}

	/* article audio */

		/* flexbox order */
		.article-audio > .bloc-titre { order: 1 !important; }
		.article-audio > .controls { order: 2 !important; }
		.article-audio > .audio { order: 3 !important; }
		.article-audio > .description { order: 4 !important; }

		.article-audio .controls,
		.article-audio.sans-titre .controls {
			width: 75%;
			margin: 1rem auto 0 auto;
			transform: none; -ms-transform: none; -webkit-transform: none;
		}

		.article-audio .controls div,
		.article-audio .controls div:hover { color: DodgerBlue; }

		.article-audio .audio {
			width: 100%;
			margin: 2rem 0 0 0;
		}
		.article-audio .description {
			width: 100%;
			margin-top: 2rem;
			padding: 0;
			border: none;
		}

	/* article liste & article prix */

	.article-liste, .article-prix {
		width: 100%;
		margin: 1rem 0;
		flex-wrap: wrap;
	}

		.article-liste ul,
		.article-prix ul  {
			width: 100%;
			padding: 0;
			border: none;
			border-top: 2px solid;
		}

		.bloc-item,
		.bloc-prix {
			flex-wrap: wrap;
			padding: 1rem 0.25rem;
			margin: 0;
			border-bottom: 2px solid;
		}

		.article-liste ul .bloc-item .item-titre {
			display: flex;
			width: 100%;
			padding: 0;
			border: none;
		}

		.bloc-item .item-titre h4,
		.bloc-prix h4 {
			width: 50%;
			border-right: 2px solid;
			padding: 0.25rem 1rem 0.25rem 0;
		}
		.bloc-item .item-titre .sous-titre,
		.bloc-prix .description {
			width: 50%;
			padding: 0.25rem 0 0.25rem 1rem;
			border: none;
		}
		.bloc-item .description,
		.bloc-prix .prix {
			width: 100%;
			margin-top: 1rem;
			padding: 0 0.25rem;
			text-align: center;
		}

	/* bloc image */

	.bloc-image {
		margin-bottom: 0;
		padding-bottom: 1rem;
		border-bottom: 2px solid;
	}

	.bloc-image:last-child {
		padding-bottom: 0;
		border-bottom: none;
	}

	.bloc-image figure {
		width: 50%;
		margin: 0 auto;
	}

	/* - - - - - FOOTER - - - - - */

	footer nav a:hover { color: initial; }

	/* accès/contact */

	footer {
		flex-wrap: wrap;
	}

	footer .acces {
		width: 100%;
		padding-right: 0;
		margin-bottom: 1rem;
	}

	footer .acces .carte { 
		max-width: 320px; 
		margin: 0 auto;
	}
	
	/* plan du site */

	footer nav { width: 100%; }

	footer nav ul > li { width: 50%; }


	/* - - - - - EDIT LINK - - - - - */

	.user, .edit {
		display: none;
	}

}