I am completely new to Concrete5 But I have the basic block development down (allowing users to edit blocks in edit mode). C5 seems to be the easiest CMS for clients so I have been doing research on the development end for it. I don't want to switch just cause of this issue.

Where I am stuck at is HOW do I make it so that clients can change a header banner to their selected image. My theme header image takes up 100vh with texts in the center of the image.

Where I'm stuck:
What code do I need to let clients choose an image that will replace my default image header. I attached a file of my header image below that I would like clients to be able to replace.

HTML:
<header id="header_bg">
<span class="header_content">
<h1 class="header_title"> <? $a = new Area('Main Title');
$a->display($c); ?> </h1>
<p class="header_kicker"> <? $a = new Area('Main Kicker');
$a->display($c); ?> </p>
</span>
</header>

CSS:
#header_bg {
background: url(img/header_photo.jpg) no-repeat center center;
background-size: cover;
-o-background-size: cover;
-moz-background-size: cover;
-webkitz-background-size: cover;
height: 100vh;
width: 100%;
display: inline-block;
}