@charset "UTF-8";

* {
	margin:0;
	outline:none;
	padding: 0;
}
html, body {
	height:100%;
}
body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color:#333333;
	background:#eeeeee url(../images/bgportail.png) repeat-x scroll left top;
}

a {
	color:#0000FF;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	text-decoration:none;
}

a:hover{
	color:#FF0000;
}

#global {
	width:980px;
	margin:9px auto 0 auto;
	position:relative;
	z-index:100000000;
}

#header {
	position:relative;
	height:132px;
	background:transparent url(../images/header-portail.png) no-repeat center top;
}

#content {
	background:transparent url(../images/bgcontent.png) repeat-y scroll center top;
	padding:0px 15px 25px 15px;
}

#cadre_top {
	background:transparent url(../images/toplight.png) no-repeat scroll center bottom;
	padding:0px 15px 25px 15px;
}

#footer {
	height:53px;
	background:url(../images/footerlight.png) no-repeat center top;
	padding:20px 5px 0 5px;
	font-size:12px;
	margin-bottom:20px;
}

.clearLeft {
	clear:left;
}
.clearBoth {
	clear:both;
}
.boldRed {
	font-weight:bold;
	color:#eb0000;
}
.boldBlue {
	font-weight:bold;
	color:#0000FF;
}
.boldGreen {
	font-weight:bold;
	color:#00FF00;
}
.boldWhite {
	font-weight:bold;
	color:#FFFFFF;
}
.boldBlack {
	font-weight:bold;
	color:#000000;
}	
.boldGrey {
	font-weight:bold;
	color:#999999;
}	
.boldWhite {
	font-weight:bold;
	color:#FFFFFF;
}
.categorie {
	color:#999999;
	font:bold 18px Arial, Helvetica, sans-serif;
	}
.categorie_lien {
	color:#0000FF;
	font:bold 18px Arial, Helvetica, sans-serif;
	}
.adresse
{
    width:100%;
    background-color:#08a1d4;
    color:#FFFFFF;
    text-align:center;
    border-bottom:1px solid #666;
    margin:0px;
    padding:0px;
    padding-bottom:2px;
    margin-top:0px;
    margin-bottom:0px;
	font:bold 22px Arial, Helvetica, sans-serif;
}
	
ul#nav {
	list-style: none ;
	margin: 0 ;
	padding: 0 ;
	height:32px;
}
ul#nav li {
	display: inline ;
	color: #fff ;
	background:transparent url(../images/topmenu-separateur.png) no-repeat right center;
}
ul#nav li a {
	color: #f0f0f0 ;
	line-height: 32px;
	padding: 3px 10px ;
	text-align: center;
	font-weight:bold;
	font-size:12px;
	font-family: Arial, Helvetica, sans-serif;
}
ul#nav li a:hover{
color:#FF0000;

}

ul#nav li.last {
	background:none;
}

ul.options {
	list-style:none;
	font-size:11px;
	margin-top:8px;
}

ul.options li {
	display:block;
	float:left;
	padding : 2px 0 2px 0px;
	margin-right : 15px;
}
ul.options li input{ margin-right:3px; float:left;}
ul.options li label{ float:left; display:block; margin:-1px 0px 0px 4px;}

#noline {
	padding:5px 0;
	text-align:right;
}
#noline a {
	font-size:9px;
	text-decoration:none;
}

img {
	border-color:#999999;
	}
	
/* FIL de DISCUSSION */

.date_user_image {
	font:12px Arial, Helvetica, sans-serif;
	color: #26354A;
	letter-spacing:.1em;
	}
	
	
	
/* commentaires */
.image_commentaire {
	vertical-align:baseline;
	margin:3px;
	float:left;
	clear:both;
	}
.user_commentaire {
	font:12px Arial, Helvetica, sans-serif;
	color:#0000FF;	
    font-weight:bold;
	padding-left:4px ;
	padding-right:2px ;
	float:left;
	}
.text_commentaire {
	font:12px Arial, Helvetica, sans-serif;
	color: #26354A;
	padding-left: 40px;
	width:350px;
	float:none;
	}
.date_commentaire {
	font:12px Arial, Helvetica, sans-serif;
	color:#999999;
	padding-left: 40px;
	}
.text_separator {
	padding-top:2px ;
	padding-bottom:6px ;
	float:none;
	}
.bouton_commentaire {
	vertical-align:baseline;
	margin:3px;
	float:right;
	}
.text_commentaire1 {
	font:12px Arial, Helvetica, sans-serif;
	color:#666666;
	background-color:#CCCCCC;
	resize:none;
	height:36px;
	width:350px;
	float:none;
	}

/*  VIDEO, PRESSE, etc  */
.description {
	font:10px Arial, Helvetica, sans-serif;
	color:#666666;
    font-weight:normal;
	}
.titre {
	font:12px Arial, Helvetica, sans-serif;
	color:#0000FF;
    font-weight:normal;
	}
.gros_description {
	font:14px Arial, Helvetica, sans-serif;
	color:#666666;
    font-weight:normal;
	}
.gros_titre {
	font:16px Arial, Helvetica, sans-serif;
	color:#0000FF;
    font-weight:bold;
	}
/* POPUP */
a.info{
position:relative;
z-index:24;
color:#000;
text-decoration:none;
font-size:12px;
}
 
a.info:hover{
z-index:25;
background-color:#FFF
}
 
a.info span{
display: none
}
 
a.info:hover span{
display:block;
border:1px solid #000;
background-color: #CCCCCC;
color:#000;
text-align: justify;
font-weight:none;
padding:5px;
width:350px;
position:fixed;
top:200px;left:740px;
}

