@charset "UTF-8";
/* base + general */
html, body {
	padding: 0px;
	margin: 0px;
	font-family: Arial, Helvetica, sans-serif;
}

body {
	background: #000 url('../images/bg_body.jpg') repeat-x center top;
}

div.clear {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

div#outer_wrapper {
	width: 984px;
	margin: 0 auto 30px auto;
}

div#wrapper {
	background: #fff url('../images/bg_center.jpg') repeat-x center top;
	width: 960px;
	margin: 0 auto;
}
	div#site_produits {
		position: relative;
		top: 0;
		left: 0;
		margin-left: 735px;
		width: 200px;
		height: 24px;
		background: #e7e4e2 url('../images/btn_site_oberson.png') no-repeat top right;
	}
		div#site_produits a {
			position: absolute;
			display: block;
			top: 0;
			left: 0;
			width: 184px;
			height: 16px;
			color: #787065;
			text-decoration: none;
			font-size: 0.8em;
			padding: 4px 8px;
		}
		div#site_produits a:hover { text-decoration: underline; }

h1 {
	text-indent: -1000px;
	background: url('../images/logo.gif') no-repeat 15px 15px;
	float: left;
	margin: 0px;
	padding: 15px 15px 10px 15px;
	height: 97px;
	width:  321px;
}

div.deco_externes {
	position: relative;
}

.erreur {
	color: #990000;
	font-weight: bold;
	background-color: #ffff99;
	border: 1px solid #ff9900;
	padding: 4px;
	margin: 4px 30px;
}

/* ---------- menu ---------- */
ul#menu {
	float: left;
	margin: 70px 0 0 105px;
	padding: 0;
	list-style-type:none;
	list-style-position:outside;
	position:relative;
}
	ul#menu li {
		float:left;
		position:relative;
	}
		ul#menu li a {
			border-bottom: none;
			margin: 4px;
			display: block;
			padding: 4px 6px 2px;
		}
		
		ul#menu li a, ul#menu li a:visited, ul#menu li a:active {
			color: #6f665a;
			text-decoration: none;
			font-size: 1.1em;
			font-family: Arial, Helvetica, sans-serif;
			font-weight: normal;
		}
		
		ul#menu li a:hover, ul#menu li a.actif {
			color: #918779;
			background-color: #e8e5e2;
			text-decoration: none;
			font-size: 1.1em;
			font-family: Arial, Helvetica, sans-serif;
			font-weight: normal;
			border-bottom: 3px solid #0dbbfc;
		}

/* ---------- all 3 widget fade (accueil) ---------- */

.wf_tab, .wf_subzone_tab {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 1.5em;
}

.wf_tab a, .wf_subzone_tab a {
	color: #665e53;
}

div#widget_fade img, div#wf_subzone1 img, div#wf_subzone2 img {
	top: 0;
	left: 0;
	position: relative;
	border: 0;
}

#wf_subzone1_controller a, #wf_subzone2_controller a {
	display: block;
	width: 125px;
	margin-left: 12px;
	float: left;
	color: #981b1e;
	font-size: 1.2em;
	line-height: 3em;
}


/* ---------- SPECIFIC widget fade MAIN (accueil) ---------- */

div#widget_fade {
	background-color: #0dbbfc;
	width: 960px;
	height: 273px;
}

	a#widget_fade_fleche_left {
		top: 88px;
		left: 0;
		position: absolute;
		border: none;
	}
	
	a#widget_fade_fleche_right {
		top: 80px;
		right: 0;
		position: absolute;
		border: none;
	}
	
	img#fleche_widget_left_externe {
		position: absolute;
		top: 210px;
	}
	
	img#fleche_widget_right_externe {
		position: absolute;
		top: 202px;
		right: 0px;
	}
	
	img#bg_control_widget_externe {
		position: absolute;
		top: 352px;
		right: 0px;
	}
	
	a#widget_fade_fleche_right img, a#widget_fade_fleche_left img { border: none; }

/* ---------- Subzones (under widget fade accueil) ---------- */
	
