/* =========================================================
   TIMELINE
========================================================= */

.ab-timeline{
	position:relative;
	max-width:1400px;
	margin:auto;
}

/* =========================================================
   CENTER LINE
========================================================= */

.ab-timeline-line{
	position:absolute;
	top:0;
	bottom:0;
	left:50%;
	width:2px;
	background:#96aab5;
	transform:translateX(-50%);
	z-index:1;
}

/* =========================================================
   ITEM
========================================================= */

.ab-timeline-item{
	position:relative;
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:170px;
	margin-bottom:100px;
}

/* =========================================================
   LEFT / RIGHT
========================================================= */

.ab-timeline-item.ab-left .ab-timeline-image-wrap{
	order:1;
}

.ab-timeline-item.ab-left .ab-timeline-content{
	order:2;
}

.ab-timeline-item.ab-right .ab-timeline-image-wrap{
	order:2;
}

.ab-timeline-item.ab-right .ab-timeline-content{
	order:1;
}

/* =========================================================
   IMAGE
========================================================= */

.ab-timeline-image-wrap{
	position:relative;
}

.ab-timeline-image{
	width:100%;
	display:block;
}

/* =========================================================
   ICON
========================================================= */

.ab-timeline-icon{
	position:absolute;
	left:50%;
	top:0px;
	transform:translateX(-50%);
	width:90px;
	height:90px;
	display:flex;
	align-items:center;
	justify-content:center;
	z-index:5;
	box-shadow:0 10px 30px rgba(0,0,0,0.12);
}

.ab-timeline-icon img{
	width:50px;
	height:50px;
	object-fit:contain;
}

/* =========================================================
   CONTENT
========================================================= */

.ab-timeline-content{
	max-width:520px;
}

.ab-timeline-year{
	font-size:35px;
	font-weight:700;
	line-height:1;
	margin-bottom:12px;
	color:#35b387;
}

.ab-timeline-title{
	font-size:30px;
	line-height:1.2;
	font-weight:700;
	margin-bottom:30px;
	color:#16305f;
	text-transform:uppercase;
}

.ab-timeline-description{
	font-size:16px;
	line-height:1.5;
	margin-bottom:20px;
}

/* =========================================================
   BULLETS
========================================================= */



.ab-timeline-bullets ul{
	margin:0;
	padding-left:30px;
}

.ab-timeline-bullets li{
	line-height:1.3;
	margin-bottom:0 !important;
}



/* =========================================================
   TABLET
========================================================= */

@media(max-width:991px){

	.ab-timeline{
		padding-left:50px;
	}

	.ab-timeline-line{
		left:35px;
	}

	.ab-timeline-item{
		grid-template-columns:1fr;
		gap:40px;
		margin-bottom:90px;
	}

	.ab-timeline-item.ab-left .ab-timeline-image-wrap,
	.ab-timeline-item.ab-right .ab-timeline-image-wrap{
		order:1;
	}

	.ab-timeline-item.ab-left .ab-timeline-content,
	.ab-timeline-item.ab-right .ab-timeline-content{
		order:2;
	}

	.ab-timeline-icon{
		left:35px;
		top:40px;
		width:65px;
		height:65px;
	}

	.ab-timeline-content{
		max-width:100%;
	}

}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:767px){

	.ab-timeline{
		padding-left:35px;
	}

	.ab-timeline-line{
		left:24px;
	}

	.ab-timeline-icon{
		left:-10px;
		width:54px;
		height:54px;
	}

	.ab-timeline-icon img{
		width:24px;
		height:24px;
	}

	.ab-timeline-year{
		font-size:34px;
	}

	.ab-timeline-title{
		font-size:26px;
		margin-bottom:20px;
	}

	.ab-timeline-description{
		font-size:15px;
		line-height:1.5;
	}

}

/* =========================================================
   LAST ITEM LINE FADE
========================================================= */

.ab-timeline-item:last-child{
	margin-bottom:0;
}

/* HIDE HARD LINE */

.ab-timeline-item:last-child::before{
	content:'';
	position:absolute;
	left:50%;
	bottom:-1px;
	width:20px;
	height:140px;
	background:#fff;
	transform:translateX(-50%);
	z-index:2;
}

/* FADE LINE */

.ab-timeline-item:last-child::after{
	content:'';
	position:absolute;
	left:50%;
	bottom:-1px;
	width:2px;
	height:140px;
	transform:translateX(-50%);
	background:linear-gradient(
		to bottom,
		#9aadb8 0%,
		rgba(154,173,184,0) 100%
	);
	z-index:3;
}



/* =========================================================
   MOBILE
========================================================= */

@media(max-width:1024px){

	.ab-timeline-item:last-child::before{
		left:-12px;
	}

	.ab-timeline-item:last-child::after{
		left:-12px;
	}

}
