body{background:url(http://lk.soft-one.net/dist/alumno/images/fondo.jpg);text-align:center;font-family:'Roboto',sans-serif;background-position:center;background-size:cover;background-repeat:no-repeat;height:100%}.panda{position:relative;width:200px;margin:50px auto}.face{width:200px;height:200px;background:#fff;border-radius:100%;margin:50px auto;box-shadow:0 10px 15px rgba(0,0,0,.15);z-index:50;position:relative}.ear,.ear:after{position:absolute;width:80px;height:80px;background:#000;z-index:5;border:10px solid #fff;left:-15px;top:-15px;border-radius:100%}.ear:after{content:'';left:125px}.eye-shade{background:#000;width:50px;height:80px;margin:10px;position:absolute;top:35px;left:25px;-webkit-transform:rotate(220deg);transform:rotate(220deg);border-radius:25px/20px 30px 35px 40px}.eye-shade.rgt{-webkit-transform:rotate(140deg);transform:rotate(140deg);left:105px}.eye-white{position:absolute;width:30px;height:30px;border-radius:100%;background:#fff;z-index:500;left:40px;top:80px;overflow:hidden}.eye-white.rgt{right:40px;left:auto}.eye-ball{position:absolute;width:0;height:0;left:20px;top:20px;max-width:10px;max-height:10px;-webkit-transition:.1s;transition:.1s}.eye-ball:after{content:'';background:#000;position:absolute;border-radius:100%;right:0;bottom:0;width:20px;height:20px}.nose{position:absolute;height:20px;width:35px;bottom:40px;left:0;right:0;margin:auto;border-radius:50px 20px/30px 15px;-webkit-transform:rotate(15deg);transform:rotate(15deg);background:#000}.body{background:#fff;position:absolute;top:200px;left:-20px;border-radius:100px 100px 100px 100px/126px 126px 96px 96px;width:250px;height:282px;box-shadow:0 5px 10px rgba(0,0,0,.3)}.hand,.hand:after,.hand:before{width:40px;height:30px;border-radius:50px;box-shadow:0 2px 3px rgba(0,0,0,.15);background:#000;margin:5px;position:absolute;top:70px;left:-25px}.hand:after,.hand:before{content:'';left:-5px;top:11px}.hand:before{top:26px}.hand.rgt,.rgt.hand:after,.rgt.hand:before{left:auto;right:-25px}.hand.rgt:after,.hand.rgt:before{left:auto;right:-5px}.foot{top:360px;left:-80px;position:absolute;background:#000;z-index:1400;box-shadow:0 5px 5px rgba(0,0,0,.2);border-radius:40px 40px 39px 40px/26px 26px 63px 63px;width:82px;height:120px}.foot:after{content:'';width:55px;height:65px;background:#222;border-radius:100%;position:absolute;bottom:10px;left:0;right:0;margin:auto}.foot .finger,.foot .finger:after,.foot .finger:before{position:absolute;width:25px;height:35px;background:#222;border-radius:100%;top:10px;right:5px}.foot .finger:after,.foot .finger:before{content:'';right:30px;width:20px;top:0}.foot .finger:before{right:55px;top:5px}.foot.rgt{left:auto;right:-80px}.foot.rgt .finger,.foot.rgt .finger:after,.foot.rgt .finger:before{left:5px;right:auto}.foot.rgt .finger:after{left:30px;right:auto}.foot.rgt .finger:before{left:55px;right:auto}form{display:none;max-width:400px;padding:20px 40px;background:#fff;height:300px;margin:auto;display:block;box-shadow:0 10px 15px rgba(0,0,0,.15);-webkit-transition:.3s;transition:.3s;position:relative;-webkit-transform:translateY(-100px);transform:translateY(-100px);z-index:500;border:1px solid #eee}form.up{-webkit-transform:translateY(-180px);transform:translateY(-180px)}h1{color:#ff4081;font-family:'Dancing Script',cursive}.btn{background:#fff;padding:5px;width:150px;height:35px;border:1px solid #ff4081;margin-top:25px;cursor:pointer;-webkit-transition:.3s;transition:.3s;box-shadow:0 50px #ff4081 inset;color:#fff}.btn:hover{box-shadow:0 0 #ff4081 inset;color:#ff4081}.btn:focus{outline:none}.form-group{position:relative;font-size:15px;color:#666}.form-group+.form-group{margin-top:30px}.form-group .form-label{position:absolute;z-index:1;left:0;top:5px;-webkit-transition:.3s;transition:.3s}.form-group .form-control{width:100%;position:relative;z-index:3;height:35px;background:none;border:none;padding:5px 0;-webkit-transition:.3s;transition:.3s;border-bottom:1px solid #777;color:#555}.form-group .form-control:invalid{outline:none}.form-group .form-control:focus,.form-group .form-control:valid{outline:none;box-shadow:0 1px #ff4081;border-color:#ff4081}.form-group .form-control:focus+.form-label,.form-group .form-control:valid+.form-label{font-size:12px;color:#ff4081;-webkit-transform:translateY(-15px);transform:translateY(-15px)}.alert{position:absolute;color:red;font-size:16px;right:-180px;top:-300px;z-index:200;padding:30px 25px;background:#fff;box-shadow:0 3px 5px rgba(0,0,0,.2);border-radius:50%;opacity:0;-webkit-transform:scale(0,0);transform:scale(0,0);-moz-transition:linear .4s .6s;-o-transition:linear .4s .6s;-webkit-transition:linear .4s;-webkit-transition-delay:.6s;-webkit-transition:linear .4s .6s;transition:linear .4s .6s}.alert:after,.alert:before{content:'';position:absolute;width:25px;height:25px;background:#fff;left:-19px;bottom:-8px;box-shadow:0 2px 5px rgba(0,0,0,.2);border-radius:50%}.alert:before{width:15px;height:15px;left:-35px;bottom:-25px}.wrong-entry{-webkit-animation:wrong-log .3s;animation:wrong-log .3s}.wrong-entry .alert{opacity:1;-webkit-transform:scale(1,1);transform:scale(1,1)}@-webkit-keyframes eye-blink{to{height:30px}}@keyframes eye-blink{to{height:30px}}@-webkit-keyframes wrong-log{0%,100%{left:0}20%,60%{left:20px}40%,80%{left:-20px}}@keyframes wrong-log{0%,100%{left:0}20%,60%{left:20px}40%,80%{left:-20px}}.loader1{position:absolute;top:0;left:0;width:100%;height:100%;background:rgba(63,81,181,.94);z-index:100000}.loader-walk{width:100px;height:40px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);transform:translate(-50%,-50%)}.loader-walk>div{content:"";width:20px;height:20px;background:#2196f3;border-radius:100%;position:absolute;-webkit-animation:animate 2s linear infinite;animation:animate 2s linear infinite}.loader-walk>div:nth-of-type(1){-webkit-animation-delay:-.4s;animation-delay:-.4s}.loader-walk>div:nth-of-type(2){-webkit-animation-delay:-.8s;animation-delay:-.8s}.loader-walk>div:nth-of-type(3){-webkit-animation-delay:-1.2s;animation-delay:-1.2s}.loader-walk>div:nth-of-type(4){-webkit-animation-delay:-1.6s;animation-delay:-1.6s}@-webkit-keyframes animate{0%{left:100px;top:0}80%{left:0;top:0}85%{left:0;top:-20px;width:20px;height:20px}90%{width:40px;height:15px}95%{left:100px;top:-20px;width:20px;height:20px}100%{left:100px;top:0}}@keyframes animate{0%{left:100px;top:0}80%{left:0;top:0}85%{left:0;top:-20px;width:20px;height:20px}90%{width:40px;height:15px}95%{left:100px;top:-20px;width:20px;height:20px}100%{left:100px;top:0}}