/* TABLE DES MATIÈRES:
	- Éléments à cacher
	- Éléments de base à personnaliser
	- Pied de page
	- Textes
----------------------------------------------------------------------------------------*/

/* ELEMENTS A CACHER 
--------------------------------------------------------------------------------------- */
#menu, #menuSec, #menuBas, #socialBookmarker, #bookmarkHoverPopup{
	position: absolute;
	visibility: hidden;
	display:none;
}
#rightColumn, .btDetail, .linkBack {
	position: absolute;
	visibility: hidden;
	display:none;
}

/* ELEMENTS DE BASE À PERSONNALISER 
--------------------------------------------------------------------------------------- */
html{font-family: Arial, Verdana, Tahoma;}

/* Réinitialisation des éléments */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img,abbr,acronym{border:0;}
address,caption,cite,code,dfn,th,var{font-style:normal;font-weight:normal;}
ol,ul{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
q:before,q:after{content:'';}
a:active,object,embed{outline:none;}

.both{clear:both;}

#conteneur {width:100%; text-align:left;}
	/* header - logo */
	#contentHeader {width:100%; height:317px; background:url(gx/bg_header.gif) top left repeat-x;}
		#header {position:relative; width:930px; height:317px; margin:0px auto 0px auto; z-index:10000;}
			#lgProCycle {position:relative; top:30px; z-index:1000;}
			#imgHeader {position:relative; left:21px; top:3px; width:909px; height:156px; z-index:10;} html* #imgHeader {top:6px;}
	
	/* contenu - colonne gauche - colonne droite */
	#contentBody {width:100%; background:#FFFFFF url(gx/bg_contentGradient.gif) top left repeat-x; clear: both;}
		#content {width:930px; min-height:250px; margin:0px auto 0px auto;} *html #content {height:250px;}
			#leftColumnHome {position:relative; width:564px; padding-bottom:50px;}
			#leftColumnGen {position:relative; width:544px; padding:0px 0px 50px 20px; z-index:1;}
				.zoneText {float:left; width:544px; margin-bottom:20px; padding:0px 10px; background:url(gx/m/bg_gradientTxt.gif) top left repeat-x;}
						

/* 01_100 : PAGE ACCUEIL
--------------------------------------------------------------------------------------- */
/* colonne gauche - choix du velociste - chronique du velociste - a la une */
#zoneChoixVelo { margin-bottom:18px;}
#zoneChoixVelo .choixVelo { padding: 30px 0px 20px 0px; }
#zoneChoixVelo .prix {
	color: #103D74;
	float: right;
	font-size: 14px;
	font-weight: bold;
	margin-top: -25px;
	padding-bottom: 10px;
}
#zoneChoixVelo .rabais {
	color: #780C1C;
	font-size: 16px;
	float: right;
}

