.section.guides {z-index: 1;margin-top: -5.8333333333rem; } .section.guides > .container {position: relative; } @media (max-width: 991.98px) {.section.guides > .container {margin-top: 0;} } .section.guides .card {justify-content: flex-end;height: 15.5555555556rem;border: 0;color: var(--black);text-decoration: none;margin-bottom: 1.1111111111rem;background-color: var(--light);background-repeat: no-repeat;background-position: center;background-size: cover;position: relative;box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.2);overflow: clip; } .section.guides .card .card-img-top {position: absolute;inset: 0;width: 100%;height: 100%; } .section.guides .card .card-img-top .img-fluid {position: absolute;inset: 0;width: 100%;height: 100%;object-fit: cover; } .section.guides .card .card-body {flex-grow: 0;flex-shrink: 0;justify-content: space-between;padding: 1.1111111111rem;background: var(--white);border-radius: 0 0 0.2222222222rem 0.2222222222rem;align-items: center;text-align: center;z-index: 1;transition: opacity 0.25s; } @media (max-width: 575.98px) {.section.guides .card .card-body {padding: 0.8333333333rem;} } .section.guides .card .card-title {color: var(--primary);margin-bottom: 0.6666666667rem;font-size: 1.1111111111rem;text-align: center;text-transform: uppercase;font-weight: 600;line-height: 1.05; } .section.guides .card .card-text {color: var(--secondary);font-size: 0.8888888889rem;margin-bottom: 0;text-align: center;font-weight: 600; } .section.guides .card:hover .card-body {opacity: 0.9; }