/***********************************************************/ 
/*             											   */ 
/*              CSS Fiche Produit / MGD               	   */  
/*             											   */  
/* Ne concercne que la fiche produit et sont affichage.    */
/* La page est découpée en trois parties.				   */
/* Le haut avec l'image du produit et le choix du pack.    */
/* En dessous on retrouve la description du produit et les */
/* images du produits.									   */
/* En fin de page on y retrouve la config minimale.		   */ 
/*             											   */ 
/***********************************************************/  


	/* Bloc de description du haut */
	div#product_desc_top{ width:100%; float:left; height:290px; overflow:hidden; background:url(../images/bg/bg_fiche.gif) no-repeat 0% 0%; }
	
		/* Bloc Titre/sous-titre et image principale du produit */
		div#product_desc{ width:550px; border:none;}
		div#product_desc h1{display:block; color:#07286F; font-weight:bold; font-size:1.4em; margin:20px 0 0 0; }
		div#product_desc h2{display:block; color:#333333; font-weight:bold; margin:0 0 15px 0; margin:5px 0 0 0; }
		div#product_img{float:left; width:230px; overflow:hidden; margin:35px 0 0 0;}
		div#product_pictos{ float:left; width:210px; }
		div#product_pictos br.separator{height:20px; width:20px; background:#07286F;}
		
		/* Setup des overlay Pictos */
		div.pictos_description{display:none;}
		img.pictos_description_img{float:left; display:block; padding:10px 20px 10px 10px;}
		p.pictos_description_desc{float:left; display:block; padding:10px 10px 10px 0;}
		p.pictos_description_desc strong{display:block; margin:0 0 5px 0;}
			
		/* Bloc choix du pack */
		div#product_assistant{ margin:55px 18px 0 15px; background:#adc0dc; padding:15px 0 0 0; float:right; width:350px; }
		div#product_assistant div.title{ float:left; height:29px; overflow:hidden; border-bottom:1px solid #ffffff; width:95%; margin:0 5px; }
		div#product_assistant div.title h3{ display:inline; float:left; padding:7px; background:#00173a; color:#ffffff; font-weight:bold; margin:0 0 0 10px; }
		div#product_assistant div.title span{ display:inline; float:left; width:41px; height:29px; display:none; }
		div#product_assistant ul{ float:left; width:100%; display:block; padding:10px 5px 10px 0;}
		div#product_assistant ul li{display:inline;}
		div#product_assistant ul li input{}
		div#product_assistant ul li label{display:inline;}
		div#product_assistant ul li label img{vertical-align:middle; margin:0 5px 0 0;}
		div#product_assistant div#intervalle{border-top:1px solid #00173a; float:left; width:100%;}
		div#product_assistant div#intervalle strong{font-size:1.3em;}
		div#product_assistant div#intervalle label{margin:0 0 5px 0;}
		div#product_assistant div#intervalle p{float:left; padding:10px; white-space:nowrap;}
		div#product_assistant div#intervalle p a, div#product_assistant div#intervalle p input {display:block; float:left; margin:0 10px 0 0;}
		div#product_assistant div.total{display:block; padding:5px; clear:both; background:#00173a; text-align:center; vertical-align:middle; }
		div#product_assistant div.price{display:block; padding:10px 5px 5px 5px; float:left; width:140px; color:#ffffff; font-weight:bold; font-size:1.5em;}
		div#product_assistant div.price p{display:block; font-size:0.6em; white-space:nowrap;}
		div#product_assistant p.prixPublicReturn{text-decoration:line-through; font-size:1em; display:block; float:left;}
		div#product_assistant div.buy{display:block; padding:0 5px 5px 5px; float:left; width:140px;}	
		div#product_assistant div.total div.buy a{margin:12px 0 0 14px;}	
	
	/* Bloc du bas */
	div#product_desc_bottom{ background:url(../images/bg/bg_fiche_desc.gif) repeat-x 0% 0% #ffffff; width:100%; float:left;}
	
		/* Sharebar */
		div#sharebar{ width:99%; margin:0 auto; height:35px; color:#333333; border-bottom:1px solid #ffffff;}
			div#sharebar ul.right{margin:0 15px 0 0; text-decoration:underline; }
			div#sharebar ul li{float:left;}
			div#sharebar ul li a{display:block; padding:12px 25px 8px 20px; color:#43464a; font-size:0.8em;}
			div#sharebar ul li a.facebook{ background:url(../images/icon/icon_fb.gif) no-repeat right 10px;}
			div#sharebar ul li a.twitter{ background:url(../images/icon/icon_tw.gif) no-repeat right 10px;}
			div#sharebar ul li a.pdf{ background:url(../images/icon/icon_pdf.gif) no-repeat right 10px;}
			div#sharebar ul li a.email{ background:url(../images/icon/icon_mail.gif) no-repeat right 10px;}
			div#sharebar ul li a.print{ background:url(../images/icon/icon_print.gif) no-repeat right 10px;}
		
		/* Bloc de Gauche - Description produit */
		div#product_desc_bottom_left { padding:30px 10px 30px 20px; float:left; width:560px; }		
			
		/* Points Forts */
		div#strong_points{width:100%; margin:0 0 25px 0;}
			div#strong_points ul{width:100%; display:block; }
			div#strong_points ul li{width:250px; font-weight:bold; display:block; float:left; padding:0 0 0 10px; font-size:0.8em; background:url(../images/icon/dot_red.gif) no-repeat left 7px; line-height:15px; color:#333333;}
			
		/* Sommaire des pages de description */
		ul#summary{width:100%; display:block; margin:0 0 65px 0;}
			ul#summary li{float:left; width:250px; list-style:none; cursor:pointer;}
			ul#summary li:hover{font-weight:bold; color:#07286F;}
			ul#summary li.current{font-weight:bold;}
			ul#summary li a{display:block;}
		
		/* Script de redimensionnement du texte */
		.fontScaler{float:left; width:100%; border-top:1px solid #67696a; margin:0 0 15px 0;}
		.fontScaler a#fs_increase, .fontScaler a#fs_decrease, .fontScaler a#fs_normal, .fontScaler a#fs_medium, .fontScaler a#fs_large
		{ display:block; float:left; background-position:center center; background-repeat:no-repeat; text-indent:-5000px; }
		.fontScaler a#fs_increase{ background-image:url(../css/fontsizer/fontSizer-increase.png); width:28px; height:16px; }
		.fontScaler a#fs_decrease{ background-image:url(../css/fontsizer/fontSizer-decrease.png); width:28px; height:16px; }
		.fontScaler a#fs_decrease.disabled{ background-image:url(../css/fontsizer/fontSizer-decrease-disabled.png); }
		.fontScaler a#fs_normal{ background-image:url(../css/fontsizer/fontSizer-normal.png); width:16px; height:16px; }
		.fontScaler a#fs_medium { background-image:url(../css/fontsizer/fontSizer-medium.png); width:22px; height:22px; }
		.fontScaler a#fs_large { background-image:url(../css/fontsizer/fontSizer-large.png); width:32px; height:32px; }

		/* Description du produit (setup typographique) */
		div#description{width:auto; max-width:550px; margin:0 0 15px 0; text-align:justify; word-wrap:break-word; overflow:hidden;}
			div#description h1{display:block; padding:0 0 10px 0; font-weight:bold; color:#07286F;}
			div#description h2{display:block; padding:0 0 10px 0; font-weight:bold; color:#07286F;}
			div#description h3{display:block; padding:0 0 10px 0; font-weight:bold; color:#333333;}
			div#description h4{display:block; padding:0 0 10px 0; font-weight:bold; font-size:1.2em; color:#07286F;}
			div#description h5{display:block; padding:0 0 10px 0; font-weight:bold; font-size:1em;}
			div#description h6{display:block; padding:0 0 10px 0; font-weight:bold;}
			div#description p{display:block; padding:0 0 10px 0;}
			div#description strong{}
			div#description em{display:block; margin:0 10px 10px 10px;}
			div#description ul{display:block; padding:0 0 10px 15px; list-style:disc;}
			
		/* Description du produit (setup typographique) */
		ul#desc_nav{width:100%; display:block; clear:both;}
		ul#desc_nav span{padding:5px; font-style:italic; }
		ul#desc_nav li#page_precedente{float:left; display:block; text-align:left; padding:5px 10px; cursor:pointer; font-style:italic; text-decoration:underline;}
		ul#desc_nav li#page_suivante{float:right; display:block; text-align:right; padding:5px 10px; cursor:pointer; font-style:italic; text-decoration:underline;}
		ul#desc_nav li:hover{color:#07286F; font-weight:bold;}
		
		/* Bloc de Droite - Aside */
		div#product_desc_bottom_right { float:right; padding:30px 20px 30px 10px; width:350px; }	
		
		/* Bloc Screenshots du produit */
		#screenshot{width:100%; padding:0 0 15px 0;}
		
			/* Setup screenshot image Large */
			#image_principale{ width:350px; }
			#image_principale img{ width:350px; }
			
			/* Setup vignette image + caroussel */
			#image_vignette{ width:100%; height:60px; position:relative; overflow:hidden; padding:15px 0 0 0; }
			#image_vignette .items{ width:20000em; position:absolute; clear:both; }
			#image_vignette div{ float:left; width:350px;}
			#image_vignette img{ float:left; width:68px; height:46px; display:block; margin:5px 0 5px 16px; cursor:pointer;}
			#image_vignette .active{ border:1px solid #2d2d2d; position:relative; cursor:default; }
			
			/* Setup boutons prev / next */
			div#image_btn_control{ height:20px; width:110px; margin:0 auto;}
			div#image_btn_control a.browse { background:url(../images/icon/icon_screenshots_arrows.gif) no-repeat; display:block;	width:16px;	height:12px; cursor:pointer; font-size:1px;}
			/* Prev */
			div#image_btn_control a.left{ float:left; margin:0 10px 0 0; } 
			div#image_btn_control a.left:hover{ background-position:-16px 0; }
			div#image_btn_control a.left:active{ background-position:-32px 0; }
			/* Next */
			div#image_btn_control a.right{ background-position:0 -12px; float:left; margin:0 0 0 10px; }
			div#image_btn_control a.right:hover{ background-position:-16px -12px; }
			div#image_btn_control a.right:active{ background-position:-32px -12px; } 
			/* Desactivation du bouton */
			div#image_btn_control a.disabled{ visibility:hidden !important; }
		
			/* Puis on s'occupe des spots de navigation */
			div#image_btn_control .navi{}
			div#image_btn_control .navi a{ width:8px; height:8px; float:left; margin:2px 3px 2px 3px;; background:url(../images/icon/icon_screenshots_spots.png) 0 0 no-repeat; display:block; font-size:1px; }
			div#image_btn_control .navi a:hover{ background-position:0 -8px; }
			div#image_btn_control .navi a.active{ background-position:0 -16px; }
		
		/* Bloc Vidéos du produit */
		#video{width:100%; padding:0 0 15px 0;}
		
			/* Setup screenshot vidéos Large */
			#video_principale{ width:350px; display:block; }
			#video_principale img{width:350px;}		
			#video_content{display:none;}
			#video_stream{ width:624px; height:352px; display:none; padding:10px; background:#333333;}
			
			/* Setup vignette vidéos + caroussel */
			.video_vignette{ width:100%; height:60px; position:relative; overflow:hidden; padding:15px 0 0 0; }
			.video_vignette .items{ width:20000em; position:absolute; clear:both; }
			.video_vignette div{ float:left; width:350px;}
			.video_vignette img{ float:left; width:68px; height:46px; display:block; margin:5px 0 5px 16px;}
			.video_vignette .active{ border:1px solid #999; position:relative; cursor:default; }
			
			/* Setup boutons prev / next */
			div#video_btn_control{ height:20px; width:100px; margin:0 auto;}
			div#video_btn_control a.browse { background:url(../images/icon/icon_screenshots_arrows.gif) no-repeat; display:block;	width:16px;	height:12px; cursor:pointer; font-size:1px;}
			/* Prev */
			div#video_btn_control a.left{ float:left; margin:0 10px 0 0; } 
			div#video_btn_control a.left:hover{ background-position:-16px 0; }
			div#video_btn_control a.left:active{ background-position:-32px 0; }
			/* Next */
			div#video_btn_control a.right{ background-position:0 -12px; float:left; margin:0 0 0 10px; }
			div#video_btn_control a.right:hover{ background-position:-16px -12px; }
			div#video_btn_control a.right:active{ background-position:-32px -12px; } 
			/* Desactivation du bouton */
			div#video_btn_control a.disabled{ visibility:hidden !important; }
		
			/* Puis on s'occupe des spots de navigation */
			div#video_btn_control .navi{}
			div#video_btn_control .navi a{ width:8px; height:8px; float:left; margin:2px 3px 2px 3px;; background:url(../images/icon/icon_screenshots_spots.png) 0 0 no-repeat; display:block; font-size:1px; }
			div#video_btn_control .navi a:hover{ background-position:0 -8px; }
			div#video_btn_control .navi a.active{ background-position:0 -16px; }

		/* Bloc Configuration minimale */
		#configuration{width:100%; text-align:center; border:1px solid #00173a; text-align:left;}
		#configuration h2{display:block; padding:5px 0 5px 10px; margin:0 0 5px 0; background:#00173a; color:#ffffff;}
		#configuration img{display:inline; padding:5px 0 5px 15px;}
		#configuration p{padding:10px 15px;}
		#configuration p b, #configuration b, #configuration p strong, #configuration strong{text-transform:uppercase; color:#333333;}
		#configuration ul, #configuration ol{padding:10px 15px; color:#333333;}
		#configuration ul li, #configuration ol li{font-weight:bold;}
		#configuration ul li ul li, #configuration ol li ol li{color:#07286F; font-weight:normal; list-style-type:disc; list-style-position:inside;}