

/* General style */
.grid-gallery ul {
list-style: none;
margin: 0;
padding: 0;

}

.grid-gallery figure {
margin: 0;
}

.grid-gallery figure img {
display: block;
width: 100%;
}


.grid-gallery figcaption p {
margin: 0;
}

/* Grid style */
.grid-wrap {
width: 100%;
margin: 0 auto;
padding: 0;
}

.grid {
text-align:left;
}

.grid li {
width: 50%;
float: left;
cursor: pointer;

}

.grid figure {
padding: 25px;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
overflow:hidden;
opacity: 0.5;

}

.grid li:hover figure {
opacity: 1;
}

.grid figcaption {
background: #fff;
width:100%;
float:left;
padding: 40px;
}







@media only screen and (max-width: 1399px) {
/* responsive columns; see "Element sizing" on http://masonry.desandro.com/options.html */
.grid-wrap {
width: 100%;
margin: 0 auto;
padding: 0 ;}

.grid li {
width: 50%;

}

.grid figure {
padding: 12px;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
overflow:hidden;
float:left;
}

.grid figcaption {
background: #fff;
width:100%;
padding: 25px;
}}

@media only screen and (max-width: 999px) {
/* responsive columns; see "Element sizing" on http://masonry.desandro.com/options.html */
.grid-wrap {
width: 100%;
margin: 0 auto;
padding: 0 ;}

.grid li {
width: 50%;

}

.grid figure {
padding: 12px;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
overflow:hidden;
float:left;
}

.grid figcaption {
background: #fff;
width:100%;
padding: 25px;
}}





@media only screen and (max-width: 768px) {
/* responsive columns; see "Element sizing" on http://masonry.desandro.com/options.html */
.grid-wrap {
width: 100%;
margin: 0 auto;
padding: 0 ;}

.grid li {
width: 100%;
}

.grid figure {
padding: 10px 0px 20px 0;
-webkit-transition: opacity 0.2s;
transition: opacity 0.2s;
overflow:hidden;
}

.grid figcaption {
background: #fff;
width:100%;
padding: 15px;
}}





