/**  dorée #fb9f3e crême : #f9f2e8 font : Linux Biolinum G   * */
/**  color epinalhotellafayette : #1b1b1b  #9b1636 #ffcc33 **/

@font-face { font-family:'Menu'; src: url('Costa Ptf Regular.otf') format('truetype');}
@font-face { font-family:'Texts'; src: url('Gotham Book.otf') format('truetype');}

html { scroll-behavior: smooth; }
body {
	background-color:#f9f2e8; 
	font-family: 'Texts', 'Helvetica', 'Arial', sans-serif;
	font-size: 1em;
 	margin: 0; /* pour �viter les marges */
	text-align: center; /* pour corriger le bug de centrage IE */
	color: #000;
    }

h1 { font-size:1.5em; text-align:center; font-family: 'Menu', 'Helvetica', 'Arial', sans-serif; margin:0px auto; vertical-align:middle; line-height:80px; padding-top:7px;font-family: 'Menu', 'Helvetica', 'Arial', sans-serif; }
h2 { font-size:1.1em; font-family: 'Menu', 'Helvetica', 'Arial', sans-serif; }
h3 { font-size:1em; }

A { text-decoration: none; }
A:link { color:#000; }
A:visited { color:#000;}
A:active { color:#fb9f3e; }
A:hover { color:#fb9f3e; }

#menus a { background-color: #fb9f3e; padding: 0.5%; margin: 1%; border-radius:3px; border: 1px solid #5d5e5e;}
#menus a:hover { background-color: #f9f2e8;  }
img { border:0px; padding:0px; margin:0px; font-size:70px; line-height:0px; max-width:100% }
ul { margin: 0px; padding: 0px;}
iframe { max-width:100%; border:1px #7bc142 solid; }

#pdf-container p { font-size: x-large; margin: 4%; font-weight: bold;  }

#flag { width : 300px; text-align: center; line-height:50px; margin:auto }
#flag img { width:46px; vertical-align: middle; }
#flag p { text-align: left;  margin:1%;}

.photo { border:1px solid #fb9f3e; }
.return  { clear:both }
.center { margin:auto; text-align:center; }
.mini { font-size:0.7em }
.big { font-size:2em; color:#fb9f3e; }

/*  entete  */ 
#header { background-color:#f9f2e8; width:100%; margin:0px; padding:0px; }

#bloc_lg { text-align:right; float:right; margin:0.5%; height:32px; width:20%; overflow: hidden; }
#bloc_lg li { display:inline-block; list-style-type:none; }
#bloc_lg ul { padding:0; margin:0; }
#bloc_lg img { width:32px; margin-right:2px }

#bloc_ico { text-align:center; margin:0.5%; width:20%; float:left; }
#logo { width:170px; }

#menu { text-align:right; width:75%; font-family: 'Menu', 'Helvetica', 'Arial', sans-serif; font-size:1.1em; margin:0px; padding: 0px;float:right; }
#menu li { display:inline-block; padding:1%; border-radius:3px; border-bottom: #f9f2e8 1px solid;}
#menu li:hover { background-color:#fff; border-bottom: #fb9f3e 1px solid; }

#bloc_titre { letter-spacing:2px; background-color:#fb9f3e; height:80px; margin:0px; padding:0px; width:100%; background-image: url(../../themes/cajou-resort/imgs/coiffe.png); background-position: center 5px; background-repeat:no-repeat; clear:both; }

/*  content  */
#content { clear:both; width:100%; text-align:left; margin:0px; padding:0px; }
#bloc { clear:both; width:100%; text-align:center; vertical-align:top; margin:0px; padding:0px; }
#bloc_100 { width:100%; margin:0; padding:0; vertical-align:top; text-align:justify; }

#col_3 { display:none; }
#col_2 { display:none; float:right; width:255px; padding:5px; margin:0; text-align:center; margin-bottom:5px; border-left:1px #5d5e5e solid; }
/*#col_1b { margin:0; padding:0; margin-right:270px; white-space:normal; }
#col_1 { max-width:1020px; margin:auto; text-align:left; }*/
#col_1, #col_1b { width: 100%;}
#col_1 img { border:1px #5d5e5e solid; }
#description { clear:both }
#description img { max-width:100% }

#bloc_1 { height:420px; background-color:#fff; background-position: left center; background-size:cover; animation: bloc_1 30s infinite; margin:0px; padding:0px;} 
#bloc_2 { height:auto; }
#bloc_3 { background-color:#fb9f3e; margin:0px; padding:0px; height: 360px; width:100%;
	 background: url(../../images/site/hotel-swimming-pool.jpg); background-attachment:fixed; background-position: center; 
	background-size: cover; -webkit-background-size: cover; -o-background-size: cover;
	
}
@supports (-webkit-touch-callout: none) {
	#bloc_3 {
		background: url('../../images/site/hotel-swimming-pool.jpg') center no-repeat scroll;
		background-size: 98% auto;
		overflow:hidden; border-radius:5px;
	}    
	}

/*#bloc_4 { background-image: url(../../images/blog/2485-Hotel-Room-Duc-Hoa.jpg); background-position: left center; background-size: contain; background-size: 65% auto;}
#bloc_5 { background-image: url(../../images/blog/2485-swimming-pool-duc-hoa.jpg);  background-position: right center; background-size: 65% auto;}
#bloc_6 {  background-image: url(../../images/blog/2485-swimming-pool-duc-hoa.jpg); background-position: left center; background-size: 65% auto;}*/

#bloc_1, #bloc_3, #bloc_4, #bloc_5, #bloc_6 { background-repeat: no-repeat; overflow:hidden; } 
.bloc_right, .bloc_left, .bloc_center { clear:both; width:98%; margin:1%; overflow:hidden; text-align: center; }
.bloc_right, .bloc_left { overflow:hidden; }
.bloc_all { width:100%; margin:0px; vertical-align: middle; }
/*.img_A {  width:100%;  }*/

.img_A img { width:100%; object-fit:cover; object-position: 50% 35%; height: 360px; }
.bloc_right img { width:60%; float:right; object-fit:cover; object-position: 50% 20%; height: 360px; border-radius:5px; } 
.bloc_left img { width:60%; float:left;  object-fit:cover; object-position: 50% 20%; height: 360px; border-radius:5px; }

/*.img_L { width:60%; height: 360px; float:left;}
.img_L img { width: 100%;}
, 	.img_R, */

.bloc_text_R { width:30%; padding:1%; margin:2%; background-color:#fff; float:right; }
.bloc_text_L { width:30%; padding:1%; margin:2%; background-color:#fff; float:left; }
.bloc_text_A { width:94%; padding:1%; margin:2%; background-color:#fff; }
.bloc_text_R ul { margin-left: 2em; }
.button { background-color: #ffcc33; padding:1%; text-align: center; width: 12em; border-radius:5px;}

@keyframes bloc_1 {
	0% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-1.jpg); 
	}
	16% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-2.jpg);
	}
	32% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-3.jpg);
	}
	48% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-4.jpg);
	}
	64% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-5.jpg);
	}
	80% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-6.jpg);
	}
	100% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-1.jpg);
	}
		
  /*  from { background-position: 50% 50%; opacity:0;}transform: scaleX(0); transform: scaleX(1); 
    to { background-position: 50% 50%; opacity:1.0; } background-color:#9b1636; */
  }
