.app{text-align:center;max-width:728px;margin:0 auto}header{background-color:#181717;height:10dvh;min-height:50px;color:#fff;position:fixed;width:100%;max-width:728px;top:0;display:flex;align-items:center;justify-content:space-between;padding:10px}button.signBtn{padding:15px 32px}img.updateProfile{border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%}header img.updateProfile{height:50px;width:50px}main{height:100dvh;overflow-y:hidden;background-color:#282535}button.sign{font-size:1.25rem}main>div.spinnerParent{position:absolute;right:1vw;bottom:10.5vh;z-index:9999}.sign-in{max-width:400px;margin:10px auto 0}#google{color:#282c34;background:white}.parent{width:100%;height:100%;display:flex;justify-content:center;align-items:center}section{padding:0 10px;height:80%;margin-top:10dvh;overflow-y:scroll}section::-webkit-scrollbar{width:.25rem}section::-webkit-scrollbar-track{background:#1e1e24}section::-webkit-scrollbar-thumb{background:#6649b8}.message{display:flex;transition:.5s linear;-webkit-transition:.5s linear;-moz-transition:.5s linear;-ms-transition:.5s linear;-o-transition:.5s linear}.message .unSendContainer{display:flex;position:relative;margin-right:10px}.message .threeDots{align-self:center;margin-bottom:10px;margin-left:5px;cursor:pointer}.message .unSend{position:absolute;border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px;-ms-border-radius:20px;-o-border-radius:20px;font-size:.75rem;left:-85px;bottom:65%;padding:10px 15px}.sent{flex-direction:row-reverse}.message.deleted{opacity:0}.message a{display:inline}.sent p{color:#fff;background:#0b93f6;align-self:flex-end}.received p{background:#e5e5ea;color:#000}img.user{width:40px;height:40px;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%}img.messageImg{width:150px;height:150px}.scroll{margin-top:50px}form.messageForm{height:10%;background-color:#181717;width:100%;max-width:728px;display:flex;font-size:1.2rem}form.messageForm input{border-radius:0;-webkit-border-radius:0;-moz-border-radius:0;-ms-border-radius:0;-o-border-radius:0}form.messageForm button{width:20%;background-color:#38388f}button:disabled{opacity:.5;cursor:not-allowed}form .displayImg{align-self:center;width:80px;height:60px;transition:.5s linear;-webkit-transition:.5s linear;-moz-transition:.5s linear;-ms-transition:.5s linear;-o-transition:.5s linear}form>div{position:relative}form .xIcon{position:absolute;top:-10px;right:-10px;z-index:12432;width:20px;height:20px;background:white;border-radius:50%}form .imgInput{padding:0}form.updateProfileForm button.updateProfilePicture{border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%}form.updateProfileForm button.updateProfilePicture{padding:0}form.updateProfileForm img{transition:.3s linear;-webkit-transition:.3s linear;-moz-transition:.3s linear;-ms-transition:.3s linear;-o-transition:.3s linear}form.updateProfileForm button.updateProfilePicture,form.updateProfileForm img{width:150px;height:150px;margin:0}form.updateProfileForm button.updateProfilePicture:hover img{opacity:.5}form p.displayName{text-align:center;margin:10px auto 0;width:fit-content;font-weight:700;font-size:1.6rem;letter-spacing:1px}form button.updateProfileBtn{padding:20px 25px;text-transform:uppercase;margin-top:20px;font-size:1.3rem}*{box-sizing:border-box;margin:0;padding:0;font-family:Arial,Helvetica,sans-serif}html,body{overflow-y:hidden}body{background-color:#282c34}a{text-decoration:none;color:#1a0dab}img{user-select:none;margin:2px 5px}ul,li{text-align:left;list-style:none}p{max-width:500px;margin-bottom:12px;line-height:24px;padding:10px 20px;border-radius:25px;position:relative;color:#fff;text-align:center}input{line-height:1.5;width:100%;font-size:1.5rem;background:rgb(58,58,58);color:#fff;outline:none;border:none;padding:0 10px}button{background-color:#282c34;border:none;color:#fff;text-align:center;text-decoration:none;display:inline-block;cursor:pointer}.spinnerContainer{min-height:100vh;display:flex;justify-content:center;align-items:center}.spinner{border:2px solid blue;border-right-color:transparent;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%;-ms-border-radius:50%;-o-border-radius:50%;animation:spin 1s 0s linear infinite;-webkit-animation:spin 1s 0s linear infinite}.spinner.small{width:40px;height:40px}.spinner.big{width:200px;height:200px}@keyframes spin{0%{transform:rotate(0);-webkit-transform:rotate(0);-moz-transform:rotate(0);-ms-transform:rotate(0);-o-transform:rotate(0)}25%{transform:rotate(90deg);-webkit-transform:rotate(90deg);-moz-transform:rotate(90deg);-ms-transform:rotate(90deg);-o-transform:rotate(90deg)}50%{transform:rotate(180deg);-webkit-transform:rotate(180deg);-moz-transform:rotate(180deg);-ms-transform:rotate(180deg);-o-transform:rotate(180deg)}75%{transform:rotate(270deg);-webkit-transform:rotate(270deg);-moz-transform:rotate(270deg);-ms-transform:rotate(270deg);-o-transform:rotate(270deg)}to{transform:rotate(360deg);-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-ms-transform:rotate(360deg);-o-transform:rotate(360deg)}}#root{position:fixed;left:50%;width:100%;transform:translate(-50%)}