/*TODO : mieux styler les blocs compléments (dans les extras)*/

@font-face {
    font-family: 'museoSans';
    src: url('MuseoSans_500-webfont.eot');
    src: url('MuseoSans_500-webfont.eot?#iefix') format('embedded-opentype'),
         url('MuseoSans_500-webfont.woff') format('woff'),
         url('MuseoSans_500-webfont.ttf') format('truetype'),
         url('MuseoSans_500-webfont.svg#MuseoSans500Regular') format('svg');
    font-weight: normal;
    font-style: normal;
}

/*Museo Sans is a font by Jos Buivenga (exljbris) -> www.exljbris.com*/

html, body{
	font-family:museoSans, sans-serif;
	margin: 0px;
	padding: 0px;
	color: #2C2C2C;
	font-size: 14px
}

body{
	position: absolute;
/*SKIN	width: 980px;
	height: 600px;
	left: 50%;
	top: 50%;
	margin-left: -490px;
	margin-top: -300px;*/

	width: 100%;
	height: 100%;
}

th{
	text-align: right;
}

a.op_txt_ul, a.txt_url_ul, a.op_bibTxt_ul_url, .refOutlineEntry a{
/*SKIN	color: #A827C0;
	border-bottom: 1px solid #A827C0;*/

	color: white;
	border-bottom: 1px solid white;
	display: inline-block;
	margin-bottom: 2px;
	border-bottom-width: 1px;
	text-decoration: none;
}

a.op_txt_ul{
/*SKIN	color: #D78A00;
	border-bottom: 1px solid #EB9C0E;*/

	color: white;
	border-bottom: 1px solid white;
	font-weight: bold;
}

a.txt_url_ul:hover, a.op_txt_ul:hover, a.op_bibTxt_ul_url:hover,  .refOutlineEntry a:hover{
	border-bottom-width: 3px;
	margin-bottom: 0px
}

.complt a.op_txt_ul, .complt a.txt_url_ul, .extra a.op_txt_ul, .extra a.txt_url_ul, .credits a.op_txt_ul, .credits a.txt_url_ul, .refOutlineEntry a{
	border-bottom-color: white;
	color: white;
}

p, ul, li{
	text-align: left;	
	margin-top: 0px
}


/*structure :
main
	header
	#content
		#margin
		#slideshow
			.slide (plusieurs les uns sur les autres en principe)
				.segmentTitle
				.segmentNotes
					.segmentNotesContent
				.segmentDescIllus
					.segmentDescIllusContent
						.description
							.descriptionContent
						.illustrations
							.illustrationsContent
								.illustration (plusieurs)
	#controller
	
On définit les dimensions générales de l'interface en deux seuls endroits : largeur sur le #main et hauteur sur le #content. Ça permet d'avoir une interface qui s'adapte en cas de titre qui passe sur deux lignes 
*/

#main {
  background: url(img/fond.png) center center repeat-x #f5f5f2;
/*	-webkit-box-shadow: inset 0px 0px 30px 1px rgba(200, 200, 200, 1);
	-moz-box-shadow: inset 0px 0px 30px 1px rgba(200, 200, 200, 1);
	-o-box-shadow: inset 0px 0px 30px 1px rgba(200, 200, 200, 1);
	-ms-box-shadow: inset 0px 0px 30px 1px rgba(200, 200, 200, 1);
	box-shadow: inset 0px 0px 30px 1px rgba(200, 200, 200, 1);*/
	margin:auto;
	display: inline-block;
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden /* nécessaire pour que les compléments placés en dehors de l'interface ne soient pas visibles*/
}

/*trucs de premier niveau*/
header{
	position: absolute;
	top: 0;
	width: 100%;
/*SKIN	height: 40px;*/

	height: 50px;
	z-index: 3
}

#content{
	position: absolute;
	width: 100%;
/*SKIN	bottom: 40px;
	top: 40px;*/

	background: url(img/logoKezako.png) bottom center no-repeat;
	top: 50px;
	bottom: 50px;
	overflow: hidden /* je ne sais pas trop pourquoi mais il faut mettre ça pour que l'interface ne soit pas décalée vers le haut sur FF*/
}

#controller {
/*SKIN	height: 40px;*/

	height: 50px;
	position: absolute;
	bottom: 0;
	width: 100%;
	z-index: 2;
}

/*trucs dans #content*/
#slideshow{
	position: absolute;
	left: 0;
	right: 0;
	height: 100%;
}
#content.contentWithToc #slideshow{
	left:20%
}

#content.content[data-hasillustr=true] #slideshow{
	left: 20%;
}

/*trucs dans #slideshow*/
div.slide  {
	opacity: 0;
	visibility:hidden;
	left: 0;
	right: 0;
	position: absolute;
	height: 100%;
}

/*trucs dans un slide*/
.segmentTitle{
	position: absolute;
	top: 0;
	height: 50px;
	width: 100%;
  text-shadow         : 1px 1px 0 white;
  -o-text-shadow      : 1px 1px 0 white;
  -moz-text-shadow    : 1px 1px 0 white;
  -webkit-text-shadow : 1px 1px 0 white;
	height: 50px;
	color: #6a6a6a;
	font-size: 19px;
	text-align: center;
	white-space: nowrap;
}

.segmentTitle span{
	margin-top: 10px;
	display: inline-block;
}

.segmentNotes{
	position: absolute;
/*SKIN	top: 0;
	bottom: 0;
	left: 0;
	width: 25%;*/
    display: table;
    height: 380px;
    left: 50%;
    margin-left: -510px;
    margin-top: -140px;
    position: absolute;
    top: 50%;
    width: 180px;
}

#content.content[data-hasillustr=true] div.slide.videoStream .segmentNotes{
	left: -25%;
}

#content.content[data-hasillustr=true] div.slide.videoStream .segmentDescIllus{
	left: 0;
}

.segmentNotesContent{
/*SKIN	position: absolute;
	top: 50px;
	bottom: 0;
	left: 0;
	width: 100%;
	overflow: auto;*/
	display: table-cell;
	vertical-align: middle;
}

#content.content[data-hasillustr=true] .segmentNotesContent{
	top: 33%;
}

.segmentNotesContentInside{
	padding: 10px
}

