Property Items

---

Default Style

This is the default representation of a product box.

Copy
<div class="property-item">
    <div class="property-item-inner">
        <div class="price-tag-sq">112 &euro; <span>/ night</span></div>
        <a class="add-wishlist" href="#">
           <i class="icon icon-add-wishlist"></i>
        </a>

        <a class="image-sq" href="#">
            <span class="image-wrapper">
                <span class="image-inner">
                    <img src="assets/images/property/property_little_01.jpg" alt="" class="">
                </span>
            </span>
        </a>

        <div class="main-details">
           <div class="title-row">
               <a href="#" class="title-sq">Downtown Sweet House</a>
               <a href="#" class="avatar-sq">
                   <img src="assets/images/avatar/avatar_01.jpg" alt="">
               </a>
           </div>

           <div class="icons-row">
               <div class="icons-column">
                   <i class="icon icon-heart"></i> 8.6
               </div>
               <div class="icons-column">
                   <i class="icon icon-account-group-5"></i> x 4
               </div>
               <div class="icons-column">
                   <i class="icon icon-door-simple"></i> x 6
               </div>
               <div class="icons-column">
                   <i class="icon icon-bed-double"></i> x 2
               </div>
           </div>
        </div>
    </div>
</div>

Small

If you need a compact style for .property-item you can use .small-sq class.

Copy
<div class="property-item small-sq">
    <div class="property-item-inner">
    ...
    </div>
</div>

---

Caption Style

Adding .caption-sq class, the property item will transform as in the below example.
Also you can use .shadow-sq class on each .property-item to add shadow effect.

Copy
<div class="property-item caption-sq shadow-sq">
    <div class="property-item-inner">
    ...
    </div>
</div>

Small

If you need a compact style for .property-item you can use .small-sq.

Copy
<div class="property-item caption-sq shadow-sq small-sq">
    <div class="property-item-inner">
    ...
    </div>
</div>

---