.image img {
    max-width: 100%
}

.eyebrow {
    font-size: .8888em;
    font-weight: 700;
    letter-spacing: .125em;
    text-transform: uppercase
}

.component {
    color: var(--lead_black);
    font-size: 18px;
    line-height: 1.555555em;
    margin-left: -1.5rem;
    margin-right: -1.5rem;
    padding: 4.5rem 6rem
}

@media (max-width:1000px) {
    .component {
        color: var(--lead_black);
        font-family: var(--ge_font_family_base);
        font-size: 18px
    }
}

@media (max-width:500px) {
    .component {
        font-size: 5vw
    }
}

.component .p,
.component p {
    margin: 0 0 1em
}

@media (max-width:1000px) {

    .component .p,
    .component p {
        font-size: 18px;
        line-height: 1.555555em
    }
}

.component .h1,
.component h1 {
    font-size: 2.88888em;
    font-weight: normal;
    line-height: 1em;
    margin: .25em 0
}

.component .h2,
.component h2 {
    font-size: 2.4444em;
    font-weight: normal;
    line-height: 1.1363636em;
    margin: 0 0 .5em
}

.component .h3,
.component h3 {
    font-size: 1em;
    font-weight: normal;
    line-height: 1.555555em;
    margin: 0 0 1em
}

@media (max-width:1060px) {
    .component {
        margin-left: 0;
        margin-right: 0
    }
}

@media (max-width:1000px) {
    .component {
        padding: 3rem
    }
}

@media (max-width:500px) {
    .component {
        padding: 1.5rem
    }
}

.breadcrumbs {
    margin-bottom: .5em
}

@media (max-width:1000px) {
    .breadcrumbs {
        padding: 0 3rem
    }
}

@media (max-width:500px) {
    .breadcrumbs {
        padding: 0 1.5rem
    }
}

.breadcrumbs .crumb {
    text-decoration: none
}

.bttn,
button,
input[type=button],
input[type=reset],
input[type=submit] {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background-color: var(--basic_purple);
    border: 0;
    border-radius: 0;
    color: var(--white);
    cursor: pointer;
    display: inline-block;
    font-family: var(--ge_font_family_base);
    font-size: .88888em;
    -webkit-font-smoothing: antialiased;
    font-weight: normal;
    line-height: 1;
    padding: .75em 1em;
    text-align: center;
    text-decoration: none;
    -webkit-transition: background-color 150ms ease;
    -o-transition: background-color 150ms ease;
    transition: background-color 150ms ease;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    vertical-align: middle;
    white-space: nowrap
}

.bttn.external,
button.external,
input[type=button].external,
input[type=reset].external,
input[type=submit].external {
    display: inline-block;
    position: relative;
    background-color: var(--basic_purple);
}

.bttn.external:after,
button.external:after,
input[type=button].external:after,
input[type=reset].external:after,
input[type=submit].external:after {
    background-image: url("../images/icon-external.png");
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    content: '';
    display: inline-block;
    height: 1em;
    margin-left: 0.3em;
    width: 1em
}

.bttn:hover,
button:hover,
input[type=button]:hover,
input[type=reset]:hover,
input[type=submit]:hover {
    background-color: var(--basic_purple);;
    color: var(--white)
}

.bttn:focus,
button:focus,
input[type=button]:focus,
input[type=reset]:focus,
input[type=submit]:focus {
    outline: 0;
    outline-offset: 0
}

.bttn:disabled,
button:disabled,
input[type=button]:disabled,
input[type=reset]:disabled,
input[type=submit]:disabled {
    cursor: not-allowed;
    opacity: 0.5
}

.bttn:disabled:hover,
button:disabled:hover,
input[type=button]:disabled:hover,
input[type=reset]:disabled:hover,
input[type=submit]:disabled:hover {
    background-color: var(--basic_purple)
}

.bttn.big,
button.big,
input[type=button].big,
input[type=reset].big,
input[type=submit].big {
    width: 100%
}

.bttn.double-padding,
button.double-padding,
input[type=button].double-padding,
input[type=reset].double-padding,
input[type=submit].double-padding {
    padding: 0.75em 3em
}

.bttn.white,
button.white,
input[type=button].white,
input[type=reset].white,
input[type=submit].white {
    background-color: var(--white);
    color: var(--basic_purple)
}

.bttn.white:hover,
button.white:hover,
input[type=button].white:hover,
input[type=reset].white:hover,
input[type=submit].white:hover {
    background-color: var(--basic_purple);
}

.callout {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    background: var(--light_grey);
    gap: 3rem;
    margin-top: 4.5rem
}

.callout .column {
    -ms-flex-preferred-size: calc(50% - (3rem * 0.5));
    flex-basis: calc(50% - (3rem * 0.5));
    margin: 0 0 3rem 0
}

@media (max-width:500px) {
    .callout {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .callout .column {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        margin: 0
    }
}

.callout .column {
    margin-bottom: 0
}

.callout .content {
    -webkit-box-flex: 3;
    -ms-flex: 3;
    flex: 3
}

.callout .image {
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2;
    margin-top: -9rem;
    -webkit-box-ordinal-group: 0;
    -ms-flex-order: -1;
    order: -1
}

@media (max-width:1000px) {
    .callout .image {
        margin-top: 0
    }
}

@media (max-width:500px) {
    .callout .image {
        -webkit-box-ordinal-group: 2;
        -ms-flex-order: 1;
        order: 1
    }
}

.content-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    gap: 3rem
}

.content-section .column {
    -ms-flex-preferred-size: calc(50% - (3rem * 0.5));
    flex-basis: calc(50% - (3rem * 0.5));
    margin: 0 0 3rem 0
}

@media (max-width:500px) {
    .content-section {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .content-section .column {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        margin: 0
    }
}

.content-section .column {
    margin-bottom: 0
}

.content-section .content {
    -webkit-box-flex: 3;
    -ms-flex: 3;
    flex: 3
}

.content-section .image {
    -webkit-box-flex: 2;
    -ms-flex: 2;
    flex: 2
}

.content-section .eyebrow {
    -ms-flex-preferred-size: 100%;
    flex-basis: 100%
}

.product-categories {
    background: var(--light_grey)
}

.product-categories .categories {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.product-categories .categories .category {
    flex-basis: calc(33.33333% - (1.5rem * 0.66667));
    margin: 0 0 1.5rem 0
}

@media (max-width:1000px) {
    .product-categories .categories {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between
    }

    .product-categories .categories .category {
        flex-basis: calc(33.33333% - (1.5rem * 0.66667));
        margin: 0 0 1.5rem 0
    }
}

@media (max-width:500px) {
    .product-categories .categories {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column
    }

    .product-categories .categories .column {
        -ms-flex-preferred-size: auto;
        flex-basis: auto;
        margin: 0
    }
}

.product-categories .category {
    background: var(--white);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    padding: 2rem;
    position: relative
}

.product-categories .category .image {
    margin-bottom: 1em
}

.product-categories .category .heading-bk {
    margin-bottom: 0
}

.product-categories .category .link {
    text-decoration: none
}

.product-categories .category .link-overlay {
    bottom: 0;
    left: 0;
    position: absolute;
    right: 0;
    top: 0
}