KLAstudio

Hi Bangank,

Having a similar issue that the images in my masonry gallery are not clickable. All the images have a page linked to them.

That's the page with the gallery. 
https://www.kla.studio/work

I am new to custom CSS and I tested a lot of tweaks throughout the site so I am not sure which piece of the code causes the issues. I copied all the custom CSS here just in case.

Could you please have a look and let me know if there is something I should change?
Thank you!

.header-title a {
    pointer-events: none;
}

#collection-6246cd8fedbbfb7242a693df .header-actions-action,
#collection-6246cd8fedbbfb7242a693df .header-menu-cta {
  display: none;
}

#collection-6246ee89f42e9d07e4be5feb .header-actions-action,
#collection-6246ee89f42e9d07e4be5feb .header-menu-cta {
  display: none;
}

body.homepage footer.sections {
    display: none;
}
.header-actions-action .btn {
    padding: 0px 0px;
    font-size: 10px;
    color: #808080 !important;
    background: none !important;
    border-color: none !important;
}

.header-display-desktop {
    display: flex !important;
}
.header-display-mobile {
    display: none !important;
}
.header-burger {
    display: none;
}
.spacer-block {
    display: block !important;
}
.gallery-caption {
position: absolute;
top: 0;
left: 0;
background: rgba(0,0,0,0); /* overlay color */
height: 100%;
max-width: unset;
padding: 0;
opacity: 0;
}
.gallery-caption-wrapper {
display: flex;
align-items: flex-end; /* center vertically */
justify-content: left; /* center horizontally */
}
.gallery-caption-content {
font-size: 0.625rem !important; /* caption font size */
color: #808080; /*caption font color */
}
.gallery-masonry-item {
position: relative;
}
.gallery-masonry-item:hover .gallery-caption {
opacity: 0.5;
}
.gallery-caption-masonry-simple {
transition-delay: 0ms;
}
.gallery-section .gallery-caption p {
  text-align: left;
  font-size: 10px;
  font-weight: 300;
  color: #808080;
  text-transform: normal;
  line-height: 1.0em;
  font-family: inherit;
  letter-spacing: 0.25em;
}
.gallery-section .gallery-caption {
 padding: 52px 0px 0px 0px;
}
.gallery-section .gallery-caption p:first-line {
    font-weight: bold;
    color: #505050;
}
@media (max-width: 576px) {
    .gallery-masonry .gallery-masonry-wrapper {
        columns: 1;
        column-gap: 0;
        height: auto!important;
        display: block!important;
        padding: 5px;
    }
    .gallery-masonry-item-wrapper {
        height: auto!important;
    }
    .gallery-masonry-item {
        position: relative!important;
        transform: none!important;
        width: 100%!important;
        display: block;
        padding: 0px!important;
        box-sizing: border-box;
      margin-bottom:70px
    }

    .gallery-masonry .gallery-masonry-item img {
        height: 100%!important;
          width: 100%!important;
    }
}
@media (max-width: 576px) {.gallery-section .gallery-caption {
 padding: 55px 0px 0px 0px;
}}