How can I center align a custom payment icon on both desktop and mobile?

Hello, i’d like to align custom “Bizum” payment icon and center the block in both, desktop and mobile. Any idea? https://aighard.com
Here’s the code i added to footer.liquid (Blue bold font):

{%- capture payment_icon_markup -%}
{%- if show_payment_icons -%}

{{ 'general.payment.method' | t }}
    {% assign enabled_payment_types = 'paypal,visa,american_express,master,maestro' | remove: ' ' | split: ',' %} {% for type in enabled_payment_types %}
  • {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}
  • {%- endfor -%} **
  • **

{%- endif -%} {%- endcapture -%}

hii, @Aighard
Do you want to like this?

Thank You.

.list--inline>li {
    display: inline-block;
    margin-left: 10px !important;
    margin-bottom: 0;
    vertical-align: middle;
}

@Aighard
Add this code in theme.css or theme.scss

Thanks a lot for your time, but it isn’t working.

@Aighard

Please try this code

{%- capture payment_icon_markup -%}
{%- if show_payment_icons -%}

{{ 'general.payment.method' | t }}

{% assign enabled_payment_types = 'paypal,visa,american_express,master,maestro' | remove: ' ' | split: ',' %}
{% for type in enabled_payment_types %}
- {{ type | payment_type_svg_tag: class: 'icon icon--full-color' }}

{%- endfor -%}
- 

{%- endif -%}
{%- endcapture -%}

Almost there! Thanks. The icon needs to be moved 5 pixels more to the right. BTW where’s the image link in case i want to change it? Thanks again.

Also, now there are more pixels between american express/mastercard than between the others.

This is how it looks with the last code. Any idea how to move it a little bit?