body
{
	background: url('images/barre.png') repeat-x top;
	color: black;
	font-family: 'times new roman';
}

#texte_info
{
	position: absolute;
	top: 50px;
	left: 100px;
	width: 660px;
	height: 700px;		
	background-color: rgba(245,245,235,1);
	Text-align: justify;
	overflow: auto;
	padding: 20px;
	box-shadow: 4px 8px 8px #1c1a19;
}

#texte_info p
{
	text-indent: 30px;
}

#text_info h3
{
	font-size: 1.2em;
	font-weight: bold;
}

h4
{
	position: absolute;
	top: 20px;
	left: 25px;
	color: rgba(255,255,200,0.9);
	text-shadow: 2px 2px 4px black;
	font-style: italic;
}

#titre_info h2
{
	position: absolute;
	top: -20px;
	left: 100px;
	width: 700px;
	height: 30px;
	color: rgba(255,255,200,0.9);
	text-shadow: 2px 2px 4px black;	
	text-align: center;
	font-size: 1.8em;

}

#bienvenue
{
	position: relative;
	top: -15px;
	color: rgba(255,255,200,0.9);
	text-shadow: 2px 2px 4px black;
	text-align: center;
}

#cadre_photos
{
	background-color: white;
	position: absolute;
	top: 100px;	
	left: 291px;	
	width: 317px;
	height: 250px;
	border: 3px red solid;
	border-radius: 10px;
	box-shadow: 4px 5px 8px rgba(0,0,0,1);
}

#img1
{
	position: absolute;
	top: 143px;
	left: 90px;
}

#popup_img1
{
    transition-property: top, left, width, height, background-color, opacity;
    transition-duration: 200ms;
	position: absolute;
	top: 194px;
	left: 141px;
	width: 0px;    /* à cause du padding = 25, sinon width = height*/
	height: 24px;
	border-radius: 20px;
	background-color: rgba(140,100,140,1);
	padding-right: 25px;
	text-align: justify;
	color: rgba(255,255,255,1);
	overflow: hidden;
	z-index: 8;
	opacity: 0;
}

#popup_img1:hover
{
	top: 80px;
	left: 30px;
	width: 300px;
	height: 460px;
	opacity: 1;
	background-color: rgba(140,100,140,1);	
	box-shadow: 4px 8px 8px #1c1a19;
}

#popup_img1_titre
{
	position: absolute;
	top: -15px;
	width: 300px;
	text-align: center;
	color: rgba(240,110,180,0.9);	
    text-shadow: -2px -2px 4px rgba(250,200,250,1), 2px 2px 4px rgba(50,20,50,1);
}

#popup_img1_sous_titre
{
	position: absolute;
	top: 15px;
	width: 300px;
	text-align: center;
    color: rgba(240,110,180,0.9);
}

#popup_img1 ul
{
	position: absolute;
	top: 50px;
	padding-right: 25px;
}

#popup_img1 p
{
	position: absolute;
	top: 330px;
	padding: 20px;
}

#img2
{
	position: absolute;
	top: 143px;
	left: 690px;
}

#popup_img2
{
    transition-property: top, left, width, height, background-color, opacity;
    transition-duration: 200ms;
	position: absolute;
	background-color: rgba(140,100,140,1);
	top: 194px;
	left: 741px;
	width: 0px;
	height: 24px;
	border-radius: 20px;	
	padding-right: 25px;
	text-align: justify;
	color: rgba(255,255,255,1);
	overflow: hidden;
	z-index: 8;
	opacity: 0;
}

#popup_img2:hover
{
	top: 80px;
	left: 540px;
	width: 300px;
	height: 400px;
	opacity: 1;
	background-color: rgba(140,100,140,1);	
	box-shadow: 4px 8px 8px #1c1a19;
	z-index: 8;
}

#popup_img2 div
{
	text-align: center;
}

.pt_interrog
{
	position: absolute;
	top: 50px;
	left: 51px;
	color: rgba(255,255,255,1);
}

.pt_interrog img
{
	width: 25px;
	height: 25px;
}

video
{
	position: absolute;
	top: 400px;	
	left: 112px;
	width: 666px; /*444px;*/
	height: 375px; /*250px;*/
	border: 3px red solid;
	border-radius: 10px;
	box-shadow: 4px 5px 8px #1c1a19;
}


.titre_rubrique
{
	font-weight: bold;
}

pre
{
	font-size: 15px;     /*IE n'affiche pas comme Firefox les tailles exprimées en "em"*/
	font-style: italic;
	overflow: hidden;
}

#resume
{
	font-size: 1.5em;
}

.titre_li
{
	font-size: 1.1em;
	text-decoration: underline;
}

#popup_arrhes
{
    transition-property: width, height, background-color;
    transition-duration: 100ms;
	transition-timing-function: linear;
	position: absolute;
	top: 201px;
	left: 215px;
	width: 20px;
	height: 0px;
	background-color: rgba(240,0,0,0.2);
	padding: 10px;
	overflow: hidden;
}

#popup_arrhes:hover
{
	width: 200px;
	height: 280px;
	background-color: rgba(240,240,240,1);	
	box-shadow: 4px 8px 8px #1c1a19;
}

/*************************************************************************************/
/************************************* PAGE CONTACT **********************************/
/*************************************************************************************/

#francophonie h3
{
	font-size: 20px;
	font-style: italic;
	font-weight: normal;
	text-decoration: blink underline;
	color: orange;
}


/*************************************************************************************/
/************************************* PAGE TARIFS ***********************************/
/*************************************************************************************/

#tableau_tarif
{
	position: absolute;
	top: 50px;
	width: 500px;
	left: 200px;
	border-collapse: collapse;
	border-top: 1px solid white;
	box-shadow: 4px 8px 8px #1c1a19;
}

#tableau_tarif th
{
	font-size: 1.5em;
	background-color: rgba(250,220,100,1);
}

#tableau_tarif td
{
	font-size: 1.3em;
}

caption
{
	color: rgba(255,255,200,0.9);
	text-shadow: 2px 2px 4px black;
	padding: 10px;
}

.colonne_saison
{
	font-size: 1.5em;
	font-weight: bold;
	text-align: left;
	background-color: rgba(250,220,100,1);
	padding: 10px;
}

.ligne_hs
{
	background-color: rgba(250,210,210,1);
}

.ligne_ms
{
	background-color: rgba(250,220,150,1);
}

.ligne_bs
{
	background-color: rgba(170,250,170,1);
}

td, th
{
	height: 40px;
	width: 200px;
	text-align: center;
}

#commentaires_tarif
{
	position: absolute;
	top: 330px;
	left: 100px;
	width: 680px;
	height: 460px;
	overflow: auto;
	text-align: justify;
	margin-right: 10px;
	padding-right: 20px;
	background-color: rgba(245,245,235,1);
	box-shadow: 4px 8px 8px #1c1a19;
}

#commentaires_tarif h3
{
	font-size: 1.2em;
	font-weight: bold;
}