#content-wrapper {
		position: relative;
		width: 100%;
		height: auto;
		margin: 0;
		
		float: left;
	}
	#content {
		position: relative;
		margin: 0 auto;
	}
	
	#timeline {
		position: relative;
		height: auto;
		margin-bottom: 40px;
		padding-bottom: 80px;
		float: left;
	}
	#time-line {
		position: absolute;
		top: 0;
		width: 3px;
		height: 100%;
		background: #c8cbd6;
		float: left;
		z-index: 0;
	} 
	.timeline-icon, .timeline-icon-pp {
		position: relative;
		width: 24px;
		height: 24px;
		float: left;
		z-index: 10;
	}
	.timeline-icon-bottom {
		position: absolute;
		bottom: 0px;
		left: -13px;
		width: 30px;
		height: 30px;
		float: left;
		z-index: 1;
	}
	.timeline-icon-bottom a.icon-totop {
	    position: absolute;
	    bottom: 0px;
		left: 0px;
		width: 30px;
		height: 30px;
		margin: 0;
	    background: #c8cbd6;
		background-image: url('http://static.tumblr.com/bygdzhm/lHylylgnf/icon-totop.png');
	    background-repeat: no-repeat;
	    background-position: center center; 
	    -webkit-border-radius: 50%;
	    -khtml-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
		border-radius: 15px;
		float: left;
	    z-index: 100;
	}
	.timeline-icon-bottom span.tophov {
			display: none;
			position: absolute;
			top: 4px;
			left: 35px;
			width: 78px;
			height: 22px;
			padding-left: 10px;
			font-family: 'Armata', sans-serif;
			font-size: 10px;
			line-height: 22px;
			color: #fff;
			background: url('http://static.tumblr.com/bygdzhm/tsalz25w7/tophov-bg.png') no-repeat left top;
			float: left;
		}
	

	.timeline-icon a.icon-quote {
		width: 24px;
		height: 24px;
		margin: 0;
		background:url(../img/puce_historique.png) no-repeat center center;
		float: left;
	}

	
	.timeline-preview {
		position: relative;
		float: left;
		margin-left: 80px;
	}
	.timeline-content {
		position: relative;
		overflow: hidden;
		float: left;
		min-height: 60px;
		margin-left: 0px;
		padding: 0px;
		background: #fff;
		border: 1px solid #e3e3e3;
	}

	
	/*========== POSTBAR ==========*/
	.timeline-bar {
		position: relative;
		overflow: hidden;
		height: auto;
		margin-top: -2px;
		padding: 10px;
		background: #dee2e9;
		float: left;
		border: 1px solid #c8cbd6;
		-webkit-border-radius: 0 0 5px 5px;
		-khtml-border-radius: 0 0 5px 5px;
		-moz-border-radius: 0 0 5px 5px;
		border-radius: 0 0 5px 5px;
		-webkit-box-shadow: inset 0px 0px 0px 1px #f5f6f7;
		-moz-box-shadow: inset 0px 0px 0px 1px #f5f6f7;
		box-shadow: inset 0px 0px 0px 1px #f5f6f7;
	}

	/*========== POST ==========*/
	.post {
		position: relative;
		margin-top: 45px;
		margin-left: 0px;
		float: left;
	}


	/*========== POST QUOTE ==========*/
	.quoteline {
	    width: 100%;
		font-size: 20px;
		font-weight: normal;
		line-height: 26px;
		color: #777b89;
		text-align: center;
		text-shadow: 0px 1px 0px #ffffff;
		margin-top: 10px;
		margin-bottom: 10px;
		padding-bottom: 10px;
	}
	p.quotesource {
		font-size: 12px;
		line-height: 20px;
		font-weight: normal;
		text-align: left;
	}
	/* =============================================== 
	Media Queries
	================================================== */
		
		@media only screen and (min-width: 768px) {
		
		
		#content {width: 620px;}
		#timeline {width: 600px;}
		#time-line {left: 32px;}
		.timeline-icon, .timeline-icon-pp {margin-top: 20px; margin-left: -59px;}
		.timeline-preview {width: 600px; margin-left: 80px;}
		.timeline-content {width: 600px; margin-top: 0px;}
		.timeline-content-page {width: 520px;min-height: 50px;margin-top: 5px;}
		.timeline-pointer,
		.timeline-pointer-pp {
			position: absolute;
			top: 20px;
			left: -13px;
			width: 17px;
			height: 26px;
			background: url('pointer.png') no-repeat left top;
			float: left;
			z-index: 100;
		}
		.timeline-pointer span.tl-pointer,
		.timeline-pointer-pp span.tl-pointer {
			width: 0;
			height: 0;
			margin-top: 1px;
			margin-left: 3px;
			border-top: 12px solid transparent;
			border-bottom: 12px solid transparent;
			border-right: 12px solid #fff; 
			overflow: hidden; 
			float: left;
		}
		.timeline-bar {width: 500px;}
		#picture-profile {
			position: absolute;
			top: -125px;
			left: -40px;
			width: 147px;
			height: 149px;
			float: left;
			z-index: 10;
		}
		#picture-profile a,
		#picture-profile a img {
			position: relative;
			overflow: hidden;
			width: 147px;
			height: 149px;
			float: left;
			border: none;
		}
		#profile-description {margin-top: 25px;}
		
		}
		
		
		/* ========================================= */
		@media only screen and (min-width: 480px) and (max-width: 768px) {
		
		#content {width: 400px;}
		#timeline {width: 300px;}
		#time-line {left: 32px;}
		.postdetail{display: block;}
		.timeline-icon, .timeline-icon-pp {margin-top: 10px; margin-left: -70px;}
		.timeline-preview {width: 270px; margin-left: 80px;}
		.timeline-content {width: 270px; margin-top: 0px;}
		.timeline-content-page {width: 270px;min-height: 45px;margin-top: 5px;}
		.timeline-pointer,
		.timeline-pointer-pp {
			position: absolute;
			top: 20px;
			left: -13px;
			width: 17px;
			height: 26px;
			background: url('http://static.tumblr.com/bygdzhm/v4vlylgwv/tl-pointer.png') no-repeat left top;
			float: left;
			z-index: 100;
		}
		.timeline-pointer span.tl-pointer,
		.timeline-pointer-pp span.tl-pointer {
			width: 0;
			height: 0;
			margin-top: 1px;
			margin-left: 3px;
			border-top: 12px solid transparent;
			border-bottom: 12px solid transparent;
			border-right: 12px solid #ebedf0; 
			overflow: hidden; 
			float: left;
		}
		
		#picture-profile {
			position: absolute;
			top: -54px;
			left: -20px;
			width: 96px;
			height: 96px;
			background: #c8cbd6;
			border: 6px solid #c8cbd6;
			-webkit-border-radius: 50%;
			-khtml-border-radius: 50%;
			-moz-border-radius: 50%;
			border-radius: 50%;
			border-radius: 54px;
			float: left;
			z-index: 10;
		}
		#picture-profile a,
		#picture-profile a img {
			position: relative;
			overflow: hidden;
			width: 96px;
			height: 96px;
			-webkit-border-radius: 50%;
			-khtml-border-radius: 50%;
			-moz-border-radius: 50%;
			border-radius: 50%;
			border-radius: 54px;
			float: left;
			border: none;
		}
		#profile-description {margin-top: 65px;}
		
		}
	
		/* ========================================= */
		@media only screen and (max-width: 480px) {
		#slider-buttons {display: none;}
		#content {width: 320px;}
		#timeline {width: 300px;}
		#time-line {left: 55px;}
		
		.timeline-icon-pp {display: none;}
		.timeline-preview {width: 270px; margin-left: 20px;}
		.timeline-content {width: 270px; margin-top: 15px;}
		.timeline-content-page {width: 270px;min-height: 45px;margin-top: 15px;}
		.timeline-pointer {
			position: absolute;
			top: 55px;
			left: 30px;
			width: 14px;
			height: 8px;
			background: url('http://static.tumblr.com/bygdzhm/tAnlz11ei/tl-pointer-small.png') no-repeat left top;
			float: left;
			z-index: 100;
		}
		.timeline-pointer span.tl-pointer,
		.timeline-pointer-pp span.tl-pointer {
			width: 0;
			height: 0;
			margin-top: 2px;
			margin-left: 1px;
			border-left: 6px solid transparent;
			border-right: 6px solid transparent;
			border-bottom: 6px solid #ebedf0; 
			overflow: hidden; /* IE fix */
			float: left;
		}
		.timeline-pointer-pp {
			position: absolute;
			top: 9px;
			left: 30px;
			width: 14px;
			height: 8px;
			background: url('http://static.tumblr.com/bygdzhm/tAnlz11ei/tl-pointer-small.png') no-repeat left top;
			float: left;
			z-index: 100;
		}
		#picture-profile {
			position: absolute;
			top: -37px;		
			left: 20px;
			width: 64px;
			height: 64px;
			background: #c8cbd6;
			border: 6px solid #c8cbd6;
			-webkit-border-radius: 50%;
			-khtml-border-radius: 50%;
			-moz-border-radius: 50%;
			border-radius: 50%;
			border-radius: 38px;
			float: left;
			z-index: 50;
		}
		#picture-profile a,
		#picture-profile a img {
			position: relative;
			overflow: hidden;
			width: 64px;
			height: 64px;
			-webkit-border-radius: 50%;
			-khtml-border-radius: 50%;
			-moz-border-radius: 50%;
			border-radius: 50%;
			border-radius: 32px;
			float: left;
			border: none;
		}
		#profile-description {margin-top: 35px;}