
		
		.timeline-wrapper{
			width: 100%;
			height: 100%;
		}
		.timeline-wrapper .slides-wrapper {
			overflow: hidden;
			height: 100%;
			width: 100%;
			position: relative;
		}
		.timeline-pager {
			position: absolute;
			top: 10%;
			overflow: hidden;
			padding: 0px 15px;
			transition: all 0.3s ease-in-out;
		}
		.timeline-pager ul {
			position: relative;
			padding:0;
			bottom:0;
		}
		.timeline-pager ul li{
			width: 100%;
			text-align: center;
		}
		.timeline-pager ul li.child{
			display: none;
		}
		.timeline-pager a {
			padding: 10px 0;
			display: block;
		}
		.timeline-pager a span{
			height: 2px;
			width: 10px;
			background-color: #ffffff;;
			display: block;
		}
		.timeline-pager .child a span{
			width: 60%;
			margin: 0 20%;
		}
		.timeline-year {
			position: absolute;
			height: 100%;
			width: 50px;
			left: 50px;
			top: 0;
			text-align: center;
			background-color: #ffffff;
			width:0;
			overflow: hidden;
			transition: all 0.3s ease-in-out;
		}
		.shift .timeline-year{
			width: 50px;
		}
		.timeline-year ul {	
			transition: all 0.3s ease-in-out;
		}
		.timeline-year li {
			font-size: 16px;
			margin: 0 0 6px 0;			
			transition: all 0.3s ease-in-out;
		}
		.timeline-year li.child{
			display: none;
			height: 16px;
			width: 100%;
			font-family: 'Oswald', sans-serif;
		}
		.timeline-year li span{	
			transition: all 0.3s ease-in-out;
		}
		
		.timeline-year li span.active, .timeline-year li span:hover{
			background-color: #666666;
			color: #fff;
			padding: 3px 5px;
			cursor:pointer;
		}		
		  
		.timeline-item {
			height: 100%;
			box-sizing: border-box;
			width: 100%;
			padding: 2.5% 10% 7.5% 10%;
			background-color: #280091;
			color: #cccccc;
			position: absolute;
			transition: all 1s ease-in-out;
			top: 100%;
			overflow:hidden;			
			background-position: center center;
			background-size: 100% auto;
		}
		.timeline-item.active {
			top:0;
		}
		.shift .timeline-item{
			padding: 2.5% 10% 7.5% 15%;
		}
		.timeline-item.up {
			top:-100%;
		}
		.timeline-item.up.active {
			top:0%;
		}		
		.timeline-item.hard{
			transition: all 0s !important;
		}
		.timeline-content {
			height: 100%;
			width: 50%;
			border: none;
			border-radius: 50%;
			float: left;
			display: inline-block;
		}
		.timeline-content.golden
		{
			background-color: rgba(168, 146, 60, 0.85);
		}
		.timeline-content.red
		{
			border: none !important;
			background-color: rgba(224, 72, 75, 0.75);
		}
		.timeline-line{
			border-top: 1px solid #ccc;
			width: 18%;
			position: absolute;
			top: 330px;
			left: 5%;
		}
		/*.blue .timeline-line{		
			border-top: 1px solid #00a385;
		}*/
		
		.timeline-line span {
			text-align: right;
			float: right;
			padding: 5px 15px;
			font-size: 16px;
			position: relative;
			top: -30px;
			display: none;
		}
		.timeline-text {
			padding: 25% 15% 0 30%;    
			position: relative;
			top: 300px;
			opacity: 0.5;
			transition: all 500ms ease-in-out 0s;
		}
		.timeline-item.active .timeline-text {
			color: #fff;
			top: 0px;
			opacity: 1;
			transition: all 500ms ease-in-out 0.5s;
		}
		.timeline-item.up .timeline-text {
			top: -300px;
			transition: all 500ms ease-in-out 0s;
		}
		.timeline-item.active.up .timeline-text {
			top: -0px;
			transition: all 500ms ease-in-out 0.5s;
		}
		.timeline-day {
			font-family: 'HelveticaUltraLight';
			line-height: 0.9em;
			font-size: 6em;
			width: auto;
			border-bottom: 5px solid #fff;
			display: inline-block;
			margin-bottom: 10px;
			color: #fff;
		}
/*		.blue .timeline-day {
			border-bottom: 5px solid #00a385;	
			color: #fff;
		}*/
		.timeline-text h2 {
			font-size: 2em;
			font-weight: normal;
			text-transform: uppercase;
		}
		.timeline-image {
			height: 100%;
			width: 50%;
			display: inline-block;
			top:200px;
			position: relative;
			transition: all 500ms ease-in-out 0s;
		}
		.timeline-item.active .timeline-image {
			top: 0px;
			transition: all 500ms ease-in-out 0.5s;
		}
		.timeline-item.up .timeline-image {
			top: -200px;
			transition: all 500ms ease-in-out 0.5s;
		}
		.timeline-item.active.up .timeline-image {
			top: 0px;
			transition: all 500ms ease-in-out 0.5s;
		}
		.timeline-image-mask {
			height: 100%;
			width: 100%;
			display: block;
			position: relative;
		}
		.timeline-image-mask div{
			width: 100%;
			height: 60%;
			position: absolute;
			margin: 20% 0;
			overflow: hidden;
			/* top: 0; */
			transition: all 0.4s ease-in-out;
		}
		.timeline-image-mask img {
			height: 100%;
			width: auto !important;
			display: block;
			max-width: none;
			transform: translate3d(0,15%,0);
			transition: all 0.8s ease-in-out 0s;
		}
		.up .timeline-image-mask img {
			transform: translate3d(0,-15%,0);
			transition: all 0.8s ease-in-out 0s;
		}
		.active .timeline-image-mask img {
			transform: translate3d(0,0%,0);
			transition: all 1s ease-in-out 0.5s;
		}
		.active.up .timeline-image-mask img {
			transform: translate3d(0,0%,0);
			transition: all 1s ease-in-out 0.5s;
		}
		.clip-me {
			width: 300px;
			height: 300px;
			background: #222;
		}