Как поставить элементы ::before на списке li

ul li { 
  font-size: 18px; 
  line-height: 1.4em; 
  padding-left: 2.2em; 
  list-style-type: none; 
  position: relative; 
} 
 
ul li:before { 
  position: absolute; 
  top: .7em; 
  left: 0; 
} 
 
ul .li_1::before { 
  content: url(../Img/device/Cup.png); 
} 
 
ul .li_2::before { 
  content: url(../Img/device/Mouse.png); 
} 
 
ul .li_3::before { 
  content: url(../Img/device/Energy.png); 
} 
 
ul .li_4::before { 
  content: url(../Img/device/Speedometer.png); 
}

<ul> 
  <li class="li_1">Awesome design</li> 
  <li class="li_2">Fully responsive</li> 
  <li class="li_3">Retina ready</li> 
  <li class="li_4">Tons of features and easy to use</li> 
</ul>