html{background-color:#282a37}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}.overlay{align-items:center;background:linear-gradient(90deg,hsla(0,0%,50%,.3),hsla(0,0%,50%,.3));display:flex;flex-direction:column;height:100vh;justify-content:center;position:fixed;top:0;width:100vw;z-index:1}.server-loading{color:#ff0;position:absolute;top:0}.signoutModal{-webkit-animation:scaleUp .5s ease-out 0s 1;animation:scaleUp .5s ease-out 0s 1;background-color:#282a37;border-radius:20px;color:#fff;padding:30px;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content}.modalHead h5{font-size:1.3rem;font-weight:400}.modalBody h6{font-size:1rem;font-weight:100;padding:10px 0}.modalFooter{display:flex;justify-content:space-evenly}.modalFooter button{color:#fff;font-weight:300}.spinner-border{color:#01acfc}@-webkit-keyframes scaleUp{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1)}}@keyframes scaleUp{0%{-webkit-transform:scale(0);transform:scale(0)}to{-webkit-transform:scale(1);transform:scale(1)}}.home-page{align-items:center;display:flex;flex-direction:column;gap:20px;height:calc(100vh - 40px);justify-content:flex-start;padding:0;width:100%}@-webkit-keyframes slideInFromLeft{0%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}@keyframes slideInFromLeft{0%{-webkit-transform:translateX(-100%);transform:translateX(-100%)}to{-webkit-transform:translateX(0);transform:translateX(0)}}.no-chats{align-items:center;background:linear-gradient(1turn,rgba(0,0,0,.2),rgba(0,0,0,.2));border-radius:20px;display:flex;flex-direction:column;justify-content:center;padding:10px}.no-chats p{color:#a9a9a9;font-size:1rem}.no-chats button{background-color:#3380fc;border:0;border-radius:10px;color:#fff;font-size:1rem;outline:0;padding:5px 10px}.friends-nav{background-color:#282a37;flex-direction:column;height:calc(100vh - 40px);overflow:hidden;position:relative}.friends-nav .heading{-webkit-animation:slideInFromLeft .5s ease-out 0s 1;animation:slideInFromLeft .5s ease-out 0s 1;display:flex;justify-content:space-between;position:relative}.search-field{display:flex;justify-content:flex-end}.search-field button{margin:0;position:absolute;right:5px;top:-5px}.search-field .friendSearch{right:35px}.find-friend-heading .findFriend,.heading .findFriend{background:transparent;border:0;color:#fff;margin:0;outline:0;padding:0;position:absolute;right:0;top:-5px}.notification-badge{background-color:red;border-radius:50%;height:7px;position:absolute;right:1px;top:8px;width:7px}.find-friend-heading{display:flex;justify-content:space-between;position:relative}.find-friend-div{background:linear-gradient(1turn,#232531,#181820);border-radius:20px;display:flex;flex-direction:column;height:100%;padding:20px;position:absolute;-webkit-transform:translateX(100%);transform:translateX(100%);transition:.5s ease-in-out;width:100%;z-index:2}.find-friend-input{margin-top:10px;position:relative}.find-friend-input input{background-color:#282a37;border:1px solid #01acfc;border-radius:20px;color:#fff;font-size:.9rem;height:40px;outline:0;padding:10px 40px 10px 15px;width:100%}.find-friend-input button{background:transparent;border:0;color:#01acfc;font-size:1.4rem;outline:0;position:absolute;right:10px}.find-friends-body{flex:1 1;flex-direction:column;overflow-y:scroll}.find-friends-body-title{margin-top:10px}.find-friends-body::-webkit-scrollbar{display:none}.find-friends-body-title .card{background-color:#282a37;border-radius:10px;font-size:1rem;padding:0 10px}.find-friends-body-title .card .friends-card{display:flex;justify-content:space-between;padding:15px 0 15px 5px}.find-friends-body-title .card .friends-card img{border-radius:50%}.friends-card .name-conatiner{flex-grow:1}.friends-card .cancel-req{background:transparent;border:0;color:red;font-size:1rem;outline:0;transition:.5s}.friends-card .cancel-req:hover{font-size:1.3rem}.frnd-card-lg-btn{background-color:#3380fc;border:0;border-radius:20px;color:#fff;font-size:.8rem;font-weight:600;outline:0;padding:5px 10px}.friends-card .add-req{position:relative;width:40px}.friends-card .add-req .send-req{background-color:#3380fc;border:0;border-radius:50%;color:#fff;font-size:1.1rem;height:40px;margin:0;outline:0;position:absolute;width:40px;z-index:2}.friends-card .add-req .send-req .FaUserPlus{font-size:1.1rem;position:absolute;right:.6rem;top:11px}.friends-card .FaUserCheck{color:#01acfc;font-size:1.3rem;position:absolute;right:.5rem;top:.5rem}.add-req .send-req:hover,.frnd-card-lg-btn:hover{background-color:#1a91ff}.search-field input{background-color:#282a37;border-radius:10px;color:#fff;font-size:1rem;height:40px;outline:0;padding:0;position:absolute;transition:.5s ease-in-out}.search-field .searchInput{right:30px}.search-field input:focus{padding-left:15px}.friends-nav h4{color:#fff;font-weight:400}.friends-nav div{color:#fff;font-size:1.5rem}.frnd-card{background-color:#3e404d;border-radius:15px;position:relative}.frnd-card.active,.frnd-card:hover{background-color:#1a1b23}.frnd-card img{border:2px solid #1a91ff;border-radius:50%}.name-conatiner{align-items:flex-start;display:flex;flex-direction:column;flex-grow:1;justify-content:center}.name-conatiner h6,small{font-size:1rem;margin:0;padding:0}.name-conatiner .time,.name-conatiner small{color:#a9a8a8;font-size:.8rem}.skeleton_container{align-items:center;display:flex;flex-direction:row}.image-holder{-webkit-animation:skeleton-loading 1s linear infinite alternate;animation:skeleton-loading 1s linear infinite alternate;border-radius:50%;height:40px;width:40px}.name-holder{display:flex;flex-direction:column;flex-grow:1}.fullname_skeleton{height:10px;margin-bottom:5px;width:90%}.fullname_skeleton,.username_skeleton{-webkit-animation:skeleton-loading 1s linear infinite alternate;animation:skeleton-loading 1s linear infinite alternate;border-radius:10px}.username_skeleton{height:8px;width:70%}.add-friend_skeleton{-webkit-animation:skeleton-loading 1s linear infinite alternate;animation:skeleton-loading 1s linear infinite alternate;border-radius:50%;height:30px;width:30px}.new-message-alert{background-color:#3380fc;border-radius:20px;display:none;height:20px;position:relative;width:40px}.new-message-alert small{color:#fff;font-weight:bolder;left:.43rem;position:absolute}@-webkit-keyframes skeleton-loading{0%{background-color:#3c3e3e}to{background-color:#626264}}@keyframes skeleton-loading{0%{background-color:#3c3e3e}to{background-color:#626264}}@media only screen and (min-width:320px) and (max-width:767px){.search-field input{margin-top:-5px}}.no-message-active{align-items:center;background:linear-gradient(1turn,rgba(0,0,0,.2),rgba(0,0,0,.2));border-radius:20px;display:flex;flex-direction:column;height:100%;justify-content:center}.no-message-active p{color:#a9a9a9;font-size:1rem}.chat-friend-list{-webkit-animation:slideInFromLeft .5s ease-out 0s 1;animation:slideInFromLeft .5s ease-out 0s 1}.chat-area{background-color:#282a37;display:flex;flex-direction:column;overflow:hidden}.chat-header{cursor:pointer;position:relative}.chat-header img{border-radius:50%}.chat-header .online,.offline{border:2px solid #282a37;border-radius:50%;bottom:.4rem;height:14px;left:2.5rem;position:absolute;width:14px}.chat-header .online{background-color:#32cd32}.chat-header .offline{background-color:#a9a9a9}.chat-header .user-details .online-status{color:#32cd32}.chat-header .user-details h6{color:#fff}.chat-header .user-details small{color:#a9a9a9}.body-container,.chat-container{display:flex;flex-direction:column;height:100%}.body-container{background:linear-gradient(1turn,rgba(0,0,0,.3),rgba(0,0,0,.1));border-radius:20px}.chat-body{color:#fff;display:flex;flex-direction:column;flex-grow:1;height:70dvh;overflow-y:scroll;padding:20px;width:100%}.chat-body>:first-child{margin-top:auto!important}.chat-body::-webkit-scrollbar{display:none}.chat-date-con{display:flex;justify-content:center;width:100%}.chat-date{background-color:#3e404d;border-radius:5px;color:#b8b6b6;font-size:.7rem;padding:3px 10px;text-align:center}.chat-message{align-self:flex-start;background-color:#3e404d;border-radius:10px;border-bottom-left-radius:0;color:#fff;margin:5px 5px 0;max-width:90%;padding:7px;word-break:break-all}.chat-message span{color:#b8b6b6;font-size:.7rem;margin-left:1rem}.chat-message-sender{align-self:flex-end;background-color:#187fe0;border-radius:10px;border-bottom-right-radius:0;color:#fff;margin:5px 5px 0;max-width:90%;padding:7px;word-break:break-all}.chat-message-sender span{color:#e0e0e0;font-size:.7rem;margin-left:1rem}form{padding:10px;position:relative;width:100%}form input{background-color:#282a37;border:2px solid #1a91ff;border-radius:10px;color:#fff;outline:0;padding:5px 5px 5px 15px;width:100%}form .send-button{background:transparent;border:0;color:#1a91ff;font-size:1.4rem;outline:0;position:absolute;right:15px;top:7px}@media only screen and (min-width:320px) and (max-width:767px){.chat-area{display:none;height:100%;margin-top:10px}.chat-body{height:65dvh}.chat-header .online,.offline{left:4rem}}@media only screen and (min-width:768px){.chat-area{display:block}}.user-nav{align-items:center;background-color:#282a37;display:flex;flex-direction:column;height:calc(100vh - 40px);justify-content:space-between}.user-nav .chat-frnd{border-radius:50%;cursor:pointer;position:relative;transition:.6s}.user-nav .chat-frnd:hover{background:linear-gradient(1turn,rgba(0,0,0,.2),rgba(0,0,0,.2))}.user-nav .chat-frnd:hover>p{color:#3380fc}.user-nav p{color:#a9a9a9;font-size:1.5rem;left:11px;position:absolute;top:3px}.user-nav .active{background:linear-gradient(1turn,rgba(0,0,0,.2),rgba(0,0,0,.2))}.user-nav .active>p{color:#3380fc}.nav-container{justify-content:flex-end}.nav-container,.profile-container{display:flex;flex-direction:column}.user-nav img{border-radius:50%;cursor:pointer}.user-nav .signout:hover{color:#7b7f94}.logo-container{margin-top:15px}@media only screen and (min-width:320px) and (max-width:767px){.user-nav{border-bottom:1px solid #5d5a5a;box-shadow:0 4px 4px rgba(93,90,90,.25);height:-webkit-fit-content;height:-moz-fit-content;height:fit-content;margin-bottom:10px;padding-bottom:5px}.nav-container,.user-nav{flex-direction:row}.profile-container{flex-direction:row;gap:10px}.logo-container{display:flex;justify-content:center;margin:0}.logo-container img{margin:0}}.user-profile-div{background:linear-gradient(1turn,#232531,#181820);border-radius:20px;display:flex;flex-direction:column;height:100%;padding:20px;position:absolute;-webkit-transform:translateX(-100%);transform:translateX(-100%);transition:.5s ease-in-out;width:100%;z-index:2}.header{align-items:flex-end;display:flex;gap:20px}.body{align-items:center;display:flex;flex:1 1;flex-direction:column;gap:10px;justify-content:center}.body img{border-radius:50%;width:25%}.body p{font-size:1rem;margin:0}.body span{color:gray;cursor:pointer;font-size:1.2rem;margin-top:-10px}.body input{background-color:#282a37;border:1px solid #1a91ff;border-radius:20px;color:#fff;display:none;font-size:1rem;outline:0;padding-right:2rem}.change-name-form{display:flex;position:relative}.change-name-form button{background:transparent;border:0;color:#1a91ff;font-size:1.2rem;outline:0;padding:0;position:absolute;right:1.2rem}#root{background-color:#282a37;overflow-y:scroll;padding:20px 0}#root::-webkit-scrollbar{display:none}.modal-backdrop{display:none}.login-page,.signup-page{align-items:center;background:linear-gradient(201deg,rgba(0,0,0,.1),#000),url(https://images.pexels.com/photos/4644812/pexels-photo-4644812.jpeg?auto=compress&cs=tinysrgb&w=1260&h=750&dpr=2);background-position:top;background-size:cover;display:flex;flex-direction:column;gap:20px;height:100vh;justify-content:flex-start;padding-top:2rem;position:absolute;top:0;width:100%}.logo-container img{width:150px}.auth-card{background:rgba(40,42,55,.7);background:linear-gradient(201deg,rgba(81,82,90,.6),rgba(40,42,55,.4));border-radius:20px}.card form{color:#fff;padding:2rem}.input-wrapper{position:relative}.card form .input-icons{left:7px;position:absolute;top:4px}.card form .pass-visibility{cursor:pointer;font-size:1.1rem;position:absolute;right:10px;top:4px}.card form h3,label,p{font-weight:100}.card form p{color:#a9a9a9}.card form input{border:1px solid grey}.card form input:focus{border:1px solid #005ef3}.card form input[type=email],.card form input[type=password],.card form input[type=text]{background:transparent;box-shadow:none;color:#fff;padding-left:30px;padding-right:30px}.guest-btn{background:transparent;border:2px solid #005ef3;border-radius:4px;color:#fff;font-size:.75rem;font-weight:500;outline:0;padding:.4rem;text-transform:uppercase;width:100%}.guest-btn:hover{background-color:#0553cf;border:2px solid #0553cf}.card form .btn{background-color:#005ef3;color:#fff;width:100%}.card form .btn:hover{background-color:#0553cf}.outside-card p{color:#a9a9a9}.outside-card p span{color:#005ef3;font-weight:700}.outside-card p span a{text-decoration:none}.trans-btn{background:transparent;border:0;color:#fff;outline:0;padding:0}@media only screen and (min-width:320px) and (max-width:480px){#root{padding-top:5px}}@media only screen and (max-width:500px){.card form input::-webkit-input-placeholder{font-size:.8rem}.card form .btn,.card form input::placeholder,.card form p,.outside-card p{font-size:.8rem}.card form h3{font-size:1.2rem}.logo-container img{margin-top:20px;width:120px}}@media only screen and (min-width:1000px){.signup-page{height:125vh}.login-page{height:110vh}}
/*# sourceMappingURL=main.a2c90c63.css.map*/