@import url(https://fonts.googleapis.com/css?family=Indie+Flower);*,:after,:before{box-sizing:border-box}.clearfix:after,.clearfix:before{content:"";display:table}.clearfix:after{clear:both;display:block}a{color:inherit;text-decoration:none}.login-wrap{width:100%;margin:auto;max-width:400px;min-height:550px;position:relative;background:url(https://static9.depositphotos.com/1034300/1096/i/950/depositphotos_10966717-stock-photo-materials.jpg) no-repeat 50%;box-shadow:0 12px 15px 0 rgba(0,0,0,.24),0 17px 50px 0 rgba(0,0,0,.19)}.login-html{width:100%;height:100%;position:absolute;padding:90px 70px 50px 70px;background:rgba(40,57,101,.1)}.login-html .sign-in-htm,.login-html .sign-up-htm{top:0;left:0;right:0;bottom:0;position:absolute;transform:rotateY(180deg);-webkit-backface-visibility:hidden;backface-visibility:hidden;transition:all .4s linear}.login-form .group .check,.login-html .sign-in,.login-html .sign-up{display:none}.login-form .group .button,.login-form .group .label,.login-html .tab{text-transform:uppercase}.login-html .tab{font-size:22px;margin-right:15px;padding-bottom:5px;margin:0 15px 10px 0;display:inline-block;border-bottom:2px solid transparent}.login-html .sign-in:checked+.tab,.login-html .sign-up:checked+.tab{color:#fff;border-color:#000}.login-html .sign-in+.tab,.login-html .sign-up+.tab{color:#000}.login-form{min-height:345px;position:relative;perspective:1000px;transform-style:preserve-3d}.login-form .group{margin-bottom:15px}.login-form .group .button,.login-form .group .input,.login-form .group .label{width:100%;color:#fff;display:block}.login-form .group .button,.login-form .group .input{border:none;padding:15px 20px;border-radius:25px;background:hsla(0,0%,98%,.2)}.login-form .group input[data-type=password]{-webkit-text-security:circle}.login-form .group .label{color:#000;font-size:12px}.login-form .group .button{background:#19e07d}.login-form .group label .icon{width:15px;height:15px;border-radius:2px;position:relative;display:inline-block;background:hsla(0,0%,100%,.1)}.login-form .group label .icon:after,.login-form .group label .icon:before{content:"";width:10px;height:2px;background:#fff;position:absolute;transition:all .2s ease-in-out 0s}.login-form .group label .icon:before{left:3px;width:5px;bottom:6px;transform:scale(0) rotate(0)}.login-form .group label .icon:after{top:6px;right:0;transform:scale(0) rotate(0)}.login-form .group .check:checked+label{color:#fff}.login-form .group .check:checked+label .icon{background:#19e07d}.login-form .group .check:checked+label .icon:before{transform:scale(1) rotate(45deg)}.login-form .group .check:checked+label .icon:after{transform:scale(1) rotate(-45deg)}.login-html .sign-in:checked+.tab+.sign-up+.tab+.login-form .sign-in-htm,.login-html .sign-up:checked+.tab+.login-form .sign-up-htm{transform:rotate(0)}.hr{height:2px;margin:30px 0 10px 0;background:hsla(0,0%,100%,.2)}.foot-lnk{text-align:center}.foot-lnk p{color:#000}.canvas[data-v-72873956]{width:100vw;height:100vw;max-width:1260pxpx;max-height:1200px}.notepad[data-v-72873956]{position:relative;width:400px;height:550px;perspective:1000px;box-shadow:0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12),0 2px 4px -1px rgba(0,0,0,.2)}.notepad .cover[data-v-72873956],.notepad .page[data-v-72873956]{position:absolute;width:100%;height:100%;text-align:center}.notepad .cover[data-v-72873956]{transform-origin:left center;transition:2s;z-index:20;-webkit-animation:flip-data-v-72873956 6s ease-in-out 2;animation:flip-data-v-72873956 6s ease-in-out 2}.notepad .page[data-v-72873956]{background:#eee;border-right:1px solid #ccc;box-sizing:border-box}.notepad .page[data-v-72873956]:after{content:"";position:absolute;top:0;left:5%;width:90%;height:100%;background:linear-gradient(#eee,#eee 10%,#dfdfdf 0,#dfdfdf 11%,#eee 0,#eee 20%,#dfdfdf 0,#dfdfdf 21%,#eee 0,#eee 30%,#dfdfdf 0,#dfdfdf 31%,#eee 0,#eee 40%,#dfdfdf 0,#dfdfdf 41%,#eee 0,#eee 50%,#dfdfdf 0,#dfdfdf 51%,#eee 0,#eee 60%,#dfdfdf 0,#dfdfdf 61%,#eee 0,#eee 70%,#dfdfdf 0,#dfdfdf 71%,#eee 0,#eee 80%,#dfdfdf 0,#dfdfdf 81%,#eee 0,#eee 90%,#dfdfdf 0,#dfdfdf 91%,#eee 0,#eee)}.page p[data-v-72873956]{position:absolute;top:18%;left:28%;z-index:2;font-family:Georgia;line-height:1.4;font-weight:400;font-stretch:normal;font-variant:small-caps;width:0;height:135px;margin:0;font-size:40px;text-align:left;overflow:hidden;-webkit-animation:write-data-v-72873956 6s linear 2;animation:write-data-v-72873956 6s linear 2}.page.one[data-v-72873956]{z-index:4;-webkit-animation:one-data-v-72873956 6s ease-in-out infinite;animation:one-data-v-72873956 6s ease-in-out infinite}.page.one[data-v-72873956]:before{position:absolute}.page.two[data-v-72873956]{z-index:3;-webkit-animation:two-data-v-72873956 6s ease-in-out infinite;animation:two-data-v-72873956 6s ease-in-out infinite}.page.three[data-v-72873956]{z-index:2;-webkit-animation:three-data-v-72873956 6s ease-in-out infinite;animation:three-data-v-72873956 6s ease-in-out infinite}.page.four[data-v-72873956]{z-index:1;border-right-width:0}.page[data-v-72873956]:before{content:"";position:absolute;right:-7%;width:7%;height:10%;border-radius:0 0 20% 0}.page.one[data-v-72873956]:before{top:10%;background-color:#cc881b}.page.two[data-v-72873956]:before{top:20%;background-color:#49a84d}.page.three[data-v-72873956]:before{top:30%;background-color:#bf351f}.page.four[data-v-72873956]:before{top:40%;background-color:#d68384}.spiral[data-v-72873956]{position:absolute;width:20%;height:100%;left:0;display:flex;flex-direction:column;justify-content:space-around}.spiral div[data-v-72873956]{position:relative;z-index:21;width:30px;height:20px;left:-14%;background-color:transparent;border-left:7px solid red;border-top:7px solid red;border-bottom:7px solid transparent;border-right:7px solid red;border-radius:50%;transform:rotate(-30deg) skew(25deg)}.holes[data-v-72873956]{position:absolute;width:20%;height:100%;left:0;display:flex;flex-direction:column;justify-content:space-around}.holes div[data-v-72873956]{position:relative;z-index:21;width:28%;height:4%;left:3%;top:-1%;background-color:grey;border-radius:50%}@-webkit-keyframes flip-data-v-72873956{0%,30%,to{transform:rotateY(0deg)}50%,80%{transform:rotateY(-150deg)}80%{background:linear-gradient(90deg,#1a2938 15%,#1a2938 0)}}@keyframes flip-data-v-72873956{0%,30%,to{transform:rotateY(0deg)}50%,80%{transform:rotateY(-150deg)}80%{background:linear-gradient(90deg,#1a2938 15%,#1a2938 0)}}@-webkit-keyframes title-data-v-72873956{0%,40%,90%{background-color:#455d75}41%,89%{background-color:transparent}}@keyframes title-data-v-72873956{0%,40%,90%{background-color:#455d75}41%,89%{background-color:transparent}}@-webkit-keyframes draw-data-v-72873956{0%,40%,88%{transform:translate(0) rotate(0deg)}50%{transform:translate(-180px,-180px) rotate(20deg)}55%{transform:translate(-160px,-80px) rotate(20deg)}60%{transform:translate(-140px,-180px) rotate(20deg)}65%{transform:translate(-120px,-80px) rotate(20deg)}70%{transform:translate(-100px,-180px) rotate(20deg)}75%{transform:translate(-80px,-80px) rotate(20deg)}80%{transform:translate(-60px,-180px) rotate(20deg)}}@keyframes draw-data-v-72873956{0%,40%,88%{transform:translate(0) rotate(0deg)}50%{transform:translate(-180px,-180px) rotate(20deg)}55%{transform:translate(-160px,-80px) rotate(20deg)}60%{transform:translate(-140px,-180px) rotate(20deg)}65%{transform:translate(-120px,-80px) rotate(20deg)}70%{transform:translate(-100px,-180px) rotate(20deg)}75%{transform:translate(-80px,-80px) rotate(20deg)}80%{transform:translate(-60px,-180px) rotate(20deg)}}@-webkit-keyframes write-data-v-72873956{0%,52%{width:0}57%{width:20px}62%{width:40px}68%{width:60px}72%{width:80px}78%,to{width:120px}}@keyframes write-data-v-72873956{0%,52%{width:0}57%{width:20px}62%{width:40px}68%{width:60px}72%{width:80px}78%,to{width:120px}}@-webkit-keyframes one-data-v-72873956{0%,30%,to{width:100%}50%,80%{width:97%}}@keyframes one-data-v-72873956{0%,30%,to{width:100%}50%,80%{width:97%}}@-webkit-keyframes two-data-v-72873956{0%,30%,to{width:100%}50%,80%{width:98%}}@keyframes two-data-v-72873956{0%,30%,to{width:100%}50%,80%{width:98%}}@-webkit-keyframes three-data-v-72873956{0%,30%,to{width:100%}50%,80%{width:99%}}@keyframes three-data-v-72873956{0%,30%,to{width:100%}50%,80%{width:99%}}