.gridd .item-gal {
    position: relative;
    overflow: hidden;
}

.gridd a:after {content: '';position: absolute;top: 0;width: 100%;height: calc(100% - 10px);display: block;background: black;z-index: 22;right: 0;opacity: 0.5;transition: 0.5s all ease;background-image: url(/wp-content/themes/twentyseventeen/images/search.png);background-size: 48px;background-position: center;background-repeat: no-repeat;transform: translateY(-100%);}

.gridd a {
    display: block !important;
    overflow: hidden;
    position: relative;
    padding-bottom: 1%;
}

.gridd a:hover:after,
.gridd a:hover:before {
    transform: none;
}

.gridd a:before {content: '';position: absolute;top: 0;width: 100%;height: calc(100% - 10px);display: block;z-index: 25;right: 0;opacity: 0.5;transition: 0.5s all ease;background-image: url(/wp-content/themes/twentyseventeen/images/search.png);background-size: 48px;background-position: center;background-repeat: no-repeat;transform: translateY(-100%);}


.gal-item {
    max-width: calc(100% / 3 - 10px);
}
.mfp-counter {
    display: none;
}

:not( .mejs-button ) > button:hover, :not( .mejs-button ) > button:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="submit"]:hover, input[type="submit"]:focus {
    background: transparent !important;
}

.mfp-counter {
    display: none;
}

:not( .mejs-button ) > button:hover, :not( .mejs-button ) > button:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="submit"]:hover, input[type="submit"]:focus {
    background-color: transparent !important;
}

.mfp-arrow-right:before {
    border: 0px;
    /* margin: auto; */
    width: 70px;
    height: 70px;
    background: black;
    margin: auto;
    background: url(/wp-content/themes/twentyseventeen/images/right.png);
    box-shadow: inset 0px 0px 1px 0px black;
    border-radius: 50%;
}

.mfp-arrow-right:after {
    display: none;
}


.mfp-arrow-left:before {
    border: 0px;
    /* margin: auto; */
    width: 70px;
    height: 70px;
    background: black;
    margin: auto;
    background: url(/wp-content/themes/twentyseventeen/images/left.png);
    box-shadow: inset 0px 0px 1px 0px black;
    border-radius: 50%;
}

.mfp-arrow-left:after {
    display: none;
}

button.mfp-close {
    position: fixed;
    right: 15px !important;
    top: 15px;
    font-size:0px;
    background-image: url(/wp-content/themes/twentyseventeen/images/close.png) !important;
    box-shadow: inset 0px 0px 1px 0px black;
    border-radius: 50%;
    width:70px !important;
    height:70px !important;
}

.mfp-zoom-out-cur, .mfp-zoom-out-cur .mfp-image-holder .mfp-close {
    cursor: pointer;
}

:not( .mejs-button ) > button:hover, :not( .mejs-button ) > button:focus, input[type="button"]:hover, input[type="button"]:focus, input[type="submit"]:hover, input[type="submit"]:focus {
    opacity: 1 !important;
}

:not( .mejs-button ) > button:hover:before {
    opacity: 1 !important;
}

#gallery-controls > li:first-child {
    background: #2b961c;
    border-color: #2b961c;
    color: white;
}
body:not(.rtl) div#gallery {
    max-width: calc(100% - 0px);
    right: auto;
    left: 0pa;
}
body.home .gallery-item-wrapper {
    width: calc(100% / 3 - 14px);
}
body.home .gallery-item-text {
    top: -10%;
}