Product Page Updates - Small pictures preview

Hello!

I need help with making updates to the mobile version of my website (www.n-umorigins.co)- using the Atlantic theme.

Problem Statement: Whenever looking at the products page on mobile, there are small previews of additional pictures at the bottom, which in turn pushes down critical information like price/ratings etc ect. I would like for the mobile version to show one image for the product, with an option to slide thru other pictures AND the desktop version to remain as is.

Initial Solution. I updated my Product Gallery Snippet with the below code and now I can no longer see the additional previews (yay), BUT there is no option to swipe thru other pictures AND the website version is also now messed up. On the website, I can see the previews, but can’t click on it. Any help would be much appreciated.

{% if product.media.size > 1 %}

{% for media in product.media %} {% render 'rimg' img: media.preview_image, size: '100x100', %}

{% case media.media_type %}
{% when ‘model’ %}
{% render ‘icon’ with ‘model-thumb’ %}
{% when ‘video’ %}
{% render ‘icon’ with ‘play-thumb’ %}
{% when ‘external_video’ %}
{% render ‘icon’ with ‘play-thumb’ %}
{% endcase %}

{% endfor %}

{% endif %}

Does you theme not provide an option from the customizer to not show thumbnails on mobile? Asking since this is a feature on free themes by Shopify, i know you are using a paid theme but atlantic is still i believe a Shopify theme, isn’t it??