@charset "utf-8";
.Panel.MsgList { position: absolute; top: 110px; bottom:81px; opacity: 0; width: 96%; left: 50%; margin-left: -48%; display: none;}
.MsgList .MsgItem { width: 100%; height: 32%; position: relative; background-color: rgba(18, 96, 176, 0);
background: -webkit-gradient(linear,0 0,0 100%,from(rgba(255, 255, 255, 0.11)),to(rgba(255, 255, 255, 0.34)));
background: -moz-linear-gradient(top, rgba(255,255,255,0.11) 0%,rgba(255,255,255,0.34) 100%);
border: 1px solid rgba(255, 255, 255, 0);border-radius: 6px; -webkit-border-radius: 6px; -moz-border-radius: 6px; margin: 0 0 .5% 0 }
.MsgList .MsgItem:last-child { margin-bottom: 0 }
.MsgList .MsgItem .head { position: absolute; background-color: #fff; border-radius: 100%;
border: 5px solid rgba(255, 255, 255, 0.82); -webkit-border-radius: 100%; -moz-border-radius: 100%; background-size: cover }
.MsgList .MsgItem .nickname { position: absolute; overflow: hidden; color: #FFFFFF;
text-shadow: 0 0px 8px rgba(0, 0, 0, 0.37);}
.MsgList .MsgItem .msgword { position: absolute; overflow: hidden; color: #FFF;
text-shadow: 0 0px 8px rgba(0, 0, 0, 0.37);}
.msgin { -webkit-animation: msgin-transform 1s .2s ease both; -moz-animation: msgin-transform 1s .2s ease both }
.faceicon { display: inline-block; overflow: hidden; position: relative; margin: 0; padding: 0; display: none; vertical-align: middle }
.faceicon img { width: 2880px; height: 64px; position: absolute; top: 0; left: 0 }
@-webkit-keyframes msgin-transform { 0 {
-webkit-transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-webkit-transform:perspective(400px) rotateX(-10deg)
}
70% {
-webkit-transform:perspective(400px) rotateX(10deg)
}
100% {
-webkit-transform:perspective(400px) rotateX(0);
opacity:1
}
}
@-moz-keyframes flipInX { 0 {
-moz-transform:perspective(400px) rotateX(90deg);
opacity:0
}
40% {
-moz-transform:perspective(400px) rotateX(-10deg)
}
70% {
-moz-transform:perspective(400px) rotateX(10deg)
}
100% {
-moz-transform:perspective(400px) rotateX(0);
opacity:1
}
}