@import url(https://fonts.googleapis.com/css2?family=Pacifico&display=swap);@import url(https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap);*{box-sizing:border-box;letter-spacing:.8px}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}:root{--title-font:Pacifico,cursive;--text-font:Poppins,sans-serif;--text-color:#d7d7d7;--app-color-1:#071e22;--app-color-2:#09262c;--app-color-3:#0b3137;--app-color-4:#f4c095}.app{align-items:center;background-color:#071e22;background-color:var(--app-color-1);display:flex;height:100vh;justify-content:center;padding:16px 200px 32px}@media screen and (max-width:1400px){.app{padding:0}}.explore{align-items:center;background-color:var(--app-color-3);border-radius:8px;color:var(--app-color-4);cursor:pointer;display:flex;font-family:var(--text-font);font-size:20px;font-weight:560;height:52px;justify-content:center;margin-bottom:12px;width:100%}.explore:hover{background-color:var(--app-color-2)}.left-card{display:flex;flex-direction:column;height:100%;margin-right:12px;width:360px}.friends-container{background-color:var(--app-color-3);border-radius:8px;flex-grow:1;font-family:var(--text-font);overflow-y:auto}.friends-container h3{color:var(--text-color);font-size:24px;font-weight:560;margin:20px auto 12px;padding-left:32px}.friend-card{align-items:center;color:var(--text-color);cursor:pointer;display:flex;margin:0;padding:8px 0 8px 32px}.friend-card img{border:1px solid #000;border-radius:50%;height:36px;margin-right:12px;width:36px}.divider{background-color:#000;display:flex;height:.6px;margin:auto;width:80%}.friend-card-container:hover{background-color:var(--app-color-2)}.chat-container{display:flex;flex-direction:column;height:100%;width:100%}.chat-title{align-items:center;background-color:var(--app-color-2);display:flex;height:64px;width:100%}.chat-title img{border:1px solid #000;border-radius:50%;height:40px;margin:0 20px;width:40px}.chat-title h5{color:var(--text-color);font-family:var(--text-font);font-size:20px;font-weight:560;padding-top:4px}.chat-title button{background-color:var(--text-color);border:none;border-radius:4px;color:var(--app-color-1);font-size:12px;font-weight:400;height:30px;margin-left:auto;margin-right:50px;width:100px}.chat-body{background-color:var(--app-color-3);display:flex;flex-direction:column-reverse;flex-grow:1;overflow-y:auto;padding:20px 40px}.chat-message{background-color:var(--app-color-2);border-radius:20px;color:var(--text-color);font-family:var(--text-font);font-size:16px;font-weight:400;margin:4px;max-width:600px;overflow-wrap:break-word;padding:8px 12px}.float-right{float:right}.float-left{float:left}.bottom-margin-less{margin-bottom:0}.bottom-margin-more{margin-bottom:20px}.keyboard{background-color:var(--app-color-2);height:70px;justify-content:center;width:100%}.keyboard,.keyboard form{align-items:center;display:flex}.keyboard form{width:90%}.keyboard form textarea{background-color:var(--app-color-1);border:none;border-radius:4px;color:var(--text-color);display:flex;flex-grow:1;font-family:var(--text-font);font-size:12px;height:34.5px;margin-right:20px;padding-left:12px;padding-top:6.5px;resize:none;text-decoration:none}.keyboard form textarea:focus{outline:none}.keyboard form textarea::placeholder{color:var(--text-color);opacity:.5}.keyboard form button{background-color:var(--app-color-4);border:none;border-radius:4px;font-size:16px;height:32px;padding-top:4px;width:52px}.chats-page,.explore-page{height:100%;width:100%}.explore-page{align-items:center;background-color:var(--app-color-3);display:flex;justify-content:center}.explore-page img{background-color:var(--app-color-4);border-radius:50%;cursor:pointer;height:150px;width:150px}.profile-page{align-items:center;background-color:var(--app-color-3);height:100%;width:100%}.profile,.profile-page{display:flex;flex-direction:column;justify-content:center}.profile img{border:1px solid #000;border-radius:50%;height:200px;margin:auto;width:200px}.profile h3{color:var(--text-color);font-family:var(--text-font);font-size:50px;font-weight:300;margin-top:20px;text-align:center}.right-card{border-radius:8px;flex-grow:1;height:100%;overflow:hidden}.title{align-items:center;cursor:pointer;display:flex;font-family:var(--title-font);height:100%;justify-content:center;letter-spacing:2px;width:100%}.title-home{color:var(--text-color);font-size:28px}.title-login{color:var(--app-color-4);font-size:40px}.title-bar{display:flex;padding-bottom:32px}.nav-bar{display:flex;list-style-type:none;margin-left:auto}.focus{color:var(--app-color-4)}.not-focus{color:var(--text-color)}.nav-bar-items{cursor:pointer;font-family:var(--text-font);font-size:12px;padding-left:32px}.home{display:flex;flex-direction:column;height:100%;width:100%}.home-body{display:flex;flex-direction:row;flex-grow:1}.login-container{align-items:center;background-color:var(--app-color-3);border-radius:8px;display:flex;font-family:var(--text-font);height:400px;justify-content:center;width:350px}.login-form{display:flex;flex-direction:column;height:75%;justify-content:space-between;width:80%}.login-title{color:var(--app-color-4);height:96px}.login-form input{background-color:var(--app-color-2);border:none;border-radius:8px;height:40px;padding-left:8px}.login-form input,.login-form input::placeholder{color:var(--text-color)}.login-form input:focus{outline:none}.login-form input:nth-child(2){margin-top:20px}.button-container{display:flex;justify-content:space-between}.button-container button{background-color:var(--app-color-4);border:none;border-radius:4px;cursor:pointer;font-family:var(--text-font);font-size:12px;font-weight:520;height:28px;padding:4px 12px}.container{background-color:var(--app-color-1);height:100%;width:100%}.container,.holder{align-items:center;display:flex;justify-content:center}.holder{background-color:var(--app-color-2);flex-direction:column;padding:40px 20px;width:80%}.holder img{height:100px;margin-bottom:20px;margin-top:40px;width:100px}.holder p{color:var(--text-color);text-align:center}
/*# sourceMappingURL=main.1674023b.css.map*/