.gallery {
    position: relative;
    padding: 0 2.4rem
}

.gallery::after {
    clear: both;
    content: "";
    display: table
}

@media only screen and (min-width:768px) {
    .gallery {
        padding: 0 4.2rem
    }
}

@media only screen and (min-width:1024px) {
    .gallery {
        padding: 0 4.2rem 4.2rem 4.2rem
    }
}

.dm-gallery figure::after {
    background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), color-stop(40%, transparent), to(rgba(0, 0, 0, .8)));
    background-image: -webkit-linear-gradient(top, transparent 0, transparent 40%, rgba(0, 0, 0, .8) 100%);
    background-image: -moz-linear-gradient(top, transparent 0, transparent 40%, rgba(0, 0, 0, .8) 100%);
    background-image: -o-linear-gradient(top, transparent 0, transparent 40%, rgba(0, 0, 0, .8) 100%);
    background-image: linear-gradient(top, transparent 0, transparent 40%, rgba(0, 0, 0, .8) 100%)
}

@media only screen and (min-width:1024px) {
    .dm-gallery figure::after {
        background-image: none;
        background-color: rgba(0, 0, 0, .6)
    }
    .dm-gallery figure figcaption h4::after {
        background-color: #f2552c
    }
}


.dm-gallery figure{position:relative;padding:.6rem 0;margin:0;overflow:hidden;cursor:pointer}

.dm-gallery figure::after{content:'';position:absolute;top:.6rem;left:0;width:100%;height:-webkit-calc(100% - 1.2rem);height:-moz-calc(100% - 1.2rem);height:calc(100% - 1.2rem);background-image:-webkit-gradient(linear,left top,left bottom,from(transparent),color-stop(40%,transparent),to(rgba(0,0,0,.8)));background-image:-webkit-linear-gradient(top,transparent 0,transparent 40%,rgba(0,0,0,.8) 100%);background-image:-moz-linear-gradient(top,transparent 0,transparent 40%,rgba(0,0,0,.8) 100%);background-image:-o-linear-gradient(top,transparent 0,transparent 40%,rgba(0,0,0,.8) 100%);background-image:linear-gradient(top,transparent 0,transparent 40%,rgba(0,0,0,.8) 100%)}

.dm-gallery figure figcaption{position:absolute;top:0;left:0;width:100%;height:100%;padding:2.4rem;text-align:center;z-index:1}
.dm-gallery figure figcaption h4{position:absolute;bottom:2.4rem;left:50%;right:auto;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);opacity:1;margin:0}
.dm-gallery figure figcaption h4::after{content:'';display:none}
.dm-gallery figure p{display:none}

@media only screen and (min-width:768px){.dm-gallery figure{padding:.6rem}.dm-gallery figure::after{position:absolute;top:.6rem;left:.6rem;width:-webkit-calc(100% - 1.2rem);width:-moz-calc(100% - 1.2rem);width:calc(100% - 1.2rem);height:-webkit-calc(100% - 1.2rem);height:-moz-calc(100% - 1.2rem);height:calc(100% - 1.2rem)}}

@media only screen and (min-width:1024px){.dm-gallery figure::after{background-image:none;background-color:rgba(0,0,0,.6);opacity:0;-webkit-transition:opacity .3s;-o-transition:opacity .3s;-moz-transition:opacity .3s;transition:opacity .3s}.dm-gallery figure figcaption h4{bottom:auto;left:50%;top:50%;bottom:auto;right:auto;-webkit-transform:translateX(-50%) translateY(-50%);-moz-transform:translateX(-50%) translateY(-50%);-ms-transform:translateX(-50%) translateY(-50%);transform:translateX(-50%) translateY(-50%);margin:2.4rem 0 0 0;opacity:0;-webkit-transition:opacity .3s .2s,margin .2s .2s ease-in;-o-transition:opacity .3s .2s,margin .2s .2s ease-in;-moz-transition:opacity .3s .2s,margin .2s .2s ease-in;transition:opacity .3s .2s,margin .2s .2s ease-in}.dm-gallery figure figcaption h4::after{display:block;position:absolute;bottom:-1rem;left:50%;right:auto;-webkit-transform:translateX(-50%);-moz-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);width:0;height:2px;background-color:#838687;-webkit-transition:width .3s .3s ease-in-out;-o-transition:width .3s .3s ease-in-out;-moz-transition:width .3s .3s ease-in-out;transition:width .3s .3s ease-in-out}}

.no-touch .dm-gallery figure:hover::after{opacity:1}
.no-touch .dm-gallery figure:hover figcaption h4{opacity:1;margin:0}
.no-touch .dm-gallery figure:hover figcaption h4::after{width:100%}