/* Style For Suggestions */
    
/*
 For creating side border like this
 | item 1   |
 | item 2   |
 */
 
#suggestions_holder {
    z-index: 10000;
    width: 315px !important;
    left: 5px !important;
    top: 37px !important;
    height: auto !important;
    position: absolute !important;
    max-height: 300px;
    overflow-y: auto;
    overflow-x: hidden;
}
 
 @media screen and (max-width : 640px)  {
 	#suggestions_holder {
	z-index:10000;
	width:100% !important;
	left:0 !important;
	top:27px !important;
	height:auto !important;
 	}
 }
 
.suggestions .suggest_item{
	padding-bottom: 2px;
	padding-top: 2px;
	background-color:#f4f4f4;
	border-left:1px solid #cbddcb;
	border-right:1px solid #cbddcb;
	width:100% !important;
	z-index:10000;
}

.suggestions .suggest_item.even {
  background-color:#DDDDDD;
}

/*
 For creating top border like this
 ------------
   item 1
   ...
 */
.suggestions .suggest_item.first{
	border-top:1px solid #CCCCCC;
}

/*
 For creating bottom border like this
   ...
   item 2
  ------------
 */
.suggestions .suggest_item.last{
	border-bottom:1px solid #CCCCCC;
}

/*
 For coloring the selected item
 */
.suggestions .suggest_item.selected, .suggestions .suggest_item.selected .description{
	background-color:#ff8800;;
	color:#FFFFFF;
	cursor:pointer;
}

/*
 Image thumbnail
 */
.suggestions .suggest_item .thumbnail{
	background-color: transparent;
	background-position: top center;
	background-repeat: no-repeat;
	background-size:contain;
	margin: 1px 2px 1px 2px;
	float: left;
	width: 75px;
	height: 50px;
}

.suggestions .suggestion_title {
	font-size:80%;
}

/*
 Description
 */
.suggestions .suggest_item .description{
	font-style: italic;
	font-size: 11px;
	color: #777;
}