/* CSS Document */



/*------------------------------------------ STRUCTURE : PAGE -----------------------------------*/









html, body {height:100%;margin:0;padding:0;width:100%;font-family: "Trebuchet MS", Arial;

}



body {

	margin: 0; 

    text-align: center; 

	background:  url("Images_Structure/OmbrePage.jpg") repeat-y center; 

	background-color: #004488;

}



#Conteneur {

	position: relative;

	margin-left: auto;

	margin-right: auto;

	width: 980px;

	background-color: #FFFFFF;

	top: 0px;

}



#Banniere {

	width: 100%;

	height: 270px;

	background:  url("Images_Structure/MenuAccueil.jpg") no-repeat ; 

}



div#Contenu {

	position:relative;

	padding: 25px 80px;

}

#Contenu-Plan {

	margin-left:-70px;

	

}


#Bas {

	background:  url("Images_Structure/Bas.jpg") no-repeat bottom; 

	position:relative;

	width: 980px;

	bottom: 0;

	margin-top:60px;

	height:200px;

	padding-top: 20px ;

}



#Bandeau {

	position:relative;

	width: 980px;

	top: 10px;

	line-height:30px;

	margin-bottom:40px; 

	background: url("Images_Structure/BarreBas.png") repeat-y;

	border-top: 1px solid #B4C6CF;

	border-bottom: 1px solid #B4C6CF

}



#Comclick {

	position:relative;

	margin-right:125px;

	margin-left:125px;	

	width: 728px;

	height:105px;

	top: 5px;

	padding: 0;

	background:#FFFFFF;

}

#BoiteInfoAccueil {
	float:right;
	background: #434343;
	margin-left:50px;
	padding-top:20px; 
	padding-bottom:20px; 
	width: 370px; 
	height:auto;
	border-radius: 5px 30px 0 5px;
	 }
	 
#BoiteInfoFacebook {
	float:left;
	width: 500px; 
	height:500px;
	 }

#BoiteInfoHistoire {
	float:right;
	background: #099CEF;
	margin-left:50px;
	padding-top:10px; 
	padding-bottom:20px; 
	width: 480px; 
	height:auto;
	border-radius: 5px 30px 0 5px;
	 }

#BoitePubAcc {
	float:right;
	background: #FFFFFF;
	margin-left:50px;
	padding-top:20px; 
	padding-bottom:20px; 
	width: 350px; 
	height:auto;
	
	 }


#Conteneur {

	position: relative;

	margin-left: auto;

	margin-right: auto;

	width: 980px;

	background-color: #FFFFFF;

	top: 0px;

}


.ChampRecherche {

	border:#0390E1 solid 1px;

}



.Depeche {

	width:800px;

	margin-top:40px;

	margin-bottom:40px;

}	



.BandeauForum {

	line-height:20px;

	margin-top:16px;

	margin-bottom:16px;

}	

.Webcam {

	position: relative;

	height:400px;

	width:800px;

	margin-bottom:30px;

	margin-top:30px;		

}	



.Webcam2 {

	position: relative;

	height:550px;

	width:800px;

	margin-bottom:30px;

	margin-top:30px;		

}	





.WebcamHD {

	position: relative;

	margin-left:-50px;

	height:650px;

	width:900px;

	margin-bottom:100px;

	margin-top:30px;		

}	

.CarteWebcam {

	margin-left:-50px;	
border: 10px solid #FFF;
    box-shadow: 1px 1px 18px #555;

}
	

.WebcamSD {

	position: relative;

	height:600px;

	width:800px;

	margin-bottom:100px;

	margin-top:30px;		

}	



.WebcamAraucaria {

	position: relative;

	height:500px;

	width:900px;

	margin-bottom:100px;

	margin-top:30px;		

}	





#FenetreWebcam {

	position:relative;

	width: 800px;

	height:310px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

	

}



#FenetreWebcamSD {

	position:relative;

	width: 800px;

	height:333px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

}



#FenetreWebcamAraucaria {

	position:relative;

	width: 900px;

	height:430px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

}





#FenetreWebcamBellecote {

	position:relative;

	width: 800px;

	height:255px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

	

}



#FenetreWebcamHD {

	position:relative;

	width: 900px;

	height:550px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

}

#FenetreWebcamHD-Katalys {

	position:relative;

	width: 900px;

	height:600px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

}


#FenetreWebcamHD iframe {

	border:none; }

#FenetreWebcamHD-Katalys iframe {

	border:none; }

