/*
 * Feuille de style pour Orpheus
 */

/********* Constantes ***********/
:root
{	/* Couleurs */
	--blanc: #ffffff;	/* fcfcfc */
	--noir: #000000;
	--gris_fonce: #4d4d4d;
	--gris_clair: #dddddd;
	--or: #be9149;		/* dda700, bf924a */
	--or_clair: #dec8a4;
	--bleu: #004560;
	--bleu_clair: #72a4c4;
	
	/* Textes */
	--titre_taille: 30px;
	--titre_info_taille: 25px;
	--texte_taille: 19px;
	--texte_taille_pt: 16px;
	--inter_texte: 25px;
	--pt_texte: 14px;
	
	/* Espaces */
	--petit_espace: 20px;
	--grand_espace: 40px;
}

/********************
 * Fonts
 * https://fr.fontsloader.com/types
 **********************/

@font-face
{	font-family: 'Goudy Oldstyle Std';
  src: url('GoudyStd-Italic.eot');
  src: local('Goudy Oldstyle Std Italic'), local('GoudyStd-Italic'),
    url('./GoudyOldStyle/GoudyStd-Italic.eot?#iefix') format('embedded-opentype'),
    url('./GoudyOldStyle/GoudyStd-Italic.woff2') format('woff2'),
    url('./GoudyOldStyle/GoudyStd-Italic.woff') format('woff'),
    url('./GoudyOldStyle/GoudyStd-Italic.ttf') format('truetype');
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face
{	font-family: 'Goudy Oldstyle Std';
  src: url('GoudyStd-BoldItalic.eot');
  src: local('Goudy Oldstyle Std BoldItalic'), local('GoudyStd-Italic'),
    url('./GoudyOldStyle/GoudyStd-BoldItalic.eot?#iefix') format('embedded-opentype'),
    url('./GoudyOldStyle/GoudyStd-BoldItalic.woff2') format('woff2'),
    url('./GoudyOldStyle/GoudyStd-BoldItalic.woff') format('woff'),
    url('./GoudyOldStyle/GoudyStd-BoldItalic.ttf') format('truetype');
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}


 
/********* Patch ***********/

body
{	font-family: verdana, arial, helvetica, sans-serif;
	font-size: var(--texte_taille);
	line-height: var(--inter_texte);
	color: var(--bleu);
	margin: 0;
	padding: 0;
	background-color: var(--blanc);
}
@media only screen and (max-width:800px)
{	body
	{	font-size: var(--texte_taille_pt);
	}
}

img
{	border: 0;
	padding: 0;
}

img.responsive
{	display: block;
	max-width: 100%;
	height: auto;
}


/* Corr. bug Explorer */
form
{	margin: 0;
	padding: 0;
}

h1, h2, h3
{	font-weight: unset;
	font-size: unset;
	margin: 0;
}

/************ Liens *************/

a, a:link, a:visited
{	background-color: inherit;
	color: var(--or);
	text-decoration: none;
}

a:hover, a:active
{	text-decoration: none;
	opacity: 80%;
}

/************ float ***********/
.float_gauche
{	float: left;
}

.clear
{	clear: both;
}

/********* Outils ***********/
.gras
{	font-weight: bold;
}
.italic
{	font-style: italic;
}
.or
{	color: var(--or);
}
.bleu
{	color: var(--bleu);
}
.blanc
{	color: var(--blanc);
}
.gris_clair
{	color: var(--gris_clair);
}

/*****************************
 * Le bloc du haut, fixe 
 *****************************/
#cont_haut_de_page
{	position: sticky;
  top: 0;
	z-index: 50;
	width: 100%;
	background-color: var(--blanc);
}

#haut_de_page
{	position: relative;
	max-width: 1260px;	
	margin: 0 auto 0 auto;
	padding: 5px 20px 0 20px;
	height: 180px;
	color: var(--or);
/*	border-bottom: 1px solid var(--or);*/
}

#image_logo
{	width: 450px;
}

#bloc_contact
{	position: absolute;
	top: 40px;
	right: 20px;
	font-size: var(--texte_taille_pt);;
	line-height: 20px;;

}

.picto_pt
{	display: none;
}

#cont_haut_de_page_pt
{	visibility: hidden;
	height: 0px;
}

#cont_logo_orpheus_pt
{
/*
	text-align: center;
	padding: 0 50px 0 50px;
*/
}

.logo_orpheus_pt
{	height: 30px;
}
@media only screen and (max-width:450px)		/* Pb */
{	.logo_orpheus_pt
	{	height: 25px;
	}
}

@media only screen and (max-width:800px)
{	#cont_haut_de_page
	{	position: relative;
	}
	
	#haut_de_page
	{	padding: 5px 10px 0 10px;
		padding-bottom: 10px;
		height: 120px;
		border-bottom: 0;
	}
	
	#cont_haut_de_page_pt
	{	position: sticky;
		z-index: 60;
		background-color: var(--blanc);
  	top: 0;
		width: 100%;
		height: 0px;
		text-align: center;
	}
	
	#logo_haut
	{	height: 0;
		/*position: absolute;*/
		text-align: center;
	}

	#image_logo
	{	width: 90%;
		max-width: 420px;
	}

	#bloc_haut_droite
	{	visibility: hidden;
	}

	#bloc_contact
	{	visibility: hidden;
	}
		
	.picto_pt	
	{	display: block;
		position: absolute;
	}
	.picto_pt:hover
	{	opacity: 50%;
	}
	
	.menu_pt
	{	top: 10px;
		left: 10px;
	}
	#croix_pt
	{	top: 10px;
		left: 10px;
	}

	#drapeaux
	{	top: 10px;
		right: 10px;
	}
	.mail_pt
	{	top: 10px;
		right: 50px;
	}
	.tel_pt
	{	top: 10px;
		right: 15px;
	}
	
	.image_picto_pt
	{	width: 22px;
	}

}		/* Fin de ecran < 800 */

@media only screen and (max-width:520px)
{	#haut_de_page
	{	height: 22vw;
	}
}		/* Fin de ecran < 520, hauteur du haut */




/******************************************************************
 *
 * Menu du haut 
 *
 ******************************************************************/

#menu_haut-cont
{	clear: both;
	max-width: 1260px;
}

.menu_haut
{	font-family: verdana, arial, helvetica, sans-serif;
	font-size: 16px;
	line-height: 18px;
	margin: 0;
	padding: 0;
}

	.menu_haut .item_menu
	{	float: left;
		box-sizing: border-box;
		text-align: center;
		border-top: 3px solid var(--blanc);
		padding-top: 15px;
	}
	.menu_haut .item_menu a
	{	text-decoration: none;
		color: var(--bleu);
		padding: 5px 15px 0px 15px;
	}
	.menu_haut .item_menu a:hover
	{	color: var(--or);
		border-top: 3px solid var(--or);
	}
	
	#menu_haut-banner
	{	visibility: hidden;
		display: none;
		height: 0;
	}
	
	.menu_haut .les_langues
	{	float: left;
		margin: 18px 15px 0px 0;		/* filet : 3px */
	}
	.les_langues .une_langue
	{	float: left;
		padding-right: 10px;
	}
	.les_langues .une_langue a
	{	text-decoration: none;
		color: var(--bleu);
	}
	.les_langues .une_langue a:hover
	{	color: var(--or);
	}	
	
@media only screen and (max-width:800px)
{	#menu_haut-cont
	{	visibility: hidden;
		height: 0;
		padding: 0;
	}
		
	#menu_haut-banner
	{	position: fixed;
		display: block;
		visibility: hidden;
		width:100%;
/*		height:100%;*/
		background-color: var(--blanc);
		left: 0;
		top: 0;
		z-index: 100;
		text-align:center;
		border-bottom: 1px solid var(--or);
	}
	
	#menu_haut-banner .langue_pt
	{	height: 55px;
		background-color: var(--blanc);
		Text-align: right;
		padding-right: 15px;
	}
	#menu_haut-banner .langue_pt a
	{	text-decoration: none;
		color: var(--bleu);
	}
	#menu_haut-banner .langue_pt a:hover
	{	color: var(--or);
	}

	#menu_haut-banner .item_pt
	{	width: 100%;
		height: 35px;
		border-top: 1px solid var(--or);
		padding-top: 10px;
		background-color: var(--blanc);
		opacity: 100%;
	}
	#menu_haut-banner .item_pt a
	{ color: var(--bleu);
		text-decoration: none;
	}
	
	#menu_haut-banner .item_pt a:hover
	{	color: var(--or);
	}
	
}		/* Fin de ecran < 800 */


/************************* Appel et fenetre Search *************************/


#loupe_menu
{	/*position: fixed;
	display: block;
	left: 0px;
	top: 220px;
	width: 22px;
	height: 22px;*/
	float: left;
	margin-top: 16px;
	background-color: transparent;
/*	background-color: var(--blanc);
	opacity: 30%;*/
}

#loupe_menu:hover,
#loupe_menu_pt_1:hover,
#loupe_menu_pt_2:hover
{	background-color: var(--gris_clair);
}

#loupe_menu_pt_1
{	visibility: hidden;
	height: 0;
}
.loupe_image
{	margin: 2px;
	width: 20px;
}

#menu_search
{	visibility: hidden;
	position: fixed;
	display: block;
	left: 148px;
	top: 139px; 
	width: 250px;
	z-index: 100;
	background-color: var(--blanc);
	opacity: 100%;
	border: 1px solid var(--bleu);
/*
	border-top-right-radius: 5px;
	border-bottom-right-radius: 5px;
	border-bottom-left-radius: 5px;
*/
	padding: 10px;
	font-family: verdana, arial, helvetica, sans-serif;
	font-size: var(--texte_taille);
	line-height: var(--inter_texte);
	color: var(--bleu);
	text-align: left;
}

#menu_search table
{	border-spacing: 0 5px;
}

@media only screen and (max-width:800px)
{	#loupe_menu_pt_1,
	#loupe_menu_pt_2
	{	position: absolute;
		top: 7px;
		left: 45px;
		height: 30px;
		margin-top: 0;
	}
	#loupe_menu_pt_1
	{	visibility: visible;
	}
	#loupe_menu_pt_2
	{	visibility: hidden;
	}
	#menu_search
	{	top: 5px;
		left: 85px;
	}
	.loupe_image
	{	width: 22px;
	}
}

/*Le formulaires */

.input_search,
.popup_search,
.bouton_search
{	height: 30px;
	border: 1px solid var(--bleu);
	color: var(--bleu);
	font-size: var(--texte_taille_pt);
}

.input_search
{	width: 97%;
	border-radius: 0px;
}

.popup_search
{	width: 100%;
	border-radius: 0px;
}

.bouton_search
{	margin-top: 20px;
	background-color: var(--gris_clair);
	text-decoration: none;
	width: 100%;
	border-radius: 5px;
}

.bouton_search:hover
{	background-color: var(--bleu);
  transition-duration: 0.4s;
	color: var(--blanc);
}



/******************************************************************
 *
 * Image du haut
 *
 ******************************************************************/

#bloc_image_haut
{	
}

#image_haut
{ width: 100%;
	max-height: 900px;
}

@media only screen and (max-width:520px)
{	#image_haut
	{	margin-top: -10vw;
	}
}


/************** Titre dans l'image ***************/

#headline
{	position: relative;
	bottom: 2vw;
	width: 100%;
	height: 5vw;
	background-color: var(--or);

}
.headline_text,			/* dans un h1 */
.headline_text a
{	font-size: 8vw;
	font-family: "Goudy Oldstyle Std", times, "times new roman", serif;
	font-style: italic;
	color: var(--blanc);
	text-align: center;
	line-height:3vw;
}

/******************************************************************
 *
 * Suite de la page
 *
 ******************************************************************/

#contenu_suite
{	margin: 0 auto 0 auto;
	width: 100%;
	max-width: 1300px;
}

.intro
{	margin: var(--petit_espace) var(--petit_espace) 0 var(--petit_espace);
	text-align: justify;
	color: var(--bleu);
	clear: both;
/*	column-count: 2;
	column-gap: 6%;*/
	hyphens: auto;
}

@media screen and (max-width: 600px)
{	.intro
	{	text-align: left;
		column-count: 1;
		hyphens: auto;
	}
}

.intro_titre,			/* Dans un h2 */
.garde_titre_categorie
{	font-family: "Goudy Oldstyle Std", times, "times new roman", serif;
	font-style: italic;
	font-size: 4vw;
	line-height: 4vw;
	padding: 1vw 0 2vw 0;
	color: var(--bleu);
	text-align: center;
}

.titre_alphabet
{	margin: var(--petit_espace) var(--petit_espace) 0 var(--petit_espace);
	padding-bottom: 10px;;
	clear: both;
	background-color: var(--blanc);
	position: sticky;
	top: 175px;
	z-index: 40;
}

@media screen and (min-width: 1300px)
{	.intro_titre
	{	font-size: 52px;
		line-height: 55px;
		padding: 13px 0 13px 0;
	}
}

@media only screen and (max-width:800px)
{	.intro_titre
	{	padding: 1.5vw 0 0.6vw 0;
		font-size: 7vw;		/* 5.5 */
		line-height: 8vw;
	}
	.garde_titre_categorie
	{	padding: 1.5vw 0 0.6vw 0;
		font-size: 8vw;
		line-height: 10vw;
	}
}

#intro_garde_large		/* texte de une */
{	/*visibility: visible;
	height: 100%;*/
	display: block;
	hyphens: auto;
}
#intro_garde_etroit
{	/*visibility: hidden;
	height: 0px;*/
	display: none;
	hyphens: auto;
}

.col_1
{	column-count: 1;
}
.col_2
{	column-count: 2;
	column-gap: 6%;
}
@media screen and (max-width: 800px)
{	#intro_garde_large		/* texte de une */
	{	/*visibility: hidden;
		height: 0px;*/
		display: none;
	}
	#intro_garde_etroit
	{	/*visibility: visible;
		height: 100%;*/
		display: block;
		text-align: left;
	}
	.col_2
	{	column-count: 1;
	}
	.titre_alphabet
	{	top: 45px;
	}
}

.rhombus,
.rhombus_list
{	width: 1vw;
}
.rhombus
{	padding-bottom : 0.5vw;
}

@media only screen and (max-width:800px)
{	.rhombus,
	.rhombus_list
	{	/*width: 1.5vw;
		padding-bottom : 0.4vw;*/
		width: 10px;
	}
}

/********* Alphabet ***********/

.alphabet,
.alphabet_garde
{	
/*	font-size: var(--texte_taille);*/
	font-family: "Goudy Oldstyle Std", times, "times new roman", serif;
	font-style: italic;
	font-size: 22px;
	text-align: center;
}

.alphabet
{	/*margin: 0 var(--petit_espace) 0 var(--petit_espace);*/
}
/*
.alphabet_garde
{	margin: 0 var(--petit_espace) 10px var(--petit_espace);
}
*/

.scroll
{	scroll-behavior: smooth;
  overflow-y: scroll;
}

a.scroll
{ margin: -220px 0 220px 0;
	display: block; 
}

.home_fleche
{	height: 20px;		/* 40 */
	vertical-align: -2px;		/* -12 */
}



@media only screen and (max-width:800px)
{	.alphabet
	{	font-size: var(--texte_taille_pt);
	}

	.home_fleche
	{	height: 15px;
	}

	a.scroll
	{ margin: -60px 0 60px 0;
	}
}


/********* Le menu des sous parties *********/

.bloc_tabs
{	clear: both;
	max-width: 1260px;
	padding-top: 10px;
	margin: var(--petit_espace) var(--petit_espace) 0 var(--petit_espace);
}
.les_tabs
{	line-height: 24px;
	text-align: center;
	margin: 0 auto;
	padding: 0 0 10px 0;
}
	
a.tab
{	text-decoration: none;
	color: var(--bleu);
}
a.tab:hover
{	color: var(--or);
}

.tab_separateur::before
{	content: '|';
	margin-left: 15px;
	margin-right: 15px;
}

@media only screen and (max-width:800px)
{	.tab_separateur::before
	{ content: '\0A';
		margin: 0;
		display: block;
		line-height: 12px;
	}
}



/**************************************/
/*		 Les flêches de navigation 			*/
/**************************************/


#hl_fleche_gauche,
#bl_fleche_gauche
{ float: left;
	width: 5%;
}
#hl_fleche_droite,
#bl_fleche_droite
{ float: right;
	width: 5%;
}
@media only screen and (max-width:600px)		/* Garantir la place des flèches */
{	#hl_fleche_gauche,
	#hl_fleche_droite
	{	width: 10%;
	}
	
	.img_fleche
	{	width: 40px;
	}
}

#hl_fleche_droite_pt,
#bl_fleche_droite_pt
{	display: none;
}


#hl_fleche_gauche a,
#hl_fleche_droite a,
#hl_fleche_droite_pt a,
#bl_fleche_gauche a,
#bl_fleche_droite a,
#bl_fleche_droite_pt a
{	padding-top: 20px;
}
#hl_fleche_gauche a:hover,
#hl_fleche_droite a:hover,
#hl_fleche_droite_pt a:hover,
#bl_fleche_gauche a:hover,
#bl_fleche_droite a:hover,
#bl_fleche_droite a:hover
{	width: 5%;
	opacity: .5;
}


#hl_texte,
#bl_texte
{	width: 90%;
	float: left;
	text-align: center;
}

#hl_texte a,
#bl_texte a
{	text-decoration: none;
}
#bl_texte a
{	
}

#hl_texte a:hover,
#bl_texte a:hover
{	text-decoration: none;
	opacity: .5;
}


/********* boites ***********/

.bloc_boites
{	margin: 0;
}

.boite_ligne
{	clear: both;
	margin: var(--grand_espace) var(--petit_espace) 0 var(--petit_espace);
}

.boite_gauche,
.boite_droite,
.boite_centre		/* Seule sur une ligne */
{	width: 47%;
	margin-bottom: 20px;
}

.boite_gauche
{ float: left;
}

.boite_droite
{	margin-left: 53%;
}

.boite_centre
{	margin-left: auto;
	margin-right: auto;
}

.boite_image
{	width: 100%;
	height: 100%;
}

.boite_fleche
{	width: 4%;
	margin-left: 1%;
	float: left;
	display: block;
/*
	position: relative;
	top: 270px;
*/
}
.image_boite_fleche
{	float: left;
	margin: 0 auto 0 auto;
	width: 40px;
}

.boite_titre
{	height: 32px;
	margin: -7px 0 20px 0;
	background-color: var(--or);
	padding-bottom: 3px;
}
.boite_titre_texte		/* dans un h3 */
{	text-align: right;
	padding-right: 5px;
	font-family: "Goudy Oldstyle Std";
	font-style: italic;
	font-size: 48px;
	color: var(--blanc);
}

.boite_texte,
.boite_texte a
{	text-align: justify;
	color: var(--bleu);
	hyphens: auto;
}
.boite_texte a:hover
{	color: var(--gris_clair);
}


@media only screen and (max-width:800px)
{	.bloc_boites
	{	margin: 0px 10px 0 10px;
	}
	
	.boite_ligne
	{	margin: 0px 10px 0 10px;
	}
	
	.boite_gauche,
	.boite_droite,
	.boite_centre
	{	width: 100%;
		margin-top: var(--petit_espace);
	}

	.boite_gauche
	{ float: none;
	}
	.boite_droite
	{	margin-left: 0;
	}
	
	.boite_texte
	{	text-align: left;
	}
	

	.boite_fleche
	{	width: 0;
		height: 0;
		visibility: hidden;
		display: none;
	}
	
}		/* Fin de ecran < 800 */

@media only screen and (max-width:550px)
{	.boite_titre_texte.etroit
	{	transform: scale(1, 1.3);		/* 48/37 = 1,3 */
		font-size: 37px;
	}
}		/* Fin de ecran < 550 */


/************************************
 *
 * Bas de page
 *
 ************************************/
 
#bas_de_page-cont
{	margin: var(--grand_espace) auto var(--petit_espace) auto;
	width: 100%;
	max-width: 1300px;
	clear: both;
}

#bas_de_page
{	margin: 0 var(--petit_espace) 0 var(--petit_espace);
	text-align: center;
	font-size: var(--texte_taille_pt);
}

#bdp_adresse
{	/* border-top: 1px solid var(--bleu); */
	padding-top: var(--petit_espace);
}
#bdp_adresse a,
#bdp_adresse a:link
{	color: var(--bleu);
}



@media only screen and (max-width:800px)
{	#bas_de_page
	{	margin:  10px 10px 0 10px;
	}
}


/************************************
 * Menu du bas
 ************************************/

#menu_bas-cont
{	clear: both;
	max-width: 1260px;
	padding-top: 10px;
}
.menu_bas
{	line-height: 24px;
	margin: 0;
	padding: 0 0 10px 0;
}
	
	a.item_menu_bas
	{	text-decoration: none;
		color: var(--bleu);
/*		padding: 0px 15px 0px 15px;*/
	}
	a.item_menu_bas:hover
	{	color: var(--or);
	}
	
	.item_menu_bas_separateur::before
	{	content: '|';
		margin-left: 15px;
		margin-right: 15px;
	}


#copyright
{	clear: both;
	padding-top: 15px;
	text-align: center;
	color: var(--or);
	font-size: var(--pt_texte);
}

@media only screen and (max-width:800px)
{	.item_menu_bas_separateur::before
	{ /*content: '\0A \A0';	*/	/* RC + espace */
		content: '\0A';
		margin: 0;
		display: block;
		line-height: 12px;
	}
}

/************************************************************************
 *
 * Page d'une destination
 *
 ************************************************************************/


#cont_blocs_sejours
{	width: 100%;
	max-width: 1300px;
	margin-top: var(--petit_espace);
}
#blocs_sejours
{	margin: 0 var(--petit_espace) 0 var(--petit_espace);
}

@media only screen and (max-width:800px)
{	#blocs_sejours
	{	margin: 0 10px 0 10px;
	}

}

.un_bloc_sejour
{	margin-bottom: var(--petit_espace);
	border-top: 1px solid var(--bleu);
	padding-top: var(--petit_espace);
	color: var(--bleu);
}
.un_bloc_sejour a,
.un_bloc_sejour a:link
{	color: var(--bleu);
}
.un_bloc_sejour a:hover
{	color: var(--or);
}


.nom_sejour
{	font-family: "Goudy Oldstyle Std", times, "times new roman", serif;
	font-style: italic;
	font-weight: bold;
	font-size: var(--titre_info_taille);
	margin: 0;
}
.date_sejour
{	font-size: var(--texte_taille);
	font-weight: bold;
	word-wrap: break-word;
	hyphens: manual;
/*	
	overflow: hidden
	word-wrap: break-all;
	overflow-wrap: break-word;
	hyphens: auto;
*/
}



/************************************************************************
 *
 * Page d'un sejour
 * Même headline que destination
 *
 ************************************************************************/
 
.detail_sejour
{	color: var(--bleu);
	text-align: center;
}
.detail_sejour_titre
{	float: left;
	width: 90%;
}
@media only screen and (max-width:600px)		/* Laisser de la place aux flèches */
{	.detail_sejour_titre
	{	width: 80%;
	}
}

.un_spectacle
{	margin-top: 10px;
}
.un_spectacle a:link,
.un_spectacle a
{	color: var(--bleu);
}
.un_spectacle a:hover
{	color: var(--or);
}

.nom_spectacle
{	color: var(--or);
	font-weight: bold;
}

.img_harp
{	height: 20px;
}

.sous_titre
{	clear: both;
	margin-top: var(--grand_espace);
	color: var(--or);
	font-weight: bold;
}

.hotel_bloc
{	clear: both;
	padding-top: var(--petit_espace);
}

.hotel_photo
{	float: left;
	width: 37%;
	max-width: 445px;
	max-height: 297px;
}
.hotel_photo:hover
{	opacity: 90%;
}

.photo_hotel
{	width: 100%;
	height: 100%;
}
.photo_cachee
{	visibility: hidden;
	display: none;
}

.hotel_texte
{	float: left;
	width: 58%;
	max-width: 775px;
	margin-left: 5%;
	color: var(--bleu);
}

.nom_hotel
{	font-weight: bold;
}

.texte_hotel
{	text-align: justify;	
}

@media only screen and (max-width:800px)
{	.detail_sejour
	{	float: none;
		width: auto;
	}
	.hotel_photo
	{	float: none;
		width: 100%;
		height: 100%;
		margin: 0 auto 0 auto;
	}
	.hotel_texte
	{	margin-left: 0;
		margin-top: 10px;
		float: none;
		width: 100%;
		text-align: left;
	}
	.texte_hotel
	{	text-align: left;	
	}

	.nom_hotel
	{	padding-right: 5px;
	}
}

.fleche_hotel_cont
{	position: relative;
	top: -160px;
	left: 90%;
	height: 0px;
}

.fleche_hotel
{	height: 50px;
	pointer-events: none;		/* inactive */
}

.prix
{	float: left;
	margin-bottom: var(--petit_espace);
	max-width: 800px;
}

.nom_hotel_prix
{	clear: both;
	float: left;
	width: 300px;
}

.prix_hotel
{	float: left;
	width: 130px;
	text-align: right;
	padding-left: var(--petit_espace);
}

.titre_prix_sup
{	text-align: right;
}

.prix_sup
{	float: right;
	width: 130px;
	text-align: right;
	padding-left: var(--grand_espace);
}

@media only screen and (max-width:800px)
{	.prix
	{	float: none;
		margin: 0 auto var(--petit_espace) auto;
		width: 70%;
		max-width: 600px;
	}
	.nom_hotel_prix
	{	float: none;
	}
	.prix_hotel,
	.prix_sup
	{	padding-left: 0;
	}
}
@media only screen and (max-width:600px)
{	.prix
	{	width: 100%;
	}
}

.conditions_cont
{	float: right;
	width: 30%;
	min-width: 280px;
	margin-top: var(--grand_espace);
	margin-right: var(--grand_espace);
}

.conditions
{	width: 100%;
	border: 1px solid var(--or);
	color: var(--bleu);
	overflow-wrap: break-word;
	hyphens: auto;
	padding: 10px 10px 10px 28px;
}
/*
.conditions .sous_titre
{	margin-top: 0;
	text-indent: -18px;
}
*/
.cond_item
{	margin-top: 0;
	text-indent: -18px;
}

.bouton_cont
{	text-align: center;
}

@media only screen and (max-width:1000px)
{	.conditions_cont
	{	clear: both;
		float: none;
		width: 100%;
	}
	.conditions
	{	margin: var(--petit_espace) auto var(--petit_espace) auto;
		width: 70%;
		min-width: 280px;
	}
}

/************************************************************************
 * Les colonnes
 ************************************************************************/

/************ 3 colonnes ************/

@media only screen and (min-width:1001px)
{	div.colonne_2_1,
	div.colonne_2_2
	{	
	}

	div.colonne_3_1,
	div.colonne_3_2,
	div.colonne_3_3
	{	float: left;
		width: 30%; 
	}

	div.colonne_3_1
	{	clear: both;
	}

	div.colonne_3_2,
	div.colonne_3_3
	{	 margin-left: 5%;
	}
}		/* fin de écran supérieur à 1000 px */

/************ 2 colonnes ************/

@media only screen and (max-width:1000px)
{	div.colonne_3_1,
	div.colonne_3_2,
	div.colonne_3_3
	{
	}
	
	div.colonne_2_1,
	div.colonne_2_2
	{	float: left;
		width: 48%;
	}

	div.colonne_2_1
	{	clear: both;
	}

	div.colonne_2_2
	{	margin-left: 4%;
	}
}		/* fin de écran inferieur à 1000 px */

/************ 1 colonne ************/

@media only screen and (max-width:710px)
{	div.colonne_2_1,
	div.colonne_2_2
	{	width: 100%;
	}
	
	div.colonne_2_2
	{	margin-left: 0;
	}
}		/* fin de écran inferieur à 710 px */


/************************************************************************
 * Les items des formulaires
 ************************************************************************/


#le_formulaire
{ max-width: 700px;
	margin: var(--petit_espace) auto 0 auto;
}

@media only screen and (max-width:710px)
{	#le_formulaire
	{	margin: var(--petit_espace) 10px 0 10px;
	}
}


.asterisque
{	font-weight: bold;
}
.asterisque:after
{	content: " *";
}

.form_ligne
{	padding-top: 10px;
	clear: both;
}
.form_col_gauche
{	width : 33%;
	float: left;
}
.form_col_droite
{	Float: right;
	width: 67%;
}

.input
{	font-size: var(--texte_taille);
	border: var(--bleu) 1px solid;
	width: 75%;
}

.popup
{	font-size: var(--texte_taille);
	width: 77%;
	border-radius: 0px;
	border: var(--bleu) 1px solid;
	background-color: var(--blanc);
}

.bouton
{	margin: 0 auto 0 auto;
	padding: 2px 35px 2px 35px;
	height: 30px;
	border: var(--bleu) 1px solid;
	border-radius: 3px;
  transition-duration: 0.4s;
	background-color: var(--blanc);
	font-size: var(--texte_taille);
	font-weight: bold;
	color: var(--bleu);
	text-decoration: none;
	cursor: pointer;
}

.bouton:hover,
.bouton:active
{	background-color: var(--or);
	color: var(--blanc);
	text-decoration: none;
}

/*****************************************
 * Liste des contacts chez Euridice
 *****************************************/

#les_contacts
{ max-width: 1300px;
	margin: var(--petit_espace) auto 0 auto;
	color: var(--bleu);
}

.un_contact
{	clear: both;
	padding-top: var(--grand_espace);
/*	min-height: 297px;		// Si photo seulement */
}

.un_contact .photo
{	float: left;
	padding-right: var(--petit_espace);
}

.un_contact .texte
{	line-height: var(--inter_texte);
}

@media only screen and (max-width:800px)
{	#les_contacts
	{	margin: var(--petit_espace) 10px 0 10px;
	}
	.un_contact .photo
	{	float: none;
		padding-right: 0;
	}
}


/*****************************************
 * Brochure
 *****************************************/

.brochure
{	margin: 0 auto 0 auto;
	width: 100%;
	text-align: center;
	margin-bottom: var(--petit_espace);
}

.brochure_1
{	float: left;
	margin-right: var(--petit_espace);
}

.brochure_image
{	max-width: 100%;
}

.brochure .legende
{ margin-bottom: var(--petit_espace);
}

@media only screen and (max-width:870px)
{	.brochure
	{	margin: 10px;
	}
	.brochure_1
	{	float: none;
	}
	.brochure_2
	{	margin-right: var(--petit_espace);
	}
}

/************************************************************************
 * Dialogue de cookie
 ************************************************************************/

#cookie-banner
{	position:fixed;
	width:100%;
	background-color:#004560;		/* eee */
	color: white;
	margin:0;
	left:0;
	bottom:0;
	padding:4px;
	z-index:1000;
	text-align:center;
}

/********************************************
 * Dialogue modal en css pour la recherche 
*********************************************/

.cModal
{ position: fixed;
  z-index: 99999;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.5);
  opacity:0;
  pointer-events: none;
}
.cModal:target
{ opacity:1;
  pointer-events: auto;
}
.cModal > div
{ max-width: 300px;
/*	max-height: 80%;
	overflow-y: scroll;*/
  position: relative;
  margin: 10% auto;
  border-radius: 2px;
  background: #fff;
}

.modalInterieur
{ margin: 5px;
  padding: 10px;
  border: 1px solid #be9149;
}

.modalBtnFermer
{	padding-top: 10px;
	text-align: center;
}
.modal_croix
{	height: 40px;
}
.modalTexte
{	padding-top: 10px;
	text-align: justify;
	font-weight:normal;
}