.segmentDescIllus{
	position: absolute;
	top: 50px;
	bottom: 0;
	left: 0;
	right: 0;
	overflow: auto;
	/*SKIN*/
	display: none;
}

#content[data-hasnotes] .segmentDescIllus{
	left: 25%;
}

.segmentDescIllusContent{
	display: table;
	width: 100%
}
	
/*trucs dans #margin*/
#marginToc, #marginTags{
	position: absolute;
	border-bottom: 2px solid white;
	bottom: 0;
	top: 50%;
	background: #A827C0; /* Old browsers */
	background: -moz-linear-gradient(top,  #732382 0%, #A827C0 45%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#732382), color-stop(45%,#A827C0)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #732382 0%,#A827C0 45%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #732382 0%,#A827C0 45%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #732382 0%,#A827C0 45%); /* IE10+ */
	background: linear-gradient(top,  #732382 0%,#A827C0 45%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#732382', endColorstr='#A827C0',GradientType=0 ); /* IE6-9 */	
	overflow: auto;
	-webkit-transition: top 0.5s ease-out, bottom 0.5s ease-out;
	-ms-transition: top 0.5s ease-out, bottom 0.5s ease-out;
	-moz-transition: top 0.5s ease-out, bottom 0.5s ease-out;
	-o-transition: top 0.5s ease-out, bottom 0.5s ease-out;
	transition: top 0.5s ease-out, bottom 0.5s ease-out;
	width: 20%
}

#marginTags{
	bottom: 50%;
	top: 0
}

#marginTags.seul, #marginToc.seul{
	top: 0
}

#marginToc #toc ul{
	font-size:0.9em;
	list-style-type: none;
	padding-left: 0px;
}

#marginToc #toc ul ul{
	padding-left: 15px;
}

#marginToc #toc ul a{
	border-left: 1px solid white;
	padding-left: 5px;
	margin-bottom: 5px
}

.tocComplement{
	background: url(img/compltTOC.png) left center no-repeat;
	padding-left: 13px;
	color: white;
}


div#content[data-hasIllustr] video#media~#marginToc, div#content[data-hasIllustr] #media[data-currentType=video]~#marginToc {
	top: 67%;
	bottom:0;
}

div#content[data-hasIllustr] video#media~#marginTags, div#content[data-hasIllustr] #media[data-currentType=video]~#marginTags {
	top: 33%;
	bottom:33%;
}

div#content[data-hasIllustr] video#media~#marginToc.seul, div#content[data-hasIllustr] #media[data-currentType=video]~#marginToc.seul {
}


div#content[data-hasIllustr] video#media~#marginToc.seul, div#content[data-hasIllustr] #media[data-currentType=video]~#marginToc.seul,
div#content[data-hasIllustr] video#media~#marginTags.seul, div#content[data-hasIllustr] #media[data-currentType=video]~#marginTags.seul {
	top: 33%;
	bottom: 0;
}

#marginToc #toc, #marginTags #tags{
	padding: 10px;
  text-shadow         : 1px 1px 0 #60166E;
  -o-text-shadow      : 1px 1px 0 #60166E;
  -moz-text-shadow    : 1px 1px 0 #60166E;
  -ms-text-shadow    : 1px 1px 0 #60166E;
  -webkit-text-shadow : 1px 1px 0 #60166E;
}


header h1 {
	font-size: 20px;
/*SKIN	color: #9f1eb7;
	border-bottom: 2px solid #9f1eb7;
	padding: 7px 0 3px 0;
	margin: 0 10px 10px;*/

	padding: 15px 0 13px 20px;
	margin: 0;
	color: #92004f;
	border-bottom: 2px solid #92004f;
	display: block;
}

h1 a {
  color: #333 !important;
  text-shadow         : 0px 1px 10px #333;
  -o-text-shadow      : 0px 1px 10px #333;
  -moz-text-shadow    : 0px 1px 10px #333;
  -ms-text-shadow    : 0px 1px 10px #333;
  -webkit-text-shadow : 0px 1px 10px #333;
}

/* Onglet */
#tabs ul{ 
    position: absolute;
    top: 0px;
    right: 5px;
    list-style-type: none;
    padding:0px;
    margin: 0px;
	overflow: visible;
	padding: 0px
}

#tabs ul li{
   display: inline-block;;
	margin-left: 5px;
	vertical-align: top;
}

#tabs ul ul li{
    display: block;
    margin-left: 0px;
    width: 100%;
}

#tabs ul ul li a{
    display: block;
/*    width: 100%;*/
}

#tabs ul ul{
	display: block;
	position: static;
}

#tabs li.subMenu:hover ul li a{
	height: 30px;
}

#tabs ul ul li a{
	height: 0px;
	overflow: hidden;
}

#tabs ul li a, #tabs ul li > span{
    display: inline-block;
    text-align:center;    
	text-decoration: none;
	color: white;
/*SKIN	-moz-box-shadow: 0px 0px 5px #9a9a9a;
	-ms-box-shadow: 0px 0px 5px #9a9a9a;
	-o-box-shadow: 0px 0px 5px #9a9a9a;
	-webkit-box-shadow: 0px 0px 5px #9a9a9a;
	box-shadow: 0px 0px 5px #9a9a9a;*/
  text-shadow         : 1px 1px 0 gray;
  -o-text-shadow      : 1px 1px 0 gray;
  -moz-text-shadow    : 1px 1px 0 gray;
  -ms-text-shadow    : 1px 1px 0 gray;
  -webkit-text-shadow : 1px 1px 0 gray;
	white-space: nowrap;
	-moz-transition:all 0.3s ease-out;
	-webkit-transition:all 0.3s ease-out;
	-o-transition:all 0.3s ease-out;
	-ms-transition:all 0.3s ease-out;
	transition:all 0.3s ease-out;
/*SKIN	height: 30px;
	padding-top: 0px*/
}

#tabs .subMenu ul li > a span, #tabs .subMenu ul li > span span{
	padding: 5px 10px;
	display: block;
}

#tabs ul li > span{
	display: block;
}


#tabs ul li a:hover, #tabs li.subMenu:hover ul li a:hover{
/*SKIN	height: 35px;
	padding-top: 10px*/
}

