/* CSS Document */

body {
  padding:0px;
  margin:0px;
  
  width: 100%;
  height: 700px;
  
  background-color: #ffffff;
  background-image: url('images/fond_site.jpg');
  background-repeat: no-repeat;
  background-position: top left;  
}

p, div, td, span {
  font-family: Arial;
  font-size:11px;
  color:#004186;
}

.spacer {
  clear: both;
}

#conteneur {

  
  width: 100%;
  height: 100%;
  
}

#div_programme {
  position: absolute;
  top: 36px;
  left: 48px;
  width: 160px;
  height: 240px;
}

#div_home {
  position: absolute;
  top: 154px;
  left: 18px;
  width: 20px;
  height: 20px;
}

#menu_haut {
  position: absolute;
  top: 154px;
  left: 62px;
  width: 215px;
  height: 90px;
  
  /*border:1px solid #ff0000;*/
}

#menu_haut a {
  color: #004186;
  text-decoration: none;
  font-weight:bold;
  display:block;
  margin-bottom:2px;
  padding-left: 10px;

  background-image: url('images/puce_passive.png');
  background-repeat: no-repeat;
  background-position: 0px 4px;  
  
}


#menu_haut a:hover {
  color: #6cb1dd;
  text-decoration: none;
  font-weight:bold;
  

  background-image: url('images/puce_active.png');
  background-repeat: no-repeat;
  background-position: 0px 4px;   
}

#ecosistema {
  position: relative;
  top: 40px;
  left: 790px;
  width: 205px;
  height: 140px;
  
  /*border:1px solid #ff9900;*/
}
  #facebook_twitter {
  
    margin-top:5px;
    margin-left:85px;
    height:30px;
    width:70px;
    
    z-index:10;
  }

/*********** MILIEU ***********/
#contenus {
  position: absolute;
  margin-top:50px;
  left: 240px;
  top: 140px;
  
  width: 750px;
  
  /*border:1px solid #ff9900;*/
}

  #liste_sous_menus {

    width: 171px;
    height: 111px;
  
    float:right;
    margin-right:5px;
    

    margin-top:200px;/*position Y si page texte*/
    
    padding-left: 10px;
    padding-top: 5px;
      
    background-image: url('images/fond_liste_video.png');
    background-repeat: no-repeat;
    background-position: center top;  
    

  }  
 

  #liste_videos {

    width: 171px;
    /*height: 111px;*/
  
    float:right;
    margin-right:5px;
    
    margin-top:270px;/*position Y si page videos*/
    
    padding: 0px;

    
  }  
  
  .div_cadre_liste {
    margin:0px;
    padding:0px;
    display:block;
    width: 171px;
    /*border:1px solid #ff9900;*/
  }
  
  .div_cadre_liste img {
    margin:0px;
  }
  
  #liste_videos_liens {
    background-image: url('images/fond_liste_video.png');
    background-repeat: repeat-y;
    /*background-position: 0px 0px;*/    
    margin: 0px;
    padding: 0px;
    /*border:1px solid #ff0055;*/
    
    width: 171px;
    
  }

  #liste_sous_menus a, #liste_videos a {
    color: #004186;
    text-decoration: none;
    font-weight:bold;
    display:block;
    margin-bottom:2px;
    margin-left:9px;
    margin-right:6px;
    padding-left: 10px;
  
    background-image: url('images/puce_passive.png');
    background-repeat: no-repeat;
    background-position: 0px 4px;  
    
  }
  #liste_sous_menus a:hover, #liste_videos a:hover {
    color: #6cb1dd;
    text-decoration: none;
    font-weight:bold;
    
  
    background-image: url('images/puce_active.png');
    background-repeat: no-repeat;
    background-position: 0px 4px;   
  } 

/********* PAGES TEXTES ***********/

#conteneur_texte {
  /*
  position: absolute;
  
  left: 440px;
  top: 140px;
  */
  float:right;
  width: 400px;
  height: 550px;
  margin-right:130px;
  /*border:1px solid #009900;*/
}

  .titre_page {
    text-transform: uppercase;
    font-family: Univers, Arial;
    font-size: 20px;
    text-align:right;
    

  }
  
  .titre_page_texte {
    margin-right: 30px;
    /*margin-left:-50px;*/  
  }

  
  #texte_contenu {
    background-image: url('images/fond_texte_contenu.png');
    background-repeat: no-repeat;
    background-position: 0px 0px;   
    
    width: 371px;
    height: 478px; 
    
    padding-top: 10px;

  }
  
  #div_textes {
    padding: 6px;
    padding-top: 2px;
    margin-right: 15px;
    margin-left: 5px;
    
    text-align: justify;
    
    /*border:1px solid #00ff00;*/
  }

/********* PAGES VIDEOS ***********/
		
