@charset "UTF-8";

@font-face {
  font-family: 'Slava-F';
  src: url('fonts/fl.eot');
  src: local('☺'),
       url('fonts/fl.woff') format('woff'),
	   url('fonts/fl.ttf') format('truetype'),
	   url('fonts/fl.svg#webfont1') format('svg');
  font-style: normal;
  font-weight: 200;
}
@font-face {
  font-family: 'Slava-F';
  src: url('fonts/fh.eot');
  src: local('☺'),
       url('fonts/fh.woff') format('woff'),
	   url('fonts/fh.ttf') format('truetype'),
	   url('fonts/fh.svg#webfont2') format('svg');
  font-style: normal;
  font-weight: 700;
}

#conash3D0 { display:none; } /* enlève le bandeau du pub goDaddy */

html { 
  font-size: 100%; /* Évite un bug d'IE 6-7. */ 
} 
body {
	font-family: "Slava-F", Helvetica, Arial, sans-serif;
	font-size: 1em;
	/*letter-spacing: 1px;*/
	background: #FFFFFF;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #336699;
}
strong {
	/* font-family: "F-heavy", Helvetica, Arial, sans-serif; */
	/* font-family: "Slava-F", Helvetica, Arial, sans-serif;*/
	/* font-weight: 700;*/
	letter-spacing: 1px;
}
#metacontainer {
	width: 980px;
	background: #FFFFFF;
	margin: 0 auto;
	text-align: left;
	font-size: 1.1em;
}
#header {
	/*padding: 0 10px 0 20px;*/  /* ce remplissage correspond à l'alignement à gauche des éléments des div qui apparaissent en dessous. Si, au lieu de texte, c'est une image qui est insérée dans l'élément #header, il est conseillé de supprimer le remplissage. */
}
#header h1 {
	margin: 0; /* la mise à zéro de la marge du dernier élément du div #header permet d'éviter une disparition de la marge (espace inexplicable entre les éléments div). Si l'élément div est entouré d'une bordure, cette précaution n'est pas nécessaire, car la bordure évite également la disparition de la marge */
	padding: 10px 0; /* l'utilisation de remplissage, au lieu d'une marge, permet d'éloigner l'élément des bords de l'élément div */
}
#mainContent {
	padding: 0;
	/*background: #8e8e8e;*/
}
#mainContent h2 {
	margin: 0;
	padding: 0;
	outline: none; /* désactive le halo bleu lors d'un clic sur cette zone */
}
#mainContent h2.headPane { cursor: pointer; }
#mainContent p {
	margin: 0;
	padding: .5em 0 1em 0;
}
.accrocheTxt {
	font-size: 0.7em;
	font-weight: normal;
	padding: 1em 3em 1em 29px;
	display: block;
	background: url(../images/fleche-seule.gif) no-repeat right center;
}
.accrocheTxtOpen {
	background: url(../images/fleche-seule-open.gif) no-repeat right center;
}
.contentPane {
	/*font-size: 0.7em;*/
	font-weight: normal;
	padding: 0 29px 1em 29px;
	display: block;
}

.container { float:left; clear:left; width:100%; padding:0 0 2em; /* background: #333; */ }
.col280gauche {
	width: 252px;
	margin: 21px 28px 0 0;
	float: left;
	font-size: .9em;
	/* background: #EEE; */
}
.col280droite {
	width: 252px;
	margin: 21px 0 0 28px;
	float: left;
	font-size: .9em;
	/* background: #EEE; */
}
.col336 {
	width:336px;
	margin-left: 8px;
	float:left;
	/* background: #999; */
}
div.col336 img {
	margin:0 0 21px 21px;
	padding:0;
	display : block;
	float:left;
}
div.col336 img.nomargin {
	margin:0 0 10px 0;
}
.col560 {
	width:560px;
	float:left;
	/* background: #222; */
}
.col560 img {
	margin:0 21px 21px 0;
	padding:0;
	display : block;
	float:left;
}

