// colors
@black:         #000;
@cyan: 					#D0E4EB;
@highlight: 		#ff8;
@gray1: 				#EEE;
@gray2: 				#999;
@gray3: 				#CCC;
@gray4:         #666;
@error:					#CC3333;
@white: 				#FFF;
@green:					#68BD53;
@status_green: 	#33cc33;
@yellow: 				#cccc33;
@red: 					#cc3333;
@gray5:         #151110;

html, body {
	margin:0;
	background:@gray3;
	font-family: helvetica;
}
.vspace {
margin:20px 0;
}
h1 { margin:0px;font-weight:normal; }
h2 {line-height:1.2em;font-weight:normal;}
h3 { font-weight:normal; }
h4 { font-weight:normal; }
h5 { font-weight:normal; }
h6 { font-weight:normal; }

h7 { background:@gray1;padding:0 5px; font-weight:normal;
}
.container {
	.highlight { background:@highlight; }
	.quiet { color:@gray2; }
	.search_link {
	  display: block;
	  margin-bottom:0px;
	}
	a:link, a:visited { color:#3366cc; }
	a:hover, a:active { color:@error; }
	p { margin-bottom:10px; }
	ul { margin:0; }
	ul li { margin:0; }
}
.redbox {
  padding:10px;
  background:@red;
}
.big {font-size:120%}
.out_of_screen { position:fixed;left:500000px; }
.padding5 { padding:5px; }
.conversation_for_user {
  overflow:hidden;
  border-bottom:1px dashed @gray1;
}
.conversation h5 {margin-top:0;}

.personal {
	h5 { padding-left:50px; }
	.avatar { float:left; }
	.description { padding-left:50px;margin-bottom:5px; }
	.info { padding-left:50px; }
}

#flash_messages {
	.notice {
		background:@highlight;
		padding:4px 10px;
		border:none;
		margin:0 0 10px 0;
		color:@black;
		font-weight:strong;
	}
	.error {
		background:@error;
		padding:4px 10px;
		border:none;
		margin:0 0 10px 0;
		color:@white;
		font-weight:strong;
	}
}

#connection_stat_data {
	font-weight:bold;
	font-size:14px;
}

div.auto_complete {
  width: 340px;
  background: @white;
  z-index:200;
	ul {
	  border:1px solid #82c0cd;
	  margin:0;
	  padding:0px;
	  width:100%;
	  list-style-type:none;
		li {
		  margin:0;
		  padding:3px;
		}
		li.selected {
		  background-color: #ff3;
		}
		strong.highlight {
		  color: #800; 
		  margin:0;
		  padding:0;
		}
	}
}


p+p { text-indent:0px; }
p { margin-bottom:10px; }
.highlight { background:#9acb63; }
.clear { clear:both; }
.mute { color:@gray2;}
.padding { padding:10px; }
.item2 { margin-bottom:5px; }
.content { background:@white; }

#sidebars_container {
	#main_headline {
  	font-size:100%;
  	line-height:1.9em;
  	padding-top:0px;
  	margin-top:-20px;
	}
	#signup_headline {
	  color:@green;
	  font-size:70%;
	  text-align:left;
	}
}

#main_description {
  font-size:130%;
	h5 { margin-top:0; }
}

#test_convo_description {
	font-size:170%;
  line-height:0.5em;
}

.center {text-align:center;}

.wbox {
	background:@white;
	margin-bottom:10px;
}

#default #recently_visited {
  margin-bottom:10px;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  background:@white;
}

#col1 {
  margin-top:5px;
}
#col1_padding {

}
#col2_padding {
  padding:5px;
}
#col3_padding {
  padding:5px;
}
/* header */
#header_container {
  background:#151110;
}
#header {
	margin:0 auto;
	background:#151110;
	h1 { margin:0; }
}

h4 {background:@gray4;color:@white;}
#top-nav {
  text-align:right;
}
#top_container {
  background:#333;
  
}

/* menu */
#menu {
	ul {
	  margin:5px 0 0 0;
		float:right;
		li { 
			float:right;
			border-left:1px solid #333;
			a:link, a:visited {
			  display:block;
			  padding:2px 6px;
			  color:@white;
			}
			a.bookmarks_link {
				background: url("/images/icons/star.png") left no-repeat;
				padding-left: 18px;
			}
		}
		li.search form {
		  padding:0px 5px;
			input { float:left; }
		}
		#new_convo_button {
      display:block;
      background: #cc3333 url("/images/icons/speech.jpg") 5px no-repeat;
      padding: 0px 10px 0px 18px;
      font-weight: bold;
      margin-left:5px;
    }		
	}
}

