.header .user-info,.note-header .user-info{opacity:1;flex-direction:row;justify-content:center;align-items:center;width:auto;min-width:50px;height:50px;display:flex}.header .user-info.hide,.note-header .user-info.hide{opacity:0}.header .user-info .btn-log,.note-header .user-info .btn-log{cursor:pointer;background-color:#fff;border-radius:20px;flex-direction:row;justify-content:center;align-items:center;gap:10px;width:120px;height:30px;padding:0 10px 0 30px;font-size:11pt;transition:all .3s ease-in-out;display:flex;position:relative;box-shadow:0 0 2px #004cff80}.header .user-info .btn-log:hover,.note-header .user-info .btn-log:hover,.header .user-info .btn-log:active,.note-header .user-info .btn-log:active{background-color:#fefefe}.header .user-info .btn-log:before,.note-header .user-info .btn-log:before{content:"";background-color:#fff;background-image:url(../media/user_avatar_check.0k._~wr3agu.f.svg);background-position:50%;background-repeat:no-repeat;background-size:22px;border-radius:50%;width:30px;height:30px;transition:all .3s ease-in-out;position:absolute;top:0;left:0}.header .user-info .btn-log.in,.note-header .user-info .btn-log.in{min-width:120px}.header .user-info .btn-log.in.login-ing,.note-header .user-info .btn-log.in.login-ing{padding:0 30px 0 10px;animation:1s ease-in-out infinite alternate loading-fade}.header .user-info .btn-log.in.login-ing:before,.note-header .user-info .btn-log.in.login-ing:before{left:90px}.header .user-info .btn-log.in:before,.note-header .user-info .btn-log.in:before{background-color:#eee;background-image:url(../media/google_circle.15q3ubixw_19x.svg);background-size:contain}.header .user-info .btn-log.out,.note-header .user-info .btn-log.out{border-radius:50%;width:30px;min-width:3px;padding:0}.header .user-info .btn-log.out:before,.note-header .user-info .btn-log.out:before{display:none}.header .user-info .btn-log.out,.note-header .user-info .btn-log.out{background-color:#afeeff;background-image:url(../media/user_avatar_check.0k._~wr3agu.f.svg);background-position:0;background-repeat:no-repeat;background-size:contain;transition:all .3s ease-in-out;box-shadow:0 0 2px #004cff80}.header .user-info .btn-log.out:hover,.note-header .user-info .btn-log.out:hover{box-shadow:0 0 3px #004cffb3}.header .user-info .btn-log.out:hover:after,.note-header .user-info .btn-log.out:hover:after{color:#fff;background-color:#90b;border-radius:50%;flex-direction:column;justify-content:center;align-items:center;width:100%;height:100%;font-size:15pt;font-weight:500;display:flex;top:0;left:0;box-shadow:0 0 15px #004cffb3}.header .user-info .btn-log.out:active,.note-header .user-info .btn-log.out:active{box-shadow:0 0 2px #004cff80}.header .user-info .btn-log .userinfo-container,.note-header .user-info .btn-log .userinfo-container{cursor:default;background-color:#fff;border-radius:5px;width:200px;height:auto;padding:20px 20px 30px;display:none;position:absolute;top:calc(100% + 5px);right:0;box-shadow:0 0 2px 2px #0000001a}.header .user-info .btn-log .userinfo-container.active,.note-header .user-info .btn-log .userinfo-container.active{flex-direction:column;justify-content:flex-start;align-items:flex-start;gap:5px;display:flex;overflow:hidden auto}.header .user-info .btn-log .userinfo-container .list,.note-header .user-info .btn-log .userinfo-container .list{flex-direction:row;justify-content:center;align-items:center;gap:0;width:100%;height:50px;display:flex}.header .user-info .btn-log .userinfo-container .list .btn-logout,.note-header .user-info .btn-log .userinfo-container .list .btn-logout{cursor:pointer;background-color:#fff;border-radius:20px;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:130px;height:40px;padding:5px 15px 5px 45px;transition:all .3s ease-in-out;display:flex;position:relative;box-shadow:0 0 2px #004cff80}.header .user-info .btn-log .userinfo-container .list .btn-logout:hover,.note-header .user-info .btn-log .userinfo-container .list .btn-logout:hover{box-shadow:0 0 3px #004cffb3}.header .user-info .btn-log .userinfo-container .list .btn-logout:active,.note-header .user-info .btn-log .userinfo-container .list .btn-logout:active{background-color:#f2f2f2;box-shadow:0 0 2px #004cff80}.header .user-info .btn-log .userinfo-container .list .btn-logout:before,.note-header .user-info .btn-log .userinfo-container .list .btn-logout:before{content:"";background-color:#eee;background-image:url(../media/google_circle.15q3ubixw_19x.svg);background-position:50%;background-repeat:no-repeat;background-size:contain;border-radius:50%;width:40px;height:40px;transition:all .3s ease-in-out;position:absolute;top:0;left:0}.header .user-info .btn-log .userinfo-container .list .btn-logout.login-ing,.note-header .user-info .btn-log .userinfo-container .list .btn-logout.login-ing{padding:5px 45px 5px 15px}.header .user-info .btn-log .userinfo-container .list .btn-logout.login-ing:before,.note-header .user-info .btn-log .userinfo-container .list .btn-logout.login-ing:before{left:90px}.header .user-info .btn-log .userinfo-container .list .btn-logout.login-ing,.note-header .user-info .btn-log .userinfo-container .list .btn-logout.login-ing{animation:1s ease-in-out infinite alternate loading-fade}.header .user-info .btn-log .userinfo-container .ver,.note-header .user-info .btn-log .userinfo-container .ver{color:gray;font-size:10pt;font-style:italic;position:absolute;bottom:10px;right:10px}
.header a,.note-header a{width:400px;min-width:400px}.header .logo,.note-header .logo{flex-direction:row;justify-content:flex-start;align-items:center;gap:10px;width:170px;min-width:170px;height:100%;padding:0 15px;transition:all .2s ease-in-out;display:flex;position:relative}.header .logo:after,.note-header .logo:after{content:"";opacity:.15;background-color:#fff200;border:1px solid #c2b800;border-radius:50%;width:31px;height:31px;position:absolute;top:50%;left:14px;transform:translateY(-50%)}.header .logo:hover,.note-header .logo:hover{transform:scale(1.15)}.header .logo:active,.note-header .logo:active{transform:scale(1.05)}.header .logo span,.note-header .logo span{cursor:pointer;color:#0a8fb4;text-shadow:4px 4px 4px #d9d9d9;width:auto;height:auto;font-family:blue;font-size:16pt;transition:all .2s ease-in-out;position:relative}
.note-footer{color:#000;background-color:#fcfcfc;border-radius:15px;flex-direction:row;justify-content:space-between;align-items:center;gap:10px;width:100%;height:40px;padding:0 20px;display:flex;position:relative}.note-footer button.trash{cursor:pointer;width:30px;min-width:30px;height:30px;box-shadow:none;background-color:#0000;border:0;border-radius:5px;flex-direction:row;justify-content:center;align-items:center;gap:5px;padding:0;display:flex;position:absolute;top:5px;left:10px}.note-footer button.trash:hover,.note-footer button.trash:active{background-color:#f2f2f2}.note-footer button.trash:focus{outline:none}.note-footer button.trash:before{content:"";background-color:#0000;background-image:url(../media/trash.0ae1_e0q6yzb..svg);background-position:50%;background-repeat:no-repeat;background-size:24px;width:28px;height:28px;position:absolute;top:0;left:0}.note-footer .weffice-status{color:#afafaf;text-shadow:0 0 3px #fff;font-family:blue;font-size:11pt;display:none}.note-footer .weffice-status.show{display:block}.note-footer .ver{color:gray;font-size:10pt;font-style:italic}