/* base */
html{
	height: 100%;
}
body{
	font-family: 'Roboto', sans-serif;
	font-size:12px;
	margin: 0;
	height: 100%;
}
.bold{
	font-weight:bold;
}
.italic{
	font-style:italic;
}
.capitale{
	text-transform:uppercase;
}
.justify{
	text-align: justify;
}
.center{
	text-align: center;
}
.left{
	text-align: left;
}
.right{
	text-align: right;
}
.relative{
	position: relative;
}
a img{
	border:0;
}
a {
	text-decoration:none;
}
ul,ol,dl,figure{
	margin:0;
	padding:0;
	list-style: none;
}
.nonValide{
	background-color: rgba(255,0,0,0.6) !important;
}
.inlineMiddle,.inlineBottom,.inlineTop{
	display: inline-block;
	vertical-align: middle;
}
.inlineBottom{
	vertical-align: bottom;
}
.inlineTop{
	vertical-align: top;
}
.none,.mobileOnly{
	display: none;
}
.floatLeft{
	float: left;
	margin: 0 5px 5px 0;
}
.floatRight{
	float: right;
	margin: 0 0 5px 5px;
}
.clear{
	clear: both;
}
.rouge{
	color: #a91b1a;
}
.vert{
	color: #360;
}
.blanc{
	color: #fff;
}
.noir{
	color: #000;
}
.bloc{
	display: block;
}
.imgResp{
	margin: 0 auto;
	max-width: 100%;
	height: auto;
}
.contentZone{
	width: 95%;
	max-width: 1480px;
	margin-right: auto;
	margin-left: auto;
	counter-reset: rental;
}

/* structure */
.panneau{
	position: absolute;
	left: 0; top: 0;
	width: 100%;
	z-index: -1;
	height: 0;
	padding-bottom: 56%;
}
.panneauContact{
	height: 0;
	padding-bottom: min(34%, 526px);
}
.panneau1,.panneauContact{
	background: no-repeat center top;
	background-size: cover;
}
.fondSable{
	padding: 2% 0;
	margin: 2% 0 7% 0;
}
.contactZone + .fondSable{
	margin-bottom: 0;
}
.fondSable2{
	margin: 34% 0 0 0;
	height: 0;
	padding: 0 0 19.27% 0;
	position: absolute;
	left: 0; right: 0; top: 0;
	z-index: -1;
}

/* header */
.header{
	padding: 25px 0;
}
.siteName{
	width: 50%;
	margin: 0;
	font-weight: normal;
	font-size: 3em;
	position: absolute;
}
.logoLink{
	position: absolute;
	top: 0;
	left: 0;
	width: 120px;
	height: 120px;
	border-radius: 50%;
	overflow: hidden;
	border: 3px solid;
	z-index: 2;
}
.menuZone{
	width: 48%;
	margin: 0 0 0 52%;
	box-sizing: border-box;
}
.activeMenu{
	width: 40px;
	height: 40px;
	box-sizing: border-box;
	border-radius: 5px;
	padding: 8px 5px;
}
.longBar{
	border-radius: 5px;
	width: 100%;
	height: 4px;
}
.middleBar{
	border-radius: 5px;
	width: 60%;
	margin: 6px auto;
	height: 3px;
}
.activeMenu.open{
	border-radius: 50%;
	border: 3px solid;
}
.open .middleBar{
	display: none;
}
.open .longBar{
	transform: rotate(41deg);
	transform-origin: 0 0;
	margin: 0 0 0 4px;
}
.open .secondBar{
	transform: rotate(-45deg);
	transform-origin: 0 0;
	margin: 12px 0 0 2px;
}

