tt-irc.css

body {
	background : white;
	color : black;
	margin : 0px;
	padding : 0px;
	font-family : "Lucida Grande", Arial, sans-serif;
	font-size : 13px;
}

a {
	color : #88b0f0;
	text-decoration : none;
}

a:hover {
	color : #4684ff;
}

div.topLinks {
	float : right;
	color : gray;
	font-size : 12px;
}

div.topLinks a {
	color : #4684ff;	
}

div.topLinks a:hover {
	color : black;
}

div.topLinks a.feedback {
	color : #009900;
}

div.topLinks img {
	vertical-align : middle;
}

table.loginForm2 {
	padding : 1em;
}

table.loginForm2 .loginTop {
	border-width : 0px 0px 1px 0px;
	border-color : #88b0f0;
	border-style : solid;
	padding : 0.5em;
}

table.loginForm2 .loginMiddle {
	padding : 3em;
}

table.loginForm2 .loginBottom {
	border-width : 1px 0px 0px 0px;
	border-color : #88b0f0;
	border-style : solid;
	font-size : 12px;
	text-align : center;
	color : #909090;
	padding : 0.5em;
}

table.loginForm2 .loginBottom a {
	color : gray;
}

table.loginForm2 .loginBottom a:hover {
	color : #4684ff;
}

table.loginForm2 .loginError {
	color : red;
	margin : 0.5em;
}

table.loginForm2 .innerLoginCell {
	padding-top : 0.5em;
}

#header {
	color : #4684ff;
	font-size : 12px;
	margin : 10px;
	height : 35px;
}

#input {
	border-width : 0px 0px 0px 0px;
	border-style : solid;
	border-color : #88b0f0;
	bottom : 5px;
	height : 25px;
	left : 100px;
	right : 155px;
	position : absolute;
	border-collapse : collapse;
	text-align : center;
}

#sidebar {
	position : absolute;
	top : 0px;
	right : 0px;
	width : 148px;
	overflow : auto;
	bottom : 0px;
}

#connect {
	top : 5px;
	right : 5px;
	position : absolute;
	width : 143px;
	overflow : auto;
	bottom : 5px;
	text-align : center;
}

#connect-btn {
	width : 90%;
}


#nick {
	position : absolute;
	left : 5px;
	width : 90px;
	bottom : 5px;
	height : 25px;
	line-height : 25px;
	text-align : right;
	cursor : pointer;
}

#input div.wrapper {
	border : 1px solid #88b0f0;
}

#input input, #input textarea {
	border-width : 0px;
	padding : 0px;
	width : 100%;
	height : 20px;
	margin : 0px;
	font-size : 14px;
	text-indent : 5px;
	padding-top : 2px;
}

#toolbar {
	border-width : 1px 0px 0px 0px;
	border-style : solid;
	background : #f8fbff;
	border-color : #88b0f0;
	top : 40px;
	right : 200px;
	left : 0px;
	position : absolute;
	overflow : auto;
	height : 30px;
	border-collapse : collapse;
	line-height : 30px;
	padding-left : 5px;
	font-size : 12px;
}

#toolbar a {
	color : #88b0f0;
}

#tabs {
	position : absolute;
	top : 80px;
	width : 156px;
	left : 0px;
	bottom : 5px;
	overflow : auto;
}

#tabs-list img.conn-img {
	vertical-align : middle;
	margin-right : 5px;
	margin-top : 2px;
	float : right;
}

#tabs-list {
	list-style-type : none;
	margin : 0px;
	padding : 0px;
	white-space : nowrap;
}

#tabs-list li {
	text-align : left;
	text-indent : 1em;
	border-width : 1px 0px 1px 0px;
	border-style : solid;
	border-color : transparent;
	border-collapse : collapse;
	padding : 5px 0px 5px 0px;
	font-size : 12px;
	font-family : "Lucida Grande", "Segoe UI", sans-serif;
	cursor : pointer;
	z-index : 3;
	position : relative;
}

#tabs-list li.attention {
	color : red;
}

#tabs-list li.highlight {
	color : blue;
}

#tabs-list li.selected {
	border-width : 1px 0px 1px 0px;
	border-style : solid;
	border-color : #88b0f0;
	background : #c0d8ff;
	color : black;
	text-shadow : #ffffff 0 1px;
	font-weight : bold;
}

ul.sub-tabs {
	list-style-type : none;
	margin : 0px;
	padding : 0px;
}

#content {
	background : #c0d8ff;
	border-width : 1px;
	border-style : solid;
	border-color : #88b0f0;
	top : 50px;
	right : 5px;
	left : 155px;
	position : absolute;
	bottom : 5px;
	word-wrap : break-word;
}

#topic {
	position : absolute;
	top : 0px;
	left : 5px;
	height : 25px;
	right : 155px;
	text-align : center;
	padding : 5px 0px 5px 0px;
}