div.accueil_subzones {
	float: left;
	background: url('../images/bg_accueil_subzones.png') no-repeat top left;
	width: 330px;
	height: 680px;
}
	div.accueil_subzones h2 {
		margin: 4px 0 0 24px;
	}
	
	div.cadre_accueil_subzones  {
		background: url('../images/cadre_accueil_subzones.png') no-repeat top left;
		margin: 6px 0px 0px 28px;
		width: 276px;
		height: 163px;
	}
		div.cadre_accueil_subzones img {
			margin: 5px 0 0 6px;
		}
		
		div.accueil_subzones h3 {
			width: 267px;
			font-family: Georgia, "Times New Roman", Times, serif;
			color: #fff;
			font-size: 1em;
			margin-left: 28px;
			padding: 4px;
			background: url('../images/bg_h3_subzone.png') repeat-y;
		}
		
		div.short_summary {
			color: #433f38;

			font-size: 0.75em;
			margin-left: 28px;
		}
			div.short_summary div.stars {
				float: right;
				margin-right: 35px;
			}
			
			div.short_summary strong.summary_title {
				display: block;
				padding: 4px;
				font-size: 1.1em;
				background: url('../images/bg_titre_item.png') repeat-y;
				width: 266px;
				font-family: Georgia, "Times New Roman", Times, serif;
				color: #e8e4da;
			}
			
			div.short_summary strong.summary_title a {
				text-decoration: none;
				font-family: Georgia, "Times New Roman", Times, serif;
				color: #e8e4da;
			}
			
			div.short_summary p {
				margin-top: 2px;
				margin-right: 35px;
			}


/* ---------- Commandites (under widget fade accueil) ---------- */
			
div#accueil_commandites {
	float: left;
	background: url('../images/bg_accueil_commandites.png') no-repeat top left;
	width: 290px;
	height: 569px;
}		
	div#accueil_commandites h2 {
		margin: 8px 0 0 8px;
	}
	
	div#accueil_commandites_carousel {
		position: relative;
		margin-top: 8px;
		background: url('../images/bg_accueil_carousel_commandites.png') no-repeat 62% 0%;
		width: 290px;
		height: 364px;
	}
		a.img_carousel_accueil {
			text-decoration: none;
			display: block;
			padding: 18px 0 0 45px;
		}
			a.img_carousel_accueil img {
				border: 0;
			}
		
		div#fleche_accueil_commandites_gauche {
			position: absolute;
			top: 120px;
			left: 7px;
		}
		
		div#fleche_accueil_commandites_droite {
			position: absolute;
			top: 120px;
			right: 7px;
		}
	a.img_carousel_accueil_petite {
			text-decoration: none;
			display: block;
			float: left;
			padding: 18px 0 0 12px;
	}
	
	a.img_carousel_accueil_petite_first {
			padding-left: 27px;
	}
		a.img_carousel_accueil_petite img, a.img_carousel_accueil_petite_first img {
			border: 0;
		}
	
/* ---------- Infolettre (under Commandites) ---------- */
			
div#accueil_infolettre {
	float: left;
	background: url('../images/bg_accueil_infolettre.png') no-repeat top left;
	width: 290px;
	height: 100px;
	margin-top: 4px;
}		
	div#accueil_infolettre h2 {
		margin: 12px 12px 0 22px;
		color: #6f665a;
		font-size: 1.1em;
		border-bottom: 2px solid #ede5d6;
	}
	
	div#accueil_infolettre form  { padding: 0; margin: 0; }
	
	div#accueil_infolettre input.texte {
		float: left;
		border: 0;
		background-color: #e9e2d3;
		font-size: 0.8em;
		color: #39352e;
		height: 22px;
		width: 200px;
		line-height: 1.6em;
		margin: 8px 0 0 22px;
		padding: 4px 0 0 10px;
	}
	
	div#accueil_infolettre input.soumettre {
		float: left;
		border: 0;
		background-color: #6f665a;
		font-size: 0.8em;
		color: #e9e2d3;
		height: 26px;
		width: 40px;
		line-height: 1.2em;
		margin: 8px 0 0 6px;
		padding: 2px 0 0 2px;
	}
	
/* --- footer ---------------------------- */

