@charset "utf-8";
/* CSS Document */

/*初始化样式*/
	html{ color:#000000;}
	body,div,ol,ul,li,h1,h2,h3,h4,h5,h6,table,th,td,p,form,span{ margin:0; padding:0; }
	body{ font:Tahoma, Geneva, sans-serif,'宋体'; font-size:12px; line-height:1.5; }
	ol,ul,li{ list-style:none;}
	img{ border:0;}
	.hidden{display:none;}
	
	a{ color:3b5998; text-decoration:none;}
	a:link{ color:#3b5998;}
	a:visited{ color:#3b5998;}
	a:hover{ color:#577ed1;}
	a:active{ color:#577ed1;}
	
/*导入图片*/
	.available,.dnd,.away,.invisible,.unavailable,.group,.stop,.del,.pointTo,.chatToolBar a,.hideGroupMember,.showGroupMember,.groupingList h3,
	.pointToMenu,h3.dropDown,.self a span,.chatTab em,.tips,.chatTips b,.type_subnav .btn_blog,.type_subnav .btn_pic,.type_subnav .btn_video,.friend_update p.more a,
	.friend_update li div.tie_icon,.friend_update li div.message_icon,.friend_update li div.pic_icon,.friend_update li div.blog_icon,.friend_update li div.video_icon,.chatTitle a
	{ background:url(bgimages/chat_icon.gif) no-repeat;}
	#header,.chatTitle,.chatToolBar,.buttonArea,.searchFriend{ background:url(bgimages/chat_x_bg.gif) repeat-x;}
	.buttonArea span,.logo,.searchFriend div span,.subFriend,.subGroup,.subFriendUpdate,.subInbox,.login p button,.check span{ background:url(bgimages/chat_bg.gif) no-repeat;}
	#sidebar,.groupMember{background:url(bgimages/chat_y_bg.gif) repeat-y;}
	
/*主体布局*/	
	#wrapper{ display:none;}
	#header{ height:41px; border-bottom:1px solid #82bbeb; background-position:0 0; overflow:hidden;}
	#container{}
	#container #sidebar{ float:left; width:146px; }
	#container #main{ margin-left:146px;}
	
/*顶部菜单*/
	.topMenu{ margin:9px 0 0 25px;}
	.topMenu .subFriend{ padding-left:25px; background-position:0 -39px; width:45px;}
	.topMenu .subGroup{ padding-left:30px; background-position:-78px -39px; width:47px;}
	.topMenu .subFriendUpdate{ padding-left:26px; background-position:0 -87px; width:79px;}
	.topMenu .subInbox{ padding-left:29px; background-position:0 -108px; width:72px;}
	.topMenu a{ float:left; display:block; height:22px; line-height:22px; color:#fff; font-size:14px; font-weight:bold; margin-right:40px;}
	.topMenu a:visited{ color:#fff;}
/*LOGO*/	
	.logo{ float:right; margin-top:3px; margin-right:15px; _display:inline; width:103px; height:35px; background-color:#000; background-position:0 0;}

/*对话人列表*/
	.chatTab{ margin-top:30px; margin-left:10px; overflow:hidden; position:relative;}
	.chatTab em{ display:block; height:16px; width:126px; cursor:pointer; background-color:#f9fcff; border:1px solid #d0e2f0; background-position:44px -194px; display:none;}
	.chatTab em.moreCall{width:128px; height:18px; background:url(bgimages/morechater.gif); border:0;}
	.chatTab em.selected{ background-color:#9eccf3; border:0;}
	.chatTab li{ margin-bottom:6px; width:126px; height:28px; line-height:28px; text-indent:27px; background-color:#f9fcff; border:1px solid #d0e2f0; color:#3b5998; cursor:pointer;}
	.chatTab li.newCall{ background:url(bgimages/new_call.gif); border:0; width:128px; height:30px; font-weight:bold; color:#333;}
	.chatTab li img,.chatTab li div p{ display:none;}
	.chatTab li div span{ display:block; width:105px; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;}
	.chatTab li a{ text-indent:0;}
	
	/*当前对话*/
	.chatTab li.nonce{ padding-top:10px; width:135px; height:45px; background:#fff; border-right:0; text-indent:10px;}
	.chatTab li.nonce img{ float:left; margin-left:8px; display:block; _display:inline; width:32px; height:32px;}
	.chatTab li.nonce div{ margin-left:35px; line-height:18px;}
	.chatTab li.nonce div span{ font-weight:bold; width:73px;}
	.chatTab li.nonce div p{ display:block;}
	p.available,p.dnd,p.away,p.invisible,p.unavailable{ text-indent:23px; color:#999; }
	p.available{background-position:3px -4px;}
	p.away{background-position:3px -31px;}
	p.dnd{background-position:3px -58px;}
	p.invisible{background-position:3px -85px;}
	p.unavailable{background-position:3px -112px;}

/*聊天窗口*/
	.chat{ _float:left; background:#FFF;}
	/*标题栏*/
	.chat .chatTitle{ margin-left:5px; height:30px; background-position:0 -42px; border-bottom:1px solid #d0e2f0;border-left:1px solid #d0e2f0;}
	.chat .chatTitle span{ margin-left:10px; line-height:30px; font-size:14px; font-weight:bold; color:#666666;}
	.chat .chatTitle span em{ font-style:normal;}
	.chat .chatTitle a{ float:right; display:block; margin-right:20px; line-height:30px; text-indent:25px; background-position:-5px -724px;}
	/*聊天内容区*/
	.chat .chatArea{ _float:left; position:relative;}
	.chat .chatBody{ margin-left:5px; overflow-x:auto; overflow-y:auto;}
	.chat .chatBody ul{ padding:10px 20px; }
	.chat .chatBody li{ margin-bottom:10px;}
	.chat .chatBody li.myself div .name{ color:#008000;}
	.chat .chatBody li div .name{ color:#3b5998; font-weight:bold;}
	.chat .chatBody li div .time{ color:#999; padding-left:8px;}
	.chat .chatBody li div.content{ padding-left:18px; margin-top:3px; word-wrap:break-word; word-break:break-all;}
	.chat .chatBody li.chatTips{  padding-bottom:6px; _height:1%; display:inline-block;}
	.chat .chatBody li.chatTips b{ float:left; width:17px; height:17px; background-position:-8px -513px;}
	.chat .chatBody li.chatTips em{ margin-left:23px; display:block; font-style:normal; color:#999; line-height:22px; }
	.chat .chatBody li.chatTips em img{ margin:0 3px; vertical-align:middle;}
	/*群组成员右侧列表*/
	.chat .groupMember{ float:right; background-position:-146px 0; width:130px; overflow-x:hidden; overflow-y:auto;}
	.chat .groupMember ul{ margin:6px 0 6px 6px;}
	.chat .groupMember li{ padding-left:29px; line-height:23px; white-space:nowrap; word-break:keep-all; text-overflow:ellipsis; width:90px; overflow:hidden;}
	.chat .hideGroupMember{ width:8px; height:40px; background-position:-7px -457px; position:absolute; right:120px; cursor:pointer;}
	.chat .showGroupMember{ float:right; width:11px; height:43px; background-position:-13px -457px; cursor:pointer; display:none;}
	/*聊天工具条*/
	.chat .chatToolBar{ _margin-left:-5px; height:30px; background-position:0 -73px; overflow:hidden;}
	.chat .chatToolBar a{ display:block; margin-left:20px; margin-top:5px; width:22px; height:20px; background-position:-5px -304px; }
	.chat .chatToolBar a:hover{ border:1px solid #8ABAD7; background-color:#DEECF8; cursor:pointer; }
	/*聊天文本输入区*/
	.chat .chatInput{ margin-left:5px; overflow:hidden; height:76px; }
	.chat .chatInput div{ width:100%; overflow:hidden;}
	.chat .chatInput textarea{ margin:3px 0; width:100%; height:75px; line-height:18px; text-align:left; font-size:12px; border:0; color:#333; overflow:auto; word-break:break-all;}
	/*按钮区域*/
	.chat .buttonArea{height:39px; background-position:0 -103px;}
	.chat .buttonArea span{ float:right; margin-right:10px; margin-top:8px; display:inline-block; width:70px; height:23px; background-position:-104px 0; cursor:pointer;}
	
	/*相关提示*/
	.tips{ margin-left:5px; padding-left:33px; height:27px; line-height:27px; background-color:#fff8de; background-position:1px -509px; display:none;}
	.tips a{ font-weight:bold; text-decoration:underline;}
	
	
/*会话人标识*/	
	.self{ position:absolute; bottom:15px; left:20px; width:130px;}
	.self img{ float:left; width:32px; height:32px;}
	.self div{ margin-left:38px;}
	.self div b{ display:block; width:66px; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis;}
	.self div a{ display:block; margin-left:-13px; cursor:default;}
	.self a span{ display:block; width:80px; height:20px; text-indent:23px; background-position:58px -283px; *+background-position:52px -283px;}
	a.available{background-position:3px -4px;}
	a.away{background-position:3px -31px;}
	a.dnd{background-position:3px -58px;}
	a.invisible{background-position:3px -85px;}
	a.unavailable{background-position:3px -112px;}
	
	.pointTo{ position:absolute; bottom:37px; left:129px; width:18px; height:16px; background-position:-6px -262px;}
	/*更改当前状态*/
	.changeState{ width:110px; background:#f9fcff; border:1px solid #9eccf3; color:#3b5998; position:absolute; bottom:10px; left:125px; z-index:1100; display:none;}
	.changeState ul{ margin:6px 0;}
	.changeState li{ padding-left:30px; width:80px; line-height:24px; cursor:default;}
	
/*下拉菜单好友分组列表*/
	.dropDiv{ position:absolute; top:30px; left:6px; z-index:10; display:none; }
	.dropMenu{ width:165px; border:1px solid #9eccf3; border-top:0;}
	.dropMenu .pointToMenu{ margin-left:73px; width:65px; height:5px; _font-size:0; background-position:-6px -441px;}
	/*查找朋友*/
	.dropMenu .searchFriend{ height:35px; padding-top:9px; border-bottom:1px solid #c3e2fc; background-position:0 -142px;}
	.dropMenu .searchFriend div{ margin-left:8px; overflow:hidden; width:147px; height:24px; border-width:1px; border-style:solid; border-color:#999999 #dbdbdb #dbdbdb #999999;  background-color:#FFF;}
	.dropMenu .searchFriend div span{ float:right; margin-top:5px; margin-right:3px; _display:inline; background-position:-104px -24px; width:14px; height:14px;}
	.dropMenu .searchFriend div input{ margin-top:3px; margin-left:3px; width:115px; border:0; font-size:12px; color:#999;}
	/*查找朋友结果*/
	.dropMenu .searchResult{ position:absolute; top:39px; left:9px; width:147px; overflow-y:auto; background:#fff; border:1px solid #C0D9EB; display:none;}
	.dropMenu .searchResult ul{ margin:5px; overflow:hidden;}
	.dropMenu .searchResult li{ width:120px; line-height:22px; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
	.dropMenu .resultsSroll{ height:240px;}
	.dropMenu .searchResult li.available,.dropMenu .searchResult li.dnd,.dropMenu .searchResult li.away,.dropMenu .searchResult li.invisible,.dropMenu .searchResult li.unavailable{ text-indent:26px; }
	.dropMenu .searchResult li.active{ background-color: #edf5fc;}
	/*分组列表（好友与聊天群共用）*/
	.dropMenu .groupingList{ padding:6px; height:270px; background:#f7fbff; overflow-x:hidden; overflow-y:auto;}
	.dropMenu .groupingList h3{ padding-left:15px; line-height:21px; font-size:12px; color:#666666; background-position:-6px -410px; cursor:default; width:112px; white-space:nowrap; word-break:keep-all; text-overflow:ellipsis; overflow:hidden;}
	.dropMenu .groupingList h3.dropDown{ background-position:-7px -282px;}
	.dropMenu .groupingList h3 span{ margin-left:3px; font-size:11px; font-weight:normal;}
	.dropMenu .groupingList li{ margin-left:6px; padding-left:26px; line-height:22px; cursor:default; width:102px; white-space:nowrap; word-break:keep-all; text-overflow:ellipsis; overflow:hidden;}
	/*设置半透明背景*/
	.transDiv{ width:167px; height:326px; background:#4b4b4b; border-bottom:1px solid #000; border-right:1px solid #000; position:absolute; left:3px; top:10px; z-index:-9; opacity:0.2; filter:alpha(opacity=20);}

	/*下拉菜单聊天群分组列表*/
	.GroupList{ left:125px; *+left:127px;}
	.GroupList .groupingList{ height:315px;}
	
	/*下拉菜单好友动态列表*/
	.friendUpdate{ left:245px;}
	.friendUpdate .dropMenu{ width:230px; height:332px;}
	.friendUpdate .dropMenu .pointToMenu{margin-left:97px; }
	.friendUpdate .transDiv{ height:326px; width:232px;}
	.friend_update{ _width:100%; height:297px; background:#f7fbff; overflow-y:scroll; overflow-x:hidden;}
	.friend_update li{ margin:0 1px; padding:5px 0 3px;border-bottom:1px solid #cedde8;}
	.friend_update div.update_content{ margin-right:3px; margin-left:27px;}
	*html .friend_update div.update_content { margin-left:25px;}
	.friend_update div.update_content p{ line-height:17px; word-break: break-all; color:#666;}
	.friend_update div.update_content p img{ padding:3px 20px 3px;}
	.friend_update div.update_content p span{ margin-right:6px;}
	.friend_update div.update_content p.title { padding-bottom:2px; color:#000;}
	.friend_update div.update_content p.link{word-break:break-all;}
	.friend_update div.update_content p.update{ font-family:"宋体";}
	.friend_update div.update_content p.update span{ color:#B4B4B4;}
	.friend_update div.update_content li{ float:left; width:70px; border:none;}
	.friend_update p.more { padding:10px 0 5px 0; text-align:right;}
	.friend_update p.more a { padding-right:22px; float:none; background-position:right -703px;}
	*html .friend_update p.more a {background-position:right -704px;}
	.friend_update li div.tie_icon,.friend_update li div.message_icon,.friend_update li div.pic_icon,.friend_update li div.blog_icon,.friend_update li div.video_icon
	{width:18px; height:18px; margin-left:3px; float:left; _display:inline;}
	.friend_update li div.tie_icon{ background-position:-8px -549px;}
	.friend_update li div.message_icon{ background-position:-8px -642px;}
	.friend_update li div.pic_icon{ background-position:-8px -672px;}
	.friend_update li div.blog_icon{ background-position:-8px -580px;}
	.friend_update li div.video_icon{ background-position:-8px -611px;}
	
	.type_subnav{ padding-left:5px; height:30px; background-color:#d3e8f7; overflow:hidden;}
	.type_subnav a{ float:left; margin-top:3px; padding:0 3px; display:block; width:auto; color:#000000; padding-left:23px; margin-right:5px; border:1px solid #d3e8f7; height:22px; line-height:25px; _line-height:23px;}
	.type_subnav a:hover { text-decoration:none; background-color:#d8edfd; border:1px solid #6ca0c7;line-height:25px; _line-height:23px; height:22px; cursor:pointer;}
	.type_subnav .btn_blog{ background-position:-6px -577px;}
	.type_subnav .btn_pic{ background-position:-5px -670px;}
	.type_subnav .btn_video{ background-position:-5px -608px;}
	
	
	/*下拉菜单收件箱*/
	.Inbox{ left:436px; }
	.Inbox .dropMenu{ width:138px;}
	.Inbox .dropMenu .pointToMenu{margin-left:57px; }
	.Inbox .InboxList{padding:6px; height:270px; background:#f7fbff; height:252px;}
	.Inbox .InboxList a{ display:block; width:126px; height:28px; line-height:28px; text-indent:16px; color:#333333;}
	.Inbox .InboxList a:hover{ background:#e4f2ff;}
	.Inbox .InboxList a span{ margin-left:5px; color:#F00;}
	.Inbox .transDiv{ height:263px; width:140px;}
	
/*选择表情*/
	.emotDiv{ position:absolute; bottom:143px; left:164px; width:385px; height:169px; background:url(bgimages/emoticon.png); display:none;}
	.emotDiv table{ margin:3px; width:379px; height:163px; border-collapse:separate;}
	.emotDiv table td{ width:21px; height:21px;}

/*更多对话好友*/
	.moreChater{ width:150px; border-width:4px; border-color:#9eccf3; border-style:solid;/* border:3px solid #d0e2f0;*/ background:#f9fcff; position:absolute; left:136px; display:none;}
	.moreChater ul{ padding:5px;}
	.moreChater ul li{ height:24px; border:1px solid #f9fcff;}
	.moreChater ul li.call{ background-color:#fafae4; border:1px solid #e0b27f}
	.moreChater ul li.newCall{ background-color:#fafae4; border:1px solid #e0b27f}
	.moreChater ul li span{ display:block; text-indent:28px; width:100px; height:24px; line-height:24px; overflow:hidden; word-break:keep-all; white-space:nowrap; text-overflow:ellipsis; cursor:default;}
	.moreChater ul li span.available{ background-position:0 -2px;}
	.moreChater ul li span.away{ background-position:0 -29px;}
	.moreChater ul li span.dnd{ background-position:0 -56px;}
	.moreChater ul li span.invisible{ background-position:0 -83px;}
	.moreChater ul li span.unavailable{ background-position:0 -110px;}
	.moreChater ul li span.stop{ background-position:0 -164px;}
	
	.moreChater ul li a{ display:none;}
	.moreChater ul li img,.moreChater ul li div p{ display:none;}
	.moreChater ul li.moreHover{ background-color:#f4f9fd; border:1px solid #d0e2f0;}
	.moreChater ul li.moreHover a{ display:block; _display:inline; margin-top:7px;}
	.moreScroll{ height:218px; overflow-x:auto; overflow-y:auto;}


/*状态图标定义*/
	li.available{ background-position:0 -3px;}
	li.away{ background-position:0 -30px;}
	li.dnd{ background-position:0 -57px;}
	li.invisible{ background-position:0 -85px;}
	li.unavailable{ background-position:0 -111px;}
	li.stop{ background-position:0 -165px;}
	
	span.available{ background-position:0 0;}
	span.away{ background-position:0 -27px;}
	span.dnd{ background-position:0 -54px;}
	span.invisible{ background-position:0 -81px;}
	span.unavailable{ background-position:0 -108px;}
	span.group{ background-position:0 -135px;}
	span.stop{ background-position:0 -162px;}
	
/*删除按钮*/
	.del{ float:right; margin-right:8px; margin-top:10px; _display:inline-block; font-size:0; width:10px; height:10px; background-position:-9px -220px;}
	.del:hover{ background-position:-8px -241px; }

/*半透明遮罩层*/
	#shadeDiv{ background:#000; opacity:0.2; filter:alpha(opacity=20); position:absolute; top:0; left:0; z-index:3000; width:100%; display:none;}

/*弹出层-登陆窗口*/
	.popBox{ width:380px; height:250px; background:#fff; border:1px solid #a2b8cc; position:absolute; z-index:3001; display:none;}
	.popBox h3{ padding-left:11px; border-top:1px solid #c0ddf5; height:30px; line-height:30px; background:#a4d0f5; color:#fff; font-size:12px;}
	.popBox .login{ margin:10px 15px;}
	.popBox .login em{ margin-left:25px; margin-bottom:8px; color:#666; display:block; font-style:normal;}
	.popBox .login div label{ display:block; margin-left:25px; width:310px; height:35px; line-height:32px; text-align:left;}
	.popBox .login div label u{ width:60px; text-align:right;}
	.popBox .login div input{ border-color:#a6a5a5 #d8d8d8 #d8d8d8 #a6a5a5; border-width:1px; border-style:solid; width:180px; height:17px; padding:2px; font-size:12px;}
	.popBox .login div span{ clear:both; margin-left:5px; color:#F00; visibility:hidden;}
	.popBox .login p{ margin-left:83px; margin-top:4px;}
	.popBox .login p button{ display:block; margin:10px 0 15px 0; border:0; width:70px; height:23px; background-position:0 -64px; cursor:pointer;}
	.popBox .login p a{ margin-right:20px;}
	.popBox .login p a:hover{ text-decoration:underline;}
	/*登陆Loading*/
	.popBox .loginLoading{ width:200px; height:60px; margin:45px auto; display:none;}
	.popBox .loginLoading p{ line-height:25px; margin-left:40px;}
	/*断开连接，重新登录*/
	.popBox .reLink{ width:200px; margin:70px auto; line-height:22px; display:none;}
	
	/*验证码*/
	#checkCode{ width:298px; height:200px;}
	.popBox .check{ margin:25px 58px; overflow:hidden;}
	.popBox .check input{ margin:10px 0; padding:2px; width:174px; border-width:1px; border-style:solid; border-color:#a1a1a1 #dcdcdc #dcdcdc #a1a1a1;} 
	.popBox .check span{ float:right; margin-right:2px; display:block; width:70px; height:23px; background-position:-70px -64px; cursor:pointer;}
	
	/*初始化提示*/	
	#init{ position:absolute; top:50%; left:50%; height:20px; width:280px; margin-left:-54px; color:#06C; z-index:-1; display:none;}

/*进入聊天窗口Loading*/
	#loadingWebuc{ position:absolute; left:0; top:0; z-index:3003; background:#fff; width:100%; display:none;}
	#loadingWebuc .Loading{ width:200px; margin:auto;}
	#loadingWebuc .Loading p{ line-height:25px; margin-left:40px;}


/*设置滚动条样式（仅限IE下有效）*/
	.dropMenu .groupingList,.chat .groupMember,.chat .chatBody,.dropMenu .resultsSroll{
		scrollbar-face-color:#fcfeff;/*滑块颜色 /滚动条凸出部分的颜色*/
		scrollbar-hightlight-color:#ffffff;/*高亮颜色 /滚动条空白部分的*/
		scrollbar-3dlight-color:#d0e2f0;/*三维光线颜色 /滚动条亮边的颜色*/
		scrollbar-darkshadow-color:#ffffff;/*暗影颜色 /滚动条强阴影的颜色*/
		scrollbar-shadow-color:#d0e2f0;/*阴影颜色 /立体滚动条阴影的颜色*/
		scrollbar-arrow-color:#d0e2f0;/*箭头颜色 /上下按钮上三角箭头的颜色*/
		scrollbar-tack-color:#ffffff;/*滑道颜色 /滚动条的背景颜色*/
	}