#topic input {
	border-width : 0px;
	padding : 0px;
	width : 100%;
	height : 20px;
	margin : 0px;
	padding-top : 2px;
	font-size : 14px;
	text-indent : 5px;
}

#topic div.wrapper {
	border : 1px solid #88b0f0;
	padding-right : 1px;
	background : white;
}

#log {	
	border-width : 1px;
	border-color : #88b0f0;
	border-style : solid;
	background : white;
	position : absolute;
	top : 35px;
	right : 155px;
	left : 5px;
	bottom : 35px;
	overflow : auto;
}

#log a {
	color : #4684ff;
}

#log a:hover {
	color : black;
}

#userlist {
/*	border-width : 1px;
	border-color : #88b0f0;
	border-style : solid; */
	font-size : 12px;
	top : 35px;
	right : 5px;
	position : absolute;
	width : 143px;
	overflow : auto;
	bottom : 5px;
}

#userlist img {
	vertical-align : middle;
}

#log-inner {
	padding : 5px;
}

#userlist-inner {
}

#debug_output {
	position : absolute;
	width : 400px;
	height : 200px;
	right : 20px;
	bottom : 20px;
	z-index : 999;
	background-color : white;
	border : 1px solid #c0c0c0;
	overflow : auto;
	margin : 0px;
	padding : 0px;
	list-style-type : none;
}

#debug_output li {
	margin : 0px;
	padding : 0px;
	font-size : 11px;
}

#dialog_overlay {
	left : 0;
	top : 0;
	height : 100%;
	width : 100%;
	z-index : 4;
	position : absolute;
	background-image : url("images/shadow_white.png");
}

#overlay {
	background : white;
	left : 0;
	top : 0;
	height : 100%;
	width : 100%;
	z-index : 100;
	position : absolute;
}

#overlay_inner {
	font-weight : bold;
	margin : 10px;
}

div#errorBox div#xebBtn {
	text-align : center;
	clear : both;
	margin-bottom : 5px;
}

div#errorBox div#xebTitle {
	background-color : #ff0000;
	color : white;
	padding : 4px 2px 4px 10px;
	color : white;
	font-weight : bold;
	font-size : 12px;
}

div#errorBox div#xebContent {
	font-size : 12px;
	padding : 10px;
}

div#errorBox textarea {
	width : 100%;
	height : 100px;
}

div#errorBox input {
	margin-bottom : 10px;
}

#infoBoxTitle {
	border-width : 0px 0px 1px 0px;
	border-style : solid;
	border-color : #659a4c;
	background-color : #99d67a;
	padding : 4px 2px 4px 10px;
	color : white;
	font-weight : bold;
	font-size : 16px;
	text-shadow : #659a4c 0px 1px 0px;
}


/* shadow stuff from http://www.sixapart.com/pronet/articles/ydsf_-_robust_c.html */

#infoBox {	
	border-width : 1px 1px 1px 1px;
	border-style : solid;
	border-color : #659a4c;
	background-color : #f8fcf5;
	position: relative;
	overflow : hidden;
	left : -4px;
	top : -4px;
}

div#errorBox {
	background-color : #ffcccc;
	border : 1px solid #ff0000;
	font-size : 12px;
	position: relative;
	overflow : hidden;
	left : -4px;
	top : -4px;
}

html>body #infoBox, html>body #errorBox {
	left : -10px;
	top : -10px;
	margin : 0;
}

#infoBoxShadow:before, #infoBoxShadow:after, #preview-shadow:before, 
#errorBoxShadow:before, #errorBoxShadow:after, #preview-shadow:after {
	content : " ";
	display : block;
	background : inherit;
	width : 10px;
	height : 10px;
}

#infoBoxShadow:before, #errorBoxShadow:before, #preview-shadow:before {
	position : absolute;
	top : 0;
	right : 0;
	margin : -10px 0 0 auto;
	background-position : right top;
}

#infoBoxShadow:after, #errorBoxShadow:after, #preview-shadow:after {
	margin : -10px 0 0 -10px;
	background-position : left bottom;
}

#preview-shadow {
	background-image : url("images/shadow.png");
	background-position : bottom right;
	position : absolute;
	z-index : 4;
}

#infoBoxShadow, #errorBoxShadow {
	background-image : url("images/shadow.png");
	background-position : bottom right;
	left : 25%;
	top : 50px;
	width : 50%;
	position : absolute;
	min-width : 600px;
} 

#infoBoxShadow {
	z-index : 5;
}

#errorBoxShadow {
	z-index : 400;
}

div.infoBoxContents {
	padding : 10px;
	margin-bottom : 5px;
	font-size : 12px;
}

div.infoBoxContents td {
	font-size : 12px;
}

div.infoBoxContents a {
	color : #527040;
}