/*SKIN */
a.glos span, a.bib span{
	display: none;
}

/*SKIN a.infos, .infos_win{
	background: #91AB2A;
	background: -moz-linear-gradient(top,  #798C2C 0%, #91AB2A 45%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#798C2C), color-stop(45%,#91AB2A));
	background: -webkit-linear-gradient(top,  #798C2C 0%,#91AB2A 45%);
	background: -o-linear-gradient(top,  #798C2C 0%,#91AB2A 45%);
	background: -ms-linear-gradient(top,  #798C2C 0%,#91AB2A 45%);
	background: linear-gradient(top,  #798C2C 0%,#91AB2A 45%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#798C2C', endColorstr='#91AB2A',GradientType=0 );
}*/

.infos_win{
	background: #92004F; /* Old browsers */
	background: -moz-linear-gradient(top,  #750542 0%, #92004F 45%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#750542), color-stop(45%,#92004F)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #750542 0%,#92004F 45%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #750542 0%,#92004F 45%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #750542 0%,#92004F 45%); /* IE10+ */
	background: linear-gradient(top,  #750542 0%,#92004F 45%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#750542', endColorstr='#92004F',GradientType=0 ); /* IE6-9 */	
}

/*SKIN*/
a.infos{
	width: 46px;
	height: 46px;
	background: url(img/infos.png) center center no-repeat;
	margin-top: 3px
}

/*SKIN*/
#tabs ul li > a.infos span, a.extra span{
	display: none;
}

/*SKIN a.extra, span.extra, .extra_win{
 	background: #2f89b7; 
	background: -moz-linear-gradient(top, #176186 0%, #2f89b7 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#176186), color-stop(45%,#2f89b7)); 
	background: -webkit-linear-gradient(top, #176186 0%,#2f89b7 45%); 
	background: -o-linear-gradient(top, #176186 0%,#2f89b7 45%); 
	background: -ms-linear-gradient(top, #176186 0%,#2f89b7 45%); 
	background: linear-gradient(top, #176186 0%,#2f89b7 45%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#176186', endColorstr='#2f89b7',GradientType=0 ); */

li li a.extra, .extra_win{
	background: #F59B00; 
	background: -moz-linear-gradient(top, #E18D00 0%, #F59B00 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#E18D00), color-stop(45%,#F59B00)); 
	background: -webkit-linear-gradient(top, #E18D00 0%,#F59B00 45%); 
	background: -o-linear-gradient(top, #E18D00 0%,#F59B00 45%); 
	background: -ms-linear-gradient(top, #E18D00 0%,#F59B00 45%); 
	background: linear-gradient(top, #E18D00 0%,#F59B00 45%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#E18D00', endColorstr='#F59B00',GradientType=0 ); 
}

li li a.credits, .credits_win{
	background: #8E8E8E; /* Old browsers */
	background: -moz-linear-gradient(top, #757575 0%, #8E8E8E 45%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#757575), color-stop(45%,#8E8E8E)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #757575 0%,#8E8E8E 45%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #757575 0%,#8E8E8E 45%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top, #757575 0%,#8E8E8E 45%); /* IE10+ */
	background: linear-gradient(top, #757575 0%,#8E8E8E 45%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#757575', endColorstr='#8E8E8E',GradientType=0 ); /* IE6-9 */
}

/*SKIN a.glos, .glos_win{*/
.subMenu a.glos, .glos_win{
	background: #C83E8B; /* Old browsers */
	background: -moz-linear-gradient(top,  #A02D6E 0%, #C83E8B 45%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#A02D6E), color-stop(45%,#C83E8B)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #A02D6E 0%,#C83E8B 45%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #A02D6E 0%,#C83E8B 45%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #A02D6E 0%,#C83E8B 45%); /* IE10+ */
	background: linear-gradient(top,  #A02D6E 0%,#C83E8B 45%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A02D6E', endColorstr='#C83E8B',GradientType=0 ); /* IE6-9 */
	/*SKIN*/
	margin-top: 0
}

/*SKIN	background: #C8C8C8; 
span.index{
	background: -moz-linear-gradient(top,  #646464 0%, #8D8D8D 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#646464), color-stop(45%,#8D8D8D)); 
	background: -webkit-linear-gradient(top,  #646464 0%,#8D8D8D 45%); 
	background: -o-linear-gradient(top,  #646464 0%,#8D8D8D 45%); 
	background: -ms-linear-gradient(top,  #646464 0%,#8D8D8D 45%);
	background: linear-gradient(top,  #646464 0%,#8D8D8D 45%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#646464', endColorstr='#8D8D8D',GradientType=0 ); */

span.index, a.glos, a.bib{
	width: auto;
	min-width: 60px;
	height: 48px;
	background: url(img/references.png) center center no-repeat;
	margin-top: 3px
}

/*SKIN*/
span.index, a.glos, a.bib{

}

/*SKIN*/
#tabs ul li > span.index span, #tabs ul li > span.extra span, #tabs ul li > a.credits span, a.glos span, a.bib span{
	display: none;
}

/*SKIN*/
span.extra, a.extra{
	background: url("img/compltNu.png") no-repeat center center;
	width: auto;
	min-width: 46px;
	height: 46px;
}

span.extra, a.extra{
	margin-top: 3px
}

li li a.extra{
	margin-top: 0
}
/*SKIN*/
a.credits{
	background: url("img/credits.png") no-repeat center center;
	width: auto;
	height: 46px;
	width: 46px;
	margin-top: 3px;
	margin-left: 15px;
}

/*SKIN a.bib, .bib_win{*/
.subMenu a.bib, .bib_win, .credits_win{
	background: #7D9C2A; 
	background: -moz-linear-gradient(top,  #688223 0%, #7D9C2A 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#688223), color-stop(45%,#7D9C2A));
	background: -webkit-linear-gradient(top,  #688223 0%,#7D9C2A 45%);
	background: -o-linear-gradient(top,  #688223 0%,#7D9C2A 45%);
	background: -ms-linear-gradient(top,  #688223 0%,#7D9C2A 45%);
	background: linear-gradient(top, #688223 0%,#7D9C2A 45%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#688223', endColorstr='#7D9C2A',GradientType=0 ); 
/*SKIN*/
	margin-top: 0
}

a.ref, .ref_win{
	background: #c8783e; /* Old browsers */
	background: -moz-linear-gradient(top,  #A85E2A 0%, #c8783e 45%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#A85E2A), color-stop(45%,#c8783e)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #A85E2A 0%,#c8783e 45%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #A85E2A 0%,#c8783e 45%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #A85E2A 0%,#c8783e 45%); /* IE10+ */
	background: linear-gradient(top,  #A85E2A 0%,#c8783e 45%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#A85E2A', endColorstr='#c8783e',GradientType=0 ); /* IE6-9 */
}

/* Complement*/

#slideshow div.complt {
	position: absolute;	
	background-color: #A827C0;
	z-index: 20;
	right : -300px;
	top: 200px;
/*SKIN	background: #A827C0; 
	background: -moz-linear-gradient(top,  #732382 0%, #A827C0 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#732382), color-stop(45%,#A827C0)); 
	background: -webkit-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: -o-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: -ms-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: linear-gradient(top,  #732382 0%,#A827C0 45%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#732382', endColorstr='#A827C0',GradientType=0 ); */
	
	background: #4993c3; 
	background: -moz-linear-gradient(top,  #4993c3 0%, #34759f 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4993c3), color-stop(45%,#34759f)); 
	background: -webkit-linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	background: -o-linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	background: -ms-linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	background: linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	
	height: 0;
	width: 0;
	-moz-box-shadow: 0px 0px 15px black;
	-ms-box-shadow: 0px 0px 15px black;
	-o-box-shadow: 0px 0px 15px black;
	-webkit-box-shadow: 0px 0px 15px black;
	box-shadow: 0px 0px 15px black;
	border:1px solid white;
	color: white;
}

/*
#slideshow div.complt:nth-of-type(9n+3) {
	top: -170px;
}

#slideshow div.complt:nth-of-type(9n+4) {
	top: -130px;
}

#slideshow div.complt:nth-of-type(9n+5) {
	top: -90px;
}

#slideshow div.complt:nth-of-type(9n+6) {
	top: -50px;
}

#slideshow div.complt:nth-of-type(9n+7) {
	top: 10px;
}

#slideshow div.complt:nth-of-type(9n+8) {
	top: 30px;
}

#slideshow div.complt:nth-of-type(9n+9) {
	top: 70px;
}

#slideshow div.complt:nth-of-type(9n+10) {
	top: 110px;
}

#slideshow div.complt:nth-of-type(9n+11) {
	top: 150px;
}*/

#slideshow div.complt[data-display=true] {	
	right: 10%;
	top: 10%;
	height: 80%;
	width: 80%;
}

.content[data-hasillustr=true] #slideshow div.complt[data-display=true], .contentWithToc #slideshow div.complt[data-display=true] {	
	width: 105%; /*comme le référent pour le % est #slideshow et que celui-ci a une taille différente selon qu'on a une marge ou non, il faut faire deux cas de figure*/
}

.compltOff{
	position: absolute;
	top: 5px;
	right: 5px;
}

.compltContent{
	padding: 10px;
	position: absolute;
	top:35px;
	bottom: 0px;
	overflow: auto;
	left: 0px;
	right: 0px;
}

/* Iframes */

.infos_win, .extra_win, .credits_win, .glos_win, .bib_win, .ref_win {
	position: absolute;
	top: 10%;
	left: 10%;
	right: 10%;
	bottom: 10%;
	-moz-box-shadow: 0px 0px 15px black;
	-ms-box-shadow: 0px 0px 15px black;
	-o-box-shadow: 0px 0px 15px black;
	-webkit-box-shadow: 0px 0px 15px black;
	box-shadow: 0px 0px 15px black;
	border:1px solid white;
}

.infos_co, .extra_co, .credits_co, .glos_co, .bib_co, .ref_co {
	position: absolute;
	top: 20px;
	left: 3px;
	right: 5px;
	bottom: 3px;
}

body div div iframe{
	position: absolute;
	height: 100%;
	width: 100%;
	padding: 5px;
}

.infos_x, .extra_x, .credits_x, .glos_x, .bib_x, .ref_x, .compltOff, .tocTagsClose {
	display: block;
	width: 25px;
	height: 25px;
	background: url(img/closeSubWin.png) center center no-repeat;
	border:0px;
	cursor: hand;
	cursor: pointer;
	position: absolute;
	right: 0px;
	z-index: 2
}

.infos_x span, .extra_x span, .credits_x span, .glos_x span, .bib_x span, .ref_x span, .compltOff span, .tocTagsClose span{
	display: none;
}

/* Slideshow */


div.slide[data-state=done]  {
	-o-transition: all  0.5s ease-in-out 0s;
	-moz-transition: all  0.5s ease-in-out 0s;
	-ms-transition: all  0.5s ease-in-out 0s;
	-webkit-transition: all  0.5s ease-in-out 0s;
	transition: all  0.5s ease-in-out 0s;
	visibility:hidden;
	opacity: 0
}


div.slide[data-state=active]  {
	-o-transition: all  0.5s ease-in-out 0.3s;
	-moz-transition: all  0.5s ease-in-out 0.3s;
	-ms-transition: all  0.5s ease-in-out 0.3s;
	-webkit-transition: all  0.5s ease-in-out 0.3s;
	transition: all  0.5s ease-in-out 0.3s;
	opacity: 1;
	visibility:visible;
}

/* Plage d'illustration */

#slideshow div.illustration[data-state=done] {
	-webkit-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	-ms-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	-moz-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	-o-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
}

#slideshow > div[data-state=active] div.illustration[data-state=done] {
	-webkit-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	-ms-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	-moz-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	-o-transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
	transition: opacity 0.3s ease-out, height 0s ease-out 0.3s;
}

#slideshow div.illustration[data-state=active] {
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
	-webkit-transition: opacity 0.3s ease-out 0.3s, height 0s ease-out 0.3s;
	-ms-transition: opacity 0.3s ease-out 0.3s, height 0s ease-out 0.3s;
	-moz-transition: opacity 0.3s ease-out 0.3s, height 0s ease-out 0.3s;
	-o-transition: opacity 0.3s ease-out 0.3s, height 0s ease-out 0.3s;
	transition: opacity 0.3s ease-out 0.3s, height 0s ease-out 0.3s;
}

#slideshow div.illustration {
	height: 0px;
	overflow: hidden;
	filter:alpha(opacity=0);
	-moz-opacity:0;
	-khtml-opacity: 0;
	opacity: 0;
	padding: 0 10px;
}

span.separator{
	margin:0px 10px;
	font-weight: bold;
}

.segmentContent, .segmentContentAndNotes{
	left: 0;
	right: 0;
	position: absolute;
	top: 50px;
	bottom: 0;
}

.content .segmentContent.videoStream{
	left:0;
	right: 0;
}

.description, .illustrations{
	display: table-cell;	
	vertical-align: top;
	text-align: center;
}

.descriptionContent, #slideshow div.illustration[data-state=active]{
	height: 100%;
}

.descriptionContent{
	padding:0px 10px
}

#slideshow div.illustration p{
	text-align: left;
}

img.binImg{
	display: block; 
	height: auto;
	max-height: 360px; 
	max-width:760px;
	width: auto;
	margin:10px auto
}

#slideshow nav {
	position: absolute;
	right: 0px;
/*SKIN	filter:alpha(opacity=20);
	top: 45px;
	-moz-opacity:0.2;
	-khtml-opacity: 0.2;
	opacity: 0.2;*/

	top: 50%;
	margin-top: -180px;
	right: 50%;
	margin-right: -380px;
	-moz-transition: all 0.3s ease-out;
	-webkit-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	z-index: 2
}

#slideshow nav header{
	display: none;
}

#slideshow nav button {
   overflow: visible;
   border:0px;
   cursor: hand;
   cursor: pointer;
   text-align: right;
   background-color: transparent;
   padding: 0px;
   margin: 0px;
   display: block;
   width: 100%
}

#slideshow nav .compltBtn{
   display: inline-block;
/*SKIN   width: 40px;
   background: url(img/complt.png) center center no-repeat #A827C0;
   height: 45px;*/

   background: url(img/complt.png) center center no-repeat;
   width: 46px;
   height: 46px;
   vertical-align: middle;
}

.compltTitle {
	filter:alpha(opacity=0);
	-moz-opacity:0;
	-khtml-opacity: 0;
	opacity: 0;
	-moz-transition: max-width 0.3s ease-out 0.1s, left 0.3s ease-out 0.1s, opacity 0.3s ease-out;
	-webkit-transition: max-width 0.3s ease-out 0.1s, left 0.3s ease-out 0.1s, opacity 0.3s ease-out;
	-ms-transition: max-width 0.3s ease-out 0.1s, left 0.3s ease-out 0.1s, opacity 0.3s ease-out;
	-o-transition: max-width 0.3s ease-out 0.1s, left 0.3s ease-out 0.1s, opacity 0.3s ease-out;
	transition: max-width 0.3s ease-out 0.1s, left 0.3s ease-out 0.1s, opacity 0.3s ease-out;
	left: 0px;
	white-space: nowrap;
/*SKIN	background: #A827C0; 
	background: -moz-linear-gradient(top,  #732382 0%, #A827C0 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#732382), color-stop(45%,#A827C0)); 
	background: -webkit-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: -o-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: -ms-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: linear-gradient(top,  #732382 0%,#A827C0 45%); */

	background: #4993c3; 
	background: -moz-linear-gradient(top,  #4993c3 0%, #34759f 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4993c3), color-stop(45%,#34759f)); 
	background: -webkit-linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	background: -o-linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	background: -ms-linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	background: linear-gradient(top,  #4993c3 0%,#34759f 45%); 
	-moz-box-shadow:  0px 0px 5px #BBBBBB;
	-ms-box-shadow:  0px 0px 5px #BBBBBB;
	-o-box-shadow:  0px 0px 5px #BBBBBB;
	-webkit-box-shadow:  0px 0px 5px #BBBBBB;
	box-shadow:  0px 0px 5px #BBBBBB;
	display: inline-block;
	position: relative;
	max-width: 0px
}

/*#slideshow nav:hover .compltTitle {*/
#slideshow nav:hover .compltTitle {
	filter:alpha(opacity=100);
	-moz-opacity:1;
	-khtml-opacity: 1;
	opacity: 1;
	left: -18px;
	max-width: 700px;
	transition: max-width 0.3s ease-out, left 0.3s ease-out, opacity 0.3s ease-out 0.05s;
}

.compltTitle_ti {
	padding: 10px 10px;
	text-shadow: 1px 1px 0 black;
	background: url(img/flecheCompltTitle.png) right center no-repeat;
	margin-right: -14px;
	padding-right:21px;
	display: inline-block;
	color: white;
}

/* Sommaire */

#toc a {
	text-decoration: none;
}

/* Element "extra */
#toc .extra a:before, #toc .credits a:before {
	content:url(img/plus.png);
}

/* Media */

			/*div#media*/

						div#mediafull *, div#media *{
							position: absolute;
							width: 640px;
							height: 360px;
						}
						
						div#mediafull{
							position: absolute;
							top: 50%;
							margin-top: -180px;
							left: 50%;
							margin-left: -320px;
							visibility: hidden;
							opacity: 0;
							filter:alpha(opacity=0);
							transition: top 0.5s ease-in-out 0.5s, left 0.5s ease-in-out 0.5s, bottom 0.5s ease-in-out 0.5s, right 0.5s ease-in-out 0.5s, visibility 0.5s ease-in-out 0.5s, opacity 0.5s ease-in-out 0s;
							-webkit-transition: top 0.5s ease-in-out 0.5s, left 0.5s ease-in-out 0.5s, bottom 0.5s ease-in-out 0.5s, right 0.5s ease-in-out 0.5s, visibility 0.5s ease-in-out 0.5s, opacity 0.5s ease-in-out 0s;
						}

						div#mediafull, div#mediafull div#media{
							visibility: visible;
							opacity: 1;
							filter:alpha(opacity=100);
						}

						div#mediafull div#media{
							top: 0;
						}

						video, div#media[data-currentType=video]{
							visibility: visible;
							opacity:1;
							filter:alpha(opacity=100);
							transition: top 0.5s ease-in-out 0s, left 0.5s ease-in-out 0s, bottom 0.5s ease-in-out 0s, right 0.5s ease-in-out 0s, visibility 0.5s ease-in-out 0s, opacity 0.5s ease-in-out 0.5s;
							-webkit-transition: top 0.5s ease-in-out 0s, left 0.5s ease-in-out 0s, bottom 0.5s ease-in-out 0s, right 0.5s ease-in-out 0s, visibility 0.5s ease-in-out 0s, opacity 0.5s ease-in-out 0.5s;
						}

						audio, div#media[data-currentType=audio]{
							visibility: hidden;
							opacity:0;
							filter:alpha(opacity=0);
						}

						#content[data-hasIllustr] div#media[data-currentType=video],
						#content[data-hasIllustr] div#mediafull {
							top: 0;
							bottom: 67%;
							right: 80%;
							left: 0 !important;
						}						

						#content.contentWithToc[data-hasnotes] div#media[data-currentType=video],
						#content.contentWithToc[data-hasnotes] div#mediafull{
							left: 40%;
						}


