/*
	most of the css that makes it look good is in the jquery.autocomplete.css that comes with the autocomplete plugin.
	that formats the dropdown of search results.

	one class is used on the html interface itself and that's the X that allows you to remove an item.
	here is the styling I use.  add this to your main css file and season to taste.
*/
.iconic {
	background: #fff;
	color: #000;
	#border: 1px solid #ddd;
	padding: 2px 4px;
	font-weight: bold;
	font-family: Courier;
	text-decoration: none;
    padding-right: 5px;
}
.iconic:hover {
	text-decoration: none;
	color: #fff;
	background: #000;
	cursor: pointer;
}

input.ac_loading {
	background: #FFF url('../images/loading-indicator.gif') no-repeat;
	background-position: right;
}


/* change the X to an image */
.results_on_deck .iconic, .results_on_deck .iconic:hover {
    float: left;
    background: url(../images/cross.png) no-repeat;
    color: transparent;
    border: 0;
}

/* specific to a site I worked on. the formatted results were tables.  I sized them and floated them left, next to the icon */
.results_on_deck div table {
    float: left;
    width: 300px;
    border: 0;
}
/* and each div in the result clears to start a new row */
.results_on_deck > div {
    clear: both;
}