I created this little project to demonstrate my problem: <https://codepen.io/jmdagenais/pen/bGegrEV>

```css
.content {
    max-width: 450px;
}

.image-wrapper {
    height: 135px;
}

.image-wrapper img {
    opacity: 25%;
}

.button-section {
    text-align: center;
}
```

```html
<div class="content">
    <div class="image-wrapper">
        <img src="https://agilewarrior.files.wordpress.com/2014/04/cirlce-illustrator.png?w=500&h=480">
    </div>

    <div class="button-section">
        <a href="http://www.google.com" target="_blank">Google</a>
        <a href="http://www.github.com" target="_blank">Github</a>
    </div>
</div>
```

I have a similar situation on the website at my job. Links over an image that is not 100% opacity are not clickable.

If the opacity of the image is 100% the links are clickable.

Can somebody help me to fix this?