/*===============================================
** Image Boxes Css
*===============================================*/
.image-box{ text-align:center; padding:2%; }
.image-box-thumb{ margin-bottom:30px; overflow:hidden; overflow:hidden; }
.image-box-thumb img{ -webkit-filter: grayscale(100%); filter: grayscale(100%); -webkit-transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out;  }
.image-box-content{ padding:0 20px; font-size:14px; }
.image-box:hover img{ -webkit-filter: grayscale(0); filter: grayscale(0); -webkit-transform:scale(1.1,1.1); -ms-transform:scale(1.1,1.1); transform:scale(1.1,1.1); }


/*===============================================
** Album Grid Css
*===============================================*/
.album-grid{ position:relative; overflow:hidden; margin-bottom:30px; }
.album-grid figure{ margin-bottom:30px; }
.album-grid h2, .album-slider h2{ margin-bottom:0; }
.album-grid h2 a, .album-slider h2 a{ position:relative; padding-left:50px; }
.album-grid h2 a:before, .album-slider h2 a:before{ content:''; position:absolute; left:0; border-bottom:2px solid; width:40px; top:16px; }
.box{ position:relative; }

.box:before, .box:after, .box-content:before, .box-content:after{ content:''; background:linear-gradient(transparent,rgba(0,0,0,0.9)); height:100%; width:26%; transform: translateY(-100%); position:absolute; left:0; top:0; z-index:1; -webkit-transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; }

.album-grid:hover .box:before, .album-grid:hover .box:after, .album-grid:hover .box-content:before, .album-grid:hover .box-content:after{ -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); }

.box:after{ left: 25%; }
.box .box-content:before{ left: 50%; }
.box .box-content:after{ left: 75%; }
.album-grid:hover .box:before{ transition-delay: 0.225s; }
.album-grid:hover .box:after{ transition-delay: 0.075s; }
.album-grid:hover .box-content:before{ transition-delay: 0.15s; }
.album-grid:hover .box-content:after{ transition-delay: 0s; }
.box img{ width:100%; height:auto; -webkit-transition: all 0.7s ease-in-out 0s; -ms-transition: all 0.7s ease-in-out 0s; transition: all 0.7s ease-in-out 0s; }
.album-grid:hover img{ -webkit-filter:grayscale(100%); filter:grayscale(100%); }
.box .box-content{ width:100%; height:100%; position:absolute; bottom:0; left:0; }

.album-slider figure{ position:relative; overflow:hidden; }
.album-slider figure figcaption{ position:absolute; bottom:0; padding:20px; background-color:rgba(255,255,255,0.3); width:100%; }

/*===============================================
** Single Album Gallery Css
*===============================================*/
.album-gallery-main{ margin-top:50px; position:relative; }
.album-gallery-main:after{ content:''; display:table; clear:both; }
.album-gallery-grid{ position:relative; overflow:hidden; }
.album-gallery-grid.col-two{ width:46%; margin:2%; float:left; }
.album-gallery-grid.col-three{ width:31.3%; margin:1%; float:left; }
.album-gallery-grid.col-four{ width:23%; margin:1%; float:left; }

.album-gallery-caption{ position:absolute; width:100%; height:100%; top:0; background:linear-gradient(transparent,rgba(0,0,0,0.9)); -webkit-transition:all 0.5s ease-in-out; -ms-transition:all 0.5s ease-in-out; transition:all 0.5s ease-in-out; -webkit-transform:translateX(-100%); -ms-transform:translateX(-100%); transform:translateX(-100%); }
.album-gallery-caption i{ width:50px; height:50px; border-radius:50px; font-size:22px; background-color:#9f040e; color:#ffffff; display:inline-block; text-align:center; line-height:50px; position:absolute; top:50%; transform:translateY(-50%); margin:0 auto; left:0; right:0; transition-delay:1s; }
.album-gallery-grid:hover .album-gallery-caption{ -webkit-transform:translateX(0); -ms-transform:translateX(0); transform:translateX(0); transition-delay:0.2s; }