div#footer {
	height: 72px;
	width: 100%;
	width: 100%;
	background: url('../images/bg_footer.jpg') bottom center repeat-x;
}
	img#deco_footer {
		float: left;
	}
	
	ul#menu_footer {
		float: right;
		margin: 44px 50px 0 40px;
		padding: 0;
		list-style-type:none;
		list-style-position:outside;
		position:relative;
	}
	ul#menu_footer li {
		float:left;
		position:relative;
		color: #f9f6f0;
		font-size: 0.9em;
		margin-left: 14px;
		font-family: Arial, Helvetica, sans-serif;
		font-weight: normal;
	}
		ul#menu_footer li a {
			border-bottom: none;
			margin: 0;
			display: block;
			padding: 0;
		}
		
		ul#menu_footer li a, ul#menu_footer li a:visited, ul#menu_footer li a:active {
			color: #f9f6f0;
			text-decoration: none;
			font-size: 1em;
			font-family: Arial, Helvetica, sans-serif;
			font-weight: normal;
		}
		
		ul#menu_footer li a:hover {
			color: #fff;
			text-decoration: underline;
			font-size: 1em;
			font-family: Arial, Helvetica, sans-serif;
			font-weight: normal;
		}

/* === HOT ================================================================================= */
	
/* --- haut, bloc BG horiz_fade ------------------------------------------------------------ */	

.horiz_fade {
	background-image: url('../images/bg_horiz_fade.png');
	background-repeat: no-repeat;
	background-position: top left;
	width: 908px; /* 954 - 2 X margin - 2 X padding */
	padding: 4px 18px;
	margin: 12px 8px;
	float: left;
	color: #675e55;
}
	.horiz_fade .col_gauche h2, .horiz_fade .col_droite h2 { margin-top: 0px; }

	.horiz_fade .col_gauche {
		width: 606px;
		float: left;
		padding-right: 12px;
	}
		#cadre_feature_hot {
			background-image: url('../images/bg_accueil_carousel_commandites.png');
			background-repeat: no-repeat;
			background-position: top left;
			width: 210px; /* 246 -padding X2 */
			height: 328px; /* 364 -padding X2 */
			padding: 18px;
			float: left;
		}
		
		#cadre_photo_employe {
			width: 165px;
			height: 170px;
			padding: 0 6px 18px 18px;
			float: left;
		}
		
		.texte_feature_hot {
			float: left;
			padding: 8px;
			width: 340px;
			font-size: 0.8em;
		}
		
		.horiz_fade .col_gauche h3 {
			display: block;
			background-image: url('../images/title_underline.gif');
			background-position: bottom left;
			background-repeat: repeat-x;
			padding-bottom: 8px;
			font-family: Georgia, "Times New Roman", Times, serif;
		}
	
	.horiz_fade .col_droite {
		width: 290px;
		margin-top: 10px;
		float: left;
	}
		
		/* >> debut >> ! ! ! ATTENTION  ! ! ! classes suivantes utilisées à PLUS D'UN endroit (contexte) dans le site */
		.dark_box_arrow_right {
			float: left;
			background-image: url('../images/bg_dark_pour_fleche_droite.png');
			background-repeat: repeat-y;
			background-position: top right;
			width: 290px;
			color: #ddcdb3;
			font-size: 0.7em;
			margin-bottom: 15px;
		}
			.dark_box_arrow_right a img.thumb_bio { 
				border: none; 
				float: left;
			}
			
			.dark_box_arrow_right a img.petite_fleche { 
				border: none;
				float: right;
				margin-top: 30px;
				margin-right: 1px;
			}
			
			.dark_box_arrow_right a img.petite_fleche_short { 
				border: none;
				float: right;
				margin-top: 15px;
				margin-right: 1px;
			}
			
			.dark_box_arrow_right p, .dark_box_arrow_right h3 {
				float: left;
				padding-left: 6px;
				width: 172px;
				margin: 4px 0;
			}
			
			.dark_box_arrow_right h3 {
				color: #eae6db;
				margin: 6px 0px 0px 0px;
				font-size: 1em;
				font-family: Georgia, "Times New Roman", Times, serif;
			}
			/* << fin << ! ! ! ATTENTION  ! ! ! classes précédentes utilisées à PLUS D'UN endroit (contexte) dans le site */
		

/* --- zone onglets bottom --------------------------------------------------------------- */	

