{exp:stash:set_list trim="yes" name="hc-vrs" parse_tags="yes" parse_conditionals="yes" parse_depth="2"}
	{exp:query sql="SELECT DISTINCT(hc.HotelID) as hotelid_hc, hc.HotelName as hotel_name, hc.HotelFileName as hotel_url, hc.PlaceName as hotel_city, hc.StarRating as hotel_star_rating, hc.HotelAddress as hotel_address, hc.ImageID as hotel_image FROM aff_hc_hotels hc JOIN aff_booking_bridge bb ON hc.HotelID=bb.hotelscombined_id WHERE hc.PropertyType='Vacation Rental' AND hc.ImageID!='Null' AND bb.status='open' AND bb.destination='{stash:destination}' ORDER BY PlaceName ASC"}
	
		{stash:property_name}{hotel_name}{/stash:property_name}
		{stash:property_city}{hotel_city}{/stash:property_city}
		
		{stash:hc_id}{hotelid_hc}{/stash:hc_id}
		{stash:hc_url}https://hotels.hawaii-guide.com/Hotel/{hotel_url}.htm?a_aid=73994&brandId=184360&label=WLTile-VR{/stash:hc_url}
		{stash:hc_image}{if hotel_image}https://edge.media.datahc.com/HI{hotel_image}.jpg{/if}{/stash:hc_image}
		
		{stash:hc_address}{hotel_address}{/stash:hc_address}
		{stash:hc_star_rating}{hotel_star_rating}{/stash:hc_star_rating}

	{/exp:query}
{/exp:stash:set_list}		
	
<nav class="row-fluid clear clearfix item-grid">
{exp:stash:get_list name="hc-vrs" unique="hc_id" process="end" parse_tags="yes" parse_conditionals="yes" sort="asc"}


			{if '{count}'=='3' || '{count}'=='6' || '{count}'=='9' || '{count}'=='12' || '{count}'=='15'  || '{count}'=='18'}
			<div class="item-box large-4 medium-12 small-12 column mb20{if '{count}'=='{total_results}'} end{/if}">
			{if:else}
			<div class="item-box large-4 medium-6 small-12 column mb20{if '{count}'=='{total_results}'} end{/if}">
			{/if}
		
				
				<div class="item-block dark-border" style="background:url(//aws.hawaii-guide.com{if '{hc_image}'!=''}{exp:jcogs_img:pair src='{hc_image}' crop='yes|center,center|0,0' width='900' allow_scale_larger='yes' height='450' quality='80'}{made}{/exp:jcogs_img:pair}{if:else}{exp:jcogs_img:pair src='/files/images/default-tile.jpg' crop='yes|center,center|0,0' width='900' allow_scale_larger='yes' height='450' quality='85'}{made}{/exp:jcogs_img:pair}{/if}) no-repeat top center;background-size:cover;">
					<div class="item-layer delay-1"></div><!--item-layer-->
					<div class="vertical-align">

							{if hc_star_rating}
								{if {hc_star_rating}>2.5 && {hc_star_rating}<4.5}
									<i class="gc-vc-best-value gc-xsmall text-white"></i>
								{/if}
								{if {hc_star_rating}>4}
									{exp:low_random:items}
										<i class="gc-vc-top-pick gc-xsmall text-white"></i>
										<i></i>
									{/exp:low_random:items}
								{/if}
							{/if}{!--hc_star_rating--}
						
						<p class="text-white h3">{property_name}</p>
						<p>

							<a href="{hc_url}" title="{property_name}" target="_blank" rel="nofollow noopener" class="c-button small button-blue border-white">
													
								<span class="text-white"><i class="fa fa-compass"></i> learn more &rarr;</span>
							
							</a>

						</p>
					</div><!--vertical-align-->
					{if property_city || hc_star_rating}
						<div class="item-meta">
							{if property_city}
								<span class="item-region">{if property_city}<i class="fa fa-map-marker"></i> {property_city}{/if}</span>
							{/if}
							{if hc_star_rating}
								<span class="item-guidereview" >
									{if hc_star_rating} 
									<span class="text-yellow">
										<i class="fa-star"></i>
										{exp:switchee variable="{hc_star_rating}"}
											{case value="2"}
												<i class="fa-star"></i>
												<i class="fa-star-o"></i>
												<i class="fa-star-o"></i>
												<i class="fa-star-o"></i>
											{/case}
											{case value="2.5"}
												<i class="fa-star"></i>
												<i class="fa-star-half-o"></i>
												<i class="fa-star-o"></i>
												<i class="fa-star-o"></i>
											{/case}
											{case value="3"}
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star-o"></i>
												<i class="fa-star-o"></i>
											{/case}
											{case value="3.5"}
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star-half-o"></i>
												<i class="fa-star-o"></i>
											{/case}
											{case value="4"}
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star-o"></i>
											{/case}
											{case value="4.5"}
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star-half-o"></i>
											{/case}
											{case value="5"}
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star"></i>
												<i class="fa-star"></i>
											{/case}
										{/exp:switchee}
									</span>
									{if:else}
										<i class="fa-guidereview"></i> {guidereview-letter}
									{/if}
								</span>
							{/if}	
						</div><!--item-meta-->
					{/if}

						
							{if hc_star_rating}
								{if {hc_star_rating}>2.5 && {hc_star_rating}<4.5}
									<span class="item-ribbon blue"><span>Great Value</span></span><!--item-ribbon-->
								{if:elseif {hc_star_rating}>4}
									{exp:low_random:items}
										<span class="item-ribbon yellow"><span>Top Pick</span></span><!--item-ribbon-->
										
									{/exp:low_random:items}								
								{/if}
							{/if}

								
					<div class="height-def"></div><!--height-xx-->
				</div><!--item-block-->
				
			</div><!--column-->
			
{/exp:stash:get_list}
</nav>