.face-main{z-index:9999;margin:0 auto;position:absolute;max-width:500px;min-width:300px;border-radius:3px;box-shadow:0 0 30px #555;background:rgba(255,255,255,0.9)}
.face-main ul{list-style:none;margin:0;padding:0;padding:15px}
.face-main .triangle{right:inherit;left:10px;top:-10px;bottom:inherit;transform:rotate(180deg)}
.face-main .face-ul{padding-top:0}
.face-main ul li{display:list-item;list-style:none;background-image:none!important}
.face-main ul.face-tab{list-style:none;background:rgba(255,255,255,0.8)}
.face-tab:hover{cursor:move}
.face-main ul.face-tab li{float:left!important;margin:0;margin-right:1em;display:list-item;text-align:-webkit-match-parent}
.face-main ul.face-tab li a{display:block;padding:0.5em 1em;font-size:13px;text-decoration:none;color:#fff;margin-bottom:-1px;background:#e9e9e9}
.face-main ul.face-tab li a.selected-a{zoom:1;background:#fff!important;color:#ff6700!important;border:1px solid #ff6700;box-shadow:none;text-shadow:none}
.face-main{margin:0;padding:0}
.face-item{cursor:pointer;float:left;border:1px solid!important;overflow:hidden;margin:-1px 0 0 -1px!important;text-align:center!important;border-color:#c7eafb!important;background:none!important;padding:5px!important}
.face-item:hover{border:1px solid #c4ee00!important;background:rgba(196,238,0,0.8)!important;position:relative;z-index:2!important}
.face-item img{display:inline-block;*zoom:1;border:0;margin:0!important;max-width:30px;height:30px;vertical-align:middle}
.face-close{position:absolute;right:15px;top:15px;text-decoration:none;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:16px;line-height:12px;color:#000}
.face-close:hover,.face-close:focus{color:#000;cursor:pointer;opacity:0.4;filter:alpha(opacity=40)}
.clearfix{*zoom:1}
.clearfix:before,.clearfix:after{display:table;line-height:0;content:""}
.clearfix:after{clear:both}
@media screen and (min-width:320px) and(max-width:768px){.face-main{width:100%}
}