#container {
	position:relative; margin:75px auto 0 auto; height:1000px;
        width:1024px;
}
#container .left{
	position:relative; float:left; width:185px; height:539px;
        background: #666666;
}

/*menu.css*/





#container .middle{
	position:relative; float:left;
	width:615px;
        line-height:1em;
        height:titreGrandeImage;
}
#container .middle h1{
    margin:0 0 20px 69px; color:#FFCC00; font-size:1.2em;
}

#container .middle .texte{
    margin:0 0 0 69px; 
}


/*Rubrique lien*/
#container .middle ul{
    position:relative; height:539px;
}
#container .middle ul li{
    margin:50px 0 0 175px;
    height:20px; overflow:hidden;
}
#container .middle ul li .boxLiens{
    position:relative; height:30px;
}
#container .middle ul li .boxLiens .contentBoxliens{
    position:absolute; top:0; left:0;
}
#container .middle ul li a{
     font-size:1.3em;
}
#container .middle ul li a.lienUp{
    color:#FFFFFF;
}
#container .middle ul li a.lienDown{
    color:#00FF99;
}

/*Rubrique contact*/
#container .middle p.contact{
    position:relative; margin:160px 0 0 150px;
    line-height:1.2em;
}
#container .middle p.contact a{
    color:#EFEFEF;
}
#container .middle img {
    margin:0 auto 0 auto; display:block;
}
#container .middle .boxImage {
  position:absolute;
  left: 50%;
  top: 50%;
  height: 531px;
  width: 539px;
  margin-top: -265px; /* moitié de la hauteur */
  margin-left: -270px; /* moitié de la largeur */
}

/*
#container p.middle img{
	position:relative; float:left;
	margin:50px auto 0 auto; display:table-cell;      
}
/**/

#container .right{
	margin:/*24px 0 0/**/ 0;
	position:relative; float:left;
        height:539px; 
}


/* documents */
/* articles */

#container .middle #hide-show{
    display:none;
}
#container .middle a.show{
    display:block;
}
#container .right .legendeArticle{
    background:url(../img/bgLegendeArticle.gif) no-repeat;
    width:200px;
    height:66px;
    padding:5px 0 0 0;
    color:#AFAFAF; font-size:0.9em;
    z-index:15;
}
#container .right .legendeArticle .titre{
    color:#FFCC00;
    margin:0 0 0 15px;
}
#container .right .legendeArticle .texte{
    color:#AFAFAF;
    margin:0 0 0 15px;
}

#container .right .boxDoc{
    position:relative; margin:0 0 15px 50px;
    background:#FFCC00; width:71px; height:71px;
}
#container .right .boxDoc a{
    display:block; line-height:71px;
    position:absolute; top:25px; left:8px;
}

*+html #container .right .bigImage {
    display:none;
}
*html #container .right .bigImage{
    display:none;
}

#container .right #carrousel{
    position:relative; float:left; height:600px; width:71px;
    
}


#container .boxLegende{
    position:relative; float:left; height:539px;  width:100px;
}
#container .boxLegende .legende{
    position:absolute; bottom:0px; left:0;
    width:100px; height:100px; margin:0 0 0 20px;
    
}
#container .boxLegende .legende span{
    position:absolute; color:#00FF99; bottom:0; display:block;
     left:0;
    
}
/*****  carrousel *****/
.jcarousel-skin-tango .jcarousel-container {
    background: #F0F6F9;
    border: 1px solid #346F97;
}

.jcarousel-skin-tango .jcarousel-container-horizontal {
    width: 70px;
    padding: 20px 40px;
}

.jcarousel-skin-tango .jcarousel-container-vertical {
    width: 70px;
    height: 600px;
    padding: 40px 20px;
}

.jcarousel-skin-tango .jcarousel-clip-vertical {
 /*   width:  70px; */
    height: 245px;
}

.jcarousel-skin-tango .jcarousel-item {
    width: 70px;
    height: 70px;
}
.jcarousel-skin-tango .jcarousel-item-vertical {
    margin-bottom: 15px;
}

.jcarousel-skin-tango .jcarousel-item-placeholder {
    background: #fff;
    color: #000;
}

/**
 *  Vertical Buttons
 */
.jcarousel-skin-tango .jcarousel-next-vertical {
    position: absolute;
    bottom: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background: red transparent url(next-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-next-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-next-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-next-disabled-vertical,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-next-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical {
    position: absolute;
    top: 5px;
    left: 43px;
    width: 32px;
    height: 32px;
    cursor: pointer;
    background:red transparent url(prev-vertical.png) no-repeat 0 0;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:hover {
    background-position: 0 -32px;
}

.jcarousel-skin-tango .jcarousel-prev-vertical:active {
    background-position: 0 -64px;
}

.jcarousel-skin-tango .jcarousel-prev-disabled-vertical,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:hover,
.jcarousel-skin-tango .jcarousel-prev-disabled-vertical:active {
    cursor: default;
    background-position: 0 -96px;
}



/**
 * This <div> element is wrapped by jCarousel around the list
 * and has the classname "jcarousel-container".
 */
.jcarousel-container {
    position: relative;
}

.jcarousel-clip {
    z-index: 2;
    padding: 0;
    margin: 0;
    overflow: hidden;
    position: relative;
	height:510px;
	
}

.jcarousel-list {
    z-index: 1;
    overflow: hidden;
    position: relative;
    top: 0;
    left: 0;
    margin: 0;
    padding: 0;
}

.jcarousel-list li,
.jcarousel-item {
    float: left;
    list-style: none;
    /* We set the width/height explicitly. No width/height causes infinite loops. */
/*    width: 70px;*/
    height: 70px;
	margin-bottom:15px;

}

/**
 * The buttons are added dynamically by jCarousel before
 * the <ul> list (inside the <div> described above) and
 * have the classnames "jcarousel-next" and "jcarousel-prev".
 */
.jcarousel-next {
    z-index: 3;
    display: none;
	width:28px; height:14px; background:url(../img/next.gif) no-repeat;
	top:530px; left:21px;
	position:absolute; 
}

.jcarousel-prev {
    z-index: 3;
    display: none;
	width:28px; height:14px; background:url(../img/prev.gif) no-repeat;
	top:-20px; left:21px;
	position:absolute; 
}


.boxAgenda, .boxParcours{
    cursor:pointer;
}


/*
#container .middle ul#legende{
    height:30px;
    position:absolute;
    top:550px;
}
/**/
#container .middle ul#legende li{
    margin:10px 0 0 0;
    display:none; font-size: 0.8em;
    color:#666666;
}




.hiddenAgenda{
    height: 539px;
}
.pdf{
    position: absolute;
    top: 0; right: 0;
}
.pdf a{
    color: #AFAFAF;
}