Newsletter Type 5

Talha Aziz

The above block is copied from the site: https://screamingeagl1.wpenginepowered.com/our-process/

Pattern CSS

.stay-informed-panel{
	position: relative;
}

.stay-informed-panel:before {
    display: block;
    content: '';
    background: url("/wp-content/uploads/2025/09/stay-informed-left-img.png") no-repeat center;
    background-size: cover;
    width: 688px;
    height: 286px;
    position: absolute;
    left: -430px;
    top: 0;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

.stay-informed-panel:after {
    display: block;
    content: '';
    background: url("/wp-content/uploads/2025/09/stay-informed-right-img.png") no-repeat center;
    background-size: cover;
    width: 692px;
    height: 286px;
    position: absolute;
    right: -415px;
    top: 0;
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
	z-index: -1;
}

.stay-informed-images-box{
	position: relative;
}

.large-man-img{
	width: 487px;
	margin-top: -170px !important;
}

.stay-informed-icons {
    position: absolute;
	right: -50px;
    bottom: 90px;
    z-index: 999;
}

@media only screen and (max-width: 1550px) {
    .stay-informed-panel:before {
        left: -700px;
    }
}

@media only screen and (max-width: 1300px) {
    .large-man-img {
        width: 465px;
    }
    .stay-informed-icons {
        position: absolute;
        right: -20px;
        bottom: 80px;
    }
}

@media only screen and (max-width: 1200px) {
    .stay-informed-panel:after {
        right: -435px;
    }
    .stay-informed-icons {
        right: -15px;
        bottom: 30px;
    }
}

@media only screen and (max-width: 980px) {
    .stay-informed-panel:after {
        right: -695px;
    }

    .large-man-img {
        width: 325px;
        margin-top: -50px !important;
    }
    .stay-informed-icons {
        right: 10px;
        bottom: 30px;
    }
}

Newsletter Type 5

Stay Informed

Pattern CSS