body.jp-gallery-fullscreen {
    overflow: hidden;
}
.jp-gallery-item {
    width: 100%;
}
.jp-gallery-item img {
    width: auto;
    height: auto;
    max-width: 100%;
    margin: auto;
    margin-bottom: 0 !important;
}
.jp-popup-gallery-wrapper.gallery-open {
    visibility: visible;
    opacity: 1;
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -webkit-transform: scale(1);
    transform: scale(1);
    
    z-index: 99999;
}
.jp-popup-gallery-wrapper {
    visibility: hidden;
    opacity: 0;
    -moz-transform: scale(.5);
    -ms-transform: scale(.5);
    -webkit-transform: scale(.5);
    transform: scale(.5);
    
    -webkit-transition: all .15s;
    -moz-transition: all .15s;
    transition: all .15s;
    
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    z-index: -10;
    background: #fff;
}
.jp-popup-gallery-wrapper .gallery-scroller {
    height: 100%;
    overflow: auto;
    overflow-y: scroll;
}
.jp-popup-gallery-wrapper .close.dashicons {
    float: right;
    color: #000;
    margin: 20px;
    width: 30px;
    height: 30px;
    font-size: 35px;
    box-shadow: none;
    font-family: dashicons;
    text-decoration: inherit;
    font-weight: 400;
}
.jp-popup-gallery-wrapper .gallery-title {
    font-size: 20px;
    line-height: 24px;
    padding: 20px;
    margin: 0;
    clear: none;
}
.jp-popup-gallery-wrapper .gallery-images {
    position: relative;
    width: 100%;
    clear: both;
}
.jp-popup-gallery-wrapper ul {
    list-style: none;
}
.jp-popup-gallery-wrapper .gallery-desc {
    padding: 20px;
}
.jp-popup-gallery-wrapper .gallery-desc h2 {
    font-size: 17px;
    line-height: 19px;
    margin-bottom: 10px;
    word-wrap: break-word;
}
.jp-popup-gallery-wrapper .gallery-desc h2 .counter {
    padding-right: 10px;
}

.jp-popup-gallery-wrapper .pager {
    display: block;
    position: absolute;
    top: 0;
    bottom: 0;
    box-shadow: none;
}
.jp-popup-gallery-wrapper .pager.prev {
    width: 50%;
    left: 0;
}
.jp-popup-gallery-wrapper .pager.next {
    right: 0;
    width: 50%;
}

.jp-gallery-prev.dashicons,
.jp-gallery-next.dashicons {
    position: absolute;
    top: calc(50% - 25px);
    background: rgba(0,0,0,.4);
    border-radius: 0%;
    font-size: 45px;
    color: #fff;
    text-shadow: 0 0 2px rgba(0,0,0,.7);
    z-index: 999;
    width: 45px;
    height: 45px;
    line-height: 45px;
    text-align: center;
    cursor: pointer;
    text-decoration: none;
}
.jp-gallery-prev.dashicons {
    left: 0px;
}
.jp-gallery-next.dashicons {
    right: 0px;
}

.jp-gallery-prev.dashicons:hover,
.jp-gallery-next.dashicons:hover {
    opacity: .8;
}

/* Initial gallery preview shown in page */
.jp-gallery-inline {
    width: 100%;
}
.jp-gallery-inline .gallery-title {
    font-size: 2.4rem;
    padding: 5px 0;
    color: #000;
    margin-bottom: 20px;
    border-bottom: 0.1rem solid #BCBCBC;
}

.jp-gallery-inline ul {
    list-style: none;
    height: 400px;
    padding: 0px;
}
.article__body .jp-gallery-inline ul li {
    list-style: none;
}

.jp-gallery-inline li {
    position: relative;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
    float: left;
}

.jp-gallery-inline li {
    height: 25%;
    width: 49%;
    margin-right: 2%;
    margin-bottom: 2%;
}
.jp-gallery-inline li:nth-child(2n+1) {
    margin-right: 0%;
}
.jp-gallery-inline li:first-child {
    height: 50%;
    width: 100%;
}

.jp-gallery-inline li a {
    display: block;
    height: 100%;
    box-shadow: none;
    text-decoration: none;
}

.jp-gallery-inline li a:hover {
    background: rgba(34,34,34,.2);
}

.jp-gallery-inline li:first-child a {
    float: left;
    width: 50%;
}

.jp-gallery-inline li:first-child a:hover {
    background: none;
}
.jp-gallery-inline li:first-child a:hover span {
    opacity: .8;
}

.jp-gallery-inline li.show-all-wrapper a {
    background-color: #E1E1E1;
    padding-top: 25px;
    text-align: center;
}
.jp-gallery-inline li.show-all-wrapper a:hover {
    background: rgba(34,34,34,.2);
}

.jp-gallery-inline .photos-count {
    display: block;
    font-size: 40px;
    line-height: 45px;
    font-weight: 700;
    margin-bottom: 0;
}

.jp-gallery-inline .show-all-label {
    font-size: 14px;
    line-height: 18px;
    color: #646464;
}

@media only screen and (min-width: 930px) {
    .jp-popup-gallery-wrapper .gallery-images {
      float: left;
      width: calc(100% - 340px);
      margin-bottom: 0;
    }
    .jp-popup-gallery-wrapper .gallery-desc {
      float: left;
      width: 340px;
      background: rgba(0,0,0,.03);
    }
}

@media only screen and (min-width: 620px) {
    .jp-gallery-inline li {
        height: 20%;
        width: calc(25% - 10px);
        margin-right: 10px;
    }
    .jp-gallery-inline li:nth-child(2n+1) {
        margin-right: 10px;
    }
    
    .jp-gallery-inline li:first-child {
        height: 78%;
        width: 100%;
        margin-bottom: 10px;
        margin-right: 0;
    }
    .jp-gallery-inline li:last-child {
        margin-right: 0;
        width: 25%;
    }
    
    .jp-gallery-inline li.show-all-wrapper a {
        padding-top: 15px;
    }
}

@media (min-width: 500px) {
    .jp-gallery-inline ul {
        height: 540px;
    }
}

@media (min-width: 400px) {
    .jp-gallery-inline ul {
        height: 500px;
    }
}