Как лучше сделать картинку?

* { 
  margin: 0; 
  padding: 0; 
} 
 
img { 
  display: block; 
  width: 100%; 
  height: 100%; 
  border-radius: 6px; 
} 
 
.item { 
  width: 250px; 
  margin: 30px auto; 
  border-radius: 5px; 
  overflow: hidden; 
  height: 310px; 
  position: relative; 
  box-shadow:4px 4px 20px; 
} 
 
.darkness { 
  position: absolute; 
  top: 0; 
  left: 0; 
  right: 0; 
  bottom: 0; 
  background: rgba(0, 0, 0, 0.5); 
} 
 
.description { 
  position: absolute; 
  top: 0; 
  left: 0; 
  width: 100%; 
  height: 100%; 
} 
 
.description-header, 
.description-footer { 
  width: 100%; 
  height: 50%; 
} 
 
.description-header { 
  display: flex; 
  align-items: center; 
  justify-content: center; 
  flex-direction: column; 
  color: #fbfbfb; 
  font-variant: small-caps; 
  font-weight: 100; 
  font-family: sans; 
  text-align: center; 
} 
 
.description-header .line { 
  width: 40%; 
  height: 1px; 
  background: gold; 
  margin: 10px auto; 
} 
 
.description-header p { 
  font-size: 12px; 
  font-weight: 100; 
  width: 60%; 
  font-style: italic; 
} 
 
i.fa { 
  color: #fbfbfb; 
  font-size: 14px; 
  color: gold; 
  padding-right: 4px; 
} 
 
.description-footer { 
  display: flex; 
  align-items: flex-end; 
} 
 
.description-footer div { 
  padding: 12px; 
} 
 
.description-footer span { 
  color: #fbfbfb; 
  font-size: 14px; 
}

<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css"> 
 
<div class="item"> 
  <div class="image"> 
    <img src="https://img.wallpaper.sc/applewatch/images/312x390/applewatch-312x390-photoface-wallpaper_00239.jpg" alt=""> 
  </div> 
  <div class="darkness"></div> 
  <div class="description"> 
    <div class="description-header"> 
      <h2>spring fever</h2> 
      <div class="line"></div> 
      <p> 
        Lorem ipsum dolor sit amet, consectetur adipisicing elit. 
      </p> 
    </div> 
    <div class="description-footer"> 
      <div> 
        <span><i class="fa fa-comment-o" aria-hidden="true"></i>12</span> 
        <span><i class="fa fa-calendar" aria-hidden="true"></i>03.12.2015</span> 
      </div> 
    </div> 
  </div> 
</div>