
.project {
	padding-top: 50px;
	padding-bottom: 50px;
	background: url("../../assets/images/bgimage3.jpg") center center no-repeat;
	background-size: cover
}

.project .title {
	margin-bottom: 72px
}

.project .title h2 {
	font-size: 50px;
	line-height: 62px;
	font-weight: 700;
	color: #fff;
	margin-top: -10px;
	margin-bottom: 0
}

.project .project-slider .single-box {
	border-radius: 10px;
	margin-bottom: 30px;
	overflow: hidden;
	position: relative
}

.project .project-slider .single-box:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: #25429B;
	opacity: 0;
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in;
	z-index: 1
}

.project .project-slider .single-box .part-txt {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	padding: 50px;
	z-index: 2
}

.project .project-slider .single-box .part-txt .txt {
	-webkit-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	transform: translateX(-100%);
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in
}

.project .project-slider .single-box .part-txt .txt h3 {
	font-size: 32px;
	line-height: 100%;
	font-weight: 700;
	color: #fff;
	margin-bottom: 16px
}

.project .project-slider .single-box .part-txt .txt p {
	font-size: 16px;
	line-height: 100%;
	font-weight: 500;
	color: #fff;
	margin-bottom: 0
}

.project .project-slider .single-box .part-txt .details-btn {
	text-align: right;
	-webkit-transform: translateX(100%);
	-ms-transform: translateX(100%);
	transform: translateX(100%);
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in
}

.project .project-slider .single-box .part-txt .details-btn a {
	text-align: center;
	width: 60px;
	height: 60px;
	line-height: 66px;
	font-size: 25px;
	font-weight: 500;
	color: #00215b;
	padding:10px;
	background: #fff;
	border-radius: 5px;
}

.project .project-slider .single-box .part-txt .details-btn a:hover {
	color: #fff;
	background: #00215b
}

.project .project-slider .single-box:hover:after {
	opacity: .9
}

.project .project-slider .single-box:hover .part-txt .txt,.project .project-slider .single-box:hover .part-txt .details-btn {
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0)
}

.project .project-slider .owl-nav {
	position: absolute;
	top: -165px;
	right: 0
}

.project .project-slider .owl-nav button {
	text-align: center;
	width: 60px;
	height: 60px;
	line-height: 65px;
	font-size: 20px;
	color: #00215b;
	background: #fff;
	border-radius: 50%
}

.project .project-slider .owl-nav button.owl-prev {
	margin-right: 20px
}

.project .project-slider .owl-nav button:hover {
	color: #fff;
	background: #25429B
}



.recent-work {
	padding: 120px 0;
	background: url("../../images/bgimage3.jpg") center center no-repeat;
	background-size: cover
}

.recent-work .main-title {
	font-size: 45px;
	line-height: 100%;
	font-weight: 700;
	text-transform: uppercase;
	color: #fff;
	margin-top: -1px;
	margin-bottom: 96px
}

.recent-work .main-title span {
	color: #546e9b
}

.recent-work .wrap {
	max-width: 1770px;
	width: 100%;
	padding: 0 15px;
	margin: 0 auto
}

.recent-work .wrap .works .work-slider .slick-list {
	border-radius: 10px
}

.recent-work .wrap .works .work-slider .slick-list .single-box {
	margin: 0 25px;
	border-radius: 10px;
	overflow: hidden;
	position: relative
}

.recent-work .wrap .works .work-slider .slick-list .single-box:after {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(244,89,5,.9);
	opacity: 0;
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in;
	z-index: 1
}

.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt {
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: vertical;
	-webkit-box-direction: normal;
	-ms-flex-direction: column;
	flex-direction: column;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in;
	opacity: 0;
	z-index: 2
}

.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt h3 {
	font-size: 140px;
	line-height: 100%;
	font-weight: 700;
	color: #fff;
	margin-bottom: 61px;
	opacity: .15
}

