#suggestion {
	background-color: var(--surface);
	position: absolute;
	left: 0;
	top: 100%;
	width: 100%;
	margin-top: 6px;
	border-radius: var(--r-lg);
	display: none;
	height: 355px;
	z-index: 50;
	border: 1px solid var(--line);
	box-shadow: var(--shadow-2);
	overflow: hidden;
}
#suggestion-prod {
	/*** vetnet: a tutta larghezza, la colonna "Filtra per" era il solo filtro brand ***/
	width: 100%;
	float: none
}
#suggestion-prod-Scrollbar, #suggestion-refine-Scrollbar {
	overflow: auto;
	height: 275px;
	position: relative;
	margin-top: 5px;
	background-image: url('https://images.demas.it/cdn/demas/img/demas-loader.svg');
	background-repeat: no-repeat;
	background-position: center center;
	background-size: 30px 30px;
}
@media(max-width:860px) {
	#suggestion-refine {
		display: none;
	}
	#suggestion-prod {
		width: 100%;
		float: none;
	}
}
.suggestion-prod-no {
	width: 100%;
	position: relative;
	margin: 20px 3% 0 1%;
	border-bottom: 1px solid var(--line);
	padding-bottom: 5px;
}
.suggestion-prod {
	width: 45%;
	position: relative;
	float: left;
	margin: 16px 3% 0 1%;
	border-bottom: 1px solid var(--line);
	padding-bottom: 8px;
}
@media(max-width:1170px) {
	.suggestion-prod {
		float: none;
		width: calc( 100% - 5% );
	}
}
#suggestion-prod .result {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 12px;
	margin: 20px 15px 0 2%;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--line);
	font-weight: 700;
	letter-spacing: .1em;
	color: var(--ink-soft);
	text-transform: uppercase
}
#suggestion-prod .result strong {
	background-color: var(--navy);
	font-size: 12px;
	color: #fff;
	line-height: 22px;
	padding: 0 10px;
}
.suggestion-prod .buttonz {
	position: absolute !important;
	right: 0;
	bottom: 2px
}
#suggestion-prod .buttonz {
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .06em;
	font-size: 10px;
	position: relative;
	color: var(--navy);
	padding: 5px 12px;
	float: right;
	margin-bottom: 5px
}
#suggestion-prod .buttonz a {
	color: var(--navy)
}
.suggestion-prod .img {
	float: left;
	width: 85px;
	margin-right: 10px;
	background-color: var(--surface);
	animation-name: cover;
	animation-duration: 2s;
	animation-iteration-count: 3;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	position: relative;
}
.suggestion-prod .img a .cover {
	position: absolute;
	top: 0;
	left: 0;
	object-fit: contain;
	object-position: center center;
}
.suggestion-prod .title {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 15px;
	font-weight: 700;
	line-height: 1.25;
	padding-top: 5px
}
.suggestion-prod .format {
	font-size: 12px;
	font-weight: 400;
	color: var(--ink-soft);
}
.suggestion-prod .format a {
	color: var(--ink-soft)
}
.suggestion-prod .price {
	font-size: 12px;
}
.suggestion-prod .price span {
	color: var(--navy);
	font-size: 17px;
	font-weight: 800;
	letter-spacing: -0.02em;
}
#suggestion-refine {
	width: 25%;
	float: left;
	padding-top: 16px;
	border-left: 1px solid var(--line);
	box-sizing: border-box;
}
#suggestion-refine .category-txt {
	font-family: 'Roboto Condensed', sans-serif;
	font-size: 12px;
	margin: 10px 15px 10px 6%;
	padding-bottom: 10px;
	border-bottom: 1px solid var(--line);
	font-weight: 700;
	letter-spacing: .1em;
	color: var(--ink-soft);
	text-transform: uppercase
}
#suggestion-refine .category {
	font-weight: 600;
	font-size: 12px;
	float: left;
	margin: 5px 5px;
	padding: 3px 10px;
	background-color: var(--navy-tint);
	transition: background-color var(--ease)
}
#suggestion-refine .category:hover {
	background-color: var(--ciano-tint)
}
#suggestion-refine .category a {
	color: var(--navy)
}
#suggestion-refine .category strong {
	background-color: var(--navy);
	color: #fff;
	padding: 0 8px;
}
#suggestion-refine .category span {
	padding: 0 4px
}