.wrapper_bottom_onglets {
	float: left;
	margin: 0px 26px 10px 26px;
	width: 908px;
}

	.bottom_onglet { 
		float: left; 
		width: 100%;
		font-size: 0.8em;
	}
	
		.bottom_onglet .onglet {
			float: left;
			background-image: url('../images/onglet_fonce.png');
			width: 115px; /* 125 moins padding */
			height: 19px; /* 23 moins padding */
			color: #e7e3d8;
			padding: 4px 5px 0px 5px;
			text-align: center;
		}
		.bottom_onglet .onglet a { color: #e7e3d8; text-decoration: none; }
		
		.bottom_onglet .actif {
			background-image: url('../images/onglet_pale.png');
			color: #796c63;
		}
		.bottom_onglet .actif a { color: #796c63; }
		
	.bg_bottom_onglets {
		background-color: #dfd1c8;
		float: left;
		width: 100%;
		padding-top: 18px;
		padding-left: 8px;
	}
	
		/* ATTENTION ! - autres propriétées de la classe 'dark_box_arrow_right' définies plus haut! */
		.bg_bottom_onglets .dark_box_arrow_right { 
			margin-right: 12px;			
		}

/* === ESSAIS ================================================================================= */

/* --- haut, bloc BG horiz_fade --------------------------------------------------------------- */	

.horiz_video_header {
	background-image: url('../images/bg_horiz_video_header.png');
	background-repeat: no-repeat;
	background-position: top left;
	width: 908px; /* 954 - 2 X margin - 2 X padding */
	height: 430px;
	padding: 4px 18px;
	margin: 0px 8px 12px 8px;
	float: left;
	color: #675e55;
}

	.horiz_video_header h2 {
		margin-bottom: 2px;
		
	}

	#thumb_video {
		float: left;
		background-image: url('../images/bg_thumb_video_header.png');
		background-repeat: no-repeat;
		background-position: top left;
		width: 490px;
		height: 280px;
		margin-top: 12px;
	}
	
	#thumb_video a img {
		border: none;
		margin-top: 6px;
		margin-left: 6px;
	}
	
	#descr_video {
		float: left;
		width: 415px;
		color: #ddcdb1;
		font-size: 0.8em;
	}
	
		#descr_video a {
			color: #DDCDB1;
			text-decoration: none;
		}
	
		#descr_video h3 {
			color: #fff;
			font-family: Georgia, "Times New Roman", Times, serif;
			font-size: 1.3em; /* ATTENTION ! relatif (proportionnel) au font-size de '#descr_video'  */
			margin-top: 0;
			background-image: url('../images/title_underline.gif');
			background-position: bottom left;
			background-repeat: repeat-x;
			padding-bottom: 8px;
			width: 100%;
			margin-bottom: 8px;
		}
		
		#produit_essaye {
			width: 210px;
			height: 248px;
			background-image: url('../images/bg_dark_transp.png');
			float: left;
		}
		
			#produit_essaye img {
				border: none;
			}
			
			#produit_essaye #date_stars {
				font-size: 0.85em;
				width: 194px; /* 210 moins padding */
				padding: 4px 8px;
			}
			
			#produit_essaye #nom_testeur {
				background-image: url('../images/bg_very_dark.png');
				width: 194px; /* 210 moins padding */
				padding: 4px 8px;
			}
		
		#produit_descr {
			margin-left: 14px;
			padding: 12px;
			width: 166px;
			height: 224px;
			background-image: url('../images/bg_transp_blanc.png');
			float: left;
			color: #665e53;
		}
		
			div.produit_categ, div.produit_nom {
				background-image: url('../images/title_underline.gif');
				background-position: bottom left;
				background-repeat: repeat-x;
				padding-bottom: 8px;
				margin-bottom: 6px;
			}
			div.produit_nom {
				font-weight: bold;
				font-size: 1.2em;
			}
			div.produit_icones {
				
			}
		
	#filtre {
		float: left;
		margin-top: 4px;
		width: 892px;
		padding: 6px;
		color: #fff;
		background-image: url('../images/bg_transp_brun.png');
	}
	
	.pagination_pale {
		float: right;
		margin-top: 6px;
		margin-right: 4px;
		padding: 2px 4px;
		color: #665e53;
		font-weight: bold;
		font-size: 0.8em;
		background-image: url('../images/bg_pagination.png');
	}
		.pagination_pale div.label_pagination { float: left; }
	
		.pagination_pale a { display: block; float: left; color: #665e53; text-decoration: none; margin: 0 2px; padding: 0 2px; }
		
		.pagination_pale a.actif { background-color: #9e968c; color: #dad2c9; }
			
#zone_thumb_vid {
	width: 908px;
	margin: 0px 24px 12px 25px;
	font-size: 0.7em;
	color: #ddcdb1;
}			
	.thumb_vid {
		float: left;
		width: 220px;
		background-image: url('../images/bg_dark_transp.png');
		margin-right: 8px;
		margin-bottom: 16px;
		height: 200px;
	}
		.thumb_vid a img { border: none; }
		
	.thumb_vid_stars {
		padding: 2px 4px;
		width: 80px;
		float: right;
	}
	
	.thumb_vid_date {
		padding: 2px 4px;
		width: 130px;
	}
	
	.thumb_vid_produit {
		float: left;
		width: 212px;
		background-image: url('../images/bg_very_dark.png');
		color: #e8e4da;
		font-family: Georgia, "Times New Roman", Times, serif;
		font-weight: bold;
		font-size: 1.2em; /* attention !  relatif à son DIV parent */
		padding: 2px 4px;
	}
	
	.thumb_vid_nom_pro {
		float: left;
		padding: 2px 4px;
		font-size: 1.1em; /* attention !  relatif à son DIV parent */
	}
		.thumb_vid_nom_pro a { text-decoration: none; color: #DDCDB1; } 
	
	#zone_thumb_vid .last { margin-right: 0; } /* ATTENTION!  garder APRÈS '.thumb_vid' */
	
	#zone_thumb_vid .pagination_pale { font-size: 1.2em; } /* ATTENTION!  garder APRÈS '.pagination_pale' régulier */
	
	#zone_thumb_vid #filtre { font-size: 1.2em; } /* ATTENTION!  garder APRÈS '#filtre' régulier */

/* === UN ESSAI =============================================================================== */

/* --- haut, bloc BG horiz_fade --------------------------------------------------------------- */	

.horiz_player_header {
	background-image: url('../images/bg_horiz_video_header.png');
	background-repeat: no-repeat;
	background-position: top left;
	width: 908px; /* 954 - 2 X margin - 2 X padding */
	height: 450px; /* 480px pour template plus large */
	padding: 4px 18px;
	margin: 0px 8px 0px 8px;
	float: left;
	color: #675e55;
}

	.horiz_player_header h2 {
		margin-bottom: 2px;
		
	}
	
	#wrapper_player {
		width: 470px; /* quand template plus large  = 660 */
		height: 394px;
		float: right;
		margin-right: 4px;
	}
	
		#top_tabs {
			float: left;
			margin: 0;
			padding: 0;
			width: 470px; /* quand template plus large  = 660 */
			font-size: 0.8em;
		}
		
			#note_moyenne {
				float: right;
				margin: 0;
				padding: 0;
				width: 230px;
				height: 23px;
				background-image: url('../images/top_player_note.png');
				background-position: top right;
				background-repeat: no-repeat;
				color: #E8E5E2;
			}
				#note_moyenne span {
					display: block;
					float: left;
					margin: 3px 8px 0 12px;
				}
				
				#note_moyenne img { margin-top: 5px; }
				
			
			#partager {
				float: left;
				margin: 0;
				padding: 0;
				width: 300px;
				height: 23px;
				background-image: url('../images/top_player_partager.png');
				background-position: top left;
				background-repeat: no-repeat;			
			}
			
			#partager_small {
				float: left;
				margin: 0;
				padding: 0;
				width: 137px;
				height: 23px;
				background-image: url('../images/top_player_partager_small.png');
				background-position: top left;
				background-repeat: no-repeat;			
			}
			
				#partager span, #partager_small span {
					display: block;
					float: left;
					margin: 3px 0 0 6px;
				}
			
				#partager a img, #partager_small a img {
					border: none;
					margin: 4px 0 0 6px;
				}
	
	#produit_descr_player {
		font-size: 0.9em;
		padding: 12px;
		width: 186px;
		height: 236px; /* 283 - padding */
		float: left;
		color: #665e53;
		background-image: url('../images/bg_transp_blanc.png'); /* pas présent pour template plus large */
		margin-right: 8px; /* pas présent pour template plus large */
		margin-top: 23px;
	}

	#produit_essaye_player {
		width: 210px;
		height: 260px;
		background-image: url('../images/bg_dark_transp.png');
		float: left;
		font-size: 0.7em;
		color: #DDCDB1;
		margin-top: 23px;
	}
	
		#produit_essaye_player img {
			border: none;
		}
		
		.thumb_vid_date {
			padding: 2px 4px;
			width: 130px;
		}
		
		#produit_essaye_player  .thumb_vid_produit {
			float: left;
			width: 202px;
			background-image: url('../images/bg_very_dark.png');
			color: #e8e4da;
			font-family: Georgia, "Times New Roman", Times, serif;
			font-weight: bold;
			font-size: 1.2em; /* attention !  relatif à son DIV parent */
			padding: 2px 4px;
		}
		
		#produit_essaye_player  .thumb_vid_nom_pro {
			float: left;
			padding: 2px 4px;
			font-size: 1.1em; /* attention !  relatif à son DIV parent */
			line-height: 0.7em;
		}

