#tooltip {
    z-index: 1000;
    text-align: center;
    color: #000;
    background: #d3d3d3;
    position: absolute;
    z-index: 100;
    padding: 15px;
    -webkit-animation: fadeOut 2s forwards;
    animation: fadeOut 2s forwards;
    -webkit-animation-delay: 5s;
    animation-delay: 5s;
}

@-webkit-keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

@keyframes fadeOut {
    from {
        opacity: 1;
    }
    to {
        opacity: 0;
    }
}

#tooltip:after

{
    z-index: 1000;
    content: '';
    position: absolute;
    top: 100%; 
    left: 50%;
    width: 0;
    height: 0;
    border: 15px solid transparent;
    border-top-color: #ccc;
    border-bottom: 0;
    border-left: 0;
    margin-left: 0;
    margin-bottom: -15px;
}