@-webkit-keyframes sonarEffect {
	0% {
		opacity: 0.3;
	}
	40% {
		opacity: 0.5;
		-webkit-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255, 255, 255, 0.5);
	}
	100% {
		box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255, 255, 255, 0.5);
		-webkit-transform: scale(1.5);
		opacity: 0;
	}
}

@-moz-keyframes sonarEffect {
	0% {
		opacity: 0.3;
	}
	40% {
		opacity: 0.5;
		-moz-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255, 255, 255, 0.5);
	}
	100% {
		-moz-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255, 255, 255, 0.5);
		-moz-transform: scale(1.5);
		opacity: 0;
	}
}

@keyframes sonarEffect {
	0% {
		opacity: 0.3;
	}
	40% {
		opacity: 0.5;
		box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255, 255, 255, 0.5);
	}
	100% {
		box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1), 0 0 10px 10px #fff, 0 0 0 10px rgba(255, 255, 255, 0.5);
		transform: scale(1.5);
		opacity: 0;
	}
}

//---- gf-portfolio-wrap----
.gf-portfolio {
	 position: relative;
	 z-index: 1;
}
.gf-portfolio-wrap {
	ul.gf-cate-filter {
		display: inline-block;
		left: 50%;
		.transform(translateX(-50%));
	}
}

.owl-carousel.carousel-3d {
	overflow: hidden;
	.owl-stage-outer {
		overflow: visible;
	}
	
	.entry-thumbnail {
		.transition(.5s);
	}
	
	.owl-item .entry-thumbnail {
		-webkit-transform: scale3d(1, 1, 1);
		-moz-transform: scale3d(1, 1, 1);
		-ms-transform: scale3d(1, 1, 1);
		-o-transform: scale3d(1, 1, 1);
		transform: scale3d(1, 1, 1);
	}
	
	.owl-item.active.center {
		.entry-thumbnail .entry-thumbnail-overlay:after,
		.portfolio-content {
			opacity: 1;
		}
		.portfolio-content {
			-webkit-transform: translateY(0);
			-moz-transform: translateY(0);
			-ms-transform: translateY(0);
			-o-transform: translateY(0);
			transform: translateY(0);
		}
	}
	
	.owl-item.active.center .entry-thumbnail {
		-webkit-transform: scale3d(1.2, 1.2, 1.2);
		-moz-transform: scale3d(1.2, 1.2, 1.2);
		-ms-transform: scale3d(1.2, 1.2, 1.2);
		-o-transform: scale3d(1.2, 1.2, 1.2);
		transform: scale3d(1.2, 1.2, 1.2);
	}
	
	.owl-item.active.center {
		z-index: 1;
	}
	
}

.portfolio-action {
	color: #fff;
	a {
		display: inline-block;
		vertical-align: middle;
		position: relative;
		width: 42px;
		height: 42px;
		line-height: 40px;
		border: 2px solid #fff;
		-webkit-border-radius: 50%;
		-moz-border-radius: 50%;
		border-radius: 50%;
		font-size: 14px;
		margin: 0 5px;
		&:after {
			content: '';
			position: absolute;
			top: 0;
			left: 0;
			right: 0;
			bottom: 0;
			-webkit-border-radius: 50%;
			-moz-border-radius: 50%;
			border-radius: 50%;
			opacity: 0;
			-webkit-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
			-moz-box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
			box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.1);
			-webkit-transition: -webkit-transform ease-out 0.1s, background 0.2s;
			-moz-transition: -moz-transform ease-out 0.1s, background 0.2s;
			transition: transform ease-out 0.1s, background 0.2s;
		}
		&:focus,
		&:hover {
			color: #fff !important;
			&:after {
				-webkit-animation: sonarEffect 1.3s ease-out 75ms;
				-moz-animation: sonarEffect 1.3s ease-out 75ms;
				animation: sonarEffect 1.3s ease-out 75ms;
			}
		}
	}
}

.portfolio-grid {
	.portfolio-content {
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		z-index: 3;
		padding: 25px;
		opacity: 0;
		color: #fff;
		-webkit-transform: translateY(20px);
		-moz-transform: translateY(20px);
		-ms-transform: translateY(20px);
		-o-transform: translateY(20px);
		transform: translateY(20px);
		.transition(all .5s);
		* {
			color: inherit;
		}
	}
	.portfolio-item-inner {
		position: relative;
		&:hover {
			.entry-thumbnail .entry-thumbnail-overlay:after,
			.portfolio-content {
				opacity: 1;
			}
			.portfolio-content {
				-webkit-transform: translateY(0);
				-moz-transform: translateY(0);
				-ms-transform: translateY(0);
				-o-transform: translateY(0);
				transform: translateY(0);
			}
			
		}
	}
	
	.entry-thumbnail-overlay:after {
		background-color: rgba(0, 0, 0, 0.7);
	}
}

.single-portfolio-gallery-thumb .owl-item {
	cursor: pointer;
	&.current .entry-thumbnail-overlay:after {
		.opacity(1);
	}
}

.gf-single-portfolio-wrap {
	.gallery-layout-thumbnail {
		.gallery-overlay {
			position: absolute;
			left: 0;
			top: 0;
			width: 100%;
			height: 100%;
			z-index: 2;
			cursor: pointer;
			.rgba-bg-color(#000, 0.3);
			opacity: 0;
			.transition(all 0.3s);
		}
	}
	.owl-item.current .gallery-overlay,
	.gallery-layout-thumbnail .gallery-overlay:hover {
		opacity: 1;
	}
	.portfolio-single {
		&.layout-1 {
			.portfolio-single-gallery {
				margin-bottom: 60px;
			}
		}
		.gsf-portfolio-single-title {
			&:extend(.fs-22);
			&:extend(.fw-normal);
			letter-spacing: .02em;
			
		}
		&.layout-3,&.layout-4 {
			.gf-portfolio-meta-wrap {
				margin-top: 60px;
			}
		}
	}
}
@media (max-width: 767px) {
.gf-single-portfolio-wrap{
	.portfolio-single{
		&.layout-4,&.layout-3 {
			.gf-portfolio-content{
				.gf-portfolio-meta-wrap {
					margin-top: 40px;
				}
			}
			
		}
		&.layout-3 {
			.gf-portfolio-content{
				margin-top: 40px;
			}
			
		}
		&.layout-4 {
			.gf-portfolio-content{
				margin-bottom: 40px;
			}
			
		}
	}
}
}

.gf-portfolio-meta-wrap{
	padding: 40px 32px;
	ul.gsf-portfolio-meta{
		list-style: none;
		padding-left: 20px;
		li{
			font-size: 0;
			margin-top: 12px;
			&:first-child{
				margin-top: 0;
			}
			label,span,a{
				letter-spacing: .02em;
			}
			label{
				font-size: 14px;
				font-weight: 400;
				text-transform: uppercase;
				line-height: 1.57;
				margin-bottom: 0;
				display: block;
				
			}
			span,a {
				font-size: 13px;
				line-height: 1.69;
			}
			a{
				text-decoration: none !important;
			}
			&:last-child{
				font-size: 13px;
			}
		}
		&+a{
			margin-top: 50px;
		}
		&+button {
			margin-top: 50px;
		}
	}
}