/*the container must be positioned relative:*/

.autocomplete {
  position: relative;
  /*display: inline-block;*/
}

.autocomplete input {
	padding: 10px;
	font-size: 16px;
}

.autocomplete input[type=text] {
	/*background-color: #f1f1f1;*/
	/*width: 100%;*/
}

.autocomplete input[type=submit] {
	background-color: #E1FFFF;
	color: #fff;
	cursor: pointer;
}

.autocomplete-items {
	position: absolute;
	border: 1px solid #d4d4d4;
	border-bottom: none;
	border-top: none;
	z-index: 99;
	/*position the autocomplete items to be the same width as the container:*/
	top: 100%;
	left: 0;
	right: 0;
}

.autocomplete-items div {
	padding: 10px;
	cursor: pointer;
	background-color: #fff; 
	border-bottom: 1px solid #d4d4d4; 
}

/*when hovering an item:*/
.autocomplete-items div:hover {
	background-color: #e9e9e9; 
}

/*when navigating through the items using the arrow keys:*/
.autocomplete-active {
	background-color: DodgerBlue !important; 
	color: #ffffff; 
}


/* Autocomplete
----------------------------------*/
/*.ui-autocomplete { position: absolute; cursor: default; }*/
/* workarounds */
/** html .ui-autocomplete { width:1px; }*/ /* without this, the menu expands to 100% in IE6 */

/* Menu
----------------------------------*/
/*.ui-menu {
        list-style: none;
        padding: 10px;
        margin: 0;
        display:block;
}
.ui-menu .ui-menu {
        margin-top: -3px;
}
.ui-menu .ui-menu-item {
        margin:0;
        padding: 0;
}
.ui-menu .ui-menu-item a {
        text-decoration:none;
        display:block;
        padding:.2em .4em;
        line-height:1.5;
        zoom:1;
        border-bottom:1px silver solid;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
        margin: -1px;
}
*/