/* Controlleur */

#controller > * {
}

#timelineToc, #timelineTags {
	color: white;
	height: 0px;
/*SKIN	bottom: 40px;*/

	bottom: 50px;
	width:80%;
	left: 10%;
	-webkit-transition: all 0.3s ease-out;
	-ms-transition: all 0.3s ease-out;
	-moz-transition: all 0.3s ease-out;
	-o-transition: all 0.3s ease-out;
	transition: all 0.3s ease-out;
	overflow: hidden;
/*	background: #A827C0; 
	background: -moz-linear-gradient(top,  #732382 0%, #A827C0 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#732382), color-stop(45%,#A827C0)); 
	background: -webkit-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: -o-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: -ms-linear-gradient(top,  #732382 0%,#A827C0 45%); 
	background: linear-gradient(top,  #732382 0%,#A827C0 45%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#732382', endColorstr='#A827C0',GradientType=0 ); */

	background: #B20066; 
	background: -moz-linear-gradient(top,  #92004F 0%, #B20066 45%); 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#92004F), color-stop(45%,#B20066)); 
	background: -webkit-linear-gradient(top,  #92004F 0%,#B20066 45%); 
	background: -o-linear-gradient(top,  #92004F 0%,#B20066 45%); 
	background: -ms-linear-gradient(top,  #92004F 0%,#B20066 45%); 
	background: linear-gradient(top,  #92004F 0%,#B20066 45%); 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#92004F', endColorstr='#B20066',GradientType=0 ); 
	border-width:0px;
	border-style: solid;
	border-color: transparent;
	z-index: 3;
	position: absolute;
}

#timelineToc.active, #timelineTags.active {
	height: 20em;
	overflow: auto;
	border-width:1px;
	border-color: White;
}

#toc ul{
	margin: 0px	
}

#toc a{
	text-decoration: none;
	color: white;
	display: block;
	padding: 2px 4px;
	-webkit-transition: background-color 0.2s linear;
	-ms-transition: background-color 0.2s linear;
	-moz-transition: background-color 0.2s linear;
	-o-transition: background-color 0.2s linear;
	transition: background-color 0.2s linear;
	background-color: transparent;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-ms-border-radius: 3px;
	border-radius: 3px;
}

#toc a:hover{
	background-color: rgba(255,255,255,0.15);
	-webkit-transition: background-color 0s linear;
	-ms-transition: background-color 0s linear;
	-moz-transition: background-color 0s linear;
	-o-transition: background-color 0s linear;
	transition: background-color 0s linear;
}

