@charset "utf-8";
.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);}*/
.msg_body{
	display:flex;
	display:webkit-flex;
	justify-content: center;
	flex-direction:column;
	margin-left: 90px;
    overflow: hidden;
	height:100%;
}
.msg_body .nickname{
	height:40%;
	display:flex;
	display:webkit-flex;
	align-items:center;
	color:#fff;
}
.msg_body .msgword{
	height:60%;
    word-wrap: break-word;
    word-break: break-all;
	overflow:hidden;
	color:#fff;
	text-align:left;
}
.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
}
}