*{box-sizing:border-box;margin:0;padding:0}.top-level{flex:0 0 0;justify-content:space-between;width:100%;height:fit-content;padding:1rem;display:flex}.groups-header{justify-content:space-between;align-items:space-between;flex-direction:row;width:100%;min-width:100px;max-width:1000px;padding:1rem;display:flex}.groups-header h2{color:#fff;border-bottom:3px solid #fff;width:fit-content}.rows{flex-direction:column;width:100%;min-width:100px;max-width:1000px;padding:1rem;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;font-size:1.5rem;display:flex}.rows div{cursor:pointer;background-color:#fff;border-radius:5px;justify-content:space-between;margin-bottom:.5rem;padding:.75rem;display:flex}.rows div:hover{background-color:#cdcbcb}a{text-decoration:none}.outer-box{background:linear-gradient(135deg,indigo,#300080);flex-direction:column;flex:1 1 0;align-items:center;padding:1rem;display:flex}.button-box{justify-content:space-between;width:100%;min-width:228px;max-width:756px;display:flex}.outer-row-box{background-color:#2e2e2e;width:100%;max-width:756px;margin:1rem}.card-row-box,.card-row-box-header{color:#fff;text-align:center;grid-template-columns:28px 1fr 1fr 28px;grid-template-rows:30px minmax(100px 350px);grid-auto-rows:minmax(100px 350px);background-color:#2e2e2e;display:grid}.card-row-box-header{background-color:#171717}.card-row-box{color:#000;background-color:#fff;max-height:65vh;overflow-y:auto}.card-row{border:2px solid #000;justify-content:center;align-items:center;padding:.5rem;display:flex}.row-del-btn{color:#fff;width:100%;height:100%;font-family:inherit;font-size:inherit;background-color:#2e2e2e;border:none;transition:background .3s}.row-del-btn button{border:2px solid #000}.row-del-btn:hover{background-color:red}.row-del-btn:active{color:#000}.add-modal{z-index:1;background-color:#0006;width:100%;height:100%;padding-top:9rem;position:fixed;top:0;left:0;overflow:auto}.modal-content{background-color:#fefefe;border:1px solid #888;border-radius:3px;flex-direction:column;width:80%;max-width:550px;margin:auto;padding:10px 20px 20px;display:flex}.content-col{flex-direction:column;gap:1rem;display:flex}.input-container{flex-direction:column;gap:.15rem;display:flex}.close{color:#aaa;float:right;align-self:flex-end;font-size:28px;font-weight:700}.close:hover,.close:focus{color:#000;cursor:pointer;text-decoration:none}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.rotatee{color:navy;justify-content:center;width:100%;height:3.14rem;font-size:2rem;font-weight:700;animation-name:rotation;animation-duration:1.1s;animation-timing-function:linear;animation-iteration-count:infinite;display:flex}.rotatee-alt{width:fit-content;font-size:2rem;font-weight:700;animation-name:rotation;animation-duration:2s;animation-timing-function:linear;animation-iteration-count:infinite}.banner{border-radius:3px;justify-content:center;align-self:center;width:100%;padding:.75rem;font-size:1.2rem;display:flex}.success{color:#007800;background-color:#8cff7f;border:2px solid #017801}.error{color:#9b0000;background-color:#faa;border:2px solid #9b0000}#root{flex-direction:column;height:100vh;display:flex}h1{font-size:2.5rem}.outer{background:linear-gradient(135deg,indigo,#300080);flex-direction:column;flex:1 1 0;align-items:center;width:100%;display:flex}.modal{background-color:#f0f8ff;border:2px solid #000;border-radius:5px;flex-direction:column;justify-self:center;place-items:center;width:100%;max-width:600px;height:fit-content;margin:20vh .5rem .5rem;padding:1rem;font-size:.75rem;display:flex}.input-box{flex-direction:column;justify-content:center;width:100%;min-width:100px;max-width:300px;padding:.75rem;display:flex}.input-box input[type=text],.input-box input[type=password]{background-color:#f0f8ff;width:100%;padding:.5rem;font-family:serif;font-size:1rem}.btn{color:#fff;cursor:pointer;background-color:navy;border-radius:6px;padding:1rem;font-family:Arial,Helvetica,sans-serif;font-size:1rem}.btn-del{color:#fff;cursor:pointer;z-index:2;background-color:#d60101;border-radius:5px;padding:.4rem;font-family:Franklin Gothic Medium,Arial Narrow,Arial,sans-serif;font-size:1rem;font-weight:700}.refresh-btn{aspect-ratio:1;cursor:pointer;background-color:#fff;border:1px solid #000;border-radius:3rem;height:auto;padding-top:.25rem;font-size:1.5rem;font-weight:1000;transition:background .3s}.refresh-btn:hover{background-color:#cbcbcb}.refresh-btn:active{color:red}