.image-columns{
	display:flex;
	flex-wrap:wrap;
}

.image-columns a.image-column{
	flex:1 1 250px;
	height:450px;
	position:relative;
	overflow:hidden;
}

.image-columns figure{
	position:relative;
	display:flex;
	justify-content:center;
	align-items:center;
	width:100%;
	height:100%;
}

.image-columns .overlay{
	background-color:rgba(0, 0, 0, 0.5);
	position:absolute;
	z-index:2;
	top:0;
	left:0;
	width:100%;
	height:100%;

	opacity:1;
	transition-duration:0.5s;
}

.image-columns figure:hover .overlay{
	opacity:0;
}

.image-columns figure img{
	width:100%;
	height:auto;
	transition-duration:8s;

}

.image-columns figure:hover img{
	transform:scale(1.3);
}

.image-columns figure figcaption{
	position:absolute;
	z-index:2;
	top:0;
	left:0;
	width:90%;
	height:90%;
	margin:5%;
	
	color:white;
}

.image-columns figure figcaption h3{
	text-transform:uppercase;
	transition:opacity 0.5s, margin-top 0.5s;
}
	
.image-columns figure:hover figcaption h3{
	margin-top:50px;
	opacity:0;
}

.image-columns figure figcaption p.subtitle{
	position:absolute;
	left:0;
	bottom:0;
	padding:0;
	margin:0;
	text-transform:uppercase;
	transform:rotate(-90deg);
	transform-origin:0 0;
	transition:letter-spacing 0.5s, opacity 0.5s;
}

.image-columns figure:hover figcaption p.subtitle{
	letter-spacing:2em;
	opacity:0;
}

.image-columns figure p.press{
	background-color:white;
	border-radius:50%;
	width:50px;
	height:50px;
	display:flex;
	justify-content:Center;
	align-items:center;
	
	position:absolute;
	top:0;
	right:0;
	
	opacity:0;
	transition-duration:0.5s;
}

.image-columns figure:hover p.press{
	opacity:1;
}


