/*#############################################################
Site par F. Saillard

#############################################################*/


* {
	margin: 0;
	padding: 0;
}

body {
	
	background: url(Arcus_vol_02.jpg) no-repeat center fixed ; 
    background-size:cover;
	 margin:0;
  padding:0;
   -webkit-background-size: cover; /* pour anciens Chrome et Safari */
  background-size: cover; /* version standardisée */
	color: #543;
	font: normal 62.5% "Cantarell",sans-serif;
}



p,cite,code,ul {
	font-size: 1.2em;
	padding-bottom: 1.2em;
	text-align: justify;
}
h1 {
	font-size: 1.4em;
	margin-bottom: 4px;
	text-align: center;
}


h1,h2,h3 {
	color: #33CCFF;
	padding-top: 6px;
}

p
{
color: #FFFFFF;
font-size: 15px;
}


.container {
	margin: 0 auto;
	width: 1300px;
	padding-bottom :0px;
}


.header {
	background: url(gif.gif) repeat-x;
	height: 160px;
	margin: 0 auto;
	width: 1300px;
}

.title {
	padding: 10px;
	padding-left: 360px; 
}
.title h1 {
	color: #FFFFFF;
	font: normal 3.4em "Lucida Sans Unicode","Trebuchet MS",sans-serif;
}

/*placement du slide menu à gauche*/

.placementslide {
	
	float: left;
	
	
	}
	

	
	
	
	/*paragraphe presentation club*/
	
.paragraphe  {

filter:alpha(opacity=90); /* propriétaire IE */
-moz-opacity:0.90; /* propriétaire Firefox */
opacity:0.90; /* CSS3 */ 
background: #099 url(img/bgnavigation.gif) repeat-x;
font: bold 2.5em Verdana,sans-serif;
height: 250px;
width: 650px;
float: right;

margin-bottom : 15px;
margin-right : 0px;
padding: 15px;

border-radius: 7px 7px 7px 7px;
-webkit-border-radius:10px;
   -moz-border-radius:10px;
        border-radius:10px;
-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.75);        
   -moz-box-shadow:0px 0px 10px rgba(0,0,0,0.75);
        box-shadow:0px 0px 10px rgba(0,0,0,0.75);

}

/*paragraphe avec slider à l'intérieur*/

.paragraphe2  {

filter:alpha(opacity=90); /* propriétaire IE */
-moz-opacity:0.90; /* propriétaire Firefox */
opacity:0.90; /* CSS3 */ 
background: #099 url(img/bgnavigation.gif) repeat-x;
font: bold 2.5em Verdana,sans-serif;
height: 450px;
width: 1045px;
float: right;

margin-bottom : 35px;
margin-right : 0px;
padding-top: 15px;
padding-left:250px;


border-radius: 7px 7px 7px 7px;
-webkit-border-radius:10px;
   -moz-border-radius:10px;
        border-radius:10px;
-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.75);        
   -moz-box-shadow:0px 0px 10px rgba(0,0,0,0.75);
        box-shadow:0px 0px 10px rgba(0,0,0,0.75);
}

/*boutons du carousel*/



.carouselLeft {	
	display:none;
	background:url(rotate-left.png);	
	width:40px; height:40px;
	background-position: 0px 0px;
}
.carouselLeft:hover {		
	width:40px; height:40px;
	background-position: 0px 40px;
	cursor:auto;
}
.carouselRight {
	display:none;
	background:url(rotate-right.png);	
	width:40px; height:40px;
	background-position: 0px 0px;
}
.carouselRight:hover {	
	width:40px; height:40px;
	background-position: 0px 40px;
}


/*fin des boutons du carousel*/






/*boite menu à gauche avec slide = OK*/

ul:before{
content:"";
position:absolute;
z-index:100;
filter:alpha(opacity=40); /* propriétaire IE */
-moz-opacity:0.70; /* propriétaire Firefox */
opacity:0.70; /* CSS3 */ 
background:#099;
height:100%;
width:192px;
margin-top:-66px;
-webkit-border-radius:10px;
   -moz-border-radius:10px;
        border-radius:10px;
-webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.75);        
   -moz-box-shadow:0px 0px 10px rgba(0,0,0,0.75);
        box-shadow:0px 0px 10px rgba(0,0,0,0.75);
}

ul{
position:relative;
list-style:none;
width:182px;
padding:40px 0px;
margin-left:103px;
margin-top:26px;
}
ul li{
height:40px;
width:182px;
}
ul li a.menuLien{
position:absolute;
z-index:110;
font-weight:bold;
color:white;
font-size:1.5em;
padding-left:22px;
display:block;width:160px;height:40px;
text-decoration:none;
text-shadow:0px 0px 5px rgba(0,0,0,0.5);
letter-spacing:-1px;
}


/*la boite qui slide en bougeant vers la droite=ok*/
ul li div{
width:182px;height:220px;
padding:20px;padding-top:10px;
background:rgba(0,0,0,0.6);
overflow:hidden;
color:white;
position:absolute;top:-25px;left:0;z-index:50;
opacity:0;margin-top:10px;
-webkit-transition:1s left,1s width,1s opacity;
   -moz-transition:1s left,1s width,1s opacity;
     -o-transition:1s left,1s width,1s opacity;
        transition:1s left,1s width,1s opacity;
}

ul li:hover div{
left:197px; /*regle le decalage du slide à droite initialement 182*/
opacity:1;
width:276px; 
background:rgba(0,0,0,0.6);
}



ul li div h5{
	font-size:1.4em;
	color:#099;
	text-align:center;
		}



ul li div p{
	text-indent:15px;
	padding-top:10px;
	width:276px;
	overflow:hidden;
	font-size:1.4em;
	font-weight:normal;
	text-align:justify;
	}

ul li div p.lien{
	text-align:right;
	}
	
ul li div p.lien a{
	color:#c10;
	}

	
	/*fin de la boite à gauche avec slide = OK */
	
	
	




	
.auteur {
margin-top: 40px;
float: right;
margin-right: 390px;
	}



.footer {
    clear: both;
	background: url(pied__page.png) repeat-x;
	height: 160px;
	width: 1300px;
	padding-top: 35px;
	float : bottom;
	}