/* global */
html{height: 100%;}


/*iframe  {height:1500px; width:1500px;}*/


#Iframe1
{
    position: relative;
	height:1500px;
	width:900px;
}

#Iframe2
{f
    position: relative;
	height:1500px;
	width:1500px;
}


body
{ font-family: Trebuchet MS, sans-serif;
  padding: 0px;
  margin: 0px;
  font-size: .78em;
  background: #252525; /*url(pattern.png) repeat;*/
  background: white;
}

p
{ font-family: eurostile, sans-serif;
  margin: 0px;
  font-size: 130%;
  padding: 0px 0px 10px 0px;
  line-height: 1.5em;
  color: #708090;
  text-align: justify; 
}

pc /* centré */
{ font-family: eurostile, sans-serif;
  margin: 0px;
  font-size: 130%;
  padding: 0px 0px 10px 0px;
  line-height: 1.5em;
  color: #708090;
  text-align: center; 
}

p2 /* plus petite police */
{ font-family: eurostile, sans-serif;
  margin: 0px;
  font-size: 80%;
  padding: 0px 0px 10px 0px;
  line-height: 1.5em;
  color: #708090;
  text-align: justify; 
}


p55 /* une class de balise p qui est décalée de 55% */
{ font-family: eurostile, sans-serif;
  font-size: 130%;
  padding: 0px 0px 10px;
  padding-left: 55%;
  line-height: 1.5em;
  color: #708090;
  text-align: justify; 
}

.sanspasserdeligne { padding:0; } /* une class de balise p qui ne passe pas a la ligne apres */

pwhite
{ margin: 0px;
  font-size: 120%;
  padding: 0px 0px 16px 0px;
  line-height: 2em;
  color: white;
} 

ps
{ font-family: eurostile, sans-serif;
  margin: 0px;
  font-size: 110%;
  padding: 0px 0px 2px 0px;
  line-height: 1em;
  color: #708090;
}

/*h1
{ font-family: Trebuchet MS, arial, Helvetica,sans-serif;
  font-size: 120%;
  letter-spacing: .1em;
  padding: 7px 0px 5px 0px; 
  margin: 0px 0px 12px 0px; 
  color: #24445C;
}*/

h1
{ font-family: eurostile, sans-serif;
  font-size: 150%;
  color: #24445C;
  padding:0;
}

h2
{ font-family: eurostile, sans-serif;
  font-size: 180%;
  color: #24445C;
}

h2.difcolour
{ font-family: eurostile, sans-serif;
  font-size: 180%;
  color: #708090;
}


.float_right {
float:right;
}

h3
{ font-family: eurostile, sans-serif;
  font-size: 220%;
  color: #24445C;
}

h4
{ font-family: eurostile, sans-serif;
  font-size: 300%;
  color: #24445C;
}

img
{ border: 0px; 
  margin: 0px; 
  padding: 0px;
}

a
{ 
  text-decoration: none;
  color: #708090;
}

a.lien
{ 
  outline: none;
  text-decoration: none;
  color: #708090;
  /*border: 1px solid transparent;    */
  border-bottom: 1px dotted #708090;
}

a.lien:visited         
{ outline: none;
  text-decoration:none; 
  color: #708090;
}

a.lien:hover, a:active 
{ color: #708090;             /* Lors du passage de la souris ou activation, */
border-bottom: 1px dotted #708090;
}

a.lien2
{ 
  outline: none;
  text-decoration: none;
  color: #708090;
  color: #0066CC;
}

a.lien2:visited         
{ outline: none;
  text-decoration:none; 
  border-bottom: 1px dotted color: #0066CC;
  color: #0066CC;
}

a.lien2:hover, a:active /* Lors du passage de la souris ou activation, */
{         
  border-bottom: 1px dotted; 
  color: #0066CC;
}


form{padding: 0; margin: 0;}

/* image positioning - left, right and center */
.left
{ float: left;
}

.gauche
{ float: left; 
  border-right: 18px solid;
}

.right
{ float: right; 
  border-left: 18px solid;
}

.center   	/* class to get an aligned div (horizontally) */
{ display: block;
  text-align: center;
  margin: 0 auto;
}

