.imagerow {
    display: -ms-flexbox; /* IE10 */
    display: flex;
    -ms-flex-wrap: wrap; /* IE10 */
    flex-wrap: wrap;
    padding: 0 4px;
}

/* Create 3 equal columns that sits next to each other */
.imagecolumn {
	width: calc(33.33333% - 2.5em);
	margin: 0 0 0 2.5em;
}

.imagecolumn img {
    vertical-align: middle;
	width: 100%;
	border-radius: 4px;
}

/* Responsive layout - makes a two column-layout instead of four columns */
@media screen and (max-width: 1280px){
	.imagecolumn {
        width: calc(33.33333% - 1.25em);
		margin: 1.25em 0 0 1.25em;
    }
}

/*@media screen and (max-width: 980px){
	.imagecolumn {
		width: calc(50% - 2.5em);
		margin: 2.5em 0 0 2.5em;
    }
}*/

/*@media screen and (max-width: 736px){
	.imagecolumn {
		width: calc(50% - 1.25em);
		margin: 1.25em 0 0 1.25em;
    }
}*/

@media screen and (max-width: 700px){
	.imagecolumn {
		width: calc(100% - 1.25em);
		margin: 1.25em 0 0 1.25em;
    }
}

/* Image Caption */
.imagecontainer {
    position: relative;
	margin-bottom: 8px;
    max-width: 800px; /* Maximum width */
    /*margin: 0 auto;  Center it */
	border-radius: 4px;
	background-color: white;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	margin-bottom: 6em;
	transition: 0.5s;
}

.imagecontainer:hover {
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.imagecontainer .captioncontent {
    position: absolute; /* Position the background text */
    /* bottom: 0;   At the bottom. Use top:0 to append it to the top */
    background: rgba(255, 255, 255, 0.9); /* Black background with 0.5 opacity */
    /*color: #f1f1f1;  Grey text */
    width: 100%; /* Full width */
    padding: 10px; /* Some padding */
	border-radius: 0 0 4px 4px;
}

.imagecontainer:hover .captioncontent {
	transition: .5s ease;
	opacity: 0
}

.sold {
	float: right;
	color: #FF304B;
	margin: 0;
	padding: 0;
}
 