*, *::before, *::after {
  box-sizing: inherit;
  padding: 0;
  margin: 0;
}

html {
  box-sizing: border-box;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: normal;
}

ul {
  list-style: none;
}

img,
video {
  height: auto;
  max-width: 100%;
}

iframe {
  border: 0;
}

table {
  border-collapse: collapse;
  border-spacing: 0;
}

html,body,.wrapper,.container{height:100%;width:100%;overflow:hidden;font-family:"Ubuntu",sans-serif}h1{margin:0}.wrapper{position:relative;background-image:linear-gradient(to top right, #061299, #15139c, #25139e, #3414a1, #4415a3, #5316a6, #6316a8, #7217ab, #8218ad, #9119b0, #a119b2, #b01ab5)}.wrapper .container{display:flex;opacity:0;transition:opacity 3s}.wrapper .container.visible{opacity:1;transition:opacity 3s}.wrapper .container.hide{display:none}.login{position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);padding:0 77px;display:flex;flex-direction:column;align-items:center;border-radius:20px;opacity:.8;width:452px;height:497px;min-height:300px;transition:opacity .3s;background-image:linear-gradient(to top right, #131980, #16197c, #191978, #1b1874, #1e1870, #21186c, #241868, #271864, #2a1860, #2c175c, #2f1758, #321754)}.login.hide{opacity:0;transition:opacity .9s}.login.none{display:none}.login__img{margin-top:39px;width:139px}.login__title{margin-top:29px;font-style:normal;font-weight:500;font-size:24px;line-height:28px;color:#fff}.login__text{margin-top:13px;font-style:normal;font-weight:normal;font-size:16px;line-height:18px;text-align:center;color:#7f91a4}.login .login__input{margin-top:37px;padding:1px 0 13px 8px;font-style:normal;font-weight:300;font-size:16px;line-height:18px;color:#858f98;background-color:transparent;border:none;outline:none;border-bottom:1px solid #465461;transition:border-bottom-color .5s,color .5s,margin-top 1s}.login .login__input:focus{color:#fff;border-bottom:1px solid #5188c0;transition:all .5s}.login__submit{margin-top:42px;cursor:pointer;font-style:normal;font-weight:500;font-size:15px;line-height:17px;text-transform:uppercase;color:#fff;width:132px;height:43px;background:#5188c1;border:0;border-radius:5px;transition:background-color 1s}.login__submit:hover{background:#1e5798;transition:background-color .7s}.login__loading{position:absolute;bottom:50px;right:70px;width:64px;height:64px;background:url("https://i.ibb.co/Rz02qWG/1480.gif");opacity:1;transition:opacity .3s}.login__loading.hide{opacity:0;transition:opacity .3s}.login__error{opacity:0;margin-top:6px;font-style:normal;font-weight:normal;font-size:12px;line-height:18px;text-align:center;color:rgba(136,161,185,.58);transition:opacity .4s}.login__error.visible{opacity:1;transition:opacity .4s}.aside{position:relative;display:flex;flex-direction:column;width:360px;background:#17212b;transition:width .5s cubic-bezier(0.7, -0.36, 0.26, 1.37);user-select:none}.aside.hidden{min-width:77px;width:4%;transition:width .5s cubic-bezier(0.7, -0.36, 0.26, 1.37)}.aside__button{cursor:pointer;position:absolute;top:25px;left:23px;width:30px;height:22px}.aside__button .button__element{position:absolute;width:30px;height:2px;background:#6c7982}.aside__button .button__element:first-child{top:10px}.aside__button .button__element:nth-child(2){top:2px}.aside__button .button__element:last-child{bottom:2px}.aside__profile{display:flex;flex-direction:column;margin:75px 0 0 100px}.aside__profile .profile{display:flex;flex-direction:row;align-items:center;user-select:none}.aside__profile .profile__img img{height:80px;width:80px;border-radius:50%;user-select:none}.aside__profile .profile__nickname{margin-left:10px;font-style:normal;font-weight:500;font-size:18px;line-height:16px;color:#5387c1}.aside__profile .profile__nicknames{display:flex;flex-direction:column;margin-top:20px;font-style:normal;font-weight:300;font-size:16px;line-height:16px;color:#7f91a4;text-shadow:0 3px 17px rgba(45,255,190,.49);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:260px}.aside__profile .profile__nicknames .nickname{width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:10px 0 0 10px}.chat{display:flex;position:relative;flex:1;flex-direction:column;background-color:#0e1621}.chat__header{user-select:none;height:57px;padding:13px 16px 9px;display:flex;flex-direction:column;border-left:1px solid #0e1621;background:#17212b}.chat__title{font-style:normal;font-weight:300;font-size:14px;line-height:16px;color:#fff}.chat__members{position:relative;text-decoration:none;margin-top:4px;font-style:normal;font-weight:300;font-size:12px;line-height:14px;color:#7f91a4;transition:color 2s}.chat__members:hover{color:#cfd7e1;text-decoration:underline;transition:color 2s}.chat__members:hover:before{content:"";position:absolute;top:30px;left:-5px;min-width:90px;min-height:100px;background-color:rgba(8,28,51,.25)}.chat__all-messages{margin-bottom:64px;display:flex;overflow-y:auto;flex:1;flex-direction:column}.chat__all-messages .member{display:flex;position:relative;flex-direction:column;margin-top:9px;user-select:none}.chat__all-messages .member__join{display:flex;justify-content:center}.chat__all-messages .member__join div{user-select:none;background-color:rgba(28,47,110,.53);color:#ababab;padding:3px 10px;border-radius:10px;font-weight:300;font-size:13px}.chat__all-messages .member__img{position:absolute;top:10px;width:33px;height:33px;border-radius:50%}.chat__all-messages .member.friend .member__img{left:-25px;transform:translate(-50%, -50%)}.chat__all-messages .member.member.me .member__img{right:-58px;transform:translate(-50%, -50%)}.chat__all-messages .member__message{display:flex;margin-top:4px;padding:8px 11px 8px 11px;font-style:normal;font-weight:300;font-size:14px;line-height:16px;color:#fff;min-height:33px;border-radius:5px}.chat__all-messages .member__message.message{overflow-wrap:break-word}.chat__all-messages .member__message.message .message__text{max-width:200px;overflow-wrap:break-word}.chat__all-messages .member__message.message .message__time{display:flex;align-items:flex-end;cursor:pointer;margin:5px 0 0 9px;font-style:normal;font-weight:300;font-size:14px;line-height:16px;color:#7f91a4}.chat__all-messages .member__message:first-child{margin-top:7px}.chat__all-messages .member__nickname{font-style:normal;font-weight:500;font-size:12px;line-height:14px;color:#5387c1}.chat__all-messages .member.me{align-items:flex-end;margin-right:53px}.chat__all-messages .member.me .member__message{background:#2b5279}.chat__all-messages .member.me .member__message:nth-child(2){position:relative}.chat__all-messages .member.me .member__message:nth-child(2):after{content:"";width:10px;height:10px;bottom:0;right:0;position:absolute;transform:translateX(83%);border-style:solid;border-width:10px 20px 0 10px;border-color:transparent transparent transparent #2b5279}.chat__all-messages .member.friend{align-items:flex-start;margin-left:46px}.chat__all-messages .member.friend .member__message{background:#182633}.chat__all-messages .member.friend .member__message:nth-child(2){position:relative}.chat__all-messages .member.friend .member__message:nth-child(2):after{content:"";width:10px;height:10px;bottom:0;left:0;position:absolute;transform:translateX(-83%);border-style:solid;border-width:10px 10px 0 20px;border-color:transparent #182633 transparent transparent}.chat .messaging{display:flex;position:absolute;bottom:0;left:0;right:0;justify-content:space-between;align-items:center;background:#17212b;border-left:1px solid #0e1621}.chat .messaging__input-label{flex:1}.chat .messaging__input-label .messaging__input{width:100%;height:60px;outline:none;font-style:normal;font-weight:300;font-size:14px;line-height:16px;color:#5b6774;background-color:transparent;border:none;padding-left:12px}.chat .messaging__input-label .messaging__input:focus{color:#fff}.chat .messaging__send-button{cursor:pointer;width:112px;height:28px;margin-right:10px;font-style:normal;font-weight:normal;font-size:14px;line-height:16px;color:#fff;background:#5387c1;border-radius:5px;outline:none;border:0;transition:background-color .3s}.chat .messaging__send-button:hover{background:#1f4b80;transition:background-color .3s}.img{position:absolute;display:flex;flex-direction:column;left:50%;top:50%;transform:translate(-50%, -50%);width:364px;height:220px;background:#17212b;border-radius:10px;padding:32px 35px 42px;opacity:1;transition:opacity .5s}.img__error{user-select:none;margin-top:10px;display:flex;font-style:normal;font-weight:300;font-size:12px;line-height:10px;color:rgba(159,159,159,.51);justify-content:center}.img.hidden{opacity:0;transition:opacity .5s}.img.none{display:none}.img .img__close{position:absolute;display:flex;align-items:center;justify-content:center;right:20px;top:20px;width:16px;height:16px;opacity:.3;transition:opacity .5s}.img .img__close:hover{opacity:1;transition:opacity .5s}.img .img__close:before,.img .img__close:after{position:absolute;right:5px;content:" ";height:20px;width:2px;background:#747e87}.img .img__close:before{transform:rotate(45deg)}.img .img__close:after{transform:rotate(-45deg)}.img__title{font-style:normal;font-weight:500;font-size:18px;line-height:21px;color:#fff}.img label{display:flex;align-items:center;justify-content:center;width:86px;height:86px;background:#232f3d;border-radius:50%;outline:none;cursor:pointer}.img__content{display:flex;align-items:center;margin-top:39px;flex-direction:row}.img__content .img__link{width:.1px;height:.1px;opacity:0;overflow:hidden;position:absolute;z-index:-1}.img__content .img__nickname{margin-left:15px;font-style:normal;font-weight:500;font-size:18px;line-height:21px;color:#fff;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}