
*{
  margin:0;
  padding:0;
}
html,body{
  width:100%;
  height: 100%;
  overflow:hidden;
  position: relative;
}

ul,li{
  list-style: none;
}
.mainWrapper{
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
/*头像*/
.headPortraitWrapper{
  width: 42px;
  height: 42px;
  position: relative;
  cursor: pointer;
}
.headPortraitWrapper img{
  width:100%;
  border-radius: 50%;
  font-size: 0;
}
.headPortraitWrapper>span{    
  position: absolute;
  top:auto;
  left:-4px;
  bottom:-4px;
  margin:0!important;
}
.headPortraitWrapper>span:after{
  content: '';
  display: block;
  width: 100%;
  height: 100%;
  border:2px solid #fff;
  position: absolute;
  top:0;
  left:0;
  border-radius: 50%;
  box-sizing: border-box;
}
/*点点点loading*/
.mainWrapper >.loading-box{
  width: 70px;
  height: 70px;
  background-color: rgba(0, 0, 0, 0.8);
  border-radius: 18px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.mainWrapper >.loading-box .loading-child{
  display: inline-block;
  width:8px;
  height: 8px;
  border-radius: 50%;
  background-color: #ffffff;
  margin-right: 5px;
  opacity: 0.3;
}
.mainWrapper >.loading-box .loading-child:last-of-type{
  margin-right: 0;
}
.mainWrapper >.loading-box .loading-child-left{
  animation: changeleft 2s linear 0s infinite;
}
.mainWrapper >.loading-box .loading-child-center{
 animation: changecenter 2s linear 0s infinite;
}
.mainWrapper >.loading-box .loading-child-right{
 animation: changeright 2s linear 0s infinite;
}
@keyframes changeleft{
  0% {opacity: 1;}
  20% {opacity: .3;}
  40% {opacity: .3;}
  60% {opacity: .3;}
  80% {opacity: .3;}
  100% {opacity: .3;}
}
@keyframes changecenter{
  0% {opacity: .3;}
  20% {opacity: .3;}
  40% {opacity: 1;}
  60% {opacity: .3;}
  80% {opacity: .3;}
  100% {opacity: .3;}
}
@keyframes changeright{
  0% {opacity: .3;}
  20% {opacity: .3;}
  40% {opacity: .3;}
  60% {opacity: .3;}
  80% {opacity: 1;}
  100% {opacity: .3;}
}
/*遮罩层*/
.mainUserList .el-dialog--center{
  width: 460px;
  height: 613px;
  border-radius: 6px;
  overflow:hidden;
}
.mainUserList .el-dialog__header{
  padding-top: 21px;
}
.mainUserList .el-dialog__body{
  height: calc(100% - 53px);
  padding:0;
}
.mainUserList .el-dialog__title{
  font-family: SFUIText;
  font-size: 16px;
  font-weight: 500;
  line-height: 18px;
  color: #484848;
}
.el-dialog__close{
  font-size: 24px;
}
.el-checkbox__inner{
  height: 20px;
  width: 20px; 
  background-position:-30px -162px;
  background-size:700px 760px;
  border:none;
}
.el-checkbox__input.is-checked .el-checkbox__inner{
  background-position: -56px -162px!important;
}
.el-checkbox__inner:after{
  border:none;
}
.el-checkbox__label{
  display: none;
}
/*corretion style*/
.falseTextBox{
  padding-top: 10px;
}
.trueTextBox,.falseTextBox{
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.falseText{
  color: #f54a41;
  text-decoration: line-through;
}
.trueText{
  color: #48a235;
}
/*img preview style*/
.imageWrapper .el-dialog__wrapper{
  display: flex;
  justify-content: center;
  align-items: center;
}
.imageWrapper .el-dialog{
  width: auto;
  margin:0!important;
  display: inline-block;
  background:transparent;
}
.imageWrapper .el-dialog__header{
  display: none;
}
.imageWrapper .el-dialog__body{
  display: inline-block;
  margin:0;
  padding:0;
}
/*.lastMsgContent .emojione,.textWrapper .emojione*/
.emojione{
  transform: scale(.5);
  transform-origin: center center;
  margin:-8px -7px;
}
.emoji-mart-bar:last-of-type,.emoji-mart-search{
  display: none;
}
.msgInputWrapper .emojione{
  transform: scale(.8);
  margin:0;
}
/*dropdown-menu*/
.el-dropdown-menu{
  margin-right: 6px;
}
/*correction*/
.msgItemBigWrapper>.el-dialog__wrapper .el-dialog{
  width:460px;
  border-radius: 6px;
}
.msgItemBigWrapper>.el-dialog__wrapper .el-dialog__body{
  padding:0;
}
/*emojipack*/
.emoji-mart{
  width: 100%!important;
}
.emoji-mart-scroll{
  text-align: left;
}
/*videoMsg*/
.videoWrapper .el-dialog{
  font-size: 0;
}
.videoWrapper .el-dialog__header{
  display: none;
}
.videoWrapper .el-dialog__body{
  padding:0;
  display: inline-block;
}
.videoWrapper .el-dialog.el-dialog--center{
  width: 800px;
}


@keyframes change{
  0%{-webkit-transform:rotate(0deg);}
  50%{-webkit-transform:rotate(180deg);}
  100%{-webkit-transform:rotate(360deg);}
}
/*profile关闭按钮*/

.profileCloseBtn{
  width: 26px;
  height: 26px;
  border:none;
  outline: none;
  cursor: pointer;
  font-size: 20px;
  font-weight: 600;
  color: #626262;
  margin-right: 13px;
  background:transparent;
}



.filePreviewBox .el-dialog{
  border-radius: 10px;
  width: auto;
  display: inline-block;
}
.filePreviewBox .el-dialog__body{
  padding:0 10px;
  overflow:hidden;
}
.videoWrapper .el-dialog.el-dialog--center{
  width: auto;
  display: inline-block;
}
.videoWrapper .el-dialog__wrapper{
  text-align: center;
}
.trueText,.falseText{
  display: inline-block;
}
.founded_url{
  color: #2554A5;
  text-decoration: none;
}
.aiteUsername,.highlightedAt{
  font-style: normal;
  color: #2554A5;
  cursor: pointer;
}
.remindAt{
  color: #F54A41;
}

/*emoji picker*/
.emojiPicker .emojione{
  transform:scale(.7);
  margin:0px;
}