@font-face {
	font-family: 'LeagueGothicRegular';
	src: url('../fonts/League_Gothic-webfont.eot');
	src: local('☺'), url('../fonts/League_Gothic-webfont.woff') format('woff'), url('../fonts/League_Gothic-webfont.ttf') format('truetype'), url('../fonts/League_Gothic-webfont.svg#webfontpm5EArBj') format('svg');
	font-weight: normal;
	font-style: normal;
}


body { position: relative; font-size: 11px; font-family: Arial; margin:0; padding: 0; background: url(../images/static/img-background.png) repeat; color: #333333; }

h1, h2, h3, h4, h5 p, ul, ol, li, fieldset, form { margin: 0; padding: 0; }

ul, ol, li { list-style-type: none; }

.clear { clear: both; }

a { outline: none; }
span.big { font-weight: bold; }

.allumage { position: absolute; bottom: -23px; left: 50%; margin-left: -230px; background: url(../images/static/img-allumage-top.png) no-repeat; width: 460px; height: 30px; display: block; }
.allumage2 { position: absolute; bottom: -30px; left: 50%; margin-left: -230px; background: url(../images/static/img-allumage-top.png) no-repeat; width: 460px; height: 30px; display: block; }


.menu { position: relative; margin-top: 20px; background: url(../images/static/img-menu.gif) repeat-x; height: 89px; }
.menu ul { position: relative; width: 690px; margin: 0 auto; background: url(../images/static/img-menu-bonhomme.png) 0px 5px no-repeat; height: 70px; display: block; padding:5px 0 0 70px; }
.menu ul .cachecache a { position: absolute; top:35px; left: 24px; width: 7px; height: 7px; display: block; }
.menu ul li { position: relative; float: left; border-right: 1px solid #D0D0D1; padding: 8px 35px 0 15px; }
.menu ul li.noborder { border: 0; padding-right: 0; }
.menu ul li h2 { font: 24px 'LeagueGothicRegular', Verdana, sans-serif; text-transform: uppercase; color: #333333; }
.menu ul li h2 a { color: #333333; text-decoration: none; }
.menu ul li h2 a:hover { color: #333333; text-decoration: underline; }
.menu ul li ul { background: url(../images/static/img-fleche-droite.png) 0 8px no-repeat; width: auto; padding: 0px 0 0 15px; height: 20px;}
.menu ul li ul li { position: relative; float: left; border: 0; padding: 0; font: 20px 'LeagueGothicRegular', Verdana, sans-serif; text-transform: none; color: #666666;  }
.menu ul li ul li a { color: #666666; text-decoration: none; }
.menu ul li ul li a:hover { color: #666666; text-decoration: underline; }
.menu ul li ul li.separation { padding: 0 3px; }

.container { position: relative; width: 950px; height: 460px; margin: 90px auto 0 auto; border: 1px solid #666666; background-color: #ffffff;  }

.hight { height: 490px; }
.normal { height: 460px; }

.container ul.submenu { position: absolute; top:-30px; right: 0; }
.container ul.submenu li { float: left; }
.container ul.submenu li.separation { color: #999999; padding: 0 4px; font-size: 20px;}
.container ul.submenu li a { color:#999999; font: 20px 'LeagueGothicRegular', Verdana, sans-serif; text-decoration: none; }
.container ul.submenu li a:hover { color:#ffffff; text-decoration: underline; }
.container ul.submenu li.on a { color:#ffffff;  font: 20px 'LeagueGothicRegular', Verdana, sans-serif; }
.container ul.submenu li.on a:hover { color:#ffffff;  font: 20px 'LeagueGothicRegular', Verdana, sans-serif; text-decoration: none; }

.container .content { position: relative; width: 950px;  overflow: hidden; z-index: 0; }
.container .subsin { position: absolute; top:-55px; background: url(../images/static/img-subsin.gif) no-repeat; width: 453px; height: 41px; display: block; }
.hpout { height: 470px;}

.prev { position: absolute; top: 230px; left: -20px; display: block; background: url(../images/static/img-fleches.gif) 0 -40px no-repeat; width:14px; height: 21px; }
.prev:hover { position: absolute; top: 230px; left: -20px; display: block; background: url(../images/static/img-fleches.gif) 0 0px no-repeat; width:14px; height: 21px; }
.next { position: absolute; top: 230px; right: -20px; display: block; background: url(../images/static/img-fleches.gif) -55px -40px no-repeat; width:14px; height: 21px; }
.next:hover { position: absolute; top: 230px; right: -20px; display: block; background: url(../images/static/img-fleches.gif) -55px 0px no-repeat; width:14px; height: 21px; }
.next span { display: none; }
.next:hover span { position: absolute; display: block; top:-35px; background: url(../images/static/img-bulle.png) no-repeat; width: 68px; height: 35px; padding: 3px 0 0 7px; color: #333333; text-decoration: none; font: 20px 'LeagueGothicRegular', Verdana, sans-serif; }


/* HP */
.accroche { position: absolute; top:-30px; right: 0; background: url(../images/static/img-accroche.png) no-repeat; width: 300px; height: 37px; display: block;}
.niveau_horizontal { position: absolute; width: 950px; height: 460px; display: block; }
.anim_hp { position: relative; padding: 35px 0 0 35px; }
.bouton_klassik a { position: absolute; top:40px; right: 170px; background: url(../images/static/img-klassik.png) no-repeat; width: 255px; height: 84px; display: block; cursor: pointer; }
.bouton_double a { position: absolute; top:149px; right: 135px; background: url(../images/static/img-double.png) no-repeat; width: 224px; height: 77px; display: block; cursor: pointer; }
.bouton_triple a { position: absolute; top:250px; right: 100px; background: url(../images/static/img-triple.png) no-repeat; width: 230px; height: 80px; display: block; cursor: pointer; }
.bouton_triple_marron a { position: absolute; top:255px; right: 100px; background: url(../images/static/img-triple-marron.png) no-repeat; width: 230px; height: 80px; display: block; }
.anim_team { position: absolute; top:378px; right:80px; z-index: 100; }
.video_hp { position: relative; width: 755px; margin: 10px auto; border: 1px solid #CCCCCC; padding: 5px; }
.video_hp h5 { font-size: 14px; text-align: center;}


/* VIDEOS */
.niveau_vertical { position: absolute; width: 950px; height: 470px; display: block;}
.niveau_horizontal1, .niveau_horizontal2, .niveau_horizontal3, .niveau_horizontal4 { position: absolute; width: 950px; height: 510px; text-align: center;  display: block; }
ul.videos { position: relative; margin: 0; padding: 0; overflow: hidden; }
ul.videos li { position: relative; float: left; width: 225px; height: 190px; }
ul.videos li.borderight { border-right: 1px solid #D0D0D1; }
ul.videos li.borderbottom { border-bottom: 1px solid #D0D0D1; }
ul.videos li h2 { font: 20px 'LeagueGothicRegular', Verdana, sans-serif; text-align: left; padding: 5px 0 5px 10px; color: #666666; }
ul.videos li img { border: 0; }
ul.videos li .nblectures { float: left; width: 90px; font-size: 11px; padding:5px 0 0  5px; }
ul.videos li .play { float: right; width: 45px; background: url(../images/static/img-play.png) no-repeat 0 5px; padding: 5px 0 0 20px; font-size: 12px; font-weight: bold; text-transform: uppercase; text-align: left; line-height: 17px; height: 17px; }
ul.videos li .play a { color: #333333; }

.video_content { float: left; width: 250px; height: 580px; text-align: left; padding: 5px 0 0 25px; background: url(../images/static/img-ligne-vertical.png) no-repeat right 141px; }
.video_content h2 { padding-top: 160px; padding-right: 15px; font-size: 14px; }
.video_content p { padding: 10px 30px 10px 0; line-height: 20px; }
.video_content h5 { position: absolute; top:320px; left: 20px; background: url(../images/static/img-menu-bonhomme.png) 0px 0px no-repeat; padding:30px 0 0 50px; font: 20px 'LeagueGothicRegular', Verdana, sans-serif; height: 40px; }
.video_content h5 a { color: #333333; text-decoration: none; }
.video_content h5 a:hover { color: #333333; text-decoration: underline; }
.video_player { float: right; width: 650px; padding:45px 20px 0 0; z-index: 0; }

#share_video { height: 290px; padding: 10px; }
#share_video h2 { font: 20px 'LeagueGothicRegular', Verdana, sans-serif; color: #333333; padding: 10px 0 0 0; }
#share_video p { font-size: 12px; }
#share_video input.text { border: 1px solid #333333; height: 30px; width: 500px; padding: 5px; }
#share_video textarea { border: 1px solid #333333; height: 60px; width: 500px; padding: 5px; }


/* VELOS */
.bande-bleue { position: absolute; top:-3px; height: 3px; width: 950px; background-color: #00A0C6; }
.bande-verte { position: absolute; top:-3px; height: 3px; width: 950px; background-color: #8AC91A; }
.bande-noire { position: absolute; top:-3px; height: 3px; width: 950px; background-color: #4C4C4C; }
.bande-marron { position: absolute; top:-3px; height: 3px; width: 950px; background-color: #836212; }


.fixe_velo { position: absolute; width: 310px; height: 490px; background: url(../images/static/img-ligne-vertical.png) no-repeat right 161px; padding:0 5px; z-index: 60; }
.fixe_velo h1 { font-size: 12px; width: 300px; padding-left: 5px; }
.fixe_velo h2 { font-size: 12px; width: 290px; padding-left: 5px; }
.fixe_velo h5.klassik { background: url(../images/static/img-klassik-m.png) no-repeat; width: 168px; height: 55px; display: block; text-indent: -9999em; }
.fixe_velo h5.double { background: url(../images/static/img-double-m.png) no-repeat; width: 155px; height: 50px; display: block; text-indent: -9999em; }
.fixe_velo h5.triple { background: url(../images/static/img-triple-m.png) no-repeat; width: 155px; height: 55px; display: block; text-indent: -9999em; }
.fixe_velo h5.triple_marron { background: url(../images/static/img-triple-marron-m.png) no-repeat; width: 155px; height: 55px; display: block; text-indent: -9999em; }
.facebook { position: absolute; top:35px; left: 200px; z-index: 70; }
.fixe_velo p { font-size: 11px; line-height: 16px; padding: 0px 25px 0 10px; text-align: justify; }
.fixe_velo .buy { position: absolute; bottom: 5px; left: 10px; background: url(../images/static/img-panier.png) no-repeat; height: 27px; padding: 20px 0 0 55px; font: 20px 'LeagueGothicRegular', Verdana, sans-serif; z-index: 100; }
.fixe_velo .buy a { text-decoration: none; color: #333333; }
.fixe_velo .buy a:hover { text-decoration: underline; }

.change_velo { position: relative; width: 650px; height: 490px; float: right; overflow: hidden; z-index: 50; }
.horizontal_velo1 { position: absolute; width: 650px; height: 490px; display: block; z-index: 5; padding-top: 27px;}

.caracteristique h3 { font-size: 14px; padding:0 20px 0 270px; margin: 0; }
.caracteristique p { line-height: 16px; padding: 5px 20px 0 270px; margin: 0; }
.triple h3 { color: #00A0C6; }
.triple-marron h3 { color: #836212; }
.double h3 { color: #4C4C4C; }
.klassik h3 { color: #8AC91A; }

.klassik .cadre { background: url(../images/static/img-detail-klassik-cadre.jpg) no-repeat 10px 0; height: 160px; }
.klassik .fourche { background: url(../images/static/img-detail-klassik-fourche.jpg) no-repeat 10px 0; height: 160px; }
.klassik .transmission { background: url(../images/static/img-detail-klassik-transmission.jpg) no-repeat 10px 0; height: 160px; }
.klassik .position { background: url(../images/static/img-detail-klassik-position.jpg) no-repeat 10px 0; height: 160px; }
.klassik .roue { background: url(../images/static/img-detail-klassik-roue.jpg) no-repeat 10px 0; height: 160px; }
.klassik .frein { background: url(../images/static/img-detail-klassik-freins.jpg) no-repeat 10px 0; height: 160px; }

.double .cadre { background: url(../images/static/img-detail-double-cadre.jpg) no-repeat 10px 0; height: 160px; }
.double .fourche { background: url(../images/static/img-detail-double-fourche.jpg) no-repeat 10px 0; height: 160px; }
.double .transmission { background: url(../images/static/img-detail-double-transmission.jpg) no-repeat 10px 0; height: 160px; }
.double .position { background: url(../images/static/img-detail-double-position.jpg) no-repeat 10px 0; height: 160px; }
.double .roue { background: url(../images/static/img-detail-double-roue.jpg) no-repeat 10px 0; height:160px; }
.double .frein { background: url(../images/static/img-detail-double-freins.jpg) no-repeat 10px 0; height: 160px; }

.triple-marron .cadre { background: url(../images/static/img-detail-triple-cadre.jpg) no-repeat 10px 0; height: 160px; }
.triple-marron .fourche { background: url(../images/static/img-detail-triple-fourche.jpg) no-repeat 10px 0; height: 160px; }
.triple-marron .transmission { background: url(../images/static/img-detail-triple-transmission.jpg) no-repeat 10px 0; height: 160px; }
.triple-marron .position { background: url(../images/static/img-detail-triple-position.jpg) no-repeat 10px 0; height: 160px; }
.triple-marron .roue { background: url(../images/static/img-detail-triple-freins.jpg) no-repeat 10px 40px; height: 270px; }

.triple .cadre { background: url(../images/static/img-detail-triple2-cadre.jpg) no-repeat 10px 0; height: 160px; }
.triple .fourche { background: url(../images/static/img-detail-triple2-fourche.jpg) no-repeat 10px 0; height: 160px; }
.triple .transmission { background: url(../images/static/img-detail-triple2-transmission.jpg) no-repeat 10px 0; height: 160px; }
.triple .position { background: url(../images/static/img-detail-triple2-position.jpg) no-repeat 10px 0; height: 160px; }
.triple .roue { background: url(../images/static/img-detail-triple2-freins.jpg) no-repeat 10px 40px; height: 270px; }

.niveau_vertical { position: absolute; width: 950px; height: 490px; display: block; }

.velo_video { position: relative; width: 755px; margin: 25px auto 10px auto; border: 1px solid #CCCCCC; padding: 5px; }
.velo_video h5 { font-size: 14px; text-align: center;}

.graphic-klassik { position: absolute; top:690px; left:10px; background: url(../images/static/img-graphic-klassik.png) no-repeat; width: 150px; height: 58px; display: block; }
.graphic-double { position: absolute; top:683px; left:10px; background: url(../images/static/img-graphic-double.png) no-repeat; width: 191px; height: 65px; display: block; }
.graphic-triple { position: absolute; top:686px; left:10px; background: url(../images/static/img-graphic-triple.png) no-repeat; width: 187px; height: 62px; display: block; }

.btwin-design { position: absolute; top:700px; right:10px; background: url(../images/static/img-btwin-design.png) no-repeat; width: 54px; height: 54px; display: block; }
.btwin-design2 { position: absolute; top:700px; right:10px; background: url(../images/static/img-btwin-design.png) no-repeat; width: 54px; height: 54px; display: block; }
