.flip-tiles{align-items:center;display:flex;flex-flow:row wrap;justify-content:center;margin:-20px}.flip-tiles .tile{flex:0 0 calc(33.33333% - 40px);height:0;margin:20px;overflow:hidden;padding-top:18.75%;position:relative;width:100%}.flip-tiles .tile img{height:100%;left:0;object-fit:cover;position:absolute;top:0;width:100%}.flip-tiles .tile .title{align-items:center;background:linear-gradient(180deg,transparent,rgba(0,0,0,.4));bottom:0;color:#fff;display:flex;flex-flow:column nowrap;left:0;line-height:normal;opacity:0;padding:20px;position:absolute;text-align:center;transition:opacity .3s ease;width:100%}.flip-tiles .tile:hover .title{opacity:1}.flip-tiles .tile .title .title-itself{font-size:33px;font-weight:700;text-transform:uppercase}.flip-tiles .tile .title .content{display:block;overflow:hidden}.flip-tiles .tile .title .title-button{background-color:var(--primary-color);color:#fff;font-size:13px;font-weight:600;margin-top:10px;padding:12px 20px 10px;text-transform:uppercase}.flip-tiles .tile .title-unhover{background:linear-gradient(180deg,transparent,rgba(0,0,0,.4));bottom:0;color:#fff;display:flex;flex-flow:column nowrap;left:0;line-height:normal;padding:20px;position:absolute;text-align:center;transition:opacity .3s ease;width:100%}.flip-tiles .tile:hover .title-unhover{opacity:0}.flip-tiles .tile .title-unhover .title-itself{font-size:33px;font-weight:700;text-transform:uppercase}@media (max-width:991px){.flip-tiles .tile{flex:0 0 calc(50% - 40px);padding-top:28.125%}}@media (max-width:500px){.flip-tiles .tile{flex:0 0 calc(100% - 40px);padding-top:56.25%}}@media (hover:none){.flip-tiles .tile .title{opacity:1}.flip-tiles .tile .title-unhover{opacity:0}}