@import url(https://fonts.googleapis.com/css?family=Raleway:400,700);body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td{margin:0;padding:0}img{border:0}a{text-decoration:none;outline:0}BODY{margin:0 auto;padding:0;color:#fff;background-color:#444;font:16px 'Raleway',Arial,sans-serif;font-weight:400}#container{width:100%;height:100%;text-align:center}.intro{display:block;width:500px;padding:0 0 40px 0;background-color:#f2f2f2;border-radius:5px;border:2px solid #ccc;margin:0 auto;position:relative;box-shadow:0 0 15px 0 #222;z-index:1}.logo{margin:30px 0}A.t_netbull{display:block;width:174px;position:absolute;bottom:2%;left:50%;margin-left:-87px;z-index:0}.txt{padding:20px;color:#757575;background-color:#FFF;margin-bottom:30px;border-top-left-radius:5px;border-top-right-radius:5px}.card .input-container{position:relative;margin:0 60px 50px}.card .input-container input{outline:0;z-index:1;position:relative;background:0;width:100%;height:60px;border:0;color:#444;font-size:24px;font-weight:400}.card .input-container input:focus ~ label{color:#9d9d9d;-webkit-transform:translate(-12%,-75%) scale(0.75);transform:translate(-12%,-75%) scale(0.75)}.card .input-container input:focus ~ .bar:before,.card .input-container input:focus ~ .bar:after{width:50%}.card .input-container input:valid ~ label{color:#9d9d9d;-webkit-transform:translate(-12%,-75%) scale(0.75);transform:translate(-12%,-75%) scale(0.75)}.card .input-container label{position:absolute;top:0;left:0;color:#757575;font-size:24px;font-weight:400;line-height:60px;-webkit-transition:.2s ease;transition:.2s ease}.card .input-container label.error,.card .input-container input ~ label.error{line-height:110%;color:red}.card .input-container .bar{position:absolute;left:0;bottom:0;background:#757575;width:100%;height:1px}.card .input-container .bar:before,.card .input-container .bar:after{content:'';position:absolute;background:#09f;width:0;height:2px;-webkit-transition:.2s ease;transition:.2s ease}.card .input-container .bar:before{left:50%}.card .input-container .bar:after{right:50%}.card .button-container{margin:0 60px;text-align:center}.card .button-container button{outline:0;cursor:pointer;position:relative;display:inline-block;background:0;width:240px;border:2px solid #757575;border-radius:5px;padding:10px 0;font-size:20px;font-weight:700;line-height:1;overflow:hidden;-webkit-transition:.3s ease;transition:.3s ease}.card .button-container button span{position:relative;z-index:1;color:#757575;-webkit-transition:.3s ease;transition:.3s ease}.card .button-container button:before{content:'';position:absolute;top:50%;left:50%;display:block;background:#09f;width:30px;height:30px;border-radius:100%;margin:-15px 0 0 -15px;opacity:0;-webkit-transition:.3s ease;transition:.3s ease}.card .button-container button:hover,.card .button-container button:active,.card .button-container button:focus{border-color:#09f}.card .button-container button:hover span,.card .button-container button:active span,.card .button-container button:focus span{color:#09f}.card .button-container button:active span,.card .button-container button:focus span{color:#fff}.card .button-container button:active:before,.card .button-container button:focus:before{opacity:1;-webkit-transform:scale(10);transform:scale(10)}.error{color:red;padding:20px 10px;margin-bottom:30px;margin-top:-30px;display:block;background-color:#f2f2f2;font-weight:700}#welcome{text-align:center}@media only screen and (max-width:959px){.intro{width:100%}INPUT,LABEL{width:90%;margin-left:5%}INPUT{width:86%;margin-bottom:10px;padding:5px 2%}LABEL{float:none;text-align:left}A.t_netbull{width:100%;left:0;position:static}}