#controlBar {
	display: table;
	color: white;
/*SKIN	background-color: #A827C0;
   -webkit-box-shadow: inset 0px 0px 5px 5px #9916AE;
   -moz-box-shadow: inset 0px 0px 5px 5px #9916AE;
   -ms-box-shadow: inset 0px 0px 5px 5px #9916AE;
   box-shadow: inset 0px 0px 5px 5px #9916AE;*/
   
   -webkit-box-shadow: inset 0px 0px 5px 5px #75003F;
   -moz-box-shadow: inset 0px 0px 5px 5px #92004f;
   -ms-box-shadow: inset 0px 0px 5px 5px #92004f;
   box-shadow: inset 0px 0px 5px 5px #92004f;
	background-color: #92004f;
	user-select: none;
	-o-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-webkit-user-select: none;
/*SKIN	height: 40px;*/

	height: 50px;
}

#controlBar > div {
	overflow: hidden
}

#controlBar a, #controlBar button {
	color: white;
}

#playerBtns, #timelineBox, #playerTools {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

#playerTools > *{
	vertical-align: middle;
}

#currentTimeLabel {
	border-bottom: 1px solid white;
	display: inline-block;
	padding-bottom: 3px;
}

#totalTimeLabel {
	padding-top: 3px;
	display: block;
}

