

.timeline {
    position: relative;
    margin-top: 4rem;
    margin-bottom: 2rem;
	width: 100%;
}
.timeline::after {
    content: '';
    position: absolute;
    width: 1px;
    background: #2d62cc;
    top: 0;
    bottom: 0;
    left: 50%;
    margin-left: -1px;
}

.timeline.timeline-one .timeline-item {
	position: relative;
	width: 50%;
	margin-left: 50%;
	padding-left: 2rem;
	text-align: left;
}

.timeline.timeline-one .timeline-item::before {
    content: '';
    position: absolute;
    width: 60px;
    height: 2px;
    top: calc(50% - 1px);
    right: 8px;
    background: #2d62cc;
    z-index: 1;
}

.timeline.timeline-one .timeline-item .icon {
    position: absolute;
    display: inline-block;
    width: 40px;
    height: 40px;
    margin-left: 28px;
    padding: 9px 0;
    top: calc(50% - 20px);
    background: #f6f8fa;
    border: 2px solid #2d62cc;
    border-radius: 40px;
    text-align: center;
    font-size: 17px;
    color: #2d62cc;
    z-index: 1;
}

.timeline.timeline-one .timeline-item:after {}

.timeline.timeline-one .timeline-item .timeline-item-cont {
    padding: 30px 30px 30px 120px;
    background-color: #f6f8fa;
    position: relative;
    border-radius: 500px 0 0 500px;}

.timeline.timeline-one .timeline-item .h5 {font-size: 18px; font-weight: 800; letter-spacing: -1px; color: #2e3133;}
.timeline.timeline-one .timeline-item.active .h5 {font-size: 30px; color: #2d62cc}
.timeline.timeline-one .timeline-item p {font-size:20px; font-weight: normal; color:#2d62cc}


.timeline.timeline-one .timeline-item.active:after {
    width: 24px; 
    height: 24px;
    background-color: #2d62cc;
    top:calc(50% - 14px);
}
.timeline.timeline-one .timeline-item p {padding-bottom: 1rem; line-height: 1.3;}

.timeline-date {display: inline-block; padding: 0.2rem 1.5rem 0.3rem; border: 1px solid  #536382; line-height: 1; border-image-slice: 1;  border-radius:18px; color: #536382}





.timeline.timeline-one .timeline-item img {
	margin-bottom: 1.25rem
}
.timeline.timeline-one .timeline-item.active > div:first-child {color: #249fe8}

.timeline.timeline-one .timeline-item:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 16px;
	height: 16px;
	margin-top: .425rem;
	border-radius: 50%;
    width: 60px;
    height: 1px;
    top: calc(50% - 8px);
    right: 8px;
    background: #2d62cc;
}

.timeline.timeline-one .timeline-item:after {
	content: "";
	position: absolute;
	width: 16px;
    height: 16px;
    top: calc(50% - 8px);
    left: -9px;
    background: #ffffff;
    border: 2px solid #2d62c5;
    border-radius: 16px;
    z-index: 1;
}

.timeline.timeline-one .timeline-item.active:after {left: -12px}

.timeline.timeline-one .timeline-item:nth-child(2n+1) {
	margin-left: 0;
	padding-right: 2rem;
	padding-left: 0;
	text-align: right;
}

.timeline.timeline-one .timeline-item:nth-child(2n+1) .icon {right: 60px}

.timeline.timeline-one .timeline-item:nth-child(2n+1) .timeline-item-cont {
    padding: 30px 120px 30px 30px;
    border-radius: 0 500px 500px 0;}

.timeline.timeline-one .timeline-item:nth-child(2n+1) .timeline-item-cont a:hover p {text-decoration: underline}



.timeline.timeline-one .timeline-item:nth-child(2n+1):after,
.timeline.timeline-one .timeline-item:nth-child(2n+1):before {
	right: 0;
	left: auto
}



.timeline.timeline-one .timeline-item:nth-child(2n+1):before {
}
.timeline.timeline-one .timeline-item.active:nth-child(2n+1):before {

}

.timeline.timeline-one .timeline-item:nth-child(2n+1):after {
	margin-right:-8px
}

.timeline.timeline-one .timeline-item:nth-child(2n+1).active:after {margin-right:-12px}

.timeline.timeline-one.dark .timeline-item:before {
	border: .0625rem solid #b7c3d2
}

.timeline.timeline-one.dark .timeline-item:after {
	background-color: #b7c3d2
}



.timeline .timeline-item.curStep {
	background-color: #ccc;
}




@media (max-width:575.98px) {
    
    .timeline.timeline-one .timeline-item:nth-child(2n+1) {
		padding-right: 0;
		padding-left: 1.5rem;
		text-align: left
	} 
    
	.timeline.timeline-one .timeline-item {width: 100%; margin-left: 0}
    
    .timeline.timeline-one .timeline-item:after {left: 0}
    
	.timeline.timeline-one .timeline-item:nth-child(2n+1):after,
	.timeline.timeline-one .timeline-item:nth-child(2n+1):before {
		right: auto;
		left: 0
	}
    
    .timeline.timeline-one .timeline-item .timeline-item-cont {padding: 20px 15px 15px 80px; border-radius: 100px; margin-bottom: 2rem}
    .timeline.timeline-one .timeline-item:nth-child(2n+1) .timeline-item-cont {
    padding: 20px 15px 15px 80px;
    border-radius: 100px;}
    
    .timeline.timeline-one .timeline-item:nth-child(2n+1) .icon {right: auto}
    
    .timeline.timeline-one .timeline-item p {font-size: 14px}
    
    .timeline.timeline-one .timeline-item.active .h5 {font-size: 20px}
    .timeline.timeline-one .timeline-item .h5 {font-size: 15px}
    
    .timeline-date {padding-left: 0.5rem; padding-right: 0.5rem}
    
    .timeline::after {display: none}
    
    
}



















span.isopen {    
	padding: 0px 3px;
    background-color: #333;
    border-radius: 3px;
    color: white;
}
span.isnotopen {    
	padding: 0px 3px;
    background-color: #c9c8c8;
    border-radius: 3px;
    color: white;
}