.our-works-section-inner {
	background-color:#fff;
	padding:100px 0;
}
.our-works-section-inner * {
	box-sizing: border-box;
}
.our-works-section-inner .section-title--lg2 {
	padding:0;
	margin:0;
}
.our-works-section-inner .container {
	display:flex;
	gap:8px;
}
.our-works-section-inner .container .left-col {
	flex: 0 0 auto;
	width:280px;
	display:inline-flex;
	flex-direction:column;
	gap:24px;
}
.our-works-section-inner .container .left-col .description {
	font-size: 18px;
	line-height: 150%;
	color: #343434;
	opacity: 0.7;
}
.portfolio-app {
	flex:  1 1 auto;
	display:flex;
	flex-direction:column;
	align-items:flex-start;
	gap:20px;
	--column-gap: 20px;
	max-width:100%;
	overflow:hidden;
}
.portfolio-filters {
	flex: 0 0 auto;
	display: flex;
	align-items: stretch;
	gap:10px;
	max-width:100%;
	overflow:auto;
    margin: 0 26px;	
}

.portfolio-filters label {
	display:inline-flex;
}
.portfolio-filters label [type="radio"] {
	display:none;
}
.portfolio-filters label .portfolio-filter-item-text {
	display:inline-flex;
	padding:16px 20px;
	background: #F0F3F4;
	border-radius: 4px;
	font-weight: 700;
	font-size: 11px;
	line-height: 11px;
	letter-spacing: 0.0641667px;
	text-transform: uppercase;
	color: #525252;
	cursor:pointer;
	white-space:nowrap;
}
.portfolio-filters label:hover .portfolio-filter-item-text {
	background: #E1E1E1;
}
.portfolio-filters label [type="radio"]:checked + .portfolio-filter-item-text {
	color:#F25354;
	cursor:default;
	background: #F0F3F4;
}


