/* =======================================================
// Portfolio
======================================================= */
.portfolioShort .portfolioItems .pfItem .info .foot::after,
.portfolioShort::after,
.portfolioShort .portfolioItems::after {
	clear: both;
	content: " ";
	display: block;
}
.portfolioShort {}
.portfolioShort .portfolioItems {}
.portfolioShort .portfolioItems .pfItem {
	display: inline-block;
	float: left;
	width: calc(calc(100% / 3) - 2px);
	margin: 0 1px 2px 1px;
	position: relative;
}
.portfolioShort .portfolioItems .pfItem .overlayImg,
.portfolioShort .portfolioItems .pfItem .portfImg:after,
.portfolioShort .portfolioItems .pfItem .portfImg::before {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	z-index: 10;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: top center;
}
.portfolioShort .portfolioItems .pfItem .portfImg::before {
	z-index: 5;
	background-size: cover;
}
.portfolioShort .portfolioItems .pfItem .portfImg {
	display: block;
	width: 100%;
	padding-top: 100%;
	position: relative;
	overflow: hidden;
}
.portfolioShort .portfolioItems .pfItem .portfImg .overlayImg {
	z-index: 100;
}

@keyframes pfItemOpacity {
	0%    { opacity: 0; }
	20%    { opacity: 0; }
	100%  { opacity: 1; }
}
.portfolioShort .portfolioItems .pfItem {
	animation: pfItemOpacity ease 1s 0s 1;
}
/* =======================================================
// Portfolio item overlays
======================================================= */

/* PC overlay -------------------------------------------- */
.portfolioShort .portfolioItems .pfItem.desktop .overlayImg {
	background-image: url('../images/portfolio_web1-400.png');
}
.portfolioShort .portfolioItems .pfItem.desktop .portfImg::before {
	top: 7%;
	left: 7%;
	right: 7%;
	bottom: 43%;
	/*box-shadow: inset 0 0 1.4em 0em rgba(0,0,0,0.7);*/
	transition: all 7s ease;
}
.portfolioShort .portfolioItems .pfItem.desktop:hover .portfImg::before {
	/*background-position: bottom center;*/
}
/* Tablet overlay -------------------------------------------- */
.portfolioShort .portfolioItems .pfItem.tablet .overlayImg {
	/*background-image: url('../images/portfolio_web2.png');*/
	background-image: url('../images/portfolio_web2-400.png');
}
.portfolioShort .portfolioItems .pfItem.tablet .portfImg {
	-webkit-perspective: 1300px;
			perspective: 1300px;
}
.portfolioShort .portfolioItems .pfItem.tablet .portfImg::before {
	/*box-shadow: inset 0 0 1.4em 0em rgba(0,0,0,0.7);*/
	top: 44%;
	right: 2%;
	bottom: 46%;
	left: -3%;
	width: 57%;
	height: 78%;
	margin: auto;
	transform: rotateY(-38deg) rotateX(30deg) rotateZ(9deg);
	transition: all 5s ease;
}
.portfolioShort .portfolioItems .pfItem.tablet:hover .portfImg::before {
	/*background-position: bottom center;*/
}
/* Magazine overlay -------------------------------------------- */
.portfolioShort .portfolioItems .pfItem.magazine .overlayImg {
	background-image: url('../images/portfolio_mag1-400.png');
	z-index: 50;
}
.portfolioShort .portfolioItems .pfItem.magazine .portfImg::before {
	background-size: cover;
	transform: rotate(9.5deg);
	width: 46.3%;
	height: 65.2%;
	z-index: 30;
	top: 16.7%;
	left: 29.2%;
}
/* Magazine 2 overlay -------------------------------------------- */
.portfolioShort .portfolioItems .pfItem.magazine-2 .overlayImg {
	background-image: url('../images/portfolio_mag2-400.png');
	z-index: 50;
}
.portfolioShort .portfolioItems .pfItem.magazine-2 .portfImg::before {
	background-size: cover;
	transform: rotate(-14.7deg);
	width: 45.6%;
	height: 64.5%;
	z-index: 30;
	top: 25.5%;
	left: 12.3%;
}
.portfolioShort .portfolioItems .pfItem.magazine-2 .portfImg::after {
	background-size: cover;
	transform: rotate(19deg);
	width: 84.4%;
	height: 61%;
	top: 20.3%;
	left: 15.2%;
	/* z-index: 90; */
}
	/* Media Queries - Divi: 
	================================================== */
	@media all and (max-width: 980px) {
		.portfolioShort .portfolioItems .pfItem { width: calc(calc(100% / 2) - 2px); }
	}
	@media all and (max-width: 479px) {
		.portfolioShort .portfolioItems .pfItem { width: calc(100% - 2px); }
		.portfolioShort .portfolioItems .pfItem:not(:last-child) {margin-bottom: 20px;}
	}


/* =======================================================
// Portfolio item info
======================================================= */
.portfolioShort .portfolioItems .pfItem .info .foot,
.portfolioShort .portfolioItems .pfItem .info .text,
.portfolioShort .portfolioItems .pfItem .info{
	position: absolute;
	top: 0px;
	left: 0px;
	right: 0px;
	bottom: 0px;	
}
.portfolioShort .portfolioItems .pfItem .info{
	background-color: rgba(239, 124, 45, 0.85);
	color: #000;
	color: #fff;
	z-index: 100;
	overflow: hidden;
	opacity: 0;
	transform: scale(0);
	transition: all 0.3s ease;	
}
.portfolioShort .portfolioItems .pfItem.black .info{
	background-color: rgba(0, 0, 0, 0.85);
	/*color: #fff;*/
}
.portfolioShort .portfolioItems .pfItem.clicked .info{
	opacity: 1;
	transform: scale(1);
}
.portfolioShort .portfolioItems .pfItem .info .text{
	bottom: 50px;
	z-index: 20;
	overflow: hidden;
	padding: 15px;
}
.portfolioShort .portfolioItems .pfItem .info .text div.title {
	font-size: 20px;
	margin: 0 0 15px;
}
.portfolioShort .portfolioItems .pfItem .info .text div.title a{
	color: #fff !important;
}
.portfolioShort .portfolioItems .pfItem .info .foot {
	padding: 0 15px 10px;
	width: 100%;
	top: initial;
	line-height: 30px;
}
body #page-container .portfolioShort .portfolioItems .pfItem .info .foot a{
	color: #fff;
	font-weight: bold;
	font-size: 15px;
	line-height: 40px;
}
.portfolioShort .portfolioItems .pfItem .info .foot span.icoBut {
	display: inline-block;
	min-width: 40px;
	padding: 0;
	font-size: 23px;
	text-align: center;
	line-height: 40px;
	color: #fff;
	background-color: rgba(239, 124, 45, 1);
	border-radius: 50%;
	cursor: pointer;
}
.portfolioShort .portfolioItems .pfItem .info .foot a.portLink span.icoBut { 
	float: left; 
	margin-right: 10px;
}
.portfolioShort .portfolioItems .pfItem .info .foot a.lightboxLink { 
	float: right; 
}
.portfolioShort .portfolioItems .pfItem .info .foot a.lightboxLink span.icoBut { 
	float: none; 
}
.portfolioShort .portfolioItems .pfItem .info .foot span.icoBut {
	color: rgba(239, 124, 45, 1);
	background-color: #fff;
}