html,
body {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
	font-family: 'Montserrat', sans-serif;
	font-display: swap;
	font-style: normal;
	font-size: 100%;
	background-color: #2c3e50;
	background-size: 100% auto;
	width: 100%
}

legend {
	text-transform: uppercase
}

h1,
h2,
h3,
h4,
h5 {
	font-family: 'IM Fell English SC', serif;
	font-display: swap;
	text-transform: uppercase;
	margin: 0;
	padding: 0
}

a,
a:hover {
	text-decoration: none;
	color: inherit
}

@media screen and (min-width:800px) {
	header {
		display: flex;
		justify-content: center;
		align-items: center;
		height: auto;
		background-repeat: repeat-x;
		background-size: auto 100%;
		background-clip: border-box;
		padding-top: 3rem;
		padding-bottom: 5rem
	}

	.mainNav {
		display: inline-flex;
		justify-content: center;
		position: relative;
		color: #edab22;
		font-size: 1.3rem;
		margin: 0;
		padding: 0;
		box-shadow: 0px 1px 3px 8px rgba(0, 0, 0, 1), 0px 1px 10px 8px rgba(0, 0, 0, .9), 0px 1px 6px 8px rgba(0, 0, 0, .9)
	}

	.mainNav:before,
	.mainNav:after {
		content: "";
		position: absolute;
		z-index: 2;
		height: 12px;
		width: 100%;
		background-image: url("../../images/layers/Separateur_half.webp");
		background-size: auto 12px;
		background-repeat: repeat-x;
		pointer-events: none;
		cursor: default
	}

	.mainNav:before {
		top: -9px
	}

	.mainNav:after {
		bottom: -10px;
		left: 0
	}

	.mainNav li {
		display: inline;
		position: relative;
		z-index: 3;
		font-family: 'IM Fell English SC', serif;
		font-display: swap;
		font-size: 1em;
		text-shadow: 0px 1px 0px #1c0c05, 0px 2px 0px #1c0c05, 0px 2px 1px #1c0c05, 0px 2px 2px #1c0c05, 0px 2px 3px #1c0c05;
		text-transform: uppercase;
		list-style: none;
		height: 3em
	}

	.mainNav li:first-child {
		padding-left: 20px
	}

	.mainNav li:last-child {
		padding-right: 20px
	}

	.mainNav li:first-child:after {
		content: "";
		overflow: visible;
		display: block;
		background-image: url("../../images/navigations/navBlock-L-stroke.webp");
		background-size: auto 100%;
		background-repeat: no-repeat;
		background-position: right;
		z-index: 3;
		position: absolute;
		width: 11em;
		left: -8.3em;
		height: 152%;
		top: -28%;
		pointer-events: none;
		cursor: default
	}

	.mainNav li:last-child:after {
		content: "";
		overflow: visible;
		display: block;
		background-image: url("../../images/navigations/navBlock-R-stroke.webp");
		background-size: auto 100%;
		background-repeat: no-repeat;
		background-position: left;
		z-index: 3;
		position: absolute;
		width: 11em;
		height: 152%;
		top: -28%;
		right: -8.3em;
		pointer-events: none;
		cursor: default
	}

	.leftNav,
	.rightNav {
		display: inline-block;
		text-align: center;
		width: 8em;
		z-index: 4;
		background-image: url("../../images/backgrounds/bgNavLi_half.webp");
		background-size: 100% 100%;
		position: relative;
		transition: .5s
	}

	.leftNav:hover,
	.rightNav:hover,
	.leftNav:active,
	.rightNav:active {
		background-image: url("../../images/backgrounds/bgNavLi_hvr-anim_half.webp");
		color: #fbf29f;
		text-shadow: 0px 0px 1px red, 0px 0px 12px red, 0px 0px 24px red, 0px -1px 0px #12333c, 0px -2px 0px #12333c, 0px -2px 1px #12333c, 0px -2px 2px #12333c, 0px -2px 3px #12333c, 0px -3px 3px #12333c;
		transition: .5s;
		cursor: pointer
	}

	.midNav {
		width: 9em;
		z-index: 4;
		display: inline-block;
		text-align: center;
		color: rgba(0, 0, 0, 0);
		background-image: url("../../images/backgrounds/bgNavLi_half.webp");
		background-size: 100% 100%;
		position: relative;
		transition: .4s
	}

	.midNav:hover {
		cursor: pointer;
		transition: .4s
	}

	.mainNav li>a,
	.mainNav li>a:hover {
		display: flex;
		justify-content: center;
		align-items: center;
		position: relative;
		height: 100%;
		width: 100%;
		text-decoration: none;
		color: inherit;
		box-sizing: border-box
	}

	.midNav:after {
		content: "";
		overflow: visible;
		display: block;
		position: absolute;
		height: 4em;
		width: 4em;
		border-radius: 100%;
		background-image: url("../../images/logos/loop_100x100.gif");
		background-size: auto 110%;
		background-repeat: no-repeat;
		background-position: center;
		top: -.65em;
		left: 2.5em;
		box-shadow: 0px 8px 6px 6px rgba(0, 0, 0, 1), 0px 7px 24px 6px rgba(0, 0, 0, 1), 0px 7px 16px 5px rgba(0, 0, 0, 1);
		transition: .2s;
		pointer-events: none
	}

	.midNav:hover:after {
		background-image: url("../../images/logos/loop2_100x100.gif");
		transition: .4s
	}

	.midNav:before {
		content: "";
		overflow: visible;
		display: block;
		position: absolute;
		z-index: 6;
		height: 195%;
		width: 10em;
		background-image: url("../../images/navigations/navBlock-mid-stroke.webp");
		background-size: auto 100%;
		background-repeat: no-repeat;
		background-position: center;
		top: -48%;
		left: -.5em;
		pointer-events: none
	}

	.iconMenu {
		display: none
	}
}

