/* Make the pop up suggestion box visible to small devices */
.navbar-collapse.in {
	/* Make the pop up suggestion box visible to small devices*/
	overflow-y: visible;
}

/* Wider in smaller devices because the search form has its own row */
.typeahead, .tt-query, .tt-hint {
	width: 300px;
	margin-top: 4px;
}
.tt-menu {
	width: 400px;
}
	
/* Narrower in larger devices because the search form shares a row */
@media (min-width:768px) {
	.typeahead, .tt-query, .tt-hint {
		width: 200px;
	}
	.tt-menu {
		width: 250px;
	}
}
	
@media (min-width:1200px) {
	.typeahead, .tt-query, .tt-hint {
		width: 300px;
	}
	.tt-menu {
		width: 380px;
	}
}

.tt-query {
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
          box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
}

/* In the admin grid, don't go wider */
.adminGridFieldValue .typeahead, .adminGridFieldValue .tt-query, .adminGridFieldValue .tt-hint,
#rentalShipping .typeahead, #rentalShipping .tt-query, #rentalShipping .tt-hint {
	width: inherit;
}

.tt-hint {
  color: #999
}

.tt-menu {
  margin: 4px 0;
  padding: 8px 0;
  background-color: #fff;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 8px;
     -moz-border-radius: 8px;
          border-radius: 8px;
  -webkit-box-shadow: 0 5px 10px rgba(0,0,0,.2);
     -moz-box-shadow: 0 5px 10px rgba(0,0,0,.2);
          box-shadow: 0 5px 10px rgba(0,0,0,.2);
}

.tt-suggestion {
  padding: 3px 20px;
  line-height: 24px;
}

.tt-suggestion:hover {
  cursor: pointer;
  color: #fff;
  background-color: #0097cf;
}

.tt-suggestion.tt-cursor {
  color: #fff;
  background-color: #0097cf;

}

.tt-suggestion p {
  margin: 0;
}