#footer {
	padding: 3em 29px 0.5em 29px;
	background: #FFFFFF;
	/*font-weight: 200;*/
}
#footer p {
	margin: 0; /* la mise à zéro de la marge du premier élément du pied de page permet d'éviter une possible disparition de la marge (espace entre les éléments div) */
	padding: 1em 0 0 0; /* l'utilisation d'un remplissage pour cet élément crée un espace, tout comme une marge l'aurait fait, mais en évitant le risque de disparition de la marge */
}
#footer div.container {
	/*padding: 0;*/
}
#footer div.col336 {
	float:right;
	text-align:right;
}
#footer p.credits {
	font-size: .76em;
	color: #999;
	margin: 0;
	padding: .8em 0;
}
#footer p.credits a { color: #999; text-decoration: none; font-weight: 200; border-bottom-style: none; }
#footer p.credits a:hover, a:focus, a:active { text-decoration: underline; }

/* Liens */ 
a { text-decoration: none; font-weight: 700; }
a img { border: none; }
#metacontainer a:link, #metacontainer a:visited {
	color: #efaa15;
	border-bottom-width: 1px;
	border-bottom-style: dashed;
	border-bottom-color: #efaa15;
	text-decoration: none;
}
#metacontainer a:hover, #metacontainer a:focus, #metacontainer a:active {
	color: #efaa15;
	border-bottom-style: none;
}
#metacontainer a.videoPlayer { display:block; width:560px; height:315px; border: none; }
#metacontainer a.videoPlayer img { margin:0; padding:0; }

a.linkopacity img {
	filter:alpha(opacity=100); 
	-moz-opacity: 1.0; 
	opacity: 1.0;
	-khtml-opacity: 1.0;
}
a.linkopacity:hover img {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8; 
	opacity: 0.8;
	-khtml-opacity: 0.8;
}
.survolimg {
	filter:alpha(opacity=80);
	-moz-opacity: 0.8; 
	opacity: 0.8;
	-khtml-opacity: 0.8;
}

.note { font-size: .9em; }
.legende { }
sup { vertical-align: top; }
hr { height: 1px; margin: 0; padding: 0; color: #99b2cc; background-color: #99b2cc; border: 0; }

/*
 * jQuery UI Accordion 1.8.8
 *
 * Copyright 2010, AUTHORS.txt (http://jqueryui.com/about)
 * Dual licensed under the MIT or GPL Version 2 licenses.
 * http://jquery.org/license
 *
 * http://docs.jquery.com/UI/Accordion#theming
 */
/* IE/Win - Fix animation bug - #4615 */
.ui-accordion { width: 100%; }
.ui-accordion .ui-accordion-header { cursor: pointer; position: relative; margin-top: 1px; zoom: 1; }
.ui-accordion .ui-accordion-li-fix { display: inline; }
.ui-accordion .ui-accordion-header-active { border-bottom: 0 !important; }
.ui-accordion .ui-accordion-header a { display: block; font-size: 1em; padding: .5em .5em .5em .7em; } /* */
.ui-accordion-icons .ui-accordion-header a { padding-left: 2.2em; }
.ui-accordion .ui-accordion-header .ui-icon { position: absolute; left: 933px; top: 88%; } /* left et top placent la fleche sous l'image, et j'ai enlevé margin-top: -8px; */
.ui-accordion .ui-accordion-content { padding: 0 29px 1em 29px; border-top: 0; margin-top: -2px; position: relative; top: 1px; margin-bottom: 2px; overflow: auto; display: none; zoom: 1; }
.ui-accordion .ui-accordion-content-active { display: block; }

.ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
.ui-icon { width: 47px; height: 47px; background-image: url(../images/ui-icons-fleche.png); }
.ui-icon-fleche-e { background-position: 0 0; }
.ui-icon-fleche-s { background-position: -47px 0; }