Nice input placeholder (http://jsfiddle.net/NjSv7/) http://blog.circleci.com/adaptive-placeholders/

example.html

<div class="inner">
    <br /><br /><br />
    <input type="email" required="" />
    <label placeholder="Token"></label>
</div>

input.css

input[type="text"],input[type="email"]{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;outline:none;height:calc(3em + 2px);width:100%;margin:0 0 1em;padding:1em;border:1px solid #cccccc;background:#fbfbfb;border-radius:1.5em;resize:none;box-shadow:none !important;}input[type="text"][required]:focus,input[type="email"][required]:focus{border-color:#00bafa !important;}input[type="text"][required]:focus+label[placeholder]:before,input[type="email"][required]:focus+label[placeholder]:before{color:#00bafa;}
input[type="text"][required]:focus+label[placeholder]:before,input[type="email"][required]:focus+label[placeholder]:before,input[type="text"][required]:valid+label[placeholder]:before,input[type="email"][required]:valid+label[placeholder]:before{transition-duration:.2s;-webkit-transform:translate(0, -1.1em) scale(0.9, 0.9);transform:translate(0, -1.1em) scale(0.9, 0.9);}
input[type="text"][required]:invalid+label[placeholder][alt]:before,input[type="email"][required]:invalid+label[placeholder][alt]:before{content:attr(alt);}
input[type="text"][required]:invalid+label[placeholder][itemprop]:before,input[type="email"][required]:invalid+label[placeholder][itemprop]:before{content:attr(itemprop) " " attr(placeholder);}
input[type="text"][required]+label[placeholder],input[type="email"][required]+label[placeholder]{display:block;pointer-events:none;line-height:1em;margin-top:calc(-2.2em - 2px);margin-bottom:calc((3em - 1em) + 2px);}input[type="text"][required]+label[placeholder]:before,input[type="email"][required]+label[placeholder]:before{content:attr(placeholder);display:inline-block;margin:0 calc(1em + 2px);padding:0 2px;color:#898989;white-space:nowrap;transition:0.3s ease-in-out;background-image:linear-gradient(to bottom, #fbfbfb, #fbfbfb);background-size:100% 5px;background-repeat:no-repeat;background-position:center;}
textarea{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;outline:none;height:calc(13em + 2px);width:100%;margin:0 0 1em;padding:1em;border:1px solid #cccccc;background:#fbfbfb;border-radius:3px;resize:none;box-shadow:none !important;}textarea[required]:focus{border-color:#00bafa !important;}textarea[required]:focus+label[placeholder]:before{color:#00bafa;}
textarea[required]:focus+label[placeholder]:before,textarea[required]:valid+label[placeholder]:before{transition-duration:.2s;-webkit-transform:translate(0, -1.5em) scale(0.9, 0.9);transform:translate(0, -1.5em) scale(0.9, 0.9);}
textarea[required]:invalid+label[placeholder][alt]:before{content:attr(alt);}
textarea[required]:invalid+label[placeholder][itemprop]:before{content:attr(itemprop) " " attr(placeholder);}
textarea[required]+label[placeholder]{display:block;pointer-events:none;line-height:1em;margin-top:calc(-13em - 2px);margin-bottom:calc((13em - 1em) + 2px);}textarea[required]+label[placeholder]:before{content:attr(placeholder);display:inline-block;margin:0 calc(1em + 2px);padding:0 2px;color:#898989;white-space:nowrap;transition:0.3s ease-in-out;background-image:linear-gradient(to bottom, #fbfbfb, #fbfbfb);background-size:100% 5px;background-repeat:no-repeat;background-position:center;}