/**
 *  @title  Histoire
*/

.anchor{ /* Debug Fixed head */
	position:relative; top:-175px;
	display:block;
}

/* #timeline */
#timeline{
	position:relative;
	margin:30px 0;
}

.timeline-part{ 
	position:relative;
	background:#F4F4F4; 
}
.timeline-part.odd{ background:#FFF; }

.timeline-part .main-inner{
	position:relative;
	padding-bottom:30px;
}
.timeline-part .main-inner:before{
	position:absolute; top:0; right:50%;
	margin-right:-5px;
	border-right:9px solid #DDD;
	width:0; height:100%;
	content:'';
}

.timeline-title {
	display:table;
	font:normal 1.5em/1 'Source sans Pro', Arial, sans-serif;
	color:#333;
	outline:0;
	width:470px;
}
.timeline-title strong {
	display:table-cell;
	margin:0 .5em 0 0;
	padding:5px 22px 4px;
	width:1%;
	color:#FFF;
	background:#e9041e;
	font-weight:normal;
	line-height:1.7;
	vertical-align:middle;
	white-space:nowrap;
}
.timeline-title span {
	display:table-cell;
	padding-left:15px;
	vertical-align:middle;
}

/* .timeline-nav */
.timeline-nav ul,
.timeline-nav li{
	margin:0; padding:0;
	list-style:none;
	border-top:1px solid #4e4d4e;
}
.timeline-nav a{
	display:block;
	padding:15px;
	width:207px; min-height:45px;
	font:normal .8em/1.5 'Source sans Pro', Arial, sans-serif;
}
.timeline-nav a strong{
	display:block;
	font:normal 1.3em/1 'Source sans Pro', Arial, sans-serif;
}
.timeline-nav button{
	position:relative;
	margin:0; padding:0 7px 0; border:none;
	width:82px; height:77px;
	font:normal .9em/1.2 'Source sans Pro', Arial, sans-serif;
	color:#FFF;
	text-transform:uppercase;
	cursor:pointer;
	background:#fe3f56; /* Old browsers */
	background:-moz-linear-gradient(top, #fe3f56 0%, #e20102 100%); /* FF3.6+ */
	background:-webkit-gradient(linear, left top, left bottom, color-stop(0%,#fe3f56), color-stop(100%,#e20102)); /* Chrome,Safari4+ */
	background:-webkit-linear-gradient(top, #fe3f56 0%,#e20102 100%); /* Chrome10+,Safari5.1+ */
	background:-o-linear-gradient(top, #fe3f56 0%,#e20102 100%); /* Opera 11.10+ */
	background:-ms-linear-gradient(top, #fe3f56 0%,#e20102 100%); /* IE10+ */
	background:linear-gradient(to bottom, #fe3f56 0%,#e20102 100%); /* W3C */
	filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#fe3f56', endColorstr='#e20102',GradientType=0 ); /* IE6-9 */
	
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
.timeline-nav.active button:before{
	position:absolute; top:50%; left:-9px;
	z-index:20;
	display:block;
	margin-top:-7px;
	width:0; height:0; 
	border-top:9px solid transparent;
	border-bottom:9px solid transparent;
	border-right:9px solid #ef1e2a;
	content:'';
}
.timeline-nav button .i{
	display:block;
	margin:7px auto 0; padding-top:18px;
	height:0; width:18px;
	background:url(../images/picto/small-pictos-sprite.png) no-repeat 0 -50px;
	overflow:hidden;
	/*font:normal 2.4em/.6 'HelveticaNeueW02-45Ligh', Helvetica, sans-serif;*/
}
.timeline-nav.active button .i{
	background-position:-50px -50px;
}

.js .timeline-nav{
	position:fixed; right:50%;
	margin-right:-475px;
	z-index:10;
}
.js .timeline-nav.defix{
	position:absolute; top:0;
	/*height:82px;*/
}
.js .timeline-nav.defix-bottom{
	position:absolute; bottom:0;
	height:82px;
}
.js .timeline-nav button,
.js .timeline-nav ul{
	float:right;
}
.js .timeline-nav ul{
	display:none;
}
.js .timeline-nav.active ul{
	display:block;
}

/* .tl-item */
.tl-item{
	position:relative;
	margin:30px auto; padding:38px;
	border:1px solid #e5e5e5;
	background:#FFF;

	box-shadow:2px 2px 3px 1px rgba(229,229,229,0.8);
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	box-sizing:border-box;
}
.tl-item-text{
	padding:25px;
	width:555px;
}
.tl-item-image{
	width:860px;
	overflow:hidden;
}
.tl-item-image .visual,
.tl-item-image .legend{
	float:left;
	clear:left;
}
.tl-item-image .legend {
	width:360px;
}
.tl-item-image .tl-item-title,
.tl-item-image .tl-item-content{
	margin-left:380px;
}

.tl-item-title{
	margin-bottom:18px;
	font:normal 1.5em/1 'Source sans Pro', Arial, sans-serif;
	color:#333;
}
.tl-item-text .tl-item-title{ margin-bottom:22px; }
.tl-item-title strong{
	display:block;
	color:#e9041e;
	font-weight:normal;
	font-size:1.4em;
}
.tl-item .visual{
	margin-bottom:10px;
}
.tl-item .legend{
	margin:0 0 30px;
	color:#666;
	font-size:.7em;
	font-weight:bold;
}
.tl-item-content{
	font-size:.8em;
	line-height:1.4;
}

/* .tl-item-rebounds */
.tl-item-rebounds,
.tl-item-rebounds li{
	margin:0; padding:0;
	list-style:none;
}
.tl-item-rebounds{
	clear:both;
	display:table;
	margin-top:30px; padding-top:28px;
	border-top:1px solid #CCC;
	width:100%;
	font-size:.8em;
}
.tl-item-rebounds li{
	display:table-cell;
	width:50%;
}
.tl-item-rebounds li:first-child{
	padding-right:20px;
	border-right:1px solid #CCC;
}
.tl-item-rebounds li + li{
	padding-left:20px;
}
.tl-item-rebounds strong{
	display:block;
	margin-bottom:3px;
	font-weight:bold;
}

/* .tl-item-toogle */
.tl-item-toogle{
	position:absolute; right:0px; top:0px; 
	margin:0; padding:21px 0 0; border:none;
	width:21px; height:0;
	background:#e9041e; color:#FFF;
	font-size:1.1em; line-height:1;
	font-family: 'Source sans Pro', Arial, sans-serif;
	overflow:hidden;
	cursor:pointer;

}
.tl-item-toogle:focus{
	outline:1px dotted #000;
}
.tl-item-closed .tl-item-toogle{
	top:auto; right:1px; bottom:1px; 
	background:#e5e5e5; 
	color:#555;
}
.tl-item-toogle:before{
	content:'';
	position:absolute; top:6px; right:6px;
	display:block;
	margin-bottom:20px;
	width:9px; height:9px;
	background:url(../images/picto/small-pictos-sprite.png) no-repeat 0 0;
}
.tl-item-closed .tl-item-toogle:before{ 
	content:' '; 
	top:7px;
	background-position:-100px 0;
}

/* .tl-item-closed */
.tl-item-closed {
	margin:10px 0 0;
	padding:10px;
}
.tl-item-closed.tl-item-more { cursor:pointer; }
.tl-item-closed.tl-item-text,
.tl-item-closed.tl-item-image { 
	margin-left:161px;
	width:300px; 
}
.tl-item-closed.tl-item-image .tl-item-title:after { 
	display:block;
	clear:both;
	content:'';
}
.tl-item-closed.tl-item-large-image {
	width:460px; 
}
.tl-item-closed.tl-item-right{
	margin-left:490px;
}
.tl-item-closed.tl-item-left + .tl-item-closed.tl-item-right,
.tl-item-closed.tl-item-right + .tl-item-closed.tl-item-left {
	margin-top:-15px;
}

.tl-item-closed .visual { margin:-10px; }
.tl-item-closed.tl-item-image .visual{ 
	margin-right:10px;
	width:138px; 
}
.tl-item-closed.tl-item-large-image .visual{ 
	margin-bottom:5px;
	width:458px; 
}

.tl-item-closed .tl-item-title{
	margin:0;
	font-size:.95em;
	line-height:1.35em;
	padding-right:15px;
}
.tl-item-closed .legend,
.tl-item-closed .tl-item-content,
.tl-item-closed .tl-item-rebounds{
	display:none;
}

/* Tooltip arrow */
.tl-item-closed:before,
.tl-item-closed:after{
	position:absolute; right:-10px; top:50%;
	margin-top: -9px; margin-left:-10px;
	border-top:10px solid transparent;
	border-top:10px solid rgba(255,255,255,0); /* debug FF */
	border-bottom:10px solid transparent;
	border-bottom:10px solid rgba(255,255,255,0); /* debug FF */
	content:"";
}
.tl-item-closed:before{
	margin-right:-2px;
	border-left:10px solid #e5e5e5;
}
.tl-item-closed:after{
	margin-right:0px;
	border-left:10px solid #FFF;
}
.tl-item-closed.tl-item-right:before,
.tl-item-closed.tl-item-right:after{
	left:-10px; right:auto;
	border-left:none;
}
.tl-item-closed.tl-item-right:before{
	margin-left:-2px;
	border-right:10px solid #e5e5e5;
}
.tl-item-closed.tl-item-right:after{
	margin-left:0px;
	border-right:10px solid #FFF;
}