/************************************************************************
 *
 *  Howdy
 *  $Id: howdy.css 439 2009-03-18 13:03:33Z tom $
 *  © 2008 upstruct berlin oslo
 *
 ***************************************************************************/
 
#howdy-button{ width: 255px; height: 81px; }
#howdy-button span{ float:left; padding-top: 12px; }

#howdy{
	background: url(/howdy/images/overlay.png);	
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 700;
	color: white;
	cursor: text;
}

#howdy #start-typing{
	font-size: 40px;
	position: absolute;
	top: 45%;
	line-height: 1em;
	text-align: center;
	color: #2A2A2A;
	width: 100%;
}

#howdy #status{
	height: 20px;
	position:absolute;
	right:160px;
	top:19px;
}

#howdy #loading-icon{
	margin-right:5px;
	position:relative;
	top:6px;
}

#howdy #exit{ position: absolute; cursor: pointer; top: -4px; right: 15px; z-index: 7002; text-decoration: none; color: white; }
#howdy #esc{ position: relative; top: 17px; padding: 0px 5px; }

#howdy #history{
	position: absolute;
	z-index: 7001;
	color: black;
	left: 15px;
	top: 15px;
	height: 43px;
	/* cursor: pointer; */
}

#howdy #toggle-history{
	position: relative;
	top:-19px;
	text-decoration: none;
	color: white;
}

#howdy #clock {
	position: relative;
	top:19px;
	padding-left: 5px;
}

#howdy #history-container{
	position: absolute;
	overflow: hidden;
	height: 19px;
	width: 253px;
	top:11px;
	left: 90px;
}

#howdy #historymenu{
	list-style: none;
	position: absolute;
	top: 0px;
	left: 0px;
	margin-left:0px;
	background-color: white;
	padding: 0px 7px 0px 5px;
	[color:gray;
		padding: 1px 7px 0px 5px; /*Affects Safari for Macintosh only (v1-3). .*/
	];
}

#howdy #historymenu li{
	display: inline;
}

#howdy #historymenu li.selected{
	background: url(/howdy/images/checked.png) no-repeat 0px 6px;
	padding-left: 13px
}

#howdy #historymenu li:after{
	content: ' | ';
}
#howdy #historymenu li:last-child:after{
	content: '';
}

#howdy #historymenu a{
	color: black;
	text-decoration: none;
}
#howdy #historymenu a:hover{
	text-decoration: underline;	
}

.hremark{ position: absolute; width: 390px; }
.hdot{ height: 16px; min-width: 16px; padding: 2px 0 3px 20px; font-size:9px; position: relative; z-index: 701; cursor: pointer; }

.hremark table{ position: relative; left: 7px; top:-999em; z-index: 702; }
.hremark table .pole{ width: 17px; }
.hremark table .point{ height: 17px; }
.hremark table .text{
	background-color: white;
	color: black;
	font-size: 11px;
	padding-top: 5px;
	padding-bottom: 5px;
	max-width: 365px;
}

/* Right to left */
.hremark table.trl .shb{ height: 4px; background: url(/howdy/images/shadow-vertical.png) repeat-x 0 -4px; }
.hremark table.trl .shr{ width: 4px; background: url(/howdy/images/shadow-horizontal.png) repeat-y; }
.hremark table.trl .shc{ background: url(/howdy/images/shadow-corner.png) no-repeat 0 -4px; }

.hremark table.brl .shb{ height: 4px; background: url(/howdy/images/shadow-vertical.png) repeat-x 0 13px; }
.hremark table.brl .shr{ width: 4px; background: url(/howdy/images/shadow-horizontal.png) repeat-y 0 0; }
.hremark table.brl .shc{ background: url(/howdy/images/shadow-corner.png) no-repeat 0 13px; }

.hremark table.trl .text,.hremark table.brl .text{ padding-left: 10px; }

/* Left to right */
.hremark table.tlr .shb{ height: 4px; background: url(/howdy/images/shadow-vertical.png) repeat-x 0 -4px; }
.hremark table.tlr .shr{ width: 4px; background: url(/howdy/images/shadow-horizontal.png) repeat-y -4px 0; }
.hremark table.tlr .shc{ background: url(/howdy/images/shadow-corner.png) no-repeat -4px -4px; }

