﻿* {
 margin: 0;
 padding: 0;
}

body {
 font-family: Arial, Helvetica, sans-serif;
 font-size: 12px;
 line-height: 18px;
}

.mixte {
 background: url(image/bg.png) no-repeat top center;
}

.vtt {
 background: url(image/bgvtt.png) no-repeat top center;
}

.cyclo{
 background: url(image/bgcyclo.png) no-repeat top center;
}

.route{
 background: url(image/bgroute.png) no-repeat top center;
}

a img{
 border: none;
}

#area {
 width: 1000px;
 margin: auto;
 padding-top: 80px;
}

#header {
 width: 100%;
 height: 50px;
 background: url(image/header.png) no-repeat; 
 padding-top: 2px;
}

#menu ul {
 margin:0;
 padding-top:0;
 list-style-type:none;
 text-align:center;
 z-index: 1;
}
#menu li {
 float:left;
 margin:auto;
 padding:0;
 }
#menu a {
 font-size: 14px;
 display:block;
 width:155px;
 height: 40px;
 padding-top: 10px;
 color:white;
 text-decoration:none;
 padding:5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}

#menu a:hover {
 font-size:18px;
 color: #F60;
 display:block;
 width:155px;
 height: 40px;
 padding-top: 10px;
 text-decoration:none;
 padding:5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}

#menu h3 {
 display:block;
 width:155px;
 height: 40px;
 padding-top: 10px;
 color:white;
 text-decoration:none;
 padding:5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
#menu h3:hover {
 font-size:18px;
 color: #F60;
 display:block;
 width:155px;
 height: 40px;
 padding-top: 10px;
 text-decoration:none;
 padding:5px;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
.menu {
 border-right: 1px solid white;
 }

.bouton:hover {
  height: 50px;
  width: 161px;
  border-left:#CCC solid 1px;
  border-right:#CCC solid 1px;
  border-bottom:#CCC solid 1px;
  background: #ffffff ;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
  }
.bouton {
  height: 50px;
  width: 161px;
  border-left:#1F1F1F solid 2px;
  border-right:#1F1F1F solid 2px;
  border-bottom:#1F1F1F solid 2px;
  background: #191919 ;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
  }

#menu ul li ul {
 display:none;
 }
#menu ul li:hover ul {
 display:block;
 }
#menu li:hover ul li {
 float:none;
 }
#menu li ul {
 position:absolute;
 }
#menu {
 height:15px;
 }

#slider {
 width: 100%;
 height: 302px;
 background: url(image/slider.png) no-repeat;
 padding-top: 1px;
}

#selection{
 height: 220px;
 padding-left: 135px;
}

#selection img{
 margin-right: 10px;
 margin-left: 10px;
 }
 
 #clear{
  clear: both;
 }
 
 #photo {
  float: left; 
  text-align: center;
  width: 288;
  height: 192;  
  margin: 22px;
 }
 
#content {
 width: 999px;
 min-height: 320px;
 background: url(image/content.png) ;
}

#content img{
 padding : 0 5px 0 5px;	
 }

#content hr {
	margin-left:62px;
	color:#F60;
	background-color:#F60;
	border-color:#F60;
}

#content a{
 text-decoration: none;
 color: #F60;
}

#content p{
 color: white;
 margin: 0 10px 0 10px;
 padding: 5px 0 0 0;
}

#contenti h3{
 margin-left: 20px;
 color: white;
 float:left;
}

#contenti span{
 float: right;
 margin-right: 15px;
 color: white;
}

#contenti p{
 display: block;
 margin-top: 7px;
 font-size: 13px;
 margin-left: 15px;
 color: white;
 text-align:justify;
}

#contenti a{
 text-decoration: none;
 color: #F60;
}

#contenti {
 width: 999px;
 min-height: 320px;
 background: url(image/content.png);
}

.left {
 width: 199px;
 min-height:320px;
 float: left;
 border-right: 1px solid white;
 color: white;
 
}

.left h2{
 font-size: 16px;
 text-align: center;
 text-decoration: none;
}

.left a{
 display: block;
 margin-left: 30px;
 color: white;
 text-decoration: none;
 font-size: 12px;
 padding: 0;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}