#FenetreWebcam2 {

	position:relative;

	width: 800px;

	height:360px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

}



#FenetreWebcam3 {

	position:relative;

	width: 800px;

	height:360px;

	background:#000000;

	overflow:auto;

	overflow-y:hidden; 

	border:10px solid #000000;

}



.Meteo {

	position: relative;

	height:900px;

	width:800px;

	margin-bottom:30px;

	margin-top:30px;		

}	



#Fiche {

	position: relative;

	width:800px;

	height:auto;

	margin-top:150px;	

	border-bottom:1px dotted #9B9A9A;

	padding-top:0px;

	padding-bottom:20px;

}	



.PhotosHier {

	position: relative;

	min-height:150px;

	height:auto;

	margin-top:40px;

	margin-bottom:40px;

	border-left:1px dotted #0888D1;

	padding-left:50px;

	background:  url("Images_Structure/PhotosHier.png") no-repeat top left;

}	





.PhotosAujourdhui {

	position: relative;

	min-height:150px;

	height:auto;

	margin-top:40px;

	margin-bottom:40px;

	border-left:1px dotted #0888D1;

	padding-left:50px;

	background:  url("Images_Structure/PhotosAujourdhui.png") no-repeat top left;

}	



#ContenuCentre {

	text-align:center;

	}

	

.Formulaire	 {

	border:1px dotted #9B9A9A; 

	line-height:30px;

	}



#Bio {

	position: relative;

	width:800px;

	height:200px;

	margin-top:0px;

	padding-top:80px;

	}

#Bio2 {

	position: relative;

	width:800px;

	height:110px;

	margin-top:0px;

	padding-top:80px;

	}

.BioCouverture {

	float: left; 	

	margin-right:20px;

	margin-bottom:2px;

	margin-top:-50px; }




#Xiti {

	visibility: hidden ; 

}





/*------------------------------------------ STRUCTURE : MENU -----------------------------------*/





ul#Menu {

	height:45px;

	margin: 0 ;

	padding: 0 ;

	background:  url("Images_Structure/Menu.png") repeat-x 0 -45px ; 

	list-style-type: none ;

}



ul#Menu li {

	float: left ;

	text-align: center ;

}



ul#Menu li a {

    width:auto;

	padding: 0 16px;

	line-height: 42px ;

	font-size: 13px ;

	color: #fff ;

	display: block ;

	text-decoration: none ;

	border: none; 

}



ul#Menu li a:hover {

	background:  url("Images_Structure/Menu.png") repeat-x 0 0px ;

    font-size: 13px ;

	color: #000000 ;

	text-decoration: none ;

	border: none; 

}



.MenuSecondaire {

	height:45px;

	margin: 0 ;

	padding: 0 ;

	background:  url("Images_Structure/MenuSecondaire.png") repeat-x 0 -45px ; 

	list-style-type: none ;

}



.MenuSecondaire li {

	float: left ;

	text-align: center ;

}



.MenuSecondaire li a {

    width:auto;

	padding: 0 16px;

	line-height: 45px ;

	font-size: 13px ;

	color: #fff ;

	display: block ;

	text-decoration: none ;

	border: none; 

}



.MenuSecondaire li a:hover {

	background:  url("Images_Structure/MenuSecondaire.png") repeat-x 0 0px ;

    font-size: 13px ;

	color: #000000;

	text-decoration: none ;

	border: none; 

}



#MenuPrincipal  {

	position: absolute;

	width:100%;

	height:45px;

	left: 0px;

	top:270px;

	z-index: 2;



     }

	 

#MenuEndirect, #MenuActualites, #MenuDomaine, #MenuPhototheque, #MenuCollections, #MenuApropos {

	visibility: hidden;

	position: absolute;

	width:980px;

	height:45px;

	left: 0px;

	top:42px;

}	 



#MenuActualites .MenuSecondaire { padding-left: 0px;}

#MenuEndirect .MenuSecondaire { padding-left: 100px;}

#MenuDomaine .MenuSecondaire { padding-left: 180px;}

#MenuPhototheque .MenuSecondaire { padding-left: 380px;}

#MenuCollections .MenuSecondaire { padding-left: 470px;}

#MenuApropos .MenuSecondaire { padding-left: 690px;}







#MenuLive, #MenuSkiArea, #MenuPhotos, #MenuCollection, #MenuAbout {

	visibility: hidden;

	position: absolute;

	width:100%;

	height:45px;

	left: 0px;

	top:42px;

}	 