#conteneur_video {
  /*
  position: absolute;
  top: 197px;
  left: 240px;
  */  
  width: 545px;
  height: 440px;
  float:right;
  
  margin-top:0px;

  
  /*border:1px solid #00ff00;*/
}

  
  .titre_page_video {
     /*width: 720px;*/
     /*margin-right: -25px;*/
     
  }

  
  #lecteur_video {   
  
    float:left;  
    width: 545px;
    height: 375px;
    background-image: url('images/fond_lecteur_video.png');
    background-repeat: no-repeat;
    background-position: center top;  
  
  }
  
  #div_video_player {
    margin-left: 12px;
    margin-top: 10px;
  }
  
  
/*
mosaique video
*/  

#conteneur_mosaique_videos {
  
  float:right;
  width: 636px;
  height: 450px;
  margin-right:50px;  
  
  /*border:1px solid #00ff00;*/
}

#cadre_mosaique_videos {
}

.mosaique_video_capture {
  float:left;
  width: 150px;
  height: 120px;
  margin:3px;  
  margin-bottom:5px;  
  /*border:1px solid #D8F7FF;*/ 
}

/*
panoramas
*/  

#conteneur_panorama {
  
  float:right;
  width: 636px;
  height: 450px;
  margin-right:50px;  
  
  /*border:1px solid #00ff00;*/
}

#cadre_panorama {
  float:right;
  margin-top:5px;
}

.cadre_panorama_titre {
  background-color: #004186;
  color: #ffffff;
  font-size:14px;
  font-weight:bold;
  padding: 4px;
}



/*
bas
*/
  
#menu_bas a {
  color: #004186;
  text-decoration: none;
  font-weight:bold;
  display:block;
  margin-bottom:2px;
  padding-left: 10px;

  background-image: url('images/puce_passive.png');
  background-repeat: no-repeat;
  background-position: 0px 4px;  
  
}
#menu_bas a:hover {
  color: #6cb1dd;
  text-decoration: none;
  font-weight:bold;
  

  background-image: url('images/puce_active.png');
  background-repeat: no-repeat;
  background-position: 0px 4px;   
}

#footer {
  position: absolute;
  
  margin:auto;
  width: 982px;
  
  top: 750px;
  height: 30px;
}
  
/*
scroll texte
*/
			
  .divContenu {
    width: 380px;
    height: 460px; 
    background: none;
    margin:0px;
    
  }
			
  .scrollnc {
    margin:0px;
    padding:0px;	
  }
			

			/* fond du scroll */
			.scrollnc .jScrollPaneTrack {
        background-color:#DCE3EF;
        /*opacity:0.5; 
        filter : alpha(opacity=50);
        */


			}
		
      /* milieu du curseur */
			.scrollnc .jScrollPaneDrag {
				background-color:#004186;
        background-image: url('images/fond_curseur_scroll.png');
        background-repeat: repeat-y;
        background-position: center top;   				
				
	
			}
			
			
			
			/* haut du curseur */
			.scrollnc .jScrollPaneDragTop {
				background-color:#004186;
			}
			/* bas du curseur */
			.scrollnc .jScrollPaneDragBottom {
				background-color:#004186;
			}
			
			/* fleche du haut */
			.scrollnc a.jScrollArrowUp {
        background-color:#004186;
        
        background-image: url('images/fleche_haut.png');
        background-repeat: no-repeat;
        background-position: center top;           
			}
			/* fleche du haut hover */
			.scrollnc a.jScrollArrowUp:hover {
				background-color:#6cb1dd;
			}

      /* fleche du bas */
			.scrollnc a.jScrollArrowDown {
        background-color:#004186;
        
        background-image: url('images/fleche_bas.png');
        background-repeat: no-repeat;
        background-position: center top;          
			}
			/* fleche du bas hover */
			.scrollnc a.jScrollArrowDown:hover {
				background-color:#6cb1dd;
			}	    
			

  

/* div d'alerte */
#div_alerte_fond {
  position:absolute;
  top:0px;
  margin: 0px;
  background-color : #000000;
  width: 100%;
  height: 100%;
  
   filter:alpha(opacity=70);
   -moz-opacity:0.7;
   opacity: 0.7;
  
}

#div_alerte {
  position:absolute;
  top:50%;
  left:50%;
  margin: 0px;
  margin-top:-200px;
  margin-left:-400px;
  height: 400px;
  width: 800px;
  background-color : #ffffff;
  border: 5px solid #CDE000;
  overflow-y: scroll;
  
}

#div_alerte_message {
  position:relative;
  text-align:justify;
  display:block;
  width:100%;
  height:100%;
}
#div_alerte_fermer {
  position:absolute;
  top:50%;
  left:50%;
  margin: 0px;
  margin-top:-200px;
  margin-left:410px;
  width:20px;
  height:20px;
  text-align:center;
}