@import 'https://fonts.googleapis.com/css?family=Montserrat:100,200,300,400,500,700,800,900';

*, :after, :before {
    box-sizing:border-box
}
@-ms-viewport {
    width:device-width
}
body {
    margin: 0;
    font-family: 'Montserrat', sans-serif;
}
img {
    border-style:none;
    vertical-align:top;
}
.container {
    width: 100%;
	margin: 0 auto;
	text-align: center;
}
.text-center {
    text-align: center;
	font-size: 30px; 
	color: #000000; 
	text-decoration: none; 
	margin: 16px;
}
.container-fluid {
    width: 100%;
}
.content-grid .img-wrapper {
	position: relative;
}
.content-grid-image {
    width:100%;
}
.masonry {
    margin: auto;
    max-width:100%; /* <<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<<< */
}
.masonry-item {
    display: inline-block;
    padding: .5rem;
    width:100%
}
.media {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  position: relative;
}
.media:hover {
  cursor: pointer;
}
.overlay {
  background: rgba(0, 0, 0, 0.5);
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: 3;
  opacity: 0;
  transition: all ease-in-out 0.5s;
}
.media:hover .overlay {
  opacity: 1;
}
.image-details {
  text-align: center;
  color: white;
  font-size: 20px;
  z-index: 4;
  position: absolute;
  top: 100%;
  opacity: 0;
  transition: all ease-in-out 0.4s;
}
.media:hover .image-details {
  margin: 0;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  opacity: 1;
}

@media only screen and (min-width : 320px) {
    .masonry-col {
        -moz-column-count: 1;
        -moz-column-gap: 0;
        -webkit-column-count: 1;
        -webkit-column-gap: 0;
        column-count: 1;
        column-gap:0
    }
}
@media only screen and (min-width : 574px) {
    .masonry-col {
        -moz-column-count: 2;
        -moz-column-gap: 0;
        -webkit-column-count: 2;
        -webkit-column-gap: 0;
        column-count: 2;
        column-gap:0
    }
}
@media only screen and (min-width : 768px) {
    .masonry-col {
        -moz-column-count: 3;
        -moz-column-gap: 0;
        -webkit-column-count: 3;
        -webkit-column-gap: 0;
        column-count: 3;
        column-gap:0
    }
}