#timeLabels{
	font-size: 11px;
	white-space: normal;
	display: inline-block;
  text-shadow         : 1px 1px 0 #7A158B;
  -o-text-shadow      : 1px 1px 0 #7A158B;
  -moz-text-shadow    : 1px 1px 0 #7A158B;
  -ms-text-shadow    : 1px 1px 0 #7A158B;
  -webkit-text-shadow : 1px 1px 0 #7A158B;
  margin: 0px 10px 0px 10px
}

/* Ligne de temps */
#timeline {
	position: relative;
}

#controlBar > #timelineBox {
	width: 100%;
	overflow: visible
}

#timeCursor {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	width: 30px;
	margin-left: -15px;
	z-index: 10;
	cursor: col-resize;
	background-image: url(img/cursor-white.png);
	background-position: center;
	background-repeat: no-repeat;
}

.timeSegments > *, .timePartCo > * {
	display: table-cell;
}

.timePart > a:first-child {
	display: inline-block;
	width: 100%;
	border-bottom:1px solid #D193DD;
}

.timePart > div.timePartCo {
	display: inline-table;
	width: 100%;
	max-height: 12px;
}

.timeSegments{
	display: table;
	width: 100%;
/*SKIN	background-color: #B640CB;
	height: 40px;
	border-left:1px solid #D193DD;
	border-right:1px solid #D193DD;*/

	background-color: #b20066;
	height: 50px;
	border-left:1px solid #FFA3D8;
	border-right:1px solid #FFA3D8;
}

