/* Timeline css */

@import url('https://fonts.googleapis.com/css2?family=Besley:ital,wght@0,900;1,900&display=swap');

		.timeline{
			padding-left:0;
			padding-right:0;
		}
		
		.timeline > .row > div > div{
			border:none;
		}
		
		.timeline-item{
			display:block;
		}
		
		.timeline-item{
			position: relative;
			padding-top:2em;
			padding-bottom:2em;
		}
		
		.timeline-item .timeline-dot{
			position:absolute;
			top:0;
			width:4px;
			height:100%;
			background:#e20613;
			padding:0;
			left:105%;
		}
		
		.timeline-image table{
			display:none;
		}
		
		.timeline-item .timeline-dot img{
			position:absolute;
			top:10%;
		}
		
		.timeline-item .timeline-dot img.dot{
			left:-8px;
			width:20px;
			height:20px;
		}
		
		.timeline-item .timeline-dot img.icon{
			left:-18px;
			width:40px;
			height:40px;
			margin-top:-9px;
		}

		.timeline-item .timeline-dot img.icon{
			opacity: 0;
			transition:1s opacity ease;
		}

		.timeline-content, .timeline-image{
			opacity: 0.2;
			filter:saturate(0);
			transition:1s opacity ease;
		}
		
		.timeline-item .timeline-dot.fadeInUp img.icon, .timeline-content.fadeInUp, .timeline-image.fadeInUp{
			opacity: 1;
			filter:saturate(1);
		}
		
		.timeline-content h2{
		  font-family: "Besley", serif !important;
		  font-optical-sizing: auto !important;
		  font-weight: 900 !important;
		  font-style: normal !important;
			font-size:3em !important;
			padding-top:5%;
		}

		
		@media screen and (min-width:992px){
			.timeline{
				padding-left: var(--bs-gutter-x,.75rem);
    			padding-right: var(--bs-gutter-x,.75rem);
			}
		
			.timeline > .row > div > div{
				border:2px solid #e20613;
			}
			.timeline-item .timeline-dot{
				left:50%;
			}
		
			.timeline-item .timeline-dot img{
				top:30%;
			}
		
			.timeline-image table{
				display:table;
				width:100%;
				margin-top:1em;
			}
			.timeline-content h2{
				font-size:6em !important;
				padding-top:25%;
			}
		}