@keyframes photo {
    from { margin-right: 100%;}
    to { margin-right: 0px;}
  }
@-webkit-keyframes bloc_1 {
	0% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-1.jpg); 
	}
	16% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-2.jpg);
	}
	32% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-3.jpg);
	}
	48% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-4.jpg);
	}
	64% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-5.jpg);
	}
	80% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-6.jpg);
	}
	100% {
		opacity:1; background-image: url(../../images/cover/hotel-cajou-duc-hoa-1.jpg);
	}
}
@-webkit-keyframes photo { 
    from { margin-right: 100%;}
    to { margin-right: 0px;}
}

.style_1, .style_M, .style_M2 { width:24%; margin:0.5%; padding:0%; vertical-align:top; min-height:130px; text-align:center; overflow:hidden;display:inline-block;}
.style_M { width:18%}
.style_M2 { width:48% }
.style_M2 img { float: left; width: 50%; }

.style_1 img { width:100%; vertical-align:middle }
.style_1:hover img, .style_M:hover img, .style_M2:hover img { -webkit-transform:scale(1.1); transform:scale(1.1); }

#bloc_A, #bloc_B { background-color: rgba(245, 245, 245, 0.7); width:48%; margin:0.2%; padding:0.5%; display:inline-block; border:1px solid #5d5e5e; vertical-align:top; text-align:left; }

#search_bar { text-align:right; height:38px; }
#search_bar img { border:0px; margin:0 }