.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 0 70px 50px;
	-webkit-transform: translateY(50px);
	-ms-transform: translateY(50px);
	transform: translateY(50px);
	-webkit-transition: all .4s ease-in;
	-o-transition: all .4s ease-in;
	transition: all .4s ease-in
}

.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt .title {
	font-size: 40px;
	line-height: 100%;
	font-weight: 700;
	color: #fff;
	margin-bottom: 19px
}

.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt p {
	font-size: 20px;
	line-height: 100%;
	font-weight: 500;
	color: #fff;
	margin-bottom: -5px
}

.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt .details-btn {
	text-align: center;
	width: 62px;
	height: 62px;
	line-height: 67px;
	font-size: 25px;
	font-weight: 500;
	color: #00215b;
	background: #fff;
	border: 1px solid #fff;
	border-radius: 50%
}

.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt .details-btn:hover {
	color: #fff;
	background: #00215b
}

.recent-work .wrap .works .work-slider .slick-list .single-box:hover:after {
	opacity: 1
}

.recent-work .wrap .works .work-slider .slick-list .single-box:hover .part-txt {
	opacity: 1
}

.recent-work .wrap .works .work-slider .slick-list .single-box:hover .part-txt .txt {
	-webkit-transform: translateY(0);
	-ms-transform: translateY(0);
	transform: translateY(0)
}

.recent-work .wrap .works .work-slider .slick-arrow {
	position: absolute;
	top: -140px;
	left: 0;
	right: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	visibility: hidden
}

.recent-work .wrap .works .work-slider .slick-arrow button {
	text-align: center;
	width: 60px;
	height: 60px;
	line-height: 62px;
	font-size: 20px;
	color: #00215b;
	background: #fff;
	border-radius: 50%;
	visibility: visible
}

.recent-work .wrap .works .work-slider .slick-arrow button.slick-prev {
	margin-right: 80px
}

.recent-work .wrap .works .work-slider .slick-arrow button:hover {
	background: #f45905;
	color: #fff
}

.recent-work .wrap .works .work-slider .slick-dots {
	padding: 0;
	margin: 70px auto 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-orient: horizontal;
	-webkit-box-direction: normal;
	-ms-flex-direction: row;
	flex-direction: row;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	list-style: none;
	background: #fff;
	border-radius: 4px;
	height: 8px;
	width: -webkit-max-content;
	width: -moz-max-content;
	width: max-content;
	overflow: hidden
}

.recent-work .wrap .works .work-slider .slick-dots li button {
	width: 210px;
	height: 8px;
	border-radius: 4px;
	text-indent: -9999px
}

.recent-work .wrap .works .work-slider .slick-dots li.slick-active button {
	width: 260px;
	background: #f45905
}



