Bilder unter Warenkorb-Button

Hallo,

 

ich möchte ein paar Hinweise als Bild unter dem Warenkorb-Button einfügen.

Meine Vorgehensweise:
eine eigene index.tpl in frontend/detail ablegen,
eine eigene detail.less in frontend/_public/src/less/_modules ablegen und die all.less erweitern.
In der index.tpl möchte ich diesen Block anpassen:

{* Detailseite erweitern *}
{extends file='parent:frontend/detail/index.tpl'}

{block name='frontend_detail_index_buy_container_base_info' append}

Ist die Vorgehensweise richtig, bzw. bin ich in den richtigen Ordnern und habe ich den richtigen Block?

habe es jetzt hinbekommen wie beschrieben. Einzige Problem: WIe bekomme ich die Bilder in der horizontalen Liste zentriert?

Ich habe es auch schon mit einem DIV-Container probiert, geht aber auch nicht.
Meine Less:
 

.image-container{
  text-align: center;
  margin: 0 auto;
}

.image-plus {
  box-sizing: border-box;
  height: 100px;
  width: 100%;
  clear: both;
  .unitize-height(60, 16);


  li {
    box-sizing: border-box;
    float: left;
    height: 100%;
    margin: 0 auto;
    padding: 10px;
    display: inline; /* li nebeneinander anzeigen */
    list-style-type: none; /* ohne Aufzählungspunkte */
      }

@media screen and (min-width: @phoneLandscapeViewportWidth) { // View für Tablets und Desktops
.unitize-height(80, 16);
}
}