
/* Spotlights */

	.spotlights {
		border-top: 0 !important;
	}

		.spotlights + * {
			border-top: 0 !important;
		}

		.spotlights > section {
			display: -moz-flex;
			display: -webkit-flex;
			display: -ms-flex;
			display: flex;
			-moz-flex-direction: row;
			-webkit-flex-direction: row;
			-ms-flex-direction: row;
			flex-direction: row;
			background-color: #282520;
		}

			.spotlights > section > .image {
				background-position: center center;
				background-size: cover;
				border-radius: 0;
				display: contents;
				position: relative;
				width: 30%;
			}

				.spotlights > section > .image img {
					border-radius: 0;
					display: block;
					height:max-content;
					width:max-content;
					margin:auto;/* 2em auto 2em; */
				}
/**** PARTIE AJOUTÉ POUR SPÉCIFIQUE AUX CARTES ANCIENNES ****/
.spotlights > section > .imagecartes {
				background-position: center center;
				background-size: cover;
				border-radius: 0;
				display: contents;
				position: relative;
				width: 30%;
			}
				.spotlights > section > .imagecartes img {
					border-radius: 0;
					display: block;
					height:max-content;
					width:max-content;
					margin:2em auto 2em; 
				}

				.spotlights > section > .image:before {
					background: rgba(36, 41, 67, 0.9);
					content: '';
					display: block;
					/*height: 100%;*/ /*retiré car empêchait de cliquer sur le lien de la note1 de la page pasquier*/
					left: 0;
					opacity: 0;
					position: absolute;
					top: 0;
					width: 100%;
				}

			.spotlights > section > .content {
				display: -moz-flex;
				display: -webkit-flex;
				display: -ms-flex;
				display: flex;
				-moz-flex-direction: column;
				-webkit-flex-direction: column;
				-ms-flex-direction: column;
				flex-direction: column;
				-moz-justify-content: center;
				-webkit-justify-content: center;
				-ms-justify-content: center;
				justify-content: center;
				-moz-align-items: center;
				-webkit-align-items: center;
				-ms-align-items: center;
				align-items: center;
				padding: 2em 3em 0.1em 3em ;
				width: 70%;
			}

				.spotlights > section > .content > .inner {
					margin: 0 auto;
					max-width: 100%;
					width: 65em;
				}
				/*code ajouté pour centrer les commentaires sur toute la largeur de la page */
				.spotlights > section > .content > .inner > .legende{
					width:150%;
					margin-left:-60%;
					margin-bottom: 4em;
					/*margin: 0 auto;
					max-width: 100%;
					width: 65em;*/
				}

			.spotlights > section:nth-child(2n) {
				-moz-flex-direction: row-reverse;
				-webkit-flex-direction: row-reverse;
				-ms-flex-direction: row-reverse;
				flex-direction: row-reverse;
				background-color: #261f1c;
			}

				.spotlights > section:nth-child(2n) > .content {
					-moz-align-items: -moz-flex-end;
					-webkit-align-items: -webkit-flex-end;
					-ms-align-items: -ms-flex-end;
					align-items: flex-end;
				}
					/*code ajouté pour centrer les commentaires sur toute la largeur de la page */
					.spotlights > section:nth-child(2n) > .content > .inner > .legende{
						width:150%;
						margin-left:-2%;
						margin-bottom: 4em;
						/*margin: 0 auto;
						max-width: 100%;
						width: 65em;*/
					}

		@media screen and (max-width: 1920px) {

			.spotlights > section > .image {
				width: 35%;
			}

			.spotlights > section > .content {
				width: 65%;
			}
		/*code ajouté pour centrer les commentaires sur toute la largeur de la page */
				.spotlights > section > .content > .inner > .legende{
					width:150%;
					margin-left:-57%;
				}
				.spotlights > section:nth-child(2n) > .content > .inner > .legende{
					width:150%;
					margin-left:5%;
				}

		}


		@media screen and (max-width: 1680px) {

			.spotlights > section > .image {
				width: 35%;
			}

			.spotlights > section > .content {
				width: 65%;
			}

		}

		@media screen and (max-width: 1280px) {

			.spotlights > section > .image {
				width: 45%;
			}

			.spotlights > section > .content {
				width: 55%;
			}
		/*code ajouté pour centrer les commentaires sur toute la largeur de la page */
				.spotlights > section > .content > .inner > .legende{
					width:210%;
					margin-left:-103%;
				}
				.spotlights > section:nth-child(2n) > .content > .inner > .legende{
					width:210%;
					margin-left:-8%;
				}

		}

		@media screen and (max-width: 980px) {

			.spotlights > section {
				display: block;
			}

				.spotlights > section > .image {
					width: 100%;
					max-height:30vh;
					display:contents;
					vertical-align: middle;
				}
					.spotlights > section > .image img {
						border-radius: 0;
						display: block;
						height:max-content;
						width:max-content;
						vertical-align:middle;
				}


				.spotlights > section > .content {
					padding: 4em 3em 2em 3em ;
					width: 100%;
				}
				/*code ajouté pour centrer les commentaires sur toute la largeur de la page */
				.spotlights > section > .content > .inner > .legende{
					width:100%;
					margin-left:0%;
				}
				.spotlights > section:nth-child(2n) > .content > .inner > .legende{
					width:100%;
					margin-left:0%;
				}

		}

		@media screen and (max-width: 736px) {

			.spotlights > section > .content {
				padding: 3em 1.5em 1em 1.5em ;
			}
		/*code ajouté pour centrer les commentaires sur toute la largeur de la page */
				.spotlights > section > .content > .inner > .legende{
					width:100%;
					margin-left:0%;
				}
				.spotlights > section:nth-child(2n) > .content > .inner > .legende{
					width:100%;
					margin-left:0%;
				}

		}


#ouvragesexp{
	padding:0 5em 0 5em;
}
@media (max-width: 1280px) {
	#ouvragesexp{
		padding:0 4.5em 0 4.5em;
	}
}
@media (max-width: 1024px) {
	#ouvragesexp{
		padding:0 3.5em 0 3.5em;
	}
}
@media (max-width: 980px) {
	#ouvragesexp{
		padding:0 3em 0 3em;
	}
}
@media (max-width: 767px) {
	#ouvragesexp{
		padding:0 3em 0 3em;
	}
}
@media (max-width: 650px) {
	#ouvragesexp{
		padding:0 2.5em 0 2.5em;
	}
}