File: nodejs/app.css

body { padding:0; margin:0;font-family:Consolas,Monaco,'Andale Mono',monospace; font-size: 14px; background: transparent url('https://developer.cdn.mozilla.net/media/img/bg-content.png') repeat; }
h3, ul, li {padding:0; margin:0;}
ul {list-style-type: none; }
li { line-height: 20px; padding-left: 20px; background: transparent url('https://cdn1.iconfinder.com/data/icons/fugue/icon/user-silhouette.png') no-repeat left center; }
h3 { margin-bottom: 10px; }
#user_list {
    float:left;width:150px;height:300px;padding:10px; overflow-y: auto; overflow-x: hidden;
}
#chat_detail {
    float:left;width:600px;height:300px;padding:10px;
}
#conversation {height:300px; overflow: auto;}
#conversation span.message_item { color: #690; width: 300px; }
#data {width: 600px; height: 40px; float: left; border: 1px solid #acacac; pading: 10px; }
#datasend { height: 40px; border: 1px solid #cdcdcd; padding: 10px;}
#chat_area { display:none; }
.clear {clear:both;}
#user_control { margin: 5px 0;}
#user_info {margin: 0 auto; display: none; padding: 50px; background: #FFF; width: 50%; min-height: 200px; }
#user_info label{ display: block; font-weight: bold; }
#user_info input{ border: 1px solid #acacac; padding: 5px; }
#user_info #username { width:250px; }
#conversation p.system_notify {
    background-color: #faf9e2;
    border-top: 1px solid #dddaaa;
    border: solid #dddaaa;
    border-width: 1px 0;
    margin-bottom: 5px;
    padding: 10px 5px;
    color: #5d5636;
}
#loading_chat {
    background: transparent url('http://cars.sydneycitylexus.com.au/images/blank_loading.gif') no-repeat center center;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0; left: 0;
}
#loading_message {
    position: relative;
    top: 52%;
    text-align: center;
    vertical-align: central;color: #905;
}
#sign_chat, #datasend {cursor: pointer;}
.message_date { 
    display: block; 
    margin-left: 10px; color: #AAAAAA;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
    -khtml-border-radius: 8px;
    border-radius: 8px;
    
    background-color: #faf9e2;
    font-size: 10px;
    padding: 2px 5px;
    text-align: center;
    border: 1px solid #DDDAAA;
}
span.username, span.message_item , span.message_date{
    display: block; float: left;  
}
span.message_item { padding: 0 10px; }
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}