.portfolio-content {
	width:100%;
	flex: 1 1 auto;
	display:inline-flex;
	flex-direction:column;
	align-items:stretch;
	gap:20px;
	position:relative;
	padding:0 26px;
}
.portfolio-content:before,
.portfolio-content:after {
	content:"";
	position:absolute;
	top:0;
	height:100%;
	width:116px;
	visibility:hidden;
	opacity:0;
	transition:all .35s ease;
	z-index:2;
}
.portfolio-content:before {
	right:0;
	background: linear-gradient(to right, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 60%, #FFFFFF 100%);
}
.portfolio-content:after {
	left:0;
	background: linear-gradient(to left, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 40%, #FFFFFF 100%);
}
.portfolio-content.has-next:before {
	visibility:visible;
	opacity:1;
}
.portfolio-content.has-prev:after {
	visibility:visible;
	opacity:1;
}
.portfolio-buttons {
	position:absolute;
	bottom:0;
	left:50%;
	transform:translate(-50%, 0);
}

.portfolio-items {
	max-width:100%;
	display:flex;
	overflow:hidden;
	gap:var(--column-gap);
	flex: 1 1 auto;
	position:relative;
}
.portfolio-items.swiper-wrapper {
	gap:0;
	max-width:none;
	overflow:visible;
}
/*
.portfolio-items::after {
	content:"";
	position:absolute;
	width:100%;
	height:204px;
	bottom:0;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.75) 59.58%, #FFFFFF 100%);
}
*/

.portfolio-item {
	flex: 0 0 auto;
	display:inline-flex;
	width:232px;
	max-width:232px;
	height:250px !important;
	align-items:stretch;
	justify-content:center;
	overflow:hidden;
	position:relative;
	visibility:visible;
	border-radius:12px;
	overflow:hidden;
	text-decoration:none;
	border:none;
}
.portfolio-item a {
	border:none;
}
.portfolio-item.video-card a {
	position:relative;
	width:100%;
}
.portfolio-item.video-card a img {
	object-fit: cover;
    width: 100%;
    height: 100%;
}
.portfolio-item.more {
	background:#F0F3F4 url(images/bg-more-item.png) right bottom no-repeat;
	padding:16px;
	align-items:flex-start;
}

.portfolio-item.more .title {
	font-size: 18px;
	line-height: 150%;
	color: #34343488;
}
.portfolio-item.more .title:first-line {
	font-weight: 700;
	font-size: 26px;
	line-height: 31px;
	color: #343434;
}
	
.portfolio-item .image {
	display:inline-flex;
	width:100%;
	align-items:center;
	justify-content:center;
	overflow:hidden;
	border:none !important;
	position:relative;
}
.portfolio-item .image:before {
	content:"";
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:100%;
	z-index:1;
	opacity:0;
	background-color:#000;
	transition:all .35s ease;
	border-radius: 12px;	
}
.portfolio-item .image:hover:before {
	opacity:.24;
}

.portfolio-item .image img {
	width:100%;
	height:100%;
	object-fit:cover;
	opacity:1;
}
/*
.portfolio-item.ready {
	animation: 0.2s ease 0s 1 normal forwards running PYfqC;
}
.portfolio-item.ready img {
	opacity:1;
}
*/
.portfolio-item .image:empty {
	height:278px;
}

@keyframes PYfqC{
	0% {
		transform: scale(0);
	}
	100% {
		transform: scale(1);
	}	
}


.fancybox-portfolio .fancybox-slide .fancybox-content {
	background-color:transparent;
	padding:0;
	height:90vh;
	display:inline-flex !important;
	align-items:center;
	justify-content:center;
	flex-direction:column;
	gap:40px;
	overflow:hidden;
	margin:0 !important;
}
.fancybox-portfolio .fancybox-content .fb-image {
	flex: 1 1 auto;
	display:flex;
	align-items:center;
	justify-content:center;
	overflow:hidden;
}
.fancybox-portfolio .fancybox-content .fb-image img {
	flex:  1 1 auto;
	height: auto;
    width: auto;
	max-height:100%;
	max-width:100%;
	object-fit:contain;
}
.fancybox-portfolio .fancybox-content .fb-ttx {
	flex: 0 0 auto;
	display:flex;
	flex-wrap:wrap;
	gap:60px;
	color:#fff;
}



.fancybox-container.fancybox-portfolio.fancybox-is-open .fancybox-bg {
	opacity: .9;
}

.fancybox-container.fancybox-portfolio.fancybox-is-open .fancybox-toolbar {
	opacity:1;
	visibility:visible;
}
.fancybox-container.fancybox-portfolio.fancybox-is-open .fancybox-toolbar .fancybox-button:not(.fancybox-button--close) {
	display:none !important;
}


@media (max-width:800px) {

}




.our-works-section-inner .swiper-button-next, .our-works-section-inner .swiper-button-prev {
    width: 52px;
    height: 52px;
    background: #f25354;
    border-radius: 50%;
    border: 0;
    opacity: 1;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.our-works-section-inner .swiper-button-prev {
    left: 0;
    transform: translate(0, -50%);
}

.our-works-section-inner .swiper-button-next {
    right: 0;
    transform: translate(0, -50%);
}

.our-works-section-inner .swiper-button-next svg,
.our-works-section-inner .swiper-button-prev svg {
    fill: #fff;
    width: 16px;
    height: 14px;
}
.our-works-section-inner .swiper-button-next svg {
	transform: rotate(0);
}
.our-works-section-inner .swiper-button-prev svg {
	 transform: rotate(-180deg);
}

@media (max-width: 1376px) {
	.our-works-section-inner .container {
		flex-direction:column;
		align-items:stretch;
		gap:40px;
	}
	.our-works-section-inner .container .left-col {
		width:100%;
		flex-direction:row;
		align-items:flex-end;
		gap:60px;
	}
	.our-works-section-inner .container .left-col .section-title--lg2 {
		flex: 0 0 auto;
	}
}

@media (max-width: 976px) {
	.our-works-section-inner {
		padding:64px 0;
	}
	.our-works-section-inner .container {
		gap:20px;
	}
	.portfolio-content:before,
	.portfolio-content:after,
	.our-works-section-inner .swiper-button-next,
	.our-works-section-inner .swiper-button-prev
	{
		display:none;
	}
	.portfolio-item {
		width:184px;
		max-width:184px;
		height:200px!important;
	}
	.portfolio-filters {
		margin:0;
	}
	.portfolio-content {
		padding:0;
	}
	.our-works-section-inner .container .left-col {
		width:100%;
		flex-direction:column;
		align-items:stretch;
		gap:20px;
	}
	.portfolio-item.more {
		background-position: top 77px left 70px;
	}
	.portfolio-item.more .title {
		font-size: 16px;
	}
	.portfolio-item.more .title:first-line {
		font-size: 20px;
	}
}