Проблема с картинками при открытии HTML файла

При открытии файла HTML изображения не открываются, при запуске того же файла через Live-server, картинки подгружаются нормально. Проблема только с этими изображениями и только в этом участке кода

#slide1:checked ~ .controls label:nth-child(2),
#slide2:checked ~ .controls label:nth-child(3),
#slide3:checked ~ .controls label:nth-child(4),
#slide4:checked ~ .controls label:nth-child(1) {
  background-image: url(/img/control-red-second.png);
  float: right;
  margin: -50px 50px 0 0;
  display: block;
}
#slide1:checked ~ .controls label:nth-last-child(1),
#slide2:checked ~ .controls label:nth-last-child(4),
#slide3:checked ~ .controls label:nth-last-child(3),
#slide4:checked ~ .controls label:nth-last-child(2) {
  background-image: url(/img/control-red-first.png);
  float: left;
  margin: -50px 0px 0 300px;
  display: block;
}

В чем может быть проблема?