How can style this Content DIV using an image in css?

Question

I am having a content DIV which is styled by CSS. Its look like below:

This is the HTML and CSS for this style:

<div class="content_box_hexagon">
<ul>
  <li>
    <div class="service-box hexagon">
      <figure class="icon">
        <img src="wp-content/themes/theme36038/images/icon11.png" alt="">
      </figure>
      <!-- <div class="service-box_body">
        <div class="btn-align">
          <a class="btn btn-inverse custom btn-normal btn-primary " href="" title="innovations" target="_self">Fabrication & Mechanical Works </a>
        </div>
      </div> -->
    </div>
  </li>
</ul>
</div>

.content_box_hexagon {
    padding-top:86px;
    text-align:center;
}
.content_box_hexagon ul {
    display: inline-block;
    list-style: outside none none;
    margin-bottom: 0;
    margin-left: 15px;
}

.content_box_hexagon ul li {
    float: left;
    padding: 0 15px;
}

.hexagon, 
.bg_DarckGrayColor .hexagon {
    width:300px;
    height:175px;
    background:#1e1e1e;
    position:relative;
    overflow:visible;
    box-sizing:border-box;
}


.hexagon .btn.btn-inverse.btn-normal.btn-primary {
    background:none;
    padding:14px 0 0 0;
    font:normal 14px/20px Montserrat;
    color:#8d8d8d;
}
.hexagon .btn.btn-inverse.btn-normal.btn-primary:before, 
.hexagon .btn.btn-inverse.btn-normal.btn-primary:after {
   display:none; 
}
.hexagon .btn.btn-inverse.btn-normal.btn-primary:hover { 
  color:#154e93; 
}

.hexagon .icon {
    float:none;
    width:100%;
    text-align:center;
    opacity:1;
}

.hexagon:before {
    content:"";
    position:absolute;
    top:-86px;
    left:0;
    width:0;
    height:0;
    border-left:150px solid transparent;
    border-right:150px solid transparent;
    border-bottom:87px solid #1e1e1e;
}
.hexagon:after {
    content:"";
    position:absolute;
    bottom:-86px;
    left:0;
    width:0;
    height:0;
    border-left:150px solid transparent;
    border-right:150px solid transparent;
    border-top:87px solid #1e1e1e;
}

My question is, I need to add an image to cover this entire block like below:

Can anybody tell me is it possible to do using CSS?

My Code sofar