.cd-h-timeline {



	opacity: 0;



	transition: opacity 0.2s



}







 .cd-h-timeline--loaded {



	opacity: 1



}







 .cd-h-timeline__container {



	position: relative;



	height: 100px;



	



}







 .cd-h-timeline__dates {



	position: relative;



	height: 100%;



	margin: 0 40px;



	overflow: hidden



}







 .cd-h-timeline__dates::after,



 .cd-h-timeline__dates::before {



	content: '';



	position: absolute;



	z-index: 2;



	top: 0;



	height: 100%;



	width: 20px



}







 .cd-h-timeline__dates::before {



	left: 0;



	background: linear-gradient(to right, hsl(0, 0%, 97%), hsla(0, 0%, 97%, 0));



	background: linear-gradient(to right, var(--cd-color-3), hsla(var(--cd-color-3-h), var(--cd-color-3-s), var(--cd-color-3-l), 0))



}







 .cd-h-timeline__dates::after {



	right: 0;



	background: linear-gradient(to left, hsl(0, 0%, 97%), hsla(0, 0%, 97%, 0));



	background: linear-gradient(to left, var(--cd-color-3), hsla(var(--cd-color-3-h), var(--cd-color-3-s), var(--cd-color-3-l), 0))



}







 .cd-h-timeline__line {



	position: absolute;



	z-index: 1;



	left: 0;



	top: 49px;



	height: 2px;



	background-color: hsl(0, 0%, 87.3%);



	background-color: hsl(var(--cd-color-3-h), var(--cd-color-3-s), calc(var(--cd-color-3-l)*0.9));



	transition: -webkit-transform 0.4s;



	transition: transform 0.4s;



	transition: transform 0.4s, -webkit-transform 0.4s



}







 .cd-h-timeline__filling-line {



	position: absolute;



	z-index: 1;



	left: 0;



	top: 0;



	height: 100%;



	width: 100%;



	background-color: hsl(74, 93%, 32%);



	background-color: var(--cd-color-2);



	-webkit-transform: scaleX(0);



	-ms-transform: scaleX(0);



	transform: scaleX(0);



	-webkit-transform-origin: left center;



	-ms-transform-origin: left center;



	transform-origin: left center;



	transition: -webkit-transform 0.3s;



	transition: transform 0.3s;



	transition: transform 0.3s, -webkit-transform 0.3s



}







 .cd-h-timeline__date {



	position: absolute;



	bottom: 0;



	z-index: 2;



	text-align: center;



	font-size: 0.8em;



	padding-bottom: 0.75em;



	padding-bottom: var(--space-sm);



	color: hsl(0, 0%, 22%);



	color: var(--cd-color-1);



	-webkit-user-select: none;



	-moz-user-select: none;



	-ms-user-select: none;



	user-select: none;



	text-decoration: none



}







 .cd-h-timeline__date::after {



	content: '';



	position: absolute;



	left: 50%;



	-webkit-transform: translateX(-50%);



	-ms-transform: translateX(-50%);



	transform: translateX(-50%);



	bottom: -5px;



	height: 12px;



	width: 12px;



	border-radius: 50%;



	border-width: 2px;



	border-style: solid;



	border-color: hsl(0, 0%, 87.3%);



	border-color: hsl(var(--cd-color-3-h), var(--cd-color-3-s), calc(var(--cd-color-3-l)*0.9));



	background-color: hsl(0, 0%, 97%);



	background-color: var(--cd-color-3);



	transition: background-color 0.3s, border-color .3s



}







 .cd-h-timeline__date:hover::after {



	background-color: hsl(74, 93%, 32%);



	background-color: var(--cd-color-2);



	border-color: hsl(74, 93%, 32%);



	border-color: var(--cd-color-2)



}







@media (min-width: 64rem) {



	 .cd-h-timeline__date {



		font-size: 0.7em



	}



}







