title: opacity change in paragraph changes text opacity and background opacity
body: <p>Whenever I try to change the opacity of the paragraph it changes the opacity of the text and the background, all I want to change is the background of the text, how would I fix this?</p>
  
  <p>HTML</p>
  
  <pre><code>&lt;div id="opener"&gt;
   &lt;p id="introText"&gt;
    Adam Ginther is a&lt;class id="blueText"&gt; front-end developer&lt;/class&gt; with an interest in responsive &amp; mobile design
   &lt;/p&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>#opener {
          background-image: url('images/background.jpg');
          background-color: #373737;
          height: 800px;
          width: 100%;
          position: fixed;
          }
  
  #introText {
          width: 400px;
          color: white;
          background-color: black;
          text-align: center;
          display: table-cell;
          position: absolute;
          top: 50%;
          left: 50%;
          padding: 50px 80px 50px 80px;
          font-family: 'Fenix', serif;
          font-size: 1em;
             }
  #blueText {
          color:#00aeff;
            }
  </code></pre>