﻿/*****************************************************************************/
/*** SUGGEST ***/
/*****************************************************************************/

/* needed otherwise the searchBoxLine will pop-up in IE */
div.suggestFormWrap { position:absolute; z-index:10100; }
div.suggestLayer { position: absolute; margin: 0; text-align: left; max-width: 85%; z-index: 10000; }
div.suggestLayer ul { list-style: none; }

ul.suggestLayerList,
ul.suggestLayerBlock,
div.suggestLayerBlock {
	-webkit-box-shadow: 3px 3px 3px 0px rgba(152,152,152,0.5);
	-moz-box-shadow: 3px 3px 3px 0px rgba(152,152,152,0.5);
	box-shadow: 3px 3px 3px 0px rgba(152,152,152,0.5);
}

ul.suggestLayerList li,
ul.suggestLayerBlock li, 
ul.suggestLayerBlockText li, 
ul.suggestLayerBlockImage li { display: block; font-size: 0.75em; padding: 0.625em; }

.suggestLayerBlockText {  }
.suggestLayerBlockImage { } /* this is the whole image block of all results */

li.suggestHeader { font-weight: bold; }
li + li.suggestHeader { }

li.ffBrand:before,
li.ffCat:before,
li.ffProd:before { font-family: "FontAwesome"; font-weight: normal; padding-right: 0.625em; }
li.ffBrand:before { content:"\f005"; }
li.ffCat:before { content:"\f03a"; }
li.ffProd:before { content:"\f00a"; }

.suggestLayerBlock ul:first-child li.suggestHeader:first-child { /*background-image: url("../../images/demoshop/logo_fact-finder_suggest.png");*/ } /* factfinder logo */ 

.suggestLayerBlock ul.noborder { } /* not sure what this is */

li.suggestRow {
	cursor: pointer;
	-webkit-transition: all 0.3s ease-in-out;
  	-moz-transition: all 0.3s ease-in-out;
  	-ms-transition: all 0.3s ease-in-out;
  	-o-transition: all 0.3s ease-in-out;
  	transition: all 0.3s ease-in-out;
}

li.suggestRow:hover,
li.suggestRow:active,
li.suggestRow:focus { }
li.suggestHighlight{ }

li.suggestRow:after { content: ""; display: block; clear: both; }

li.suggestRowWithoutImage {}
li.suggestRowWithImage { }

span.suggestTextType { } /* not sure what this is */
span.suggestTextAmount { } /* not sure what this is */
span.suggestParentCategory { padding-left: 0.625em; }

ul.suggestLayerBlockImage span.suggestImage,
ul.suggestLayerBlockImage span.suggestTextQuery { float: left; }

span.suggestImage { width: 12%; min-width: 40px; max-width: 100px; }

ul.suggestLayerBlockImage span.suggestTextQuery { padding: 0.625em 2%; width: 80%; }

span.suggestImage img { display: block; width: 100%; }


/* +++ media queries +++ */
@media screen and (min-width: 1025px) {	
	div.suggestLayer { width: 45%; margin: 2.5em 0 0 0; }
    }