.left, .right{border-color: #FFF;}

/* block quote */
blockquote
{ margin: 20px 0px 20px 0px; 
  padding: 10px 20px 0px 20px;
  border-left: 8px solid #4D4D4D;
}

/* unordered list */
ul
{ margin: 2px 0px 18px 16px;
  padding: 0px;
  /*width: 100px;*/ 
}

ul li
{ list-style-type: square;
  margin: 0px 0px 6px 0px; 
  padding: 0px;
}


/* ordered list */
ol
{ margin: 8px 0px 0px 24px;
  padding: 0px;
}

ol li
{ margin: 0px 0px 11px 0px; 
  padding: 0px;
}

/* margin lefts / margin rights - to centre content */

#main, #footer, #bandeauhome, #menubar, #site_content
{ margin-left: auto; 
  margin-right: auto;
  padding:1px 0;
}

/* main container */
#main
{ width: 900px;
  background: #EBF0F6; /*url(main.png) repeat-y;*/
  /*color: #EBF0F6;*/
  background: white;
}

/* bandeau */

#bandeauhome
{ width: 900px;
  height: 250px;
  background: url(bandeau_meteobacterio_10.png) no-repeat left center;
}

/* div utiles */
#div_decale_vers_le_bas
{ width: 900px;
  /*height: 200px;*/
  background: white;
  margin-top:100px;
}
#div_decale_vers_le_bas2
{ width: 900px;
  background: white;
  margin-top:100px;
}

#div_avec_decalage_5pct
{ width: 900px;
  background: white;
  margin-top:0px;
  margin-left:5%;
  /*padding-left: 5%;*/
}


/**************************************************************
  Test menu deroulant 
**************************************************************/
#menubar
{ background: white;
  width: 900px;
  height: 28px;
  border-top: 1px solid #7D7D7D;
  border-bottom: 1px solid #7D7D7D;
  position : absolute;
  z-index: 5;
} 

#jsddm
{	margin: 0;
	padding: 0}

#jsddm li
{	float: right;

	/* -- rajout -- */
	position: relative;

	list-style: none;
	font: 16px eurostile, sans-serif}

#jsddm li a
{	display: block;
	text-align: center;
	background: white;
	padding: 5px 20px;
	text-decoration: none;
	border-right: 1px solid white;
	width: 125px;  /* largeur des menus défunt = 75*/

	color: #EAFFED;
	color: black;
	white-space: nowrap;
	border-radius:8px 8px 0px 0px}

#jsddm .current
{	background: #24313C;
	color: white}

#jsddm li a:hover
{	background: #24313C;
	color: white}

#jsddm li ul
{	margin: 0;
	/*padding: 0;*/
	
	/* -- rajout -- */
	width: 165px;

	position: absolute;
	/* -- rajout -- */
	text-align: left;

	visibility: hidden;
	border-top: 1px solid white
	}
	/*z-index: 999999;*/
		
#jsddm li ul li
{	float: none;
	display: inline}
		
#jsddm li ul li a
{	width: auto;
	background: #24313C;
	background: #708090;
	background: #DCDCDC;
	background: #B0C4DE;
	background: #4682B4;
		
	background: #DCDCDC; /*  gainsboro */
	background: #87CEFA; /* lightskyblue*/
	background: #00BFFF; /* electric blue*/
	background: #4682B4;

	/*Essai changement de couleur des ss-menus */
	background: #d3d3d3;
	background: #f5f5f5; 	
	background: #f0f8ff;
	background: #87ceeb;
	background: #f0f8ff;


	border-top: 1px solid white;
	border-bottom: 1px solid white;
	border-radius: 0px 0px 0px 0px;

	text-align: left;
	/*Essai changement de couleur de police des ss-menus */
	color: black}
		
#jsddm li ul li a:hover
{	background: #708090;
	background: #24313C}


/* footer */
#footer
{ width: 900px;
  height: 42px;
  
  line-height: 1.5em;
  vertical-align: middle;
  
  /*padding: 28px 21px 0px 19px;*/
  padding: 0px px 0px 19px;
  text-align: center; 
  border-top: 2px solid #F2F2F0;
  /* background: #686868 url(menus.png) repeat; */
  background: white;
  color: #000033;
}

#footer_b
{ width: 900px;
  height: 30px;
  
  line-height: 1.5em;
  /*vertical-align: bottom;*/

  padding: 0px px 0px 5px;
  text-align: justify; 
  border-bottom: 1px solid #24445C;
  background: white;
  color: #24445C;
}

#box /* pour mettre ensemble et alignes, texte en gras + images */
{ width: 900px;
  height: 30px;
  
  line-height: 1.5em;
  vertical-align: center;

  padding: 0px px 0px 0px;
  text-align: justify; 
  background: white;
  color: #24445C;
}

/*#footer a
{ background: transparent;
  color: #FFF;
}*/

/*#footer a:hover
{ background: transparent;
  color: #AAA;
}*/

#content a, #content a:hover, #footer a, #footer a:hover{text-decoration: none;}


/** Slider */

#slider
{
	overflow: hidden;
	margin: 0 auto;
	/*width: 1000px;*/
	position: relative;
	z-index: 100;				/*test*/
	background: white;
	opacity: 0.99;
}

#slider .button
{
	display: inline-block;
	background: #0074C6;
	color: #ffffff;
	text-align: center;
	line-height: 50px;
	height: 50px;
	text-decoration: none;
	outline: 0;
	border-radius: 8px;
	font-size: 1.25em;
	border-bottom: solid 2px #0054A6;
	text-shadow: 0 1px 1px #003A6C;
}

#slider .button:hover
{
	background: #2094E6;
}

#slider .viewer
{
	width: 1000px;
	height: 360px;
	margin: 0 auto;
	overflow: hidden;
	background: white;
}

#slider .viewer .reel
{
	display: none;
	height: 500px;
}

#slider .viewer .reel .slide
{
	position: relative;
	
	margin-right:auto;
	margin-left:auto;
	text-align:center;
	overflow:hidden;
	
	width: 900px;     /* a ne pas toucher = ecartement entre 2 slides => permet aussi de centrer les slides ds le viewer */
	height: 500px;
}

#slider .viewer .reel h2 /* textbox du haut */
{
	position: absolute;
	top: 230px;
	top: 330px;
	left: 0;
	padding: 0px 30px;
	line-height: 80px;
	background: #111111;
	text-align: center;
	opacity: 0.75;
	font-weight: normal;
	font-family: 'Archivo Narrow', sans-serif;
	color: #ffffff;
	font-size: 4.50em;
}

#slider .viewer .reel p  /* textbox du bas */
{
	position: absolute;
	top: 340px;
	top: 410px;
	left: 0;
	padding: 5px 35px;
	background: #0074C6;
	text-align: center;
	opacity: 0.75;
	font-family: 'Archivo Narrow', sans-serif;
	font-weight: normal;
	color: #ffffff;
	font-size: 2.00em;
}

#slider .indicator
{
	margin: 30px auto 0 auto;  /* controle les dimensions et positionnement du bandeau du bas du slider où sont les boutons */
}

#slider .indicator ul
{
	list-style: none;
	padding: 0;
	margin: 0;
	text-align: center;
}

#slider .indicator ul li
{
	display: inline-block;
	width: 12px;
	height: 12px;
	text-indent: -9999em;
	background: #c8c8c8;
	margin: 0 2px 0 2px;
	border-radius: 8px;
	border-bottom: solid 1px #ffffff;
	border-top: solid 1px #909090;
}

#slider .indicator ul li.active
{
	background: #505050;
	background: #1E90FF;
	border-top: solid 1px #505050;
}

#featured
{
	overflow: hidden;
	padding: 50px 0px;
	/*border-bottom: 1px solid #D8D8D8;*/   /* je l'enleve, du coup ma police pour le cas sans bordure ne sert a rien*/
}

#featuredwithoutborder		/** je la rajoute **/
{
	overflow: hidden;
	padding: 50px 0px;
}


#featured #fbox1
{
	float: left;
	width: 175px;
	margin-left: 40px;
	margin-right: 40px;
}

#featured #fbox2
{
	float: left;
	width: 175px;
	margin-right: 40px;
}

#featured #fbox3
{
	float: left;
	width: 175px;
	margin-right: 40px;
}

#featured #fbox4
{
	float: left;
	width: 175px;
	margin-right: 40px;
}

#featured img
{
	border-radius: 120px;
}

#featuredwithoutborder img	/** je la rajoute **/
{
	border-radius: 120px;
}

#featuredwithoutborder h1				/* je rajoute une police pour ce bloc */
{
	padding: 20px 80px 20px 80px;
	text-align: left;
	font-size: 2.00em;
	font-weight: 100;
	font-family: 'Archivo Narrow', sans-serif;
	color: #E2E0DE; /* couleur Lin */
	color: #58534F; /* couleur Taupe */
}


#featured p
{
	text-align: center;
	color: #E2E0DE; /* test => couleur Lin */
}

#featured h2
{
	padding: 20px 0px 20px 0px;
	text-align: center;
	text-transform: uppercase;
	font-size: 1.00em;
	font-weight: 700;
	font-family: 'Open Sans', sans-serif;
	color: #0074C6;
	color: #58534F; /* couleur Taupe */
	
}

#featured .title 
{
	margin-bottom: 40px;
	border-top: 1px solid #D8D8D8;
	border-bottom: 1px solid #D8D8D8;
	font-family: 'Open Sans', sans-serif;
	font-size: 2.50em;
	color: #3B3B3A !important;
}