.listeMenu{
	position: absolute;
	top: 0; right: 0;
	width: 100%;
	box-sizing: border-box;
	margin: 67.5px 0 0 0;
	padding: 0 0.7em;
	background: rgba(255,255,255,0.8);
	border-radius: 5px;
	box-shadow: -3px 3px 0px 3px rgba(0,0,0,0.1);
	z-index: 4;
	display: none;
	overflow: hidden;
}
.menuZone.menuOuvert .listeMenu{
	display: block;
}
.lienMenu{
	font-size: 1.5em;
	margin: 0.8em 0;
	border-bottom: 2px solid #fff;
	transition-property:color;
	transition-duration: .3s;
	transition-timing-function: ease-out;
}

/* footer */
.panneauFooter{
	font-size: 1.1em;
	padding: 1% 2%;
}
.footerList{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.liFooter{
	max-width: 20%;
}
.separationFooter{
	width: 1px;
	background: #fff;
	height: 80px;
	margin: 2% 0 0 0;
}

/* accueil */
.impactZone{
	height: 0;
	padding-bottom: calc(56% - 90px);
	z-index: 1;
}
.homeTitleZone,.internalTitle{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 0; left: 0;
	width: 100%; 
	height: 100%;
	font-size: 1.6em;
}
.homeTitle{
	padding: .3em 1em;
	font-weight: normal;
}
.homeBaseline,.homeTitle{
	text-shadow: 0px 0px 4px #000;
}
.homeSlider{
	position: absolute;
	left: 0; top: 0;
	width: 100%; height: 100%;
}
.homeDownArrow{
	width: 3.5%;
	position: absolute;
	height: 0;
	padding: 0 0 3.5% 0;
	border-radius: 50%;
	bottom: 19.5%;
	left: 48.25%;
}
.arrowSvg{
	position: absolute;
	top: 0; left: 0;
}
.arrow{
	stroke-width: 2px;
	transform: rotate(90deg);
	transform-origin: 50% 50%;
}
.icoAccueil{
	width: 80%;
	margin: 0 auto;
	font-size: 1.3em;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.pIcoAccueil{
	width: 31%;
	margin-top: 20px;
	margin-bottom: 20px;
}
.homeMarquee + .contentZone .pIcoAccueil{
	margin-top: 0;
}
.figIcoAccueil{
	width: 70px;
	height: 70px;
	margin: 0 auto 12px auto;
}
.homeIcon{
	width: 100%;
	height: 100%;
	object-fit: contain;
}
.txtNImgZone{
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 80%;
}
.homeTxtZone,.homeFigZone{
	width: 45%;
}
.sectionTitle{
	font-size: 2em;
}
.puzzleList,.contactZone{
	width: 80%;
	margin: 5% auto;
	display: flex;
	justify-content: space-between;
}
.puzzleLi{
	width: 23%;
	font-size: 1.2em;
}
.puzzleLi[data-gt~="4"]{
	display: none;
}
.puzzleLiTxt{
	position: absolute;
	z-index: 1;
	left: 5px; right: 5px;
	top: 5px;
	border-radius: 5px;
	padding: 5px 0;
	margin: 0;
}
.puzzlePlus,.puzzleMoins{
	width: 3%;
	position: absolute;
	top: 47.5%; bottom: 0; right: -5%;
}
.puzzleMoins{
	right: auto;
	left: -5%;
}
.puzzlePlusImg,.arrowImg{
	width: 100%;
	height: auto;
}
.puzzlePlusIcon,.arrowIcon{
	fill:none;
	stroke:#000;
	stroke-width:30px;
}
.puzzlePlus[data-gt="3"]{
	display: none;
}
.puzzlePlus[data-gt~="4"]{
	display: list-item;
}
.puzzleTxt{
	width: 60%;
	margin: 20px auto;
}
.reviewZone,.contactZone{
	margin-top: 80px;
	margin-bottom: 80px;
}
.homeReview{
	width: 60%;
	margin: 25px auto;
	font-size: 1.6em;
	padding: 0 0 0 10%;
}
.homeReview:before{
	content: "";
	position: absolute;
	left: 0; top: 0;
	width: 10%;
	height: 100%;
	background: url(../images/guillemet.png) no-repeat center center;
	background-size: contain;
}
.bouton{
	width: 180px;
	font-size: 1.3em;
	padding:15px 5px;
	border-radius: 20px;
	margin: 3.2% auto;
}
.contactZone{
	align-items: center;
	width: 60%;
}
.homeMap{
	width: 60%;
	height: 0;
	padding: 0 0 33.75% 0;
}
.homeMap iframe{
	position: absolute;
	left: 0; top: 0; 
	width: 100%;
	height: 100%;
	border: none;
}
.homeContact{
	width: 35%;
	font-style: normal;
	font-size: 1.3em;
	line-height: 1.5em;
}
.homeGallery,.fieldForm,.menuList,.reviewsForm,.rentalForm{
	border-radius: 5px;
	box-shadow: 0 0 9px rgba(0,0,0,0.6);
	margin: 3.2% auto 0 auto;
	padding: 3.2%;
	width: 60%;
	display: flex;
	justify-content: space-between;
	align-items: stretch;
}
.homeGalleryLink{
	width: 30%;
	height: 0;
	padding: 0 0 30% 0;
}
.homeImgAdapt,.homeImgAdapt2,.logoImgAdapt{
	position: absolute;
	top: 0; left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.infoTemp{
	font-size: 1.2em;
	width: 96%;
	padding: 1% 2%;
	white-space: nowrap;
	overflow: hidden;
}
.marqueeText{
	display: inline-block;
	padding-left: 100%;
	animation: marquee 15s linear infinite;
}
.hoursZone{
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.hoursClock{
	margin: 5px 0 0 0;
}
.listeOuverture{
	width: calc(100% - 25px);
}
.afficheJour,.afficheTimes{
	width: 50%;
}
.ouvreHoraires{
	position: absolute;
	left: 100%; top: 0;
}
.autresJours{
	width: 100%;
}
.linksZone{
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
}
.homeLinkImg{
	width: 15%;
	height: 0;
	padding: 0 0 15% 0;
}
.homeImgAdapt2{
	object-fit: contain;
}
.homeDlLi{
	font-size: 1.1em;
	margin: 10px 0;
}
.galleryZone{
	margin: 7% 0;
}
.textSection{
	margin: 2% 0;
}
.textSection.lastTextSection{
	margin: 2% 0 7% 0;
}


/* contact */
.bgTitlePage{
	padding: .5em 1em;
	border-radius: 5px;
	text-shadow: 0px 0px 4px #000;
}
.contactForm{
	padding: 0 0 4% 0;
}
.contactForm p{
	font-size: 1.4em;
}
.fieldForm{
	font-size: 1.4em;
	display: block;
	background: #fff;
	width: 50%;
}
.boutonForm,.boutonRentForm,.dateButtonForm{
	border: none;
	font-size: 1.2em;
	cursor: pointer;
	border-radius: 5px;
	width: 40%;
	margin: 3.2% 0 3.2% 55%;
}
.champFormulaire,.champAvis{
	width: 90%;
	box-sizing: border-box;
	font-family: 'Roboto', sans-serif;
	border: none;
	padding: 0.5em 0;
	margin: 2% 5%;
	font-size: 1em;
	border-bottom: 1px solid;
}
.areaForm,.areaAvis{
	height: 10em;
	resize: none;
	border: 1px solid;
}
.labelFormulaire,.champsObli{
	margin: 5% 0 0 5%;
}

/* photos */
.internatPageHeader{
	height: 0;
	padding-bottom: calc(35.7% - 90px);
}
.internalTitle{
	font-size: 1.8em;
	margin: 0;
}
.liAlbumVitrine{
	margin: 25px 0;
	background: #fff;
	padding: 1em;
	box-shadow: 1px 1px 5px #666;
}
.titreAlbumVitrine{
	margin: 0;
}
.listePhotoVitrine{
	max-height: 0;
	padding: 0 4px;
	overflow: hidden;
	-webkit-transition-property: max-height;
	-webkit-transition-duration: .3s;
	-webkit-transition-timing-function: ease-out;
	transition-property:max-height;
	transition-duration: .3s;
	transition-timing-function: ease-out;
}
.zoneEditorVitrine{
	padding: 0 1em 1em 0;
}
.listePhotoVitrine.open,.listePhotoVitrine:target{
	max-height: 3000px;
}
.liPhotoVitrine{
	width: 19%;
	margin: 1.25% 1.25% 1.25% 0;
	box-sizing: border-box;
	padding: .5em;
	box-shadow: 0px 0px 5px #666;
	border-radius: 6px;
}
.liPhotoVitrine:nth-child(5n){
	margin: 1.25% 0;
}
.cropPhotoVitrine{
	padding: 0 0 60% 0;
	height: 0;
	overflow: hidden;
	border-radius: 6px;
}
.showAlbum{
	position: absolute;
	right: 5%;
	top: 1em;
}
.legendePhotoVignette{
	margin: .5em 0 0 0;
	padding: .5em;
	border-radius: 6px;
}

/* avis */
.listeNoteAvisAside{
	width: 20%;
}
.champAvis,.notationGlobale{
	width: 100%;
	margin: 0 0 10px 0;
}
.labelAvis{
	font-size: 1.1em;
}
.listeNote{
	font-size: 1.3em;
}
.labelNote{
	margin: 0 0 0 0.5em;
}
.champAvis.textarea{
	margin: 0;
}
.liAvis{
	padding-bottom: 1.5em;
	margin-bottom: 1.5em;
	border-bottom: 1px solid;
}
.liAvis:last-child{
	border: none;
}
.zoneContenu,.formuContact,.rentOptions{
	background: #fff;
	width: 58%;
	padding: 1% 2%;
	margin: 25px 0 0 0;
	font-size: 1.2em;
}
.reviewsForm,.adresseContact,.rentalForm{
	display: inline-block;
	width: 36%;
	margin: 25px 0 25px 2%;
	box-sizing: border-box;
	padding: 2%;
}

/* page */
.editor{
	margin: 25px 10%;
}
.zoneEditorVitrine{
	padding: 1em;
}
.editor img,.zoneEditorVitrine img,.editor img.centerCKE,.zoneEditorVitrine img.centerCKE{
	display: block;
	margin: 5px auto;
	max-width: 100%;
	height: auto;
}
.editor img.leftCKE,.editor img.rightCKE,.zoneEditorVitrine img.rightCKE,.zoneEditorVitrine img.leftCKE{
	margin: 5px 5px 5px 0;
	float: left;
	max-width: 40%;
	height: auto;
}
.editor img.rightCKE,.zoneEditorVitrine img.rightCKE{
	float: right;
	margin: 5px 0 5px 5px;
}
.editor ul,.editor ol,.zoneEditorVitrine ul,.zoneEditorVitrine ol{
	list-style-type: disc;
	padding-left: 3%;
}
.editor ol,.zoneEditorVitrine ol{
	list-style-type: decimal;
}
.titrePageVitrine{
	margin-top: 0;
}
.titreVitrine{
	margin-bottom: 0;
}
.mosaicList{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 50px 0;
}
.mosaicItem{
	width: 30%;
	height: 0;
	padding: 0 0 30% 0;
	margin-bottom: 5%;
	overflow: hidden;
}
.mosaicLink{
	position: absolute;
	left: 0; top: 0; width: 100%; height: 100%;
	z-index: 0;
}
.imgAdapt{
	width: 100%; height: 100%;
	object-fit:cover;
}
.mosaicTextLink{
	position: absolute;
	z-index: 1;
	top: 0; left: 0;
	font-size: 2em;
	padding: 10px;
	box-sizing: border-box;
	margin: 0 2%;
	width: 96%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	text-shadow: 0px 0px 4px #000;
}
.pageLinkList{
	margin: 50px 0;
	display: flex;
	justify-content: center;
}
.pageLinkItem{
	margin: auto;
}

/* menu resto */
.menuList{
	display: block;
	margin: 2% auto 10% auto;
	font-size: 1.2em;
}
.menuItem{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	margin: 20px 0;
}
.menuItemSeparator{
	border-bottom: 1px dotted #000;
	flex-grow: 1;
	margin: 0 5px 5px 5px;
}
.menuItemDetail{
	width: 100%;
}
.menuTitle{
	margin: 5% 0 2% 0;
	font-size: 1.2em;
}

/* calendrier */
.legCal{
	width: 12%;
	height: 0;
	padding: 0 0 5% 0;
	border: 1px solid #000;
	margin: 5px;
}
.legCal.disponible{
	margin: 5px 5px 5px 30px;
}
.disponible,.jour,.jour1{
	background: #fff;
	color: #000;
}
.occupe{
	background: #fe5f5f;
}
.calendrier{
	width: 100%;
	border: 1px solid #000;
	border-collapse: collapse;
	padding: 0;
}
.celMonth,.celCal{
	width: 100%;
	padding: 0.5em 0;
}
.celCal{
	width: 14.28%;
}
.jourCurrent,.jourCurrent1{
	border: 1px solid #000;
	color: #000;
}
.lienCal{
	padding: 0.5em 1em;
}

/* location */
.rentOptions{
	margin: 0;
	padding-top: 0;
}
.rentalForm{
	margin-top: 65px;
}
.rentalStepTitle:before{
	counter-increment: rental;
	content: counter(rental);
	border: 2px solid;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	line-height: 20px;
	text-align: center;
	display: inline-block;
	vertical-align: middle;
	margin: 0 5px 0 0;
}
.rentProduct{
	margin: 0 0 80px 0;
	display: flex;
	justify-content: space-between;
	flex-wrap:wrap;
}
.leftRentProduct{
	width: 53%;
}
.rentProductTitle{
	width: 100%;
	margin-top: 0;
}
.rightRentProduct{
	width: 45%;
}
.boutonRentForm,.dateButtonForm{
	font-size: 1em;
	width: auto;
	margin: 10% 0;
	padding: 5px 10px;
}
.dateButtonForm{
	margin: 10px 0;
}
.priceDisplay{
	margin: 15px 0;
	font-size: 2em;
}
#rentalPostit{
	position: fixed;
	top: 10px;
	border-radius: 5px;
	box-shadow: 0 0 9px rgba(0,0,0,0.6);
	width: 180px;
	margin: 25px 0;
	box-sizing: border-box;
	padding: 2%;
}
.ticketLine{
	border-bottom: 1px solid;
	padding-bottom: 10px;
	margin-bottom: 10px;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.totalTicketLine{
	font-size: 1.6em;
}
.ticketName{
	width: 65%;
}
.ticketPrice{
	width: 30%;
}
#validTicketLine{
	margin: 30px 0 0 0;
}
.basketRemove{
	font-size: .8em;
}
.alertLocationForm{
	font-size: 2em;
}


@media only screen and (max-width: 1050px){
	.contactZone{
		width: 85%;
	}
	.editor{
		margin: 25px 7%;
	}
}
@media only screen and (max-width: 800px){
	.panneau1{
		padding: 0;
		height: 100%;
	}
	.panneauContact{
		padding-bottom: 75%;
	}
	.impactZone{
		height: calc(100% - 90px);
		padding-bottom: 0;
	}
	.internatPageHeader{
		padding-bottom: calc(76.5% - 90px);
	}
	.homeTitle{
		width: 60%;
	}
	.homeDownArrow{
		width: 12%;
		padding: 0 0 12% 0;
		bottom: 5%;
		left: 44%;
	}
	.fondSable2{
		margin: 75% 0 0 0;
	}
	.contentZone{
		width: 98%;
	}
	.listeMenu{
		width: 120%;
	}
	.homeGallery{
		width: 90%;
	}
	.contactZone{
		display: block;
	}
	.homeMap{
		width: 90%;
		margin: 0 auto;
	}
	.homeContact{
		width: 90%;
		margin: 15px auto 50px auto;
	}
	.hoursZone{
		width: 250px;
		margin: 10px auto;
	}
	.homeLinkImg{
		width: 46%;
		padding: 0 0 30% 0;
		margin-bottom: 20px;
	}
	.menuList{
		width: 80%;
	}
	.zoneContenu,.rentOptions{
		width: 100%;
		padding: 1% 0;
		margin: 0 0 50px 0;
	}
	.rentOptions{
		width: calc(100% - 80px);
	}
	.reviewsForm,.rentalForm{
		display: block;
		width: 60%;
		margin: 0 auto 50px auto;
	}
	.mobileOnly{
		display: block;
	}
	.fieldForm{
		width: 80%;
	}
	.puzzleLi{
		width: 46%;
	}
	.puzzleLi[data-gt]{
		display: none;
	}
	.puzzlePlus,.puzzleMoins{
		width: 8%;
		right: -10%;
	}
	.puzzleMoins{
		right: auto;
		left: -10%;
	}
	.puzzlePlus[data-gt]{
		display: list-item;
	}
	.footerList{
		flex-wrap: wrap;
	}
	.liFooter{
		max-width: none;
		width: 45%;
		margin-bottom: 20px;
		text-align: center;
	}
	.separationFooter:nth-child(4){
		display: none;
	}
	.liPhotoVitrine,.liPhotoVitrine:nth-child(5n){
		width: 32%;
		margin: 2% 2% 2% 0;
	}
	.liPhotoVitrine:nth-child(3n){
		margin: 2% 0;
	}
	.mosaicItem{
		width: 46%;
		padding: 0 0 46% 0;
		margin-bottom: 8%;
	}
	.editor{
		margin: 50px 0;
		padding: 1px 25px;
	}
	#rentalPostit{
		width: 70px;
		padding: 5px;
	}
	#rentalPostit > .ticketLine{
		flex-wrap: wrap;
	}
	.totalPostit,.amountPostit{
		width: 100%;
		text-align: center;
	}
	.fondSable,.galleryZone,.contactZone{
		margin-top: 80px;
		margin-bottom: 80px;
	}
	.fondSable{
		margin-top: 30px;
	}
	.fondSable.textSection{
		margin: 30px 0 0 0;
	}
	.textSection.lastTextSection{
		margin-bottom: 80px;
	}
}

@media only screen and (max-width: 600px){
	.listeMenu{
		width: 160%;
		background: rgba(255,255,255,1);
	}
	.icoAccueil{
		width: 100%;
		flex-wrap: wrap;
	}
	.figIcoAccueil{
		width: 50px;
		height: 50px;
		margin: 0 auto 5px auto;
	}
	.txtNImgZone{
		flex-direction: column-reverse;
		justify-content: flex-start;
	}
	.txtNImgZone.noReverse{
		flex-direction: column;
	}
	.homeTxtZone,.homeFigZone{
		width: 95%;
	}
	.liFooter,.rightRentProduct,.leftRentProduct{
		width: 100%;
	}
	.separationFooter{
		display: none;
	}
	.liPhotoVitrine,.liPhotoVitrine:nth-child(5n),.liPhotoVitrine:nth-child(3n){
		width: 48%;
		margin: 2% 2% 2% 0;
	}
	.liPhotoVitrine:nth-child(2n){
		margin: 2% 0;
	}
	.menuList,.fieldForm,.reviewsForm,.rentalForm{
		width: 90%;
	}
	.boutonForm{
		width: 100%;
		margin: 3.2% 0;
	}
	.champFormulaire{
		width: 100%;
		margin: 2% 0;
	}
	.puzzleTxt{
		width: 80%;
	}
	.mosaicTextLink{
		font-size: 1.6em;
	}
	.rightRentProduct{
		text-align: center;
	}
	.homeTitleZone{
		font-size: 1.2em;
	}
}
@keyframes marquee {
    0%   { transform: translate(0, 0); }
    100% { transform: translate(-100%, 0); }
}