Некорректно работает :nth-child

Сайт написан на OpenCart версии 2.x .Столкнулся с проблемой с nth-child на странице оформления заказа со способом доставки. Выходит полная путаница. Есть 4 параграфа к каждому из которых присвоен логотип через :before. Но проблема в том что они идут либо не по порядку либо съезжают на один параграф влево. Так же получается присвоить только 3-м параграфам из 4-х. Последнему не выходит. Есть еще одна проблема при переключении радиокнопки(у каждого параграфа есть своя радиокнопка), изображение меняется на соседнее. Ссылка на сайт

вот CSS:

#simplecheckout_shipping .simplecheckout-block-content p:first-child:before{
    position: absolute;
    content: '';
    -webkit-background-size: contain;
    background-size: contain;
    height: 89px;
    width: 130px;
    top: -50px;
    left: -8px;
    z-index:300;
    background-image: url(/image/catalog/yarninbob/delivery-icon.jpg);
}
#simplecheckout_shipping .simplecheckout-block-content p:nth-of-type(2):before {
    position: absolute;
    content: '';
    -webkit-background-size: contain;
    background-size: contain;
    height: 74px;
    width: 130px;
    top: -34px;
    left: -22px;
    z-index:300;
    background-image: url(/image/catalog/yarninbob/new-post.png);
}

#simplecheckout_shipping .simplecheckout-block-content p:nth-child(3):before {
    position: absolute;
    content: '';
    -webkit-background-size: contain;
    background-size: contain;
    height: 59px;
    width: 60px;
    top: -28px;
    left: 23px;
    z-index: 400;
    background-image: url(/image/catalog/yarninbob/pickup.png);
}

#simplecheckout_shipping .simplecheckout-block-content p:nth-child(4):before {
    position: absolute;
    content: '';
    -webkit-background-size: contain;
    background-size: contain;
    height: 51px;
    width: 96px;
    top: -22px;
    left: -3px;
    z-index: 400;
    background-image: url(/image/catalog/yarninbob/in-time.png);
}