.container{display:flex;flex-direction:column}.group{position:relative;margin-left:10%;margin-right:10%;width:100%;margin-bottom:30px}.group.second{margin-bottom:20px}.group button{width:80%;background-color:#f2f2f2;border:1px solid #009fd7;border-radius:2px;font-size:14px;cursor:pointer}.group span{font-size:14px;color:#999;cursor:pointer}.group span.error{color:red}input{font-size:14px;padding:10px 10px 10px 5px;display:block;border:none;width:250px;border-bottom:1px solid #757575}input:focus{outline:none}label{color:#999;font-size:14px;font-weight:normal;position:absolute;pointer-events:none;left:5px;top:10px;transition:0.2s ease all;-moz-transition:0.2s ease all;-webkit-transition:0.2s ease all}input:focus ~ label,input:valid ~ label{top:-20px;font-size:14px;color:#5264AE}.bar{position:relative;display:block;width:265px}.bar:before,.bar:after{content:'';height:2px;width:0;bottom:1px;position:absolute;background:#5264AE;transition:0.2s ease all;-moz-transition:0.2s ease all;-webkit-transition:0.2s ease all}.bar:before{left:50%}.bar:after{right:50%}input:focus ~ .bar:before,input:focus ~ .bar:after{width:50%}.highlight{position:absolute;height:60%;width:100px;top:25%;left:0;pointer-events:none;opacity:0.5}input:focus ~ .highlight{-webkit-animation:inputHighlighter 0.3s ease;-moz-animation:inputHighlighter 0.3s ease;animation:inputHighlighter 0.3s ease}@-webkit-keyframes inputHighlighter{from{background:#5264AE}to{width:0;background:transparent}}@-moz-keyframes inputHighlighter{from{background:#5264AE}to{width:0;background:transparent}}@keyframes inputHighlighter{from{background:#5264AE}to{width:0;background:transparent}}