div.infoBoxContents a:hover {
	color : black;
}

pre {
	margin : 5px;
}

#log ul#log-list {
  list-style-type : none;
  margin : 0px;
  padding : 0px;
}  

#log span.timestamp {
	color : gray;
	margin-right : 0.5em;
}

#log span.pvt-sender, #log span.pvt-sender-out {
	color : black;
	margin-right : 0.5em;
}

#log span.pvt-sender:before {
	content: "-";
	color : green;
}

#log span.pvt-sender:after {
	content: "-";
	color : green;
}

#log span.pvt-sender-out:before {
	color : green;
	content: ">";
}

#log span.pvt-sender-out:after {
	color : green;
	content: "<";
}

#log span.sender {
	color : green;
	margin-right : 0.5em;
}

#log span.sender:before {
	content: "<";
	color : blue;
}

#log span.sender:after {
	content: ">";
	color : blue;
}

#log span.message {
	color : black;
}

#log span.sys-message {
	color : #88b0f0;
}

#log span.action {
	color : gray;
}

ul#userlist-list {
	list-style-type : none;
	margin : 0px;
	padding : 0px;
	white-space : nowrap;
}

ul#userlist-list li {
	cursor : pointer;
}

ul#userlist-list li:hover {
	color : #4684ff;
}

#actions {
	position : relative;
	left : 5px;
	width : 145px;
	text-align : right;
}

#actions select {
	max-width : 145px;
}

.even, .even td {
	border-width : 0px 0px 1px 0px;
	border-style : solid;
	border-color : #c0c0c0;
	background-color : #f0f0f0;
	border-collapse : collapse;
	padding : 2px 5px 2px 5px;
}

.odd, .odd td {
	border-width : 0px 0px 1px 0px;
	border-style : solid;
	border-color : #c0c0c0;
	border-collapse : collapse;
	padding : 2px 5px 2px 5px;
}

.evenSelected, .evenSelected td, .evenHL {
	background-color : #fff7d5;
	border-style : solid;
	border-color : #e7d796;
	border-width : 0px 0px 1px 0px;
	border-collapse : collapse;
	padding : 2px 5px 2px 5px;
}

.oddSelected, .oddSelected td, .oddHL {
	background-color : #fff7d5;
	border-style : solid;
	border-color : #e7d796;
	border-width : 0px 0px 1px 0px;
	border-collapse : collapse;
	padding : 2px 5px 2px 5px;
}

#userlist-list li.odd, #userlist-list li.even, #userlist-list li.evenHL,
	#userlist-list li.oddHL {
	border-color : transparent;
	background : transparent;
}

div.dlgSec {
	font-size : 12px;
	color : gray;
	font-weight : bold;
	clear : both;
	height : 20px;
}

div.dlgSecCont {
	position : relative;
	left : 150px;
	top : -20px;
	float : left;
	font-size : 12px;
	font-weight : normal;
	line-height : 200%;
}

div.dlgButtons {
	text-align : right;
	clear : both;
}

textarea.user-css {
	width : 100%;
	height : 100px;
	border : 1px solid #99d67a;
	background-color : white;
	margin : 0px 0px 5px 0px;
	padding : 0px;
}

ul.container {
	height : 100px;
	overflow : auto;
	list-style-type : none;
	border : 1px solid #99d67a;
	background-color : white;
	margin : 0px 0px 5px 0px;
	padding : 0px;
}

ul.container li input {
	vertical-align : middle;
}

div.dlgSecCont label.fixed {
	width : 120px;
	float : left;
	text-align : right;
	padding-right : 10px;
}

div#mini-notice {
	font-size : 11px;
	color : black;
	background-color : white;
	border : 1px solid #659a4c;
	margin-bottom : 5px;
	padding : 2px;
}

div.error {
	border : 1px solid #ff0000;
	background : #ffcccc;
	padding : 5px;
	margin : 0px 0px 5px 0px;
	font-size : 12px;
}

div#image-preview {
	background-color : #fff7d5; 
	border-width : 1px;
	padding : 5px;
	border-style : solid;
	border-color : #e7d796;
	font-size : 8px;
	color : #9a8c59;

	position: relative;
	overflow : hidden;
	left : -10px;
	top : -10px;

}

div#preview-shadow {
	position : absolute;
	z-index : 4;
}

div#image-tooltip {
	background-color : #fff7d5;
	border-width : 1px;
	padding : 5px;
	border-style : solid;
	border-color : #e7d796;
	font-size : 8px;
	color : #9a8c59;
	position : absolute;
	z-index : 4;
}

div#image-tooltip img {
	max-height : 250px;
	max-width : 250px;
}

button, input, select {
	font-family : "Lucida Grande", "Segoe UI", sans-serif;
}

.invisible {
	display : none;
}

.away {
	color : gray;
}