.panel-grid .panel-row-style.hero-image-with-text {
    width: 100%;
    margin: 0;
    max-width: 100%;
    min-height: 300px;
    position: relative;
}

@media only screen and (min-width: 800px) {
    .panel-grid .panel-row-style.hero-image-with-text {
        margin-top: 30px;
        min-height: 400px;
    }
}

@media only screen and (min-width: 1200px) {
    .panel-grid .panel-row-style.hero-image-with-text {
        min-height: 500px;
    }
}

.panel-grid .panel-row-style.hero-image-with-text .panel-grid-cell .widget_sow-editor {
    max-width: 1400px !important;
    margin: 0 auto !important;
}

.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline {
    max-width: 100%;
    position: absolute;
    bottom: 60px;
}

@media only screen and (min-width: 600px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline {
        max-width: 500px;
    }
}

@media only screen and (min-width: 1440px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline {
        max-width: 700px;
    }
}

@media only screen and (min-width: 1440px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline {
        max-width: 950px;
    }
}

@media only screen and (min-width: 860px) and (max-width: 1440px) {
    .panel-grid .panel-row-style.hero-image-with-text .panel-grid-cell .widget_sow-editor {
        margin-left: 20px !important;
        margin-right: 20px !important;
    }
}

@media only screen and (min-width: 800px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline {
        margin-top: 100px;
    }
}

@media only screen and (min-width: 1200px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline {

    }
}

.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline h2,
.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline p,
.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a {
    color: #FFFFFF;
}

.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline h2,
.section--headline h1 span {
    font-family: 'PostGroteskLight', Helvetica, Arial, 'Open Sans', san-serif, serif !important;
    font-size: 28px !important;
    line-height: 37px;
}

@media only screen and (min-width: 800px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline h2,
    .section--headline h1 span {
        font-size: 32px !important;
        line-height: 48px;
    }
}

@media only screen and (min-width: 1200px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline h2,
    .section--headline h1 span {
        font-size: 56px !important;
        line-height: 74px;
    }
}

.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline p,
.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a {
    font-family: 'PostGroteskNormal', Helvetica, Arial, 'Open Sans', san-serif, serif !important;
    font-size: 18px !important;
    line-height: 24px;
}

@media only screen and (min-width: 1200px) {
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline p,
    .panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a {
        font-size: 20px !important;
        line-height: 27px;
    }
}

.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a,
.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a:active,
.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a:visited,
.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a:focus {
    font-family: 'PostGroteskBold', Helvetica, Arial, 'Open Sans', san-serif, serif !important;
    text-decoration: none;
    border-bottom: 0;
}

.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a::before {
    display: inline-block;
    content: ' ';
    background-image: url('/wp-content/themes/generatepress-child/icons/arrow-right.svg');
    background-size: 15px 15px;
    background-repeat: no-repeat;
    height: 20px;
    width: 20px;
    vertical-align: middle;
    transition: background-size 0.2s ease, margin-right 0.2s ease, margin-top 0.2s ease;
}

.panel-grid .panel-row-style.hero-image-with-text .hero-image-headline a:hover::before {
    background-size: 20px 20px;
    margin-right: 10px;
    margin-top: -3px;
}
