title: text won't show on small screens
body: <p>the text appears fine on desktop but when i use chrome inspect and resize to mobile view the text does not appear any more....i used other tags for text but still the same problem.</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.product-full {
          position: relative;
          height: auto;
          width: auto;
          margin: 38px 0 0 0;
      }
  
      .product-full a {
          margin: 0 13px 0 13px;
          width: auto;
          height: 220px;
      }
  
      .product-full p {
          margin: 0;
      }
  
      img[alt~="from"] {
          position: absolute;
          max-width: 59.78px;
          max-height: 32px;
          margin-left: 10.67px;
          margin-top: 10px;
      }
  
      img[alt~="product"] {
          display: block;
          margin-top: 0;
          margin-left: auto;
          margin-right: auto;
          width: 50%;
          height: auto;
      }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;body&gt;
  
  &lt;div class="product-full"&gt;
      &lt;a&gt;
         &lt;img src="/Assets/from-amazon.png" alt="from"&gt;
          &lt;img src="/Assets/product.png" alt="product"&gt;
          &lt;p&gt;Lorem ipsum dolor sit amet, consectetur adipiscing elit.&lt;/p&gt;
      &lt;/a&gt;
  &lt;/div&gt;
  
  &lt;/body&gt;</code></pre>
  </div>
  </div>
  </p>