#dashboard {
  margin:5px 0;
  -moz-border-radius-topleft: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-radius-topright: 5px;
  -webkit-border-top-right-radius: 5px;
  background: @white;
  h5 {
    padding:0 10px;
    background:@gray1;
    text-align:center;
    margin:5px;
  }
  p {
    padding:5px;
  }
}

/* session menu */
#session-menu {
  background: @gray4;
  padding:0 0 0 5px;
  -moz-border-radius-topleft: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-radius-topright: 5px;
  -webkit-border-top-right-radius: 5px;
	ul {
	  margin:0;
		float:right;
		li { 
			float:right;
			margin-left:5px;
			a:link, a:visited {
			  display:block;
			  padding:0px 6px;
			  color:@white;
		  }
			a.bookmarks_link {
				background: url("/images/icons/star.png") left no-repeat;
				padding-left: 18px;
			}
		}
		#new_convo_button {
      display:block;
      background: #cc3333 url("/images/icons/speech.jpg") 5px no-repeat;
      padding: 0px 10px 0px 18px;
      font-weight: bold;
      margin-left:5px;
    }
	}
}


#topmenu {
	ul {
	  margin:0;
		float:right;
		li { 
			float:right;
			a:link, a:visited {
			  display:block;
			  padding:2px 6px;
			  color:#ccc;
			  border-left:1px solid #111;
			}
			a.bookmarks_link {
				background: url("/images/icons/mini-star.png") 4px 6px no-repeat;
				padding-left: 22px;
			}
		}	
	}
}


// remove this
.page {
  -moz-border-radius-topleft: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-radius-topright: 5px;
  -webkit-border-top-right-radius: 5px;
  padding:5px;
  background:#fcfcfc;
	h6 {
	  margin:0 0 4px 0;
	  background:@gray1;
	}
	h6.hl {
    background:@gray4;
    color:@white;
	}
}
.bbox {
  background:#313131;
  color:#fff;
  padding:10px;
  h2 {margin:0 0 5px 0;}
  
  h1 {
  	font-size: 200%;
  	margin:0 0 10px 0;
  }
  div form { margin:10px 0px 0px 0px; }
	.avatar { float:left; }
	.username { padding-left:70px;display:block;font-size:130%; }
	.userinfo { padding-left:70px;display:block;color:@white; }
	a:link, a:visited, a:hover, a:active {
	  color:@white;
	}
}
.bbox-pointer {
  background:url("/images/bbox-point.gif") 30px top no-repeat;
}

.box {
  padding:0px;
  background:#fcfcfc;
  margin-bottom:5px;
  h5 {
    padding:0 5px;
    background:@gray1;
    text-align:center;
    margin:5px 0;
  }
	h6 {
	  margin:0px;
	  background:@gray4;
	  color:@white;
	  padding:0 5px;
	  -moz-border-radius-topleft: 5px;
    -webkit-border-top-left-radius: 5px;
    -moz-border-radius-topright: 5px;
    -webkit-border-top-right-radius: 5px;
    a:link, a:visited, a:hover, a:active {
      color:@white;
      text-decoration:none;
    }
	}
	.box-content {
	  padding:5px;
	}
}

.balloon2 h1 { margin:0; }
/* messages */
#messages { background:@white; }

