﻿#ImageEntrer
	{
	width: 422px;
	height: 299px;
	background: url('../images/entrer2.jpg') no-repeat;
	
}

#francais
{
	background: url('../images/Francaisbutton100-2.jpg') no-repeat;
	width: 371px;
	height: 133px;
	padding: 0px,0,0,0;
	position: absolute ;
	
	
}

#HautEntrer
{
	background: url('../images/Entrerhaut100.jpg') no-repeat;
	width: 794px;
	height: 312px;
	padding: 0px,0,0,0;
		position: absolute ;

}

#Anglais
{
	background: url('../images/englishButton100-2.jpg') no-repeat;
	width: 145px;
	height: 133px;
	padding: 0px,0,0,0;
		position: absolute ;
	
}

#Espagnol
{
	 background: url('../images/espagnolButton100.jpg') no-repeat;
	 width:	284px;
	 height:133px;
	 	 padding: 0px,0,0,0;
	 	 	position: absolute ;
}

.glossymenu{
list-style-type: none;
margin: 5px 0;
padding: 0;
width: 170px;
border: 1px solid #9A9A9A;
border-bottom-width: 0;
}

.glossymenu li a{
background: white url(../images/glossyback-2.gif) repeat-x bottom left;
font: bold 13px "Lucida Grande", "Trebuchet MS", Verdana, Helvetica, sans-serif;
color: white;
display: block;
width: auto;
padding: 3px 0;
padding-left: 10px;
text-decoration: none;

}


* html .glossymenu li a{ /*IE only. Actual menu width minus left padding of A element (10px) */
width: 160px;
}

.glossymenu li a:visited, .glossymenu li a:active{
color: white;
}

.glossymenu li a:hover{
background-image: url(../images/glossyback-1.gif);
}


#chromemenu{
width: 100%;
font-weight: bold;
font-size: 90%;
margin:0,0,0,0;
}
#chromemenuBas{
width: 100%;
font-weight: bold;
font-size: 90%;
margin:0,0,0,0;
}


#chromemenu:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

#chromemenu ul{
border: 1px solid #BBB;
width: 100%;
background: url(../images/chromebg.gif) center center repeat-x;
padding: 5px 0;
margin: 0;
text-align: right; /*set value to "right" for example to align menu to the left of page*/
}

#chromemenu ul li{
display: inline;
}

#chromemenu ul li a{
color: #494949;
padding: 5px;
margin: 0;
text-decoration: none;
border-right: 0px solid #DADADA;
}

#chromemenu ul li a:hover{
background: url(../images/chromebg2.gif) center center repeat-x;
}


#chromemenuBas:after{ /*Add margin between menu and rest of content in Firefox*/
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

#chromemenuBas ul{
border: 1px solid #BBB;
width: 100%;
background: url(../images/chromebg.gif) center center repeat-x;
padding: 0px 0;
margin: 0;
text-align: center; /*set value to "right" for example to align menu to the left of page*/
}

#chromemenuBas ul li{
display: inline;
}

#chromemenuBas ul li a{
color: #494949;
padding: 5px;
margin: 0;
text-decoration: none;
border-right: 0px solid #DADADA;
}

#backGroundBlanBleu
	{
	background: url('../images/backGroundBlanBleu.jpg');
	width:100%;
	height:100%;
}
#trameGauche
{
	background: url('../images/trameGauche.jpg') repeat-y;
	
}


/*********************************************************************/
/* PARTI QUI SERT E METTRE UNE IMAGE DANS UN CARRÉ AVEC UNE OMBRE */
/*********************************************************************/

.shiftcontainer{
position: relative;
left: 5px; /*Number should match -left shadow depth below*/
top: 5px; /*Number should match -top shadow depth below*/
}

.shadowcontainer{

background-color: #d1cfd0;
}

.shadowcontainer .innerdiv{
/* Add container height here if desired */
background-color: white;
border: 1px solid gray;
padding: 6px;
position: relative;
left: -5px; /*shadow depth*/
top: -5px; /*shadow depth*/
}



/*********************************************************************/
/* PARTI QUI SERT A FAIRE LA GALERIE D'IMAGE
/*********************************************************************/


.gallerycontainer{
position: relative;
/*Add a height attribute and set to largest image's height to prevent overlaying*/
}

.thumbnail img{
border: 1px solid white;
margin: 0 5px 5px 0;
}

.thumbnail:hover{
background-color: transparent;
}

.thumbnail:hover img{
border: 1px solid blue;
}

.thumbnail span{ /*CSS for enlarged image*/
position: absolute;
background-color: #CCFFCC;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS for enlarged image*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS for enlarged image*/
visibility: visible;
top: 0;
left: 200px; /*position where enlarged image should offset horizontally */
z-index: 50;
}

.texte {
	font-family: "Californian FB";
}

.titre {
	font-family: "Californian FB";
	font-size: large;
	font-weight:bold;
}
