Constraining image's placement / size for a background in a div

I am trying to make my background image constrained so it fills the section but is not so zoomed in. Any help would be appreciated. I currently have this code

    <div class="full-width-bg larger-text" style="padding-top: 50px;">
    <div class="custom-bg bgsIE bg-image" style="background-image: url('image.jpg');">
    </div>
    <div class="content-container">
    <h2><span style="color: #154774;"><strong>Sign up now for <br>a 14-day trial</strong></span></h2>
    <p><a href="" class="btn large darker-gray">Try it for free today</a>
    <hr class="gap" style="margin:50px 0 0 0;">
    </div></div>

This is how it looks so far:

How i want it to look

Solution

Add background-position: center; along with the background-image property and see the result. If there’s an issue with spacing there is the background-size property which in most cases is best to set as background-size: cover;