.message { 
	padding:8px 8px 8px 8px;position:relative;
	border-bottom:1px dashed #ccc;overflow:hidden;
	.messagelinks {
		position:absolute;top:0px;right:10px;
		a:link, a:visited { color:#aa9c84; }
		a:hover, a:active { color:@error; }
	}
	.username {
		a:link, a:visited { color:#aa9c84; }
		a:hover, a:active { color:@error; }
	}
	.meta { margin-top:-10px;position:relative; }
	.avatar { float:left; }
	.date {
		a:link, a:visited { color:#aa9c84; }
		a:hover, a:active { color:@error; }
	}
}

.messagetext { padding-left:40px; }

.system {padding:8px 8px 0 8px;}



#last_message_avise {background:#9acb63; padding:0 20px;text-align:center;margin-top:-19px;}
.messageinput { width:520px; height:1.5em; }
textarea, input[type='text'], input[type='password'], select { border: 1px solid #333; background: @white; }
textarea:hover, input[type='text']:hover, input[type='password']:hover, select:hover { border-color: #333; }
textarea:focus, input[type='text']:focus, input[type='password']:focus, select:focus { border-color: #333; outline: 2px solid #333; }
#footer_container {
  position:fixed;
  bottom:0;
  left:0;
  background:#151110;
  z-index:100;
  width:100%;
  padding:0;
  border-top:1px solid #000;
  color:@white;
	a:link, a:visited, a:hover, a:active { color:@white; }
}


.status_yellow { color: @yellow; }
.status_green { color: @status_green; }
.status_red { color: @red; }

.list {
	list-style: none;
	li {
	  border-bottom:1px dashed #ccc;
	  padding:10px 0;
	}
	li.conversation h3 { margin:0; }
}

.pagination {
  margin:10px 0;
  background: white;
  /* self-clearing method: */ }
.pagination a, .pagination span {
  padding: .2em .5em;
  display: block;
  float: left;
  margin-right: 1px; }
.pagination span.disabled {
  color: @gray2;
  border: 1px solid #DDD; }
.pagination span.current {
  font-weight: bold;
  background: #B3E4Ef;
  color: #3366CC;
  border: 1px solid #3366CC; }
.pagination a {
  text-decoration: none;
  color: #105CB6;
  border: 1px solid #9AAFE5; }
.pagination a:hover, .pagination a:focus {
  color: #3366CC;
  background: #B3E4Ef;
  border-color: #3366CC; }
.pagination:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }
* html .pagination {
  height: 1%; }
*:first-child+html .pagination {
  overflow: hidden; }


.msgcount {background:@error;padding:2px 4px;font-weight:bold;color:@white;margin-right:5px;}
.mutedmsgcount {background:@gray2 url(/images/b9.gif) bottom center no-repeat;padding:2px 4px 6px 4px;font-weight:bold;color:@white;margin-left:10px;}
#working {
  position:absolute;
  top:-18px;
  left:255px;
}
#users_list {
	float:left;width:100%;
	li {
	  float:left;
	  width:49%;
	  margin-bottom:10px;
	  margin-left:2px;
	  padding:10px 0;
	  border:1px solid @gray1;
		.avatar { float:left;padding-left:5px; }
		.username { padding-left:60px;display:block; }
		.user_real_name { padding-left:60px;display:block;color:@gray2; }
	
	}

}
input[type='text'], input[type='password'], textarea { font-size: 100%; font-family: helvetica, "microsoft sans serif", arial, sans-serif;}
.img_attachment img {
  border:1px solid #ccc;
  padding:10px;
  margin:10px auto;
}

.tag {border:1px solid #85c5d2; background:@cyan; color:#3366cc;margin-right:3px;padding:0px 2px;margin-bottom:3px;display:block;float:left;line-height:1em;}
.tag a:link, .tag a:visited {
  text-decoration:none;
  color:#3366cc;
}
.tag_controls a:link, .tag_controls a:visited {
  color:@error;
  font-size:85%;
}

ul.subsection_tabs {
clear:both;
height:20px;
list-style-image:none;
list-style-position:outside;
list-style-type:none;
margin:0px;
padding:0;
white-space:nowrap;
border-bottom:none;
}
ul.subsection_tabs li.tab a.active {
background-color:@gray1;
color:#111;
}
ul.subsection_tabs li.tab a:hover {
color:#000;
text-decoration:underline;
}

ul.subsection_tabs li.tab a {
background-color:#989898;
color:@white;
display:block;
height:20px;
padding:0 4px;
width:80px;
text-decoration:none;
font-weight:bold;
}

.nube1 {font-size: 1.0em;}
.nube2 {font-size: 1.2em;}
.nube3 {font-size: 1.4em;}
.nube4 {font-size: 1.6em;}
.nube5 {font-size: 1.8em;}
.nube6 {font-size: 2.0em;}


#convo_controls {
    position: relative;
}
#convos_links {
  padding-bottom:0px;
}
.groupdate {
  padding: 16px 0 0 0;
  color:#333;
  font-weight:bold;
  font-size:130%;
  background: url("/images/bl_gray_corner.gif") top left no-repeat;
	span {
	  border-top:1px solid #a7a7a7;
	  display:block;
	  padding:10px 0 0 10px;
	}
}


.last-read {color:@white;background:#f00 url("/images/icons/little-down-arrow.gif") right no-repeat;display:inline;font-weight:bold;padding:0 12px 0 5px;}
.twitter_like_username {color:#3366cc;font-family:'Lucida Grande';}

.menu_separator {
	color:#b3e4ef;
	border-right:2px solid #b3e4ef;
}

#multilingual {
	float:left;
	margin-right:5px;
	form { margin:0; padding:0; }
}

.round {
	-moz-border-radius: 5px;
  -webkit-border-radius: 5px;
}

#convo_header_container {
  z-index: 100;
  background: #cccccc;
  color: #ffffff;
  border-bottom:2px solid #999;
}
#convo_header {
  overflow:hidden;
  width: 550px;
  margin: 0 auto;
  background: @gray4;
  -moz-border-radius-topleft: 5px;
  -webkit-border-top-left-radius: 5px;
  -moz-border-radius-topright: 5px;
  -webkit-border-top-right-radius: 5px;
}
#convo_header h5 {
  margin:0px;
  padding:0;
  font-size:100%;
  font-weight:normal;
  img {margin:0px;display:inline;}
}
#convo_header h5 a:link, #convo_header h5 a:visited {
  color:#fff;
  padding:0px;
  text-decoration:none;
}
.padding05 {
  padding:0 5px;
}
#convo_tools {
  color: #999999;
  padding: 0px;
  background: #eee;
  #filter {
  	float:right;
  	margin:0;
  	padding:0;
  	form { margin:0; padding:0; }
  }
}
#convo_owner {
  position: absolute;
  right:2px;
  top:6px;
  background:@gray4;
  padding: 0px;
  font-size:90%;
  line-height:1.2em;
}
#convo_name {
  width:90%;
  overflow:hidden;
  position:absolute;
  top:5px;
}
.sbutton {
  background: #666;
  padding: 0 2px;
  font-weight: bold;
  margin-right:2px;
  font-size:90%;
}
.sbutton a:link, .sbutton a:visited {
  color:#eee;
  text-decoration:none;
}
.sbutton a:hover, .sbutton a:active {
  color:#fff;
  text-decoration:none;
}
#extra_convo_stuff {
  background:#fff;
  margin-left:-10px;
  border-left:1px dashed #ccc;
  border-bottom:2px solid #999;
  border-top:1px solid #999;
}
.invitation {
  overflow:hidden;
  border:1px solid #ccc;
  margin-bottom:5px;
  padding:5px;
  h5 { margin-bottom:0px; margin-top:0px;}
  .actions {float:right;}
}





