/********************************/
/*   RESET
/********************************/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {  margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; background: transparent; }

body { line-height: 1;}
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
:focus { outline: 0; }
ins { text-decoration: none; }
del { text-decoration: line-through; }

table { border-collapse: collapse; border-spacing: 0; }


/********************************/
/*   GENERAL
/********************************/

body {
	color: #000;
	font: normal 12px Arial, Verdana, Helvetica, Sans-Serif;
	background: url(img/body_bg.png) repeat-x 0 0 #1657A2;
}

a        { color: #ff4200; text-decoration: underline; cursor: pointer; }
a:hover	 { color: #2983e8; text-decoration: underline; }
a:active { color: #2983e8; text-decoration: underline; }
a:focus	 { color: #2983e8; text-decoration: underline; }

.newline { display: block; clear: both; line-height: 1px; font-size: 1px; height: 0; }

.dblock { display: block; }
.left  { float: left; }
.right { float: right; }
.center { text-align: center; }

img.left { margin-right: 10px; }
img.right {	margin-left: 10px; }
img.center { display: block; margin: 0 auto; text-align: center; padding-bottom: 8px; }

h1 { color: #0d418d; font-size: 25px; background: url(img/page/sigle.gif) no-repeat 0 3px; padding: 0 0 0 60px; margin: 0 0 20px 0; }
h2 { color: #333; font-size: 13px; }
h3 { font-size: 12px; margin-bottom: 10px; }

.spacer20 { clear: both; height: 20px; }

/********************************/
/*   TOP SITE
/********************************/

#topsite { height: 28px; background: black; }
#topsite .wrap { width: 1000px; margin: 0 auto; }

#lienref { float: left; line-height: 25px; font-size: 11px; color: white; margin-left: 15px; display: inline; }
#lienref a { color: #FFF; text-decoration: none; }
#lienref a:hover { text-decoration: underline; }

#lienref strong { color: #b5bac2; text-transform: uppercase; padding-right: 5px; }

#topsite .addthis_button { float: right; margin-top: 5px; margin-right: 15px; display: inline; } 


/********************************/
/*   GLOBAL
/********************************/

#global { 
	width: 970px; 
	margin: 0 auto; 
	padding: 0 15px; 
	background: url(img/global_bg.png) repeat-x 0 100% white;
	overflow: hidden;
	zoom: 1;
}

/********************************/
/*   HEADER
/********************************/

#header { height: 135px; position: relative; }

#baseline { float: left; width: 225px; overflow: hidden; line-height: 25px;  }

#logo { position: absolute; top: 27px; left:0; }

#banner { position: absolute; top: 27px; right:0; width: 728px; height: 90px; /*background: url(img/banner.png) no-repeat 0 0; */ }
#banner img, #banner object { margin: 0 auto; text-align: center; }

#banner .pub { position: absolute; top: 0; right: -10px; height: 90px; width: 8px; background: url(img/pub_vrt.gif) no-repeat 0 50%; }


/********************************/
/*   LIEN HAUT
/********************************/

#lienhaut { float: right; width: 728px; color: #2983e8; text-align: right; height: 25px; }

ul.raccourci { 
	float: right; 	
	position: relative;
	z-index: 99;
}

ul.raccourci li { 
	float: left; 
	background: url(img/pipe.gif) no-repeat 100% 50%;
	padding: 0 5px;
	height: 25px;
	line-height: 25px;
}

ul.raccourci ul li { background: none; }

ul.raccourci li#raccAutres { 
	background: url(img/puce_downarrow.gif) no-repeat 100% 50%;
	padding: 0 13px 0 5px;
}

ul.raccourci li.hover,
ul.raccourci li:hover {
	position: relative;
	z-index: 599;
	cursor: pointer;
}

ul.raccourci ul {
	visibility: hidden;
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 598;
	text-align: left;
	width: 120px; 
	background: #FFF; 
	border: 1px solid #2983E8;
}

ul.raccourci ul li { float: none; height: auto; line-height: 15px; font-size: 11px; padding: 2px 5px;}

ul.raccourci li:hover > ul { visibility: visible; }

ul.raccourci a { text-decoration: none; color: #000; }
ul.raccourci a:hover { text-decoration: none; color: #2983e8; }


/********************************/
/*   NAV
/********************************/

#nav {  
	width: 970px; 
	height: 40px; 
	background: url(img/nav_bg.png) no-repeat 0 0;
	position: relative;
	z-index: 900;

}

/* .dropdown >> css dédiée */

.communaute { float: right; height: 40px; padding-right: 10px; }
.communaute li { display: inline; color: #FFF; line-height: 35px; padding: 0 5px; }
.communaute li.twitter { background: url(img/ico_twitter.gif) no-repeat 0 1px; padding-left: 15px; }
.communaute li.newsletter { background: url(img/ico_mail.gif) no-repeat 0 2px; padding-left: 17px; }
.communaute li.rss { background: url(img/ico_rss.gif) no-repeat 0 2px; padding-left: 17px; }

.communaute a { color: #FFF; text-decoration: none; }
.communaute a:hover { color: #FFF; text-decoration: underline; }



/********************************/
/*   CDF
/********************************/

#cdf { height: 25px; font-size: 11px; line-height: 25px; }
#cdf a { color: #2983e8; text-decoration: none; }
#cdf a:hover { color: #ff4200 }

/********************************/
/*   MAIN
/********************************/

#main { float: left; width: 655px;  }


/********************************/
/*   VALUE
/********************************/

#value { width: 645px; height: 240px; padding: 5px; background: url(img/value_bg.png) no-repeat 0 0; position: relative; z-index:2;}

#value .illustration { float: left; font-size:0;}

#value ul { position: absolute; right: 5px; top: 5px; width: 230px; color: #333; }

#value ul li { height: 60px; width: 230px; float: left; background: url(img/value_btn.png) no-repeat 0 0;  overflow: hidden; }

#value ul li a { display: block; height: 60px; padding: 0 10px 0 50px; color: #333; text-decoration: none; }

#value ul li a:hover,
#value ul li.liElemSel { background: url(img/value_btn.png) no-repeat 0 100%; color: #FFF; }

#value ul li.liElemSel a { color: #FFF; }

#value span.titre { display: block; font-size: 13px; font-weight: bold; padding-top: 10px; }
#value span.soustitre { display: block; font-size: 11px; }


/********************************/
/*   ACTUALITES
/********************************/

#actualites { width: 655px; height: 250px; overflow: hidden; background: url(img/actu_hp_bg.png) no-repeat 0 0; margin: 20px 0; }

#actualites ul { height: 26px;  margin: 4px 0 0 10px; }

#actualites li { float: left; margin-right: 5px; background: url(img/actu_hp_onglet.png) no-repeat 0 0; }
#actualites li.tabSel { background: url(img/actu_hp_onglet.png) no-repeat 0 100%; }

#actualites li a { 
	float: left; 
	height: 26px; 
	width: 170px;
	color: #FFF;
	font-size: 13px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;
	line-height: 23px;
}

#actualites li.tabSel a { color: #333; }

#actualites .panel { clear: both; padding-top: 15px; }
 
#actualites .article { float: left; width: 200px; margin-left: 13px;  display: inline; }

/********************************/
/*   BLOC HP INFO
/********************************/

#bloc-info { width: 300px; float: left; }
#bloc-info .inner { height: 165px;  /*185-20*/overflow: hidden; }






/********************************/
/*   BLOC MEDIA
/********************************/

#medias { 
	width: 340px; 
	height: 220px; 
	float: right; 
	background: url(img/media_hp_bg.png) no-repeat 0 0; 
	overflow: hidden; 
}


/*ONGLETS*/

#mediasonglet { height: 26px;  margin: 4px 0 0 10px;  }
#mediasonglet li { float: left; margin-right: 5px; background: url(img/media_hp_onglet.png) no-repeat 0 0;  }
#mediasonglet li.ongletSel { background: url(img/media_hp_onglet.png) no-repeat 0 100%; }

#mediasonglet li a { 
	float: left; 
	height: 26px; 
	width: 140px;
	color: #FFF;
	font-size: 13px;
	font-weight: bold;
	text-decoration: none;
	text-align: center;

}

#mediasonglet li.ongletSel a { color: #333; }


/*SLIDER*/

#galerie1, #galerie2 { position: relative; zoom:1; margin-top: 20px; }

.slider { margin-left: 34px; }

.slider ul { height: 135px; overflow: hidden; }

.slider li { width: 272px; height: 135px; overflow: hidden; }	

.slider li table { height: 135px; }


/*ARROWS*/

#prevBtn, #nextBtn,
#prevBtn2, #nextBtn2 { display: block; overflow: hidden; text-indent: -8000px; width: 19px; height: 135px; position: absolute; }	

#prevBtn, #prevBtn2 { left: 14px; top: 0; }		
#nextBtn, #nextBtn2 { right: 15px; top: 0; }

#prevBtn a, #nextBtn a,
#prevBtn2 a, #nextBtn2 a { display: block; width: 19px; height: 135px; }

#prevBtn a, #prevBtn2 a  { background: url(img/media_hp_arrows.png) no-repeat 0 0; }	
#nextBtn a, #nextBtn2 a  { background: url(img/media_hp_arrows.png)  no-repeat -58px 0; }	

#prevBtn a:hover, #prevBtn2 a:hover  { background: url(img/media_hp_arrows.png) no-repeat -29px 0; }	
#nextBtn a:hover, #nextBtn2 a:hover  { background: url(img/media_hp_arrows.png)  no-repeat 100% 0; }




/********************************/
/*   W300
/********************************/

.w300 h2 { height: 30px; font-size: 13px; padding: 0 15px; line-height: 27px; background: url(img/aside_header.png) no-repeat 0 0; color: #333; }
.w300 h2.bleu { background: url(img/aside_header.png) no-repeat 0 100%; color: #FFF; }
.w300 .inner { border-left: 1px solid #cdcdcd; border-right: 1px solid #cdcdcd; background: white; padding: 10px 15px; zoom:1; }
.w300 .closer { height: 5px; overflow: hidden; background: url(img/aside_closer.gif) no-repeat 0 0; }

/********************************/
/*   ASIDE
/********************************/

#aside { float: right; width: 300px; }


/********************************/
/*   AVANTAGES CLUB
/********************************/

#club.hp .inner { height: 195px; /*215-20*/ }

a.btn-membre { 
	display: block; 
	width: 260px; 
	height: 50px;
	background: url(img/membre_btn.png) no-repeat 0 0;
	text-align: center;
	color: #FFF !important;
	text-decoration: none !important;
	font-weight: bold;
	font-size: 18px;
	line-height: 45px;
	margin: 10px 0;
}

a.btn-membre:hover { background: url(img/membre_btn.png) no-repeat 0 100%; }


/********************************/
/*   CARRE PUB
/********************************/

#carrepub { margin-top: 10px; height: 260px;  font-size: 0; }
#carrepub .pub { height: 10px; overflow: hidden; background: url(img/pub_hzt.gif) no-repeat 50% 0; }

/********************************/
/*   TAG CLOUD
/********************************/

#tagcloud { margin-top: 20px; }
#tagcloud .inner { height: 165px; /*185-20*/}
#tagcloud a { text-decoration: none; }


/********************************/
/*  LIEN DROITE
/********************************/

#liendroite { margin-bottom: 20px; }

#liendroite li { background: url(img/liendroite_bg.png) no-repeat 0 100%; }

#liendroite a { display: block; font-weight: bold; text-decoration: none; }
#liendroite a:hover { background: url(img/liendroite_bg.png) no-repeat -300px 100%;  }

#liendroite span.lien { display: block; padding: 7px 10px 7px 40px; background: url(img/page/puce_bleu.gif) no-repeat 15px 5px; }

#liendroite li.last { background: url(img/liendroite_bg_last.png) no-repeat 0 100%; }
#liendroite li.last a:hover { background: url(img/liendroite_bg_last.png) no-repeat -300px 100%;  }

/********************************/
/*  PARTENAIRES
/********************************/

#partners { clear: both; height: 80px; background: url(img/partner_bg.png) no-repeat 0 0; margin: 20px 0; }
#partners h2 { float: left; width: 110px; color: #333; font-size: 13px; padding: 30px 0 0 20px;   }

#partners img { vertical-align: middle; padding: 0 10px; }
#partners a { text-decoration: none !important; }

#partners .marquee { float: left; width: 800px; padding: 20px 0 0 20px;   }

/********************************/
/*  FOOTER
/********************************/

#footer { width: 1000px; margin: 0 auto; background: url(img/footer_bg.png) repeat-x 0 0; overflow: hidden; zoom:1; }

/* PLAN SITE */
#plansitebas { float: left; width: 700px; background: url(img/footer_arrow.gif)  no-repeat 30px 0; }

#plansitebas a { display: block; color: #333; font-size: 11px; }
#plansitebas a:hover { color: #fff; }

#plansitebas td { padding: 30px 10px 30px 30px; }

#plansitebas .titre a { color: #FFF; text-decoration: none; text-transform: uppercase; font-weight: bold; font-size: 13px; }

/* LOGO BAS */
#logobas { padding: 20px 0 0 0; }

/* MENTIONS */
#mentions { clear: both; height: 40px; padding: 10px 0 0 0; margin: 0 15px; background: url(img/footer_line.gif) repeat-x 0 0; font-size: 11px; }

#mentions ul { text-align: center; }
#mentions li { display: inline; color: #333;  }
#mentions a { color: #333; text-decoration: none; }
#mentions a:hover { color: #2983E8; }

#logo-Reed { float: left; }
#logo-OJD { float: right; font-size: 10px; }
#logo-OJD img { vertical-align: middle; position: relative; }

#footer-alpha{
	padding-left:30px;
	padding-bottom:30px;
}

#footer-alpha a{
color:#333333;
font-size:11px;
}

#footer-alpha a:hover{
color:#FFFFFF;
}


#footer-alpha span{color:#FFFFFF;font-size:13px;font-weight:bold;}



/********************************/
/*  REFLET
/********************************/

#reflet { clear: both; width: 1000px; height: 35px; margin: 0 auto; background: url(img/reflet_site.png) no-repeat 0 0;}



/********************************/
/*   BLOC CENTER
/********************************/

#bloc-center { padding: 15px 0; }

#bloc-center .wrap { overflow: hidden; zoom: 1; margin-bottom: 15px; } 
#bloc-center .inner { overflow: hidden; zoom: 1; padding: 10px 15px; }

#bloc-center .opener { background: url(img/page/opener_left.gif) no-repeat 0 0; padding-left: 5px; height: 5px; overflow: hidden; }
#bloc-center .opener div { background: url(img/page/opener_right.gif) no-repeat 100% 0; height: 5px; }

#bloc-center .closer { background: url(img/page/closer_left.gif) no-repeat 0 0; padding-left: 5px; height: 5px; overflow: hidden; }
#bloc-center .closer div { background: url(img/page/closer_right.gif) no-repeat 100% 0; height: 5px; }

.wrap h2 { background: url(img/page/puce_orange.gif) no-repeat 0 0; color: #2983e8; padding: 0 0 10px 25px; }
.wrap h2 span.bg { display: block; padding: 6px 15px 8px 10px; }

/* STYLE 1 : en-tête bleue */
.style1 h2 { background: url(img/page/h2_left_bleu.png) no-repeat 0 0; padding: 0 0 0 5px; color: #FFF; }
.style1 h2 span.bg { background: url(img/page/h2_right_bleu.png) no-repeat 100% 0 ; }

.style1 .inner { border-left: 1px solid #cdcdcd; border-right: 1px solid #cdcdcd; background: white; }


/* STYLE 2 : en-tête blanche */
.style2 h2 { background: url(img/page/h2_left_blanc.png) no-repeat 0 0; padding: 0 0 0 5px; border-bottom: 1px solid #cdcdcd; }
.style2 h2 span.bg { background: url(img/page/h2_right_blanc.png) no-repeat 100% 0 ; }

.style2 .inner { border-left: 1px solid #cdcdcd; border-right: 1px solid #cdcdcd; background: white; }


/* STYLE 3 : fond bleu */
.style3 h2 { background: url(img/page/puce_orange_2.gif) no-repeat 0 0; color: #FFF; }

.style3 .inner { background: url(img/page/inner_bg_bleu.gif) repeat-x 0 0 #1F7BE5; color: #FFF; }

.style3 .opener { background: url(img/page/opener_left_bleu.gif) no-repeat 0 0 !important; }
.style3 .opener div { background: url(img/page/opener_right_bleu.gif) no-repeat 100% 0 !important; }

.style3 .closer { background: url(img/page/closer_left_bleu.gif) no-repeat 0 0 !important;  }
.style3 .closer div { background: url(img/page/closer_right_bleu.gif) no-repeat 100% 0 !important;  }


/* GESTION DES COLONNES */
.w50 { float : left; clear : left; width : 49%; }
.w50-newline { float : right; clear : right; width : 49%; }
.w33-first { float : left; display : inline; width : 32%; }
.w33-2 { float : left; display : inline; width : 32%; margin-left : 2%;  }
* html .w33-2 { margin : 0 0 0 1%; } /*Hack ie6*/
.w33-newline { float : right; display : inline; clear : right; width : 32%; }

/* DIVERS */
img.style1 { float: left; margin-right: 10px; }
img.style2 { float: right; margin-left: 10px; }




/*********************************************/
/*   MENTIONS LEGALES - DONNEES PERSONNELLES
/*********************************************/
#mention
{
}

#mention h2
{
	font-size:14px;
	margin: 10px 0 5px 0;
}