@media screen and (max-width:799px) {
	.mainNav {
		position: fixed;
		z-index: 10;
		color: #edab22;
		font-size: 1rem;
		margin: 0;
		padding-left: 0;
		padding-top: 30%;
		padding-bottom: 40%;
		transition: .5s;
		left: -100%;
		width: 100vw;
		height: 100vh;
		max-height: 100%;
		max-width: 100%;
		background-color: rgba(0, 0, 0, .8)
	}

	.mainNav.active {
		left: 0
	}

	.mainNav li {
		display: block;
		position: relative;
		font-size: 1.1em;
		width: 50%;
		z-index: 3;
		font-family: 'IM Fell English SC', serif;
		font-display: swap;
		text-shadow: 0px 1px 0px #1c0c05, 0px 2px 0px #1c0c05, 0px 2px 1px #1c0c05, 0px 2px 2px #1c0c05, 0px 2px 3px #1c0c05;
		text-transform: uppercase;
		list-style: none;
		padding-top: 1.1em;
		padding-bottom: .9em;
		margin-top: 1em;
		box-shadow: 0px 3px 5px 2px rgba(0, 0, 0, .9)
	}

	.mainNav li>a,
	.mainNav li>a:hover {
		text-decoration: none;
		color: inherit
	}

	.mainNav li:after {
		content: "";
		overflow: visible;
		display: block;
		background-image: url("../../images/navigations/navBlock-R-stroke.webp");
		background-size: auto 100%;
		background-repeat: no-repeat;
		background-position: left;
		z-index: 3;
		position: absolute;
		width: 11em;
		height: 120%;
		top: -.45em;
		right: -8.3em
	}

	.leftNav,
	.rightNav,
	.midNav {
		display: block;
		text-align: left;
		padding-left: 1.5em;
		z-index: 4;
		background-image: url("../../images/navigations/menuBar_mobile_half.webp");
		background-size: auto 100%;
		position: relative;
		transition: .5s
	}

	.leftNav:hover,
	.rightNav:hover,
	.leftNav:active,
	.rightNav:active,
	.midNav:hover,
	.midNav:active {
		background-image: url("../../images/navigations/menuBar_mobile_hov_half.webp");
		background-repeat: repeat-x;
		color: #fbf29f;
		text-shadow: 0px 0px 1px red, 0px 0px 12px red, 0px 0px 24px red, 0px -1px 0px #12333c, 0px -2px 0px #12333c, 0px -2px 1px #12333c, 0px -2px 2px #12333c, 0px -2px 3px #12333c, 0px -3px 3px #12333c;
		transition: .5s;
		cursor: pointer
	}

	.iconMenu {
		display: block;
		position: fixed;
		top: 0;
		right: 0;
		width: 7rem;
		height: 7rem;
		background-image: url("../../images/layers/extensRight_half.webp");
		background-size: 100% auto;
		background-repeat: no-repeat;
		z-index: 11;
		cursor: pointer
	}

	.iconMenu>.icon {
		position: fixed;
		top: 1.6rem;
		right: 2rem;
		width: 2rem;
		height: auto;
		fill: #edab22;
		filter: drop-shadow(0px 2px 1px #000)
	}
}

@media screen and (max-width:1200px) {
	.mainNav li {
		font-size: 1.1rem
	}
}

.homeCalendars {
	display: flex;
	height: 20vh
}

.row {
	margin-top: 0;
	margin-right: 0
}

.no-gutter>[class*=col-] {
	padding-right: 0;
	padding-left: 0
}

.header-img-desktop {
	position: fixed;
	top: 0;
	z-index: -1000;
	background: url("../../images/layers/frameVideo.webp");
	background-position: center;
	background-size: 100%;
	width: 100%;
	height: 100vh
}

.banner-calendars {
	text-transform: uppercase;
	font-weight: bolder !important;
	color: #fff !important;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	height: 10rem;
	font-family: 'IM Fell English', serif;
	font-display: swap;
	padding: 0 30%
}

.bannerCalHeight {
	height: 0
}

.container {
	padding: 3rem 1rem
}

.container_tableau_form {
	width: 100%;
	display: flex;
	align-items: stretch;
	gap: 2.2rem;
	flex-direction: row
}

.entete-calendars {
	position: relative;
	background-color: #c1272d;
	width: 100%;
	color: #f5f5f5;
	margin: 0 auto;
	text-align: center;
	padding: 20px 0;
	border-radius: 1rem 1rem 0 0
}

.manoir-calendar-bg {
	background-color: #4f1d4b
}

.entete-calendars h2 {
	font-family: 'Montserrat', sans-serif;
	font-display: swap;
	font-weight: 800
}

.entete-calendars h4 {
	font-family: 'Montserrat', sans-serif;
	font-display: swap
}

.flexCalendarNav {
	display: flex;
	flex-direction: row;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 100%
}

.calPrevious,
.calNext,
.calPreviousBlocked {
	height: 100%;
	margin: 0;
	display: flex;
	align-items: center
}

.calPrevious>.icon,
.calNext>.icon,
.calPreviousBlocked>.icon {
	height: 3rem;
	width: auto;
	fill: #f5f5f5;
	transition-duration: .2s;
	transition-timing-function: ease-in-out
}

.calPrevious>.icon,
.calPreviousBlocked>.icon {
	margin-right: 2rem
}

.calNext>.icon {
	margin-left: 2rem
}

.calPreviousBlocked>.icon {
	fill: rgba(255, 255, 255, .3)
}

.calPreviousBlocked {
	pointer-events: none;
	cursor: default
}

.calPrevious>.icon:hover,
.calNext>.icon:hover {
	transform: scale(120%);
	fill: #f7931e
}

table {
	border-collapse: separate;
	font-size: 80%;
	margin: 0;
	border: 0;
	width: 100%;
	border-spacing: 1rem
}

td,
th {
	color: #fff;
	border: 0;
	text-align: center;
	width: 16.66%;
	font-size: 12px;
	padding: 6px !important
}

td {
	border-radius: 5px;
	background-image: url("/images/backgrounds/backgroundGreen.webp");
	border: outset 2px;
	box-sizing: border-box
}

th {
	background-color: #c1272d
}

tr {
	margin-left: -1rem
}

.indisponible {
	background-image: url("/images/backgrounds/backgroundBrown.webp") !important;
	color: #f5f5f5;
	border: none
}

.today {
	background-image: url("/images/backgrounds/backgroundMediumGreen.webp");
	color: #f5f5f5;
	border: none
}

.pre-reserved {
	background-image: url("/images/backgrounds/backgroundOrange.webp");
	animation: pulse-lock .3s ease-in-out;
	animation-iteration-count: 1
}

.cliquable:hover:not(.pre-reserved) {
	cursor: pointer;
	animation: pulse 1s linear infinite;
	border: inset 2px
}

.fermer {
	background-image: none;
	border-radius: 5px;
	color: #f5f5f5;
	padding: 6px 0;
	border: none
}

.update_calendars {
	width: 100%
}

.payout {
	background-color: #c1272d;
	margin: 1rem 0;
	font-weight: 700;
	text-transform: uppercase;
	padding: .7rem;
	width: 100%
}

.form-control {
	margin-bottom: 10px;
	height: 40px
}

.btn-default {
	margin-bottom: 10px;
	font-weight: bolder;
	border-radius: 0
}

.pre-reserved {
	background-color: #f7931e !important;
	animation: pulse-lock .3s ease-in-out;
	animation-iteration-count: 1
}

.level,
.number {
	padding: 10px
}

.blockCalendar {
	flex: 8;
	background-color: rgba(0, 0, 0, .3);
	border-radius: 1rem;
	position: relative
}

.block_reservation {
	flex: 3;
	padding: 2rem
}

.block_reservation input,
.btn-default {
	font-family: 'Montserrat', sans serif;
	font-display: swap;
	font-size: .9rem
}

.popover {
	max-width: 1200px;
	width: auto
}

input[type=checkbox] {
	border-radius: 4px;
	height: 15px;
	width: 15px;
	background-color: #b6c5d2;
	position: relative;
	top: 3px
}

.javascriptDisabled {
	background-color: #7c3338;
	color: #fff;
	width: 57%;
	padding: 15px;
	margin: 0 auto
}

.validation {
	width: 50%;
	margin: 0 auto
}

.panel {
	background-image: url("../../images/backgrounds/bgParchementCarre.webp");
	background-repeat: no-repeat;
	background-size: 100% 100%
}

.panel-default>.panel-heading {
	background-color: #1e90ff;
	color: #f5f5f5;
	font-weight: 700;
	font-size: 20px
}

.panel-body p {
	font-family: 'Darker Grotesque', sans-serif;
	font-display: swap;
	font-size: 1.3rem;
	color: #1c0c05
}

.email_validation {
	margin-top: 1rem
}

.paiement {
	background-color: rgba(214, 58, 6, 1);
	width: 50%
}

@media screen and (max-width:1200px) {
	.banner-calendars {
		padding: 0
	}

	.container_tableau_form {
		width: 100%;
		display: flex;
		align-items: stretch;
		justify-content: space-between;
		gap: 2rem;
		flex-direction: column
	}
}

@media screen and (min-width:799px) {
	.days-calendars {
		overflow: hidden
	}

	.paddingLeftZero {
		padding-left: 0
	}

	.paddingRightZero {
		padding-right: 0
	}
}

@media screen and (max-width:799px) {
	.entete-calendars {
		width: 100%;
		margin: 0 auto
	}

	.entete-calendars h2,
	.entete-calendars h4 {
		font-size: 1rem
	}

	.flexCalendarNav {
		padding: 0 1rem
	}

	.flexCalendarNav>a {
		flex: 1
	}

	.flexCalendarNav>div {
		flex: 3
	}

	.calPrevious>.icon,
	.calPreviousBlocked>.icon,
	.calNext>.icon {
		margin: 0
	}

	.calNext {
		position: relative
	}

	.calNext>.icon {
		position: absolute;
		right: 0
	}

	.banner-calendars {
		padding: 0 1rem
	}

	.banner-calendars>h2 {
		font-size: 1.2rem
	}

	.payout,
	.paiement {
		width: 100%
	}

	.validation {
		width: 95%
	}
}

.fond {
	position: relative;
	background-image: url("/images/backgrounds/backgroundMediumBlue.webp");
	width: 100%
}

.footer-top {
	padding: 50px 0 30px;
	color: #fff
}

.footer-top ul li a {
	color: #999
}

.footer-top ul li {
	color: #999;
	list-style: none
}

.footer-top ul {
	margin-bottom: 2em
}

.footer-top p,
a {
	color: #999;
	margin-bottom: 2em
}

.footer-top p,
.espacementImage>img {
	margin-left: 2em
}

.footer-top a:hover {
	color: #fff
}

.footer-titre-colonne {
	color: #fff;
	font-size: 18px
}

.copyright {
	padding-bottom: 10px;
	color: #fff;
	text-align: center
}

.copyright a {
	color: #fff
}

.baseContainer {
	display: flex;
	justify-content: space-evenly;
	position: relative;
	width: 100%
}

.flexBlock {
	flex: 1 1 30%;
	margin: 0 1.5rem
}

.flexWrapper {
	display: flex;
	flex-wrap: wrap
}

.fullViewportMain {
	width: 100vw;
	max-width: 100%;
	height: 100vh;
	position: absolute;
	top: 0
}

.fullViewportFlexible {
	width: 100%;
	min-height: 100vh;
	align-items: center;
	position: absolute;
	top: 0;
	left: 0
}

.fullPageContainer {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 100%;
	height: 100%
}

.textContent {
	column-count: 2;
	column-gap: 4rem;
	text-align: justify;
	line-height: 1.8rem
}

.textContent p {
	margin-bottom: 2rem
}

.textIntro:first-letter {
	float: left;
	font-size: 3em;
	margin-top: .15em;
	margin-right: .1em
}

.headerCover {
	height: 20rem;
	width: 100vw;
	max-width: 100%;
	position: absolute;
	top: 0
}

.decorParent {
	position: relative
}

button {
	all: unset
}

.backgroundDark {
	background-image: url('../../images/backgrounds/backgroundDark.webp');
	color: #edab22
}

.backgroundRed {
	background-image: url('../../images/backgrounds/backgroundRed.webp')
}

.backgroundGreen {
	background-image: url('../../images/backgrounds/backgroundGreen.webp')
}

.backgroundPurple {
	background-image: url('../../images/backgrounds/backgroundPurple.webp')
}

.backgroundMediumBlue {
	background-image: url('../../images/backgrounds/backgroundMediumBlue.webp');
	font-family: 'IM Fell English', serif;
	font-display: swap;
	font-size: 1.2rem;
	color: #f5f5f5
}

.backgroundGold {
	background-image: url('../../images/backgrounds/backgroundGold.webp');
	background-size: 100% auto;
	background-repeat: repeat;
	color: #000
}

.backgroundDarkBlue {
	background-image: url('../../images/backgrounds/backgroundDarkBlue.webp');
	background-size: 100% auto;
	background-repeat: repeat;
	color: #000
}

.backgroundBlue {
	background-image: url('../../images/backgrounds/backgroundBlue.webp');
	background-size: 100% auto;
	background-repeat: repeat;
	color: #000
}

.backgroundMap {
	background-image: url('../../images/backgrounds/mapBackground.webp');
	background-size: auto auto;
	background-repeat: repeat;
	font-family: 'IM Fell English', serif;
	font-display: swap;
	color: #412727;
	font-size: 1rem
}

.backgroundMap>.icon {
	fill: #412727;
	height: 3em;
	width: auto
}

.blockParchment {
	display: flex;
	flex-direction: column;
	background-image: url('../../images/backgrounds/bgParchment.webp');
	background-size: 100% 100%;
	font-family: 'IM Fell English', serif;
	font-display: swap;
	color: #412727;
	font-size: 1.2rem
}

.blockParchment>.icon {
	fill: #412727;
	height: 3em;
	width: auto
}

.button_reserved {
	display: inline-block;
	position: relative;
	text-transform: uppercase;
	text-align: center;
	white-space: nowrap;
	color: #f5f5f5;
	text-shadow: 0px 0px 3px rgba(214, 58, 6, 1), 0px 0px 3px rgba(214, 58, 6, 1), 0px 0px 3px rgba(214, 58, 6, 1), 0px 0px 3px rgba(214, 58, 6, 1);
	padding: 1em 1px;
	margin: 0 3em;
	background-image: url('../../images/buttons/buttonBg_mid.webp');
	background-size: 100% 300%;
	background-position: top
}

.button_reserved:visited {
	color: #f5f5f5;
	outline: none
}

.button_reserved:hover {
	color: #f5f5f5;
	text-shadow: 0px 0px 5px rgba(214, 58, 6, 1), 0px 0px 5px rgba(214, 58, 6, 1), 0px 0px 5px rgba(214, 58, 6, 1), 0px 0px 5px rgba(214, 58, 6, 1);
	background-size: 100% 300%;
	background-position: center;
	text-decoration: none;
	cursor: pointer
}

.button_reserved:active {
	text-shadow: 0px 0px 5px rgba(214, 58, 6, 1), 0px 0px 5px rgba(214, 58, 6, 1), 0px 0px 5px rgba(214, 58, 6, 1), 0px 0px 5px rgba(214, 58, 6, 1);
	color: #f5f5f5;
	background-size: 100% 300%;
	background-position: bottom;
	text-decoration: none;
	cursor: pointer
}

.button_reserved:before {
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 3em;
	top: 0;
	left: -3em;
	background-image: url('../../images/buttons/buttonBg_left.webp');
	background-size: 100% 300%;
	background-position: top
}

.button_reserved:hover:before {
	background-position: center
}

.button_reserved:active:before {
	background-position: bottom
}

.button_reserved:after {
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 3em;
	top: 0;
	right: -3em;
	background-image: url('../../images/buttons/buttonBg_right.webp');
	background-size: 100% 300%;
	background-position: top
}

.button_reserved:hover:after {
	background-position: center
}

.button_reserved:active:after {
	background-position: bottom
}

.sectionTitle {
	display: block;
	position: absolute;
	z-index: 5;
	font-size: 1.8rem;
	color: #c29857;
	top: -1.9em;
	padding-top: 1.3em;
	padding-bottom: 1.2em;
	padding-right: .5em;
	padding-left: .5em;
	text-shadow: 0px 1px 1px rgba(100, 30, 30, .8), 0px 2px 2px rgba(100, 30, 30, .8), 0px 2px 2px rgba(100, 30, 30, .8);
	background-image: url('../../images/layers/titleBlock_mid.webp');
	background-size: 100% 100%
}

.sectionTitle:before {
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 3.5em;
	left: -3.5em;
	top: 0;
	background-image: url('../../images/layers/titleBlock_left.webp');
	background-size: 100% 100%
}

.sectionTitle:after {
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 3.5em;
	right: -3.5em;
	top: 0;
	background-image: url('../../images/layers/titleBlock_right.webp');
	background-size: 100% 100%
}

.titleGold {
	display: block;
	text-align: center;
	font-size: 1.5rem;
	color: #edab22;
	width: 100%;
	padding: 1em 0;
	text-shadow: 0px 1px 1px rgba(100, 30, 30, .8), 0px 2px 2px rgba(100, 30, 30, .8), 0px 2px 2px rgba(100, 30, 30, .8);
	background-image: url('../../images/layers/titleFrame_gold.svg');
	background-size: 100% 100%;
	background-repeat: no-repeat
}

.titleGrey {
	display: block;
	text-align: center;
	font-size: 1.5rem;
	color: #f5f5f5;
	padding: 1em 0;
	margin-bottom: 1rem;
	width: 100%;
	text-shadow: 0px 1px 1px rgba(0, 0, 0, .5), 0px 2px 2px rgba(0, 0, 0, .5), 0px 2px 2px rgba(0, 0, 0, .5);
	background-image: url('../../images/layers/titleFrame_grey.svg');
	background-size: 100% 100%;
	background-repeat: no-repeat
}

.titleBrown {
	display: block;
	text-align: center;
	font-size: 1.5rem;
	color: #412727;
	padding: 1em 0;
	margin-bottom: 1rem;
	width: 100%;
	background-image: url('../../images/layers/titleFrame_brown.svg');
	background-size: 100% 100%;
	background-repeat: no-repeat
}

.titleBrown {
	display: block;
	text-align: center;
	font-size: 1.5rem;
	color: #412727;
	padding: 1em 0;
	margin-bottom: 1rem;
	width: 100%;
	background-image: url('../../images/layers/titleFrame_brown.svg');
	background-size: 100% 100%;
	background-repeat: no-repeat
}

.hiddenTitle {
	display: block;
	position: absolute;
	overflow: hidden;
	width: 0;
	height: 0
}

.titleImg {
	float: left;
	padding-top: 0;
	margin-top: -15px
}

.centerText {
	text-align: center
}

.flexCenter {
	display: flex;
	text-align: center
}

.inlineBlock {
	display: inline-block
}

.inlineElement {
	display: inline
}

.basicPadding {
	padding: 3rem;
	margin-bottom: 1rem
}

.clearBoth {
	clear: both
}

.divScroll {
	overflow-x: auto
}

.framedBlock1 {
	border: solid 16px;
	border-image-source: url('../../images/layers/frameGold.webp');
	border-image-slice: 55 56 55 56;
	border-image-width: 1em;
	border-image-outset: .5em;
	border-image-repeat: repeat repeat;
	box-sizing: border-box;
	background-clip: border-box;
	padding-right: .3em;
	padding-left: .3em;
	padding-top: 0;
	padding-bottom: 0;
	margin: 1.3em;
	box-shadow: 0px 1px 3px 5px rgba(0, 0, 0, .5), 0px 1px 6px 5px rgba(0, 0, 0, .7);
	width: 30%
}

.framedBlock2 {
	border: solid 16px;
	border-image: url('../../images/layers/Cadre2.webp') 48 fill stretch;
	background-clip: border-box;
	color: #f5f5f5;
	padding: .3em
}

.framedBlock3 {
	border: solid 28px;
	border-image: url('../../images/layers/Cadre3.webp') 48 fill stretch;
	background-clip: border-box;
	color: #f5f5f5;
	padding: .3em
}

.framedBlock3Red {
	border: solid 24px;
	border-image: url('../../images/layers/Cadre3-red.webp') 48 fill stretch;
	color: #f5f5f5;
	padding: .3em
}

.framedBlock4 {
	position: relative;
	border-radius: 1rem
}

.framedBlock4:after {
	content: '';
	height: 100%;
	width: 100%;
	position: absolute;
	z-index: 3;
	top: 0;
	left: 0;
	pointer-events: none;
	border: solid;
	border-radius: 1rem;
	border-image: url('/images/layers/borderImg-form.webp');
	border-image-slice: 53;
	border-image-width: 2.1rem;
	border-image-outset: .6rem;
	border-image-repeat: repeat
}

.framedBlock5 {
	content: '';
	border: solid;
	border-radius: 1rem;
	border-image: url('/images/layers/borderParchment.webp');
	border-image-slice: 86;
	border-image-width: 6rem;
	border-image-outset: .6rem;
	border-image-repeat: repeat
}

.separatorAfter:after {
	content: '';
	position: absolute;
	left: 0;
	z-index: 2;
	bottom: -.6em;
	width: 100%;
	height: 1.2em;
	pointer-events: none;
	border-style: solid;
	border-image-source: url('../../images/layers/separatorBorder.webp');
	border-image-slice: 66 48 0 48;
	border-image-width: 100% 1em 0 1em;
	border-image-outset: 0px 0px 0px 0px;
	border-image-repeat: repeat;
	background-size: 100% auto;
	box-sizing: border-box
}

.separatorAfter2:after {
	content: '';
	position: absolute;
	left: 0;
	z-index: 2;
	bottom: -2px;
	width: 100%;
	height: 4px;
	pointer-events: none;
	background-image: url('../../images/layers/separateur-relief.png');
	background-size: 100% 100%
}

.blockShadow {
	box-shadow: 0 .5rem .5rem .1rem rgba(0, 0, 0, .5)
}

.footer:after {
	content: '';
	position: absolute;
	left: 0;
	z-index: 2;
	top: -.6em;
	width: 100%;
	height: 1.2em;
	pointer-events: none;
	border-style: solid;
	border-image-source: url('../../images/layers/separatorBorder.webp');
	border-image-slice: 66 48 0 48;
	border-image-width: 100% 1em 0 1em;
	border-image-outset: 0px 0px 0px 0px;
	border-image-repeat: repeat;
	background-size: 100% auto;
	box-sizing: border-box
}

.headerVideo {
	position: fixed;
	width: 100%;
	top: 0;
	left: 0
}

.homePage {
	height: 50vh
}

.newsBanner {
	position: relative;
	display: flex;
	align-items: center;
	min-height: 4em;
	background-image: url('../../images/backgrounds/backgroundGold.webp');
	background-size: 100% auto;
	background-repeat: repeat-y;
	font-family: 'IM Fell English', serif;
	font-display: swap;
	font-size: 120%;
	padding: 1em 5%;
	color: #000
}

.newsBanner:before,
.newsBanner:after {
	content: '';
	position: absolute;
	height: 22px;
	left: 0;
	width: 100%;
	z-index: 6;
	pointer-events: none;
	background-image: url('../../images/layers/Bande-noire.webp');
	background-size: auto 25px;
	box-sizing: inherit;
	background-repeat: repeat-x
}

.newsBanner:before {
	top: -10px
}

.newsBanner:after {
	bottom: -12px
}

.newsBanner article {
	width: 100%;
	height: 6rem
}

.imgNews {
	display: flex;
	position: relative;
	overflow: visible;
	align-items: center;
	align-content: center;
	float: left;
	width: 25%;
	height: 100%;
	margin-right: 2rem;
	margin-bottom: 1rem
}

.imgNews>img {
	z-index: 7;
	max-width: 100%;
	max-height: 500%
}

.faq {
	padding-top: 8rem;
	padding-bottom: 4rem
}

.cardContainer {
	margin-top: 4rem;
	margin-bottom: 2rem;
	padding: 0 10%;
	display: flex;
	width: 100%;
	justify-content: space-evenly;
	flex-wrap: wrap;
	align-items: center
}

.cardSize {
	width: 22%
}

.cardSize2 {
	width: 22%;
	background: url('/images/layers/cardRoomOrb2.webp');
	background-size: 75% 78%;
	display: block;
	overflow: hidden;
	border-radius: 1rem;
	position: relative;
	padding-bottom: 90%;
	background-repeat: no-repeat;
	left: 50px;
	margin-bottom: -21%
}

.cardRoom {
	background: url('/images/layers/cardRoom.webp');
	background-size: 100% 100%;
	display: block;
	overflow: hidden;
	border-radius: 1rem;
	position: relative;
	padding-bottom: 151%
}

.contentCard {
	position: absolute;
	display: flex;
	align-items: center;
	top: 53%;
	height: 30%;
	font-family: 'IM Fell English', serif;
	font-display: swap;
	color: #412727;
	font-size: 12px;
	line-height: 1.3rem
}

.cardRoom p {
	padding: 0 18%;
	text-align: justify
}

.cardRoom img {
	width: 66%;
	height: auto;
	position: absolute;
	top: 3%;
	left: 16.5%
}

.cardButton {
	position: absolute;
	bottom: 2em;
	width: 100%
}

.cardRoomReserve {
	background: url('/images/layers/cardRoomOrb2.webp');
	background-size: 75% 78%;
	display: block;
	overflow: hidden;
	border-radius: 1rem;
	position: relative;
	padding-bottom: 90%;
	background-repeat: no-repeat;
	left: 50px;
	margin-bottom: -21%
}

.cardButtonReserve {
	position: absolute;
	bottom: 0;
	width: 100%
}

.cardRoomReserve img {
	width: 65%;
	height: auto;
	position: absolute;
	top: 3%;
	left: 4.5%
}

.cardRoomReserve img.image-hover {
	position: absolute;
	top: 3%;
	right: 0;
	left: 4.5%;
	bottom: 0;
	object-fit: contain;
	opacity: 0;
	transition: opacity .2s
}

.cardRoomReserve:hover img.image-hover {
	opacity: 1
}

.map {
	background-image: url('../../images/backgrounds/mapBackground.webp');
	position: relative;
	display: flex;
	justify-content: center;
	padding-bottom: 2rem
}

.blockAdress {
	position: absolute;
	top: 110px;
	left: 28%;
	border: solid 16px;
	border-image-source: url('../../images/layers/frameGold.webp');
	border-image-slice: 55 56 55 56;
	border-image-outset: .5em;
	width: 25%;
	box-shadow: 0px 1px 3px 5px rgba(0, 0, 0, .5)
}

.mapStart {
	width: 100%;
	padding-bottom: 20%;
	position: relative
}

.mapStart:after {
	content: '';
	position: absolute;
	bottom: -38%;
	width: 100%;
	z-index: 2;
	padding-bottom: 24%;
	pointer-events: none;
	border-style: solid;
	border-image-source: url('../../images/layers/mapBefore.webp');
	border-image-slice: 487 0 0 0;
	border-image-width: 100% 0 0 0;
	border-image-outset: 0px 0px 0px 0px;
	border-image-repeat: stretch stretch;
	background-size: 100% auto;
	box-sizing: border-box
}

.mapTitle {
	position: absolute;
	top: -.5rem;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%
}

.aboutBlog {
	height: 70vh;
	background-image: url('/images/layers/banner-escape-room-min.webp');
	background-position: center;
	background-size: cover
}

.aboutPage {
	height: 70vh;
	background-image: url('/images/illustrations/illu-Island-Placeholder.webp');
	background-position: center;
	background-size: cover
}

.aboutPage:before {
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: -4rem;
	background-image: url('/images/layers/aboutBefore.webp');
	background-size: 100% auto;
	background-repeat: no-repeat
}

.aboutContainer {
	padding: 5rem 20%
}

.columnBlock {
	display: inline-block;
	width: 100%
}

.columnBlock img {
	width: 100%;
	height: auto
}

.verticalCenter {
	display: flex;
	align-items: center;
	height: 100%
}

.absoluscape {
	padding: 5rem 20%
}

.absoluscape:before {
	content: '';
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	height: 70%;
	width: 100%;
	pointer-events: none;
	background-image: url('../../images/logos/absoluscape_before.webp');
	background-repeat: no-repeat;
	background-position-y: bottom
}

.roomSlider {
	height: 95vh;
	background-image: url('/images/backgrounds/bgRoom_placeholder.webp');
	background-position: center;
	background-size: cover
}

.roomSlider:before {
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: -4rem;
	background-image: url('/images/layers/roomSlider_top.webp');
	background-size: 100% auto;
	background-repeat: no-repeat
}

.roomText {
	height: 26vh
}

.roomText:before {
	content: '';
	display: block;
	position: absolute;
	width: 100%;
	height: 100%;
	top: -5rem;
	background-image: url('/images/layers/roomSlider_bottom.webp');
	background-size: 100% auto;
	background-repeat: no-repeat
}

.blockRoomText {
	max-width: 45%;
	padding: 2rem;
	position: absolute;
	bottom: 1.5rem;
	text-align: justify
}

.blockRoomText>.icon {
	display: block
}

.roomMacaron {
	width: 17%;
	height: auto;
	position: absolute;
	top: -26px
}

.roomsNav {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 3rem;
	flex-direction: row;
	position: relative;
	text-transform: uppercase;
	text-align: justify;
	color: #f5f5f5;
	text-shadow: 0px 0px 3px rgba(214, 58, 6, 1), 0px 0px 3px rgba(214, 58, 6, 1), 0px 0px 3px rgba(214, 58, 6, 1), 0px 0px 3px rgba(214, 58, 6, 1);
	background-image: url('/images/layers/Bar_mid.webp');
	background-size: 100% 100%;
	background-position: top;
	padding: 0 2rem;
	height: 5rem;
	margin: 2rem 0 4rem
}

.roomsNav:before,
.roomsNav:after {
	content: '';
	display: block;
	position: absolute;
	height: 100%;
	width: 3em;
	top: 0;
	background-size: 100% 100%;
	background-position: top
}

.roomsNav:before {
	left: -3em;
	background-image: url('/images/layers/Bar_left.webp')
}

.roomsNav:after {
	right: -3em;
	background-image: url('/images/layers/Bar_right.webp')
}

.roomsNav li {
	display: inline-flex;
	align-items: center;
	align-content: center;
	cursor: pointer;
	width: 2rem;
	height: 2rem;
	transform: scale(100%) rotate(45deg);
	-webkit-transform: rotate(45deg);
	background-color: #412727;
	transition-duration: .2s;
	transition-timing-function: ease-in-out;
	border: 2px solid #412727
}

.roomsNav li:hover,
.roomsNav li:active,
.roomsNav li:focus {
	transform: scale(200%) rotate(45deg);
	background-color: #c1272d
}

.roomsNav li>.icon {
	display: block;
	width: 80%;
	height: 80%;
	fill: #f5f5f5;
	transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	margin: .1em
}

.flexRoomTitle {
	display: flex;
	flex-direction: row;
	align-items: center;
	align-content: center;
	justify-content: center;
	width: 100%;
	margin-bottom: 2em
}

.previous,
.next {
	display: block;
	margin: 0
}

.previous>.icon,
.next>.icon {
	height: 3rem;
	width: auto;
	fill: #412727;
	transition-duration: .2s;
	transition-timing-function: ease-in-out
}

.previous>.icon:hover,
.next>.icon:hover {
	transform: scale(120%);
	fill: #c1272d
}

.titleFlex {
	margin: 0 1em;
	flex: 5
}

.roomButton {
	margin-top: 3rem
}

.blockRecap {
	flex: 6
}

.blockPaiement {
	flex: 4
}

.playersPanel {
	display: block;
	float: right;
	width: 25%
}

.entetePaiement {
	position: relative;
	background-color: rgba(76, 174, 76, .8);
	width: 100%;
	color: #f5f5f5;
	margin: 0 auto;
	text-align: center;
	padding: 1.7rem 3rem 1.2rem;
	border-radius: 1rem 1rem 0 0
}

.entetePaiement h2 {
	font-size: 2rem;
	font-weight: 1000
}

.titlePaiement {
	display: block
}

.titlePaiement img {
	display: inline-block;
	float: left;
	height: 1em;
	width: auto
}

.bandeauCB {
	display: flex;
	flex-direction: row;
	gap: .5rem;
	position: relative;
	background-color: rgba(160, 160, 160, .6);
	padding: .5rem 3rem
}

.bandeauCB img {
	display: block;
	height: 2rem;
	width: auto
}

.blockCB {
	padding: 1rem 3rem;
	position: relative
}

.stripePowered {
	position: absolute;
	right: 2rem
}

.bottomBlock {
	position: relative;
	bottom: 0;
	padding: 1rem 3rem
}

.formPaiement {
	padding: .5rem;
	border: 2px solid;
	border-color: rgba(120, 70, 70, .6);
	border-radius: .2rem;
	background-color: #fff
}

.alertCustom {
	border-radius: .5em;
	font-family: 'Montserrat', sans-serif;
	font-display: swap;
	font-size: .9rem
}

.btnResa {
	margin-top: 2rem
}

.containerReservation {
	display: flex;
	align-items: center;
	gap: 2.2rem;
	flex-direction: row
}

select {
	font-family: 'Montserrat', sans serif;
	font-display: swap
}

.font2 {
	font-family: 'Montserrat', sans serif;
	font-display: swap
}

@media screen and (max-width:1600px) {
	.cardSize {
		width: 28%
	}

	.aboutPage:before {
		top: -10%
	}
}

@media screen and (max-width:1400px) {
	.cardSize {
		width: 33%
	}

	.flexBlock {
		margin: 2rem 1.5rem
	}

	.aboutPage:before {
		top: -6%
	}

	.blockRoomText {
		max-width: 42%;
		padding: 3rem;
		margin-top: 2rem
	}

	.roomMacaron {
		top: -36px
	}
}

@media screen and (max-width:1100px) {
	.imgNews {
		width: 30%
	}

	.imgNews>img {
		top: -3em
	}

	.cardSize {
		width: 33%
	}

	.aboutPage:before {
		top: -6%
	}

	.playersPanel {
		display: block;
		float: none;
		width: 100%
	}

	.blockRoomText {
		max-width: 80%;
		margin-bottom: 7rem
	}

	.roomSlider:before {
		top: -2rem
	}

	.roomMacaron {
		top: -10px
	}
}

@media screen and (max-width:820px) {
	.button_reserved_home {
		width: 40%
	}

	.containerReservation {
		flex-wrap: wrap;
		flex-direction: column
	}

	.blockPaiement,
	.blockRecap {
		flex: 1;
		width: 100%
	}

	.flexBlock {
		flex: 1 1 100%
	}

	.baseContainer {
		display: flex;
		position: relative
	}

	.framedBlock1 {
		width: 100% !important;
		margin: 3rem 0 !important
	}

	.contentCard {
		top: 52%;
		font-size: 1rem
	}

	.contentCard p {
		padding: 0 3rem
	}

	.cardContainer {
		display: flex;
		flex-direction: column;
		margin-right: 0;
		margin-left: 0
	}

	.cardSize {
		width: 50%;
		margin-bottom: 3rem
	}

	.newsBanner article {
		height: auto
	}

	.blockAdress {
		position: absolute;
		top: 200px;
		left: 5%;
		width: 90%;
		display: none
	}

	.blockHalfPage {
		width: 95%
	}

	.headerVideo {
		display: none
	}

	.header-img-mobile {
		background: url('../../images/layers/frameVideo.webp');
		background-position: top;
		background-size: cover;
		width: 100%;
		background-repeat: no-repeat
	}

	.newsBanner {
		flex-direction: column
	}

	.imgNews {
		display: none
	}

	.button_reserved {
		white-space: normal;
		margin: 0 auto
	}

	.flexBlock {
		margin: 2rem 1.5rem
	}

	.faq {
		padding-top: 2rem
	}

	.sectionTitle:before {
		width: 5em;
		left: -5em
	}

	.sectionTitle:after {
		width: 5em;
		right: -5em
	}

	.aboutContainer {
		padding: 5rem 2rem
	}

	.aboutPage {
		height: 30vh
	}

	.aboutPage:before {
		top: -.5em
	}

	.sectionTitle {
		max-width: 50%;
		font-size: 1rem;
		padding-top: 2em;
		padding-bottom: 2em;
		text-align: center
	}

	.textContent {
		column-count: 1
	}

	.absoluscape:before {
		opacity: .5;
		background-size: contain
	}

	.absoluscape {
		flex-direction: column;
		padding: 5rem 2rem
	}

	.absoluscape img {
		margin-bottom: 3em
	}

	.aboutPage:before {
		top: -12%
	}

	.roomText:before {
		top: -1rem
	}

	.blockRoomText {
		max-width: 90%;
		padding: 1rem
	}

	.roomsNav {
		gap: 1rem;
		padding: 0 7px;
		margin-top: 6rem
	}

	.roomSlider:before {
		top: -1rem
	}

	.titleBrown {
		font-size: 1.2rem
	}

	.blockParchment {
		margin-bottom: 1rem
	}

	.roomSlider:before {
		background-position-x: center;
		background-size: 210% auto
	}

	.roomMacaron {
		width: 36%;
		height: auto
	}

	.basicPadding {
		padding: 1rem
	}

	.blockCB {
		padding: 1rem
	}

	.bandeauCB img {
		height: 1.5rem
	}

	.stripePowered {
		right: 1rem
	}

	.entetePaiement h2 {
		font-size: 1rem
	}

	.blockParchment {
		font-size: 1rem
	}
}

@media screen and (max-width:800px) {
	.aboutPage:before {
		display: none
	}

	.headerCover {
		display: none
	}

	.roomMacaron {
		width: 34%;
		height: auto;
		position: absolute;
		top: 13px
	}

	.roomText2 {
		height: 0
	}

	.roomText2:before {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: -5rem;
		background-image: url('/images/layers/roomSlider_bottom.webp');
		background-size: 100% auto;
		background-repeat: no-repeat
	}
}

@media screen and (max-width:500px) {
	.newsBanner article {
		height: auto;
		position: relative
	}

	.cardSize {
		width: 110%;
		margin-bottom: 5rem
	}

	.contentCard {
		top: 55%
	}

	.roomText2 {
		height: 0
	}

	.roomText2:before {
		content: '';
		display: block;
		position: absolute;
		width: 100%;
		height: 100%;
		top: -5rem;
		background-image: url('/images/layers/roomSlider_bottom.webp');
		background-size: 100% auto;
		background-repeat: no-repeat
	}
}

/* keyframes */

@keyframes pulse {
	0% {
		box-shadow: 0 0 0 0 rgba(121, 170, 43, .7)
	}

	80% {
		box-shadow: 0 0 .6rem .5rem rgba(121, 170, 43, 0)
	}

	100% {
		box-shadow: 0 0 0rem 0 rgba(121, 170, 43, 0)
	}
}

@keyframes pulse-lock {
	0% {
		box-shadow: 0 0 .6rem .5rem rgba(247, 147, 30, 0)
	}

	100% {
		box-shadow: 0 0 0 0 rgba(247, 147, 30, 1)
	}
}