/* =================================================================== 
 *
 *  Howdy v1.0 Main Stylesheet
 *  08-13-2016
 *  ------------------------------------------------------------------
 
/* ===================================================================
 *  13. portfolio - (_layout.scss)
 *
 * ------------------------------------------------------------------- */
.hidden {
	display : none;
}
#portfolio {
	background: #EBEBEB;
	min-height: 800px;
	position: relative;
	padding: 12rem 0 15rem;
}

#portfolio .bricks-wrapper:before,
#portfolio .bricks-wrapper:after {
	content: "";
	display: table;
}

#portfolio .bricks-wrapper:after {
	clear: both;
}

#portfolio .bricks-wrapper .brick {
	float: left;
	//width: 50%;
	padding: 0;
	margin: 0;
}

#portfolio .bricks-wrapper .brick:nth-child(2n+1) {
	clear: both;
}

/* ------------------------------------------------------------------- 
 * masonry entries - (_layout.css) 
 * ------------------------------------------------------------------- */
.animate-this .overlay img {
	vertical-align: bottom;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}
.animate-this:hover .overlay img {
	-webkit-transform: scale(1.02);
	-ms-transform: scale(1.02);
	transform: scale(1.02);
}

.bricks-wrapper {
	background: #ffccee;
	//padding: 20px;
	
}

.bricks-wrapper .item-wrap {

	position: relative;
	overflow: hidden;
	//margin: 4px 4px 4px 4px;
}

.bricks-wrapper .item-wrap .overlay {
	cursor: zoom-in;
}

.bricks-wrapper .item-wrap .overlay img {
	vertical-align: bottom;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.bricks-wrapper .item-wrap .overlay::before {
	content: "";
	display: block;
	background: rgba(255, 255, 255, 0.0);
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
	//width: 100%;
	height: 100%;
	-moz-transition: all 0.5s ease-in-out;
	-o-transition: all 0.5s ease-in-out;
	-webkit-transition: all 0.5s ease-in-out;
	-ms-transition: all 0.5s ease-in-out;
	transition: all 0.5s ease-in-out;
	z-index: 1;
}

.bricks-wrapper .item-wrap .overlay::after {
	content: "+";
	font-family: sans-serif;
	font-size: 2.4rem;
	z-index: 1;
	display: block;
	//height: 30px;
	//width: 30px;
	line-height: 30px;
	margin-left: -15px;
	margin-top: -15px;
	position: absolute;
	left: 50%;
	top: 50%;
	text-align: center;
	color: #FFFFFF;
	opacity: 0;
	visibility: hidden;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
	-webkit-transform: scale(0.5);
	-ms-transform: scale(0.5);
	transform: scale(0.5);
}

.bricks-wrapper .item-wrap .item-text {
	position: absolute;
	top: 0;
	left: 0;
	padding: 3rem 0 0 3rem;
	margin-right: 5rem;
	z-index: 3;
}

.bricks-wrapper .item-wrap .item-text .folio-title {
	color: #FFFFFF;
	font-size: 2.2rem;
	line-height: 1.364;
}

.bricks-wrapper .item-wrap .item-text .folio-types {
	font-family: "montserrat-regular", sans-serif;
	font-size: 1.2rem;
	text-transform: uppercase;
	letter-spacing: .1rem;
	color: rgba(255, 255, 255, 0.7);
}

.bricks-wrapper .item-wrap .details-link {
	display: block;
	background-color: #FFFFFF;
	height: 4.6rem;
	width: 4.6rem;
	line-height: 4.6rem;
	color: #000000;
	text-align: center;
	z-index: 2;
	position: absolute;
	top: 3.6rem;
	right: 0;
}

.bricks-wrapper .item-wrap .details-link i {
	font-size: 2rem;
	line-height: 4.6rem;
}

.bricks-wrapper .item-wrap .details-link:hover,
.bricks-wrapper .item-wrap .details-link:focus {
	background-color: #000000;
	color: #FFFFFF;
}

.bricks-wrapper .item-wrap .item-text,
.bricks-wrapper .item-wrap .details-link {
	opacity: 0;
	visibility: hidden;
	-webkit-transform: translateY(100%);
	-ms-transform: translateY(100%);
	transform: translateY(100%);
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.bricks-wrapper .item-wrap:hover .overlay::before {
	opacity: 1;
	visibility: visible;
}

.bricks-wrapper .item-wrap:hover .overlay::after {
	opacity: 1;
	visibility: visible;
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
}

.bricks-wrapper .item-wrap:hover .overlay img {
	-webkit-transform: scale(1.02);
	-ms-transform: scale(1.02);
	transform: scale(1.02);
}

.bricks-wrapper .item-wrap:hover .item-text,
.bricks-wrapper .item-wrap:hover .details-link {
	opacity: 1;
	visibility: visible;
	-webkit-transform: translateX(0);
	-ms-transform: translateX(0);
	transform: translateX(0);
}