*{box-sizing:border-box;margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;overflow-x:hidden}.container{padding:30px}header{background:white;padding:20px 15px;position:fixed;top:0;right:0;width:79.9vw;z-index:100;box-shadow:#63636333 0 2px 8px}.chatBox{height:100%;display:flex;flex-direction:column}.chatWrapper{height:100vh;background:#edf1f8;display:flex;overflow:auto}.chatWrapper .container{width:100%;overflow:auto;height:100vh}.chatWrapper aside{background-color:#fff;padding:20px 10px;background-color:#286ce7;color:#fff;width:25vw;text-align:center;box-shadow:#959da533 0 8px 24px}.chatWrapper header{display:flex;justify-content:space-between;align-items:center}.chatWrapper header h3{cursor:pointer}.scrollContainer{width:100%;height:100%}.inputSection{position:fixed;bottom:0%;right:0;width:79.9vw;display:flex;box-shadow:#64646f33 0 7px 29px}.inputSection input{width:90%;padding:20px;border:none;outline:none}.inputSection button{border:none;padding:5px;width:100px;background:#286ce7;color:#fff;cursor:pointer}.msgComponent{margin-bottom:40px}.msgWrapper{border-radius:22px;padding:16px;color:#5d6b79;background:white;font-weight:100;font-size:15px;line-height:1.3;display:inline-block}.author{font-size:12px;text-transform:capitalize;color:#7f8b99;margin-left:10px;margin-bottom:10px}.time{font-size:12px;color:#7f8b99;margin-left:10px;margin-top:10px}.chat-body{overflow-y:auto;display:flex;flex-direction:column;position:relative;margin-top:60px}.joinRoom{height:100vh;display:flex;justify-content:center;align-items:center;background:#286ce7}.joinRoom .container{display:flex;flex-direction:column;justify-content:center;border-radius:10px;background-color:#fff;height:auto;width:550px;box-shadow:#130dcf29 0 1px 4px}.joinRoom input{outline:none;border:1px solid #c7c7c7;padding:15px;border-radius:5px;margin-bottom:20px;font-size:15px}.joinRoomBtn{padding:15px 10px;border:none;background-color:#286ce7;color:#fff;border-radius:5px;margin-top:30px;cursor:pointer;font-size:16px;font-weight:600}.joinRoom h1{margin-bottom:20px;color:#071a3b;font-weight:600;font-size:33px}#you{align-self:flex-end!important}#you .msgWrapper{background-color:#286ce7;color:#fff}.video-call,.audio-call{position:absolute;top:0;height:100vh;width:100vw;left:0;z-index:100}.video-call video{border:3px solid red}@media only screen and (max-width: 768px){aside{display:none}header,.inputSection{width:100vw}}