#MenuLive .MenuSecondaire { padding-left: 70px;}

#MenuSkiArea .MenuSecondaire { padding-left: 180px;}

#MenuPhotos .MenuSecondaire { padding-left: 330px;}

#MenuCollection .MenuSecondaire { padding-left: 400px;}

#MenuAbout .MenuSecondaire { padding-left: 616px;}











/*------------------------------------------ STRUCTURE : IMAGES -----------------------------------*/





.ImageGauche {

	float: left; 	

	clear:bottom;

	margin-right:20px;

	margin-bottom:2px;

}



.ImageCentreVerticale {

	text-align: center; 	

	clear:bottom;

	margin-right:110px;

	margin-left:160px;

}



.ImageCentreHorizontale {

	text-align: center; 	

	clear:bottom;

	margin-right:50px;

	margin-left:80px;



}





.ImageDroite {

	float: right; 

	margin-left:20px;

	margin-top:2px;

	margin-bottom:2px;

	margin-right:0px;

	clear:bottom;

}



.ImageGaucheOmbre {
	float: left; 	
	clear:bottom;
	margin-right:40px;
	margin-top:20px;
	margin-bottom:15px;
	border: 10px solid #FFF;
    box-shadow: 1px 1px 18px #555;
}


.ImageDroiteOmbre {
	float: right; 
	margin-left:40px;
	margin-top:20px;
	margin-bottom:15px;
	margin-right:0px;
	clear:bottom;
	border: 10px solid #FFF;
    box-shadow: 1px 1px 18px #555;
}

.ImageOmbre {
	border: 10px solid #FFF;
    box-shadow: 1px 1px 18px #555;
	margin-top:15px;

}




.HistoireImage {

	box-shadow: 2px 2px 13px #999999;
	border: 1px solid #FFFFFF;
}

.HistoireImageFilm {

	float: right; 
	margin-left:20px;
	box-shadow: 2px 2px 13px #999999;
	border: 1px solid #FFFFFF;
}

.HistoireBoiteDroite {

	float: right; 
	align:top;
	margin-left:50px;
	margin-top:30px;
	margin-bottom:10px;
	margin-right:0px;
	clear:bottom;
}


.HistoireBoiteGauche {

	float: left; 
	align:top;
	margin-left:0px;
	margin-top:30px;
	margin-bottom:10px;
	margin-right:50px;
	clear:bottom;
}


.HistoireBoiteCentre {

	float: center; 
	align:top;
	margin-left:0px;
	margin-top:30px;
	margin-bottom:10px;
	margin-right:0px;
	clear:bottom;
}

.FilmBoite {

	float: center; 
	margin-bottom:100px;
	clear:bottom;
}



/*------------------------------------------ TEXTE : TRES GRAND -----------------------------------*/



