title: Input search is changing text color to black on mouse leave
body: <p>I´m trying to devellop a search input but I´m having an issue and I´m not finding a way to resolve my problem.</p>
  
  <p>I already have the input search working, when I click in the input it expands, but When the input expands and then I write, I write text with white color and I want that like this.</p>
  
  <p>But then when I click outside the input text color is black and I also wanted it to be white or gray.</p>
  
  <p>Anyone there know how we can do this with CSS? On mouse leave the color be white and not black?</p>
  
  <p><strong>My codePen file:</strong></p>
  
  <p><a href="http://codepen.io/mib/pen/saytl/" rel="nofollow">http://codepen.io/mib/pen/saytl/</a></p>
  
  <p><strong>My html:</strong></p>
  
  <pre><code> &lt;li id="sb-search" style="float:right; list-style:none; height:20px;"&gt;
       &lt;form id="search"&gt;                   
         &lt;input name="q" type="text" size="40" placeholder="Pesquisar..." /&gt;             
        &lt;/form&gt;
   &lt;/li&gt;
  </code></pre>
  
  <p><strong>My CSS:</strong></p>
  
  <pre><code>#search input[type="text"] {
      border: 0 none;
      font:  12px 'bariol_boldbold';
      background: #141d22;
          text-indent: 0;
      width:110px;
      padding: 6px 15px 6px 35px;
      -webkit-border-radius: 20px;
      -moz-border-radius: 20px;
      border-radius: 20px;
      text-shadow: 0 2px 2px rgba(0, 0, 0, 0.3); 
      -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
      -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
      box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 3px rgba(0, 0, 0, 0.2) inset;
      -webkit-transition: all 0.7s ease 0s;
      -moz-transition: all 0.7s ease 0s;
      -o-transition: all 0.7s ease 0s;
      transition: all 0.7s ease 0s;
      }
  
  #search input[type="text"]:focus {
      background: #141d22;
      color: #fff;
      width: 170px;
          outline:none;
          color:000;
      -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
      -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
      box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(0, 0, 0, 0.9) inset;
      text-shadow: 0 2px 3px rgba(0, 0, 0, 0.1);
      }
  </code></pre>