h1.home {float:left; font-size:19px; color:#4c4c4c; margin:15px 0px 19px 0px;}
h1.home a, h1.home a:link, h1.home a:visited {color:#4c4c4c; text-decoration: none;}

h2.home {font-size:16px; color:#373737; font-weight:bold; text-transform:uppercase; margin:15px 0px 0px 0px; padding:0px;}
h2.home a, h1.home a:link, h1.home a:visited {color:#373737;}

/* 04_100 - 05_100 - 07_100 : PAGE SERVICES / CONSEILS / NOUVELLES
--------------------------------------------------------------------------------------- */
.listItem {width:541px; height:100%; border-bottom: 1px solid #dcdcdc; padding:10px 0px; cursor: pointer;}
.listItemLast {border:none;}
.listItem h2 a.titre, .listItem h2 a:link.titre, .listItem h2 a:visited.titre, .listItem h2 a:hover.titre {display: block; text-decoration:none; text-align:left; padding:4px 6px 4px 10px;}
.listItem:hover h2 a.titre {background:#679924; color:#FFF;}
.listItem:hover h2 a.titre .date {color:#FFF;}
.listItem p {display: block;	padding:0px 0px 0px 10px;}	
.listItem a.titre .date {float:right; width:100px; font-size:12px; color:#83b73e; text-align:right;}

	#img {float: left; width: 220px;}	
	#img img {display: block;}
	#txt {float: right; width: 478px;}	

.thumbs {float:left; width:110px; margin: 0 0 10px 0; cursor: pointer;}
.thumbs img {display: block;}
.thumbs a {border: 1px solid #CCC; height: 70px; overflow: hidden; display: block; float: left; /*margin: 1px 0;*/}
.thumbs a:hover {border: 1px solid #F00;}

.imdetailborder {float:left; display: block; margin:0 20px 23px 0; border: 3px solid #CCC;}	

/* 02_100 : PAGE BOUTIQUE
--------------------------------------------------------------------------------------- */
#carteBoutique {position:relative; width:565px; height:295px; margin:0px 0px 12px 0px; border:1px solid #999; z-index:1;}
#carteBoutiqueSmall {width:327px; height:250px; border:1px solid #dadada;}	
#carteBoutiqueSmall .inner {margin: 5px 0 0 5px;}
#carteBoutiqueSmall .inner .theMap {width:320px; height:205px; overflow:hidden;}	
#carteBoutiqueSmall .nomap {background: #FFF; text-align: center; width:320px; height:205px; overflow:hidden; line-height: 205px;}	

#boxMap {margin:0px 0px 7px 0px;}

/* sous menu module_searchColumn - page 02_110 */
#boxSousMenu {float:left; margin:7px 0px 7px 0px;}
	ul#sMenu {float:left; margin:0px; padding:0px;}
		ul#sMenu li {width:327px; color:#6f6f6f; font-weight:bold; text-indent:10px; list-style:none; margin:0px;}
		ul#sMenu li a {display:block; color:#6f6f6f; padding:10px 10px; background:url(gx/ic_arrow.gif) 10px 17px no-repeat;}
		ul#sMenu li a:hover, ul#sMenu li a.actif  {color:#97bf0e; text-decoration:none; background:#ececec url(gx/ic_arrow.gif) 10px 17px no-repeat;;}

#boxBoutiqueInfo {float:left;}
	.infoTop {width:330px; height:6px; background:url(gx/02/bg_boutiqueInfoTop.gif) top left no-repeat;}
	.infoContent {width:303px; min-height:65px; padding:6px 12px 6px 12px; border-left:1px solid #dadada; border-right:1px solid #dadada; background:#FFFFFF url(gx/02/bg_boutiqueInfoContent.gif) bottom left repeat-x;} 
	.infoContent2 {width:327px; min-height:65px; padding:0px 0px 6px 0px; border-left:1px solid #dadada; border-right:1px solid #dadada; background:#FFFFFF url(gx/02/bg_boutiqueInfoContent.gif) bottom left repeat-x;} 
	*html .infoContent {height:65px;}
	*html .infoContent2 {height:65px;}
		.infoContent p {color:#8a8a8a; margin:0px; padding:0px;}
		.infoContent p a {color:#8a8a8a;}
		.infoContent p a:hover {color:#71a32c;}
		.infoContent2 UL { padding: 10px; }
		.infoContent2 H2 { padding: 10px 0px 0px 10px }
	.infoBottom {width:330px; height:6px; background:url(gx/02/bg_boutiqueInfoBottom.gif) top left no-repeat;}

.cadrePhotoEquipe img {border:5px solid #cdcdcd;}	
.heureOuverture {background:#6a9b28; padding: 10px 14px 10px 14px; color: #FFF; line-height: 22px;}

#boxEvenement {float:left; margin:7px 0px 7px 0px;}

/* 03_100 : PAGE VELO
--------------------------------------------------------------------------------------- */
.rowItemVelo {width:541px; padding:10px;}
	.box1 {background:transparent url(Gx/03/box1_bg.gif) repeat-y top left; width:338px; text-align: center;}
		.box1 img {margin: 0 auto; display: block;}
		.box1 div {height:121px; overflow: hidden;}
	.boxtexte {text-align: justify; padding: 0 6px;}

h2.miele, h2.miele a {font-size:16px; color:#ed001f; text-decoration:none; text-transform:uppercase;}
h2.rockmountain, h2.rockmountain a {font-size:16px;  color:#3e5e95; text-decoration:none; text-transform:uppercase;}	

/* 06_100 : CHOIX DES VÉLOCISTES
--------------------------------------------------------------------------------------- */

#pageChoixVelo .choixVelo {
	border-bottom:1px solid #DCDCDC;
	padding: 10px; 
}
#pageChoixVelo .prix {
	color: #103D74;
	font-size: 14px;
	font-weight: bold;
	padding-bottom: 10px;
}
#pageChoixVelo .rabais {
	color: #780C1C;
	font-size: 16px;
}
#pageChoixVelo .photo {
	float: right;
	padding-top: 20px;
	width: 150px;
}

/* 00_888 : PLAN DU SITE
--------------------------------------------------------------------------------------- */

.planSite {
	float: left;
	width: 270px;
}


/* PIED DE PAGE
--------------------------------------------------------------------------------------- */
#piedPage {color:#a5a5a5; font-size:10px; height:50px; padding:0; width:930px;}
#piedPage a {color:#a5a5a5; text-decoration:none;}
#piedPage a:hover {color:#a5a5a5; text-decoration:underline;}
#piedPage #copyrights {float:left; margin:0; text-align:left;}
#piedPage #copyrights a {font-weight:bold;}
#piedPage #copyrights #lienCopyrights {font-weight:normal; text-decoration:none; color:#a5a5a5;}
#piedPage #copyrights #lienCopyrights:hover {font-weight:normal; text-decoration:underline; color: #a5a5a5;}

/* footer - logo - bookmark */
	#contentFooter {width:100%; height:235px; background:#FFFFFF url(gx/bg_footer.jpg) top left repeat-x; clear: both;}
		#footer {width:930px; height:235px; margin:0px auto 0px auto;}
			#footer #contentLogo { }
			#footer #contentBookmark {float:right;}
				#footer #contentBookmark a#btStar {float:right; display:block; width:29px; height:29px; margin:33px 0px 0px 8px; background:url(gx/ic_bookmarkStar.gif) 0px 0px;}
				#footer #contentBookmark a#btStar:hover {background:url(gx/ic_bookmarkStar.gif) 0px 29px;}
				
				#footer #contentBookmark a#btYouTube {float:right; display:block; width:29px; height:29px; margin:33px 0px 0px 8px; background:url(gx/ic_bookmarkYouTube.gif) 0px 0px;}
				#footer #contentBookmark a#btYouTube:hover {background:url(gx/ic_bookmarkYouTube.gif) 0px 29px;}
				
				#footer #contentBookmark a#btTwitter {float:right; display:block; width:29px; height:29px; margin:33px 0px 0px 8px; background:url(gx/ic_bookmarkTwitter.gif) 0px 0px;}
				#footer #contentBookmark a#btTwitter:hover {background:url(gx/ic_bookmarkTwitter.gif) 0px 29px;}
				
				#footer #contentBookmark a#btFacebook {float:right; display:block; width:29px; height:29px; margin:33px 0px 0px 8px; background:url(gx/ic_bookmarkFacebook.gif) 0px 0px;}
				#footer #contentBookmark a#btFacebook:hover {background:url(gx/ic_bookmarkFacebook.gif) 0px 29px;}

/* TEXTES
--------------------------------------------------------------------------------------- */
h1 {float:left; font-size:20px; color:#8a8a8a; margin:16px 0px;}
h1 a, h1 a:link, h1 a:visited {color:#8a8a8a;}

h2 {color:#8a8a8a; font-size:15px; margin-bottom:4px;}
h2 a, h2 a:link, h2 a:visited {color:#8a8a8a;}

p {font-size:12px; line-height:150%; color:#8a8a8a; text-align:justify;}
p.textePetit {font-size:10px;}
p a, p a:link, p a:visited, ul li a, ul li a:visited, ol li a, ol li a:visited {color:#8cc73e; text-decoration:none;}
p a:hover, p a:visited:hover, ul li a:hover, ul li a:visited:hover, ol li a:hover, ol li a:visited:hover {color:#8cc73e; text-decoration:underline;}

ul li{color:#8a8a8a; font-size:12px; line-height:150%; list-style:square; margin-left:16px;}
ol li{color:#8a8a8a; font-size:12px; line-height:150%; margin-left:16px;}

/* FORMULAIRES
--------------------------------------------------------------------------------------- */
form#formSearch {float:left; margin-top:10px;}
form#formSearch p {color:#FFFFFF; font-weight:normal; font-style:normal; text-transform:none; padding:7px 0px;}

label {font-size:12px; color:#000; margin:2px 0 2px 0;}
label.erreur {color:#cc0000;}
.bgChampTexte {float:left; width:256px; height:26px; background:url(gx/m/bg_fieldSearch.gif) 0px 0px;}
.bgChampTexte:hover {float:left; width:256px; height:26px; background:url(gx/m/bg_fieldSearch.gif) 0px 27px;}
	.champTexte {width:240px; background-color:transparent; border:0px; color:#587d26; font-size:15px; margin:0px; padding:5px 3px 0px 5px;}
.listeDeroulante {background: #EEF3F7; border:1px solid #C9D0D6; color: #4E677A; font-size: 11px; margin:2px 0 2px 0;}
.boiteTexte {background: #EEF3F7; border: 1px solid #C9D0D6; color: #4E677A; font-family:Arial, Verdana, Helvetica, sans-serif; font-size: 11px; margin:2px 0 2px 0;}

.btSearch {float:left; width:36px; height:40px; margin-left:10px; border:0px; background:url(gx/m/bt_search.png) 0px 0px no-repeat; cursor:pointer;}
.btSearch:hover {background:url(gx/m/bt_search.png) 0px 40px;}

.btSearch2 {float:left; width:171px; height:48px; font-family:Arial, Verdana, Helvetica, sans-serif; font-size:15px; font-weight:bold; color:#FFFFFF; font-style:italic; text-transform:uppercase; text-align:left; margin:25px 0px 0px -6px; padding-left:14px; border:0px; background:url(gx/02/bt_search2.gif) 0px 0px no-repeat; cursor:pointer;}
.btSearch2:hover {background:url(gx/02/bt_search2.gif) 0px 48px;}

.champCache {display:none; visibility:hidden;} /* Utilisé pour l'anti-spam */

p.erreur {text-align:center; color:#CC0000; background-color:#FFDDDD; border:1px #CC0000 solid; padding:15px; border-radius:4em; -moz-border-radius:4px; -webkit-border-radius:4px;}
p.succes {text-align:center; color:#4F8A10; background-color:#DFF2BF; border:1px #4F8A10 solid; padding:15px; border-radius:4em; -moz-border-radius:4px; -webkit-border-radius:4px;}
p.conseil {font-size:10px;display:none;}

#envoiDemande LABEL {
	float: left;
	width: 200px;
}
#envoiDemande .champTexte {
	background: #EEF3F7; 
	border: 1px solid #C9D0D6;
	color: #4E677A; 
	font-family:Arial, Verdana, Helvetica, sans-serif; 
	font-size: 11px;
	float: left;
	height: 16px;
	margin: 5px 0px;
	padding: 2px;
	width: 180px;
}