/* Shared responsive media guardrails for public pages. */
img,
picture,
video,
canvas,
svg {
    max-width: 100%;
}

img,
picture,
video {
    height: auto;
}

iframe {
    max-width: 100%;
}

.logo img,
.header img,
.footer img,
.mobile-menu img,
.social-icons img,
.cd-primary-nav-trigger img {
    height: auto;
}

.tp-caption img,
.rev_slider img,
.main-banner img,
.sub-banner img,
.service-tabs img,
.service-tab img,
.services img,
.work img,
.project img,
.project-detail img,
.product-detail img,
.product-card img,
.product-gallery img,
.gallery-item img,
.related-products img,
.testimonial img,
.about img,
.contact img,
.footer-detail img {
    display: block;
    max-width: 100%;
    height: auto;
}

.work figure,
.project figure,
.product-card figure,
.product-gallery figure,
.gallery-item,
.media-preview,
.service-tab .image,
.services .image,
.related-products .image {
    overflow: hidden;
}

.work figure > img,
.project figure > img,
.product-card figure > img,
.related-products .image > img,
.services .image > img,
.service-tab .image > img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.product-gallery img,
.project-detail img,
.product-detail img {
    object-fit: contain;
}

.hover img,
.grid figure img,
.effect-zoe img {
    width: 100%;
    height: auto;
}

.hover .icon,
.hover .plus,
.hover img[src*="plus"] {
    width: auto;
    max-width: none;
}

.map iframe,
.contact iframe {
    width: 100%;
    min-height: 320px;
    border: 0;
}

@media (max-width: 991px) {
    .work figure > img,
    .project figure > img,
    .product-card figure > img,
    .related-products .image > img,
    .services .image > img,
    .service-tab .image > img {
        aspect-ratio: 16 / 10;
    }
}

@media (max-width: 576px) {
    .work figure > img,
    .project figure > img,
    .product-card figure > img,
    .related-products .image > img,
    .services .image > img,
    .service-tab .image > img {
        aspect-ratio: 1 / 1;
    }

    .map iframe,
    .contact iframe {
        min-height: 260px;
    }
}
