/* History Section */

.single-history{
	position: relative;
	display: flex;
	width: 100%;
	margin-bottom: 60px;
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.single-history{
		display: block;
	}
}

@media(max-width:767px){
	.single-history{
		margin-bottom: 40px;
	}
}

.single-history:before{
	position: absolute;
	left: 50%;
	top: 0;
	height: 100%;
	width: 5px;
	background-color: #fff;
	content: "";
	border-radius: 10px;
	transform: translateX(-50%);
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.single-history:before{
		display: none;
	}
}

.single-history:last-child{
	margin-bottom: 0;
}

.history{
	position: relative;
	min-width: 50%;
}

.history:first-child{
	padding-right: 100px;
}

@media only screen and (min-width:1200px) and (max-width:1399px){
	.history:first-child{
		padding-right: 40px;
	}
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.history:first-child{
		padding: 0;
	}
}

.history:first-child .circle{
	position: absolute;
	right: -7px;
	transform: rotate(180deg);
	bottom: 60px;
}

.history:first-child .history-cnt-inner{
	margin-right: 60px;
	margin-left: 0;
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.history:first-child .history-cnt-inner{
		margin-right: 0;
		margin-bottom: 20px;
	}
}

.history:first-child .history-cnt-inner span{
	position: absolute;
	right: -105px;
	left: auto;
	top: 85px;
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.history:first-child .history-cnt-inner span{
		position: static;
	}
}

.history:last-child{
	padding-left: 100px;
}

@media only screen and (min-width:1200px) and (max-width:1399px){
	.history:last-child{
		padding-left: 40px;
	}
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.history:last-child{
		padding: 0
	}
}

.history:last-child .circle{
	position: absolute;
	left: -7px;
	top: 60px;
}

.history:last-child .history-cnt-inner{
	margin-left: 60px;
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.history:last-child .history-cnt-inner{
		margin-left: 0;
	}
}

.history .history-thumb{
	position: relative;
	z-index: 1;
}

.history .history-thumb img{
	width: 100%;
}

.circle{
	position: relative;
	height: 14px;
	width: 14px;
	background: #fff;
	border-radius: 50%;
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.circle{
		display: none;
	}
}

.circle:before{
	position: absolute;
	content: "";
	left: -3px;
	top: -3px;
	height: 20px;
	width: 20px;
	border: 1px solid #fff;
	border-radius: 50%;
	animation-name: rotateme;
	animation-duration: 5s;
	animation-iteration-count: infinite;
	animation-timing-function:linear;
	transition: all .2s cubic-bezier(.98,.57,1,1) 0s;
}

.circle:after{
	position: absolute;
	content: "";
	left: -6px;
	top: -6px;
	height: 26px;
	width: 26px;
	border: 1px solid #fff;
	border-radius: 50%;
	animation-name: rotateme;
	animation-duration: 5s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
	transition: all .2s cubic-bezier(.98,.57,1,1) 0s;
}

.circle .inner{
	width: 70px;
	border: 1.5px dashed #fff;
	position: relative;
	top: 5.5px;
	left: 15px;
	border-radius: 10px;
}

.history-cnt .history-cnt-inner{
	position: relative;
	margin-left: 60px;
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.history-cnt .history-cnt-inner{
		margin-left: 0;
	}
}

.history-cnt .history-cnt-inner h4{
	font-weight: 600;
	font-size: 30px;
	color: #17161a;
	text-transform: capitalize;
	margin-bottom: 15px;
}

@media(max-width:767px){
	.history-cnt .history-cnt-inner h4{
		font-size: 24px;
	}
}

.history-cnt .history-cnt-inner span{
	font-weight: 700;
	font-size: 60px;
	color: #17161a;
	opacity: .1;
	transform: rotate(-90deg);
	position: absolute;
	left: -105px;
	top: 85px;
}

@media only screen and (min-width:768px) and (max-width:991px),
(max-width:767px){
	.history-cnt .history-cnt-inner span{
		position: static;
		transform: none;
	}
}

@media(max-width:767px){
	.history-cnt .history-cnt-inner span{
		font-size: 40px;
	}
}

.history-cnt .history-cnt-inner p{
	font-size: 15px;
	text-align: justify;
}

@media only screen and (min-width:992px) and (max-width:1199px){
	.history-cnt .history-cnt-inner p{
		font-size: 14px;
	}
}