.axg-timeline {
	--axg-timeline-active: #02F935;
	--axg-timeline-card: #f1f2f3;
	position: relative;
	z-index: 0;
	width: 100%;
	max-width: 980px;
	margin: 0 auto;
}

.axg-timeline__item {
	position: relative;
	z-index: 0;
	padding: 0 0 2em;
}

.axg-timeline__item::after {
	content: "";
	display: table;
	clear: both;
}

.axg-timeline__line {
	position: absolute;
	top: 15px;
	left: 18px;
	z-index: -2;
	width: 4px;
	height: 100%;
	margin-left: -2px;
	overflow: hidden;
	background: #d7e4ed;
}

.axg-timeline__item:last-child .axg-timeline__line {
	display: none;
}

.axg-timeline__progress {
	width: 100%;
	height: 0;
	background: var(--axg-timeline-active);
}

.axg-timeline__bullet {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	width: 40px;
	height: 40px;
	margin-top: 10px;
	border: 6px solid #f9f9f9;
	border-radius: 50%;
	background: var(--axg-timeline-card);
	box-shadow: 0 1px 0 1px rgba(0, 0, 0, .1);
	color: #fff;
	font-size: 16px;
	line-height: 1;
	transition: .5s;
}

.axg-timeline__bullet svg {
	width: 16px;
	height: 16px;
	fill: #fff;
}

.axg-timeline__item.is-active .axg-timeline__bullet {
	border-color: #fff;
	background: var(--axg-timeline-active);
}

.axg-timeline__card {
	position: relative;
	box-sizing: border-box;
	margin-left: 60px;
	padding: 5px 10px;
	border-radius: .25em;
	background: var(--axg-timeline-card);
	text-align: left;
}

.axg-timeline__card::after {
	content: "";
	display: table;
	clear: both;
}

.axg-timeline__card::before {
	content: "";
	position: absolute;
	top: 35px;
	right: 100%;
	width: 0;
	height: 0;
	border: 14px solid transparent;
	border-right-color: var(--axg-timeline-card);
	border-left: none;
}

.axg-timeline__card p {
	margin: 1em 0;
	color: #333;
	line-height: 1.6;
}

.axg-timeline__date {
	float: left;
	padding: .8em 0;
	opacity: .7;
	color: #4d4d4d;
	font-family: "Sansation", Sans-serif;
	font-size: 25px;
	line-height: 22px;
}

@media only screen and (min-width: 992px) {
	.axg-timeline__item {
		padding-bottom: 4em;
	}

	.axg-timeline__line {
		left: 50%;
	}

	.axg-timeline__bullet {
		left: 50%;
		margin-left: -20px;
	}

	.axg-timeline__card {
		width: 45%;
		margin-left: 0;
	}

	.axg-timeline__item:nth-child(odd) .axg-timeline__card::before {
		right: auto;
		left: 100%;
		border-right: none;
		border-left: 14px solid var(--axg-timeline-card);
	}

	.axg-timeline__item:nth-child(even) .axg-timeline__card {
		float: right;
	}

	.axg-timeline__date {
		position: absolute;
		top: 0;
		left: calc(100% + 85px);
		float: none;
		width: 100%;
		padding: .8em 0 .8em 5px;
		text-align: left;
	}

	.axg-timeline__item:nth-child(even) .axg-timeline__date {
		right: calc(100% + 85px);
		left: auto;
		padding: .8em 5px .8em 0;
		text-align: right;
	}
}