:root{--background: #151515;--colorFont: #fff;--secondColorFont: #bbbaba}html,body{height:100%;margin:0;font-family:Handlee;font-size:14px}body{background:var(--background);color:var(--colorFont);overflow:hidden}.background{position:fixed;width:192%;rotate:9deg;top:-80px}app-root{display:flex;flex-direction:column;justify-content:center;height:100%}header{position:relative;color:var(--colorFont);margin-bottom:1rem;box-shadow:0 0 .4rem .1rem #7b7b7b;padding:0;border-bottom:1px solid #8a8686}header button{background:none;border:0;position:absolute;right:1em;top:0;bottom:0;cursor:pointer}header button img{width:1.6rem}h1{margin-top:.9rem;position:relative;font-size:1.7rem;margin-left:1rem;text-align:center;margin-bottom:.4rem}h1>img{height:2.7rem}h2{text-align:center;font-size:1rem;font-weight:600;border-bottom:2px solid var(--colorFont);padding:.3rem .7rem;color:var(--colorFont);margin-left:auto;margin-right:auto;margin-bottom:1.1rem;width:fit-content}menu{position:fixed;display:flex;flex-direction:column;justify-content:space-between;right:-100%;top:0;bottom:0;background:var(--background);margin:0;padding:0;box-shadow:0 0 .8rem .5rem #272728;border-left:1px solid #666666;transition:right .4s;width:19rem;z-index:1}menu.show{right:0%}menu ul{padding:0;list-style-type:none}menu ul.ul{margin-top:4rem}menu ul li{padding:.8rem 1rem;text-align:center;cursor:pointer}menu ul li~li{border-top:1px solid}menu .connection strong{display:block;margin-bottom:.8rem}menu .connection input{margin-top:.5rem;width:100%}menu .connection button{margin-top:1rem;width:100%;padding:.6rem 0;border-radius:.3rem;border:0}main{display:flex;flex-direction:column;margin-top:1rem;flex-grow:1;overflow:auto}.notif{position:fixed;bottom:1rem;border-radius:1rem;padding:.3rem 1rem;background:#a7a7a77a;left:0;right:0;margin:auto;width:fit-content;font-size:.8rem}.notif.error{background:#ff000070}.goBack{text-decoration:underline;cursor:pointer}input[type=text],input[type=password]{background:var(--colorFont);color:var(--background);height:2.3rem;border:0;border-radius:.3rem;padding:0 .7rem;box-sizing:border-box}.modal-bottom{position:fixed;background:var(--background);bottom:0;border-top-left-radius:3rem;border-top-right-radius:3rem;box-shadow:.1rem 0 .8rem .1rem #363535;left:0;width:100%}.modal-bottom h3{text-align:center}.modal-bottom .modal-body{padding:0 1.7rem 1rem}.inputSelect{position:relative}.inputSelect ul{display:none;list-style-type:none;margin:0;padding:0;position:absolute;z-index:1;background:#fff;width:100%;color:#000;border-radius:0 0 5px 5px;font-size:.8rem;border:1px solid grey;box-sizing:border-box;max-height:100vw;overflow:auto}.inputSelect li{padding:.8rem .4rem;box-sizing:border-box;cursor:pointer;background:#e2e2e26b}.inputSelect li.selected{background:#8188a06b}.inputSelect li~li{border-top:1px solid grey}.inputSelect li:nth-child(odd):not(.selected){background:#fff}.inputSelect.show ul{display:block}.addBtn{display:flex;cursor:pointer;position:fixed;height:fit-content;border-radius:50%;padding:0rem;bottom:21px;background:#242424f7;box-shadow:0 .1rem .3rem .2rem #3b3b3b;border:2px solid #fff;right:26px;align-items:center;width:2.8rem;justify-content:center;aspect-ratio:1}.addBtn img{width:calc(100% - 1rem)}