#convo-menu {
  margin: 2px 0 0 0;
	padding: 0;
	z-index: 30;
	float: right;
  li {
    margin: 0 0 0 2px;
  	padding: 0;
  	list-style: none;
  	float: left;
  	font: bold 11px arial;
  	a {
  	  display: block;
    	margin: 0;
    	padding: 2px;
    	width: 60px;
    	background: #999;
    	color: #fff;
    	text-align: center;
    	text-decoration: none;
    }
    a:hover {	background: #3366cc}
  }
  div {	
    position: absolute;
  	visibility: hidden;
  	margin: 0;
  	padding: 0;
  	background: #fff;
  	border: 1px solid #999;
  	a {
  	  position: relative;
  		display: block;
  		margin: 0;
  		padding: 5px 10px;
  		width: auto;
  		white-space: nowrap;
  		text-align: left;
  		text-decoration: none;
  		background: #fff;
  		color: #2875DE;
  		font: 11px arial;
  	}
  	a:hover {	
  	  background: #3366cc;
  		color: #FFF;
    }
  }
}
.minilist { list-style: none; }
.minilist li {
  border-bottom: 1px dashed #cccccc;
  padding: 0px 0;
}
.minilist li.conversation h3 { margin: 0; }


.button {
  background: #000;
  padding:5px;
  font-weight: bold;
  margin:5px;
  a:link, a:visited, a:hover, a:active {
    color:@white;
    text-decoration:none;
  }
}
.mbutton {
  background: #000;
  padding:0 5px;
  font-weight: bold;
  margin-left:5px;
  a:link, a:visited, a:hover, a:active {
    color:@white;
    text-decoration:none;
  }
}
.screencast object {
border:8px solid @gray5;
}
.convo-name {

}