
.cr-panel {
    border: 1px solid #C3D9FF;
    padding: 0px;
    background: white;
    z-index:1000;
}

/* the main panel */
.cr-mainPanel {
	width: 550px;
	height: 300px;
	border: 1px solid #e5e5e5;
}

/* the panel that holds the title */
.cr-headerPanel {
	width: 550px;
	height: 33px;
	color: white;
	
	font-size: small;
	font-family: helvetica, arial, sans-serif;
	background-image: url(header.png);
	background-repeat: repeat-x;
}

.cr-header {
    margin-bottom:4px;
    font-size:11px;
}

/* the panel that holds the history, enter field */
.cr-chatPanel {
	width: 400px;
	height: 267px;
}

/* a scroll panel that hides the horizontal scroll */
.cr-scrollPanel {
	overflow-x: hidden;
}

/* the history of chat messages */
.cr-chatHistory {
	width: 400px;
	height: 217px; 
	background-color: white;
}

/* the panel that holds the user list and the yellow bar at the bottom */
.cr-userPanel {
	width: 150px;
	height:267px;
}


/* the popup panel for blocking users or linking to their profile */
.cr-popupPanel {
    border: 1px solid #C3D9FF;
    padding: 1px;
    background: white;
    z-index:1100;
}

/* the user list */
.cr-userList {
	width: 150px;
	height: 217px; 
	background-color: white;
}

/* the user in the user list */
.cr-user {
	margin-left:5px;
	margin-right:5px;
	margin-bottom: 1px;
	margin-top: 1px;
}

.cr-user-label {
	font-size: small;
	font-family: helvetica, arial, sans-serif;
	margin-left: 5px;
    margin-right: 5px;
    cursor:pointer;
    z-index:1100;
}

.cr-user-label-blocked {
	font-size: small;
	font-family: helvetica, arial, sans-serif;
	margin-left: 5px;
	color: gray;
	text-decoration: line-through;
	cursor:pointer;
}

.cr-typing-label {
	margin-left:5px;
	font-size: small;
	font-family: helvetica, arial, sans-serif;
	color: darkgray;
}

/* the yellow bar at the bottom */
.cr-yellowBar {
	height: 50px; 
	background-image: url(footer.png);
	background-repeat: repeat-x;
}

/* a normal text message */
.cr-message {
	margin-left:5px;
	margin-right:5px;
	width: 360px;
	font-size: x-large;
	font-family: helvetica, arial, sans-serif;
	border-bottom: 1px solid #e5e5e5;
}

/* a system message */
.cr-systemMessage {
	margin-left:5px;
	margin-right:5px;
	width: 360px;
	color: #f541c0;
	text-align: right;
	font-size: small;
	font-family: helvetica, arial, sans-serif;
	border-bottom: 1px solid #e5e5e5;
}


.cr-message-label {
	margin-left:5px;
	margin-right:5px;
    font-size:12px;
    overflow-x:hidden;
    width:360px;
}


/* the grey line between messages */
.cr-line {
	height: 1px;
	width: 360px;
	margin-left:5px;
	margin-right:5px;
	margin-bottom: 1px;
	border-bottom: 1px solid #e5e5e5;
}

/* the panel that holds the enter text box */
.cr-enterPanel {
	width: 400px;
	height: 50px; 
	background-image: url(footer.png);
	background-repeat: repeat-x; 
}

/* the enter text box */
.cr-enterBox {
	width: 353px;
 	margin-left: 8px; 
  	margin-top: 13px;
}

/* the send image */
.cr-sendImage {
  	margin-top: 17px;
  	margin-right: 10px;
  	cursor: pointer;
}

/* the minimize _ */
.cr-minimize {
	font-size: small;
	font-weight: bolder;
	margin-right: 10px;
	cursor: pointer;
	font-family: helvetica, arial, sans-serif;
}

.cr-minimax {
    padding-top:3px;
}