section.resume {
	background      : url("../../img/gite/bg_head.webp") no-repeat center top;
	background-size : cover;
}

section.introduction:before {
	background : url("../../img/gite/presentation_left.webp") no-repeat bottom left;
}

section.introduction:after {
	background : url("../../img/gite/presentation_right.webp") no-repeat bottom right;
}


section.description:before {
	background : url("../../img/gite/description_left.webp") no-repeat center center;
}

section.description:after {
	background : url("../../img/gite/description_right.webp") no-repeat top center;
}


section.resume .content {
	background      : rgba(0, 0, 0, 0.35);
	backdrop-filter : blur(1px);
}

section.resume .content:before {
	top  : 0;
	left : 0;
}

section.resume .content .catchphrase {
	line-height : 1.15;
	padding     : 35px 35px 30px 35px;
}

section.resume .content:after {
	bottom : 0;
	right  : 0;
}


section.description .content.top {
	padding-bottom : 50px;
}

section.booking {
	padding : 75px 0;
}

section.booking > .container {
	background-color : #FFFFFF;
	border-radius    : 10px;
	box-shadow       : 0 0 40px 0 rgba(0, 0, 0, 0.15);
}

section.booking:before {
	width           : 400px;
	max-width       : 100%;
	height          : 630px;
	position        : absolute;
	top             : 0;
	left            : 0;
	content         : "";
	background      : url(../../img/histoire/icon_grappe.webp) no-repeat top left;
	background-size : cover;
	z-index         : -1;
}

section.booking:after {
	width           : 400px;
	height          : 630px;
	position        : absolute;
	max-width       : 100%;
	bottom          : 0;
	right           : 0;
	content         : "";
	background      : url(../../img/histoire/icon_grappe.webp) no-repeat bottom left;
	background-size : cover;
	z-index         : -1;
}


div.responsive-image {
	position        : relative;
	height          : 350px;
	width           : 100%;
	align-items     : center;
	justify-content : center;
	display         : none;
}

div.responsive-image img {
	position   : relative;
	object-fit : cover;
	width      : 100%;
	height     : 100%;
}


@media screen and (max-width : 991px) {
	div.responsive-image {
		display : flex;
	}

	section.introduction a.btn {
		white-space : initial;
	}

	section.introduction .content.top {
		padding : 25px 0;
	}

	section.introduction .content.bottom {
		padding : 0;
	}

	section.introduction:before {
		display  : block;
		position : relative;
		height   : 350px;
	}

	section.introduction:after {
		display         : block;
		position        : relative;
		height          : 450px;
		width           : 100%;
		left            : 0;
		background-size : cover;
	}

	section.description:before,
	section.description:after,
	section.description .container-description:before,
	section.description .container-description:after {
		display : none;
	}

	section.description .content.top {
		padding-top : 50px;
	}

	section.description .container-bottom {
		padding : 0;
	}
}