.XXGrand {font-family: "Trebuchet MS", Arial; font-size: 36px; color: #000000; }



.XGrand {font-family: "Trebuchet MS", Arial; font-size: 28px; color: #000000; }





.XXGrand-Bleu {font-family: "Trebuchet MS", Arial; font-size: 36px; color: #004C97; }



.XGrand-Bleu {font-family: "Trebuchet MS", Arial; font-size: 28px; color: #004C97; }



.XXGrand-Rouge {font-family: "Trebuchet MS", Arial; font-size: 36px; color: #C01D0A; }



.XGrand-Rouge {font-family: "Trebuchet MS", Arial; font-size: 28px; color: #C01D0A; }


.XGrand-BleuClair {font-family: "Trebuchet MS", Arial; font-size: 26px; color: #0888D1; }

.XGrand-BleuClair a:link {	color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.XGrand-BleuClair a:visited {	color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.XGrand-BleuClair a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}


.XGrand-Gras-Orange {font-family: "Trebuchet MS", Arial; font-size: 26px; color: #EE5C04; font-weight: bold; }

.XGrand-Gras-Orange a:link {	color: #EE5C04;	border-bottom: 1px dotted #F06B00; text-decoration: none;}

.XGrand-Gras-Orange a:visited {	color: #EE5C04;	border-bottom: 1px dotted #F06B00; text-decoration: none;}

.XGrand-Gras-Orange a:hover { color: #0888D1; border-bottom: 1px dotted #018AD9; text-decoration: none;}




/*------------------------------------------ TEXTE : GRAND -----------------------------------*/



.Grand-Orange {font-family: "Trebuchet MS", Arial; font-size: 20px; color: #EE5C04; }

.Grand-Orange a:link {	color: #EE5C04;	border-bottom: 1px dotted #F06B00; text-decoration: none;}

.Grand-Orange a:visited {	color: #EE5C04;	border-bottom: 1px dotted #F06B00; text-decoration: none;}

.Grand-Orange a:hover { color: #0888D1; border-bottom: 1px dotted #018AD9; text-decoration: none;}



.Grand-Bleu {font-family: "Trebuchet MS", Arial; font-size: 20px; color: #0888D1; }

.Grand-Bleu a:link {	color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Grand-Bleu a:visited {	color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Grand-Bleu a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}












/*------------------------------------------ TEXTE : MOYEN -----------------------------------*/





.Moyen {font-family: "Trebuchet MS", Arial; font-size: 20px; }

.Moyen a:link {	color: #000000;	border-bottom: 1px dotted #6C6C6C; text-decoration: none;}

.Moyen a:visited {	color: #000000;	border-bottom: 1px dotted #6C6C6C; text-decoration: none;}

.Moyen a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}



.Moyen-Gris {font-family: "Trebuchet MS", Arial; font-size: 20px; color: #B4C6CF; }

.Moyen-Gris a:link {	color: #B4C6CF;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Moyen-Gris a:visited {	color: #B4C6CF;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Moyen-Gris a:hover { color: #B4C6CF; border-bottom: 1px dotted #EE5C04; text-decoration: none;}



.Moyen-Bleu {font-family: "Trebuchet MS", Arial; font-size: 18px; color: #099CEF; }

.Moyen-Bleu a:link {	color: #099CEF;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Moyen-Bleu a:visited {	color: #099CEF;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Moyen-Bleu a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}


.Moyen-Blanc {font-family: "Trebuchet MS", Arial; font-size: 20px; color: #FFFFFF; }

.Moyen-Blanc a:link {	color: #FFFFFF;	border-bottom: 0px; text-decoration: none;}

.Moyen-Blanc a:visited {	color: #FFFFFF;	border-bottom: 0px; text-decoration: none;}

.Moyen-Blanc a:hover { color: #FFFFFF; border-bottom: 1px dotted #FFFFFF; text-decoration: none;}


.Moyen-Orange {font-family: "Trebuchet MS", Arial; font-size: 20px; color: #EE5C04; }

.Moyen-Orange a:link {	color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Moyen-Orange a:visited {	color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Moyen-Orange a:hover { color: #EE5C04; border-bottom: 1px dotted #018AD9; text-decoration: none;}








/*------------------------------------------ TEXTE : PETIT -----------------------------------*/





.Petit {color: #3C3C3C; font-family: "Trebuchet MS", Arial; font-size: 14px; }

.Petit a:link {	color: #3C3C3C;	border-bottom: 1px dotted #6C6C6C; text-decoration: none;}

.Petit a:visited {	color: #3C3C3C;	border-bottom: 1px dotted #6C6C6C; text-decoration: none;}

.Petit a:hover { color: #0888D1; border-bottom: 1px dotted #EE5C04; text-decoration: none;}



.Petit-Bleu-Fonce {color: #0888D1; font-family: "Trebuchet MS", Arial; font-size: 14px; }

.Petit-Bleu-Fonce a:link {	color: #0888D1; border-bottom: 0px ; text-decoration: none;}

.Petit-Bleu-Fonce a:visited {	color: #0888D1;	border-bottom: 0px; text-decoration: none;}

.Petit-Bleu-Fonce a:hover { color: #01A8F9; border-bottom: 1px dotted #01A8F9; text-decoration: none;}



.Petit-Bleu {color: #0888D1; font-family: "Trebuchet MS", Arial; font-size: 14px; }

.Petit-Bleu a:link {color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Petit-Bleu a:visited {	color: #0888D1;	border-bottom: 1px dotted #018AD9; text-decoration: none;}

.Petit-Bleu a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}



.Petit-Gris {color: #9B9A9A; font-family: "Trebuchet MS", Arial; font-size: 14px; }

.Petit-Gris a:link {	color: #9B9A9A;	border-bottom: 1px dotted #9B9A9A; text-decoration: none;}

.Petit-Gris a:visited {	color: #9B9A9A;	border-bottom: 1px dotted #9B9A9A; text-decoration: none;}

.Petit-Gris a:hover { color: #EE5C04; border-bottom: 1px dotted #3C3C3C; text-decoration: none;}



.Petit-Orange {font-family: "Trebuchet MS", Arial; font-size: 14px; color: #EE5C04; }

.Petit-Orange a:link {	color: #EE5C04;	border-bottom: 1px dotted #EE5C04; text-decoration: none;}

.Petit-Orange a:visited {	color: #EE5C04;	border-bottom: 1px dotted #EE5C04; text-decoration: none;}

.Petit-Orange a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}



.Petit-Blanc {color: #FFFFFF; font-family: "Trebuchet MS", Arial; font-size: 14px; }

.Petit-Blanc a:link {	color: #FFFFFF;	border-bottom: 1px dotted #FFFFFF; text-decoration: none;}

.Petit-Blanc a:visited {	color: #FFFFFF;	border-bottom: 1px dotted #FFFFFF; text-decoration: none;}

.Petit-Blanc a:hover { color: #FFFFFF; border-bottom: 0px  #FFFFFF; text-decoration: none;}








/*------------------------------------------ TEXTE : X-PETIT -----------------------------------*/



.X-Petit {color: #000000; font-family: "Trebuchet MS", Arial; font-size: 10px; }

.X-Petit a:link {	color: #000000;	border-bottom: 1px dotted #6C6C6C; text-decoration: none;}

.X-Petit a:visited {	color: #000000;	border-bottom: 1px dotted #6C6C6C; text-decoration: none;}

.X-Petit a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}



.X-Petit-Gris {color: #9B9A9A; font-family: "Trebuchet MS", Arial; font-size: 10px; }

.X-Petit-Gris a:link {	color: #9B9A9A;	border-bottom: 1px dotted #9B9A9A; text-decoration: none;}

.X-Petit-Gris a:visited {	color: #9B9A9A;	border-bottom: 1px dotted #9B9A9A; text-decoration: none;}

.X-Petit-Gris a:hover { color: #EE5C04; border-bottom: 1px dotted #EE5C04; text-decoration: none;}



.X-Petit-Blanc {font-family: "Trebuchet MS", Arial; font-size: 10px; color:#FFFFFF}



.X-Petit-Bandeau {font-family: "Trebuchet MS", Arial; font-size: 10px; letter-spacing: 1px ;}

.X-Petit-Bandeau a:link, a:visited { color: #000000; text-decoration: none;}

.X-Petit-Bandeau a:hover { color: #EE5C04; text-decoration: none;}







/*------------------------------------------ PARAGRAPHE : TITRES / SOUS TITRES -----------------------------------*/



h1 {
	
	text-align:left;

	font-family: "Trebuchet MS", Arial; 

	font-size: 28px; 

	color: #ACBBC3; 

	margin-top : 50px;
	
	padding-left : 20px;

	padding-bottom : 10px;

	border-bottom: 3px solid #099CEF;

	font-weight: bold;

	line-height:40px;

	}







h2 {
	
	text-align:left;

	font-family: "Trebuchet MS", Arial; 

	font-size: 18px; 

	color: #FFFFFF; 

	padding-left : 20px;

	background: #099CEF;

	font-weight: normal;

	line-height:40px;

border-radius: 5px 20px 0 5px;

	}






/*------------------------------------------ PARAGRAPHE : CORPS DU TEXTE ESPACE OU NORMAL -----------------------------------*/




h3 {

	text-align:justify;

	font-weight: normal;

	line-height:22px;

	}





/*------------------------------------------ PARAGRAPHE : CITATION -----------------------------------*/



h4 {

	text-align:justify;

	font-weight:normal;

	font-style:italic;

	line-height:20px;

	border-left: 4px solid #099CEF;

	margin-left:5px;
	 
	padding-top:10px; 


	padding-left:30px; 

	padding-right:50px;

	}









/*------------------------------------------ PARAGRAPHE : NOTES DE BAS DE PAGES -----------------------------------*/



h5 {

	border-bottom: 2px solid #ACBBC3;

	padding-bottom:5px; 

	font-family: "Trebuchet MS", Arial;

	font-size: 12px; 

	font-weight: normal;

	color:#969CA0;

	}

	

h5 a:link {	color: #666666;	 text-decoration: none;}

h5 a:visited {	color: #666666;	 text-decoration: none;}

h5 a:hover { color: #EE5C04;  text-decoration: none;}



	



/*------------------------------------------ PARAGRAPHE : ACTUS LEGENDE PHOTOS -----------------------------------*/



h6 {

	text-align:center;

	line-height:0px;

	margin-bottom:-5px;

	font-weight: normal;

	}
