.filo{background: url('../imgs/px-orange.svg') repeat-x; background-position: center; background-size: 1px 1px}
 h1{display:inline-block; float: right; background: #fff; padding-left:10px; padding-right: 10px}
 
.cella {position: relative;}
.overlay{opacity:0; position: absolute; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background-color: rgba(0, 0, 0, 0.6); color:#fff; font-size: 1.3em; text-align: center}
.cella:hover .overlay{opacity:1}
.overlay div small{display: block; font-size: 0.5em; text-transform: uppercase; margin:auto;}
.overlay-sm{display: none}

@media (max-width: 767px) {
 .overlay{display: none;}
 .overlay-sm{display: block; margin:6px auto 24px auto; font-size: 1.8em; color:#333; text-align: center}
 .overlay-sm small{display: block; font-size: 0.6em; text-transform: uppercase; margin:auto;}
}