title: :focus not working for the input control scss
body: <p>I am using scss, i am trying create a floating label without javascript. 
  Here i am having an text box and label inside a div with class name <code>form-type-textfield</code> and <code>form-type-email</code>.what i am trying to do here is that whenever the focus is on textbox, i am moving the label upwards.</p>
  
  <p>but it seems like the <code>:focus</code> is not working for me,but when i use <code>:hover</code> its working fine, but i want to apply the css on :focus. </p>
  
  <p>What am i doing wrong here?
   my html structure looks like this.</p>
  
  <pre><code>&lt;div&gt;
      &lt;label&gt;Label&lt;/label&gt;
      &lt;input type="textbox"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>     .form-type-textfield input:focus,.form-type-email input:focus{
          label{
              transform: translateY(-25px);        
              -moz-transition: all ease-in-out 200ms;
              -webkit-transition: all ease-in-out 200ms;
              transition: all ease-in-out 200ms;
              font-size: 16px !important;
          }
      }
  </code></pre>