@import"https://fonts.googleapis.com/css2?family=Inter:wght@500;600;800&family=Poppins:wght@400;500;600&family=Roboto+Slab:wght@400;900&display=swap";body{font-family:Roboto Slab,serif;margin:0;padding:0}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:rgba(0,0,0,.8)}::-webkit-scrollbar-thumb{background:#888;border-radius:5px}::-webkit-scrollbar-thumb:hover{background:#555}.formContainer{background-color:#075e54;height:100vh;display:flex;align-items:center;justify-content:center}.formContainer .formWrapper{background-color:#fff;padding:20px 60px;border-radius:10px;display:flex;flex-direction:column;gap:10px}.formContainer .formWrapper .logo{display:flex;color:#128c7e;font-weight:900;font-size:24px;justify-content:center}.formContainer .formWrapper .title{color:#000;font-size:18px;justify-content:center;display:flex;font-weight:600}.formContainer .formWrapper form{display:flex;flex-direction:column;gap:15px}.formContainer .formWrapper form input{padding:15px 0;border:none;border-bottom:1px solid rgba(7,94,84,.6);width:100%}.formContainer .formWrapper form input::placeholder{color:#000}.formContainer .formWrapper form label{display:flex;align-items:center;cursor:pointer;padding:5px 0}.formContainer .formWrapper form label span{padding-left:.5rem;font-size:small}.formContainer .formWrapper form button{background-color:green;color:#fff;cursor:pointer;padding:10px;border:none;font-weight:700}.formContainer .formWrapper form button:hover{background-color:#008000cc}.formContainer .formWrapper p{margin-top:10px;font-size:14px;font-weight:600}.home{background-color:#fff;height:100vh;display:flex;align-items:center;justify-content:center}.home .container{border:1px solid white;background-color:#000c;border-radius:10px;width:65%;height:80%;display:flex;overflow:hidden}.home .container .sidebar{flex:1;border-right:1px solid white;background-color:#0003}.home .container .sidebar .search{border-bottom:1px solid grey;background-color:#000c}.home .container .sidebar .userChat{padding:10px;display:flex;align-items:center;gap:10px;color:#fff;background-color:#0003;cursor:pointer}.home .container .sidebar .userChat:hover{background-color:#000000b3}.home .container .sidebar .userChat img{width:50px;height:50px;border-radius:50%;object-fit:cover}.home .container .sidebar .userChat span{font-size:18px;font-weight:600}.home .container .sidebar .userChat p{font-size:14px;color:gray}.home .container .chat{display:flex;flex-direction:column;flex:2;height:80%}.home .container .chat .messages{padding:10px;height:62vh;overflow-y:scroll;overflow-x:hidden}.home .container .chat .messages .message{display:flex;gap:20px;margin-bottom:10px}.home .container .chat .messages .message .messageInfo{display:flex;flex-direction:column;color:gray;font-size:12px}.home .container .chat .messages .message .messageContent{max-width:80%;display:flex;flex-direction:column;gap:10px}.home .container .chat .messages .message .messageContent p{padding:10px 20px;border-radius:0 10px 10px;font-size:14px;max-width:max-content}.home .container .chat .messages .message .chatimg{width:50%}.home .container .chat .messages .message.owner{flex-direction:row-reverse}.home .container .chat .messages .message.owner .messageContent{align-items:flex-end}.home .container .chat .messages .message.owner .messageContent p{background-color:#075e5499;color:#fff;border-radius:0 10px 10px}.home .container .chat .messages .message.guest{flex-direction:row}.home .container .chat .messages .message.guest .messageContent{align-items:flex-start}.home .container .chat .messages .message.guest .messageContent p{background-color:#3f3f3fcc;color:#fff;border-radius:0 10px 10px}.home .container .chat .input{height:50px;width:100%;background-color:#0000004d;border:none;display:flex;align-items:center;margin-bottom:1px}.home .container .chat input{width:100%;outline:none;border:none;color:#fff9;background-color:#0000001a;font-size:19px;height:50px;padding-left:10px}.home .container .chat .send{display:flex;align-items:center}.home .container .chat .chatIcons{color:#fff}@keyframes quiet{25%{transform:scaleY(.6)}50%{transform:scaleY(.4)}75%{transform:scaleY(.8)}}@keyframes normal{25%{transform:scaleY(1)}50%{transform:scaleY(.4)}75%{transform:scaleY(.6)}}@keyframes loud{25%{transform:scaleY(1)}50%{transform:scaleY(.4)}75%{transform:scaleY(1.2)}}@keyframes btn{0%,to{color:red}50%{color:#000000b5}}.box{transform:scaleY(.4);height:28px!important;width:2px!important;background:rgba(0,0,0,.711)!important;animation-duration:1.2s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;border-radius:8px}.micMenu{background-color:#7a7a7ae6;border-radius:2px 2px 0 0}.rec{font-weight:900}.box1{animation-name:quiet}.recBtn{animation:btn 1s infinite}.box2{animation-name:normal}.box3{animation-name:quiet}.box4{animation-name:loud}.box5{animation-name:quiet}
