/*! LiteWebChat_Frame v2.1.1 | MorFans Lab(c) 2017, BY:SuperPaxxs & Haswikr | https://lab.morfans.cn / Released under the LGPL License */
.lite-chatbox{
font-family:Helvetica,"PingFang TC","Microsoft JhengHei",sans-serif;padding:0;font-size:18px;width:100%;position:relative;overflow-y:auto;overflow-x:hidden
}

.lite-chatbox .cmsg{
position:relative;margin:4px 7px;min-height:50px;border:0
}

.lite-chatbox .cright{
text-align:right;margin-left:64px
}

.lite-chatbox .cleft{
text-align:left;margin-right:64px
}

.lite-chatbox .cleftm{
text-align:left;margin-right:64px
}

.lite-chatbox img.headIcon{
width:40px;height:40px;object-fit:cover;top:9px;position:absolute;border:2px solid
}

.lite-chatbox .name{
color:#8b8b8b;font-size:16px;display:block;line-height:18px
}

.lite-chatbox .namen{
color:#ffffff;font-size:16px;display:block;line-height:18px
}

.lite-chatbox .name>span{vertical-align:middle}

.lite-chatbox .name .htitle{
display:inline-block;padding:0 3px;background-color:#ccc;color:#fff;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;margin-right:4px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;max-width:50px
}

.lite-chatbox .namen>span{vertical-align:middle}

.lite-chatbox .namen .htitle{
display:inline-block;padding:0 3px;background-color:#ccc;color:#fff;-moz-border-radius:4px;-webkit-border-radius:4px;border-radius:4px;margin-right:4px;font-size:11px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:middle;max-width:50px
}

.lite-chatbox .content{
word-break:break-all;word-wrap:break-word;text-align:left;position:relative;display:inline-block;font-size:15px;padding:10px 15px;line-height:20px;white-space:pre-wrap;min-width:9px;min-height:18px
}
.lite-chatbox .content img{
width:auto;height:auto
}
.lite-chatbox .content a{
color:#0072c1;margin:0 5px;cursor:hand
}
.lite-chatbox .tips{
margin:12px;text-align:left;font-size:12px
}
.lite-chatbox .tips span{
display:inline-block;padding:4px;background-color:#ccc;color:#fff;-moz-border-radius:6px;-webkit-border-radius:6px;border-radius:6px
}
.lite-chatbox img.radius{
-moz-border-radius:0%;-webkit-border-radius:0%;border-radius:0%
}

.lite-chatbox .cright img.headIcon{
right:0
}

.lite-chatbox .cleft img.headIcon{
left:0
}

.lite-chatbox .cleftm img.headIcon{
left:0
}

.lite-chatbox .cleftgm img.headIcon{
left:0
}

.lite-chatbox .cright .name{
margin:0 48px 2px 0
}

.lite-chatbox .cleft .name{
margin:0 0 2px 48px
}

.lite-chatbox .cleftm .name{
margin:0 0 2px 48px
}
.lite-chatbox .cleftgm .name{
margin:0 0 2px 48px
}

.lite-chatbox .cleft .namen{
margin:0 0 2px 48px
}

.lite-chatbox .cleftm .namen{
margin:0 0 2px 48px
}
.lite-chatbox .cleftgm .namen{
margin:0 0 2px 48px
}

.lite-chatbox .cright .content{
margin:0 48px 0 0;-webkit-border-radius:20px 0 20px 20px;border-radius:20px 0 20px 20px;color:#fff;background:-webkit-linear-gradient(70deg,#3fd1e1 0,#44d7cd 100%);background:linear-gradient(20deg,#3f8fe1cc 0,#44d7c9 100%);-webkit-box-shadow:5px 5px 15px 0 rgba(102,102,102,.15);box-shadow:5px 5px 15px 0 rgba(102,102,102,.15)
}

.lite-chatbox .cleft .content{
margin:0 0 0 48px;-webkit-border-radius:0 20px 20px 20px;border-radius:0 20px 20px;color:#666;border:1px solid rgba(0,0,0,.05);background:#FFFFFF;-webkit-box-shadow:5px 5px 15px 0 rgba(102,102,102,.1);box-shadow:5px 5px 15px 0 rgba(102,102,102,.1)
}

.lite-chatbox .cleftm .content{
margin:0 0 0 48px;-webkit-border-radius:0 20px 20px 20px;border-radius:0 20px 20px;color:#fff;background:-webkit-linear-gradient(70deg,#3fd1e1 0,#44d7cd 100%);background:linear-gradient(20deg,#3f8fe1cc 0,#44d7c9 100%);-webkit-box-shadow:5px 5px 15px 0 rgba(102,102,102,.1);box-shadow:5px 5px 15px 0 rgba(102,102,102,.1)
}

.lite-chatbox .cleftgm .content{
margin:0 0 0 48px;-webkit-border-radius:0 20px 20px 20px;border-radius:0 20px 20px;color:#fff;background:-webkit-linear-gradient(70deg,#3fd1e1 0,#44d7cd 100%);background:linear-gradient(20deg,#e13f5ecc 0,#d76044 100%);-webkit-box-shadow:5px 5px 15px 0 rgba(102,102,102,.1);box-shadow:5px 5px 15px 0 rgba(102,102,102,.1)
}

.lite-chatbox .cright .content:after{
right:-12px;top:8px
}

.lite-chatbox .cleft .content:after{
left:-12px;top:8px
}

.lite-chatbox .cleftm .content:after{
left:-12px;top:8px
}

.lite-chatbox .cleftgm .content:after{
left:-12px;top:8px
}

.lite-chatbox .tips .tips-primary{
background-color:#3986c8
}

.lite-chatbox .tips .tips-success{
background-color:#49b649
}

.lite-chatbox .tips .tips-info{
background-color:#5bb6d1
}

.lite-chatbox .tips .tips-warning{
background-color:#eea948
}

.lite-chatbox .tips .tips-danger{
background-color:#e24d48
}

.lite-chatbox .name .admin{
background-color:#72d6a0
}

.lite-chatbox .name .owner{
background-color:#f2bf25
}