.login{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30%;height:100vh;max-height:500px;z-index:2;overflow:hidden;box-shadow:0 5px 30px #0003;background:rgba(0,0,0,.5);border-radius:20px;display:flex;justify-content:center;padding-left:20px;padding-right:20px;flex-direction:column}.align{display:grid;-webkit-box-align:center;-ms-flex-align:center;align-items:center;justify-items:center;place-items:center}.grid{width:90%;margin-left:auto;margin-right:auto;max-width:20rem}.hidden{border:0;clip:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px}:root{--iconFill: var(--baseColor)}.icons{display:none}.icon{height:1em;display:inline-block;fill:#606468;fill:var(--iconFill);width:1em;vertical-align:middle}:root{--htmlFontSize: 100%;--bodyBackgroundColor: #2c3338;--bodyColor: var(--baseColor);--bodyFontFamily: "Open Sans";--bodyFontFamilyFallback: sans-serif;--bodyFontSize: .875rem;--bodyFontWeight: 400;--bodyLineHeight: 1.5}*{-webkit-box-sizing:inherit;box-sizing:inherit}:root{--anchorColor: #eee}a{color:#eee;color:var(--anchorColor);outline:0;text-decoration:none}a:focus,a:hover{text-decoration:underline}:root{--formGap: .875rem}.alternate-btn{background-color:#ea4c88;background-color:var(--loginSubmitBackgroundColor);color:#eee;color:var(--loginSubmitColor);font-weight:700;text-transform:uppercase;border:none;border-radius:.25rem;border-radius:var(--loginBorderRadus);margin-bottom:1rem}.input{background-image:none;border:0;color:inherit;font:inherit;outline:0;padding:0;-webkit-transition:background-color .3s;-o-transition:background-color .3s;transition:background-color .3s;margin-bottom:1.5rem;border-radius:.25rem;margin:0;border:none;width:100%}.button{cursor:pointer;margin:0;outline:none;border:none}.form{display:grid;grid-gap:.875rem;gap:.875rem;grid-gap:var(--formGap);gap:var(--formGap)}.form input[type=password],.form input[type=text],.button{width:100%}.form__field{display:-webkit-box;display:-ms-flexbox;display:flex}.form__input{-webkit-box-flex:1;-ms-flex:1;flex:1}:root{--loginBorderRadus: .25rem;--loginColor: #eee;--loginInputBackgroundColor: #3b4148;--loginInputHoverBackgroundColor: #434a52;--loginLabelBackgroundColor: #363b41;--loginSubmitBackgroundColor: #ea4c88;--loginSubmitColor: #eee;--loginSubmitHoverBackgroundColor: #d44179}.login{color:#eee;color:var(--loginColor);flex:1;height:100vh}@media screen and (max-width: 1024px){.login{top:50%;width:90%;height:100vh}}.login label,.login input[type=text],.login input[type=password],.login .button{border-radius:.25rem;border-radius:var(--loginBorderRadus);padding:1rem;margin-bottom:1rem}.login label{background-color:#363b41;background-color:var(--loginLabelBackgroundColor);border-bottom-right-radius:0;border-top-right-radius:0;padding-left:1.25rem;padding-right:1.25rem}.login h1{text-align:center}.login input[type=password],.login input[type=text]{background-color:#3b4148;background-color:var(--loginInputBackgroundColor);border-bottom-left-radius:0;border-top-left-radius:0}.login input[type=password]:focus,.login input[type=password]:hover,.login input[type=text]:focus,.login input[type=text]:hover{background-color:#434a52;background-color:var(--loginInputHoverBackgroundColor)}.login .button{background-color:#ea4c88;background-color:var(--loginSubmitBackgroundColor);color:#eee;color:var(--loginSubmitColor);font-weight:700;text-transform:uppercase}.login input[type=submit]:focus,.login input[type=submit]:hover{background-color:#d44179;background-color:var(--loginSubmitHoverBackgroundColor)}p{margin-top:1.5rem;margin-bottom:1.5rem}.text--center{text-align:center}*,*:before,*:after{box-sizing:border-box}html,body{height:100%}body{background:linear-gradient(135deg,#044f48,#2a7561);background-size:cover;font-family:Open Sans,sans-serif;font-size:12px;line-height:1.3;overflow:hidden}.bg{width:100%;height:100%;top:0;left:0;z-index:1;background:url(https://images.unsplash.com/photo-1451186859696-371d9477be93?crop=entropy&fit=crop&fm=jpg&h=975&ixjsv=2.1.0&ixlib=rb-0.3.5&q=80&w=1925) no-repeat 0 0;filter:blur(80px);transform:scale(1.2)}.chat{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:30%;height:100vh;max-height:500px;z-index:2;overflow:hidden;box-shadow:0 5px 30px #0003;background:rgba(0,0,0,.5);border-radius:20px;display:flex;justify-content:space-between;flex-direction:column}@media screen and (max-width: 1024px){.chat{top:50%;width:90%;height:100vh}}.chat-title{flex:0 1 45px;position:relative;z-index:2;background:rgba(0,0,0,.2);color:#fff;text-transform:uppercase;text-align:left;padding:10px 10px 10px 50px}.chat-title h1,.chat-title h2{font-weight:400;font-size:10px;margin:0;padding:0}.chat-title h2{color:#ffffff80;font-size:8px;letter-spacing:1px}.chat-title .avatar{position:absolute;z-index:1;top:8px;left:9px;border-radius:30px;width:30px;height:30px;overflow:hidden;margin:0;padding:0;border:2px solid rgba(255,255,255,.24)}.chat-title .avatar img{width:100%;height:auto}.messages{flex:1 1 auto;color:#ffffffe6;overflow:hidden;position:relative;width:100%}.messages .messages-content{position:absolute;top:0;left:0;height:99.9%;width:100%;overflow-y:scroll}::-webkit-scrollbar{width:8px;background-color:transparent}::-webkit-scrollbar-thumb{background-color:#ffffff03;border-radius:4px}::-webkit-scrollbar-track{background-color:transparent}::-webkit-scrollbar:hover{background-color:#0000001a}::-webkit-scrollbar-thumb:hover{background-color:#63636366}.messages .message{max-width:60%;clear:both;float:left;padding:6px 10px 7px;border-radius:10px 10px 10px 0;background:rgba(0,0,0,.3);font-size:11px;line-height:1.4;margin:8px 0 300px 35px;position:relative;text-shadow:0 1px 1px rgba(0,0,0,.2)}.messages .message .timestamp{position:absolute;bottom:-15px;font-size:9px;color:#ffffff4d}.messages .message:before{content:"";position:absolute;bottom:-6px;border-top:6px solid rgba(0,0,0,.3);left:0;border-right:7px solid transparent}.messages .message .avatar{position:absolute;z-index:1;bottom:-15px;left:-35px;border-radius:30px;width:30px;height:30px;overflow:hidden;margin:0;padding:0;border:2px solid rgba(255,255,255,.24)}.messages .message .avatar img{width:100%;height:auto}.messages .message.message-personal{float:right;color:#fff;text-align:right;background:linear-gradient(120deg,#248A52,#257287);border-radius:10px 10px 0}.messages .message.message-personal:before{left:auto;right:0;border-right:none;border-left:5px solid transparent;border-top:4px solid #257287;bottom:-4px}.messages .message:last-child{margin-bottom:30px}.messages .message.new{transform:scale(0);transform-origin:0 0;-webkit-animation:bounce .5s linear both;animation:bounce .5s linear both}.messages .message.loading:before{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"";display:block;width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.5);z-index:2;margin-top:4px;-webkit-animation:ball .45s cubic-bezier(0,0,.15,1) alternate infinite;animation:ball .45s cubic-bezier(0,0,.15,1) alternate infinite;border:none;-webkit-animation-delay:.15s;animation-delay:.15s}.messages .message.loading span{display:block;font-size:0;width:20px;height:10px;position:relative}.messages .message.loading span:before{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"";display:block;width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.5);z-index:2;margin-top:4px;-webkit-animation:ball .45s cubic-bezier(0,0,.15,1) alternate infinite;animation:ball .45s cubic-bezier(0,0,.15,1) alternate infinite;margin-left:-7px}.messages .message.loading span:after{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);content:"";display:block;width:3px;height:3px;border-radius:50%;background:rgba(255,255,255,.5);z-index:2;margin-top:4px;-webkit-animation:ball .45s cubic-bezier(0,0,.15,1) alternate infinite;animation:ball .45s cubic-bezier(0,0,.15,1) alternate infinite;margin-left:7px;-webkit-animation-delay:.3s;animation-delay:.3s}.error{color:red;text-align:center}.hide{visibility:hidden;display:none}.message-box{flex:0 1 40px;width:100%;background:rgba(0,0,0,.3);padding:10px;position:relative}.message-box .message-input{background:none;border:none;outline:none!important;resize:none;color:#ffffffb3;font-size:11px;height:17px;margin:0;padding-right:20px;width:265px}.message-box textarea:focus:-webkit-placeholder{color:transparent}.message-box .message-submit{position:absolute;z-index:1;top:9px;right:10px;color:#fff;border:none;background:#248A52;font-size:10px;text-transform:uppercase;line-height:1;padding:6px 10px;border-radius:10px;outline:none!important;transition:background .2s ease}.message-box .message-submit:hover{background:#1D7745}.mCSB_scrollTools{margin:1px -3px 1px 0;opacity:0}.mCSB_inside>.mCSB_container{margin-right:0;padding:0 10px}.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color:#00000080!important}@-webkit-keyframes bounce{0%{transform:scale3d(0,0,1)}4.7%{transform:scale3d(.45,.45,1)}9.41%{transform:scale3d(.883,.883,1)}14.11%{transform:scale3d(1.141,1.141,1)}18.72%{transform:scale3d(1.212,1.212,1)}24.32%{transform:scale3d(1.151,1.151,1)}29.93%{transform:scale3d(1.048,1.048,1)}35.54%{transform:scale3d(.979,.979,1)}41.04%{transform:scale3d(.961,.961,1)}52.15%{transform:scale3d(.991,.991,1)}63.26%{transform:scale3d(1.007,1.007,1)}85.49%{transform:scale3d(.999,.999,1)}to{transform:scaleZ(1)}}@keyframes bounce{0%{transform:scale3d(0,0,1)}4.7%{transform:scale3d(.45,.45,1)}9.41%{transform:scale3d(.883,.883,1)}14.11%{transform:scale3d(1.141,1.141,1)}18.72%{transform:scale3d(1.212,1.212,1)}24.32%{transform:scale3d(1.151,1.151,1)}29.93%{transform:scale3d(1.048,1.048,1)}35.54%{transform:scale3d(.979,.979,1)}41.04%{transform:scale3d(.961,.961,1)}52.15%{transform:scale3d(.991,.991,1)}63.26%{transform:scale3d(1.007,1.007,1)}85.49%{transform:scale3d(.999,.999,1)}to{transform:scaleZ(1)}}@-webkit-keyframes ball{0%{transform:translateY(0) scaleY(.8)}to{transform:translateY(-10px)}}@keyframes ball{0%{transform:translateY(0) scaleY(.8)}to{transform:translateY(-10px)}}