/* 
	style used in:
		classroom.jsp
*/

#chatOverlay{
	top:10%;
	left:277px;/*(Width of main-Width of self)/2*/
	position:absolute;
	width:410px;
	border:2px solid #960000;
}

#chatOverlay #titleBar,#chatOverlay #mainPanel,#mainPanel #userPanel,#chatOverlay #title,
#mainPanel #messageList,#mainPanel #userPanel .tab,#userPanel .tab .recieverName,#userPanel .tab .closeIcon,
#mainPanel #bottomPanel,#bottomPanel #messageEditor,#bottomPanel #sendBtn, #bottomPanel #closeBtn,
#chatOverlay #operationMenu,#operationMenu #hideConv,#operationMenu #endConv,
.userMessages .message .header,.userMessages .message .content{
	float:left;	
}

#chatOverlay #titleBar{
	height:27px;
	width:100%;			
	background:url(../../../images/module/classroom/conversation/top_bg.png) repeat-x;
}

#chatOverlay #operationIcon{
	float:right;
	width:42px;
	height:19px;
	margin-right:5px;
	background:url(../../../images/module/classroom/conversation/conversation_drop_icon.png) no-repeat;
}

#chatOverlay #title{
	color:#fff;
	font-size:18px;
	padding-top:3px;
	margin-left:15px;
}

#chatOverlay #mainPanel{
	width:100%;
	min-height:300px;
	background-color:#fff;
}

#mainPanel #userPanel{	
	background:url(../../../images/module/classroom/conversation/users_panel_bg.png) no-repeat bottom;
	min-height:25px;
	min-width:100%;
	padding:0 5px; 
}

#mainPanel #messageList{
	width:95.5%;
	margin-left:2%;
	max-height:180px;
	min-height:180px;
	overflow-y:auto;
	overflow-x:hidden;
	position:relative;
}

#messageList .userMessages{
	max-height:180px;
	width:96%;
	top:0;
	left:0;
	position:absolute;
}

#messageList .userMessages .message{
	float:left;
	width:100%;
	margin:5px 0;
	color:#434343;
	word-wrap:break-word;
}

#messageList .userMessages .message.system{
	color:#960000;
}

.userMessages .message .header{
	width:100%;
}

.userMessages .message .content{
	margin-left:15px;
	margin-top:5px;
	width:95%;
	word-wrap:break-word;
}

#mainPanel #userPanel .tab{
	padding-top:3px;
	height:20px;
	width:80px;
	color:#434343;
	background:url(../../../images/module/classroom/conversation/tab_line.png) no-repeat;
}

#userPanel .tab .recieverName{
	cursor:pointer;
	margin-left:3px;
	padding-left:15px;
	/*width:38px;*/
}

.instructorCon #userPanel .current .closeIcon{
	width:10px;
	margin-right:3px;
	float:right;
	background:url(../../../images/module/classroom/conversation/conversation_close_btn.png) no-repeat center;
}

#mainPanel #userPanel .tab.current .recieverName{
	background:url(../../../images/module/classroom/conversation/current_tab.png) no-repeat left center;	
}

#mainPanel #userPanel .tab.first{
	background:none;	
}

#mainPanel #userPanel .tab.newMessage{
	background-color:#fddfa0;
}

#mainPanel #bottomPanel,#bottomPanel #messageEditor,#bottomPanel #sendBtn,#bottomPanel #closeBtn{
	width:100%;
}

#mainPanel #bottomPanel{
	margin-top:5px;
	height:145px;
	background:url(../../../images/module/classroom/conversation/bottom_bg.png) repeat-x;	
}

#messageEditor textarea{
	border:1px solid #929292;
	width:95.5%;
	height:105px;
	margin-left:2%;
	font-family:Arial,Helvetica,sans-serif;
	font-size:12px;
}

#bottomPanel #sendBtn .button, #bottomPanel #closeBtn .button{
	width:100px;
}

#chatOverlay #operationMenu{
	height:65px;
	position:absolute;
	width:130px;
	top:20px;
	right:0px;
	background:url(../../../images/module/classroom/conversation/drop_down_menu.png) repeat-x;
}

#operationMenu #hideConv{
	border-bottom:1px solid #929292;
}

#operationMenu #hideConv,#operationMenu #endConv{
	height:20px;
	padding-top:8px;
	margin-left:3px;
	vertical-align:middle;
	color:#434343;
	width:115px;		
} 

#operationMenu span{
	cursor:pointer;
	margin-left:7px;
}

#minimizeChatOverlay{
	position:fixed;
	bottom:0;
	left:0;
	width:170px;	
	height:32px;
	background:url(../../../images/module/classroom/conversation/conversation_bg.png) no-repeat;
	z-index:9999;
}

#minimizeChatOverlay.blink{
	background:url(../../../images/module/classroom/conversation/conversation_bg_yellow.png) no-repeat;
}

#minimizeChatOverlay .label{
	float:left;
	margin-left:5px;
	margin-top:7px;
	width:107px;
	background:url(../../../images/module/classroom/conversation/conversation_title.png) no-repeat center;
}

#minimizeChatOverlay .resizeIcon{
	float:right;
	margin-right:5px;
	margin-top:4px;
	width:21px;
	height:21px;
	background:url(../../../images/module/classroom/conversation/conversation_window_icon.png) no-repeat center;
}

#confirmLeaveChat .button .middle a{
	margin:0;
}