
#ListMainHistory {
	position : absolute;
	left: 326px;
	top: 139px;	
	width: 905px;     
	height: 517px;
}
#history_loading_animation{
	position:absolute;
	left:406px;
    top:168px;
    width:64px;
    height:64px;
}
#history_loading_message
{
    position:absolute;
	left:340px;
    top:245px;
    width:200px;
    height:30px;
    color:rgb(255,255,255);
    font-size:20px;
    text-align: center;
}


#historyList{
	position: absolute;
	left: 0px;
	top: 17px;
	width: 905px;     
	height: 450px;
	display: none;
}

.historyItem_Container{
	position: absolute;
    /* left: 0px; */	
	/* width: 682px; */
    display:none;
}


.historyItem1NormalUp{
	top: 16px;
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem1NormalDown{
	top: 16px;
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem1Highlight{
	top: 7px;
	left: 0px;
	width: 905px;
	height: 108px;
	z-index:2;
}

.historyItem2NormalUp{
	top: 104px;
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem2NormalDown{
	top: 104px;	
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem2Highlight{
	top: 95px;
	left: 0px;
	width: 905px;
	height: 108px;
	z-index:2;
}

.historyItem3NormalUp{
	top: 192px;
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem3NormalDown{
	top: 192px;	
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem3Highlight{
	top: 183px;
	left: 0px;
	width: 905px;
	height: 108px;
	z-index:2;
}

.historyItem4NormalUp{
	top: 280px;
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem4NormalDown{
	top: 280px;	
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem4Highlight{
	top: 271px;
	left: 0px;
	width: 905px;
	height: 108px;
	z-index:2;
}


.historyItem5NormalUp{
	top: 368px;
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem5NormalDown{
	top: 368px;	
	left: 3px;
	width: 899px;
	height: 88px;	
	z-index:1;
}
.historyItem5Highlight{
	top: 359px;
	left: 0px;
	width: 905px;
	height: 108px;
	z-index:2;
}

.cHistoryItem_Status{
	position: absolute;	
	width: 64px;
	height: 64px;
}

.cHistoryItem_Status_Normal{
    top: 12px;
    left: 66px;
    text-align:left;	
}

.cHistoryItem_Status_Highlight{
    top: 20px;
    left: 116px;	
	text-align:right;
}

.cHistoryItem_Online{
	position: absolute;	
	width: 35px;
	height: 35px;
}

.cHistoryItem_Online_Normal{
    top: 11px;
    left: 118px;	
}
.cHistoryItem_Online_Highlight{
    top: 15px;
    left: 192px;	
}

.cHistoryItem_Name{
	position: absolute;
    text-align:left;
    vertical-align:middle;	
    overflow: hidden;	
    white-space : nowrap;	    
}

.cHistoryItem_Name_Normal{
	top: 11px;	
	left: 160px;		
	width: 720px;     
	height: 35px;	    
	color:rgb(255,255,255);
	font-size:28px;
	position: absolute;
    text-align:left;
    vertical-align:middle;		
	text-overflow : ellipsis;

}
.cHistoryItem_Name_Highlight{
    top: 15px;	
    left: 228px;
	width: 300px;	    
	height: 35px;	
	color:rgb(255,255,255);  
    font-size:28px;
}


#historyTextLengthChecker {
	position: absolute;
    left: 0px;  
	top: -25px;		
	height: 22px;
    font-size:20px; 
	visibility: hidden;
}

.cHistoryItem_Name_Highlight_Marquee{
    top: 15px;	
    left: 228px;
	width: 320px;	    
	height: 35px;	
	color:rgb(255,255,255);  
    font-size:28px;
	text-shadow: 0px -1px 1px rgb(96,114,121); 	
	text-overflow : clip;
	overflow : hidden;
	overflow-x : -webkit-marquee;
	-webkit-marquee-direction : auto;
	-webkit-marquee-increment : small;
	-webkit-marquee-repetition : infinite;
	-webkit-marquee-speed : 10;
	-webkit-marquee-style : slide;		
}


.cHistoryItem_Time{
	position: absolute;	
    vertical-align:middle;
}

.cHistoryItem_Time_Normal{
	top: 48px;	
	left: 160px;		
	width: 720px;     
	height: 31px;	    
	color:rgb(255,255,255); 
    font-size:24px;	
    text-align:left;
}
.cHistoryItem_Time_Highlight{
    top: 15px;
    left: 530px; 
	width: 350px;
	height: 31px;
    text-align:right;		
	color:rgb(255,255,255);
    font-size:24px;
	text-align:right;
}

#historyButtons {
	position: absolute;
	left: 0px;   
	top: 0px;		
	width: 682px;
	height: 85px;
    display:none;
}

#historyVideoButton {
	left: 196px;
	width: 262px;	
	height: 41px;	
}
#historyVoiceButton {
	left: 464px;
	width: 262px;	
	height: 41px;	
}
#historyPlusButton {
	left: 742px;
	width: 41px;
	height: 41px;
}

#historyPlayButton {
	left: 387px;
	width: 212px;	
	height: 41px;	
}
#historyDeleteButton {
	left: 605px;
	width: 212px;	
	height: 41px;	
}
#historyVMPlusButton {
	left: 823px;
	width: 41px;
	height: 41px;
}


#historyVideoButtonText {
	width: 202px;
}

#historyVoiceButtonText {
	width: 202px;
}

#historyChatButtonText {
	width: 202px;
}

#historyPlayButtonText {
	width: 192px;
}

#historyDeleteButtonText {
	width: 192px;
}

#historyDuration {
	position: absolute;
    top: 52px;
    left: 180px;
	width: 190px;			
	height: 44px;	
	z-index:2;
}

#historyDurationText {
	position: absolute;	
    top: 0px;
    left: 0px;
	width: 190px;			
	height: 44px;	
    text-align:right;
    vertical-align:middle;
	color: #ffffff; 
    font-size:22px;

}

#historyPage{
	position: absolute;
	left: 875px;
	top: -17px;
	width: 60px;     
	height: 24px;		
	display: none;
}

#historyPageText{
	position: absolute;
	left: 0px;
	top: 0px;
	width: 60px;     
	height: 24px;
    font-size:18px;	
	color:rgb(255,255,255);
    text-align:right;
    vertical-align:middle;
    /*  overflow:auto; */	
}

#historyNotify{
	position: absolute;
	left: 100px;
	top: 133px;	
	width: 700px;
	height: 200px;
	display: none;
}

#historyNotifyText{
	position: absolute;
	left: 0px;
	top: 50px;
	width: 700px;     
	height: 100px;
	line-height:28px;	
    font-size:20px;	
	color: #FFFFFF;
    text-align:center;
    vertical-align:middle;
    overflow:auto;  	
}

#historyScrollBar {
	position: absolute;
	left: 921px; /*1237*/
	top: 16px; /*148*/
	width: 10px;
	height: 440px;
}

#historyScrollBarFirst {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 10px;
	height: 10px;
}

#historyScrollBarSegment {
	position: absolute;
	left: 0px;
	top: 10px;
	width: 10px;
	height: 10px;
}
#historyScrollBarLast {
	position: absolute;
	left: 0px;
	top: 20px;
	width: 10px;
	height: 10px;
}

#historyUpArrow {
	position: absolute;		
	left: 431px;
	top: -15px;
	width: 42px;
	height: 40px;
}

#historyDownArrow {
	position: absolute;		
	left: 431px;
	top: 480px;
	width: 42px;
	height: 40px;
}