@media only screen and (min-width:992px) and (max-width:1199px) {
	
	
	.project .title {
		margin-bottom: 37px
	}

	.project .title h2 {
		font-size: 35px;
		line-height: 43px;
		margin-top: -5px
	}

	.project .project-slider .single-box .part-txt {
		padding: 30px
	}

	.project .project-slider .single-box .part-txt .txt h3 {
		font-size: 25px;
		margin-bottom: 17px
	}

	.project .project-slider .owl-nav {
		top: -100px
	}

	.project .project-slider .owl-nav button {
		width: 50px;
		height: 50px;
		line-height: 56px
	}
	.recent-work .main-title {
		font-size: 35px;
		margin-top: -2px;
		margin-bottom: 41px
	}

	.recent-work .wrap .works .work-slider .slick-arrow {
		top: -75px
	}

	.recent-work .wrap .works .work-slider .slick-arrow button {
		width: 55px;
		height: 55px;
		line-height: 57px
	}

	.recent-work .wrap .works .work-slider .slick-arrow button.slick-prev {
		margin-right: 70px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box {
		width: 700px;
		margin: 0 15px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt h3 {
		font-size: 110px;
		margin-bottom: 42px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt {
		padding: 0 50px 40px
	}

	.recent-work .wrap .works .work-slider .slick-dots {
		margin-top: 50px
	}

}

@media only screen and (min-width:768px) and (max-width:991px) {
	
	.project {
		padding-top: 60px;
		padding-bottom: 30px
	}

	.project .title {
		margin-bottom: 29px
	}

	.project .title h2 {
		font-size: 25px;
		line-height: 33px;
		margin-top: -5px
	}

	.project .project-slider .single-box .part-txt {
		padding: 25px
	}

	.project .project-slider .single-box .part-txt .txt h3 {
		font-size: 20px;
		margin-bottom: 15px
	}

	.project .project-slider .single-box .part-txt .txt p {
		font-size: 14px
	}

	.project .project-slider .single-box .part-txt .details-btn a {
		width: 40px;
		height: 40px;
		line-height: 46px;
		font-size: 20px
	}

	.project .project-slider .owl-nav {
		display: none
	}
	.recent-work {
		padding: 60px 0
	}

	.recent-work .main-title {
		font-size: 30px;
		margin-top: -2px;
		margin-bottom: 43px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box {
		width: 500px;
		margin: 0 10px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt h3 {
		font-size: 80px;
		margin-bottom: 2px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt {
		padding: 25px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt .title {
		font-size: 20px;
		margin-bottom: 15px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt p {
		font-size: 14px;
		margin-bottom: -4px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt .details-btn {
		width: 50px;
		height: 50px;
		line-height: 55px
	}

	.recent-work .wrap .works .work-slider .slick-dots {
		margin-top: 30px
	}

	.recent-work .wrap .works .work-slider .slick-dots li.slick-active button {
		width: 200px
	}

	.recent-work .wrap .works .work-slider .slick-dots li button {
		width: 150px
	}

	.recent-work .wrap .works .work-slider .slick-arrow {
		top: -70px
	}

	.recent-work .wrap .works .work-slider .slick-arrow button {
		width: 40px;
		height: 40px;
		line-height: 42px
	}

	.recent-work .wrap .works .work-slider .slick-arrow button.slick-prev {
		margin-right: 50px
	}

}

@media only screen and (min-width:576px) and (max-width:767px) {
	.project {
		padding-top: 60px;
		padding-bottom: 30px
	}

	.project .title {
		margin-bottom: 29px
	}

	.project .title h2 {
		font-size: 25px;
		line-height: 33px;
		margin-top: -5px
	}

	.project .project-slider .single-box .part-txt {
		padding: 25px
	}

	.project .project-slider .single-box .part-txt .txt h3 {
		font-size: 20px;
		margin-bottom: 15px
	}

	.project .project-slider .single-box .part-txt .txt p {
		font-size: 14px
	}

	.project .project-slider .single-box .part-txt .details-btn a {
		width: 40px;
		height: 40px;
		line-height: 46px;
		font-size: 20px
	}

	.project .project-slider .owl-nav {
		display: none
	}
		.recent-work {
		padding: 60px 0
	}

	.recent-work .main-title {
		text-align: center;
		font-size: 25px;
		margin-bottom: 44px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box {
		width: 380px;
		margin: 0 10px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt h3 {
		display: none
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt {
		padding: 25px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt .title {
		font-size: 20px;
		margin-bottom: 15px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt p {
		font-size: 14px;
		margin-bottom: -4px
	}

	.recent-work .wrap .works .work-slider .slick-list .single-box .part-txt .txt .details-btn {
		width: 50px;
		height: 50px;
		line-height: 55px
	}

	.recent-work .wrap .works .work-slider .slick-dots {
		margin-top: 30px
	}

	.recent-work .wrap .works .work-slider .slick-dots li.slick-active button {
		width: 110px
	}

	.recent-work .wrap .works .work-slider .slick-dots li button {
		width: 90px
	}

}
