body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.App{background-color:#f0f2f5;display:flex;flex-wrap:wrap;height:100vh;width:100vw}@media only screen and (max-width:430px){.App{display:flex;margin-right:0}}.sidebar{background-color:#f0f2f5;flex-direction:column;height:100%;width:250px}.sidebar,.top-section{align-items:center;display:flex}.top-section{flex-wrap:wrap;font-weight:700;justify-content:space-between;margin-top:4%;text-decoration:underline;width:100%}.top-section .head{height:30px;margin-left:7%;width:30px}.top-section .head img{border-radius:50%;height:100%;width:100%}.top-section .logo img{margin-left:10px;margin-right:10px}.top-section .name{font-size:10px;font-weight:800;position:relative;right:30px}.sidebar input{align-items:center;border:1px solid #f0f2f5;border-radius:8px;font-family:inter;font-size:12px;font-weight:400;height:42px;line-height:130%;margin-top:10px;width:80%}.sidebar .pinned{height:15%;margin-top:20px;overflow-y:scroll;scrollbar-width:none;width:70%}.pinned .box h1{color:#666f8d;font-size:13px;font-weight:500;margin-bottom:20px;margin-left:0}.sidebar button{background-color:#174bd2;border:1px solid #1b5ac2;border-radius:8px;color:#fff;font-family:sans-serif;font-weight:500;height:35px;position:relative;right:20px;top:200px;width:150%}.sidebar h4{color:#bac0cc;margin:0;position:relative;right:60px;top:25px}#checking{display:none}@media only screen and (max-width:430px){.sidebar{display:flex;height:80%;left:-110%;margin:90px 20px 20px 25px;position:relative;position:fixed;transition:all .5s ease;width:90%;z-index:1}.top-section .name{font-size:10px;font-weight:800;position:relative;right:80px}.sidebar .pinned{height:25%;margin-top:20px;overflow-y:scroll;scrollbar-width:none;width:70%}.sidebar button{background-color:#174bd2;border:1px solid #1b5ac2;border-radius:8px;color:#fff;font-family:sans-serif;font-weight:500;height:35px;position:relative;right:40px;top:70px;width:180%}#checking:checked~.sidebar{left:0}#checking:checked~.home{filter:blur(1px)}}.home{background-color:#fff;border:1px solid #f0f2f5;border-radius:16px;flex-direction:column;height:98%;margin:10px 0 10px 15px;width:80%}.home,.home .header{align-items:center;display:flex}.home .header{border-bottom:1px solid #e3e6ea;flex-wrap:wrap;height:10%;justify-content:space-between;width:100%}.home .left input{border:1px solid #f0f2f5;border-radius:7px;height:30px}.home .left h2{font-weight:500}.home .cross{display:none}.home .middle{border:1px solid #e3e6ea;border-radius:10px;height:180px;margin-top:3%;width:65%}.middle .greet h1{color:#19213d;font-size:22px;font-weight:500;margin-bottom:0;text-align:center}.greet h3{color:#666f8d;font-size:14px;font-weight:400;margin:0;text-align:center}.middle .chatbox{margin-top:30px;text-align:center}.chatbox input{border:2px solid #f0f2f5;border-radius:10px;font-size:15px;font-weight:400;height:58px;padding:10px;text-align:left;width:400px}.chatbox input::placeholder{color:#666f8d}.chatbox .icon{font-size:23px;margin-left:5px}.home .bottom{height:40%;margin-top:10px;width:70%}.bottom .upper{display:flex;flex-wrap:wrap;justify-content:space-between}.upper .heading{color:#666f8d;font-size:16px;font-weight:500;margin-left:10px}.upper .function{align-items:center;display:flex;flex-wrap:wrap;font-weight:700;gap:10px;justify-content:center;margin-right:20px}.function input{border:1px solid #f0f2f5;border-radius:10px;font-weight:700;height:40px;text-align:center;width:266px}.bottom .lower{display:flex;flex-direction:column;height:95%;overflow-y:scroll;scrollbar-width:none;width:100%}.lower h4{color:#19213d;font-size:14px;font-weight:500;margin:0 0 0 20px}.lower .dates{align-items:center;border:1px solid #e3e6ea;border-radius:10px;display:flex;height:40px;justify-content:space-between;margin-bottom:20px}.dates h3{color:#19213d;font-size:13px;font-weight:400;margin-right:20px}.dates h3 .pinned{font-size:15px;left:8px;position:relative}@media only screen and (max-width:430px){.home{height:100%;margin:0;width:100%}.home .header{margin-top:10px}.right .menu{display:inline;font-size:20px;margin-right:10px}.right button{margin-right:0}.home .middle{width:80%}.middle .greet h1{font-size:25px;margin-top:20px}.middle .greet h3{font-size:15px;margin-top:5px}.middle .chatbox input{margin-top:0;width:70%}.home .bottom{height:50%;width:90%}.bottom .upper h2{font-size:20px}.upper .function input{width:50%}.upper .function{margin-right:0}.lower .dates .pinned{font-size:15px;padding:10px}}.header{border-bottom:1px solid #e3e6ea;flex-wrap:wrap;height:10%;justify-content:space-between;width:100%}.header,.header .left{align-items:center;display:flex}.header .left{gap:20px;justify-content:space-evenly;margin-left:10px}.header .left h2{font-weight:500}.left input{border:1px solid #f0f2f5;border-radius:7px;height:30px}.right button{background-color:#213bfd;border:1px solid #174bd2;border-radius:10px;color:#fff;height:35px;margin-right:20px}.right .menu{display:none}@media only screen and (max-width:430px){.header{gap:5px;justify-content:left;margin-top:10px}.right .menu{display:inline;font-size:20px;margin-right:10px}.right button{margin-right:0}}.main{align-items:center;background-color:#fff;border:1px solid #f0f2f5;flex-direction:column;height:95%;margin-left:10px;margin-top:15px;width:80%}.main,.main .chats{border-radius:10px;display:flex}.main .chats{flex-direction:column-reverse;height:75%;margin-top:5px;overflow-y:scroll;scrollbar-width:none;width:65%}.main .chats h4{background-color:blue;border-radius:15px;font-size:20px;margin-left:auto;margin-top:0;padding:8px;text-align:right}.main .chats h4 spam{font-size:10px;margin-left:10px}.main .input{align-items:center;display:flex;height:12%;justify-content:space-evenly;margin-top:10px;width:60%}.input textarea{border:2px solid #f0f2f5;border-radius:10px;font-size:20px;height:60%;line-height:1.5;padding:7px;width:70%}textarea::placeholder{color:#666f8d;font-family:serif}.input .send{font-size:25px;position:relative;right:40px}.input textarea:active{scale:1.2}.input .send:active{scale:1.5}@media only screen and (max-width:430px){.main{height:96%;margin-left:0;margin-top:5px;width:100%}.main .chats{width:85%}.main .input{width:95%}.main textarea{box-shadow:2px 2px 7px 2px}.main .input .send{right:10px}}
/*# sourceMappingURL=main.c57869fb.css.map*/