#main section.section .section-content {
    padding: 2em 0;
}

#main .section-content .row {
    margin-left: 0;
    margin-right: 0;
}

#main .section-content .row > .column {
    padding-right: 0;
    padding-left: 0;
}

#main section.section.section-banner {
    background-color: #ebf1f8;
    padding-top: 1em;
    padding-bottom: 1em;
}
#main section.section.section-banner .section-content,
#main section.section.section-banner .section-content .row > .column {
    padding: 0;
}

.section-hero .column-blockers > * {
    margin-right: 80px;
}

.section-hero .column-safari > * {
    margin-left: 80px;
}

#extensions p {
    max-width: none;
}

.violator {
    margin-bottom: 0.75em;
}

.image-extensions-hero {
    background: url("/safari/extensions/images/screen-hero-large.jpg");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
    .image-extensions-hero {
        background-image: url("/safari/extensions/images/screen-hero-large_2x.jpg");
    }
}

.image-icon {
    margin-top: 2em;
    margin-bottom: 0.5em;
    height: 48px;
    width: 48px;
    background-size: 48px 48px;
    background-repeat: no-repeat;
    background-position: center;
}

.icon-blockers {
    background-image: url("/safari/extensions/images/icon-blockers.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
    .icon-blockers {
        background-image: url("/safari/extensions/images/icon-blockers_2x.png");
    }
}

.icon-safari {
    background-image: url("/safari/extensions/images/icon-safari.png");
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
    .icon-safari {
        background-image: url("/safari/extensions/images/icon-safari_2x.png");
    }
}

/* medium viewport */
@media only screen and (max-width: 1068px) {
    #main .section-content .row {
        margin-left: 0;
        margin-right: 0;
    }
    #main .section-content .row > .column {
        padding-right: 0;
        padding-left: 0;
    }
    .section-hero .column-blockers > * {
        margin-right: 30px;
    }

    .section-hero .column-safari > * {
        margin-left: 30px;
    }
    .image-extensions-hero {
        background: url("/safari/extensions/images/screen-hero-medium.jpg");
    }
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
        .image-extensions-hero {
            background-image: url("/safari/extensions/images/screen-hero-medium_2x.jpg");
        }
    }
}

/* small viewport */
@media only screen and (max-width: 735px) {
    .section-hero .column-blockers > * {
        margin-right: 0;
    }

    .section-hero .column-safari > * {
        margin-left: 0;
    }
    .image-extensions-hero {
        background: url("/safari/extensions/images/screen-hero-small.jpg");
    }
    @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 1.5dppx), only screen and (min-resolution: 144dpi) {
        .image-extensions-hero {
            background-image: url("/safari/extensions/images/screen-hero-small_2x.jpg");
        }
    }
    .image-icon {
        margin-top: 0;
    }
}

/* ipados ios ext hero */
.extensions-hero {
    margin-top: 2em;
    width: 100%;
}

/* === DARK MODE === */
body[data-color-scheme="dark"] #main section.section.section-banner {
    background-color: #0071e3;
}

body[data-color-scheme="dark"] #main > article > section.section.section-banner > div > div > div > p > a {
    color: #fff !important;
}