Tea Cozy project - background image and Layout problems - help!

Hello I’m stuck. The background images aren’t visible in my flex box. And I can’t center the title. Can anyone help?

``HTML CODE:`

            <div class="title">
                <h2>Locations</h2>
                <br>
            </div>
                    
            <div class="container">
                <div class="address">
                    <div class="black-box">
                        <h3>Downtown</h3>
                        <h4>384 West 4th St</h4>
                        <h4>Suite 108</h4>
                        <h4>Portland,maine</h4>
                    </div>
                </div>
                
                
                <div class="address">
                    <div class="black-box">
                
                        <h3>East Bayside</h3>
                        <h4>3433 Phisherman's Avenue</h4>
                        <h4>(Northwest Corner)</h4>
                        <h4>Portland,maine</h4>
                    </div>
                </div>

                <div class="address">
                    <div class="black-box">
                        <h3>Oakdale</h3>
                        <h4>515 Crescent Avenue</h4>
                        <h4>Second Floor</h4>
                        <h4>Portland,maine</h4>
                    </div>
                </div>
            </div>
        </section>

CSS CODE
#locations {
display: flex;
justify-content: center;
flex-wrap: nowrap;
width: 100%;
margin-top: 30px;
margin-bottom: 0px;
padding-top: 70px;
background-image: url(“images/locations-background.webp”);
background-size: cover;
}

.container {
width: calc(100% - 2rem);
display: flex;
justify-content: center;
padding-top: 15px;
margin: 0 auto 2rem auto;
}

#locations .title h2{
text-align: center;
margin: 0;

}

.address {
width: clac(33.33% - 2rem);
margin: 0;
border: 0;
padding: 0 1rem;
text-align: center;
}

.black-box {
background-color: black;
padding: 2rem;
}

SCREENSHOT: THIS IS MY ATTEMPT
![my site|689x330](upload://30hrJ95lGvD0wTXoLRJ5YaXI6uE.png)



THIS IS HOW IT'S MEANT TO LOOK:
https://content.codecademy.com/courses/freelance-1/unit-4/img-tea-cozy-redline.jpg

Try using align-items: center; for the title.