#pageMaquettes {
	padding: 0 !important;
}
.MaquettesWrapper {
	display: grid;
	margin: 10px 0;
	text-align: center;
	grid-gap: 1px;
}
.MaquettesWrapper img {
	width: 100%;
}
.test, .cardMaquettes, .test > img {
	width: 100%;
	height: 200px !important;
	border: none !important;
}
.card-body-maquettes {
	background-color: rgb(48,48,48, 0.7) !important;
}
.white {
	color: white !important;
}
.cardMaquettes:hover {
	opacity: 0.9;
	box-shadow: 10px 10px 10px grey !important;
}
/*---------------------MODAL----------------------*/
.modal {
	background-color: black;
}
.modal-dialog {
	max-width: max-content !important;
	max-height: 1000px !important;
	margin: 0 auto !important;
}
.modal-content, .modal-header  {
	background-color: #303030 !important;
	border: none !important;
}
.modal-title {
	color: white;
}
.close {
	font-size: 2rem;
	font-weight: 500; 
	color: #fff;
	text-shadow: 0 3px 0 black;
	opacity: 0.9;
	background-color: #B2A277 !important;
	margin: 0px 0px 0px auto !important;
	padding: 2px 10px 8px !important;
}
.close:hover {
	color: #303030 !important;
	text-shadow: 0 3px 0 grey;
}
/*-------------------CAROUSEL MODAL--------------------*/
.carousel-indicators {
	position: relative !important;
	overflow-x: hidden;
	margin: 0;
}
.carousel-indicators li {
	background-color: transparent !important;
	text-indent: 0 !important;
	width: auto !important;
	height: auto !important;
	margin-right: 1px !important;
	margin-left: 1px !important;
	border-top: 1px solid transparent !important;
	border-bottom: none !important;
}
.carousel-indicators li img {
	max-height: 45px !important;
	width: 17VW;
	object-fit: cover;
}
/*---------------------------------------------------MEDIA QUERIES--------------------------------------*/
@media (min-width: 767px) {
	.MaquettesWrapper {
		grid-template-columns:  300px 0 300px 0;
		grid-gap: 1rem 3vh;
	}
/*--------------------resize slides in modal carousel to cover--------------------- 
--------1-for maquettes carousel-----------*/
.imgDiapoCoverMaq {
	height: 650px;
	object-fit: cover !important;
	object-position: 100% 70%;
}
/*------2-for all others (visite, bateaux, salle2)----------*/
.imgDiapoCover {
	height: 650px;
	object-fit: cover !important;
	object-position: 100% 60%;
}
/*------3-for 2 specific images in visite and bateaux----------*/
.imgDiapoCover2 {
	height: 650px;
	object-fit: cover !important;
	object-position: top;
}
#carousel-thumb2 > #carousel-maquettes > .carousel-item > .christine { /*specific for the first La christine image */
    object-position: 100% top !important;
}
/*---------------------------------*/
.test, .cardMaquettes, .test > .size > img {
	object-fit: cover;
	object-position: bottom;
	height: 200px;
}
.carousel-fade .carousel-item {
	max-height: 650px !important;
}
.carousel-indicators li img {
	max-height: 70px !important;
}
/*------------------------MEDIA 990----------------------------*/
@media (min-width: 990px) {
	.MaquettesWrapper {
		grid-template-columns:  308px 0 308px 0 308px 0;
		grid-gap: 0.1rem 0.8vh;
	}
	.test, .cardMaquettes {
		width: 318px;
		height: 200px;
	}
	#carousel-thumb2 > #carousel-maquettes > .carousel-item > .christine { /*specific for the first La christine image */
    object-position: 100% 40% !important;
	}
}
/*------------------------MEDIA 1200---------------------------*/
@media (min-width: 1200px) {
	.MaquettesWrapper {
		grid-template-columns:  370px 0 370px 0 370px 0;
		grid-gap: 0.1rem 0.8vh;
	}
	.test, .cardMaquettes, .test > .size > img {
		width: 370px;
		height: 230px !important;

	}
	#carousel-thumb2 > #carousel-maquettes > .carousel-item > .christine { /*specific for the first La christine image */
    object-position: 100% 53% !important;
	}
}