/* When you mouse over the container, fade in the overlay icon*/
.product-image:hover .overlay {
    opacity: 1;
}

/* The overlay effect (full height and width) - lays on top of the container and over the image */
.overlay {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    max-height: 270px;
    max-width: 100%;
    opacity: 0;
    transition: 0.3 s ease;
}

/* The icon inside the overlay is positioned in the middle vertically and horizontally */
.icon {
    color: white;
    font-size: 40px;
    position: absolute;
    top: 40%;
    left: 50%;
    transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    text-align: center;
    opacity: 0.5;
}

/* When you move the mouse over the icon, change color */
.fa-video:hover {
    color: #eee;
}
.fa-image:hover {
    color: #eee;
}

.item {
    position:relative;
    padding-top:20px;
    display:inline-block;
}

.notify-badge{
    position: absolute;
    right:0;
    top:0;
    opacity: 0.7;
    background:green;
    text-align: center;
    border-radius: 30px 30px 30px 30px;
    color:white;
    padding:2px 5px;
    font-size:10px;
}