Margins - Left & Right on Stocklist Store Locator

[Ryanp]

Im using sections and blocks on this page template - I added the widget to a block of  liquid.. However I cannot get the margins to work.. Anybody have a clue what I can do to put this widget into a container or add margins to the sides so it doesnt span? https://devildaves.com/pages/bulk-bloody-mary-seasoning

Here is the Widget Code I am using: 

<!-- Start Stockist.co widget -->
<div data-stockist-widget-tag="u7955">Loading store locator from <a href="https://stockist.co">Stockist store locator</a>...</div>
<script>// <![CDATA[
(function(s,t,o,c,k){c=s.createElement(t);c.src=o;c.async=1;
k=s.getElementsByTagName(t)[0];k.parentNode.insertBefore(c,k);
})(document,'script','//stockist.co/embed/v1/widget.min.js');
// ]]></script> <!-- End Stockist.co widget -->

[PageFly-Amelia]

Hello @Ryanp 

This is Amelia at PageFly - Shopify Advanced Page Builder app.

You can try the following steps I have provided to help you solve the problem you are facing:

You can try the following steps I have provided to help you solve the problem you are facing:

Step 1: Online Stores > Themes > Edit code

Step 2: Choose file theme.liquid,
Step 3: Add code above the tag </head>.

If you are using a page builder app, you can directly open the Custom code section of the app and use the code below without following the steps above.

#stockist-widget .stockist-horizontal {
   margin: 20px;
}

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly

[Ryanp]

Thank you Amelia - That worked great for desktop. I put it in the CSS of the editor.. If I want to give it padding on mobile, should I create another line and wrap it in @mobile?

Here is what I did..

 

[PageFly-Amelia]

Hello @Ryanp 

I am glad that my solution can help you. If you want to use margin on Mobile, you can add my code below to make it work on mobile.

@media (max-width: 768px){
   #stockist-widget.stockist-responsive .stockist-map {
      margin: 15px !important;
   }
}

Hoping my solution helps you solve your problem.

Best regards,

Amelia | PageFly