/* liste sorties */
 
#liste_sortie {
display:block;
border:none
background-color:#FFFFFF;
text-align: justify;
width:450px;
position:absolute;
top:150px;left:510px;
overflow:auto;
height:600;
}
 
/*  CALENDRIER  */
.calendrier_popup {
	font:15px Arial, Helvetica, sans-serif;
	color:#333333;
    font-weight:normal;
	}
.jour {
	color:##000;
	font-size:12px;
}

.le_mois {
	color:#999999;
	font:bold 16px Arial, Helvetica, sans-serif;
	}
	
.le_mois_en_cours {
	color:#000000;
	font:bold 16px Arial, Helvetica, sans-serif;
	}	

/*  ACTUALITES  */
.actualites
{
    width:100%;
    background-color:#66CC99;
    color:#333333;
    text-align:center;
    margin:0px;
    padding:0px;
    padding-bottom:2px;
    margin-top:0px;
    margin-bottom:0px;
	font:bold 13px Arial, Helvetica, sans-serif;
}

/* affichage des photos */

#photo {
  width:1050px;
  height:850px;
  position:absolute;
  margin-left: - width/2;
  margin-top: - height/2;
  top:-4%;
  left:-3%;
  background:transparent url(../images/bgphoto.png) repeat-y scroll center top;
}

/* Pure CSS3 jQuery-Like fadeIn
---------------------------------------------------- */
.fadeIn {
	/* Styling for Demo
	---------------------------------------------------- */
	 border:5px solid #e9e9e9; 
	margin:15px;
	-webkit-box-shadow: 0px 0px 5px #333;
	-moz-box-shadow: 0px 0px 5px #333;
	-ms-box-shadow: 0px 0px 5px #333;
	-o-box-shadow: 0px 0px 5px #333;
	 box-shadow: 0px 0px 5px #333; 
	 	
	/* CSS needed for animation
	---------------------------------------------------- */
	opacity:0;
	-webkit-animation:fadeIn ease-in 1;
	-moz-animation:fadeIn ease-in 1;
	-o-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;
	-webkit-animation-fill-mode:forwards;
	-moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
}

.fadeInButton {
	/* Styling for Demo
	---------------------------------------------------- */
	margin:15px;
	 	
	/* CSS needed for animation
	---------------------------------------------------- */
	opacity:0;
	-webkit-animation:fadeIn ease-in 1;
	-moz-animation:fadeIn ease-in 1;
	-o-animation:fadeIn ease-in 1;
	animation:fadeIn ease-in 1;
	-webkit-animation-fill-mode:forwards;
	-moz-animation-fill-mode:forwards;
	-o-animation-fill-mode:forwards;
	animation-fill-mode:forwards;
}
/* Animation Times - Time for image to fade in
---------------------------------------------------- */
.fadeIn-05s {
	-webkit-animation-duration:.5s;
	-moz-animation-duration:.5s;
	-o-animation-duration:.5s;
	animation-duration:.5s;
}
.fadeIn-1s {
	-webkit-animation-duration:1s;
	-moz-animation-duration:1s;
	-o-animation-duration:1s;
	animation-duration:1s;
}

.fadeIn-5s {
	-webkit-animation-duration:5s;
	-moz-animation-duration:5s;
	-o-animation-duration:5s;
	animation-duration:5s;
}

/* Animation Delay - Time for image to be delayed
---------------------------------------------------- */

.fadeIn-Delay-05s {
	-webkit-animation-delay:.5s;
	-moz-animation-delay:.5s;
	-o-animation-delay:.5s;
	animation-delay:.5s;
}

.fadeIn-Delay-1s {
	-webkit-animation-delay:1s;
	-moz-animation-delay:1s;
	-o-animation-delay:1s;
	animation-delay:1s;
}

.fadeIn-Delay-5s {
	-webkit-animation-delay:5s;
	-moz-animation-delay:5s;
	-o-animation-delay:5s;
	animation-delay:5s;
}

/* Key Frames
---------------------------------------------------- */
@-webkit-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-moz-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@-o-keyframes fadeIn { from { opacity:0; } to { opacity:1; } }
@keyframes fadeIn { from { opacity:0; } to { opacity:1; } }


/* bouton navigation */
.button {
   border-top: 1px solid #96d1f8;
   background: #65a9d7;
   background: -webkit-gradient(linear, left top, left bottom, from(#3e779d), to(#65a9d7));
   background: -webkit-linear-gradient(top, #3e779d, #65a9d7);
   background: -moz-linear-gradient(top, #3e779d, #65a9d7);
   background: -ms-linear-gradient(top, #3e779d, #65a9d7);
   background: -o-linear-gradient(top, #3e779d, #65a9d7);
   padding: 5px 10px;
   -webkit-border-radius: 8px;
   -moz-border-radius: 8px;
   border-radius: 8px;
   -webkit-box-shadow: rgba(0,0,0,1) 0 1px 0;
   -moz-box-shadow: rgba(0,0,0,1) 0 1px 0;
   box-shadow: rgba(0,0,0,1) 0 1px 0;
   text-shadow: rgba(0,0,0,.4) 0 1px 0;
   color: white;
   font-size: 14px;
   font-family: 'Lucida Grande', Helvetica, Arial, Sans-Serif;
   text-decoration: none;
   vertical-align: middle;
   }
.button:hover {
   border-top-color: #28597a;
   background: #28597a;
   color: #ccc;
   }
.button:active {
   border-top-color: #1b435e;
   background: #1b435e;
   }