.pagination { margin:auto; text-align:center; clear:both; margin-top:10px; }
.pagination a { display: inline-block; padding: 8px 16px; text-decoration:none; transition: background-color .3s; margin:2px; }
.pagination a.active { background-color: #fb9f3e; color: white; }
.pagination a:hover:not(.active) { background-color: #ddd;}

#bottom { display:none ; margin: 0px; padding: 0px;}

/* pied de page */ 
#footer { clear:both; background-color:#1b1b1b; width:100%; margin:0px; text-align:left; color:#fff; font-family: 'Menu', sans-serif; }
#footer a { color:#fff; padding: 1%; border-radius:3px;}
#footer a:hover { color:#fb9f3e; background-color: #eee; width:100%;}

#bloc_adr { color:#1b1b1b; width:190px; padding:1%; text-align: center; background-color:#f9f2e8 ; margin: 2%; border-radius:25px;}
#bloc_adr ul { list-style-type:none; padding:0; margin:0; }
#bloc_adr img { width:180px; }

#lien_social { margin:0; padding:0; margin:auto; text-align:center; }
#lien_social li { display:inline-block; list-style-type:none;width:32px; height:32px; opacity: 0.8; }
#lien_social li:hover {  -webkit-transform:scale(1.1); transform:scale(1.1);opacity: 1; }

#bloc_liens { width:58%; float:right; border-left:#eee solid 1px; margin:3%;}
#lien_bloc1, #lien_bloc2 { width:45%; display:inline-block; vertical-align:top; list-style-type:none; padding:1%; margin:1%;line-height:3em;}

#flexisite { clear:both; margin-top:30px; font-size:0.8em; font-family: 'Arial', sans-serif; }

/* formulaires */
fieldset { border-radius:5px; background-color:#eee; margin:auto; width:90%; margin-top:12px; }
legend { font-weight:bold; }

form input[type=submit] { border-radius:5px; margin:auto; margin-top:15px; background-color:#eee; }
form input[type=submit]:hover { inset; background-color:#fb9f3e; border-color: #fb9f3e; }

form#form_mail label { display: inline; width:15rem; }
form#form_mail label[type=radio] { background-color:#fb9f3e; }
form#form_mail textarea { width:95%; border-radius:5px; background-color:#FAFAFA; } 
form#form_mail input { width:95%; border-radius:5px; background-color:#FAFAFA; display:inline; }
/*form#form_mail input[type=text] { width: 60%; border-radius:10px}
form#form_mail input[type=tel] { width: 60%; border-radius:10px}
form#form_mail input[type=email] { width: 60%; border-radius:10px;}*/
form#form_mail input[type=date] { width:35%; }
form#form_mail input[type=radio] { width:auto; border-color:#fb9f3e; }
form#form_mail input[type=checkbox] { width:auto; }
form#form_mail input[type=checkbox]:hover { border-color:#fb9f3e; color:#fb9f3e}

form#form_mail textarea:focus, textarea:hover { color:#000; background-color:lightyellow; border-color:#fb9f3e; } 
form#form_mail input:hover, input:hover { color:#000; background-color:lightyellow; border-color:#fb9f3e;}
form#form_mail input[type=submit] { width:40%; margin:auto; margin-top:15px; }

/** sharing bouton **/
#share-buttons { text-align:left; }
#share-buttons img { width:32px; padding:2px; border:0; display:inline; }

/** ------------------------------------------- **/
/** pour les petits �crans quelques adaptations **/
/** ------------------------------------------- **/

@media screen and (max-width: 650px) {
	.hidden { display:none; }
	#logo { width:120px;}
	
	h1 { font-size:1rem; clear:both }
	h2 { font-size:1.2rem; clear:both }
	h3 { font-size:1.1rem; }
	body { font-size:0.9em; }
	#menu { width:100%; }
	#menu li { padding:1.5%; }

	li.bouton_menu { width: 95px; }
	.footer { width:100%; vertical-align:top; padding:1% }
	#bloc_adr { width:90%; clear:both; margin:5%;}
	#bloc_liens { width:90%; }
	#content, #bloc_100, #bloc_A, #bloc_B, #bloc_AB { width:100%; margin:0%; padding: 0%; }
	#bloc_A, #bloc_B { width:95%; margin:1%; padding: 1%; }
	#col_2 { display:none; }
	#col_1b { margin:0; width:100% }
	img { max-width: 100%; margin:auto }
	.style_1, .style_2, .style_3 { width:48%; margin:1%; padding:0%; }

	.bloc_right, .bloc_left, .bloc_all { clear:both; width:100%; max-height:none; float: none; margin: 0;}
	.bloc_left img, .bloc_right img { clear:both; float:none; width:98%; height:250px; margin:1% }
	/*.img_L, .img_A,	.img_R, */
	/*	.bloc_all img {clear:both; width:100%; max-height:auto; float: initial;display: block;}  height:360px; height:720px;height:360px;	*/
	
	.bloc_text_R, .bloc_text_L,	.bloc_text_A {clear:both; width:94%; padding:1%; margin:2%; float:none; }
	.img_A {  width:100%; height: 360px; overflow:hidden; }
	.img_A img { width:100%; vertical-align:top; }
	/*.img_L { width:100%; height: 360px; float:left;}
	.img_L img { width: 100%;}*/

	.style_M2 h3 { clear:both; }
	.style_M2 img { width: 100%;}
	.style_M { width:48%}

	#bloc_1 { height:250px; }
	#bloc_4, #bloc_5, #bloc_6, #bloc_7 {clear:both; float:none; background-repeat:no-repeat; overflow:hidden; background-position: center top; background-size: 100% auto}

	#bloc_3 { height: 220px; }

}

/** ------------------------------------------- **/
@media screen and (max-width: 400px) {
	#logo { width:90px;}
	#bloc_lg img {width:24px;}	
	#bloc_titre { font-size:2em }
	#lien_bloc1, #lien_bloc2 { width: 80%; } 
	/*form#form_mail input[type=date] { width: 40%; }*/
	.style_1, .style_2, .style_3 { width:48%; margin:1%; padding:0%; }
	#content, #bloc_100, #bloc_A, #bloc_B, #bloc_AB { width:100%; margin:0%; padding: 0%; }
	#bloc_A, #bloc_B { width:95%; margin:1%; padding:1%; }
}

/*@media screen and (min-width: 400px) {
	#bloc_1, #bloc_2, #bloc_3, #bloc_4, #bloc_5, #bloc_6, #bloc_7 {  margin: 4%;padding:2%;  }
}