@import “colors”;
.tile-col {
padding: 0;
}
.tile {
position: relative; width: 100%; padding-bottom: 100%; cursor: pointer;
}
.tile img {
max-height: none; position: absolute; padding: 20px; width: 100%; height: 100%; object-fit: cover; background-color: inherit;
}
.tile video {
position: absolute; padding: 20px; width: 100%; height: 100%; object-fit: cover;
}
.tile .tile-tint {
position: absolute; top: 20px; bottom: 20px; left: 20px; right: 20px; z-index: 1; opacity: 0.4;
}
.tile .tile-caption {
position: absolute; top: 20px; left: 20px; right: 20px; padding: 20px; margin: 20px; z-index: 2; background-color: rgba(0, 0, 0, 0.7); color: #FFFFFF;
}
.tile .tile-caption h1 {
color: #FFFFFF;
} .tile .tile-caption p {
color: #FFFFFF;
}
.tile .tile-cta {
position: absolute; bottom: 20px; right: 20px; padding: 20px; margin: 20px; z-index: 2; color: #FFFFFF; background-color: rgba(0, 0, 0, 0.7);
}
.tile-link {
display: block;
}
.tile-year {
position: absolute; bottom: 20px; left: 20px; padding: 20px; margin: 20px; z-index: 2; color: #FFF; background-color: rgba(0, 0, 0, 0.7);
}