/*------------------------------------------------------------------------------

Document : Common CSS
Author   : Damien SYREN
Company  : CCM Benchmark
Creation : 4 mars 2011, 15:41:12

Table of content : plugins CCM Benchmark

- SPRITE ICO                                                    / centralisation sprite pour time stamp
- MESSAGE INFORMATION                                           / .infoMsg
- MESSAGE CHARGEMENT                                            / .loadTop
- ANCRE VERS LE HAUT                                            / #goTop
- FLECHES CSS (arrows)                                          / .tick
- NAVIGATION ENTRE PAGES                                        / #goNext,#goPrevious
- TOOLTIP MAISON + systeme dropdown                             / .tooltips,.rel
- TIPSY (tooltips) + tooltips maison                            / .tipsy
- SYSTEME DE MODALE (interne) - remplac� par jQuery UI          / .modalSys
- FORMULAIRE GENERIQUE (interne)                                / .form
- CONTENTEDITABLE                                               / .contenteditable
- MICRO FORUMS                                                  / .commentBloc
- OVERLAY LOADER AJAX                                           / .overlayDiv,.waiting
- GLOSSARY                                                      / .glossary
- SYSTEME ETOILES                                               / .stars
- SLIDER (vignettes)                                            / .slider
- ARRONDIS                                                      / .radius
- MODERATION                                                    / .modoBox
- SLIDER (diaporama)                                            / .diapo

------------------------------------------------------------------------------*/

/*
- SPRITE ICO -------------------------------------------------------------------
*/

/* Expeert ico
.tickB-1,
.tickB-2,
.tickB-3,
.icoTop,
.icoBottom,
.stars,
.currentNote,
.oneStar:hover,
.twoStar:hover,
.threeStar:hover,
.fourStar:hover,
.fiveStar:hover,
.icoCancel-1,
.icoCancel-2,
.icoCancel-3,
.icoPlus-1,
.icoPlus-2,
.icoPlus-3,
.icoValid-1,
.icoValid-2,
.icoValid-3,
.PROPOSAL .icoCancel-3{ background:url('/expeert.com/skin/common/img/sprite_ico.png?201212181140') no-repeat 0 0 }
*/
.form .checkbox .nocheck,
.form .checkbox .checked,
/* CCM */
.icoForward,
.icoPrint,
.icoOptionsPlus,
.icoSupp,
.icoLess,
.icoMore{ background:url('/ressource/common/img/sprite_ico.png?201212181140') no-repeat 0 0 }


/*
- MESSAGE INFORMATION (content) ------------------------------------------------
*/

.infoMsg{
	position:relative;
	background:#FFFFCC;
	padding-right:34px;
	border:1px solid #b9b9b9;
	_zoom:1;
}
.infoMsg-1{ padding-right:0 }
.infoMsg p{
	margin:10px;
}
.infoMsg.error{
	background-color:#FFE4E7;
}
.infoMsg .icoClose{
	position:absolute;
	top:9px;
	right:7px;
}

/*
- MESSAGE CHARGEMENT (top) -----------------------------------------------------
*/

.loadTop{
	position:fixed;
	_position:absolute;
	width:100%;
	top:-1px;
	left:0;
	z-index:200;
	text-align:center;
}
	.loadTop span,
	.loading{
		display:inline-block;
		vertical-align:middle;
		padding:5px 10px;
		background:#FFFFCC;
		border:1px solid #b9b9b9;
		font-size:12px;
		*zoom:1;
		*display:inline;
	}
	.loadTop span.error,
	.loadTop span.error a{
		color:#FFF;
		font-weight: bold;
		background-color:#E30450;
	}

/* loading */
.loadTopC{ top:50% }
.loadTopC span,
.loading{ background:#E6F6FF; font-size:14px; }

/*
- ANCRE VERS LE HAUT -----------------------------------------------------------
*/

#gotop{
	display:none;
	position:fixed;
	right:60px;
	top:60px;
	z-index:150;
	_display:none !important;
}
	#gotop a{
		float:left;
		width:80px;
		height:80px;
		background:url('/ressource/common/img/sprite_bigNav.png') no-repeat 0 0;
		filter:alpha(opacity=20);       /* IE < 8 */
		-ms-filter:"alpha(opacity=20)"; /* IE 8 */
		opacity:.2;
	}
/*
- VOTRE AVIS -----------------------------------------------------------
*/
#feedback {
    position: fixed;
    right: 60px;
    top: 160px;
    z-index: 150;
}
#feedback a {
        display: block;
        background: url('/ressource/common/img/sprite_feedback.png?2') no-repeat 0 0;
        height: 80px;
        width: 80px;
        filter:alpha(opacity=70);       /* IE < 8 */
        -ms-filter:"alpha(opacity=70)"; /* IE 8 */
        opacity:.7;
}
#feedback a:hover {
        background-position: 0 -82px;
        filter:alpha(opacity=40);       /* IE < 8 */
        -ms-filter:"alpha(opacity=40)"; /* IE 8 */
        opacity:.4;
}
/*
- ARROWS (fleches) -----------------------------------------------------------------------
*/

.tick{
	display:inline-block;
	vertical-align:top;
	width:0;
	height:0;
	line-height:0;
	border-color:transparent;
	border-style:solid;
	border-width:6px;
	_overflow:hidden;
	_border-color:pink;
	_filter:chroma(color=pink);
}

/* taille */
.tick.tickSize5{ border-width:5px }
.tick.tickSize7{ border-width:7px }
.tick.tickSize8{ border-width:8px }
.tick.tickSize9{ border-width:9px }
.tick.tickSize10{ border-width:10px }

