*{margin:0;padding:0}body{background:#419fd9 url(https://s-media-cache-ak0.pinimg.com/originals/51/ed/c0/51edc046eb80046ee4755ee71d0f19ca.jpg);justify-content:center;align-items:center;font-family:Open Sans,Roboto,Ubuntu,sans-serif;font-size:16px;display:flex;overflow:hidden}a{text-decoration:none}button{cursor:pointer}button,input[type=search],input[type=text]{border:none;outline:none}input[type=checkbox]{margin:7px 15px 7px 7px}.alerts{z-index:9999;color:#666;background:#fff;border-radius:4px;padding:10px;display:none;position:absolute;bottom:10px;left:10px;box-shadow:0 0 7px #0006}.moreMenu{z-index:10;color:#666;background:#fff;border-top:1px solid #ddd;border-radius:0 0 0 4px;padding:10px;display:none;position:absolute;top:70px;right:0}.moreMenu .option{text-align:left;background:#fff;border-radius:4px;width:150px;height:50px;padding-left:10px;font-size:14px;display:block}.moreMenu .option:hover{background:#ddd}.moreMenu .option:last-child{margin-top:3px}.switchMobile{background:#fff;border-radius:4px;width:65%;height:auto;margin:auto;padding:10px;display:none;position:absolute;top:75px;left:0;right:0;box-shadow:0 0 7px #0000001a}.switchMobile .title{margin-bottom:20px;font-size:18px;font-weight:600}.switchMobile .desc{margin-bottom:25px;font-size:14px;font-weight:300}.switchMobile .okay{float:right;color:#fff;background:#419fd9;border-radius:4px;width:80px;padding:10px;font-size:16px;font-weight:600}.menuWrap{z-index:3;width:30%;min-width:240px;max-width:320px;height:100%;display:none;position:absolute}.menu{float:left;opacity:0;background:#fff;width:100%;height:100vh;position:relative;left:-320px;box-shadow:0 0 7px #0006}.me{background:#419fd9;width:calc(100% - 50px);height:140px;margin-bottom:15px;padding:15px 25px;position:relative}.me .image{cursor:pointer;background:#fff url(https://thispersondoesnotexist.com/image) 50%/cover no-repeat;border-radius:100%;width:70px;height:70px}.me .settings{color:#fff;background:#00000026;border-radius:100%;width:40px;height:40px;padding-top:2px;position:absolute;bottom:65px;right:20px}.me .settings:hover{background:#00000059}.me .cloud{color:#fff;background:#00000017;border-radius:100%;width:40px;height:40px;position:absolute;bottom:15px;right:20px}.me .cloud:hover{background:#00000059}.me .myinfo{color:#fff;font-size:14px;position:absolute;bottom:15px}.myinfo .name{margin-bottom:5px;font-weight:600}.myinfo .phone{font-weight:300}nav button{text-align:left;color:#666;background:#fff;width:100%;height:45px;padding-left:20px}nav{float:left;width:100%;height:auto;max-height:350px;overflow:hidden auto}nav button:hover{background:#eee}nav button>i{color:#999;float:left}nav button>span{margin-top:5px;margin-left:20px;font-size:14px;font-weight:600;display:inline-block}.info{color:#666;font-size:12px;position:absolute;bottom:15px;left:20px}.config{z-index:520;opacity:0;background:#ddd;width:50%;height:100vh;margin:auto;display:block;position:absolute;top:0;left:0;right:-200vw;overflow:hidden auto}.confTitle{color:#444;margin:10px 0 15px;font-size:24px;font-weight:600}.configSect{float:left;background:#fff;width:calc(100% - 60px);margin-bottom:10px;padding:15px 30px}.profile .image{float:left;background:#fff url(https://thispersondoesnotexist.com/image) 50%/cover no-repeat;border-radius:100%;width:140px;height:140px;margin-right:30px}.side{float:none;width:auto;height:110px;position:relative}.side .name{font-size:18px;font-weight:600}.side .pStatus{margin-top:5px;font-size:14px;font-weight:300}.profile .changePic,.profile .edit{color:#fff;background:#419fd9;border-radius:4px;width:auto;padding:10px;font-size:16px;font-weight:600}.profile .edit{color:#999;background:#fff;margin-left:10px}.profile .edit:hover{color:#419fd9}.second ul{float:none;margin-left:-7px;list-style-type:none}.second ul li{margin:7px}.second .blue{color:#419fd9}.second label{clear:both;display:block}.second .information{margin-bottom:30px}.check{float:left;cursor:pointer;background:#bbb;border-radius:15px;width:38px;height:14px;transition:all .2s ease-in-out;display:block;position:relative}.check>.tracer{float:left;background:#fff;border:2px solid #bbb;border-radius:100%;width:16px;height:16px;margin-top:-3px;transition:all .2s ease-in-out}#checkNight,#deskNotif,#showSName,#showPreview,#playSounds{display:none}.toggleTracer:checked~.check{background:#419fd9}.toggleTracer:checked~.check>.tracer{border-color:#419fd9;margin-left:18px}.optionWrapper{width:100%;height:32px;display:block}.optionWrapper p{float:left;color:#444;margin-top:3px;margin-left:15px;font-size:14px}.overlay{z-index:2;background:#000c;width:100%;height:100%;display:none;position:absolute}.leftPanel{float:left;background:#fff;border-right:1px solid #ddd;width:320px;height:100vh;display:inline-block;position:relative;left:0}header{background:#fff;width:100%;height:70px}.trigger{float:left;color:#bbb;cursor:pointer;opacity:.6;background:0 0;width:32px;height:32px;margin:20px 15px 0}.trigger:hover{opacity:1}.trigger>svg{fill:#888;width:24px;height:24px}.searchChats{float:left;background:#eee;border:none;border-radius:4px;width:calc(100% - 85px);height:40px;margin-top:14px;padding:8px;font-size:14px;font-weight:600}.searchChats:focus{color:#444;background:#f3f3f3;border:2px solid #419fd9}.chats{float:left;width:100%;height:calc(100vh - 70px);overflow:hidden auto}.chatButton{float:left;color:#555;cursor:pointer;background:#fff;width:100%;height:80px;overflow:hidden}.chatButton:hover{color:#555;background:#eee}.active,.active:hover{color:#fff;background:#419fd9}.chatInfo,.chatInfo p{float:left}.chatInfo .image{background:#ddd url(https://pbs.twimg.com/profile_images/378800000822867536/3f5a00acf72df93528b6bb7cd0a4fd0c.jpeg) 50%/cover no-repeat;border-radius:100%;width:55px;height:55px;margin:13px;position:absolute}.chatInfo .my-image{background-image:url(https://avatars1.githubusercontent.com/u/21313332?s=460&v=4)}.chatInfo .name{float:left;margin-top:18px;margin-left:80px;font-weight:600}.chatInfo .message{float:left;clear:left;margin-top:7px;margin-left:80px}.status{float:right;width:60px;height:100%;position:relative}.status .fixed{display:none;position:absolute;bottom:10px;right:10px}div[class~=normal]>.fixed{display:none}div[class~=normal]>.count{bottom:7px;right:10px}div[class~=onTop]>.fixed{fill:#fff;width:24px;height:24px;display:block}div[class~=onTop]>.count{color:#419fd9;background:#fff;bottom:7px;right:49px}.status .count{color:#222;background:#0000001f;border-radius:20px;width:auto;height:auto;padding:7px;position:absolute;bottom:7px;right:49px}.status .date{font-size:12px;position:absolute;top:12px;right:12px}.status .read{position:absolute;top:6px;right:53px}.rightPanel{float:left;background:#999;width:calc(100% - 321px);height:100vh}.rightPanel .topBar{background:#fff;width:100%;height:70px;position:relative}.go-back{background:#419fd9;border:none;border-radius:100%;width:50px;height:50px}.go-back:hover{background:#2563eb}.leftSide .chatName{color:#444;cursor:default;margin-top:10px;margin-left:15px;font-weight:700}.chatName>span{color:#bbb;margin-left:12px;font-size:12px;font-weight:700}.leftSide .chatStatus{color:#419fd9;cursor:default;margin-left:15px;font-size:12px;font-weight:700;overflow:hidden}.rightSide{margin-right:20px}.tbButton,.otherTools .toolButtons{color:#000;background:#fff;border-radius:100%;width:50px;height:50px;font-size:1vw;font-weight:700}.convHistory{float:left;background:#333;width:100%;height:calc(100vh - 140px);position:relative;overflow:hidden auto}.userBg{background:url(https://images.unsplash.com/photo-1463058837219-41e13a132b7d?dpr=1&auto=format&fit=crop&w=1500&h=1000&q=80&cs=tinysrgb&crop=&bg=) 100%}.msg{clear:both;background:#fff;border-radius:7px;width:auto;min-width:100px;max-width:45%;height:auto;margin:20px 15px 0;padding:25px 25px 35px;position:relative}.msg:last-child{margin-bottom:20px}.msg .timestamp{color:#aaa;-webkit-user-select:none;user-select:none;display:block;position:absolute;bottom:6px;right:10px}.messageReceived{float:left;background:#fff}.messageSent{float:right;background:#effdde}.messageSent>.timestamp,.messageSent>.readStatus{color:#006400;-webkit-user-select:none;user-select:none;bottom:10px;right:40px}.messageSent>.readStatus{position:absolute;bottom:10px;right:12px}.replyBar{float:left;background:#fff;width:100%;height:70px}.replyBar .attach{color:#777;float:left;background:#fff;width:70px;height:70px}.replyBar .attach:hover{color:#555;background:#ddd}.replyBar .d45{font-size:32px;transform:rotate(45deg)}.replyBar .replyMessage{float:left;width:calc(100% - 220px);height:70px;padding:0 8px;font-size:16px}.replyBar .otherTools{float:right;width:120px;height:70px}.emojiBar{background:#fff;border:2px solid #ddd;border-radius:3px;width:325px;height:200px;padding:10px;display:none;position:absolute;bottom:80px;right:30px}.emoticonType{width:100%;height:50px}.emoticonType button{color:#555;background:0 0;width:105px;height:36px;font-weight:600}.emoticonType button:hover{color:#fff;background:#419fd9}.emojiList,.stickerList{width:100%;height:150px;overflow:hidden auto}.emojiList .pick{background:50%/70% no-repeat;width:50px;height:50px;transition:all .15s ease-in-out}.emojiList .pick:hover{background:#ddd 50%/70% no-repeat}.stickerList .pick{background:50%/65% no-repeat;width:80px;height:80px;transition:all .15s ease-in-out}.stickerList .pick:hover{background:#ddd 50%/65% no-repeat}.stickerList{display:none}#smileface{background-image:url(https://emojipedia-us.s3.amazonaws.com/thumbs/120/apple/96/grinning-face_1f600.png)}#grinningface{background-image:url(https://emojipedia-us.s3.amazonaws.com/thumbs/120/apple/96/grinning-face-with-smiling-eyes_1f601.png)}#tearjoyface{background-image:url(https://emojipedia-us.s3.amazonaws.com/thumbs/120/apple/96/face-with-tears-of-joy_1f602.png)}#rofl{background-image:url(https://emojipedia-us.s3.amazonaws.com/thumbs/120/apple/96/rolling-on-the-floor-laughing_1f923.png)}#somface{background-image:url(https://emojipedia-us.s3.amazonaws.com/thumbs/120/apple/96/smiling-face-with-open-mouth_1f603.png)}#swfface{background-image:url(https://emojipedia-us.s3.amazonaws.com/thumbs/120/apple/96/smiling-face-with-open-mouth-and-smiling-eyes_1f604.png)}.enlarge{float:left;width:100%;height:100vh}.DarkTheme,.DarkTheme .mainApp{background:#222}@media screen and (width<=1180px){.config{width:60%}}@media screen and (width<=980px){.config{width:90%}}@media screen and (width<=940px){body{font-size:14px}.msg{width:90%}.leftSide{width:120px;margin-top:4px}.chatName>span{display:none}}@media screen and (width<=720px){.leftPanel{width:80px}.trigger{margin-left:22px}.rightPanel{width:calc(100% - 81px)}.msg{width:auto;max-width:60%}.profile .changePic,.profile .edit{font-size:14px;font-weight:500}.profile .edit{margin-left:5px}.searchChats,.search,.chatButton>.name,.chatButton>.message,.chatButton>.status{display:none}}@media screen and (width<=480px){.go-back{display:block}.msg{clear:both;border-radius:7px;padding:12px 12px 36px}}.login-container{width:100%;max-width:400px}.card{text-align:center;background:#fff;border-radius:12px;padding:40px;box-shadow:0 10px 25px #0000001a}.card h2{margin-bottom:10px}.subtitle{color:#777;margin-bottom:25px;font-size:14px}.input-group{margin-bottom:15px}.input-group input{border:1px solid #ddd;border-radius:8px;outline:none;width:100%;padding:12px;transition:all .2s}.input-group input:focus{border-color:#3b82f6}button{color:#fff;cursor:pointer;background:#3b82f6;border:none;border-radius:8px;width:100%;padding:12px;font-size:16px;transition:all .2s}.extra{margin-top:15px}.extra a{color:#3b82f6;font-size:13px;text-decoration:none}