.left a:hover{
 display: block;
 margin-left: 30px;
 background : #ffffff;
 color: #F60;
 text-decoration: none;
 font-size: 12px;
 padding: 0;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}

.right {
 min-height:320px;
 width: 799px;
 float: left;
}

.right h3{
 margin-left: 20px;
 color: white;
 font-size: 16px;
 float:left;
}

.right span{
 float: right;
 margin-right: 15px;
 color: white;
}

.right p{
 display: block;
 margin-top: 7px;
 font-size: 14px;
 margin-left: 15px;
 color: white;
}

.right_b {	
 background: url(image/puce.png) 0px 4px no-repeat;
 margin-left: 205px;
 margin-right: 5px;
}

.right_c {	
 background: url(image/puce.png) 0px 4px no-repeat;
 margin-left: 25px;
 margin-right: 5px;
}

#news {
 padding-top: 10px;
 width: 100%;
 height: 22px;
 background: url(image/footer.png) no-repeat;
}

#news h6{
 color: white;
 margin-left: 5px;
 margin-top : -4px;
 font-size: 12px;
}
#news a{
 color: #F60;
 text-decoration: none;
}

#footer {
 padding-top: 10px;
 width: 100%;
 height: 30px;
 background: url(image/footer.png) no-repeat;
}

#footer h6{
 color: white;
 text-align: center;
 font-size: 10px;
}

#consol {
 background: url(image/bg.png) no-repeat top center;
 height: 100%
}

#align {
 margin: auto;
 width: 500px;
 padding-top: 50px;	
}

#top {
 background: url(image/top.png) no-repeat;
 height: 18px;
 width: 1000px;
}

#bottom{
 background: url(image/bottom.png) no-repeat;
 height: 19px;
 width: 1000px;
 padding-top: 1px;
}

#nav {	
margin-left: 30%;
padding-top: 125px;
}

#nav li {
 list-style-type: none;
 width: 250px;
 float: left;	
}

#nav a{
 text-decoration: none;
 font-size: 16px;
 color: black;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}
#nav a:hover{
 text-decoration:none;
 font-size: 30px;
 color: black;
    -webkit-transition: all 300ms linear;
    -moz-transition: all 300ms linear;
    -o-transition: all 300ms linear;
    -ms-transition: all 300ms linear;
    transition: all 300ms linear;
}

#slider_container_2 {
 float: center; margin: auto; padding: 0px; width: 700px; background: url(../img/bg.png) no-repeat 0 0; z-index: 2; 
}

.SliderName_2 {
 float: center;
 width: 700px;
 height: 300px;
 overflow: hidden;
}

.SliderNamePrev_2 {
 background: url(../img/left.png) no-repeat left center;
 width: 50px;
 height: 300px;
 display: block;
 position: absolute;
 top: 0;
 left: 0;
 text-decoration: none;
}

.SliderNameNext_2 {
 background: url(../img/right.png) no-repeat right center;
 width: 50px;
 height: 300px;
 display: block;
 position: absolute;
 top: 0;
 right: 0;
 text-decoration: none;
}

.SliderName_2Description {
 padding: 0px;
 font-family: Tahoma,Arial,Helvetica;
 font-size: 14px;
 line-height: 30px;
 letter-spacing: 1px;
 text-align: center;
 color: #ffffff;
 text-shadow: 0 1px 3px #000000;
}

#SliderNameNavigation_2 {
 margin: 0; padding: 10px 0 0 0; height: 16px; text-align: center; overflow-y: hidden; 
}

#SliderNameNavigation_2 a:link, #SliderNameNavigation_2 a:active, #SliderNameNavigation_2 a:visited, #SliderNameNavigation_2 a:hover{
 margin: 0;
 padding: 0;
 font-size: 0;
 line-height: 0;
 text-decoration: none;
}

#SliderNameNavigation_2 a img{
 visibility: hidden;
 border: none;
 width: 16px;
 height: 16px;
 background: url(../img/bullet.png) no-repeat center center;
}

#SliderNameNavigation_2 a.active img{
 visibility: hidden;
 background: url(../img/bullet_active.png) no-repeat center center;
}

