
/* default (inactive field) */
.sf_inactive{border:2px #ccc solid; color:#b4d3db;}
/* on focus (when field is clicked on)  */
.sf_active{border:2px #2A75C0 solid; background:#fff; color:#333;}
/* with text (when field is inactive but contains user's input)  */
.sf_text{border:2px #3c90a5 solid; background:#fff; color:#888;}

/* suggestions box */
/* js code generates unordered list */
.sf_suggestion{position:relative;}
.sf_suggestion ul{position:absolute; margin:0; padding:0; background:#DEF1FA; top:0; left:0;}
.sf_suggestion li{margin:0; padding:0; list-style:none;}
.sf_suggestion li a{display:block; text-indent:5px; color:#000;}
.sf_suggestion li.selected a{background:#2A75C0;}

p.info {margin:0 20px; font-size:110%; color:#999;}
p.floater{
	margin:0;
	position:absolute;
	top:2em;
	right:20px;
	float:left;
	line-height:2em;
	height:2em;
	font-size:120%;
	font-weight:bold;}
p.floater a{
	float:left;
	line-height:2em;
	height:2em;
	padding:0 20px;
	background:#8bb544;
	color:#fff;}
p.floater a:hover{
	background:#4a98af;
	color:#fff;}
code {
	font-size:110%;}
pre {
	margin:1em 0;
	padding:1em 20px;
	line-height:150%;
	background:#e5f1f4;
	border-left:1px solid #a4d5e4;}
p.more{
	font-size:120%;}
p.more a{
	font-weight:bold;}
p.sig {	
	padding:0 2em;
	text-align:left;
	color:#fff;}
form p{
	margin:0 15px;}