.timeSegments a {
/*	-moz-box-shadow: inset 0px 0px 1px white;
	-ms-box-shadow: inset 0px 0px 1px white;
	-webkit-box-shadow: inset 0px 0px 1px white;
	box-shadow: inset 0px 0px 1px white;*/
}

.timeSegments  a {
	display: table-cell;
	text-decoration: none;
/*SKIN	border-left:1px solid #D193DD;*/

	border-left:1px solid #FFA3D8;
	background-color: transparent;
	overflow: hidden;
	-webkit-transition: background-color 0.5s linear;
	-ms-transition: background-color 0.5s linear;
	-moz-transition: background-color 0.5s linear;
	-o-transition: background-color 0.5s linear;
	transition: background-color 0.5s linear;
}

.timeSegments .timePart a {
	height: 25px;
}

.timeSegments a:hover,
.timeSegments a.current {
/*SKIN	background-color: #C26FD2;*/
	background-color: #D5509C;
	-webkit-transition: background-color 0s linear;
	-ms-transition: background-color 0s linear;
	-moz-transition: background-color 0s linear;
	-o-transition: background-color 0s linear;
	transition: background-color 0s linear;
}

.timeSegments *[data-highlighted] {
    background-color: rgba(255,255,255,0.7);
    border:white;
	-moz-box-shadow: inset 0px 0px 1px #B640CB;
	-ms-box-shadow: inset 0px 0px 1px #B640CB;
	-webkit-box-shadow: inset 0px 0px 1px #B640CB;
	box-shadow: inset 0px 0px 1px #B640CB;
}

.timeSegments *[data-highlighted]:hover {
    background-color: white;
}

.timeSegments a span {
	position: absolute;
	top: -18px;
	visibility: hidden;
	right: 0px;
	margin-top: 0px;
	text-align: right;	
  font-size: 13px;
  padding: 0 5px;
	-moz-border-radius: 4px 4px 0px 0px;
	-ms-border-radius: 4px 4px 0px 0px;
	-o-border-radius: 4px 4px 0px 0px;
	-webkit-border-top-left-radius: 4px;
	-webkit-border-top-right-radius: 4px;
	border-radius: 4px 4px 0px 0px;
/*SKIN  background-color: #B640CB;*/

	background-color: #B20066;
  color: white;
}

.timeSegments a:hover span {
	visibility: visible;
}

/* Boutons */

#playerBtns, #playerTools{
	white-space: nowrap;
}

#nonContinuousPlayBtn, #stopAtSegmentEndBtn, #previousBtn, #nextBtn, button#playPauseBtn, button#tocDisplay, button#tagsDisplay{
	display: inline-block;
/*SKIN	width: 30px;
	height: 30px;*/

	width: 39px;
	height: 39px;
	border:0px;
	cursor: pointer;
	cursor: hand;
	margin: 0px 6px 0px 0px;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	-ms-border-radius: 20px;
	border-radius: 20px;
/*SKIN   -webkit-box-shadow: 0px 0px 3px 5px rgba(185,74,206,0);
   -moz-box-shadow: 0px 0px 3px 5px rgba(185,74,206,0);
   -ms-box-shadow: 0px 0px 3px 5px rgba(185,74,206,0);
   box-shadow: 0px 0px 3px 5px rgba(185,74,206,0);   
   /* Bug sous Safari : si une durée est spécifiée, la transition ne se fait pas */
	-webkit-transition: -webkit-box-shadow 0 linear;
	-moz-transition: -moz-box-shadow 0.5s linear;
	-ms-transition: -ms-box-shadow 0.5s linear;
	-o-transition: -o-box-shadow 0.5s linear;
	transition: box-shadow 0.5s linear;*/

	-webkit-transition: all 0.2s linear;
	-moz-transition: all 0.2s linear;
	-ms-transition: all 0.2s linear;
	-o-transition: all 0.2s linear;
	transition: all 0.2s linear;
	background-color: transparent;
}

#previousBtn{
	margin-left: 6px	
}

#nonContinuousPlayBtn:hover, #stopAtSegmentEndBtn:hover, #previousBtn:hover, #nextBtn:hover, #controller[data-state=paused] button#playPauseBtn:hover, #controller[data-state=playing] button#playPauseBtn:hover, button#tocDisplay:hover, button#tagsDisplay:hover{
/*SKIN   -webkit-box-shadow: 0px 0px 3px 5px rgba(185,74,206,1);
   -moz-box-shadow: 0px 0px 3px 5px rgba(185,74,206,1);
   -ms-box-shadow: 0px 0px 3px 5px rgba(185,74,206,1);
   box-shadow: 0px 0px 3px 5px rgba(185,74,206,1);   
	-webkit-transition: -webkit-box-shadow 0s linear;
	-moz-transition: -moz-box-shadow 0s linear;
	-ms-transition: -ms-box-shadow 0s linear;
	transition: box-shadow 0s linear;*/
	filter:alpha(opacity=80);
	-moz-opacity:0.8;
	-khtml-opacity: 0.8;
	opacity: 0.8;
}

#nonContinuousPlayBtn span, #stopAtSegmentEndBtn span, #previousBtn span, #nextBtn span, #playPauseBtn span{
	display: none;
}

#previousBtn{
	background: url(img/previous.png) center center no-repeat;
}

#nextBtn{
	background: url(img/next.png) center center no-repeat;
}

#controller[data-state=paused] button#playPauseBtn {
	background: url(img/play.png) center center no-repeat;
}

#controller[data-state=playing] button#playPauseBtn {
	background: url(img/pause.png) center center no-repeat;
}

#previousBtn[disabled], #nextBtn[disabled] {
	filter:alpha(opacity=50);
	-moz-opacity:0.5;
	-khtml-opacity: 0.5;
	opacity: 0.5;
}
/* play/pause button */

