title: Centering text on mobile only
body: <p>I'm pretty new to advanced CSS. I have a custom heading section which i want to make centered on mobile only. I have added a class name and the following code but nothings happened.</p>
  
  <pre><code>.mobile-text {
    text-align: right;
  }
  
  @media (max-device-width: 600px) {
    .mobile-text {
      text-align: center;
    }
  }
  </code></pre>
  
  <p><a href="https://dev5.runforthehills.com/" rel="nofollow noreferrer">This</a> is the homepage of this site and the paragraph is the following:</p>
  
  <blockquote>
    <p>REAL ESTATE THAT CHALLENGES NORMS &amp; ELEVATES EXPECTATIONS. THIS IS COLOURFUL THINKING IN A BLACK AND WHITE WORLD.</p>
  </blockquote>