#err404 {
	text-align:center;
}

#err404 p {
	text-align:center;
}

#err404 .big {
	font-size:15em;
	font-weight:bold;
}

#err404 .title {
	font-size:3em;
	font-weight:bold;
}

#err404 .link a {
	background:#4f4f4f;
	color:white;
	display:block;
	padding:5px 10px;
	width:300px;
	margin:auto;
}

#err404 .link a:hover {
	text-decoration:none;
	background:#717171;
}

#qcq {
	width: 100%;
	max-width: 1280px;
	min-width: 800px;
	position: absolute;
	left: 50%;
	top: 50%;
	height: 350px;
	margin-top: -175px;
	overflow: hidden;
}
#qcq #left,
#qcq #right {
	float: left;
	overflow: hidden;
}
#qcq #left {
	width: 66.6%;
}
#qcq #left img {
	width: 74%;
	max-width: 625px;
	float: left;
	margin-left: 8%;
}

#qcq #right {
	width: 25.3%;
	text-align: right;
}
#qcq #right p {
	margin: 0;
	padding: 0;
}
#qcq #right p.erreur {
	color: #989DA0;
	font-family: 'Amaranth', sans-serif;
	font-size: 1.5em;
	text-align: left;
	padding-left: 51%;
}
#qcq #right img {
	width: 55%;
}
#qcq #right p.not-found {
	color: #656768;
	font-family: 'Amaranth', sans-serif;
	font-size: 1.6em;
	text-align:right;

}
#qcq a.back {
	color: white;
	text-decoration: none;
	font-family: 'Amaranth', sans-serif;
	font-size: 1.6em;
	position: absolute;
	display: block;
	left: 50%;
	margin-left: -149px;
	bottom: 0;
	width: 297px;
	height: 59px;
	background: url(img/back.png) center center no-repeat;
}
#qcq a.back:hover {
	text-decoration: none;
}
#qcq a.back p {
	margin: 0;
	padding: 0;
	text-align: center;
	line-height: 59px;
	height: 59px;
	color:white;
}

#qcq.mobile {
	width: 100%;
	height: auto;
	overflow: hidden;
	max-width: none;
	min-width: 600px;
	position: static;
	margin: auto;
	padding: 0;
}
#qcq.mobile #left,
#qcq.mobile #right {
	float: none;
	width: 70%;
	max-width: 600px;
	margin: auto;
	text-align: center;
}
#qcq.mobile #right {
	margin-bottom: 2em;
	margin-top: 2em;
}
#qcq.mobile #left img {
	margin: 0;
}
#qcq.mobile #right p.erreur {
	text-align: center;
	padding: 0;
}
#qcq.mobile #left img {
	width: 100%;
}
#qcq.mobile #right img {
	margin: 5%;
}
#qcq.mobile a.back {

	position: static;
	display: block;

	margin: auto;

}

@media screen and (max-width: 1024px){
	body.home .home > div:first-child{
		display: flex;
		flex-wrap: wrap;
		flex-direction: column-reverse;
	}

	.diapoChambres > img {
		width: 100%;
		height: auto;
	}
}

@media screen and (max-width: 900px) {
	.home div.l-row-fluid.l-gutter.c__section:first-of-type {
		margin-top: 40px;
	}
}

.map{
	position: relative;
	background:url("./img/map.png") top left no-repeat;
	background-color: #E7F0F9;
	padding-bottom: 60px;
}

.map_container.c__section {
	margin-top: -25px;
}