button#playPauseBtn {	
/*SKIN	height: 32px;
	width: 30px;*/
	
	height: 39px;
	width: 39px;
	background-image: url(img/progress.gif);
	background-position: center center;
	background-repeat: no-repeat;
}

/* ToC button */

button#tocDisplay {
    background: url(img/media-toc.png) center center no-repeat;
}

button#tagsDisplay {
    background: url(img/media-tags.png) center center no-repeat;
}

/* active item in the table of contents */
#toc li.current > a {
	font-weight: bold;
	color: orange !important;
}

.bkBase_ti, .mainContent_ti{
  text-shadow         : 1px 1px 0 black;
  -o-text-shadow      : 1px 1px 0 black;
  -moz-text-shadow    : 1px 1px 0 black;
  -ms-text-shadow    : 1px 1px 0 black;
  -webkit-text-shadow : 1px 1px 0 black;
}

.bkBase_co .bkBase_co{
	padding-left: 20px
}

h1.bkBase_ti, h1.mainContent_ti{
	font-size: 1.3em;
	font-weight: bold;
	text-align: center;
	display: block;
	border-bottom: 3px dotted white;
	margin-top: 0px;
	padding-bottom: 10px
}

h2.bkBase_ti{
	font-size: 1.2em;
}

h3.bkBase_ti{
	font-size: 1.1em;
}

.extra *, .credits *{
	color: white;	
}

.idxEntryTi{
	font-weight: bold;
  text-shadow         : 1px 1px 0 gray;
  -o-text-shadow      : 1px 1px 0 gray;
  -moz-text-shadow    : 1px 1px 0 gray;
  -ms-text-shadow    : 1px 1px 0 gray;
  -webkit-text-shadow : 1px 1px 0 gray;
}

dl{
	margin: 0px;
	padding: 0px
}

.tag{
	background: url(img/tag.png) left center no-repeat;
	padding-left: 23px;
	font-size: 1.2em;
  text-shadow         : 1px 1px 0 #60166E;
  -o-text-shadow      : 1px 1px 0 #60166E;
  -moz-text-shadow    : 1px 1px 0 #60166E;
  -ms-text-shadow    : 1px 1px 0 #60166E;
  -webkit-text-shadow : 1px 1px 0 #60166E;
  margin-bottom: 10px;
  cursor: hand;
  cursor: pointer;
  color: white;
}

#marginTags .tag{
	font-size: 0.8em;
}

#tags *[data-highlighted] {
	background: url(img/tagChecked.png) left center no-repeat;
	font-weight: bold;
}

#timelineTags.active{
	overflow: hidden;
}

#tagsContent{
	overflow: auto;
	bottom: 43px;
	position: absolute;
	top: 0px;
	left: 0;
	padding: 10px;
	right: 0;
}

#tagsPlayerButtons{
	text-align: center;
/*SKIN	height: : 40px;*/

	height: : 50px;
	position: absolute;
	bottom: 0;
	right: 0;
	left: 0;
	background-color: rgba(255,255,255,0.1);
}

#nonContinuousPlayBtn, #stopAtSegmentEndBtn{
	margin:5px;
	border: 1px solid transparent;
}

#nonContinuousPlayBtn[data-checked], #stopAtSegmentEndBtn[data-checked]{
	border-color: white;
	-webkit-transition: border-color 0.2s linear;
	-moz-transition: border-color 0.2s linear;
	-ms-transition: border-color 0.2s linear;
	-o-transition: border-color 0.2s linear;
	transition: border-color 0.2s linear;
}

#stopAtSegmentEndBtn{
	background: url(img/stopAtSegmentEndBtn.png) center center no-repeat transparent;
}

#nonContinuousPlayBtn{
	background: url(img/nonContinuousPlayBtn.png) center center no-repeat transparent;
}

.tooltip_fra{
/*SKIN	background: #FFC000; 
	background: -moz-linear-gradient(top,  #F8AA00 0%, #FFC000 33%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#F8AA00), color-stop(33%,#FFC000)); 
	background: -webkit-linear-gradient(top,  #F8AA00 0%,#FFC000 33%); 
	background: -o-linear-gradient(top,  #F8AA00 0%,#FFC000 33%); 
	background: -ms-linear-gradient(top,  #F8AA00 0%,#FFC000 33%);
	background: linear-gradient(top,  #F8AA00 0%,#FFC000 33%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#F8AA00', endColorstr='#FFC000',GradientType=0 ); */

	background: #96BA33; 

	-moz-box-shadow:  0px 0px 5px #BBBBBB;
	-webkit-box-shadow:  0px 0px 5px #9a9a9a;
	box-shadow:  0px 0px 5px #BBBBBB;
	margin-top: 10px
}

.tooltip{
	background: url(img/flecheTT.png) 7px top no-repeat;
	margin-top: -12px;
	padding-top:19px;
/*SKIN	color: #545454;*/

	color: black;
}

.tooltip_x {
	position: absolute;
	top: 15px;
	right: 3px;
	display: block;
	width: 14px;
	height: 14px;
	background: url(img/closeTT.png) center center no-repeat;
}

.tooltip_x span{
	display: none;
}

.tooltip_ti{
	color: black;	
  margin-bottom: 10px;
  /*SKIN*/
  font-weight: bold;
  padding:5px
}

.tooltip_co{
/*SKIN	font-size: 0.8em*/
  padding:5px
}

.binCap_ti{
	font-size: 12px;
	color: gray;
	text-align: center;
}

.refOutlineEntry{
	font-size: 20px;
  text-shadow         : 1px 1px 0 gray;
  -o-text-shadow      : 1px 1px 0 gray;
  -moz-text-shadow    : 1px 1px 0 gray;
  -webkit-text-shadow : 1px 1px 0 gray;
  font-weight: bold;
  margin: 0 10px
}

.refCateg {
	font-size: 22px;
  text-shadow         : 1px 1px 0 gray;
  -o-text-shadow      : 1px 1px 0 gray;
  -moz-text-shadow    : 1px 1px 0 gray;
  -webkit-text-shadow : 1px 1px 0 gray;
  font-weight: bold;
  margin: 30px 10px 10px 10px;
  text-align: center;	
  border-top: 1px solid white;
  padding-top: 5px
}

/*SKIN*/
.bkBase_open{
	color: white;
}