.hremark table.blr .shb{ height: 4px; background: url(/howdy/images/shadow-vertical.png) repeat-x 0 13px; }
.hremark table.blr .shr{ width: 4px; background: url(/howdy/images/shadow-horizontal.png) repeat-y -4px 0; }
.hremark table.blr .shc{ background: url(/howdy/images/shadow-corner.png) no-repeat -4px 13px; }

.hremark table.tlr .text,.hremark table.blr .text{ padding-right: 10px; }

/* Color sets */

/*Rosa*/
.hremark.rosa .hdot{ background: url(/howdy/images/dot-rosa.png) no-repeat; }
.hremark.rosa table.trl .point{ background: url(/howdy/images/box-diamond-rosa.png) no-repeat 0 -17px; }
.hremark.rosa table.tlr .point{ background: url(/howdy/images/box-diamond-rosa.png) no-repeat -19px -17px; }
.hremark.rosa table.blr .point{ background: url(/howdy/images/box-diamond-rosa.png) no-repeat -19px 0; }
.hremark.rosa table.brl .point{ background: url(/howdy/images/box-diamond-rosa.png) no-repeat 0 0; }
.hremark.rosa table .text,
.hremark.rosa table .pole{ background-color: #D4145A; color: white; }

/*Cyan*/
.hremark.cyan .hdot{ background: url(/howdy/images/dot-cyan.png) no-repeat; }
.hremark.cyan table.trl .point{ background: url(/howdy/images/box-diamond-cyan.png) no-repeat 0 -17px; }
.hremark.cyan table.tlr .point{ background: url(/howdy/images/box-diamond-cyan.png) no-repeat -19px -17px; }
.hremark.cyan table.blr .point{ background: url(/howdy/images/box-diamond-cyan.png) no-repeat -19px 0; }
.hremark.cyan table.brl .point{ background: url(/howdy/images/box-diamond-cyan.png) no-repeat 0 0; }
.hremark.cyan table .text,
.hremark.cyan table .pole{ background-color: #00FFFF; color: #1F1F1F; }

/*Lime*/
.hremark.lime .hdot{ background: url(/howdy/images/dot-lime.png) no-repeat; }
.hremark.lime table.trl .point{ background: url(/howdy/images/box-diamond-lime.png) no-repeat 0 -17px; }
.hremark.lime table.tlr .point{ background: url(/howdy/images/box-diamond-lime.png) no-repeat -19px -17px; }
.hremark.lime table.blr .point{ background: url(/howdy/images/box-diamond-lime.png) no-repeat -19px 0; }
.hremark.lime table.brl .point{ background: url(/howdy/images/box-diamond-lime.png) no-repeat 0 0; }
.hremark.lime table .text,
.hremark.lime table .pole{ background-color: #BBCA00; color: #1F1F1F; }

/*Yellow*/
.hremark.yellow .hdot{ background: url(/howdy/images/dot-yellow.png) no-repeat; }
.hremark.yellow table.trl .point{ background: url(/howdy/images/box-diamond-yellow.png) no-repeat 0 -17px; }
.hremark.yellow table.tlr .point{ background: url(/howdy/images/box-diamond-yellow.png) no-repeat -19px -17px; }
.hremark.yellow table.blr .point{ background: url(/howdy/images/box-diamond-yellow.png) no-repeat -19px 0; }
.hremark.yellow table.brl .point{ background: url(/howdy/images/box-diamond-yellow.png) no-repeat 0 0; }
.hremark.yellow table .text,
.hremark.yellow table .pole{ background-color: #FCEE21; color: #1F1F1F; }

/*Red*/
.hremark.red .hdot{ background: url(/howdy/images/dot-red.png) no-repeat; }
.hremark.red table.trl .point{ background: url(/howdy/images/box-diamond-red.png) no-repeat 0 -17px; }
.hremark.red table.tlr .point{ background: url(/howdy/images/box-diamond-red.png) no-repeat -19px -17px; }
.hremark.red table.blr .point{ background: url(/howdy/images/box-diamond-red.png) no-repeat -19px 0; }
.hremark.red table.brl .point{ background: url(/howdy/images/box-diamond-red.png) no-repeat 0 0; }
.hremark.red table .text,
.hremark.red table .pole{ background-color: #EC1C24; color: white; }

/*Green*/
.hremark.green .hdot{ background: url(/howdy/images/dot-green.png) no-repeat; }
.hremark.green table.trl .point{ background: url(/howdy/images/box-diamond-green.png) no-repeat 0 -17px; }
.hremark.green table.tlr .point{ background: url(/howdy/images/box-diamond-green.png) no-repeat -19px -17px; }
.hremark.green table.blr .point{ background: url(/howdy/images/box-diamond-green.png) no-repeat -19px 0; }
.hremark.green table.brl .point{ background: url(/howdy/images/box-diamond-green.png) no-repeat 0 0; }
.hremark.green table .text,
.hremark.green table .pole{ background-color: #39B54A; color: white; }

/*Blue*/
.hremark.blue .hdot{ background: url(/howdy/images/dot-blue.png) no-repeat; }
.hremark.blue table.trl .point{ background: url(/howdy/images/box-diamond-blue.png) no-repeat 0 -17px; }
.hremark.blue table.tlr .point{ background: url(/howdy/images/box-diamond-blue.png) no-repeat -19px -17px; }
.hremark.blue table.blr .point{ background: url(/howdy/images/box-diamond-blue.png) no-repeat -19px 0; }
.hremark.blue table.brl .point{ background: url(/howdy/images/box-diamond-blue.png) no-repeat 0 0; }
.hremark.blue table .text,
.hremark.blue table .pole{ background-color: #0071BC; color: white; }

/*Orange*/
.hremark.orange .hdot{ background: url(/howdy/images/dot-orange.png) no-repeat; }
.hremark.orange table.trl .point{ background: url(/howdy/images/box-diamond-orange.png) no-repeat 0 -17px; }
.hremark.orange table.tlr .point{ background: url(/howdy/images/box-diamond-orange.png) no-repeat -19px -17px; }
.hremark.orange table.blr .point{ background: url(/howdy/images/box-diamond-orange.png) no-repeat -19px 0; }
.hremark.orange table.brl .point{ background: url(/howdy/images/box-diamond-orange.png) no-repeat 0 0; }
.hremark.orange table .text,
.hremark.orange table .pole{ background-color: #F15A24; color: white; }


.hremark .f{ width: 360px; margin-top: 8px; }
.hremark .f textarea{
	width: 348px;
	height: 50px;
	border: 1px white solid;
	font-family:Lucida Sans,"Lucida Sans",Lucida Grande,Lucida Sans Unicode,sans-serif;
	font-size: 11px;
}
.hremark .f textarea:focus{ /*border: 1px red solid;*/ }

.hremark .f input[type=submit],
.hremark .f input[type=button]{
	float: right;
	background-color: transparent;
	border: 1px white solid;
	margin: 4px;
	color: white;
	padding: 1px 3px 1px 3px;
	font-size: 9px;
}

.hremark .f input[type=text]{
	float: left;
	background-color: transparent;
	border: none;
	margin: 7px 4px 4px 0px;
	color: white;
	padding: 1px 3px 1px 0px;
	font-size: 9px;
	width: 200px;
}

.hremark.cyan .f input[type=text],
.hremark.lime .f input[type=text],
.hremark.yellow .f input[type=text]
{
	color: #1F1F1F;
}

.hremark.cyan .f input[type=submit],
.hremark.cyan .f input[type=button],
.hremark.yellow .f input[type=submit],
.hremark.yellow .f input[type=button],
.hremark.lime .f input[type=submit],
.hremark.lime .f input[type=button]
{
	border: 1px #1F1F1F solid;
	color: black;
}

.hremark .error{ color: red !important; }
.hremark.rosa .error{ color: black !important; }