/* couleur */
.tick.tickGrey{ border-color:#ddd }
.tick.tickGrey2{ border-color:#EBEAE6 }
.tick.tickGrey3{ border-color:#f4f4f4 }
.tick.tickGrey4{ border-color:#666 }
.tick.tickGrey5{ border-color:#ECFFBE }
.tick.tickBlack{ border-color:#000 }
.tick.tickWhite{ border-color:#fff }
.tick.tickBlue{ border-color:#3E93CD }
.tick.tickExpeert{ border-color:#e6f6ff }
.tick.tickPink{ border-color:#E30450 }

/* fleche bas */
.tick.tickTop,
.tick:hover.tickTop{
	border-top-width:0;
	border-top-color:transparent;
	border-right-color:transparent;
	border-left-color:transparent;
	_border-top-color:pink;
	_border-right-color:pink;
	_border-left-color:pink;
}

/* fleche gauche */
.tick.tickRight,
.tick:hover.tickRight{
	border-right-width:0;
	border-top-color:transparent;
	border-right-color:transparent;
	border-bottom-color:transparent;
	_border-top-color:pink;
	_border-right-color:pink;
	_border-bottom-color:pink;
}

/* fleche droite */
.tick.tickLeft,
.tick:hover.tickLeft{
	border-left-width:0 ;
	border-top-color:transparent;
	border-bottom-color:transparent;
	border-left-color:transparent;
	_border-top-color:pink;
	_border-bottom-color:pink;
	_border-left-color:pink;
}

/* fleche haut */
.tick.tickBottom,
.tick:hover.tickBottom{
	border-bottom-width:0;
	border-left-color:transparent;
	border-right-color:transparent;
	border-bottom-color:transparent;
	_border-left-color:pink;
	_border-right-color:pink;
	_border-bottom-color:pink;
}

/* fleches bleues et blanches du menu */
.tickB-1{
	display:inline-block;
	vertical-align:top;
	width:11px;
	height:7px;
	_overflow:hidden; /* corrige un bug IE6 qui affiche une hauteur min de 10px */
	/* background:url('http://static.ccm2.net/expeert.com/skin/common/img/sprite_ico.png') no-repeat 0 -49px;*/
        background-position:0 -49px;
}
.tickB-3{
	background-position:0 -62px;
}

/* fleches noires */
.tickB-2{
	display:inline-block;
	vertical-align:top;
	width:8px;
	height:5px;
	_overflow:hidden; /* corrige un bug IE6 qui affiche une hauteur min de 10px */
	background-position:-24px -49px;
}

/*
- NAVIGATION ENTRE PAGES -------------------------------------------------------
*/

#goNext,
#goPrevious{
	display:none;
	position:fixed;
	top:50%;
	margin-top:-12px;
	z-index:150;
	_display:none !important;
}
	#goPrevious a,
	#goNext a{
		float:left;
		width:24px;
		height:49px;
		background:url('/ressource/common/img/sprite_bigNav.png') no-repeat 0 -80px;
		filter:alpha(opacity=20);       /* IE < 8 */
		-ms-filter:"alpha(opacity=20)"; /* IE 8 */
		opacity:.2;
	}
	#goNext a{
		background-position:-24px -80px;
	}
	#gotop a:hover,
	#goPrevious a:hover,
	#goNext a:hover{
		filter:alpha(opacity=30);       /* IE < 8 */
		-ms-filter:"alpha(opacity=30)"; /* IE 8 */
		opacity:.3;
	}

/*
- TOOLTIPS & DROPDOWNS ---------------------------------------------------------
*/

/* tooltips maison */
.tooltips{
	display:none;
	position:absolute;
	min-width:200px;
	z-index:100;
}
	.tooltips .bd{
		float:left;
		padding:4px 8px 5px;
		background:#000;
		font-family:tahoma;
		font-size:12px;
		line-height:16px;
		color:#fff;
		font-weight:bold;
		-moz-border-radius:3px;
		-webkit-border-radius:3px;
		border-radius:3px;
	}
	.tooltips .tick{
		position:absolute;
		bottom:-6px;
		left:15px;
		z-index:10;
	}

.rel:hover .tooltips{ display:block }

/* position relative pour les tooltips et les dropdowns */
.rel,
.rel_z2{
	position:relative;
	display:inline-block;
	vertical-align:middle;
	*zoom:1;
	*display:inline;
}
.rel_z2{ z-index:101 }

	/* dropdowns */
	.relative.isDropDownBtn .mod,
	.rel .mod,
	.rel_z2 .mod{
		display:none;
		position:absolute;
		margin:0;
		top:25px;
		min-width:200px;
		_width:200px;
		z-index:101;
		_zoom:1;
		cursor:auto;
	}
	.relative.isDropDownBtn .bd,
	.rel .bd,
	.rel_z2 .bd{
		float:left;
	}
	.relative.isDropDownBtn .mod.top,
	.rel .mod.top{
		bottom:25px;
		top:auto;
	}

/* list 1 : menu vertical */
.dropdown1 a,
.ui-autocomplete a{
	color:#303030;
	display:block;
	padding:6px 10px;
	text-decoration:none;
	*padding:3px 10px;
	_padding:5px 10px;
	_zoom:1;
}
.dropdown1 a:hover,
.ui-autocomplete a:hover{ text-decoration:none }

.dropdown1 .clb,
.ui-autocomplete .clb{ color:#3E93CD }

.dropdown1 a.nor,
.ui-autocomplete a.nor{ line-height:24px }
.dropdown1 a.nor:hover,
.ui-autocomplete a.nor:hover,
.ui-autocomplete a.nor.ui-state-hover{ background:#fff !important; color:#303030 !important }

.dropdown1 a:hover,
.dropdown1 a:focus,
.dropdown1 a:hover .em,
.dropdown1 a:focus .em,
.dropdown1 a:hover mark,
.dropdown1 a:focus mark,
.dropdown1 .clb:hover,

/* surcharge de l'autocomplete jQuery-UI */
.ui-autocomplete .clb:hover,
.ui-autocomplete .ui-state-hover,
.ui-autocomplete .ui-state-hover .em,
.ui-autocomplete .ui-state-hover mark{ color:#fff; background:#3E93CD; text-decoration:none; border:none }
.ui-widget { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-size:100%; }
.ui-widget .ui-widget { font-size:100%; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family:"Helvetica Neue",Helvetica,Arial,sans-serif; font-size: 1em; }

/* selection. Mettre la class sur un ul */
.sl a,
.sl li a{ padding-left:20px; }
/*.sl .selected a{
	background-image:url(/expeert.com/skin/common/img/ico_selected.png);
	background-repeat:no-repeat;
	background-position:-1px 9px;
}
.sl .selected a:hover{
	background-image:url(/expeert.com/skin/common/img/ico_selected.png);
	background-repeat:no-repeat;
	background-position:-1px -51px;
}*/
.disabled a,
.disabled li a,
.disabled a:hover,
.disabled li a:hover{
	color:#888;
	background-color:#f4f4f4;
}

/*
- TIPSY ------------------------------------------------------------------------
- http://onehackoranother.com/projects/jquery/tipsy/ -
*/

.tipsy {
	padding:5px;
	font-size:12px;
	font-family:tahoma;
	font-weight:bold;
	max-width:246px; /* corrige bug IE8 */
	position: absolute;
	z-index:100000;
}
.tipsy-inner {
	  max-width:230px;
	  padding:4px 8px 5px;
	  background-color:#000;
	  color:#fff;
	  text-align: center;
	  -moz-border-radius:3px;
	  -webkit-border-radius:3px;
	  border-radius: 3px;
}
.tipsy-arrow {
	  position: absolute;
	  background: url('../img/tipsy.gif') no-repeat top left;
	  width: 9px;
	  height: 5px;
}
.tipsy-n .tipsy-arrow {
	  top: 0;
	  left: 50%;
	  margin-left: -4px;
}
	.tipsy-nw .tipsy-arrow { top: 0; left: 10px; }
	.tipsy-ne .tipsy-arrow { top: 0; right: 10px; }

.tipsy-s .tipsy-arrow {
	  bottom: 0;
	  left: 50%;
	  margin-left: -4px;
	  background-position: bottom left;
}
	.tipsy-sw .tipsy-arrow {
		bottom: 0;
		left: 10px;
		background-position: bottom left;
	}
	.tipsy-se .tipsy-arrow {
		bottom: 0;
		right: 10px;
		background-position: bottom left;
	}
.tipsy-e .tipsy-arrow {
	  top: 50%;
	  margin-top: -4px;
	  right: 0;
	  width: 5px;
	  height: 9px;
	  background-position: top right;
}
.tipsy-w .tipsy-arrow {
	  top: 50%;
	  margin-top: -4px;
	  left: 0;
	  width: 5px;
	  height: 9px;
}

/* DEFINITION DU BOUTON */
.tipsy-btn{
	text-decoration:none;
	display:inline-block;
	height: 20px;
	line-height: 20px;
	padding:0 8px;
	text-decoration: none !important;
	vertical-align: middle;
	border:solid 1px #ccc;
	background: #fefefe;
	margin-left: 5px;
	*overflow:visible;*zoom:1;*display:inline;*margin-right:-3px;
}

.tipsy-btn:hover, .tipsy-btn:active{
	background: #ffffff;
	text-decoration:none
}

.tipsy-cancel{ font-family: arial; color: #fff; font-size: 11px; line-height: 11px; font-weight: bold; text-decoration: none; margin: 3px 0 0 5px; float: right}
.tipsy-cancel:hover{text-decoration: none;}

/* tipsy items specialized in tour (tutorial) display */
.tipsy.tour .tipsy-inner {
	padding: 8px;
	background-color: #0095db;
	-webkit-box-shadow:0 0 10px rgba(0,150,219,1);
	-moz-box-shadow:0 0 10px rgba(0,150,219,1);
	box-shadow:0 0 10px rgba(0,150,219,1);
}

.tipsy.tour .tipsy-arrow {
	  background-image: url('../img/tipsytour.gif');
}

.tipsy.tour .em{ color:#fff; font-weight: bold; display:inline-block; vertical-align: middle; *overflow:visible;*zoom:1;*display:inline;}

/*
- SYSTEME DE MODALE (interne remplace par ui-dialog) ---------------------------
*/

.modalSys{
	display:none;
	width:100%;
	height:100%;
	position:absolute;
	top:0;
	left:0;
	z-index:2147483647;
}
.modalBG{ background:url(/ressource/common/img/bg_opaB50.png) repeat; position:fixed; _background:none }
	.modalCt{
		position:relative;
		margin:auto;
		overflow:visible;
		top:125px;
		width:560px;
	}

/*
- STYLE GENERIQUE DES BOITES ---------------------------------------------------
*/

/* boite pour l'autocomplete jquery */
.box3,
.autoComplete{
	background:#fff;
	border:1px solid #b9b9b9;
	-webkit-box-shadow:0 1px 0px rgba(185,185,185,.5);
	-moz-box-shadow:0 1px 0px rgba(185,185,185,.5);
	box-shadow:0 1px 0px rgba(185,185,185,.5);
}
	/* fond head bleue */
	.box3 .hd, .ui-autocomplete-category{
		overflow:hidden; /* corrige le probleme de margin */
		background:#EBEAE6;
		_zoom:1;
	}
	.box3 .ui-widget-content{ border:none }

/* boite pour les modals */
.box9{
	padding:10px;
	background:#858585;
	background:rgba(82, 82, 82, 0.7);
	-moz-border-radius:8px;
	-webkit-border-radius:8px;
	border-radius:8px;
}
.box9 .ct{
	background: #f3f3f3;
	background: -moz-linear-gradient(top, #ffffff 0%, #f3f3f3 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#f3f3f3));
	background: -webkit-linear-gradient(top, #ffffff 0%,#f3f3f3 100%);
	background: -o-linear-gradient(top, #ffffff 0%,#f3f3f3 100%);
	background: -ms-linear-gradient(top, #ffffff 0%,#f3f3f3 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f3f3f3',GradientType=0 );
	background: linear-gradient(top, #ffffff 0%,#f3f3f3 100%);
	*zoom:1;
}
	.box9 .hd,
	.box9 .bd{
		overflow:hidden;
	}

/* modale de gestion des images du ccmeditor */
.toolbar.actionToolBar { position:relative; padding:10px 7px }
.toolbar.actionToolBar .tool{ margin:0 3px }
.toolbar.actionToolBar .tickGrey{ position:absolute;top:-10px;left:20px }
.toolbar.actionToolBar .tickWhite{ position:absolute; top:-9px; left:21px }
/** like link editions : */
.toolbar.textActions {
	background-color:rgba(255,255,255,.85);
	box-shadow : 1px 1px 3px rgba(50,50,50,.3);
	border:1px solid #aaa;
	border:1px solid rgba(50,50,50,.3);
	margin:4px;
}
.toolbar.textActions a { margin: 0 3px 0 3px;}
.toolbar.textActions .toolLegend {
	color:#888;
	padding: 0 3px 0 3px;
	background-color: #E9EDF0;
	border-top: 1px solid #C8D1D0;
	}

/*
- FORMULAIRE GENERIQUE ---------------------------------------------------------
*/

.form legend{
	display:none;
}
.form .em{
	font-size:12px;
	font-weight:normal;
	font-style:normal;
	color:#888;
}
.form label,
.form .label{
	margin-top:8px;
	margin-right:10px;
	display:block;
	font-weight:bold;
	text-align:right;
	line-height:17px;
}
.form label.txtL,
.form .label.txtL{ text-align:left }
/* colors */
.form .defaultValue{ color:#999 }

/* label avec description */
.form .lblDesc{ margin-top:0 }

.form .line{ margin-bottom:10px }

/* input / select / textarea */
.form .input{
	position:relative;
	padding:7px;
	border:1px solid #b9b9b9;
	background:#fff url(../img/bg_input.png) repeat-x 0 -15px;
	*zoom:1;
}

/* style d'edition */
.form .edit{
	border:1px dashed #b9b9b9;
	background:#fff;
}

/* focus plus tooltips */
.form input:focus + .tooltips{
	display:block;
}
	.form .inputTxt,
	.form textarea,
	.form select{
		width:100%;
		line-height:16px;
		border:none;
		background:none;
	}
	/* textarea */
	.form textarea{
		overflow-y:hidden; /* cache la scrollbar vertical */
		*font-family:"Helvetica Neue",Helvetica,Arial,default; /* bug de font sur IE7 */
	}


/* icones textarea */
.form .txtEdit{
	margin:0 0 -1px 0;
	padding:5px;
	height:22px;
	border:1px dashed #b9b9b9;
	background:#fff;
}
	.form .txtEdit li.rel{
		float:left;
		margin-right:3px;
		border:1px solid #fff;
	}
		.form .txtEdit li.rel a.bold,
		.form .txtEdit li.rel a.italique,
		.form .txtEdit li.rel a.underline,
		.form .txtEdit li.rel a.font,
		.form .txtEdit li.rel a.size,
		.form .txtEdit li.rel a.color,
		.form .txtEdit li.rel a.ol,
		.form .txtEdit li.rel a.ul,
		.form .txtEdit li.rel a.index,
		.form .txtEdit li.rel a.img,
		.form .txtEdit li.rel a.code,
		.form .txtEdit li.rel a.source,
		.form .txtEdit li.rel a.link,
		.form .txtEdit li.rel a.imgL,
		.form .txtEdit li.rel a.imgC,
		.form .txtEdit li.rel a.imgR,
		.form .txtEdit li.rel a.imgF,
		.form .txtEdit li.rel a.summary,
        .form .txtEdit li.rel a.video,
        .form .txtEdit li.rel a.delete,
        .form .txtEdit li.rel a.quiz{
			display:block;
			width:25px;
			height:20px;
			background-image:url('../img/sprite_txtEdit.png?201410061510');
			background-repeat:no-repeat;
		}
		.form .txtEdit li.rel:hover{
			cursor:pointer;
			border-right-color:#b9b9b9;
			border-bottom-color:#b9b9b9;
		}
		.form .txtEdit li.txtActive,
		.form .txtEdit li.rel:active{
			border-top-color:#b9b9b9;
			border-left-color:#b9b9b9;
			border-right-color:#fff;
			border-bottom-color:#fff;
			background:#eee;
		}
		.form .txtEdit li a.bold{      	background-position:3px 50% }
		.form .txtEdit li a.italique{  	background-position:-15px 50% }
		.form .txtEdit li a.underline{ 	background-position:-33px 50% }
		.form .txtEdit li a.font{      	background-position:-55px 50% }
		.form .txtEdit li a.size{      	background-position:-79px 50% }
		.form .txtEdit li a.color{     	background-position:-107px 50% }
		.form .txtEdit li a.ol{        	background-position:-132px 50% }
		.form .txtEdit li a.ul{        	background-position:-153px 50% }
		.form .txtEdit li a.img{       	background-position:-177px 50% }
		.form .txtEdit li a.code,
		.form .txtEdit li a.source{    	background-position:-200px 50% }
		.form .txtEdit li a.link{      	background-position:-224px 50% }
		.form .txtEdit li a.imgL{      	background-position:-249px 50% }
		.form .txtEdit li a.imgC{      	background-position:-274px 50% }
		.form .txtEdit li a.imgR{      	background-position:-299px 50% }
		.form .txtEdit li a.imgF{      	background-position:-324px 50% }
		.form .txtEdit li a.summary{   	background-position:-349px 50% }
        .form .txtEdit li a.video{     	background-position:-372px 50% }
        .form .txtEdit li a.delete{	   	background-position:-392px 50% }
        .form .txtEdit li a.quiz{		background-position:-413px 50% }
        .form .txtEdit label{ margin:0 }

        .form .txtEdit li a.video2{    	background: none !important;text-decoration: none !important}
        .form .txtEdit li a.video2:before {
        	content: "\e614";
        	font-family: "icomoon-pack";
        	color: #000000;
        	font-size: 16px;
        	position: relative;
        	left: -1px;
        }

/* sous menu */
.form .txtEdit li.rel{
	z-index:100;
}
.form .txtEdit li .dropdown1 a{
	width:auto;
	height:auto;
	font-weight:normal;
}
/* sous menu couleur */
.form .txtEdit .dropdown1 .pickColor{
	padding:2px;
}
.form .txtEdit .dropdown1 .pickColor a{
	float:left;
	margin:2px;
	width:0;
	height:0;
	border:1px solid #303030;
}

/* contenteditable */
.contenteditable{
	overflow:auto;
	max-height:400px;
}
/* viewSource edition en mode HTML */
.form textarea.viewSource{
	font-family: Monaco,"Courier New","DejaVu Sans Mono","Bitstream Vera Sans Mono",monospace;
	font-size: 90%;
}

/* edition des tags */
.form .tagslistdiv{ padding:4px 7px; min-height:30px }
.form .tagslistdiv .inputTxt{ padding:7px 0 0 }
.form .tagsList{ line-height:30px }

/* checkbox + radio */
.form .checkbox label,
.form .radio label{
	/*font-size:14px;*/
	margin:0;
	padding:0;
	display:inline;
	font-weight:normal;
	text-align:left;
	display:inline-block;
	vertical-align:middle;
}
.form .checkbox .label,
.form .radio .label{ margin-top:2px }
.form .radio input{ display:inline-block; vertical-align:middle }
.form .checkbox input{ display:none }
.form .checkbox .nocheck,
.form .checkbox .checked{
	display:inline-block;
	vertical-align:middle;
	width:13px;
	height:13px;
	background-position:-27px -62px;
}
.form .checkbox .checked{ background-position:-40px -62px }

/* champs desactiv� */
.form .disabled,
.form .readonly{ background:#e9e9e9; filter:none; -ms-filter:none }
.form .disabled input,
.form .readonly input{ color:#888 }

/* champ surlign� et souslign� */
.form .special{
	padding-top:10px;
	padding-bottom:10px;
	border-top:1px solid #ddd;
	border-bottom:1px solid #ddd;
}
.form .special2{
	padding-bottom:10px;
	border-bottom:1px solid #ddd;
}
.formError .special2{ padding-bottom:25px }

/* petit formulaire ***********************************************************/
.formS .lblDesc{ margin-top:0 }
.formS label,.formS .label{ line-height:15px; padding:0; }
.formS .input{ padding:6px; }
.formS .inputTxt{ line-height:14px; }

/* grand formulaire ***********************************************************/
.formL label,.formL .label{ margin-top:11px; line-height:23px; font-size:20px }
.formL .input{ padding:12px 10px; }
.formL .inputTxt{ font-size:18px; line-height:20px; }
.formL .line{ margin-bottom:15px }
.formL .special{ padding-top:15px; padding-bottom:15px }
.formL .checkbox label{ font-size:14px; margin:0 }
.formL .checkbox .label{ margin-top:0 }

/* formulaire avec erreurs ****************************************************/
.formError .line{
	margin-bottom:25px;
}
	.formError .lineError .input,
	.formError .lineError.input{
		border-color:#e01616;
	}
	.formError .line .msg{
		position:absolute;
		left:0;
		bottom:-19px;
		font-size:12px;
		color:#888;
	}
	.formError .lineError .msg{
		left:auto;
		right:0;
		color:#e01616;
	}

/* contenteditable ************************************************************/
.contenteditable strong,.contenteditable b{ font-weight:bold }
.contenteditable em,.contenteditable i{ font-style:italic }
.contenteditable u{ text-decoration:underline }
.contenteditable ul li{ list-style-type:disc; margin-left:15px }
.contenteditable ol li{ list-style-type:decimal; margin-left:20px; *margin-left:25px }

/* correction for the contentEditable firefox bug cf #*/
.contenteditable a:link:-moz-read-write{text-decoration: none !important;color: #3e93cd !important;}
.contenteditable a:focus:link:-moz-read-write,a:hover:link:-moz-read-write{text-decoration:underline !important;cursor:pointer !important}
/* because ie use <p> on enter :
.contenteditable p {margin-bottom:0px;}*/

/*
- MICRO FORUMS CCM -------------------------------------------------------------
*/

/* liste des commentaires */

.commentBloc{
	position:relative;
	_zoom:1;
}
	.commentBloc .commentLine{
		position:relative;
		margin-top:12px;
		padding:8px 15px;
		background:#EFF2FB;
		border-top:1px solid #EFF2FB;
		border-left:1px solid #EFF2FB;
		zoom:1;
		/*z-index:100; bug tooltips passe en dessous des commentaires*/
	}
	.commentBloc .commentLine .post{
		position:relative;
		padding:5px 0;
		line-height:18px;
		clear:both;
	}
		.commentBloc .commentLine .post a{ text-decoration:none; }
		.commentBloc .commentLine .post a:hover{ text-decoration:underline; }

/* ajouter un commentaire */
.addComment{
	position:relative;
	_position:static;
	min-height:23px;
	padding:8px 15px 10px;
	background:#efefef;
	z-index:10;
	zoom:1;
}
	.addComment .login{
		position:relative;
		margin-bottom:8px;
		line-height:16px;
		zoom:1;
	}
		.addComment .login span a{
			color:#4d4e53;
			font-weight:bold;
		}
	.addComment .submit{
		position:relative;
		margin-top:8px;
	}

/* formulaire d'ajout de reponse */
.formAddComment legend{
	display:none;
}
.formAddComment .comment,
.formAddComment .small{
	width:250px;
	padding:3px 5px;
	border:1px solid #ccc;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	color:#666;
	font-family:arial;
}
.formAddComment .small{
	width:130px;
}
.formAddComment .textarea{
	border:1px solid #ccc;
	background:#fff;
	margin-bottom:8px;
	-moz-border-radius-bottomLeft:5px;
	-moz-border-radius-bottomRight:5px;
	-webkit-border-bottom-left-radius:5px;
	-webkit-border-bottom-right-radius:5px;
}
	.formAddComment .textarea textarea{
		height:70px;
		padding:3px 5px;
		margin:0;
		border:1px solid #fff;
		color:#666;
		font-family:arial;
		overflow-y:hidden;
		-moz-border-radius-topLeft:5px;
		-moz-border-radius-bottomLeft:5px;
		-moz-border-radius-bottomRight:5px;
		-webkit-border-top-left-radius:5px;
		-webkit-border-bottom-left-radius:5px;
		-webkit-border-bottom-right-radius:5px;
	}

/* taille textarea pour les reponses */
.answer .formAddComment .textarea textarea{
	width:530px;
}

/* ajout de note - avis */
.formAddComment .starsCt{
	padding:6px 0;
	margin:0 7px;
	border-bottom:1px dotted #ccc;
	z-index:10;
}
.formAddComment .stars{
	display:inline-block;
	vertical-align:middle;
}

/* icones mise en forme */
.commentBloc .actionsMessage,
.addComment .actionsMessage{
	position:relative;
	top:1px;
	background:#fff;
	border:1px solid #ccc;
	border-bottom:1px dotted #999;
	z-index:10;
}
.commentBloc .actionsMessage li,
.addComment .actionsMessage li{
	float:left;
}
.commentBloc .actionsMessage li a,
.addComment .actionsMessage li a{
	display:block;
	padding:2px 5px;
	float:left;
	width:18px;
	height:16px;
}
.actionsMessage li a.bold{              background:url(../img/ico_textareaW.gif) no-repeat 50% -22px; }
.actionsMessage li a.bold:hover{        background:url(../img/ico_textareaW.gif) no-repeat 50% -2px; }
.actionsMessage li a.italique{          background:url(../img/ico_textareaW.gif) no-repeat 50% -61px; }
.actionsMessage li a.italique:hover{    background:url(../img/ico_textareaW.gif) no-repeat 50% -42px; }
.actionsMessage li a.underline{         background:url(../img/ico_textareaW.gif) no-repeat 50% -100px; }
.actionsMessage li a.underline:hover{   background:url(../img/ico_textareaW.gif) no-repeat 50% -80px; }
.actionsMessage li a.code{              background:url(../img/ico_textareaW.gif) no-repeat 50% -260px; }
.actionsMessage li a.code:hover{        background:url(../img/ico_textareaW.gif) no-repeat 50% -240px; }
.actionsMessage li a.magicLink{         background:url(../img/ico_textareaW.gif) no-repeat 50% -300px; }
.actionsMessage li a.magicLink:hover{   background:url(../img/ico_textareaW.gif) no-repeat 50% -280px; }
.actionsMessage li a.conf{              background:url(../img/ico_textareaW.gif?1) no-repeat 50% -340px; }
.actionsMessage li a.conf:hover{        background:url(../img/ico_textareaW.gif?1) no-repeat 50% -320px; }

/*
- REPONSES ---------------------------------------------------------------------
*/

/* navigation inter post */
.interPostNav{ padding-left:4px }
.interPostNav .tick{ margin:0 3px }

/* conteneur reponse */
.answer{
	position:relative;
	min-height:100px;
	margin-bottom:20px;
	background:url(../img/bg_answer.png) 0 0 repeat-x;
	border-top:2px solid dddddd;
	zoom:1;
}
	.answer .title{
		position:relative;
		height:28px;
		line-height:27px;
		padding:0 10px;
		font-weight:bold;
	}
	.answer .section{
		position:relative;
		padding-left:70px;
		zoom:1;
	}
		.answer .article{
			padding:15px 15px 0 15px;
		}
		.answer .article .post{
			font-family:verdana;
			line-height:18px;
		}
		.answer .article .post a{
			color:#298ec8;
		}

/* reponse moderation */
.answer.modo{ border:1px solid #f48d12 }
.answer.modo .article{ padding:15px }
.answer.modo .title{ background:#f48d12; color:#fff }

/* reponse faq CCM */
.answer.faq{ border:1px solid #dadada }
.answer.faq .article{ padding:15px }
.answer.faq .title{ background:#3487bc; color:#fff }
.answer.faq table{ font-family:verdana; table-layout:auto; width:100% }
.answer.faq .article table th a{ font-weight:bold; color:#303030 }
.answer.faq .article table th{ padding-right:10px }
.answer.faq .article table th,
.answer.faq .article table td{ padding-top:2px; padding-bottom:2px; text-align:left }

/* la meilleur reponse */
.answer.theBest .title{ background:#58A61E  }
.answer.theBest{ border:1px solid #58A61E }
.answer.theBest .title,
.answer.theBest .title a{ color:#fff }

/* reponse supprime */
.answer.delete{ background:#dfdfdf }
.answer.delete .title,
.answer.delete .article .post,
.answer.delete .commentBloc .post{ text-decoration:line-through }
.answer.delete .actionsMenu{ margin-bottom:0; padding-bottom:20px; }
.answer.delete .member .reputation{ border:1px solid #fff; }
.answer.delete:hover .commentBloc .post,
.answer.delete:hover .article .post{ text-decoration:none }
.answer.delete .actionsMenu .links{ display:none }

/* commentaire supprime */
.commentLine.ftDelete,
.microForums .commentLine.ftDelete{ background:#DFDFDF }
.commentLine.ftDelete .links,
.microForums .commentLine.ftDelete .links{ display:none }

/* infos du post */
.postInfos{
	margin-bottom:10px
}
.postInfos .postIp{
	font-family:tahoma;
	float:right;
	font-size:11px;
}
.postInfos .postIp,
.postInfos .postIp a{
	color:#666
}

/* bloc moderation */
.modoActionsNew{
	display:none;
	position:absolute;
	width:319px;
	min-height:100px;
	top:0;
	right:0;
	border:6px solid #777;
	background-color:#efefef;
	z-index:9999999;
	zoom:1;
	font-size:12px;
	-moz-box-shadow:-10px 0 15px -5px rgba(0,0,0,0.5);
	-webkit-box-shadow:-10px 0 15px -5px rgba(0,0,0,0.5);
}
.modoActionsNew .modoMenu{
	padding:10px 15px;
	background:#e3ebf5;
	border-bottom:1px solid #bbb;
}
.modoActionsNew .arrowLeft{
	display:block;
	width:6px;
	height:13px;
	position:absolute;
	left:-12px;
	top:15px;
	background:url(../img/arrowDLOpa.png) no-repeat;
}
.pad10-15 { padding:10px 15px }

.modoActionsNew a.tag{
	background:#fff;
	position:relative;
	padding:3px 5px;
	border:1px solid #99ccfe;
	white-space:nowrap;
	color:#3487BC;
	line-height:28px;
	text-decoration:none;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
}
.modoActionsNew a.tag:hover,
.modoActionsNew a.tag:focus{
	text-decoration:none !important;
	cursor:pointer;
	-moz-box-shadow:0px 0px 2px rgba(0,0,0,0.2);
	-webkit-box-shadow:0px 0px 2px rgba(0,0,0,0.2);
}

/* position dans la reponse */
.answer .modoActionsNew{ top:-2px }
.answer .modoActionsNew .arrowLeft{ top:12px }

/* position dans les commentaires */
.commentLine .modoActionsNew{ top:-12px }
.commentLine .modoActionsNew .arrowLeft{ top:13px }

/* conteneur de tags */
.modoActionsNew .tagContainer a.tag{
	float:left;
	margin:0 3px 5px 0;
	line-height:20px;
	padding:0 5px;
	color:#6d5767;
	border-color:#6d5767;
	text-decoration:none;
}

/* taille textarea */
.modoActionsNew textarea{
	width:283px;
	height:150px;
}

/* bouton de validation forum */
.modoActionsNew .buttonC{
	overflow:visible;
	vertical-align:middle;
	width:auto;
	padding:4px 10px;
	cursor:pointer;
	border-radius:5px;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border:1px solid #bbb;
	background: #eeeeee; /* old browsers */
	background: -moz-linear-gradient(top, #eeeeee 0%, #dddddd 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#eeeeee), color-stop(100%,#dddddd)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eeeeee', endColorstr='#dddddd',GradientType=0 ); /* ie */
	background: -o-linear-gradient(top, #eeeeee 0%,#dddddd 100%); /* opera */
	color:#333;
}
.modoActionsNew .buttonC:hover{
	background: #dddddd; /* old browsers */
	background: -moz-linear-gradient(top, #dddddd 0%, #eeeeee 100%); /* firefox */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#dddddd), color-stop(100%,#eeeeee)); /* webkit */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dddddd', endColorstr='#eeeeee',GradientType=0 ); /* ie */
	background: -o-linear-gradient(top, #dddddd 0%,#eeeeee 100%); /* opera */
	text-decoration:none;
}

/*
- FORMULAIRE FORUM -------------------------------------------------------------
*/

/* answer */
.answer .genForm .textarea textarea{ width:521px }
.answer .genForm .memberConfig textarea{ width:390px }

/*
- CLASSES OBJETS ---------------------------------------------------------------
*/

/* couleur focus */
#topic_question .bgFocus,
.answer .bgFocus,
.commentBloc .commentLine.bgFocus{
	background:#fff9cb;
}
.answer.bgFocus{ background:url(../img/bg_focus.png) repeat-x top left }

/* icone ancre top */
.icoTop{
	padding:0 10px;
	position:relative;
	background-position:-185px -545px;
	zoom:1;
}
.icoTop:hover{ background-position:-209px -545px }

/* icone ancre bottom */
.icoBottom{
	padding:0 10px;
	position:relative;
	background-position:-185px -570px;
	zoom:1;
}
.icoBottom:hover{ background-position:-209px -570px }

/*
- LOADER AJAX ------------------------------------------------------------------
*/

.overlayDiv{
	position:absolute;
	width:100%;
	height:100%;
	left:0;
	top:0;
	z-index:101;
	background:url(../img/bg_opaW50.png) repeat;
}
/* loading ajax */
.waiting{
	position:absolute;
	width:100%;
	height:100%;
	background-image:url(../img/ajax-loaderForum.gif);
	background-position:50% 50%;
	background-repeat:no-repeat;
}

/*
- GLOSSAIRE --------------------------------------------------------------------
- linternaute cinema
- linternaute voyage
*/

.glossary a{
	float:left;
	width:19px;
	height:24px;
	line-height:24px;
	margin:5px 1px;
	text-align:center;
	border:1px solid #bdbdbd;
	background:#f8f8f8 url(../img/bg_glossaryButton.png) 0 0 repeat-x;
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	border-radius:5px;
	font-size:14px;
	font-weight:bold;
	color:#000;
	text-decoration:none;
}
.glossary a:hover,
.glossary a:focus,
.glossary a.selected{
	color:#C00418;
	padding:4px 1px;
	font-size:20px;
	margin:0;
	text-decoration:none;
}
.glossary .buttonLarge {
	width: 30px;
}

/* liste des mots du glossaire */
.glossaryList dt,
.glossaryList dd{
	margin:5px 0;
}
.glossaryList dt{
	font-size:18px;
	font-weight:bold;
}
.glossaryList dd a{
	color:#303030;
}
.glossaryList dd:first-letter{
	text-transform:uppercase;
	font-weight:bold;
}
.glossaryList dd span.suffixe{color:darkgrey;font-style:italic }

/*
- SYSTEME ETOILES --------------------------------------------------------------
*/

.stars{
	display:inline-block;
	vertical-align:middle;
	position:relative;
	width:80px;
	height:13px;
	background-position:0 -46px;
	zoom:1;
}
	.currentNote{
		position:absolute;
		left:0;
		height:13px;
		background-position:0 -61px;
	}
	.stars a{
		display:block;
		position:absolute;
		height:13px;
		left:0;
	}
.oneStar{ width:16px; z-index:5; }
.twoStar{ width:32px; z-index:4; }
.threeStar{ width:48px; z-index:3; }
.fourStar{ width:64px; z-index:2; }
.fiveStar{ width:80px; z-index:1; }

.oneStar:hover,
.twoStar:hover,
.threeStar:hover,
.fourStar:hover,
.fiveStar:hover{
	background-position:0 -61px;
}

/*
- SLIDERS (vignettes) ----------------------------------------------------------

Slider generique de contenu pour les vignettes photos
Le slider comprend une partie generique et une classe qui permet de gerer les
formats des images et d'aligner correctement les vignettes

*/

/* partie generique */
.slider{
	position:relative;
	margin:20px 0;
}
.sliderCt{
	position:relative;
	overflow:hidden;
}
	.slider .ico_sldL,
	.slider .ico_sldR{
		position:absolute;
		z-index:10;
		top:0;
	}
	/* position des fleches de navigation */
	.slider .ico_sldL{ left:0  }
	.slider .ico_sldR{ right:0 }

.slideItem{
	float:left;
	/*display:table;*/
	text-align:center;
}
	.slideItem .slideImg{
		position:relative;
		/*display:table-cell;*/
		vertical-align:bottom;
		*zoom:1
	}
	.slideItem .slideImg .rel{ display:block; vertical-align:baseline; background:#efefef; zoom:0 }
	.slideItem .slideImg img{ display:block; margin:0 auto }
	/*.slideItem .slideTxt{ display:table-row }*/

	/* icone a afficher au hover sur la vignette du slide */
	.slideItem .slideImg       .icoHover{ display:none  }
	.slideItem .slideImg:hover .icoHover{ display:block }

	/* icone play */
	.slideItem .slideImg .icoPlay{
		position:absolute;
		left:50%;
		top:50%;
		margin-left:-27px;
		margin-top:-27px;
	}

/*
- ARRONDIS -------------------------------------------------------------------
*/

.radius5    {-moz-border-radius:5px;            -webkit-border-radius:5px;              border-radius:5px              }
.radiusTL5  {-moz-border-radius-topleft:5px;    -webkit-border-radius-topleft:5px;      border-top-left-radius:5px     }
.radiusTR5  {-moz-border-radius-topright:5px;   -webkit-border-radius-topright:5px;     border-top-right-radius:5px    }
.radiusBL5  {-moz-border-radius-bottomleft:5px; -webkit-border-radius-bottomleft:5px;   border-bottom-left-radius:5px  }
.radiusBR5  {-moz-border-radius-bottomleft:5px; -webkit-border-radius-bottomleft:5px;   border-bottom-left-radius:5px  }
.radius10   {-moz-border-radius:10px;           -webkit-border-radius:10px;             border-radius:10px             }

/*
- MODERATION -------------------------------------------------------------------
*/

.modoBox{
	position:absolute;
	width:254px;
	z-index:109;
	border:1px solid #ccc;
	background-color:#f3f3f3; /* pour opera / ne supporte pas encore les degrades */
	background-image:-webkit-gradient(linear,left top,left bottom,from(#fff),to(#f3f3f3));
	background-image:-moz-linear-gradient(center top,#fff,#f3f3f3);
	filter:progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#f3f3f3'); /* IE6,IE7 */
	-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorStr='#ffffff', EndColorStr='#f3f3f3')"; /* IE8 */
	-webkit-box-shadow:0 1px 0px rgba(185,185,185,.5);
	-moz-box-shadow:0 1px 0px rgba(185,185,185,.5);
	box-shadow:0 1px 0px rgba(185,185,185,.5);
	*zoom:1;
}
.modoBox pre{
	max-width:246px;
	max-height:300px;
	overflow:auto;
}
.modoBox .form textarea{ overflow-y:auto }

/*
- TAGS GENERIQUE ---------------------------------------------------------------
*/

/* icones pour les tags*/
/*/---->

- icone annuler
- icone plus
- icone valid

<----/*/

.icoCancel-1,
.icoCancel-2,
.icoCancel-3,
.icoPlus-1,
.icoPlus-2,
.icoPlus-3,
.icoValid-1,
.icoValid-2,
.icoValid-3{
	display:inline-block;
	vertical-align:baseline;
	width:8px;
	height:8px;
	background-position:-97px -49px;
	_overflow:hidden; /* corrige un bug IE6 qui affiche une hauteur min de 10px */
	*vertical-align:middle;
}
.icoValid-1,
.icoValid-2,
.icoValid-3{
	width:10px;
}
.icoCancel-2{background-position:-105px -49px}
.icoCancel-3{background-position:-113px -49px}

/* icone plus */
.icoPlus-1{background-position:-43px -49px}
.icoPlus-2{background-position:-51px -49px}
.icoPlus-3{background-position:-59px -49px}

/* icone valid */
.icoValid-1{background-position:-67px -49px}
.icoValid-2{background-position:-77px -49px}
.icoValid-3{background-position:-87px -49px}

/* icones generique*/
/*/---->

- icone annuler
- icone plus
- icone valid

<----/*/

.icoForward,
.icoPrint,
.icoOptionsPlus,
.icoSupp{
	display:inline-block;
	vertical-align:middle;
	width:27px;
	height:24px;
	background-position:0 -292px;
	-webkit-box-shadow:0 1px 0px rgba(185,185,185,.5);
	-moz-box-shadow:0 1px 0px rgba(185,185,185,.5);
	box-shadow:0 1px 0px rgba(185,185,185,.5);
}
.icoDel span,
.icoForward span,
.icoPrint span,
.icoOptionsPlus span{ display:none }
/* options plus */
.icoOptionsPlus{    background-position:0 -338px }
.icoOptionsPlus:hover,
.icoOptionsPlus:focus{    background-position:-26px -338px }
.icoOptionsPlus:active{   background-position:-52px -338px }

/* delete */
.icoSupp{    background-position:0 -470px }
.icoSupp:hover,
.icoSupp:focus{    background-position:-25px -470px }
.icoSupp:active{   background-position:-54px -470px }

.icoLess,
.icoMore{
	display:inline-block;
	vertical-align:middle;
	width:28px;
	height:22px;
	border:1px solid #b9b9b9;
	background-position:0 -362px;
	-webkit-box-shadow:0 1px 0px rgba(185,185,185,.5);
	-moz-box-shadow:0 1px 0px rgba(185,185,185,.5);
	box-shadow:0 1px 0px rgba(185,185,185,.5);
}
.icoLess span,
.icoMore span{
	display:none;
}
.icoMore:hover{ background-position:-28px -362px }
.icoMore:active{ background-position:-56px -362px }

.icoLess{ background-position:0 -384px }
.icoLess:hover{ background-position:-28px -384px }
.icoLess:active{ background-position:-56px -384px }

.tagS,
.tagL{
	display:inline-block;
	vertical-align:baseline;
	line-height:14px;
	padding:4px 8px;
	font-size:11px;
	font-weight:bold;
	color:#3e93cd;
	border:1px solid #98ceeb;
	-moz-border-radius:2px;
	-webkit-border-radius:2px;
	border-radius:2px;
	background:#fff;
	*overflow:visible; /* corrige un bug de taille */
	*vertical-align:middle;
	*zoom:1;
	*display:inline;
}
.tagL{
	font-size:20px;
	line-height:18px;
	padding:8px;
	*line-height:22px;
}
.tagS:hover{
	text-decoration:none;
	/*background:url(/expeert.com/skin/common/img/sprite_button.png) repeat 0 1px;*/
}
.tagL:hover{
	text-decoration:none;
	/*background:url(/expeert.com/skin/common/img/sprite_button.png) repeat 0 -336px;*/
}

/* surcharge pour tag inexistant */
.PROPOSAL,
.PROPOSAL:hover{
	color:#999;
	border-color:#ccc;
}
.PROPOSAL .icoCancel-3{
        background-position:-97px -49px;
	display: inline-block;
	height: 8px;
	vertical-align: baseline;
	width: 8px;
	background-position:-97px -49px
}

/*
- SLIDER (diaporama) -----------------------------------------------------------
- http://webbies.dk/SudoSlider/
*/

.diapo{ width:647px; overflow:hidden }

/* Sudo Slider */
.diapo ul,
.diapo li{
	margin:0;
	padding:0;
	list-style:none;
	position:relative;
}
.diapo li{
	width:647px;
	overflow:hidden;
	display:block;
}
.diapo .itemImg,
.diapo .itemImg img{ display:block }

.diapo .itemBt{
	position:absolute;
	height:62px;
	padding:10px;
	background:#000;
	background:rgba(0,0,0,.8);
	bottom:0;
	left:0;
	color:#fff;
	font-size:13px;
	*width:627px; /* bug ie7 de taille au moment du slide */
}
.diapo .itemBt h2,
.diapo .itemBt .h2{ line-height:26px }
.diapo .itemBt h2 a,
.diapo .itemBt .h2 a{ color:#fff; text-transform:uppercase }
.diapo .itemBt h2 a:hover,
.diapo .itemBt .h2 a:hover{ text-decoration:none }

/* navigation gauche droite petite vignettes */
#controls .navL,
#controls .navR{
	position:absolute;
	top:50%;
	margin-top:-22px;
	width:250px;
	height:50px;
	background:#303030;
	background:rgba(0,0,0,.8);
	color:#fff;
	font-size:12px;
	overflow:hidden;
}
#controls .navL{ left:8px }
#controls .navR{ right:8px }
#controls .navL a,
#controls .navR a{ color:#fff }
#controls .navL a:hover,
#controls .navR a:hover{ text-decoration:none }

#controls .navL img{
	display:block;
	float:left;
	margin-right:8px;
}
#controls .navR img{
	display:block;
	float:right;
	margin-left:8px;
}
#controls .navR p,
#controls .navL p{ margin:8px; overflow:hidden; height:34px }

/* Uncomment this if you wan't to only have 1 visible slide before the javascript kicks in.
#diapo li{ display:none }
#diapo li:first-child{ display:block }*/

.graphic,
.prevBtn,
.nextBtn{
	margin:0;
	padding:0;
	display:block;
	overflow:hidden;
	text-indent:-8000px;
}
.prevBtn,
.nextBtn{
	position:absolute;
	top:142px;
	z-index:100;
	cursor:pointer;
}
.prevBtn{left:-5px }
.nextBtn{right:-5px}

.oasPosMiddle,.oasPosMiddle1{
	margin:15px 0;
	text-align:center;
	width:100%;
}

/*.ccmPaginator ol {direction : ltr;}*/
.ccmPaginator li {float:left;margin-bottom: 4px;}
.ccmPaginator li.pageItem * {cursor:move;}
.ccmPaginator li a {margin:0px 2px;display:block;background-color:rgba(100,100,100,.5);height:40px;box-shadow:0 0 5px rgba(100,100,100,.8);color:#fff;font-size: 10px;text-decoration:none;}
.ccmPaginator li a:hover {text-decoration:none;}
.ccmPaginator li a img {display:block;height:40px;}
.ccmPaginator li a div {margin:0px 5px;max-width:50px;max-height:40px;min-width:50px;min-height:40px;}
.ccmPaginator li.add a {font-size: 28px;font-weight: bold;padding-left: 3px;padding-right: 3px;width: 17px;}

/*
- SUR - TETIERE -----------------------------------------------------------
*/

.commonTop{
	font-family: arial;
	background: #fff;
	color:#8c8c8c;
	font-size: 11px;
	padding: 5px 0;
	border-bottom: 1px solid #ddd;
}
.commonTop a{color:#8c8c8c; text-decoration: none}
.commonTop a:hover{color:#8c8c8c; text-decoration: underline}

.commonTop .commonTopCt{ width: 1000px; margin: auto;}

.commonTop li{
	display:inline-block;
	vertical-align:middle;
	*zoom:1;
	*display:inline;
}

/*
- FOOTER AVEC LOGOS -----------------------------------------------------------


.foot, .foot a{ color: #666}
.foot a:hover{ color: #303030;}

.foot .logItem{
	display: inline-block;
	vertical-align: middle;
	outline: none;
	background: url("../img/sprite_logo.png?201209071357") no-repeat 0 0;
	height: 34px;
	*overflow:visible;*zoom:1;*display:inline;}

.foot .logBigItem{
    background: url("../img/bg_logoCCM.png?201209071357") no-repeat 50% 58%;
}

.foot .logItemWrapper{ text-align: center }
.foot .logItem:hover{ text-decoration: none;}

.foot .logLinternaute{ width: 125px; background-position: 0 0}
.foot .logLinternaute:hover{ background-position: 0 -35px }

.foot .logCCM{ width: 105px; background-position: -150px 0}
.foot .logCCM:hover{ background-position: -150px -35px }

.foot .logJDF{ width: 111px; background-position: -287px 0}
.foot .logJDF:hover{ background-position: -287px -35px }

.foot .logDF{ width: 96px; background-position: -435px 0}
.foot .logDF:hover{ background-position: -435px  -35px }

.foot .logJDN{ width: 129px; background-position: -558px 0}
.foot .logJDN:hover{ background-position: -558px  -35px }

.foot .logMS{ width: 103px; background-position: -711px 0}
.foot .logMS:hover{ background-position: -711px -35px }

.foot .logCopains{ width: 120px; background-position: -843px 0}
.foot .logCopains:hover{ background-position: -843px -35px }

.foot .logCCMB{width: 252px; height:60px; background-position: 0 -140px}
.foot .logCCMB:hover{background-position: -253px -140px;}

.foot .logo{
    background: url("http://r.ccmbg.com/common/img/bg_logoCCMB.png?201210091059") repeat-x 0 28px;
    margin-bottom:10px;
}

.foot .brands a, .foot .logo a{
	outline: none;
	background: url("http://r.ccmbg.com/common/img/sprite_logo.png?201210091059") no-repeat 0 0;
	height: 39px;
        margin-left: 25px;
        display: block;
        float: left
}
.foot .logo a{ width: 212px; height: 50px; background-color:#EBEBEB; background-position: 15px -140px; display: block; float: none; padding: 0 15px; margin: auto}
.foot .logo a:hover{ background-position: -238px -140px }


.foot .brands .group_linter{ width: 145px; background-position: -483px -201px}
.foot .brands .group_linter:hover{ background-position: -483px -241px }

.foot .brands .group_ccm{ width: 115px; background-position: 0 -201px}
.foot .brands .group_ccm:hover{ background-position: 0  -241px }

.foot .brands .group_jdf{ width: 113px; background-position: -352px -201px}
.foot .brands .group_jdf:hover{ background-position: -352px -241px }

.foot .brands .group_df{ width: 103px; background-position: -232px -201px}
.foot .brands .group_df:hover{ background-position: -232px  -241px }

.foot .brands .group_jdn{ width: 83px; background-position: -132px -201px}
.foot .brands .group_jdn:hover{ background-position: -132px  -241px }

.foot .brands .group_ms{ width: 112px; background-position: -803px -201px}
.foot .brands .group_ms:hover{ background-position: -803px -241px }

.foot .brands .group_copains{ width: 138px; background-position: -646px -201px}
.foot .brands .group_copains:hover{ background-position: -646px -241px }*/

/* common foot */

/* footer */
.foot.commonFoot{
    position:relative;
    padding: 0;
    background:#ebebeb;
    font-size: 13px;
    font-family: arial;
    font-weight: normal;
}
.foot.commonFoot .page {
    padding: 20px;
    width: 960px;
    background:none;
    margin: auto;
}
.foot.commonFoot .toolLinks { text-align: center}
.foot.commonFoot .toolLinks li{
    border-left: 1px solid #666;
    padding-left: 7px;
    margin-left: 8px;
    display: inline-block;
    vertical-align: middle;
    *overflow:hidden;*zoom:1;*display:inline;
}
.foot.commonFoot .toolLinks li:first-child{ border-left: none; margin-left: 0; padding-left: 0}

.foot.commonFoot a{ color: #666;}
.foot.commonFoot a:hover{ text-decoration: none}

.foot.commonFoot .logo{
        border-bottom: 1px solid #a8a8a8;
        height: 25px;
        position: relative;
        margin-bottom: 35px;
        background: none;
        float: none
}
.foot.commonFoot .brands a,
.foot.commonFoot .logo a hgroup,
.foot.commonFoot .logo a .hgroup{
	outline: none;
	background: url("/fc/img/components/footer/sprite_footer_logos.png") no-repeat 0 0;
	height: 39px;
        margin-left: 25px;
        display: block;
        float: left
}
.foot.commonFoot .logo a{
        background-image: none;
        background-color: #ebebeb;
        display: block;
        padding: 0 20px;
        width: 212px;
        height: 49px;
        position: absolute;
        top: -3px;
        left: 50%;
        margin-left: -126px
}
.foot.commonFoot .logo a hgroup, .foot.commonFoot .logo a .hgroup{
        float: none;
        margin-left: 0;
        background-position: -375px 0;
        width: 212px;
        height: 49px;
}
.foot.commonFoot.lightHover .logo a:hover  hgroup, .foot.commonFoot.lightHover .logo a:hover .hgroup{background-position: -375px -102px}
.foot.commonFoot.darkHover .logo a:hover hgroup, .foot.commonFoot.darkHover .logo a:hover .hgroup{background-position: -375px -245px}


.foot.commonFoot .logo a span, .foot.commonFoot .logo a .hgroup span{display: none}

.foot .brands { margin-bottom: 25px; padding-bottom: 25px; border-bottom: 1px solid #a8a8a8; *height:49px}
.foot .brands:after {
    clear: both;
    content: " x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x x ";
    display: block;
    font-size: xx-large;
    height: 0 !important;
    line-height: 0;
    overflow: hidden;
    visibility: hidden;
}
.foot .brands a:first-child{ margin-left: 0}

.foot.commonFoot .brands .group_linter{ width: 145px; background-position: -528px -63px}
.foot.commonFoot.lightHover .brands .group_linter:hover{ background-position: -528px -165px }
.foot.commonFoot.darkHover .brands .group_linter:hover{ background-position: -528px -308px }

.foot.commonFoot .brands .group_ccm{ width: 115px; background-position: 0 -63px}
.foot.commonFoot.lightHover .brands .group_ccm:hover{ background-position: 0 -165px }
.foot.commonFoot.darkHover .brands .group_ccm:hover{ background-position: 0 -308px }

.foot.commonFoot .brands .group_jdf{ width: 113px; background-position: -397px -63px}
.foot.commonFoot.lightHover .brands .group_jdf:hover{ background-position: -397px -165px }
.foot.commonFoot.darkHover .brands .group_jdf:hover{ background-position: -397px -308px }

.foot.commonFoot .brands .group_df{ width: 103px; background-position: -278px -63px}
.foot.commonFoot.lightHover .brands .group_df:hover{ background-position: -278px -165px }
.foot.commonFoot.darkHover .brands .group_df:hover{ background-position: -278px -308px }

.foot.commonFoot .brands .group_jdn{ width: 83px; background-position: -155px -63px}
.foot.commonFoot.lightHover .brands .group_jdn:hover{ background-position: -155px -165px }
.foot.commonFoot.darkHover .brands .group_jdn:hover{ background-position: -155px -308px }

.foot.commonFoot .brands .group_ms{ width: 112px; background-position: -848px -63px}
.foot.commonFoot.lightHover .brands .group_ms:hover{ background-position: -848px -165px }
.foot.commonFoot.darkHover .brands .group_ms:hover{ background-position: -848px -308px }

.foot.commonFoot .brands .group_copains{ width: 138px; background-position: -691px -63px}
.foot.commonFoot.lightHover .brands .group_copains:hover{ background-position: -691px -165px }
.foot.commonFoot.darkHover .brands .group_copains:hover{ background-position: -691px -308px }