.cd-h-timeline__date--selected {

    pointer-events: none;

    color: #f47216 !important;

}







 .cd-h-timeline__date--selected::after {



	background-color: hsl(74, 93%, 32%);



	background-color: var(--cd-color-2);



	border-color: hsl(74, 93%, 32%);



	border-color: var(--cd-color-2)



}







 .cd-h-timeline__date--older-event::after {



	border-color: hsl(74, 93%, 32%);



	border-color: var(--cd-color-2)



}







 .cd-h-timeline__navigation {



	position: absolute;



	z-index: 1;



	top: 50%;



	-webkit-transform: translateY(-50%);



	-ms-transform: translateY(-50%);



	transform: translateY(-50%);



	/*height: 34px;



	width: 34px;



	border-radius: 50%;



	border-width: 2px;



	border-style: solid;



	border-color: hsl(0, 0%, 87.3%);



	border-color: hsl(var(--cd-color-3-h), var(--cd-color-3-s), calc(var(--cd-color-3-l)*0.9));*/



	transition: border-color 0.3s



}







 .cd-h-timeline__navigation::after {



	content: '';



	position: absolute;



	height: 16px;



	width: 16px;



	top: 50%;



	left: 50%;



	-webkit-transform: translateX(-50%) translateY(-50%);



	-ms-transform: translateX(-50%) translateY(-50%);



	transform: translateX(-50%) translateY(-50%);



	background: url(../img/cd-arrow.html) no-repeat 0 0



}







 .cd-h-timeline__navigation:hover {



	border-color: hsl(74, 93%, 32%);



	border-color: var(--cd-color-2)



}







  .cd-h-timeline__navigation--prev {



	left: -15px;



}







 .cd-h-timeline__navigation--next {



	right: -15px;



}







 .cd-h-timeline__navigation--inactive {



	cursor: not-allowed



}







 .cd-h-timeline__navigation--inactive::after {



	background-position: 0 -16px



}







 .cd-h-timeline__navigation--inactive:hover {



	border-color: hsl(0, 0%, 87.3%);



	border-color: hsl(var(--cd-color-3-h), var(--cd-color-3-s), calc(var(--cd-color-3-l)*0.9))



}







 .cd-h-timeline__events {



	position: relative;



	width: 100%;



	overflow: hidden;



	transition: height .4s



}







 .cd-h-timeline__event {



	position: absolute;



	z-index: 1;



	width: 100%;



	left: 0;



	top: 0;



	-webkit-transform: translateX(-100%);



	-ms-transform: translateX(-100%);



	transform: translateX(-100%);



	padding: 0;



	opacity: 0;



	-webkit-animation-duration: 0.4s;



	animation-duration: 0.4s;



	-webkit-animation-timing-function: ease-in-out;



	animation-timing-function: ease-in-out



}







 .cd-h-timeline img{width: 100%;}







 .cd-h-timeline__event--selected {



	position: relative;



	z-index: 2;



	opacity: 1;



	-webkit-transform: translateX(0);



	-ms-transform: translateX(0);



	transform: translateX(0)



}







 .cd-h-timeline__event--enter-right,



 .cd-h-timeline__event--leave-right {



	-webkit-animation-name: cd-enter-right;



	animation-name: cd-enter-right



}







 .cd-h-timeline__event--enter-left,



 .cd-h-timeline__event--leave-left {



	-webkit-animation-name: cd-enter-left;



	animation-name: cd-enter-left



}







 .cd-h-timeline__event--leave-right,



 .cd-h-timeline__event--leave-left {



	animation-direction: reverse



}







 .cd-h-timeline__event-content {



	max-width: 100%



}







 .cd-h-timeline__event-title {



	color: hsl(0, 0%, 22%);



	color: var(--cd-color-1);



	font-family: 'Playfair Display', serif;



	font-family: var(--font-secondary);



	font-weight: 700;



	font-size: 2.48832em;



	font-size: var(--text-xxxl)



}







 .cd-h-timeline__event-date {



	display: block;



	font-style: italic;



	margin: 0.5em auto;



	margin: var(--space-xs) auto



}







 .cd-h-timeline__event-date::before {



	content: '- '



}







@-webkit-keyframes cd-enter-right {



	0% {



		opacity: 0;



		-webkit-transform: translateX(100%);



		transform: translateX(100%)



	}



	100% {



		opacity: 1;



		-webkit-transform: translateX(0%);



		transform: translateX(0%)



	}



}







@keyframes cd-enter-right {



	0% {



		opacity: 0;



		-webkit-transform: translateX(100%);



		transform: translateX(100%)



	}



	100% {



		opacity: 1;



		-webkit-transform: translateX(0%);



		transform: translateX(0%)



	}



}







@-webkit-keyframes cd-enter-left {



	0% {



		opacity: 0;



		-webkit-transform: translateX(-100%);



		transform: translateX(-100%)



	}



	100% {



		opacity: 1;



		-webkit-transform: translateX(0%);



		transform: translateX(0%)



	}



}







@keyframes cd-enter-left {



	0% {



		opacity: 0;



		-webkit-transform: translateX(-100%);



		transform: translateX(-100%)



	}



	100% {



		opacity: 1;



		-webkit-transform: translateX(0%);



		transform: translateX(0%)



	}



}







html:not() .cd-h-timeline__dates,



html:not() .cd-h-timeline__navigation {



	display: none



}