.map:before{
	content: none;
	display: block;
	height: calc(100% - 100px);
	width: 35px;

	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#e7f0f9+0,7db9e8+100&1+0,0+100 */
	background: -moz-linear-gradient(left, rgba(231,240,249,1) 0%, rgba(125,185,232,0) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(left, rgba(231,240,249,1) 0%,rgba(125,185,232,0) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to right, rgba(231,240,249,1) 0%,rgba(125,185,232,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e7f0f9', endColorstr='#007db9e8',GradientType=1 ); /* IE6-9 */

	position: absolute;
	top: 0;
	left: 0;
}

.news_container.c__section,
.rooms-container .c__section {
	margin-bottom: 0;
}

.rooms {
	display: flex;
	height: 500px;
}

.rooms__room-card {
	position: relative;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	justify-content: end;
}

.rooms__room-card::after {
	content: '';

	position: absolute;
	top: 0;
	left: 0;

	display: block;
	width: 100%;
	height: 150%;

	background: linear-gradient(to bottom, transparent 50%, #000000C0);
	transition: all 500ms;
}

.rooms__room-card:hover::after {
	transform: translateY(-33%);
}

.room-card__content {
	color: white;
	display: flex;
	flex-direction: column;
	justify-content: end;
	align-items: center;
	gap: 6px;
	padding: 33px;
}

.room-card__attributes {
	display: flex;
	flex-direction: column;
	align-items: center;
	font-size: 20px;
}

.room-card__attribute {
	text-align: center;
}

.rooms__room-card hr {
	width: 25px;
	height: 3px;
	background-color: #89B4DF;
	margin: 0;
}

.room-card__title {
	font-weight: 300;
	color: white !important;
	font-size: 30px;
	line-height: 30px;
	min-height: unset !important;
	margin: 0;
}

.rooms__room-card > * {
	z-index: 2;
	position: relative;
}

.room-card__bg {
	align-self: self-start;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 0;
	height: 100%;
	width: 100%;
	object-fit: cover;
}

.rooms-container .embla {
	position: relative;
	overflow: hidden;
	margin-inline: -50px;
}

@media screen and (max-width: 600px) {
	.rooms-container .embla {
		margin-inline: -10px;
	}

	.room-card__title {
		font-size: 2.5em;
	}
}

.rooms-container .embla__container {
	width: 100%;
	display: flex;
}

.rooms-container .embla__slide {
	flex: 0 0 20%;
	min-width: 0;
}

.rooms-container .embla__prev,
.rooms-container .embla__next {
	display: none;

	position: absolute;
	top: 50%;
	left: 20px;
	transform: translateY(-50%);

	width: 48px;
	height: 48px;
	background: none;
	border: none;
	outline: none;

	background-image: url('../../../web/templates/frontend/images/arrow-left.svg');
	background-size: contain;
	cursor: pointer;
}

.rooms-container .embla__next {
	left: unset;
	right: 20px;
	background-image: url('../../../web/templates/frontend/images/arrow-right.svg');
}

@media screen and (max-width: 1900px) {
	.rooms-container .embla__slide {
		flex: 0 0 25%;
	}

	.rooms-container .embla__prev,
	.rooms-container .embla__next {
		display: block;
	}
}

@media screen and (max-width: 1500px) {
	.rooms-container .embla__slide {
		flex: 0 0 33%;
	}
}

@media screen and (max-width: 1024px) {
	.rooms-container .embla__slide {
		flex: 0 0 50%;
	}
}

@media screen and (max-width: 768px) {
	.rooms-container .embla__slide {
		flex: 0 0 100%;
	}
}

.map_container > div{
	position: relative;
}
.map_container > div:before,
.map_container > div:after{
	content: '';
	display: block;
	height: calc(100% - 100px);
	width: 1330px;

	background-color: #E7F0F9;

	position: absolute;
	top: 25px;
}
.map_container > div:before{
	left: 0;
	transform: translateX(-100%);
}
.map_container > div:after{
	right: 0;
	transform: translateX(100%);
}

.map-content{min-height:400px;width:40%;}

@media screen and (max-width: 900px) {
	[class*="l-rat"] {
		float: unset !important;
	}
}

.video_container{
	display: flex;
	flex-wrap: wrap;
	padding-bottom: 80px;
}
.video_container > div:last-child{
	margin-right: 0 !important;
	margin-left: 5%;
}
.video_container iframe{
	width: 100%;
	height: 100%;
	margin-top: 20px;
	min-height: 300px;
}

.news_container{
	position: relative;
	background-color: #E7F0F9;
	padding: 40px 0;
}
.news_container:before{
	content: '';
	display: block;
	height: 100%;
	width: 100vw;

	background-color: #E7F0F9;

	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	z-index: 0;
}
.news_container > div{
	overflow: hidden;
	position: relative;
	z-index: 1;
}
.news_container > div:first-child{
	overflow: visible;
}
.news_container #titreBlockActus{
	color: #000;
}
.news_container .actualite{
	padding: 30px 0 20px 0;
}
.news_container .actualite:last-child{
	margin-right: 0 !important;
	margin-left: 5%;
}
.news_container .actualite .photo{
	height: 300px;
	width: 100%;
}
.news_container .actualite .photo .photo-content{
	position: static;
	top: auto;
	left: auto;
	right: auto;
	bottom: auto;
}

@media screen and (max-width:1300px){
	.map{background-size:100% auto;}
	.map-content{width:37.5%;}
}

@media screen and (max-width:1024px){
	.map_container hr#bas{
		display: none;
	}
	.map_container > div:before, .map_container > div:after{
		height: calc(100% - 25px);
	}
	.news_container{
		padding: 10px 0;
	}
	h3#voirPlusActus{
		margin: 10px 0 20px 0 !important;
	}
}

@media screen and (max-width:900px){
	.map{background-size:170% auto;}
	.map-content{width:auto;margin-top:60%;min-height:auto;}
	.map:before{content: none;}
	.map_container > div:before, .map_container > div:after{
		height: 100%;
		top: 0;
	}
}

@media screen and (max-width: 800px){
	.map-content {
		width: auto;
		/*margin-top: 70%;*/
		min-height: auto;
	}
	.news_container .actualite .photo{
		height: 250px;
	}
}

@media screen and (max-width: 600px){
	.news_container{
		padding: 10px 0;
	}
	.news_container .actualite .photo{
		height: auto;
		padding-bottom: 0;
	}
	.news_container .actualite .photo .photo-legend{
		padding: 20px;
	}
	.news_container .actualite .photo .photo-legend .date{
		position: absolute;
		border-radius: 50%;
		width: 50px;
		height: 50px;
	}
	.news_container .actualite .photo .photo-legend .date{
		padding: 8px 10px;
	}
	.news_container .actualite .photo .photo-legend .date span{
		line-height: 12px;
		margin: 0;
	}
	.news_container .actualite .photo .photo-legend .date .day,
	.news_container .actualite .photo .photo-legend .date .month{
		font-size: 12px;
	}
	.news_container .actualite .photo .photo-legend .date .year{
		font-size: 10px;
	}

	h1, .one, h2, .two, .three {
		font-size: 24px !important;
	}
}

@media screen and (max-width: 375px){
	.map-content {
		margin-top: 61%;
	}
}
