Absolute positioned button does't appear on fixed header

Question

I have this very simple fixed menu bar, see here, now there is this element at the bottom of the menu that looks like the following:

This is now the menu looks on all other pages:

And now on this particular page I am for some reason not able to get the element (the video icon with the grey icon) to show up. Now if I check the developer tools, I see that the element is actually present:

<a href="#" id="btn-our-story" class="btn-our-story tooltip tooltipstered" data-target="#our-story-vedio"> <img src="http://codeandcode.co/demo/idea_spice/images/res/our-story-btn.png" alt="Our story vedio icon"> </a>

CSS code:

header .btn-our-story {
    position: absolute;
    bottom: 0;
    left: 0;
    height: auto;
    width: 100%;
    padding: 50px 0 42px;
    background: #f4f4f4;
    -webkit-transition: background-color .3s;
    -o-transition: background-color .3s;
    transition: background-color .3s;
    text-decoration: none;
}

Still the video icon doesn't appear, what I see is the following:

Why is the grey icon not appearing? I see no obvious reason why it should not, but it just doesn't appear.

Answer 1

YOu have on element .tooltip opacity 0. You should change it to 1 like this:

header .btn-our-story {
    opacity: 1
}

Answer 2

Your opacity is set to 0. Unsetting it brings it to screen.