#descr_pro {
	padding: 12px;
	margin: 0 12px 12px 0;
	width: 166px;
	background-image: url('../images/bg_transp_blanc.png');
	float: left;
	color: #665e53;
}
	#descr_pro img { border: none; }
	
	#descr_pro .nom_pro, #descr_pro .nom_pro a { font-family: Georgia, "Times New Roman", Times, serif; font-weight: bold; color: #665e53; text-decoration: none; }
	#descr_pro .nom_fonction { font-size: 0.8em; }

	
	#discours_pro { 
		margin-left: 36px;
		float: left;
		width: 660px;
		font-size: 0.9em;
	}
	
		#discours_pro h4 {
			display: block;
			background-image: url('../images/title_underline.gif');
			background-position: bottom left;
			background-repeat: repeat-x;
			padding-bottom: 8px;
			margin-top: 0;
			font-family: Georgia, "Times New Roman", Times, serif;
		}
		
	h3.ecrireCommentaire { 
		border-top: 1px solid #0ebbfd; 
		border-bottom: 1px solid #0ebbfd; 
		font-size: 1em;
		font-weight: normal;
		margin: 0 30px;
		padding: 4px 0;
		color: #665f57;
	}	
	
	form#frmComment div.flotte {
		float: left;
		color: #665f57;
		font-size: 0.85em;
		margin-left: 30px;
	}
	form#frmComment label { padding: 8px 0; display: block; }
	
	form#frmComment textarea, form#frmComment input {
		background-color: #faf9f5;
		border: 1px solid #b89b5f;
	}
	form#frmComment #message {
		width: 510px;
		height: 150px;
		font-family: Arial, Helvetica, sans-serif;
		font-size: 0.85em;
	}	
	form#frmComment #pseudo {
		width: 355px;
		height: 20px;
	}	
	form#frmComment #btnSubComment {
		background-image: url('../images/btn_envoyer.jpg');
		background-repeat: repeat-x;
		border: none;
		margin-top: 8px;
		color: #d4c4a3;
		height: 22px;
		width: 100px;
		vertical-align: middle;
	}	
	
	div.vote_etoiles {
		background-image: url('../images/bg_etoiles.png');
		background-position: top left;
		background-repeat: no-repeat;
		width: 90px;
		height: 21px;
		padding: 5px 0 0 5px
	}

	div.fullComment {
		float: left;
		width: 600px;
		background-image: url(../images/title_underline.gif);
		background-position: bottom left;
		background-repeat: repeat-x;
		padding: 6px 0;
	}

form#frmFiltre #btnSubFiltre {
	background-image: url('../images/btn_envoyer.jpg');
	background-repeat: repeat-x;
	border: none;
	color: #d4c4a3;
	height: 22px;
	width: 100px;
	vertical-align: middle;
	float: right;
}	

/* over-writing stlyes - doivent demeurer à la fin */		

.bottomless { margin-bottom: 0px; }
.topless { margin-top: 0px; }
.bottommarge { margin-bottom: 12px; }
.topmarge { margin-top: 12px; }