#tiles{width:100%;margin-bottom:20px;display:inline-block}#tiles .tile{position:relative;float:left;margin:0px;overflow:hidden}@media screen and (max-width: 600px){#tiles .tile{width:calc(100% / 2);padding-bottom:calc(100% / 2)}}@media screen and (min-width: 600px) and (max-width: 900px){#tiles .tile{width:calc(100% / 3);padding-bottom:calc(100% / 3)}}@media screen and (min-width: 900px){#tiles .tile{width:calc(100% / 4);padding-bottom:calc(100% / 4)}}#tiles .tile #inner{position:absolute;top:8%;left:8%;width:84%;height:84%;background-color:#eee}@media (min-width: 500px){#tiles .tile #inner{box-shadow:0;transition:transform .1s,box-shadow .1s;transform:none;transition-timing-function:ease-in}#tiles .tile #inner:hover{transition-timing-function:ease-out;box-shadow:0 6px 10px 0 rgba(0,0,0,0.14),0 1px 18px 0 rgba(0,0,0,0.12),0 3px 5px -1px rgba(0,0,0,0.3);transform:scale(1.05)}#tiles .tile #inner:hover:active{transition-duration:0.05s;transform:scale(1.02);box-shadow:0 4px 5px 0 rgba(0,0,0,0.14),0 1px 10px 0 rgba(0,0,0,0.12),0 2px 4px -1px rgba(0,0,0,0.3)}#tiles .tile #inner:hover #image #animated{display:block}}@media (max-width: 500px){#tiles .tile #inner:active #image #animated{display:block}}#tiles .tile #inner #image{width:100%;height:100%;top:0px;left:0px;position:absolute;opacity:1;transition:opacity 0.2s}#tiles .tile #inner #image img{width:100%;height:100%;top:0px;left:0px;position:absolute}#tiles .tile #inner #image video{width:100%;height:100%;top:0px;left:0px;position:absolute}#tiles .tile #inner #image #animated{display:none}#tiles .tile #inner #image.loaded{opacity:1}#tiles .tile #inner a{z-index:1000;width:100%;height:100%;top:0px;left:0px;position:absolute}#tiles .tile #title{position:absolute;text-transform:uppercase;bottom:0px;left:8%;color:black;font-size:12px;font-family:monospace}