ok

Mini Shell

Direktori : /proc/thread-self/root/proc/self/root/home2/selectio/www/thecomponents.in/file/
Upload File :
Current File : //proc/thread-self/root/proc/self/root/home2/selectio/www/thecomponents.in/file/element-banner.html

<!DOCTYPE html>
<html lang="en">

<!-- Mirrored from d-themes.com/html/riode/element-banner.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 19 Aug 2023 09:33:42 GMT -->
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0">
<title>Riode - Ultimate eCommerce Template</title>
<meta name="keywords" content="HTML5 Template" />
<meta name="description" content="Riode - Ultimate eCommerce Template">
<meta name="author" content="D-THEMES">

<link rel="icon" type="image/png" href="images/icons/favicon.png">
<script>
        WebFontConfig = {
            google: { families: ['Poppins:400,500,600,700'] }
        };
        (function (d) {
            var wf = d.createElement('script'), s = d.scripts[0];
            wf.src = 'js/webfont.js';
            wf.async = true;
            s.parentNode.insertBefore(wf, s);
        })(document);
    </script>
<link rel="stylesheet" type="text/css" href="vendor/fontawesome-free/css/all.min.css">
<link rel="stylesheet" type="text/css" href="vendor/animate/animate.min.css">

<link rel="stylesheet" type="text/css" href="vendor/magnific-popup/magnific-popup.min.css">
<link rel="stylesheet" type="text/css" href="vendor/owl-carousel/owl.carousel.min.css">
<link rel="stylesheet" type="text/css" href="vendor/codemirror/codemirror.css">
<link rel="stylesheet" type="text/css" href="vendor/sticky-icon/stickyicon.css">

<link rel="stylesheet" type="text/css" href="css/style.min.css">
</head>
<body>
<div class="page-wrapper">
<header class="header">
<div class="header-top">
<div class="container">
<div class="header-left">
<p class="welcome-msg">Welcome to Riode store message or remove it!</p>
</div>
<div class="header-right">
<div class="dropdown">
<a href="#currency">USD</a>
<ul class="dropdown-box">
<li><a href="#USD">USD</a></li>
<li><a href="#EUR">EUR</a></li>
</ul>
</div>

<div class="dropdown ml-5">
<a href="#language">ENG</a>
<ul class="dropdown-box">
<li>
<a href="#USD">ENG</a>
</li>
<li>
<a href="#EUR">FRH</a>
</li>
</ul>
</div>

<span class="divider"></span>
<a href="contact-us.html" class="contact d-lg-show"><i class="d-icon-map"></i>Contact</a>
<a href="#" class="help d-lg-show"><i class="d-icon-info"></i> Need Help</a>
<a class="login-link" href="ajax/login.html" data-toggle="login-modal"><i class="d-icon-user"></i>Sign in</a>
<span class="delimiter">/</span>
<a class="register-link ml-0" href="ajax/login.html" data-toggle="login-modal">Register</a>

</div>
</div>
</div>

<div class="header-middle sticky-header fix-top sticky-content">
<div class="container">
<div class="header-left">
<a href="#" class="mobile-menu-toggle">
<i class="d-icon-bars2"></i>
</a>
<a href="demo1.html" class="logo">
<img src="images/logo.png" alt="logo" width="153" height="44" />
</a>

<div class="header-search hs-simple">
<form action="#" class="input-wrapper">
<input type="text" class="form-control" name="search" autocomplete="off" placeholder="Search..." required />
<button class="btn btn-search" type="submit">
<i class="d-icon-search"></i>
</button>
</form>
</div>

</div>
<div class="header-right">
<a href="tel:#" class="icon-box icon-box-side">
<div class="icon-box-icon mr-0 mr-lg-2">
<i class="d-icon-phone"></i>
</div>
<div class="icon-box-content d-lg-show">
<h4 class="icon-box-title">Call Us Now:</h4>
<p>0(800) 123-456</p>
</div>
</a>
<span class="divider"></span>
<div class="dropdown wishlist wishlist-dropdown off-canvas">
<a href="wishlist.html" class="wishlist-toggle">
<i class="d-icon-heart"></i>
</a>
<div class="canvas-overlay"></div>

<div class="dropdown-box scrollable">
<div class="canvas-header">
<h4 class="canvas-title">wishlist</h4>
<a href="#" class="btn btn-dark btn-link btn-icon-right btn-close">close<i class="d-icon-arrow-right"></i><span class="sr-only">wishlist</span></a>
</div>
<div class="products scrollable">
<div class="product product-wishlist">
<figure class="product-media">
<a href="product.html">
<img src="images/wishlist/product-1.jpg" width="100" height="100" alt="product" />
</a>
<button class="btn btn-link btn-close">
<i class="fas fa-times"></i><span class="sr-only">Close</span>
</button>
</figure>
<div class="product-detail">
<a href="product.html" class="product-name">Girl's Dark Bag</a>
<div class="price-box">
<span class="product-price">$84.00</span>
</div>
</div>
</div>

<div class="product product-wishlist">
<figure class="product-media">
<a href="product.html">
<img src="images/wishlist/product-2.jpg" width="100" height="100" alt="product" />
</a>
<button class="btn btn-link btn-close">
<i class="fas fa-times"></i><span class="sr-only">Close</span>
</button>
</figure>
<div class="product-detail">
<a href="product.html" class="product-name">Women's Fashional Comforter
</a>
<div class="price-box">
<span class="product-price">$84.00</span>
</div>
</div>
</div>

<div class="product product-wishlist">
<figure class="product-media">
<a href="product.html">
<img src="images/wishlist/product-3.jpg" width="100" height="100" alt="product" />
</a>
<button class="btn btn-link btn-close">
<i class="fas fa-times"></i><span class="sr-only">Close</span>
</button>
</figure>
<div class="product-detail">
<a href="product.html" class="product-name">Wide Knickerbockers</a>
<div class="price-box">
<span class="product-price">$84.00</span>
</div>
</div>
</div>

</div>
<a href="wishlist.html" class="btn btn-dark wishlist-btn mt-4"><span>Go To
Wishlist</span></a>

</div>

</div>
<span class="divider"></span>
<div class="dropdown cart-dropdown type2 mr-0 mr-lg-2">
<a href="#" class="cart-toggle label-block link">
<div class="cart-label d-lg-show">
<span class="cart-name">Shopping Cart:</span>
<span class="cart-price">$0.00</span>
</div>
<i class="d-icon-bag"><span class="cart-count">2</span></i>
</a>

<div class="dropdown-box">
<div class="products scrollable">
<div class="product product-cart">
<figure class="product-media">
<a href="product.html">
<img src="images/cart/product-1.jpg" alt="product" width="80" height="88" />
</a>
<button class="btn btn-link btn-close">
<i class="fas fa-times"></i><span class="sr-only">Close</span>
</button>
</figure>
<div class="product-detail">
<a href="product.html" class="product-name">Riode White Trends</a>
<div class="price-box">
<span class="product-quantity">1</span>
<span class="product-price">$21.00</span>
</div>
</div>
</div>

<div class="product product-cart">
<figure class="product-media">
<a href="product.html">
<img src="images/cart/product-2.jpg" alt="product" width="80" height="88" />
</a>
<button class="btn btn-link btn-close">
<i class="fas fa-times"></i><span class="sr-only">Close</span>
</button>
</figure>
<div class="product-detail">
<a href="product.html" class="product-name">Dark Blue Women’s
Leomora Hat</a>
<div class="price-box">
<span class="product-quantity">1</span>
<span class="product-price">$118.00</span>
</div>
</div>
</div>

</div>

<div class="cart-total">
<label>Subtotal:</label>
<span class="price">$139.00</span>
</div>

<div class="cart-action">
<a href="cart.html" class="btn btn-dark btn-link">View Cart</a>
<a href="checkout.html" class="btn btn-dark"><span>Go To Checkout</span></a>
</div>

</div>

</div>
<div class="header-search hs-toggle mobile-search">
<a href="#" class="search-toggle">
<i class="d-icon-search"></i>
</a>
<form action="#" class="input-wrapper">
<input type="text" class="form-control" name="search" autocomplete="off" placeholder="Search your keyword..." required />
<button class="btn btn-search" type="submit">
<i class="d-icon-search"></i>
</button>
</form>
</div>

</div>
</div>
</div>
<div class="header-bottom d-lg-show">
<div class="container">
<div class="header-left">
<nav class="main-nav">
<ul class="menu">
<li>
<a href="demo1.html">Home</a>
</li>
<li>
<a href="shop.html">Categories</a>
<div class="megamenu">
<div class="row">
<div class="col-6 col-sm-4 col-md-4 col-lg-3">
<h4 class="menu-title">Variations 1</h4>
<ul>
<li><a href="shop-classic-filter.html">Classic Filter</a></li>
<li><a href="shop-left-toggle-sidebar.html">Left Toggle Filter</a>
</li>
<li><a href="shop-right-toggle-sidebar.html">Right Toggle
Sidebar</a></li>
<li><a href="shop-horizontal-filter.html">Horizontal Filter </a>
</li>
<li><a href="shop-navigation-filter.html">Navigation Filter</a></li>
<li><a href="shop-off-canvas-filter.html">Off-Canvas Filter </a>
</li>
<li><a href="shop-top-banner.html">Top Banner</a></li>
<li><a href="shop-inner-top-banner.html">Inner Top Banner</a></li>
<li><a href="shop-with-bottom-block.html">With Bottom Block</a></li>
<li><a href="shop-category-in-page-header.html">Category In Page
Header</a>
</ul>
</div>
<div class="col-6 col-sm-4 col-md-4 col-lg-3">
<h4 class="menu-title">Variations 2</h4>
<ul>
<li><a href="shop-grid-3cols.html">3 Columns Mode</a></li>
<li><a href="shop-grid-4cols.html">4 Columns Mode</a></li>
<li><a href="shop-grid-5cols.html">5 Columns Mode</a></li>
<li><a href="shop-grid-6cols.html">6 Columns Mode</a></li>
<li><a href="shop-grid-7cols.html">7 Columns Mode</a></li>
<li><a href="shop-grid-8cols.html">8 Columns Mode</a></li>
<li><a href="shop-list-mode.html">List Mode</a></li>
<li><a href="shop-pagination.html">Pagination</a></li>
<li><a href="shop-infinite-ajaxscroll.html">Infinite Ajaxscroll </a>
</li>
<li><a href="shop-loadmore-button.html">Loadmore Button</a></li>
</ul>
</div>
<div class="col-6 col-sm-4 col-md-4 col-lg-3">
<h4 class="menu-title">Variations 3</h4>
<ul>
<li><a href="shop-category-grid-shop.html">Category Grid Shop</a>
</li>
<li><a href="shop-category%2bproducts.html">Category + Products</a>
</li>
<li><a href="shop-default-1.html">Shop Default 1 </a></li>
<li><a href="shop-default-2.html">Shop Default 2</a>
</li>
<li><a href="shop-default-3.html">Shop Default 3</a>
</li>
<li><a href="shop-default-4.html">Shop Default 4</a>
</li>
<li><a href="shop-default-5.html">Shop Default 5</a>
</li>
<li><a href="shop-default-6.html">Shop Default 6</a>
</li>
<li><a href="shop-default-7.html">Shop Default 7</a>
</li>
<li><a href="shop-default-8.html">Shop Default 8</a>
</li>
</ul>
</div>
<div class="col-6 col-sm-4 col-md-4 col-lg-3 menu-banner menu-banner1 banner banner-fixed">
<figure>
<img src="images/menu/banner-1.jpg" alt="Menu banner" width="221" height="330" />
</figure>
<div class="banner-content y-50">
<h4 class="banner-subtitle font-weight-bold text-primary ls-m">Sale.
</h4>
<h3 class="banner-title font-weight-bold"><span class="text-uppercase">Up to</span>70% Off</h3>
<a href="shop.html" class="btn btn-link btn-underline">shop now<i class="d-icon-arrow-right"></i></a>
</div>
</div>

</div>
</div>
</li>
<li>
<a href="product.html">Products</a>
<div class="megamenu">
<div class="row">
<div class="col-6 col-sm-4 col-md-3">
<h4 class="menu-title">Product Pages</h4>
<ul>
<li><a href="product-simple.html">Simple Product</a></li>
<li><a href="product-featured.html">Featured &amp; On Sale</a></li>
<li><a href="product.html">Variable Product</a></li>
<li><a href="product-variable-swatch.html">Variation Swatch
Product</a></li>
<li><a href="product-grouped.html">Grouped Product </a></li>
<li><a href="product-external.html">External Product</a></li>
<li><a href="product-in-stock.html">In Stock Product</a></li>
<li><a href="product-out-stock.html">Out of Stock Product</a></li>
<li><a href="product-upsell.html">Upsell Products</a></li>
<li><a href="product-cross-sell.html">Cross Sell Products</a></li>
</ul>
</div>
<div class="col-6 col-sm-4 col-md-3">
<h4 class="menu-title">Product Layouts</h4>
<ul>
<li><a href="product-vertical.html">Vertical Thumb</a></li>
<li><a href="product-horizontal.html">Horizontal Thumb</a></li>
<li><a href="product-gallery.html">Gallery Type</a></li>
<li><a href="product-grid.html">Grid Images</a></li>
<li><a href="product-masonry.html">Masonry Images</a></li>
<li><a href="product-sticky.html">Sticky Info</a></li>
<li><a href="product-sticky-both.html">Left & Right Sticky</a></li>
<li><a href="product-left-sidebar.html">With Left Sidebar</a></li>
<li><a href="product-right-sidebar.html">With Right Sidebar</a></li>
<li><a href="product-full.html">Full Width Layout </a></li>
</ul>
</div>
<div class="col-6 col-sm-4 col-md-3">
<h4 class="menu-title">Product Features</h4>
<ul>
<li><a href="product-sale.html">Sale Countdown</a></li>
<li><a href="product-hurryup.html">Hurry Up Notification </a></li>
<li><a href="product-attribute-guide.html">Attribute Guide </a></li>
<li><a href="product-sticky-cart.html">Add Cart Sticky</a></li>
<li><a href="product-thumbnail-label.html">Labels on Thumbnail</a>
</li>
<li><a href="product-more-description.html">More Description
Tabs</a></li>
<li><a href="product-accordion-data.html">Data In Accordion</a></li>
<li><a href="product-tabinside.html">Data Inside</a></li>
<li><a href="product-video.html">Video Thumbnail </a></li>
<li><a href="product-360-degree.html">360 Degree Thumbnail </a></li>
</ul>
</div>
<div class="col-6 col-sm-4 col-md-3 menu-banner menu-banner2 banner banner-fixed">
<figure>
<img src="images/menu/banner-2.jpg" alt="Menu banner" width="221" height="330" />
</figure>
<div class="banner-content x-50 text-center">
<h3 class="banner-title text-white text-uppercase">Sunglasses</h3>
<h4 class="banner-subtitle font-weight-bold text-white mb-0">$23.00
-
$120.00</h4>
</div>
</div>

</div>
</div>
</li>
<li>
<a href="#">Pages</a>
<ul>
<li><a href="about-us.html">About</a></li>
<li><a href="contact-us.html">Contact Us</a></li>
<li><a href="account.html">My Account</a></li>
<li><a href="wishlist.html">Wishlist</a></li>
<li><a href="faq.html">FAQs</a></li>
<li><a href="error-404.html">Error 404</a>
<ul>
<li><a href="error-404.html">Error 404-1</a></li>
<li><a href="error-404-1.html">Error 404-2</a></li>
<li><a href="error-404-2.html">Error 404-3</a></li>
<li><a href="error-404-3.html">Error 404-4</a></li>
</ul>
</li>
<li><a href="coming-soon.html">Coming Soon</a></li>
</ul>
</li>
<li>
<a href="blog-classic.html">Blog</a>
<ul>
<li><a href="blog-classic.html">Classic</a></li>
<li><a href="blog-listing.html">Listing</a></li>
<li>
<a href="#">Grid</a>
<ul>
<li><a href="blog-grid-2col.html">Grid 2 columns</a></li>
<li><a href="blog-grid-3col.html">Grid 3 columns</a></li>
<li><a href="blog-grid-4col.html">Grid 4 columns</a></li>
<li><a href="blog-grid-sidebar.html">Grid sidebar</a></li>
</ul>
</li>
<li>
<a href="#">Masonry</a>
<ul>
<li><a href="blog-masonry-2col.html">Masonry 2 columns</a></li>
<li><a href="blog-masonry-3col.html">Masonry 3 columns</a></li>
<li><a href="blog-masonry-4col.html">Masonry 4 columns</a></li>
<li><a href="blog-masonry-sidebar.html">Masonry sidebar</a></li>
</ul>
</li>
<li>
<a href="#">Mask</a>
<ul>
<li><a href="blog-mask-grid.html">Blog mask grid</a></li>
<li><a href="blog-mask-masonry.html">Blog mask masonry</a></li>
</ul>
</li>
<li>
<a href="post-single.html">Single Post</a>
</li>
</ul>
</li>
<li class="active d-xl-show">
<a href="element.html">Elements</a>
<div class="megamenu">
<div class="row">
<div class="col-md-3">
<h4 class="menu-title">Elements 1</h4>
<ul>
<li><a href="element-accordions.html">Accordions</a></li>
<li><a href="element-alerts.html">Alert &amp; Notification</a></li>
<li><a href="element-banner-effect.html">Banner Effect
</a></li>
<li><a href="element-banner.html">Banner
</a></li>
<li><a href="element-blog-posts.html">Blog Posts</a></li>
<li><a href="element-breadcrumb.html">Breadcrumb
</a></li>
<li><a href="element-buttons.html">Buttons</a></li>
<li><a href="element-cta.html">Call to Action</a></li>
<li><a href="element-countdown.html">Countdown
</a></li>
</ul>
</div>
<div class="col-md-3">
<h4 class="menu-title">Elements 2</h4>
<ul>
<li><a href="element-counter.html">Counter </a></li>
<li><a href="element-creative-grid.html">Creative Grid
</a></li>
<li><a href="element-animation.html">Entrance Effect
</a></li>
<li><a href="element-floating.html">Floating
</a></li>
<li><a href="element-hotspot.html">Hotspot
</a></li>
<li><a href="element-icon-boxes.html">Icon Boxes</a></li>
<li><a href="element-icons.html">Icons</a></li>
<li><a href="element-image-box.html">Image box
</a></li>
<li><a href="element-instagrams.html">Instagrams</a></li>
</ul>
</div>
<div class="col-md-3">
<h4 class="menu-title">Elements 3</h4>
<ul>
<li><a href="element-categories.html">Product Category</a></li>
<li><a href="element-products.html">Products</a></li>
<li><a href="element-product-banner.html">Products + Banner
</a></li>
<li><a href="element-product-grid.html">Products + Grid
</a></li>
<li><a href="element-product-single.html">Product Single
</a>
</li>
<li><a href="element-product-tab.html">Products + Tab
</a></li>
<li><a href="element-single-product.html">Single Product
</a></li>
<li><a href="element-slider.html">Slider
</a></li>
<li><a href="element-social-link.html">Social Icons </a></li>
</ul>
</div>
<div class="col-md-3">
<h4 class="menu-title">Elements 4</h4>
<ul>
<li><a href="element-subcategory.html">Subcategory
</a></li>
<li><a href="element-svg-floating.html">Svg Floating
</a></li>
<li><a href="element-tabs.html">Tabs</a></li>
<li><a href="element-testimonials.html">Testimonials
</a></li>
<li><a href="element-titles.html">Title</a></li>
<li><a href="element-typography.html">Typography</a></li>
<li><a href="element-vendor.html">Vendor
</a></li>
<li><a href="element-video.html">Video
</a></li>
</ul>
</div>
</div>
</div>
</li>
<li>
<a href="about-us.html">About Us</a>
</li>
</ul>
</nav>
</div>
<div class="header-right">
<a href="#"><i class="d-icon-card"></i>Special Offers</a>
<a href="https://d-themes.com/buynow/riode.html" class="ml-6">Buy Riode!</a>
</div>
</div>
</div>
</header>

<main class="main">
<div class="page-header" style="background-image: url('images/shop/page-header-back.jpg'); background-color: #3C63A4;">
<h3 class="page-subtitle">Elements</h3>
<h1 class="page-title">Banner</h1>
<ul class="breadcrumb">
<li><a href="demo1.html"><i class="d-icon-home"></i></a></li>
<li class="delimiter">/</li>
<li><a href="element.html">Elements</a></li>
<li class="delimiter">/</li>
<li>Elements Banner</li>
</ul>
</div>

<div class="page-content banner-page banner-element">
<section class="mt-10 pt-7">
<div class="container">
<h2 class="title title-center title-descri mb-2">Riode Banner</h2>
<p class="text-body text-center title-descri">Banner is a good choice to advertise your
products,
categories,
posts and any other
important things. Make your own banner with Riode.</p>
</div>
<div class="code-template">
<div class="banner banner-fixed banner-image code-content" style="background-color: #46b2e8;">
<figure>
<img src="images/elements/banner/banner.jpg" alt="intro-banner" width="1903" height="630" style="background-color: #34ace5;" />
</figure>
<div class="container">
<div class="banner-content y-50">
<h4 class="banner-subtitle font-weight-bold ls-l">
<span class="d-inline-block slide-animate" data-animation-options="{'name': 'fadeInRightShorter', 'duration': '1s', 'delay': '.2s'}">Buy
2 Get</span>
<span class="d-inline-block label-star bg-white text-primary slide-animate" data-animation-options="{'name': 'fadeInRightShorter', 'duration': '1s', 'delay': '.4s'}">1
Free</span>
</h4>
<h2 class="banner-title font-weight-bold text-white lh-1 ls-md slide-animate" data-animation-options="{'name': 'fadeInUpShorter', 'duration': '1.2s', 'delay': '1s'}">
Fashionable</h2>
<h3 class="font-weight-normal lh-1 ls-l text-white slide-animate" data-animation-options="{'name': 'fadeInUpShorter', 'duration': '1.2s', 'delay': '1s'}">
Collection</h3>
<p class="slide-animate text-white ls-s mb-7" data-animation-options="{'name': 'fadeInUpShorter', 'duration': '1.2s', 'delay': '1s'}">
Get Free Shipping on all orders over $99.00</p>
<a href="shop.html" class="btn btn-dark btn-rounded slide-animate" data-animation-options="{'name': 'fadeInUpShorter', 'duration': '1s', 'delay': '1.8s'}">Shop
Now<i class="d-icon-arrow-right"></i></a>
</div>
</div>
</div>
<div class="show-code">
<i class="fas fa-code mr-1"></i>Show Code
</div>
</div>
</section>
<section class="mt-10 pt-7">
<div class="container">
<h2 class="title title-center title-descri mb-2">Video Banner</h2>
<p class="text-body text-center title-descri">You could make video banner
with any video and exclusive player button.</p>
</div>
<div class="code-template">
<div class="banner video-banner pl-2 pr-2 code-content" style="background-image: url(images/elements/banner/video-banner.jpg); background-color: #9bb5c4;">
<div class="banner-content text-center appear-animate" data-animation-options="{
                                'name': 'blurIn'
                            }">
<h4 class="banner-subtitle font-secondary mb-0 font-weight-bold text-white text-uppercase">
BRAND EXPERIENCE
</h4>
<h3 class="banner-title font-secondary mb-4 font-weight-bold text-white text-uppercase">
PREMIUM FOR THE PROS 2022
</h3>
<a class="btn-play btn-iframe text-white" href="video/memory-of-a-woman.mp4"><i class="d-icon-play-solid"></i></a>
</div>
</div>
<div class="show-code">
<i class="fas fa-code mr-1"></i>Show Code
</div>
</div>
</section>
<section class="mt-10 pt-7">
<div class="container">
<h2 class="title title-center title-descri mb-2">Parallax Banner</h2>
<p class="text-body text-center title-descri">Another tip to make your site fascinating is
making parallax banner.
</p>
</div>
<div class="code-template">
<div class="banner banner-background parallax text-center code-content" data-option="{'offset': -60}" data-image-src="images/elements/banner/parallax.jpg" style="background-color: #2d2f33;">
<div class="container">
<div class="banner-content appear-animate" data-animation-options="{'name': 'blurIn', 'duration': '1s', 'delay': '.2s'}">
<h4 class="banner-subtitle text-white font-weight-bold ls-l">
Extra<span class="d-inline-block label-star bg-dark text-primary ml-4 mr-2">30%
Off</span>Online
</h4>
<h3 class="banner-title font-weight-bold text-white">Summer Season Sale</h3>
<p class="text-white ls-s">Free shipping on orders over $99</p>
<a href="shop.html" class="btn btn-primary btn-rounded btn-icon-right">Shop Now<i class="d-icon-arrow-right"></i></a>
</div>
</div>
</div>
<div class="show-code">
<i class="fas fa-code mr-1"></i>Show Code
</div>
</div>
</section>
<section class="element-section bg-white mt-10">
<div class="container">
<p class="text-center text-uppercase ls-s mb-1">For your new website design.</p>
<h2 class="title title-center ls-s mb-8">Riode Elements</h2>
<div class="row elements justify-content-center">
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-accordions.html" class="element-type">
<div class="element element-accordian">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<rect x="16.396" y="18.941" width="67.209" height="4.045"></rect>
<rect x="16.396" y="33.459" width="38.751" height="4.044"></rect>
<rect x="16.396" y="47.977" width="51.376" height="4.048"></rect>
<rect x="16.396" y="62.496" width="66.043" height="4.047"></rect>
<rect x="16.396" y="77.016" width="39.376" height="4.043"></rect>
</svg>
<p>accordions</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-banner.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="62px" viewBox="0 0 80 62" xml:space="preserve" style="margin: -8px 0 8px 0;">
<g>
<path d="M71.612,39.006c-0.314-0.42-1.229-0.922-3.797-0.922c-1.674,0-3.819,0.208-6.56,0.635l-0.268,0.042l0.284,1.691   l0.246-0.038c2.355-0.37,4.99-0.609,6.711-0.609c0.284,0,0.554,0.007,0.826,0.021l0.975,0.053l-0.405,0.879   c-2.603,5.659-2.596,9.772-2.592,11.982l-0.011,1.298l-0.743-0.094c-3.95-0.492-8.273-1.747-11.284-3.275   c-1.159-0.59-2.104-1.566-1.205-4.67l-1.67-0.488c-0.956,3.301-0.276,5.486,2.075,6.68c3.517,1.783,8.445,3.147,12.861,3.561   c0.648,0.06,1.043-0.251,1.144-0.34c0.551-0.497,0.575-1.257,0.573-2.67c-0.004-2.251-0.011-6.438,2.934-12.299   C71.954,39.942,71.92,39.419,71.612,39.006z">
</path>
<path d="M8.295,40.441c2.939,5.856,2.934,10.047,2.931,12.298c-0.001,1.414,0.024,2.174,0.577,2.674   c0.117,0.104,0.448,0.346,0.974,0.346c0.054,0,0.109-0.003,0.167-0.008c4.426-0.417,9.353-1.781,12.859-3.561   c2.355-1.196,3.035-3.382,2.075-6.682l-1.669,0.49c0.899,3.112-0.101,4.108-1.204,4.67c-3.015,1.528-7.339,2.783-11.286,3.275   l-0.748,0.094l-0.003-1.297c0.002-2.214,0.006-6.334-2.591-11.979L9.975,39.89l0.969-0.058c0.251-0.015,0.539-0.022,0.857-0.022   c1.771,0,4.273,0.227,6.693,0.607l0.233,0.035l0.284-1.69l-0.258-0.041c-2.736-0.429-4.884-0.637-6.564-0.637   c-2.572,0-3.489,0.504-3.805,0.927C8.081,39.416,8.048,39.951,8.295,40.441z">
</path>
<path d="M64.225,30.435c0.203-0.743,0.1-1.522-0.293-2.192c-0.392-0.67-1.026-1.148-1.787-1.348   c-0.1-0.027-10.297-2.654-22.132-2.654c-12.964,0-21.654,2.496-22.018,2.603c-1.54,0.454-2.455,2.065-2.039,3.592l4.249,15.564   c0.338,1.234,1.478,2.097,2.771,2.097c0.289,0,0.573-0.042,0.844-0.125c0.356-0.104,8.764-2.521,15.909-2.521   c0.229,0,0.457,0.002,0.686,0.008c7.697,0.166,15.115,2.272,15.936,2.512c0.277,0.084,0.563,0.127,0.852,0.127   c1.295,0,2.435-0.861,2.771-2.096L64.225,30.435z M58.248,45.547c-0.114,0.444-0.593,0.793-1.089,0.793   c-0.103,0-0.202-0.016-0.295-0.047c-0.323-0.097-8.072-2.401-16.412-2.586c-0.244-0.006-0.488-0.008-0.732-0.008   c-7.762,0-16.063,2.493-16.412,2.599c-0.107,0.031-0.21,0.046-0.316,0.046c-0.496,0-0.932-0.328-1.06-0.797l-4.25-15.565   c-0.168-0.616,0.211-1.288,0.827-1.467c0.929-0.259,9.413-2.528,21.505-2.528c11.449,0,21.256,2.488,21.668,2.594   c0.299,0.076,0.549,0.266,0.705,0.534c0.153,0.265,0.194,0.571,0.117,0.863L58.248,45.547z">
</path>
</g>
</svg>
<p>banner</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-banner-effect.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="73px" height="73px" viewBox="0 0 80 73" xml:space="preserve">
<g id="Element_4_1">
<g>
<path d="M35.419,39.002l-1.637-0.913l-2.445,1.348l-0.195-0.092l0.022-0.099l0.601-2.542l-2.284-1.906l3.046-0.314l1.11-2.419    c0.042-0.037,0.096-0.058,0.152-0.058h0.029l0.096,0.039l0.022,0.041l0.452,0.977c0.096-0.025,0.189-0.059,0.289-0.067    l0.758-0.067l-0.559-1.239c-0.098-0.212-0.253-0.389-0.449-0.51l-0.056-0.03c-0.172-0.101-0.373-0.153-0.585-0.153    c-0.235,0-0.462,0.063-0.657,0.184c-0.204,0.132-0.356,0.307-0.452,0.52l-0.833,1.834l-0.073,0.006l-2.047,0.184    c-0.232,0.022-0.45,0.107-0.627,0.245c-0.187,0.141-0.323,0.332-0.397,0.554c-0.073,0.213-0.08,0.44-0.02,0.659    c0.067,0.229,0.192,0.422,0.371,0.572l1.585,1.322l-0.459,1.944c-0.055,0.229-0.037,0.464,0.052,0.678    c0.078,0.208,0.23,0.394,0.43,0.528c0.187,0.13,0.408,0.202,0.642,0.211l0.06,0.002l0.009-0.002    c0.219-0.009,0.408-0.062,0.581-0.157l1.834-1.033l1.394,0.782L35.419,39.002z">
</path>
<path d="M51.273,34.523c-0.071-0.221-0.208-0.412-0.396-0.555c-0.178-0.138-0.395-0.223-0.629-0.246l-2.118-0.188l-0.834-1.835    c-0.095-0.213-0.248-0.388-0.454-0.521c-0.365-0.226-0.881-0.238-1.237-0.03l-0.063,0.035c-0.19,0.118-0.346,0.294-0.444,0.508    l-0.559,1.238L45.334,33c0.089,0.009,0.171,0.039,0.256,0.061l0.469-1.019l0.047-0.019c0.048-0.027,0.165-0.018,0.232,0.042    l0.031,0.042l1.079,2.376l3.046,0.314l-2.285,1.906l0.624,2.643l-0.195,0.089l-2.445-1.346l-1.612,0.899l0.241,1.027l1.371-0.77    l1.832,1.034c0.174,0.096,0.363,0.147,0.563,0.153l0.087,0.002c0.233-0.009,0.454-0.081,0.64-0.209    c0.201-0.137,0.354-0.323,0.43-0.526c0.09-0.219,0.107-0.453,0.054-0.682l-0.457-1.944l0.06-0.049l1.525-1.273    c0.175-0.148,0.303-0.346,0.368-0.573C51.354,34.966,51.347,34.732,51.273,34.523z">
</path>
</g>
<g>
<path d="M71.598,39.968c-0.314-0.42-1.229-0.922-3.797-0.922c-1.674,0-3.819,0.208-6.56,0.635l-0.268,0.042l0.284,1.691    l0.246-0.038c2.355-0.37,4.99-0.609,6.711-0.609c0.284,0,0.554,0.007,0.826,0.021l0.975,0.053L69.61,41.72    c-2.603,5.659-2.596,9.772-2.592,11.982L67.008,55l-0.743-0.094c-3.95-0.492-8.273-1.747-11.284-3.275    c-1.159-0.59-2.104-1.566-1.205-4.67l-1.67-0.488c-0.956,3.301-0.276,5.486,2.075,6.68c3.517,1.783,8.445,3.147,12.861,3.561    c0.648,0.06,1.043-0.251,1.144-0.34c0.551-0.497,0.575-1.257,0.573-2.67c-0.004-2.251-0.011-6.438,2.934-12.299    C71.939,40.904,71.905,40.381,71.598,39.968z">
</path>
<path d="M8.28,41.403c2.939,5.856,2.934,10.047,2.931,12.298c-0.001,1.414,0.024,2.174,0.577,2.674    c0.117,0.104,0.448,0.346,0.974,0.346c0.054,0,0.109-0.003,0.167-0.008c4.426-0.417,9.353-1.781,12.859-3.561    c2.355-1.196,3.035-3.382,2.075-6.682l-1.669,0.49c0.899,3.112-0.101,4.108-1.204,4.67c-3.015,1.528-7.339,2.783-11.286,3.275    L12.956,55l-0.003-1.297c0.002-2.214,0.006-6.334-2.591-11.979L9.96,40.852l0.969-0.058c0.251-0.015,0.539-0.022,0.857-0.022    c1.771,0,4.273,0.227,6.693,0.607l0.233,0.035l0.284-1.69l-0.258-0.041c-2.736-0.429-4.884-0.637-6.564-0.637    c-2.572,0-3.489,0.504-3.805,0.927C8.066,40.378,8.033,40.913,8.28,41.403z">
</path>
<path d="M64.21,31.396c0.203-0.743,0.1-1.522-0.293-2.192c-0.392-0.67-1.026-1.148-1.787-1.348    c-0.1-0.027-10.297-2.654-22.132-2.654c-12.964,0-21.654,2.496-22.018,2.603c-1.54,0.454-2.455,2.065-2.039,3.592l4.249,15.564    c0.338,1.234,1.478,2.097,2.771,2.097c0.289,0,0.573-0.042,0.844-0.125c0.356-0.104,8.764-2.521,15.909-2.521    c0.229,0,0.457,0.002,0.686,0.008c7.697,0.166,15.115,2.272,15.936,2.512c0.277,0.084,0.563,0.127,0.852,0.127    c1.295,0,2.435-0.861,2.771-2.096L64.21,31.396z M58.233,46.509c-0.114,0.444-0.593,0.793-1.089,0.793    c-0.103,0-0.202-0.016-0.295-0.047c-0.323-0.097-8.072-2.401-16.412-2.586c-0.244-0.006-0.488-0.008-0.732-0.008    c-7.762,0-16.063,2.493-16.412,2.599c-0.107,0.031-0.21,0.046-0.316,0.046c-0.496,0-0.932-0.328-1.06-0.797l-4.25-15.565    c-0.168-0.616,0.211-1.288,0.827-1.467c0.929-0.259,9.413-2.528,21.505-2.528c11.449,0,21.256,2.488,21.668,2.594    c0.299,0.076,0.549,0.266,0.705,0.534c0.153,0.265,0.194,0.571,0.117,0.863L58.233,46.509z">
</path>
</g>
</g>
<g id="Element_4_2">
<path d="M46.523,34.188c-0.084-0.26-0.246-0.485-0.47-0.655c-0.209-0.162-0.466-0.262-0.742-0.289l-2.871-0.258l-0.029-0.066   l-1.104-2.426c-0.109-0.244-0.293-0.455-0.534-0.611c-0.403-0.249-1.079-0.265-1.471-0.035l-0.07,0.038   c-0.229,0.143-0.411,0.351-0.523,0.599l-1.139,2.502L34.7,33.24c-0.273,0.025-0.533,0.126-0.751,0.291   c-0.214,0.164-0.373,0.384-0.461,0.636c-0.091,0.261-0.1,0.543-0.025,0.795c0.075,0.264,0.227,0.495,0.439,0.67l2.145,1.796   l-0.63,2.67c-0.055,0.261-0.033,0.531,0.061,0.759c0.101,0.258,0.275,0.476,0.506,0.633c0.219,0.15,0.48,0.238,0.757,0.253h0.076   c0.119-0.001,0.235-0.016,0.347-0.045c0.137-0.038,0.25-0.084,0.354-0.142l2.482-1.394l2.483,1.397l0.378,0.143   c0.103,0.024,0.201,0.039,0.293,0.041v0.003h0.102c0.273-0.01,0.533-0.096,0.751-0.246c0.236-0.155,0.422-0.382,0.512-0.623   c0.105-0.255,0.127-0.529,0.063-0.798l-0.621-2.646l0.06-0.049l2.092-1.748c0.208-0.177,0.356-0.405,0.438-0.677   C46.616,34.708,46.607,34.433,46.523,34.188z M45.452,34.864l-2.631,2.195l0.765,3.248c0.017,0.069,0.01,0.134-0.02,0.203   c-0.017,0.052-0.064,0.109-0.136,0.155c-0.053,0.036-0.115,0.06-0.18,0.066l-0.063,0.001c-0.066,0-0.142-0.02-0.201-0.053L40,39   l-2.988,1.678c-0.03,0.017-0.11,0.057-0.197,0.057l-0.032-0.002c-0.077-0.005-0.152-0.029-0.218-0.073   c-0.063-0.041-0.107-0.099-0.139-0.175c-0.021-0.059-0.025-0.117-0.013-0.172l0.77-3.257l-2.623-2.197   c-0.058-0.047-0.097-0.105-0.116-0.177c-0.017-0.056-0.013-0.121,0.011-0.185c0.021-0.064,0.062-0.122,0.116-0.165   c0.065-0.05,0.14-0.077,0.223-0.085l3.46-0.308l1.385-3.041c0.031-0.067,0.083-0.124,0.152-0.164   c0.073-0.042,0.158-0.051,0.217-0.051c0.041,0,0.143,0.005,0.217,0.051c0.068,0.044,0.117,0.099,0.149,0.168l1.382,3.037   l3.462,0.312c0.081,0.008,0.152,0.035,0.213,0.081c0.059,0.045,0.1,0.101,0.125,0.172c0.018,0.063,0.022,0.122,0.015,0.168   C45.544,34.756,45.505,34.815,45.452,34.864z">
</path>
</g>
</svg>
<p>Banner Effect</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-blog-posts.html" class="element-type">
<div class="element element-blog">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<path d="M84.286,82.529c-6.099,0-11.062-4.963-11.062-11.063c0-0.687,0.07-1.394,0.207-2.099c-0.136-2.246-1.932-3.961-4.088-3.961 c-1.933,0-3.626,1.375-4.027,3.266c0.219,1.082,0.324,1.963,0.324,2.794c0,6.101-4.961,11.063-11.061,11.063 c-6.098,0-11.06-4.963-11.06-11.063c0-6.097,4.962-11.059,11.06-11.059c3.6,0,6.988,1.771,9.064,4.741l0.152,0.217 c0.041,0.059,0.107,0.096,0.179,0.099c0.003,0,0.009,0.001,0.011,0.001c0.066,0,0.133-0.03,0.178-0.081l0.172-0.2 c1.267-1.461,3.093-2.297,5.008-2.297c1.974,0,3.833,0.874,5.102,2.395l0.177,0.213c0.043,0.053,0.108,0.084,0.179,0.084 c0.002,0,0.007-0.002,0.01-0.002c0.072-0.002,0.139-0.039,0.18-0.1l0.155-0.227c2.069-3.033,5.489-4.843,9.141-4.843 c6.098,0,11.06,4.962,11.06,11.059C95.346,77.566,90.384,82.529,84.286,82.529z M54.58,62.926c-4.71,0-8.541,3.831-8.541,8.54 c0,4.712,3.831,8.544,8.541,8.544c4.709,0,8.543-3.832,8.543-8.544c0-0.665-0.088-1.354-0.259-2.046l-0.04-0.158 c-0.014-0.061-0.051-0.107-0.098-0.138l0.003-0.069c0.001-0.01-0.005-0.124-0.007-0.135C61.574,65.313,58.305,62.926,54.58,62.926z M84.286,62.926c-4.71,0-8.542,3.831-8.542,8.54c0,4.712,3.83,8.544,8.541,8.544c4.709,0,8.541-3.832,8.541-8.544 C92.826,66.757,88.996,62.926,84.286,62.926z">
</path>
<rect x="19.478" y="45.364" width="58.937" height="2.52"></rect>
<rect x="39.083" y="54.756" width="39.331" height="2.519"></rect>
<rect x="39.083" y="63.35" width="3.632" height="2.52"></rect>
<rect x="19.478" y="71.946" width="19.862" height="2.519"></rect>
<path d="M30.395,41.318l-6.58-8.65c-0.043-0.059-0.112-0.092-0.184-0.092c-0.025,0-0.05,0.005-0.075,0.013 c-0.094,0.032-0.158,0.12-0.158,0.22v8.51h-2.087V28.896h2.12l6.768,8.877c0.044,0.059,0.112,0.092,0.184,0.092 c0.026,0,0.051-0.004,0.076-0.012c0.094-0.031,0.157-0.121,0.157-0.221v-8.736h2.089v12.422H30.395z">
</path>
<path d="M36.859,41.318V28.896h8.709v1.767h-6.391c-0.127,0-0.232,0.104-0.232,0.233v3.154c0,0.129,0.105,0.232,0.232,0.232h5.724 v1.651h-5.724c-0.127,0-0.232,0.104-0.232,0.232v3.174c0,0.128,0.105,0.231,0.232,0.231h6.602v1.746H36.859z">
</path>
<path d="M60.144,41.318l-3.011-9.569c-0.031-0.097-0.122-0.163-0.221-0.163l0,0c-0.104,0-0.192,0.066-0.222,0.163l-2.995,9.569 h-1.573l-4.338-12.422h2.287l2.729,7.953c0.031,0.095,0.119,0.158,0.219,0.158c0,0,0.002,0,0.004,0 c0.101-0.002,0.189-0.069,0.219-0.164l2.453-7.947h2.453l2.432,7.946c0.028,0.096,0.117,0.162,0.217,0.165c0.002,0,0.004,0,0.005,0 c0.099,0,0.188-0.063,0.22-0.157l2.75-7.954h2.283l-4.334,12.422H60.144z">
</path>
<path d="M72.896,41.472c-1.855,0-3.564-0.655-5.084-1.948l1.222-1.499c1.384,1.129,2.7,1.701,3.92,1.701 c0.642,0,1.162-0.149,1.549-0.441c0.42-0.317,0.643-0.769,0.643-1.304c0-0.539-0.236-0.992-0.683-1.309 c-0.377-0.27-1.066-0.525-2.107-0.781c-1.478-0.35-2.56-0.805-3.223-1.351c-0.607-0.499-0.917-1.319-0.917-2.439 c0-1.126,0.388-1.966,1.187-2.57c0.824-0.622,1.879-0.937,3.134-0.937c0.838,0,1.688,0.145,2.519,0.431 c0.697,0.239,1.324,0.565,1.871,0.968l-1.016,1.465c-1.115-0.754-2.281-1.137-3.471-1.137c-0.597,0-1.084,0.152-1.449,0.451 c-0.391,0.323-0.588,0.752-0.588,1.273c0,0.536,0.248,0.982,0.721,1.29c0.402,0.263,1.214,0.538,2.553,0.867 c1.186,0.293,2.113,0.73,2.754,1.302c0.598,0.533,0.9,1.338,0.9,2.393c0,1.063-0.387,1.9-1.183,2.564 C75.338,41.131,74.243,41.472,72.896,41.472z">
</path>
<g>
<path d="M10.809,78.84c-1.695,0-3.052-1.46-3.052-3.157V23.555c0-1.696,1.356-3.154,3.052-3.154h72.629 c1.7,0,3.107,1.458,3.107,3.154v32.328h3.104V23.555c0-3.395-2.814-6.084-6.211-6.084H10.809c-3.393,0-6.154,2.689-6.154,6.084 v52.128c0,3.396,2.762,6.087,6.154,6.087h28.976v-2.93H10.809z">
</path>
</g>
</svg>
<p>blog posts</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-breadcrumb.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 2px 0 0 0;">
<path fill="none" stroke="#666" stroke-width="3" stroke-miterlimit="10" d="M74.594,65.801c0,1.65-1.35,3-3,3H8.405  c-1.65,0-3-1.35-3-3V15.957c0-1.65,1.35-3,3-3h63.188c1.65,0,3,1.35,3,3V65.801z">
</path>
<line fill="none" stroke="#666" stroke-width="3" stroke-miterlimit="10" x1="74.594" y1="34.586" x2="5.405" y2="34.586"></line>
<g>
<rect x="22.875" y="22.875" width="7" height="2.5"></rect>
<rect x="50.125" y="22.875" width="7" height="2.5"></rect>
<polygon points="35.887,19.941 40.033,24.183 36.123,28.194 37.913,29.939 43.527,24.18 37.674,18.193  ">
</polygon>
</g>
</svg>
<p>breadcrumb</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-buttons.html" class="element-type">
<div class="element element-button">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<g>
<path d="M42.114,51.646c-0.452,0-0.881-0.181-1.198-0.509c-0.157-0.158-0.282-0.34-0.372-0.542     c-0.078-0.204-0.125-0.43-0.125-0.655c0-0.102,0.011-0.215,0.035-0.328c0.022-0.102,0.055-0.215,0.09-0.316     c0.044-0.102,0.103-0.203,0.157-0.293c0.069-0.092,0.137-0.182,0.215-0.261c0.079-0.067,0.158-0.146,0.26-0.202     c0.09-0.069,0.181-0.113,0.294-0.158c0.102-0.046,0.203-0.08,0.317-0.103c0.214-0.046,0.441-0.046,0.656,0     c0.113,0.022,0.214,0.057,0.315,0.103c0.102,0.045,0.203,0.089,0.293,0.158c0.091,0.057,0.181,0.135,0.26,0.202     c0.081,0.079,0.147,0.169,0.214,0.261c0.058,0.09,0.114,0.191,0.148,0.293c0.045,0.102,0.079,0.215,0.102,0.316     c0.022,0.113,0.033,0.227,0.033,0.328c0,0.464-0.182,0.881-0.498,1.197c-0.158,0.17-0.35,0.293-0.553,0.373     C42.556,51.603,42.342,51.646,42.114,51.646z">
</path>
</g>
<g>
<path d="M79.854,49.952c0-0.938,0.757-1.695,1.694-1.695l0,0c0.938,0,1.696,0.758,1.696,1.695l0,0     c0,0.927-0.758,1.684-1.696,1.684l0,0C80.611,51.636,79.854,50.879,79.854,49.952z M66.713,49.952     c0-0.938,0.757-1.695,1.694-1.695l0,0c0.938,0,1.695,0.758,1.695,1.695l0,0c0,0.927-0.758,1.684-1.695,1.684l0,0     C67.47,51.636,66.713,50.879,66.713,49.952z M53.562,49.952c0-0.938,0.768-1.695,1.694-1.695l0,0c0.938,0,1.694,0.758,1.694,1.695     l0,0c0,0.927-0.756,1.684-1.694,1.684l0,0C54.329,51.636,53.562,50.879,53.562,49.952z">
</path>
</g>
</g>
<path d="M21.765,61.756c-6.483,0-11.757-5.272-11.757-11.755s5.273-11.756,11.757-11.756c6.48,0,11.754,5.273,11.754,11.756     S28.246,61.756,21.765,61.756z M21.765,41.128c-4.894,0-8.874,3.98-8.874,8.873s3.98,8.873,8.874,8.873     c4.892,0,8.873-3.98,8.873-8.873S26.657,41.128,21.765,41.128z">
</path>
<path d="M20.721,66.991c-8.844,0-16.04-7.195-16.04-16.039v-1.904c0-8.844,7.196-16.039,16.04-16.039h58.56     c8.846,0,16.039,7.195,16.039,16.039v1.904c0,8.844-7.193,16.039-16.039,16.039H20.721z M20.721,35.892     c-7.254,0-13.157,5.902-13.157,13.156v1.904c0,7.254,5.903,13.157,13.157,13.157h58.56c7.256,0,13.158-5.903,13.158-13.157v-1.904     c0-7.254-5.902-13.156-13.158-13.156H20.721z">
</path>
</svg>
<p>buttons</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-cta.html" class="element-type">
<div class="element element-cta">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M77.872,15.792H22.126c-3.492,0-6.334,2.843-6.334,6.335v24.072c0,0.701,0.566,1.268,1.266,1.268 c0.701,0,1.268-0.566,1.268-1.268V22.126c0-2.096,1.705-3.801,3.801-3.801h55.746c2.096,0,3.801,1.705,3.801,3.801v55.747 c0,2.096-1.705,3.801-3.801,3.801H53.8c-0.699,0-1.268,0.566-1.268,1.268s0.568,1.268,1.268,1.268h24.072 c3.496,0,6.336-2.842,6.336-6.336V22.126C84.208,18.634,81.368,15.792,77.872,15.792z">
</path>
</g>
<path d="M51.899,50c-0.506,0-0.984-0.197-1.342-0.557c-0.742-0.74-0.742-1.945-0.002-2.688l16.58-16.578 c0.182-0.182,0.236-0.455,0.139-0.691c-0.1-0.236-0.33-0.391-0.586-0.391h-7.188v-3.801h13.305c1.049,0,1.9,0.852,1.9,1.9v13.303 h-3.803v-7.186c0-0.257-0.152-0.488-0.391-0.586c-0.078-0.032-0.16-0.049-0.242-0.049c-0.162,0-0.326,0.064-0.447,0.187 l-16.58,16.579C52.884,49.802,52.409,50,51.899,50z">
</path>
<g>
<path d="M42.804,54.369c1.559,0,2.826,1.27,2.826,2.826v21.188c0,1.559-1.268,2.826-2.826,2.826H21.616 c-1.557,0-2.824-1.268-2.824-2.826V57.195c0-1.557,1.268-2.826,2.824-2.826H42.804 M42.804,51.369H21.616 c-3.212,0-5.824,2.613-5.824,5.826v21.188c0,3.213,2.612,5.826,5.824,5.826h21.188c3.213,0,5.826-2.613,5.826-5.826V57.195 C48.63,53.982,46.017,51.369,42.804,51.369L42.804,51.369z">
</path>
</g>
</svg>
<p>call to action</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-countdown.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="73px" height="73px" viewBox="0 0 80 80" xml:space="preserve">
<g>
<path d="M39.999,25.754c-10.222,0-18.537,8.155-18.537,18.18c0,10.025,8.315,18.182,18.537,18.182   c10.221,0,18.536-8.156,18.536-18.182C58.535,33.909,50.22,25.754,39.999,25.754z M39.999,60.45   c-9.286,0-16.841-7.408-16.841-16.517c0-9.107,7.555-16.517,16.841-16.517s16.84,7.409,16.84,16.517   C56.839,53.042,49.285,60.45,39.999,60.45z">
</path>
<path d="M19.962,28.258l1.087,1.066l1.199-1.176l-1.088-1.067c-0.111-0.109-0.195-0.266-0.215-0.397   c-0.014-0.093-0.007-0.197,0.133-0.335l0.906-0.888c0.098-0.097,0.275-0.193,0.45-0.193h0.001c0.159,0,0.317,0.08,0.487,0.247   l1.005,0.985l1.199-1.177l-1.002-0.982c-0.616-0.608-1.257-0.737-1.687-0.738c-0.001,0-0.002,0-0.004,0   c-0.599,0-1.216,0.255-1.65,0.682l-0.906,0.888c-0.49,0.481-0.708,1.104-0.612,1.75C19.338,27.408,19.592,27.896,19.962,28.258z">
</path>
<path d="M57.147,25.513c0.167-0.165,0.325-0.245,0.484-0.245c0.001,0,0.001,0,0.001,0c0.174,0,0.354,0.097,0.451,0.193l0.904,0.888   c0.317,0.31-0.013,0.665-0.081,0.733l-1.087,1.066l1.199,1.176l1.088-1.067c0.781-0.769,1.076-2.11,0.081-3.085l-0.904-0.889   c-0.437-0.426-1.053-0.681-1.651-0.681c-0.001,0-0.002,0-0.004,0c-0.43,0.001-1.07,0.13-1.684,0.736l-1.005,0.984L56.14,26.5   L57.147,25.513z">
</path>
<path d="M53.239,44.767l2.033-0.001l-0.001-1.664l-2.033,0.001L53.239,44.767z">
</path>
<path d="M39.147,56.92l0.002,1.994l1.696-0.002l-0.001-1.993L39.147,56.92z">
</path>
<path d="M26.757,43.1l-2.033,0.002l0.002,1.664l2.033-0.002L26.757,43.1z">
</path>
<path d="M28.897,36.805l-1.771-0.982l-0.835,1.449l1.771,0.982L28.897,36.805z">
</path>
<path d="M31.547,31.428l1.03,1.721l1.462-0.843l-1.029-1.72L31.547,31.428z">
</path>
<path d="M48.396,31.391l-1.469-0.834l-1.019,1.728l1.468,0.833L48.396,31.391z">
</path>
<path d="M53.697,37.25l-0.841-1.446l-1.769,0.987l0.84,1.446L53.697,37.25z">
</path>
<path d="M51.109,51.047l1.773,0.979l0.833-1.449l-1.772-0.98L51.109,51.047z">
</path>
<path d="M45.974,55.554l1.032,1.72l1.462-0.846l-1.033-1.719L45.974,55.554z">
</path>
<path d="M31.517,56.422l1.463,0.844l1.031-1.721l-1.463-0.844L31.517,56.422z">
</path>
<path d="M26.403,50.817l0.862,1.434l1.752-1.014l-0.861-1.434L26.403,50.817z">
</path>
<path d="M40.843,28.961h-1.696v1.993h1.696V28.961z"></path>
<path d="M40.852,43.102h-1.686c-0.441,0-0.859-0.17-1.173-0.472c-0.31-0.307-0.481-0.717-0.481-1.158   c0-0.429,0.173-0.841,0.478-1.145c0.314-0.308,0.733-0.479,1.176-0.479h1.685c0.434,0,0.864,0.176,1.173,0.47   c0.391,0.389,0.474,0.843,0.474,1.153h1.71c0-0.883-0.343-1.711-0.978-2.343c-0.632-0.606-1.496-0.956-2.367-0.958v-1.688h-1.713   v1.688c-0.89,0.005-1.729,0.343-2.375,0.975c-0.629,0.626-0.975,1.456-0.975,2.326c0,0.887,0.348,1.717,0.984,2.345   c0.64,0.622,1.486,0.966,2.383,0.966h1.684c0.432,0,0.864,0.176,1.179,0.479c0.302,0.293,0.468,0.702,0.468,1.152   c0,0.443-0.166,0.851-0.461,1.14c-0.321,0.307-0.752,0.483-1.186,0.483h-1.684c-0.442,0-0.86-0.169-1.171-0.469   c-0.312-0.313-0.483-0.722-0.483-1.154h-1.713c0,0.879,0.349,1.705,0.986,2.338c0.636,0.619,1.475,0.959,2.365,0.963v1.689h1.712   v-1.689c0.872-0.004,1.734-0.351,2.377-0.967c0.624-0.614,0.969-1.444,0.969-2.334c0-0.899-0.347-1.73-0.977-2.349   C42.593,43.454,41.728,43.102,40.852,43.102z">
</path>
<ellipse fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" cx="39.969" cy="43.788" rx="21.24" ry="20.912">
</ellipse>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="39.969" y1="22.876" x2="39.969" y2="17.406"></line>
</g>
<path fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M46.003,16.947c0,1.563-1.35,2.841-3,2.841h-6  c-1.65,0-3-1.278-3-2.841s1.35-2.841,3-2.841h6C44.653,14.106,46.003,15.385,46.003,16.947z">
</path>
</svg>
<p>Counter Down</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-counter.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="73px" height="73px" viewBox="0 0 80 80" xml:space="preserve">
<g>
<path d="M16.5,37.989v-1.905h4.276v16.271h-2.093V37.989H16.5z"></path>
<path d="M28.599,46.848c1.092-0.994,2.013-2.031,2.764-3.109c0.75-1.079,1.125-2.13,1.125-3.156c0-0.948-0.243-1.71-0.728-2.283   c-0.485-0.574-1.25-0.861-2.296-0.861c-1.032,0-1.832,0.326-2.399,0.976c-0.569,0.65-0.875,1.52-0.922,2.604h-2.001   c0.06-1.712,0.576-3.036,1.546-3.97c0.971-0.933,2.221-1.399,3.753-1.399c1.561,0,2.801,0.432,3.719,1.297   c0.917,0.863,1.375,2.047,1.375,3.546c0,1.223-0.376,2.433-1.126,3.625c-0.75,1.194-1.603,2.237-2.558,3.133   c-0.956,0.896-2.177,1.955-3.663,3.181h7.824v1.743h-10.94v-1.492C25.998,49.119,27.507,47.842,28.599,46.848z">
</path>
<path d="M38.97,36.635c0.97-0.796,2.229-1.192,3.776-1.192c1.029,0,1.92,0.186,2.672,0.562c0.75,0.374,1.318,0.883,1.705,1.525   c0.387,0.644,0.58,1.369,0.58,2.181c0,0.949-0.27,1.767-0.809,2.456c-0.537,0.688-1.238,1.132-2.103,1.331v0.114   c0.984,0.245,1.767,0.728,2.343,1.446c0.576,0.72,0.865,1.66,0.865,2.823c0,0.871-0.199,1.656-0.594,2.353   c-0.393,0.697-0.984,1.244-1.772,1.643c-0.788,0.396-1.737,0.595-2.843,0.595c-1.607,0-2.927-0.427-3.958-1.274   c-1.031-0.849-1.607-2.054-1.729-3.614h2.001c0.107,0.918,0.478,1.668,1.115,2.25c0.637,0.581,1.486,0.871,2.547,0.871   s1.869-0.279,2.422-0.838c0.553-0.558,0.83-1.28,0.83-2.168c0-1.148-0.379-1.974-1.137-2.479c-0.758-0.504-1.902-0.757-3.435-0.757   h-0.522v-1.745h0.547c1.393-0.015,2.447-0.249,3.16-0.699c0.713-0.451,1.068-1.15,1.068-2.1c0-0.811-0.262-1.461-0.783-1.95   c-0.523-0.49-1.271-0.735-2.241-0.735c-0.94,0-1.698,0.245-2.275,0.735c-0.576,0.489-0.917,1.146-1.022,1.973h-2.025   C37.46,38.532,37.999,37.43,38.97,36.635z">
</path>
<path d="M61.805,33.274l-6.137-6.703l-5.241,6.64l-1.805-1.451l6.917-8.762l7.961,8.697L61.805,33.274z">
</path>
<path d="M56.758,56.998h-2.309V25.95h2.309V56.998z"></path>
</g>
</svg>
<p>Counter Up</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-creative-grid.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 0 0 -18px 0;">
<g>
<path d="M33.238,15.144c0-1.134-0.923-2.056-2.057-2.056H14.556c-1.133,0-2.056,0.922-2.056,2.056v21.244   c0,1.134,0.923,2.057,2.056,2.057h16.626c1.134,0,2.057-0.923,2.057-2.057V15.144z M30.973,36.179H14.765V15.353h16.208V36.179z">
</path>
<path d="M33.238,42.935c0-1.134-0.923-2.057-2.057-2.057H14.556c-1.133,0-2.056,0.923-2.056,2.057v12.008   c0,1.134,0.923,2.056,2.056,2.056h16.626c1.134,0,2.057-0.922,2.057-2.056V42.935z M30.973,54.732H14.765V43.144h16.208V54.732z">
</path>
<path d="M56.5,15.056c0-1.135-0.924-2.058-2.057-2.058H37.817c-1.134,0-2.057,0.923-2.057,2.058v12.007   c0,1.135,0.923,2.057,2.057,2.057h16.626c1.133,0,2.057-0.922,2.057-2.057V15.056z M54.233,26.854H38.025v-11.59h16.208V26.854z">
</path>
<path d="M56.5,33.698c0-1.134-0.924-2.057-2.057-2.057H37.817c-1.134,0-2.057,0.923-2.057,2.057v21.244   c0,1.134,0.923,2.056,2.057,2.056h16.626c1.133,0,2.057-0.922,2.057-2.056V33.698z M54.233,54.732H38.025V33.907h16.208V54.732z">
</path>
</g>
</svg>
<p>Creative grid</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-animation.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="73px" height="73px" viewBox="0 0 80 80" xml:space="preserve">
<g>
<path d="M12.833,53.767l-3.917-0.349c2.748-9.556,11.795-17.333,21.949-21.955l0.789,1.838   C22.865,37.883,14.84,45.353,12.833,53.767z">
</path>
</g>
<g>
<path d="M18.707,60.905h-3.873c1.667-8.438,4.273-11.89,8.771-16.878l1.485,1.34C20.854,50.065,20.286,52.467,18.707,60.905z">
</path>
</g>
<g>
<path d="M28.167,63.209h-4.333c1.257-12.625,3.554-15.63,10.398-23.688l1.524,1.295C30.167,47.918,29.182,51.716,28.167,63.209z">
</path>
</g>
<g>
<path fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" d="M55.403,36.56c0.186,0.518-0.091,0.804-0.614,0.637   l-6.363-2.034c-0.523-0.167-1.308-0.029-1.743,0.308l-5.279,4.086c-0.435,0.337-0.793,0.162-0.795-0.388l-0.031-6.679   c-0.002-0.55-0.376-1.253-0.831-1.563l-5.52-3.759c-0.455-0.31-0.399-0.704,0.123-0.876l6.341-2.094   c0.522-0.172,1.076-0.746,1.23-1.273l1.871-6.41c0.154-0.528,0.547-0.597,0.872-0.154l3.95,5.384   c0.325,0.443,1.042,0.792,1.592,0.776l6.674-0.201c0.55-0.017,0.737,0.335,0.416,0.781l-3.9,5.421   c-0.321,0.446-0.432,1.235-0.246,1.753L55.403,36.56z">
</path>
</g>
<line fill="none" stroke="#000000" stroke-width="2" stroke-miterlimit="10" x1="47.474" y1="34.857" x2="52.712" y2="55.848"></line>
</svg>
<p>Entrance Effect</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-floating.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -10px 0 -8px 0;">
<g>
<g>
<path fill="#666" d="M36.488,35.565c1.957,0,3.549-1.593,3.549-3.549s-1.592-3.549-3.549-3.549    c-1.956,0-3.548,1.593-3.548,3.549S34.532,35.565,36.488,35.565z M36.488,30.266c0.965,0,1.75,0.785,1.75,1.75    s-0.785,1.75-1.75,1.75s-1.75-0.785-1.75-1.75S35.523,30.266,36.488,30.266z">
</path>
<path fill="#666" d="M48.229,51h-1.707l-7.951-7.789c-0.348-0.342-0.904-0.344-1.254-0.004l-3.251,3.16l-8.364-9.442    c-0.339-0.339-0.939-0.342-1.277-0.001L12.453,51h-1.687c-0.496,0-0.899,0.41-0.899,0.908c0,0.494,0.403,0.906,0.899,0.906h2.022    h25.547h7.869h2.023c0.496,0,0.898-0.412,0.898-0.906C49.127,51.41,48.725,51,48.229,51z M37.939,45.088L44,51h-5.283    l-3.334-3.439L37.939,45.088z M25.063,38.789L36.178,51h-21.23L25.063,38.789z">
</path>
</g>
</g>
<g>
<g>
<path d="M62.943,22.511v15.558h1.881V22.305l5.301,5.924l1.408-1.229l-7.688-8.594l-6.949,8.63l1.473,1.156L62.943,22.511z">
</path>
<path d="M64.824,60.902V45.139h-1.881v15.557l-4.574-5.68l-1.473,1.154l6.949,8.633l7.688-8.596l-1.408-1.229L64.824,60.902z">
</path>
</g>
<path fill="none" stroke="#000000" stroke-width="2.5" stroke-miterlimit="10" d="M51.975,61.96c0,1.584-1.604,2.88-3.568,2.88   H10.588c-1.963,0-3.568-1.296-3.568-2.88V21.264c0-1.583,1.605-2.879,3.568-2.879h37.818c1.965,0,3.568,1.296,3.568,2.879V61.96z">
</path>
</g>
</svg>
<p>Floating effect</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-hotspot.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 4px 0 -2px 0;">
<g>
</g>
<g>
<g>
<path fill="#666" d="M44.577,30.02c2.645,0,4.795-2.152,4.795-4.796c0-2.643-2.15-4.795-4.795-4.795    c-2.644,0-4.795,2.152-4.795,4.795C39.782,27.868,41.934,30.02,44.577,30.02z M44.577,22.859c1.304,0,2.364,1.06,2.364,2.364    c0,1.304-1.061,2.366-2.364,2.366c-1.305,0-2.365-1.062-2.365-2.366C42.212,23.918,43.272,22.859,44.577,22.859z">
</path>
<path fill="#666" d="M58.737,50.143l-9.994-9.791c-0.471-0.461-1.223-0.463-1.696-0.004l-4.393,4.267L29.999,31.858    c-0.457-0.46-1.269-0.463-1.726-0.003L9.394,50.877H7.115c-0.67,0-1.215,0.553-1.215,1.225c0,0.67,0.545,1.225,1.215,1.225h2.732    h38.578h8.436C57.343,52.176,57.982,51.112,58.737,50.143z M12.764,50.877l16.373-16.501l16.373,16.501H12.764z M44.435,46.229    l3.456-3.342l8.19,7.99h-7.14L44.435,46.229z">
</path>
</g>
<line fill="none" stroke="#030303" stroke-width="2" stroke-miterlimit="10" x1="63.745" y1="58.736" x2="75.745" y2="58.736"></line>
<line fill="none" stroke="#030303" stroke-width="2" stroke-miterlimit="10" x1="69.745" y1="52.736" x2="69.745" y2="64.736"></line>
<circle fill="none" stroke="#030303" stroke-width="2.5" stroke-miterlimit="10" cx="69.745" cy="58.736" r="11"></circle>
<path fill="#1A1818" d="M55.745,58.736c0-0.028,0.004-0.057,0.004-0.084H3.289c-1.17,0-2.158-1.026-2.158-2.241V14.268   c0-1.215,0.988-2.241,2.158-2.241h62.326c1.193,0,2.201,1.026,2.201,2.241v30.617c0.633-0.088,1.273-0.148,1.93-0.148   c0.345,0,0.682,0.027,1.021,0.052V14.268c0-2.786-2.312-5.053-5.151-5.053H3.289c-2.816,0-5.107,2.267-5.107,5.053v42.144   c0,2.786,2.291,5.054,5.107,5.054h52.726C55.841,60.582,55.745,59.67,55.745,58.736z">
</path>
</g>
</svg>
<p>Hotspot</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-icon-boxes.html" class="element-type">
<div class="element element-icon-box">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M69.38,70.314H30.618c-0.625,0-1.129,0.506-1.129,1.131s0.504,1.129,1.129,1.129H69.38c0.623,0,1.129-0.504,1.129-1.129 S70.003,70.314,69.38,70.314z">
</path>
<path d="M61.306,76.775H38.692c-0.623,0-1.129,0.504-1.129,1.127c0,0.627,0.506,1.131,1.129,1.131h22.613 c0.623,0,1.131-0.504,1.131-1.131C62.437,77.279,61.929,76.775,61.306,76.775z">
</path>
<path d="M41.876,52.898c0.041,0.457,0.121,0.9,0.232,1.33l-2.729,2.73l-1.699,3.395l2.023,1.01l1.531-3.066l1.824-1.822 c1.447,2.34,4.041,3.898,6.939,3.898c2.896,0,5.49-1.559,6.939-3.898l1.822,1.822l1.535,3.066l2.02-1.01l-1.697-3.395L57.89,54.23 c0.111-0.432,0.193-0.875,0.232-1.332l0.184-2.217h6.227v-2.259h-6.039l0.342-4.079c0.012-0.168-0.01-0.334-0.012-0.501l0.049,0.05 l3.361-3.36l1.697-3.395l-2.021-1.011l-1.531,3.066l-2.197,2.195c-0.195-0.351-0.422-0.685-0.695-0.984 c-0.822-0.892-1.938-1.438-3.127-1.6v-2.172c0-1.016-0.363-1.939-0.949-2.682l2.445-4.889l-2.021-1.011l-2.262,4.525 c-0.49-0.19-1.018-0.305-1.572-0.305s-1.082,0.114-1.572,0.305l-2.262-4.524l-2.021,1.01l2.443,4.889 c-0.584,0.742-0.947,1.666-0.947,2.682v2.172c-1.189,0.161-2.305,0.709-3.125,1.601c-0.277,0.3-0.502,0.634-0.697,0.983 l-2.195-2.195l-1.533-3.066l-2.023,1.011l1.699,3.395l3.359,3.36l0.051-0.052c-0.002,0.169-0.025,0.334-0.012,0.503l0.34,4.079 h-6.039v2.259h6.229L41.876,52.898z M52.099,36.632v2.1h-4.199v-2.1c0-1.158,0.941-2.101,2.1-2.101 C51.155,34.532,52.099,35.474,52.099,36.632z M44.177,41.935c0.559-0.608,1.322-0.943,2.148-0.943h7.346 c0.826,0,1.59,0.335,2.15,0.942c0.561,0.608,0.83,1.397,0.762,2.222l-0.715,8.555c-0.252,3.029-2.83,5.402-5.869,5.402 s-5.619-2.373-5.871-5.402l-0.713-8.556C43.347,43.332,43.618,42.543,44.177,41.935z">
</path>
</g>
<path d="M25.767,87.42c-2.572,0-4.664-2.092-4.664-4.664V17.245c0-2.572,2.092-4.664,4.664-4.664l40.664-0.001 c1.242,0,2.414,0.485,3.297,1.366l7.801,7.803c0.883,0.881,1.369,2.052,1.369,3.298v57.709c0,2.572-2.094,4.664-4.666,4.664H25.767z M25.767,15.462c-0.982,0-1.781,0.8-1.781,1.782v65.511c0,0.982,0.799,1.781,1.781,1.781h48.465c0.984,0,1.783-0.799,1.783-1.781 V25.046c0-0.022-0.025-0.166-0.029-0.188c-0.02-0.125-0.139-0.271-0.266-0.271h-4.715c-2.27,0-4.117-1.846-4.117-4.115v-4.717 c0-0.126-0.094-0.232-0.217-0.251c-0.1-0.025-0.164-0.043-0.24-0.043H25.767z M68.894,17.293c-0.033,0-0.064,0.007-0.098,0.02 c-0.094,0.039-0.156,0.131-0.156,0.234v2.926c0,1.303,1.063,2.362,2.365,2.362h2.924c0.102,0,0.195-0.062,0.234-0.156 s0.018-0.203-0.057-0.276l-5.033-5.035C69.024,17.32,68.96,17.293,68.894,17.293z">
</path>
</svg>
<p>icon boxes</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-icons.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="82px" height="82px" viewBox="0 0 70 70" xml:space="preserve">
<g>
<path fill="none" stroke="#666" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" stroke-miterlimit="10" d=" M47.394,22.607c-3.421-3.416-7.55-5.125-12.393-5.125c-4.845,0-8.975,1.709-12.395,5.125c-3.418,3.418-5.125,7.55-5.125,12.394 c0,4.843,1.707,8.974,5.125,12.392c3.42,3.42,7.55,5.125,12.395,5.125c4.843,0,8.972-1.705,12.393-5.125 c3.418-3.418,5.125-7.547,5.125-12.392C52.519,30.156,50.812,26.025,47.394,22.607z">
</path>
</g>
<rect x="33.347" y="25.068" fill="#666" width="2.5" height="3.312"></rect>
<rect x="33.347" y="31.689" fill="#666" width="2.5" height="13.243"></rect>
</svg>
<p class="mt-1">Icons</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-image-box.html" class="element-type">
<div class="element element-icon">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 0 0 2px 0;">
<g>
<path fill="#666" stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M50.272,28.02   c2.645,0,4.795-2.152,4.795-4.796c0-2.643-2.15-4.795-4.795-4.795c-2.644,0-4.795,2.152-4.795,4.795   C45.478,25.868,47.629,28.02,50.272,28.02z M50.272,20.859c1.304,0,2.364,1.06,2.364,2.364c0,1.304-1.061,2.366-2.364,2.366   c-1.305,0-2.365-1.062-2.365-2.366C47.907,21.918,48.968,20.859,50.272,20.859z">
</path>
<path fill="#666" stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M67.489,48.877h-2.307L54.438,38.352   c-0.471-0.461-1.223-0.463-1.696-0.004l-4.393,4.267L35.693,29.858c-0.456-0.46-1.269-0.463-1.726-0.003L15.089,48.877H12.81   c-0.67,0-1.215,0.553-1.215,1.225c0,0.67,0.545,1.225,1.215,1.225h2.732H54.12h10.634h2.735c0.671,0,1.215-0.555,1.215-1.225   C68.704,49.43,68.16,48.877,67.489,48.877z M53.586,40.886l8.189,7.991h-7.139l-4.507-4.648L53.586,40.886z M34.831,32.375   l16.372,16.501H18.459L34.831,32.375z">
</path>
</g>
<path fill="#666" stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M71.29,7.464H8.965  c-2.678,0-4.857,2.124-4.857,4.803v42.144c0,2.68,2.18,4.804,4.857,4.804H71.29c2.681,0,4.901-2.124,4.901-4.804V12.268  C76.191,9.588,73.971,7.464,71.29,7.464z M73.742,54.411c0,1.339-1.11,2.491-2.452,2.491H8.965c-1.337,0-2.408-1.152-2.408-2.491  V12.268c0-1.339,1.071-2.491,2.408-2.491H71.29c1.342,0,2.452,1.151,2.452,2.491V54.411z">
</path>
<g>
<path fill="#666" stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M64.387,64.242H15.912   c-0.689,0-1.25,0.561-1.25,1.25s0.561,1.25,1.25,1.25h48.475c0.689,0,1.25-0.561,1.25-1.25S65.076,64.242,64.387,64.242z">
</path>
<path fill="#666" stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M58.925,71.77H21.374   c-0.689,0-1.25,0.561-1.25,1.25s0.561,1.25,1.25,1.25h37.551c0.689,0,1.25-0.561,1.25-1.25S59.614,71.77,58.925,71.77z">
</path>
</g>
</svg>
<p>image box</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-instagrams.html" class="element-type">
<div class="element">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M45.657,20.508c0.198,0,0.366,0.167,0.366,0.364V45.67c0,0.197-0.168,0.365-0.366,0.365H20.86 c-0.197,0-0.364-0.168-0.364-0.365V20.873c0-0.198,0.167-0.365,0.364-0.365H45.657 M45.657,17.6H20.86 c-1.805,0-3.272,1.469-3.272,3.273V45.67c0,1.805,1.468,3.273,3.272,3.273l24.797-0.001c1.806,0,3.274-1.468,3.274-3.272V20.872 C48.932,19.068,47.463,17.6,45.657,17.6L45.657,17.6z">
</path>
</g>
<g>
<path d="M79.138,20.508L79.138,20.508c0.198,0,0.366,0.166,0.366,0.364V45.67c0,0.197-0.168,0.365-0.366,0.365H54.342 c-0.199,0-0.365-0.168-0.365-0.365V20.872c0-0.197,0.166-0.364,0.365-0.364H79.138 M79.138,17.6H54.342 c-1.805,0-3.273,1.469-3.273,3.272V45.67c0,1.805,1.469,3.272,3.273,3.272h24.796c1.806,0,3.274-1.468,3.274-3.272V20.872 C82.412,19.068,80.943,17.6,79.138,17.6L79.138,17.6z">
</path>
</g>
<g>
<path d="M45.657,53.965c0.198,0,0.366,0.167,0.366,0.365v24.796c0,0.198-0.168,0.366-0.366,0.366H20.86 c-0.197,0-0.364-0.168-0.364-0.366V54.33c0-0.198,0.167-0.365,0.364-0.365H45.657 M45.657,51.057H20.86 c-1.805,0-3.272,1.469-3.272,3.273v24.796c0,1.806,1.468,3.274,3.272,3.274h24.797c1.806,0,3.274-1.469,3.274-3.274V54.33 C48.932,52.525,47.463,51.057,45.657,51.057L45.657,51.057z">
</path>
</g>
<g>
<path d="M79.138,53.965c0.198,0,0.366,0.167,0.366,0.365v24.796c0,0.198-0.168,0.366-0.366,0.366H54.342 c-0.199,0-0.365-0.168-0.365-0.366V54.33c0-0.198,0.166-0.365,0.365-0.365H79.138 M79.138,51.057H54.342 c-1.805,0-3.273,1.469-3.273,3.273v24.796c0,1.806,1.469,3.274,3.273,3.274h24.796c1.806,0,3.274-1.469,3.274-3.274V54.33 C82.412,52.525,80.943,51.057,79.138,51.057L79.138,51.057z">
</path>
</g>
</svg>
<p>Instagrams</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-alerts.html" class="element-type">
<div class="element">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" class="pt-1 pb-1" x="0px" y="0px" width="50px" height="62px" viewBox="0 0 70 70" xml:space="preserve">
<g>
<path d="M64.029,66.5H5.968c-2.125,0-4.107-1.23-5.171-3.072c-1.063-1.844-1.063-4.173,0-6.016L29.828,7.107 C30.892,5.266,32.873,4.11,35,4.11c2.125,0,4.108,1.139,5.171,2.981l29.031,50.28c1.063,1.843,1.063,4.215,0.001,6.058 C68.138,65.271,66.156,66.5,64.029,66.5z M35,8.081c-0.71,0-1.37,0.381-1.725,0.995L4.244,59.359c-0.354,0.614-0.354,1.953,0,2.568 C4.6,62.541,5.261,63.5,5.968,63.5h58.062c0.711,0,1.37-0.959,1.726-1.572c0.354-0.615,0.354-1.665-0.002-2.279L36.724,9.22 C36.368,8.606,35.708,8.081,35,8.081z">
</path>
</g>
<g>
<path d="M31.756,55.081c0-1.954,1.357-3.365,3.203-3.365c1.954,0,3.203,1.411,3.203,3.365 c0,1.901-1.249,3.365-3.203,3.365C33.059,58.446,31.756,56.982,31.756,55.081z M33.113,47.317l-0.76-26.059h5.211l-0.761,26.059 H33.113z">
</path>
</g>
</svg>
<p>Notification</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-categories.html" class="element-type">
<div class="element element-category">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M84.238,27.372h-5.896h-5.469h-1.965v-9.729c0-2.558-2.08-4.639-4.637-4.639h-5.725H46.141h-5.72 c-2.558,0-4.639,2.081-4.639,4.639v9.729h-12.48c-0.7,0-1.267,0.566-1.267,1.267v17.7l-7.541,0.021l0.088,30.599l7.453-0.021v8.76 c0,0.701,0.566,1.266,1.267,1.266H72.38c0.072,0.013,0.141,0.033,0.216,0.033h11.522c0.166,0,0.323-0.043,0.473-0.104 c0.524-0.154,0.914-0.619,0.914-1.195V28.639C85.505,27.938,84.938,27.372,84.238,27.372z M82.972,82.996l-3.361-3.019V29.905 h3.361V82.996z M75.938,84.429l2.42-2.174l2.416,2.174H75.938z M77.076,29.905v50.098l-2.935,2.636V29.905H77.076z M68.376,17.644 v9.729h-3.188v-9.729c0-0.762-0.203-1.471-0.529-2.105h1.613C67.431,15.538,68.376,16.482,68.376,17.644z M60.548,15.538 c1.161,0,2.106,0.944,2.106,2.105v9.729H44.036v-9.729c0-1.161,0.943-2.105,2.104-2.105H60.548z M38.316,17.644 c0-1.161,0.943-2.105,2.104-2.105h1.61c-0.327,0.635-0.529,1.344-0.529,2.105v9.729h-3.186V17.644z M17.036,48.886l35.928-0.098 l7.406,12.74l-7.334,12.785l-35.928,0.104L17.036,48.886z M24.568,76.929l29.937-0.088l8.793-15.318l-8.879-15.273l-29.851,0.082 V29.905h11.214v4.609c-0.725,0.457-1.21,1.258-1.21,2.176c0,1.42,1.155,2.575,2.574,2.575c1.422,0,2.577-1.155,2.577-2.575 c0-0.998-0.575-1.854-1.407-2.282v-4.503h24.338v4.582c-0.752,0.451-1.262,1.265-1.262,2.203c0,1.42,1.155,2.575,2.577,2.575 c1.419,0,2.573-1.155,2.573-2.575c0-0.977-0.552-1.818-1.354-2.254v-4.531h6.418v54.523H24.568V76.929z">
</path>
<path d="M57.041,61.255c-0.007-1.908-1.564-3.461-3.474-3.461h-0.01c-1.914,0.01-3.467,1.572-3.46,3.482 c0.006,1.904,1.559,3.456,3.478,3.456C55.485,64.732,57.041,63.173,57.041,61.255z M52.632,61.269 c-0.002-0.516,0.418-0.938,0.934-0.939l0.002-1.268v1.268c0.516,0,0.938,0.418,0.939,0.928c0,0.52-0.418,0.941-0.947,0.941 C53.05,62.198,52.632,61.782,52.632,61.269z">
</path>
<path d="M37.108,57.079l-3.33-6.743l-3.327,6.743l-7.441,1.078l5.384,5.252l-1.268,7.41l6.652-3.5l6.657,3.5l-1.272-7.41 l5.385-5.25L37.108,57.079z M37.07,66.187l-3.292-1.729l-3.29,1.729l0.628-3.66l-2.662-2.598l3.679-0.533l1.646-3.336l1.647,3.336 l3.679,0.531l-2.663,2.6L37.07,66.187z">
</path>
</g>
</svg>
<p>product categories</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-products.html" class="element-type">
<div class="element element-product">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M64.228,34.349H52.847c-0.787,0-1.423,0.636-1.423,1.423s0.636,1.422,1.423,1.422h11.381 c0.787,0,1.422-0.635,1.422-1.422S65.015,34.349,64.228,34.349z">
</path>
<path d="M73.093,15.584l-2.129-0.623l-9.178-2.199c-0.13-0.03-0.264-0.046-0.396-0.046 c-0.802,0-1.492,0.54-1.677,1.308c-0.027,0.119-0.041,0.252-0.041,0.406l-0.006,1.13h-0.133c-0.765,3.226-4.75,5.69-9.534,5.69 c-4.785,0-8.769-2.465-9.534-5.69h-0.14v-1.13c0-0.162-0.013-0.287-0.04-0.4c-0.185-0.773-0.874-1.313-1.677-1.313 c-0.134,0-0.267,0.015-0.391,0.045l-9.267,2.222l-2.146,0.625c-2.111,0.413-12.709,4.007-14.089,34.31 c-0.02,0.469,0.153,0.931,0.473,1.263c0.323,0.34,0.776,0.533,1.242,0.533h9.666v31.008c0,2.514,2.046,4.561,4.562,4.561h42.681 c2.516,0,4.562-2.047,4.562-4.561V51.715h9.665c0.467,0,0.919-0.193,1.242-0.533c0.321-0.334,0.493-0.794,0.473-1.26 C85.905,19.612,75.306,16.022,73.093,15.584z M75.902,48.284v-9.666c0-0.946-0.77-1.717-1.716-1.717 c-0.945,0-1.715,0.771-1.715,1.717v45.236H27.53V38.618c0-0.946-0.771-1.717-1.716-1.717c-0.945,0-1.716,0.771-1.716,1.717v9.666 h-7.864l0.085-1.209c1.458-20.785,7.627-26.282,10.043-27.651l-0.041-0.311l1.133-0.136c0.09-0.011,0.178-0.029,0.266-0.055 l2.183-0.641l7.227-1.73l0.363,0.908c1.695,4.252,6.837,7.223,12.506,7.223c5.67,0,10.812-2.97,12.506-7.223l0.362-0.908 l7.28,1.745l2.236,0.657l0.147,0.023c0.382,0.084,9.342,2.336,11.147,28.098l0.086,1.209H75.902z">
</path>
</g>
</svg>
<p>products</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-product-banner.html" class="element-type">
<div class="element element-product">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 5px 0 -3px 0;">
<path fill="#1A1818" stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M72.693,43.686V13.434  c0-2.648-2.199-4.803-4.901-4.803H5.466c-2.678,0-4.857,2.155-4.857,4.803v42.144c0,2.648,2.179,4.804,4.857,4.804h52.427  c-0.136-0.77-0.21-1.545-0.219-2.313H5.466c-1.305,0-2.408-1.141-2.408-2.491V13.434c0-1.35,1.103-2.491,2.408-2.491h62.326  c1.329,0,2.452,1.141,2.452,2.491v30.332C71.17,43.649,71.926,43.629,72.693,43.686z">
</path>
<path fill="#666" d="M78.684,63.363l-0.397-0.298l0.476-0.142c0.453-0.136,0.77-0.557,0.77-1.023  c0-0.508-0.366-0.948-0.871-1.049l-14.671-0.027l-0.262-1.249h13.1c0.625,0,1.788,0,2.159-1.684l2.079-9.446  c0.154-0.537,0.063-1.071-0.247-1.481c-0.334-0.438-0.888-0.699-1.48-0.699H60.955l-0.111-0.534c-0.174-1.11-0.96-1.767-2.105-1.767  l-4.458-0.002c-0.601,0-1.09,0.48-1.09,1.071s0.489,1.071,1.09,1.071l4.426,0.005l0.042,0.199l3.135,15.046  c0.16,0.631,0.468,1.085,0.912,1.34l0.389,0.223l-0.394,0.214c-1.007,0.547-1.633,1.586-1.633,2.711c0,1.721,1.421,3.12,3.167,3.12  s3.166-1.399,3.166-3.12c0-0.949-0.432-1.834-1.184-2.429l-0.564-0.446h9.603l-0.566,0.446c-0.753,0.594-1.185,1.479-1.185,2.429  c0,1.721,1.423,3.12,3.171,3.12c1.745,0,3.165-1.399,3.165-3.12C79.93,64.86,79.476,63.957,78.684,63.363z M61.403,48.405h17.454  l-1.997,9.029H63.282L61.403,48.405z M64.325,66.819c-0.549,0-0.995-0.438-0.995-0.978c0-0.54,0.446-0.979,0.995-0.979  c0.548,0,0.993,0.438,0.993,0.979C65.318,66.381,64.873,66.819,64.325,66.819z M76.765,66.819c-0.549,0-0.995-0.438-0.995-0.978  c0-0.54,0.446-0.979,0.995-0.979c0.547,0,0.992,0.438,0.992,0.979C77.757,66.381,77.312,66.819,76.765,66.819z">
</path>
<path fill="#666" d="M54.68,31.783c-0.309-0.411-1.098-0.62-2.344-0.62c-0.783,0-1.76,0.084-2.941,0.247l1.158-4.245  c0.133-0.486,0.064-0.993-0.189-1.428c-0.254-0.436-0.666-0.747-1.158-0.875c-0.055-0.015-5.873-1.506-12.547-1.506  c-7.356,0-12.281,1.417-12.487,1.478c-0.998,0.294-1.59,1.34-1.32,2.331l1.163,4.261c-3.121-0.438-4.883-0.321-5.392,0.359  c-0.229,0.306-0.257,0.706-0.074,1.069c1.63,3.249,1.627,5.572,1.626,6.823c0,0.769-0.001,1.323,0.411,1.696  c0.087,0.078,0.333,0.258,0.714,0.258c0.04,0,0.081-0.002,0.118-0.006c2.523-0.238,5.336-1.017,7.342-2.035  c1.161-0.589,1.656-1.604,1.502-3.012c1.751-0.371,4.099-0.762,6.238-0.762c0.127,0,0.253,0.001,0.381,0.004  c2.274,0.049,4.5,0.4,6.166,0.741c-0.16,1.417,0.334,2.438,1.498,3.029c2.01,1.019,4.824,1.797,7.344,2.034  c0.039,0.004,0.078,0.004,0.115,0.006c0.389,0,0.633-0.182,0.721-0.262c0.406-0.367,0.406-0.922,0.404-1.691  c-0.002-1.248-0.006-3.571,1.629-6.825C54.936,32.491,54.908,32.091,54.68,31.783z M44.49,36.883  c0.701,0.169,1.172,0.304,1.309,0.343c0.182,0.055,0.367,0.083,0.553,0.083c0.842,0,1.584-0.562,1.805-1.366l0.816-2.989  c1.277-0.194,2.674-0.32,3.598-0.32c0.156,0,0.305,0.004,0.453,0.012l0.182,0.01l-0.074,0.162c-1.49,3.241-1.486,5.596-1.484,6.86  l-0.004,0.45l-0.141-0.018c-2.201-0.274-4.607-0.972-6.281-1.821C44.818,38.083,44.426,37.776,44.49,36.883z M28.082,38.288  c-1.675,0.85-4.083,1.547-6.283,1.821l-0.141,0.018l-0.001-0.449c0.001-1.267,0.003-3.626-1.484-6.858l-0.074-0.161l0.181-0.011  c0.137-0.008,0.294-0.012,0.469-0.012c0.976,0,2.349,0.125,3.686,0.333l0.812,2.974c0.221,0.805,0.962,1.367,1.804,1.367  c0.188,0,0.373-0.027,0.545-0.081c0.058-0.017,0.511-0.146,1.211-0.318C28.858,37.876,28.375,38.137,28.082,38.288z M27.17,35.805  c-0.229,0.063-0.415-0.059-0.467-0.249l-2.396-8.778c-0.059-0.215,0.079-0.458,0.293-0.52c0.52-0.145,5.275-1.417,12.06-1.417  c6.253,0,11.572,1.306,12.158,1.455c0.104,0.026,0.189,0.092,0.242,0.184c0.053,0.092,0.068,0.198,0.043,0.296l-2.402,8.784  c-0.043,0.168-0.248,0.315-0.467,0.244c-0.186-0.056-4.605-1.365-9.32-1.469c-0.14-0.003-0.28-0.004-0.419-0.004  C32.066,34.33,27.363,35.746,27.17,35.805z">
</path>
</svg>
<p>Products + Banner</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-product-grid.html" class="element-type">
<div class="element element-product">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -9px 0 -9px 0;">
<g>
<path d="M18.387,18.974h0.99h19.228h0.991v1.021v4.087v1.022h-0.991V38.66v1.021h-0.99H20.368h-0.991V38.66V25.104h-0.99v-1.022   v-4.087V18.974z M20.368,21.018v2.043h17.246v-2.043H20.368z M21.359,25.104v12.534h15.264V25.104H21.359z">
</path>
<path d="M26.752,26.879h0.062c0.041,0,0.083,0,0.124,0h4.231c0.288,0,0.526,0.096,0.712,0.288c0.186,0.191,0.278,0.437,0.278,0.733   c0,0.299-0.093,0.543-0.278,0.734s-0.424,0.288-0.712,0.288h-4.231c-0.041,0-0.083,0-0.124,0c-0.247,0-0.475-0.097-0.681-0.288   c-0.207-0.191-0.311-0.436-0.311-0.734c0-0.256,0.094-0.479,0.279-0.67C26.287,27.038,26.504,26.921,26.752,26.879z">
</path>
<path d="M42.166,18.974h0.991h19.228h0.99v1.021v4.087v1.022h-0.99V38.66v1.021h-0.991H44.148h-0.991V38.66V25.104h-0.991v-1.022   v-4.087V18.974z M44.148,21.018v2.043h17.245v-2.043H44.148z M45.139,25.104v12.534h15.265V25.104H45.139z">
</path>
<path d="M50.531,26.879h0.063c0.04,0,0.082,0,0.124,0h4.23c0.288,0,0.526,0.096,0.712,0.288c0.187,0.191,0.279,0.437,0.279,0.733   c0,0.299-0.093,0.543-0.279,0.734c-0.186,0.191-0.424,0.288-0.712,0.288h-4.23c-0.042,0-0.084,0-0.124,0   c-0.248,0-0.476-0.097-0.682-0.288c-0.207-0.191-0.31-0.436-0.31-0.734c0-0.256,0.093-0.479,0.278-0.67   C50.067,27.038,50.284,26.921,50.531,26.879z">
</path>
<path d="M18.387,42.251h0.99h19.228h0.991v1.021v4.087v1.022h-0.991v13.556v1.022h-0.99H20.368h-0.991v-1.022V48.381h-0.99v-1.022   v-4.087V42.251z M20.368,44.293v2.045h17.246v-2.045H20.368z M21.359,48.381v12.534h15.264V48.381H21.359z">
</path>
<path d="M26.752,50.156h0.062c0.041,0,0.083,0,0.124,0h4.231c0.288,0,0.526,0.096,0.712,0.287s0.278,0.437,0.278,0.734   s-0.093,0.543-0.278,0.734s-0.424,0.287-0.712,0.287h-4.231c-0.041,0-0.083,0-0.124,0c-0.247,0-0.475-0.096-0.681-0.287   c-0.207-0.191-0.311-0.437-0.311-0.734c0-0.256,0.094-0.479,0.279-0.671C26.287,50.316,26.504,50.198,26.752,50.156z">
</path>
<path d="M42.166,42.251h0.991h19.228h0.99v1.021v4.087v1.022h-0.99v13.556v1.022h-0.991H44.148h-0.991v-1.022V48.381h-0.991v-1.022   v-4.087V42.251z M44.148,44.293v2.045h17.245v-2.045H44.148z M45.139,48.381v12.534h15.265V48.381H45.139z">
</path>
<path d="M50.531,50.156h0.063c0.04,0,0.082,0,0.124,0h4.23c0.288,0,0.526,0.096,0.712,0.287c0.187,0.191,0.279,0.437,0.279,0.734   s-0.093,0.543-0.279,0.734c-0.186,0.191-0.424,0.287-0.712,0.287h-4.23c-0.042,0-0.084,0-0.124,0c-0.248,0-0.476-0.096-0.682-0.287   c-0.207-0.191-0.31-0.437-0.31-0.734c0-0.256,0.093-0.479,0.278-0.671C50.067,50.316,50.284,50.198,50.531,50.156z">
</path>
</g>
</svg>
<p>Products Grid</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-product-single.html" class="element-type">
<div class="element element-product">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 4px 0 -2px 0;">
<path fill="#666" stroke="#000000" stroke-width="0.5" stroke-miterlimit="10" d="M72.693,45.686V15.434  c0-2.648-2.199-4.803-4.901-4.803H5.466c-2.678,0-4.857,2.155-4.857,4.803v42.144c0,2.648,2.179,4.804,4.857,4.804h52.427  c-0.136-0.77-0.21-1.545-0.219-2.313H5.466c-1.305,0-2.408-1.141-2.408-2.491V15.434c0-1.35,1.103-2.491,2.408-2.491h62.326  c1.329,0,2.452,1.141,2.452,2.491v30.332C71.17,45.649,71.926,45.629,72.693,45.686z">
</path>
<path fill="#666" d="M78.684,65.363l-0.397-0.298l0.476-0.142c0.453-0.136,0.77-0.557,0.77-1.023  c0-0.508-0.366-0.948-0.871-1.049l-14.671-0.027l-0.262-1.249h13.1c0.625,0,1.788,0,2.159-1.684l2.079-9.446  c0.154-0.537,0.063-1.071-0.247-1.481c-0.334-0.438-0.888-0.699-1.48-0.699H60.955l-0.111-0.534c-0.174-1.11-0.96-1.767-2.105-1.767  l-4.458-0.002c-0.601,0-1.09,0.48-1.09,1.071s0.489,1.071,1.09,1.071l4.426,0.005l0.042,0.199l3.135,15.046  c0.16,0.631,0.468,1.085,0.912,1.34l0.389,0.223l-0.394,0.214c-1.007,0.547-1.633,1.586-1.633,2.711c0,1.721,1.421,3.12,3.167,3.12  s3.166-1.399,3.166-3.12c0-0.949-0.432-1.834-1.184-2.429l-0.564-0.446h9.603l-0.566,0.446c-0.753,0.594-1.185,1.479-1.185,2.429  c0,1.721,1.423,3.12,3.171,3.12c1.745,0,3.165-1.399,3.165-3.12C79.93,66.86,79.476,65.957,78.684,65.363z M61.403,50.405h17.454  l-1.997,9.029H63.282L61.403,50.405z M64.325,68.819c-0.549,0-0.995-0.438-0.995-0.978c0-0.54,0.446-0.979,0.995-0.979  c0.548,0,0.993,0.438,0.993,0.979C65.318,68.381,64.873,68.819,64.325,68.819z M76.765,68.819c-0.549,0-0.995-0.438-0.995-0.978  c0-0.54,0.446-0.979,0.995-0.979c0.547,0,0.992,0.438,0.992,0.979C77.757,68.381,77.312,68.819,76.765,68.819z">
</path>
<g>
<path d="M34.364,29.794c0.884,0,1.603-0.718,1.603-1.601c0-0.883-0.719-1.602-1.603-1.602c-0.882,0-1.6,0.718-1.6,1.602   C32.764,29.076,33.482,29.794,34.364,29.794z M34.364,27.59c0.333,0,0.603,0.271,0.603,0.603s-0.271,0.603-0.603,0.603   c-0.332,0-0.602-0.271-0.602-0.603S34.032,27.59,34.364,27.59z">
</path>
<path d="M39.666,35.965h-0.66l-3.271-3.205c-0.186-0.183-0.509-0.184-0.697-0.002l-1.264,1.229l-3.809-3.84   c-0.182-0.182-0.528-0.183-0.709,0l-5.775,5.819h-0.649c-0.275,0-0.499,0.225-0.499,0.502s0.224,0.502,0.499,0.502h16.833   c0.275,0,0.499-0.225,0.499-0.502S39.94,35.965,39.666,35.965z M34.351,35.965h-9.48l4.74-4.778L34.351,35.965z M37.599,35.965   h-1.837l-1.264-1.303l0.886-0.857L37.599,35.965z">
</path>
<path d="M39.798,21.855H23.161c-2.068,0-3.75,1.682-3.75,3.75v12.722c0,2.068,1.682,3.75,3.75,3.75h16.638   c2.068,0,3.75-1.682,3.75-3.75V25.605C43.548,23.537,41.866,21.855,39.798,21.855z M42.048,38.327c0,1.241-1.009,2.25-2.25,2.25   H23.161c-1.241,0-2.25-1.009-2.25-2.25V25.605c0-1.241,1.009-2.25,2.25-2.25h16.638c1.241,0,2.25,1.009,2.25,2.25V38.327z">
</path>
<path d="M24.966,42.899h-3.805c-0.965,0-1.75,0.785-1.75,1.75v3.224c0,0.965,0.785,1.75,1.75,1.75h3.805   c0.965,0,1.75-0.785,1.75-1.75v-3.224C26.716,43.685,25.931,42.899,24.966,42.899z M25.216,47.873c0,0.136-0.114,0.25-0.25,0.25   h-3.805c-0.136,0-0.25-0.114-0.25-0.25v-3.224c0-0.136,0.114-0.25,0.25-0.25h3.805c0.136,0,0.25,0.114,0.25,0.25V47.873z">
</path>
<path d="M33.382,42.899h-3.805c-0.965,0-1.75,0.785-1.75,1.75v3.224c0,0.965,0.785,1.75,1.75,1.75h3.805   c0.965,0,1.75-0.785,1.75-1.75v-3.224C35.132,43.685,34.347,42.899,33.382,42.899z M33.632,47.873c0,0.136-0.114,0.25-0.25,0.25   h-3.805c-0.136,0-0.25-0.114-0.25-0.25v-3.224c0-0.136,0.114-0.25,0.25-0.25h3.805c0.136,0,0.25,0.114,0.25,0.25V47.873z">
</path>
<path d="M41.799,42.899h-3.805c-0.965,0-1.75,0.785-1.75,1.75v3.224c0,0.965,0.785,1.75,1.75,1.75h3.805   c0.964,0,1.749-0.785,1.749-1.75v-3.224C43.548,43.685,42.763,42.899,41.799,42.899z M42.048,47.873c0,0.136-0.114,0.25-0.249,0.25   h-3.805c-0.136,0-0.25-0.114-0.25-0.25v-3.224c0-0.136,0.114-0.25,0.25-0.25h3.805c0.135,0,0.249,0.114,0.249,0.25V47.873z">
</path>
<rect x="44.539" y="24.397" width="7.684" height="1.5"></rect>
<rect x="44.539" y="31.362" width="9.352" height="1.5"></rect>
<rect x="44.539" y="38.328" width="9.352" height="1.5"></rect>
<rect x="44.539" y="45.294" width="6.014" height="1.5"></rect>
</g>
</svg>
<p>Products + single</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-product-tab.html" class="element-type">
<div class="element element-product">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 5px 0 -3px 0;">
<path fill="#666" d="M73.545,65.363l-0.397-0.298l0.476-0.142c0.453-0.136,0.77-0.557,0.77-1.023  c0-0.508-0.366-0.948-0.871-1.049l-14.671-0.027l-0.262-1.249h13.1c0.625,0,1.788,0,2.159-1.684l2.079-9.446  c0.154-0.537,0.063-1.071-0.247-1.481c-0.334-0.438-0.888-0.699-1.48-0.699H55.816l-0.111-0.534c-0.174-1.11-0.96-1.767-2.105-1.767  l-4.458-0.002c-0.601,0-1.09,0.48-1.09,1.071s0.489,1.071,1.09,1.071l4.426,0.005l0.042,0.199l3.135,15.046  c0.16,0.631,0.468,1.085,0.912,1.34l0.389,0.223l-0.394,0.214c-1.007,0.547-1.633,1.586-1.633,2.711c0,1.721,1.421,3.12,3.167,3.12  s3.166-1.399,3.166-3.12c0-0.949-0.432-1.834-1.184-2.429l-0.564-0.446h9.603l-0.566,0.446c-0.753,0.594-1.185,1.479-1.185,2.429  c0,1.721,1.423,3.12,3.171,3.12c1.745,0,3.165-1.399,3.165-3.12C74.791,66.86,74.337,65.957,73.545,65.363z M56.265,50.405h17.454  l-1.997,9.029H58.144L56.265,50.405z M59.187,68.819c-0.549,0-0.995-0.438-0.995-0.978c0-0.54,0.446-0.979,0.995-0.979  c0.548,0,0.993,0.438,0.993,0.979C60.18,68.381,59.734,68.819,59.187,68.819z M71.626,68.819c-0.549,0-0.995-0.438-0.995-0.978  c0-0.54,0.446-0.979,0.995-0.979c0.547,0,0.992,0.438,0.992,0.979C72.618,68.381,72.173,68.819,71.626,68.819z">
</path>
<path fill="none" stroke="#666" stroke-width="2.5" stroke-miterlimit="10" d="M31.558,11.548h15.52h0.088  c1.949,0,3.063,0.938,3.525,2.291l0.15,0.528l1.664,5.863">
</path>
<path fill="none" stroke="#666" stroke-width="2.5" stroke-miterlimit="10" d="M15.956,11.548h15.491h0.111  c1.949,0,3.219,1.027,3.58,2.465l1.766,6.217">
</path>
<path stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M9.473,59.401c-1.351,0-2.447-1.315-2.447-2.932V15.358  c0-1.473,1.097-2.671,2.447-2.671h6.922c1.283,0,2.169,0.533,2.429,1.456l2.039,7.227h42.444c1.416,0,2.568,1.179,2.568,2.629  v21.714h2.279V23.998c0-2.707-2.174-4.908-4.848-4.908H22.587l-1.569-5.561c-0.543-1.925-2.314-3.121-4.623-3.121H9.212v0.007  c-2.485,0.142-4.466,2.308-4.466,5.043V56.47c0,2.872,2.121,5.21,4.727,5.21h43.921l-0.59-2.278H9.473z">
</path>
</svg>
<p>Products tab</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-single-product.html" class="element-type">
<div class="element element-product">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -11px 0 -7px 0;">
<g>
<path fill="#666" stroke="#666" stroke-width="0.25" stroke-miterlimit="10" d="M36.235,29.915   c1.403,0,2.544-1.142,2.544-2.543s-1.141-2.544-2.544-2.544c-1.401,0-2.542,1.142-2.542,2.544S34.833,29.915,36.235,29.915z    M36.235,26.118c0.691,0,1.254,0.562,1.254,1.254c0,0.691-0.563,1.254-1.254,1.254s-1.254-0.563-1.254-1.254   C34.981,26.679,35.543,26.118,36.235,26.118z">
</path>
<path fill="#666" stroke="#666" stroke-width="0.25" stroke-miterlimit="10" d="M45.367,40.977h-1.225l-5.698-5.582   c-0.25-0.245-0.648-0.246-0.9-0.002l-2.329,2.264l-6.712-6.766c-0.242-0.244-0.673-0.245-0.915-0.001L17.576,40.977h-1.209   c-0.355,0-0.645,0.293-0.645,0.65c0,0.354,0.289,0.648,0.645,0.648h1.449h20.46h5.64h1.451c0.355,0,0.644-0.294,0.644-0.648   C46.011,41.27,45.723,40.977,45.367,40.977z M37.993,36.739l4.343,4.237H38.55l-2.391-2.465L37.993,36.739z M28.046,32.225   l8.683,8.751H19.363L28.046,32.225z">
</path>
</g>
<g>
<path fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" d="M50.765,47c0,1.65-1.35,3-3,3h-33   c-1.65,0-3-1.35-3-3V20.745c0-1.65,1.35-3,3-3h33c1.65,0,3,1.35,3,3V47z">
</path>
</g>
<g>
<path fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" d="M21.765,62c0,0.55-0.45,1-1,1h-8   c-0.55,0-1-0.45-1-1v-7c0-0.55,0.45-1,1-1h8c0.55,0,1,0.45,1,1V62z">
</path>
</g>
<g>
<path fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" d="M36.265,62c0,0.55-0.45,1-1,1h-8   c-0.55,0-1-0.45-1-1v-7c0-0.55,0.45-1,1-1h8c0.55,0,1,0.45,1,1V62z">
</path>
</g>
<g>
<path fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" d="M50.765,62c0,0.55-0.45,1-1,1h-8   c-0.55,0-1-0.45-1-1v-7c0-0.55,0.45-1,1-1h8c0.55,0,1,0.45,1,1V62z">
</path>
</g>
<line fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" x1="53.765" y1="22.125" x2="67" y2="22.125">
</line>
<line fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" x1="53.765" y1="34.125" x2="69.875" y2="34.125">
</line>
<line fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" x1="53.765" y1="46.125" x2="69.875" y2="46.125">
</line>
<line fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" x1="53.765" y1="58.125" x2="64.125" y2="58.125">
</line>
</svg>
<p>single product</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-slider.html" class="element-type">
<div class="element">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -9px 0 -9px 0;">
<g>
<path fill="#666" d="M47.263,36.696c1.861,0,3.374-1.515,3.374-3.375c0-1.86-1.513-3.375-3.374-3.375   c-1.86,0-3.374,1.515-3.374,3.375C43.889,35.181,45.402,36.696,47.263,36.696z M47.263,31.657c0.917,0,1.664,0.746,1.664,1.664   c0,0.917-0.747,1.665-1.664,1.665s-1.664-0.747-1.664-1.665C45.599,32.402,46.346,31.657,47.263,31.657z">
</path>
<path fill="#666" d="M59.379,51.373h-1.623l-7.562-7.406c-0.33-0.325-0.86-0.326-1.193-0.003l-3.091,3.003l-8.906-8.978   c-0.321-0.323-0.893-0.325-1.214-0.001L22.504,51.373H20.9c-0.472,0-0.855,0.39-0.855,0.862c0,0.471,0.383,0.862,0.855,0.862h1.923   h27.148h7.483h1.925c0.473,0,0.854-0.392,0.854-0.862C60.233,51.763,59.852,51.373,59.379,51.373z M49.595,45.751l5.764,5.622   h-5.024l-3.171-3.271L49.595,45.751z M36.396,39.761l11.521,11.612H24.875L36.396,39.761z">
</path>
</g>
<path fill="#666" d="M60.518,19.837H19.725c-2.17,0-3.937,1.722-3.937,3.893v32.541c0,2.172,1.767,3.893,3.937,3.893h40.792  c2.173,0,3.973-1.721,3.973-3.893V23.73C64.49,21.559,62.69,19.837,60.518,19.837z M62.505,56.271c0,1.084-0.899,2.019-1.987,2.019  H19.725c-1.083,0-1.952-0.935-1.952-2.019V23.73c0-1.085,0.868-2.019,1.952-2.019h40.792c1.088,0,1.987,0.933,1.987,2.019V56.271z">
</path>
<path fill="#666" d="M8.187,22.812H2.731v1.633h5.455c0.947,0,1.732,0.813,1.732,1.76v28.142c0,0.945-0.785,1.759-1.732,1.759  H2.731v1.634h5.455c1.894,0,3.461-1.5,3.461-3.393V26.205C11.648,24.312,10.08,22.812,8.187,22.812z">
</path>
<path fill="#666" d="M72.006,22.812h5.454v1.633h-5.454c-0.948,0-1.732,0.813-1.732,1.76v28.142c0,0.945,0.784,1.759,1.732,1.759  h5.454v1.634h-5.454c-1.894,0-3.463-1.5-3.463-3.393V26.205C68.543,24.312,70.112,22.812,72.006,22.812z">
</path>
</svg>
<p>slider</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-social-link.html" class="element-type">
<div class="element element-tab">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -6px 0 -12px 0;">
<g>
<path fill="none" stroke="#666" stroke-width="2.25" stroke-miterlimit="10" d="M60.575,55.773c0,1.65-1.35,3-3,3H20.092   c-1.65,0-3-1.35-3-3V18.291c0-1.65,1.35-3,3-3h37.483c1.65,0,3,1.35,3,3V55.773z">
</path>
</g>
<g>
<g>
<path stroke="#666" stroke-width="0.5" stroke-miterlimit="10" d="M35.092,46.245c-2.53,0-4.877-0.685-6.976-2.037l-1.42-0.914    l1.682,0.152c0.297,0.027,0.633,0.041,1.011,0.041c1.574,0,3.032-0.4,4.349-1.19c-0.614-0.147-1.179-0.419-1.688-0.813    c-0.805-0.624-1.368-1.418-1.672-2.361l-0.194-0.603l0.63,0.063c0.053,0.006,0.104,0.011,0.156,0.015    c-0.39-0.265-0.745-0.589-1.062-0.973c-0.731-0.883-1.101-1.903-1.101-3.032v-0.811l0.625,0.37c0.133,0.078,0.27,0.148,0.408,0.21    c-0.159-0.206-0.303-0.424-0.435-0.655c-0.397-0.703-0.598-1.484-0.598-2.322c0-0.841,0.231-1.653,0.687-2.415l0.308-0.512    l0.373,0.467c1.048,1.317,2.351,2.381,3.87,3.161c1.374,0.704,2.848,1.128,4.391,1.264c-0.017-0.188-0.025-0.374-0.025-0.56    c0-0.853,0.216-1.662,0.642-2.407c0.426-0.746,1.014-1.341,1.745-1.768c1.331-0.777,3.018-0.84,4.346-0.228    c0.517,0.238,0.988,0.552,1.402,0.933c0.879-0.192,1.71-0.515,2.472-0.957l0.937-0.543l-0.333,1.03    c-0.187,0.571-0.46,1.084-0.82,1.533c0.282-0.093,0.566-0.2,0.848-0.323l1.324-0.573l-0.818,1.189    c-0.591,0.859-1.303,1.616-2.119,2.254c0.008,0.104,0.012,0.224,0.012,0.362c0,2.071-0.51,4.098-1.516,6.021    c-1.032,2.037-2.505,3.686-4.377,4.894C40.111,45.559,37.735,46.245,35.092,46.245z M29.986,44.298    c1.583,0.743,3.294,1.117,5.106,1.117c2.478,0,4.7-0.639,6.607-1.9c1.75-1.132,3.126-2.672,4.094-4.581    c0.945-1.809,1.423-3.705,1.423-5.642c0-0.294-0.021-0.408-0.03-0.444l-0.066-0.269l0.222-0.165c0.444-0.33,0.857-0.697,1.234-1.1    c-0.408,0.112-0.818,0.195-1.226,0.25l-1.925,0.256l1.652-1.02c0.523-0.323,0.938-0.712,1.254-1.177    c-0.588,0.244-1.202,0.429-1.837,0.553l-0.217,0.042l-0.156-0.156c-0.384-0.383-0.829-0.693-1.327-0.923    c-1.083-0.5-2.481-0.449-3.58,0.19c-0.604,0.353-1.089,0.845-1.443,1.463c-0.353,0.618-0.532,1.29-0.532,1.996    c0,0.311,0.026,0.627,0.078,0.938l0.084,0.506l-0.513-0.023c-1.841-0.087-3.599-0.554-5.223-1.388    c-1.433-0.736-2.686-1.708-3.731-2.894c-0.198,0.47-0.299,0.957-0.299,1.455c0,0.693,0.165,1.337,0.492,1.914    c0.332,0.586,0.771,1.078,1.306,1.46l1.129,0.808l-1.387-0.056c-0.518-0.021-1.019-0.127-1.497-0.316    c0.103,0.696,0.389,1.323,0.868,1.902c0.616,0.744,1.364,1.206,2.287,1.411l1.856,0.412l-1.859,0.397    c-0.474,0.102-0.945,0.143-1.426,0.134c0.267,0.532,0.648,0.986,1.153,1.377c0.672,0.521,1.432,0.772,2.325,0.772h1.211    l-0.957,0.743C33.608,43.528,31.877,44.185,29.986,44.298z">
</path>
</g>
</g>
</svg>
<p>social icons</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-subcategory.html" class="element-type">
<div class="element element-tab">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -10px 0 -8px 0;">
<g>
<path d="M57.854,18.943c0-1.089-0.875-1.976-1.95-1.976H23.549c-1.075,0-1.95,0.887-1.95,1.976v21.614   c0,1.09,0.875,1.978,1.95,1.978h32.354c1.075,0,1.95-0.887,1.95-1.978V18.943z M55.599,40.249H23.854V19.253h31.745V40.249z">
</path>
<path d="M27.296,53.203h-11.15c-0.907,0-1.646,0.747-1.646,1.667v8.419c0,0.918,0.737,1.668,1.646,1.668h11.15   c0.906,0,1.646-0.748,1.646-1.668V54.87C28.941,53.95,28.203,53.203,27.296,53.203z M27.293,63.289H16.146v-8.418h11.15   L27.293,63.289z">
</path>
<path d="M45.576,53.203H34.424c-0.906,0-1.645,0.747-1.645,1.668v8.42c0,0.917,0.737,1.667,1.645,1.667h11.152   c0.906,0,1.646-0.748,1.646-1.667v-8.42C47.221,53.95,46.482,53.203,45.576,53.203z M45.572,63.289H34.424v-8.418h11.152   L45.572,63.289z">
</path>
<path d="M63.854,53.203H52.703c-0.906,0-1.646,0.747-1.646,1.668v8.42c0,0.917,0.738,1.667,1.646,1.667h11.151   c0.905,0,1.646-0.748,1.646-1.667v-8.42C65.5,53.95,64.762,53.203,63.854,53.203z M63.853,63.289H52.703v-8.418h11.151   L63.853,63.289z">
</path>
<path d="M22.27,49.313c0-0.286,0.374-0.604,0.91-0.604h15.724v3.336h1.646v-3.336h16.013c0.342,0,0.621,0.238,0.621,0.533v3.13   h1.645v-3.13c0-1.214-1.015-2.201-2.266-2.201H40.549v-3.496h-1.646v3.496H23.18c-1.409,0-2.555,1.02-2.555,2.271v3.06h1.646   L22.27,49.313L22.27,49.313z">
</path>
<path d="M45.237,24.105h-9.963l-0.062-0.302c-0.091-0.609-0.52-0.973-1.142-0.973h-2.41c-0.002,0-0.003,0-0.006,0   c-0.326,0-0.589,0.266-0.589,0.593c0,0.326,0.264,0.593,0.589,0.593c0.003,0,0.004-0.001,0.006-0.001l2.395,0.003l1.719,8.436   c0.124,0.497,0.389,0.771,0.789,0.858c-0.684,0.229-1.181,0.87-1.181,1.633c0,0.953,0.77,1.727,1.717,1.727   c0.945,0,1.715-0.773,1.715-1.727c0-0.716-0.436-1.331-1.054-1.593h5.419c-0.617,0.261-1.054,0.877-1.054,1.593   c0,0.953,0.77,1.727,1.715,1.727c0.946,0,1.716-0.773,1.716-1.727c0-0.716-0.436-1.331-1.053-1.593h0.237   c0.004,0,0.007,0.002,0.013,0.002c0.324,0,0.589-0.266,0.589-0.592s-0.262-0.588-0.582-0.593v-0.003H36.92l-0.141-0.693h7.097   c0.34,0,0.971,0,1.172-0.933l1.129-5.239c0.083-0.287,0.033-0.581-0.136-0.809C45.856,24.25,45.558,24.105,45.237,24.105z    M43.843,34.404c0.297,0,0.538,0.243,0.538,0.541c0,0.299-0.241,0.541-0.538,0.541c-0.296,0-0.538-0.242-0.538-0.541   C43.305,34.647,43.546,34.404,43.843,34.404z M37.101,34.404c0.296,0,0.538,0.243,0.538,0.541c0,0.299-0.242,0.541-0.538,0.541   s-0.538-0.242-0.538-0.541C36.563,34.647,36.805,34.404,37.101,34.404z M43.896,30.289c-0.007,0-0.014,0-0.021,0h-7.341l-1.019-5   h9.46L43.896,30.289z">
</path>
</g>
</svg>
<p>Subcategories</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-svg-floating.html" class="element-type">
<div class="element element-tab">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -1px 0 -17px 0;">
<polygon stroke="#000000" stroke-width="0.1" stroke-miterlimit="10" points="21.215,45.612 13.114,45.612 13.114,17.026   50.79,17.026 50.79,19.813 52.717,19.813 52.717,15.1 11.188,15.1 11.188,47.538 21.215,47.538 ">
</polygon>
<path stroke="#000000" stroke-width="0.1" stroke-miterlimit="10" d="M37.315,51.803H29.76c-2.834,0-5.141-2.306-5.141-5.14V28.356  c0-2.833,2.306-5.139,5.141-5.139h25.397c2.833,0,5.139,2.306,5.139,5.139v1.991c0.678,0.425,1.322,0.894,1.927,1.412v-3.403  c0-3.896-3.169-7.065-7.065-7.065H29.76c-3.897,0-7.067,3.169-7.067,7.065v18.307c0,3.896,3.17,7.066,7.067,7.066h8.79  C38.099,53.115,37.678,52.479,37.315,51.803z">
</path>
<g>
<path stroke="#000000" stroke-width="0.1" stroke-miterlimit="10" d="M51.653,59.1c-8.265,0-14.988-6.723-14.988-14.987   c0-8.264,6.724-14.988,14.988-14.988c8.263,0,14.986,6.724,14.986,14.988C66.64,52.377,59.916,59.1,51.653,59.1z M51.653,31.05   c-7.203,0-13.062,5.86-13.062,13.062c0,7.203,5.859,13.062,13.062,13.062c7.2,0,13.06-5.858,13.06-13.062   C64.713,36.91,58.854,31.05,51.653,31.05z">
</path>
</g>
</svg>
<p>svg floating</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-tabs.html" class="element-type">
<div class="element element-tab">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M65.924,67.172c0-0.594-0.354-1.109-0.859-1.344c0.627-0.088,0.984-0.137,0.768-0.137h-1.375H32.961H22.818 c-0.81,0-1.469,0.668-1.469,1.48c0,0.811,0.659,1.479,1.469,1.479h10.144h31.496h1.375c0.217,0-0.141-0.05-0.768-0.138 C65.57,68.279,65.924,67.766,65.924,67.172z">
</path>
<path d="M22.818,52.041h6.087h33.523h6.086c0.809,0,1.469-0.67,1.469-1.482c0-0.811-0.66-1.478-1.469-1.478h-6.086H28.905h-6.087 c-0.81,0-1.469,0.667-1.469,1.478C21.349,51.371,22.008,52.041,22.818,52.041z">
</path>
<path d="M74.6,57.387H22.818c-0.81,0-1.469,0.666-1.469,1.479c0,0.811,0.659,1.48,1.469,1.48H74.6c0.811,0,1.469-0.67,1.469-1.48 C76.068,58.053,75.41,57.387,74.6,57.387z">
</path>
<path d="M84.678,18.738H15.27c-3.235,0-5.868,2.564-5.868,5.803v50.918c0,3.24,2.633,5.803,5.868,5.803h69.408 c3.238,0,5.922-2.563,5.922-5.801v-50.92C90.6,21.303,87.916,18.738,84.678,18.738z M87.641,75.461 c0,1.617-1.342,3.008-2.963,3.008H15.27c-1.616,0-2.91-1.391-2.91-3.01V38.165c0.167,0.066,0.346,0.106,0.536,0.106h74.737 c0.002,0,0.006-0.002,0.008-0.002V75.461z M87.641,35.313c-0.002,0-0.006-0.001-0.008-0.001H12.896c-0.19,0-0.369,0.04-0.536,0.106 V24.541c0-1.619,1.294-3.008,2.91-3.008h69.408c1.621,0,2.963,1.389,2.963,3.008V35.313z">
</path>
<path d="M32.838,27.746H22.031c-0.744,0-1.348,0.604-1.348,1.351c0,0.745,0.604,1.351,1.348,1.351h10.807 c0.747,0,1.352-0.605,1.352-1.351C34.19,28.35,33.585,27.746,32.838,27.746z">
</path>
<path d="M48.79,27.746h-0.902c-0.745,0-1.349,0.604-1.349,1.351c0,0.745,0.604,1.351,1.349,1.351h0.902 c0.745,0,1.349-0.605,1.349-1.351C50.139,28.35,49.534,27.746,48.79,27.746z">
</path>
<path d="M39.785,27.746h-0.9c-0.747,0-1.351,0.604-1.351,1.351c0,0.745,0.604,1.351,1.351,1.351h0.9 c0.746,0,1.353-0.605,1.353-1.351C41.137,28.35,40.531,27.746,39.785,27.746z">
</path>
<path d="M44.287,27.746h-0.901c-0.745,0-1.35,0.604-1.35,1.351c0,0.745,0.605,1.351,1.35,1.351h0.901 c0.747,0,1.35-0.605,1.35-1.351C45.637,28.35,45.034,27.746,44.287,27.746z">
</path>
</g>
</svg>
<p>tabs</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-testimonials.html" class="element-type">
<div class="element element-testimonial">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M84.41,37.332c0.581,0,1.054-0.671,1.054-1.481c0-0.813-0.473-1.48-1.054-1.48H44.918c-0.581,0-1.054,0.668-1.054,1.48 c0,0.811,0.473,1.481,1.054,1.481H84.41z">
</path>
<path d="M35.122,44.165c0,0.811,0.473,1.481,1.056,1.481H84.41c0.581,0,1.054-0.671,1.054-1.481c0-0.813-0.473-1.48-1.054-1.48 H36.178C35.595,42.685,35.122,43.352,35.122,44.165z">
</path>
<path d="M84.41,50.997H50.746c-0.583,0-1.056,0.669-1.056,1.484c0,0.81,0.473,1.479,1.056,1.479H84.41 c0.581,0,1.054-0.67,1.054-1.479C85.464,51.666,84.991,50.997,84.41,50.997z">
</path>
<path d="M40.32,56.454l-9.714-1.412c-0.066-0.009-0.123-0.052-0.151-0.11l-4.346-8.805c-0.588-1.191-1.826-1.962-3.155-1.962 c-1.347,0-2.558,0.751-3.153,1.962l-4.346,8.805c-0.03,0.059-0.085,0.102-0.151,0.11l-9.716,1.412 c-1.335,0.194-2.423,1.11-2.839,2.393c-0.413,1.263-0.062,2.68,0.891,3.607l7.03,6.852c0.046,0.046,0.069,0.113,0.057,0.179 l-1.661,9.68c-0.224,1.309,0.326,2.657,1.401,3.438c0.604,0.439,1.319,0.674,2.066,0.674c0.57,0,1.136-0.141,1.637-0.405 l8.692-4.568c0.028-0.016,0.061-0.023,0.092-0.023c0.034,0,0.066,0.008,0.094,0.023l8.691,4.568 c0.501,0.265,1.068,0.405,1.637,0.405c0.747,0,1.461-0.234,2.067-0.674c1.075-0.78,1.625-2.129,1.399-3.438l-1.66-9.68 c-0.011-0.065,0.012-0.133,0.059-0.179l7.032-6.852c0.949-0.928,1.301-2.343,0.891-3.607C42.745,57.564,41.657,56.648,40.32,56.454 z M41.004,59.843l-8.879,8.655l2.096,12.222c0.012,0.074-0.018,0.152-0.08,0.198c-0.036,0.025-0.077,0.038-0.119,0.038 c-0.032,0-0.064-0.009-0.094-0.025l-10.975-5.769l-10.975,5.769c-0.03,0.017-0.062,0.025-0.094,0.025 c-0.041,0-0.082-0.013-0.119-0.038c-0.062-0.046-0.092-0.124-0.08-0.198l2.098-12.222l-8.879-8.655 c-0.057-0.053-0.077-0.133-0.052-0.206s0.089-0.126,0.164-0.139l12.271-1.781l5.487-11.119c0.034-0.07,0.104-0.112,0.18-0.112 c0.077,0,0.147,0.042,0.181,0.112l5.488,11.119l12.272,1.781c0.075,0.013,0.137,0.065,0.16,0.139 C41.079,59.71,41.06,59.79,41.004,59.843z">
</path>
<path d="M91.497,18.037H25.334c-3.239,0-5.876,2.568-5.876,5.811v11.158c0.187-0.01,0.364,0,0.553,0c0.869,0,1.667-0.182,2.412,0 V23.848c0-1.62,1.294-3.012,2.912-3.012h66.163c1.625,0,2.966,1.392,2.966,3.012v42.903c0,1.621-1.341,3.013-2.966,3.013H87.47 h-2.308v2.798v9.084l-7.654-9.084l-2.359-2.798h-3.017H47.875c0.092,0.93,0.153,1.876,0,2.798h26.616L87.47,87.963V72.562h4.027 c3.244,0,5.927-2.568,5.927-5.811V23.848C97.424,20.605,94.741,18.037,91.497,18.037z">
</path>
</g>
</svg>
<p>testimonials</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-titles.html" class="element-type">
<div class="element element-title active">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<path d="M32.425,18.043h-2.268l-8.941,27.391h20.07L32.425,18.043z M31.284,22.751L37.806,42.9H24.71L31.284,22.751 z">
</path>
<path d="M12.567,64.073h3.293c1.088,0,2.057-0.695,2.402-1.729l3.828-11.421h18.396l3.762,11.408 c0.342,1.039,1.313,1.741,2.406,1.741h3.287c0.816,0,1.586-0.396,2.063-1.061c0.475-0.667,0.6-1.521,0.334-2.295L36.397,14.266 c-0.35-1.022-1.313-1.712-2.396-1.712h-5.496c-1.084,0-2.045,0.689-2.396,1.712L10.171,60.718 c-0.266,0.773-0.141,1.628,0.334,2.295C10.981,63.677,11.747,64.073,12.567,64.073z M28.505,15.089h5.496L49.942,61.54h-3.287 l-4.336-13.15H20.267L15.86,61.54h-3.293L28.505,15.089z">
</path>
</g>
<g>
<path d="M89.901,83.444H10v4.002l79.901-0.002c0.034,0,0.065-0.008,0.099-0.009v-3.982 C89.967,83.452,89.936,83.444,89.901,83.444z">
</path>
<path d="M89.901,71.757H10v4.006h79.901c0.034,0,0.065-0.008,0.099-0.009v-3.988 C89.967,71.765,89.936,71.757,89.901,71.757z">
</path>
</g>
<g>
<path d="M59.505,52.388h30.396c0.034,0,0.065-0.008,0.099-0.01v-3.982c-0.033-0.002-0.064-0.01-0.099-0.01H59.505 c-0.235,0-0.458,0.041-0.672,0.102v3.799C59.047,52.347,59.27,52.388,59.505,52.388z">
</path>
<path d="M59.505,64.073h30.396c0.034,0,0.065-0.008,0.099-0.009v-3.983c-0.033-0.002-0.064-0.01-0.099-0.01 l-30.396,0.002c-0.235,0-0.458,0.041-0.672,0.102v3.797C59.047,64.032,59.27,64.073,59.505,64.073z">
</path>
</g>
</svg>
<p>titles</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-typography.html" class="element-type">
<div class="element element-typography">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="62px" height="62px" viewBox="0 0 100 100" xml:space="preserve">
<g>
<rect x="37.195" y="76.181" fill="none" width="25.612" height="3.859">
</rect>
<path fill="none" d="M59.012,23.874c5.605,0,9.371,3.35,11.191,9.957l0.051,0.373c0.002,0.016,0.002,0.023,0,0.033l0.053,0.188 l1.189,4.975L71.1,19.958H28.901l-0.397,19.445l1.22-5.088c2.125-6.518,5.878-10.029,11.156-10.439l6.435-0.002v49.48h5.002 c0-15.418,0-49.48,0-49.48H59.012z">
</path>
<path d="M55.143,26.698h3.869c4.193,0,6.951,2.527,8.422,7.723c0.018,0.289,0.068,0.543,0.152,0.77l1.689,7.072h5.104 l-0.512-25.129H26.134l-0.512,25.129h5.104l1.702-7.127c1.762-5.363,4.598-8.127,8.562-8.438h3.502v46.656H34.37v9.512h31.261 v-9.512H55.143C55.143,61.229,55.143,26.698,55.143,26.698z M62.807,76.181v3.859H37.195v-3.859H62.807z M47.316,73.354v-49.48 l-6.435,0.002c-5.278,0.41-9.031,3.922-11.156,10.439l-1.22,5.088l0.397-19.445H71.1l0.396,19.441l-1.189-4.975l-0.053-0.188 c0.002-0.01,0.002-0.018,0-0.033l-0.051-0.373c-1.82-6.607-5.586-9.957-11.191-9.957h-6.693c0,0,0,34.063,0,49.48H47.316z">
</path>
</g>
</svg>
<p>typography</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-vendor.html" class="element-type">
<div class="element element-video">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="80px" height="80px" viewBox="0 0 80 80" xml:space="preserve" style="margin: -9px 0 -9px 0;">
<g>
<path d="M19.776,54.875h24.241V41.004H19.776V54.875z M29.226,52.804v-9.727h5.799v9.725h-5.799V52.804z M41.932,52.804h-4.823   v-9.727h4.823V52.804z M21.862,43.077h5.277v9.725h-5.277V43.077z">
</path>
<path d="M66.311,29.645c-0.163-0.35-0.34-0.738-0.541-1.18l-3.905-8.55l-0.087-0.154c-0.981-1.428-2.19-1.729-3.029-1.729   L19.384,18c-1.33,0-2.793,1.341-3.166,2.206l-3.779,8.273c-0.166,0.378-0.327,0.734-0.484,1.075   c-0.756,1.663-1.354,2.979-1.354,4.307l0.01,0.146c0.441,3.111,2.713,5.289,5.776,5.699v18.217c0,1.146,0.937,2.077,2.085,2.077   h42.553c1.147,0,2.086-0.931,2.086-2.077v-18.56c2.395-0.438,4.105-2.386,4.479-5.215l0.012-0.135   C67.601,32.436,67.114,31.384,66.311,29.645z M38.544,32.837c0,2.508-2.717,4.55-6.06,4.55c-2.923,0-5.298-1.875-5.499-4.232   l2.698-13.068l8.863,0.007v12.745L38.544,32.837L38.544,32.837z M40.627,20.092l8.403,0.007l2.708,13.033   c-0.161,2.365-2.411,4.255-5.181,4.255c-3.269,0-5.932-2.042-5.932-4.551L40.627,20.092L40.627,20.092z M12.688,33.793   c0.025-0.872,0.532-1.984,1.167-3.385c0.158-0.349,0.326-0.714,0.488-1.085l3.782-8.277c0.137-0.304,0.94-0.955,1.259-0.974   l8.17,0.008L24.92,32.833h-0.062c0,0.16-0.014,0.316-0.037,0.472l-0.025,0.12h0.001c-0.447,2.411-3.579,4.288-7.369,4.288   C14.874,37.716,13.063,36.215,12.688,33.793z M48.645,57.859V43.077h8.198v14.781L48.645,57.859L48.645,57.859z M58.926,57.923   V41.004H46.558v16.918H18.474V39.747c3.2-0.259,5.926-1.679,7.367-3.67c1.309,2.016,3.792,3.382,6.643,3.382   c3.041,0,5.694-1.364,7.092-3.381c1.378,2.017,3.987,3.381,6.982,3.381c2.767,0,5.179-1.397,6.416-3.451   c1.564,1.888,4.52,3.201,8.052,3.42v18.495H58.926z M62.067,37.386c-4.45,0-8.211-2.07-8.211-4.518h-0.042L51.159,20.1l7.584,0.007   c0.337,0,0.777,0.089,1.261,0.755l3.861,8.457c0.198,0.439,0.379,0.835,0.546,1.191c0.738,1.601,1.086,2.351,1.1,3.437   C65.205,36.102,63.919,37.386,62.067,37.386z">
</path>
</g>
</svg>
<p>Vendors</p>
</div>
</a>
</div>
<div class="col-xl-5col col-lg-3 col-md-4 col-sm-6 col-12">
<a href="element-video.html" class="element-type">
<div class="element element-typography">
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="60px" height="60px" viewBox="0 0 80 80" xml:space="preserve" style="margin: 1px 0 1px 0;">
<path fill="#666" stroke="#030303" stroke-width="0.25" stroke-miterlimit="10" d="M73.005,12.557H7.871  c-2.81,0-5.096,2.228-5.096,5.039v44.206c0,2.812,2.286,5.039,5.096,5.039h65.134c2.813,0,5.142-2.228,5.142-5.039V17.596  C78.146,14.784,75.817,12.557,73.005,12.557z M75.577,61.802c0,1.405-1.165,2.612-2.572,2.612H7.871  c-1.403,0-2.527-1.207-2.527-2.612V17.596c0-1.405,1.124-2.612,2.527-2.612h65.134c1.407,0,2.572,1.207,2.572,2.612V61.802z">
</path>
<path fill="#666" d="M75.591,52.65H4.938c-0.702,0-1.274-0.581-1.274-1.285s0.572-1.283,1.274-1.283h70.653  c0.703,0,1.274,0.579,1.274,1.283S76.294,52.65,75.591,52.65z">
</path>
<g>
<path fill="#666" d="M35.175,43.462c-0.231,0-0.462-0.06-0.669-0.181c-0.414-0.238-0.668-0.68-0.668-1.157l0.002-16.251   c0-0.478,0.255-0.919,0.668-1.158c0.414-0.237,0.923-0.238,1.336-0.002l14.136,8.124c0.416,0.238,0.672,0.681,0.672,1.16   c0,0.479-0.256,0.921-0.672,1.16l-14.138,8.127C35.636,43.402,35.405,43.462,35.175,43.462z M36.516,28.185l-0.003,11.628   l10.117-5.815L36.516,28.185z">
</path>
</g>
<path fill="#666" d="M17.663,60.051h0.782c0.646,0,1.172-0.524,1.172-1.174c0-0.646-0.525-1.172-1.172-1.172h-0.782  c-0.646,0-1.172,0.526-1.172,1.172C16.491,59.526,17.017,60.051,17.663,60.051z">
</path>
<path fill="#666" d="M9.847,60.051h0.781c0.647,0,1.174-0.524,1.174-1.174c0-0.646-0.526-1.172-1.174-1.172H9.847  c-0.648,0-1.174,0.526-1.174,1.172C8.673,59.526,9.198,60.051,9.847,60.051z">
</path>
<path fill="#666" d="M13.754,60.051h0.782c0.649,0,1.173-0.524,1.173-1.174c0-0.646-0.523-1.172-1.173-1.172h-0.782  c-0.646,0-1.172,0.526-1.172,1.172C12.582,59.526,13.107,60.051,13.754,60.051z">
</path>
<path fill="#666" d="M71.123,60.051h0.783c0.646,0,1.171-0.524,1.171-1.174c0-0.646-0.524-1.172-1.171-1.172h-0.783  c-0.646,0-1.171,0.526-1.171,1.172C69.952,59.526,70.477,60.051,71.123,60.051z">
</path>
<g>
<path fill="none" d="M30.907,60.163c0.491,0.795,1.363,1.331,2.365,1.331c1.001,0,1.874-0.536,2.365-1.331H30.907z">
</path>
<path fill="none" d="M33.272,55.921c-1.141,0-2.121,0.69-2.552,1.674h5.104C35.393,56.611,34.412,55.921,33.272,55.921z">
</path>
<path fill="#666" d="M28.855,57.595h-3.215c-0.703,0-1.275,0.579-1.275,1.283s0.572,1.285,1.275,1.285h3.32   c-0.155-0.46-0.26-0.943-0.26-1.456C28.701,58.321,28.765,57.952,28.855,57.595z">
</path>
<path fill="#666" d="M65.577,57.595H37.689c0.091,0.357,0.153,0.727,0.153,1.112c0,0.513-0.104,0.996-0.26,1.456h27.994   c0.703,0,1.274-0.581,1.274-1.285S66.28,57.595,65.577,57.595z">
</path>
<path fill="#666" d="M37.689,57.595c-0.5-1.981-2.282-3.458-4.417-3.458s-3.918,1.477-4.417,3.458   c-0.091,0.357-0.154,0.727-0.154,1.112c0,0.513,0.104,0.996,0.26,1.456c0.611,1.804,2.303,3.115,4.312,3.115   c2.008,0,3.699-1.312,4.311-3.115c0.156-0.46,0.26-0.943,0.26-1.456C37.843,58.321,37.78,57.952,37.689,57.595z M33.272,61.494   c-1.002,0-1.874-0.536-2.365-1.331c-0.263-0.426-0.422-0.921-0.422-1.456c0-0.396,0.085-0.771,0.235-1.112   c0.431-0.983,1.411-1.674,2.552-1.674c1.14,0,2.12,0.69,2.552,1.674c0.149,0.341,0.235,0.717,0.235,1.112   c0,0.535-0.16,1.03-0.422,1.456C35.146,60.958,34.273,61.494,33.272,61.494z">
</path>
</g>
</svg>
<p>Video</p>
</div>
</a>
</div>
</div>

</div>
</section>
</div>
</main>

<footer class="footer">
<div class="container">
<div class="footer-top">
<div class="row align-items-center">
<div class="col-lg-3">
<a href="demo1.html" class="logo-footer">
<img src="images/logo-footer.png" alt="logo-footer" width="154" height="43" />
</a>

</div>
<div class="col-lg-9">
<div class="widget widget-newsletter form-wrapper form-wrapper-inline">
<div class="newsletter-info mx-auto mr-lg-2 ml-lg-4">
<h4 class="widget-title">Subscribe to our Newsletter</h4>
<p>Get all the latest information, Sales and Offers.</p>
</div>
<form action="#" class="input-wrapper input-wrapper-inline">
<input type="email" class="form-control" name="email" id="email" placeholder="Email address here..." required />
<button class="btn btn-primary btn-rounded btn-md ml-2" type="submit">subscribe<i class="d-icon-arrow-right"></i></button>
</form>
</div>

</div>
</div>
</div>

<div class="footer-middle">
<div class="row">
<div class="col-lg-3 col-md-6">
<div class="widget widget-info">
<h4 class="widget-title">Contact Info</h4>
<ul class="widget-body">
<li>
<label>Phone:</label>
<a href="tel:#">Toll Free (123) 456-7890</a>
</li>
<li>
<label>Email:</label>
<a href="https://d-themes.com/cdn-cgi/l/email-protection#7f121e16133f0d16101b1a511c1012"><span class="__cf_email__" data-cfemail="dfb2beb6b39fadb6b0bbbaf1bcb0b2">[email&#160;protected]</span></a>
</li>
<li>
<label>Address:</label>
<a href="#">123 Street Name, City, England</a>
</li>
<li>
<label>WORKING DAYS / HOURS:</label>
</li>
<li>
<a href="#">Mon - Sun / 9:00 AM - 8:00 PM</a>
</li>
</ul>
</div>

</div>
<div class="col-lg-3 col-md-6">
<div class="widget ml-lg-4">
<h4 class="widget-title">My Account</h4>
<ul class="widget-body">
<li>
<a href="about-us.html">About Us</a>
</li>
<li>
<a href="#">Order History</a>
</li>
<li>
<a href="#">Returns</a>
</li>
<li>
<a href="#">Custom Service</a>
</li>
<li>
<a href="#">Terms &amp; Condition</a>
</li>
</ul>
</div>

</div>
<div class="col-lg-3 col-md-6">
<div class="widget ml-lg-4">
<h4 class="widget-title">Contact Info</h4>
<ul class="widget-body">
<li>
<a href="#">Sign in</a>
</li>
<li>
<a href="cart.html">View Cart</a>
</li>
<li>
<a href="wishlist.html">My Wishlist</a>
</li>
<li>
<a href="#">Track My Order</a>
</li>
<li>
<a href="#">Help</a>
</li>
</ul>
</div>

</div>
<div class="col-lg-3 col-md-6">
<div class="widget widget-instagram">
<h4 class="widget-title">Instagram</h4>
<figure class="widget-body row">
<div class="col-3">
<img src="images/instagram/01.jpg" alt="instagram 1" width="64" height="64" />
</div>
<div class="col-3">
<img src="images/instagram/02.jpg" alt="instagram 2" width="64" height="64" />
</div>
<div class="col-3">
<img src="images/instagram/03.jpg" alt="instagram 3" width="64" height="64" />
</div>
<div class="col-3">
<img src="images/instagram/04.jpg" alt="instagram 4" width="64" height="64" />
</div>
<div class="col-3">
<img src="images/instagram/05.jpg" alt="instagram 5" width="64" height="64" />
</div>
<div class="col-3">
<img src="images/instagram/06.jpg" alt="instagram 6" width="64" height="64" />
</div>
<div class="col-3">
<img src="images/instagram/07.jpg" alt="instagram 7" width="64" height="64" />
</div>
<div class="col-3">
<img src="images/instagram/08.jpg" alt="instagram 8" width="64" height="64" />
</div>
</figure>
</div>

</div>
</div>
</div>

<div class="footer-bottom">
<div class="footer-left">
<figure class="payment">
<img src="images/payment.png" alt="payment" width="159" height="29" />
</figure>
</div>
<div class="footer-center">
<p class="copyright">Riode eCommerce &copy; 2022. All Rights Reserved</p>
</div>
<div class="footer-right">
<div class="social-links">
<a href="#" class="social-link social-facebook fab fa-facebook-f"></a>
<a href="#" class="social-link social-twitter fab fa-twitter"></a>
<a href="#" class="social-link social-linkedin fab fa-linkedin-in"></a>
</div>
</div>
</div>

</div>
</footer>

</div>

<div class="sticky-footer sticky-content fix-bottom">
<a href="demo1.html" class="sticky-link">
<i class="d-icon-home"></i>
<span>Home</span>
</a>
<a href="shop.html" class="sticky-link">
<i class="d-icon-volume"></i>
<span>Categories</span>
</a>
<a href="wishlist.html" class="sticky-link">
<i class="d-icon-heart"></i>
<span>Wishlist</span>
</a>
<a href="account.html" class="sticky-link">
<i class="d-icon-user"></i>
<span>Account</span>
</a>
<div class="header-search hs-toggle dir-up">
<a href="#" class="search-toggle sticky-link">
<i class="d-icon-search"></i>
<span>Search</span>
</a>
<form action="#" class="input-wrapper">
<input type="text" class="form-control" name="search" autocomplete="off" placeholder="Search your keyword..." required />
<button class="btn btn-search" type="submit">
<i class="d-icon-search"></i>
</button>
</form>
</div>
</div>

<a id="scroll-top" href="#top" title="Top" role="button" class="scroll-top"><i class="d-icon-arrow-up"></i></a>

<div class="mobile-menu-wrapper">
<div class="mobile-menu-overlay">
</div>

<a class="mobile-menu-close" href="#"><i class="d-icon-times"></i></a>

<div class="mobile-menu-container scrollable">
<form action="#" class="input-wrapper">
<input type="text" class="form-control" name="search" autocomplete="off" placeholder="Search your keyword..." required />
<button class="btn btn-search" type="submit">
<i class="d-icon-search"></i>
</button>
</form>

<ul class="mobile-menu mmenu-anim">
<li>
<a href="demo1.html">Home</a>
</li>
<li>
<a href="shop.html">Categories</a>
<ul>
<li>
<a href="#">
Variations 1
</a>
<ul>
<li><a href="shop-classic-filter.html">Classic Filter</a></li>
<li><a href="shop-left-toggle-sidebar.html">Left Toggle Filter</a></li>
<li><a href="shop-right-toggle-sidebar.html">Right Toggle Sidebar</a></li>
<li><a href="shop-horizontal-filter.html">Horizontal Filter </a>
</li>
<li><a href="shop-navigation-filter.html">Navigation Filter</a></li>
<li><a href="shop-off-canvas-filter.html">Off-Canvas Filter </a></li>
<li><a href="shop-top-banner.html">Top Banner</a></li>
<li><a href="shop-inner-top-banner.html">Inner Top Banner</a></li>
<li><a href="shop-with-bottom-block.html">With Bottom Block</a></li>
<li><a href="shop-category-in-page-header.html">Category In Page Header</a>
</ul>
</li>
<li>
<a href="#">
Variations 2
</a>
<ul>
<li><a href="shop-grid-3cols.html">3 Columns Mode</a></li>
<li><a href="shop-grid-4cols.html">4 Columns Mode</a></li>
<li><a href="shop-grid-5cols.html">5 Columns Mode</a></li>
<li><a href="shop-grid-6cols.html">6 Columns Mode</a></li>
<li><a href="shop-grid-7cols.html">7 Columns Mode</a></li>
<li><a href="shop-grid-8cols.html">8 Columns Mode</a></li>
<li><a href="shop-list-mode.html">List Mode</a></li>
<li><a href="shop-pagination.html">Pagination</a></li>
<li><a href="shop-infinite-ajaxscroll.html">Infinite Ajaxscroll </a></li>
<li><a href="shop-loadmore-button.html">Loadmore Button</a></li>
</ul>
</li>
<li>
<a href="#">
Variations 3
</a>
<ul>
<li><a href="shop-category-grid-shop.html">Category Grid Shop</a></li>
<li><a href="shop-category%2bproducts.html">Category + Products</a></li>
<li><a href="shop-default-1.html">Shop Default 1 </a>
</li>
<li><a href="shop-default-2.html">Shop Default 2</a></li>
<li><a href="shop-default-3.html">Shop Default 3</a></li>
<li><a href="shop-default-4.html">Shop Default 4</a></li>
<li><a href="shop-default-5.html">Shop Default 5</a></li>
<li><a href="shop-default-6.html">Shop Default 6</a></li>
<li><a href="shop-default-7.html">Shop Default 7</a></li>
<li><a href="shop-default-8.html">Shop Default 8</a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="product.html">Products</a>
<ul>
<li>
<a href="#">Product Pages</a>
<ul>
<li><a href="product-simple.html">Simple Product</a></li>
<li><a href="product-featured.html">Featured &amp; On Sale</a></li>
<li><a href="product.html">Variable Product</a></li>
<li><a href="product-variable-swatch.html">Variation Swatch
Product</a></li>
<li><a href="product-grouped.html">Grouped Product </a></li>
<li><a href="product-external.html">External Product</a></li>
<li><a href="product-in-stock.html">In Stock Product</a></li>
<li><a href="product-out-stock.html">Out of Stock Product</a></li>
<li><a href="product-upsell.html">Upsell Products</a></li>
<li><a href="product-cross-sell.html">Cross Sell Products</a></li>
</ul>
</li>
<li>
<a href="#">Product Layouts</a>
<ul>
<li><a href="product-vertical.html">Vertical Thumb</a></li>
<li><a href="product-horizontal.html">Horizontal Thumb</a></li>
<li><a href="product-gallery.html">Gallery Type</a></li>
<li><a href="product-grid.html">Grid Images</a></li>
<li><a href="product-masonry.html">Masonry Images</a></li>
<li><a href="product-sticky.html">Sticky Info</a></li>
<li><a href="product-sticky-both.html">Left & Right Sticky</a></li>
<li><a href="product-left-sidebar.html">With Left Sidebar</a></li>
<li><a href="product-right-sidebar.html">With Right Sidebar</a></li>
<li><a href="product-full.html">Full Width Layout </a></li>
</ul>
</li>
<li>
<a href="#">Product Features</a>
<ul>
<li><a href="product-sale.html">Sale Countdown</a></li>
<li><a href="product-hurryup.html">Hurry Up Notification </a></li>
<li><a href="product-attribute-guide.html">Attribute Guide </a></li>
<li><a href="product-sticky-cart.html">Add Cart Sticky</a></li>
<li><a href="product-thumbnail-label.html">Labels on Thumbnail</a>
</li>
<li><a href="product-more-description.html">More Description
Tabs</a></li>
<li><a href="product-accordion-data.html">Data In Accordion</a></li>
<li><a href="product-tabinside.html">Data Inside</a></li>
<li><a href="product-video.html">Video Thumbnail </a>
</li>
<li><a href="product-360-degree.html">360 Degree Thumbnail </a></li>
</ul>
</li>
</ul>
</li>
<li>
<a href="#">Pages</a>
<ul>
<li><a href="about-us.html">About</a></li>
<li><a href="contact-us.html">Contact Us</a></li>
<li><a href="account.html">Login</a></li>
<li><a href="faq.html">FAQs</a></li>
<li><a href="error-404.html">Error 404</a>
<ul>
<li><a href="error-404.html">Error 404-1</a></li>
<li><a href="error-404-1.html">Error 404-2</a></li>
<li><a href="error-404-2.html">Error 404-3</a></li>
<li><a href="error-404-3.html">Error 404-4</a></li>
</ul>
</li>
<li><a href="coming-soon.html">Coming Soon</a></li>
</ul>
</li>
<li>
<a href="blog-classic.html">Blog</a>
<ul>
<li><a href="blog-classic.html">Classic</a></li>
<li><a href="blog-listing.html">Listing</a></li>
<li>
<a href="#">Grid</a>
<ul>
<li><a href="blog-grid-2col.html">Grid 2 columns</a></li>
<li><a href="blog-grid-3col.html">Grid 3 columns</a></li>
<li><a href="blog-grid-4col.html">Grid 4 columns</a></li>
<li><a href="blog-grid-sidebar.html">Grid sidebar</a></li>
</ul>
</li>
<li>
<a href="#">Masonry</a>
<ul>
<li><a href="blog-masonry-2col.html">Masonry 2 columns</a></li>
<li><a href="blog-masonry-3col.html">Masonry 3 columns</a></li>
<li><a href="blog-masonry-4col.html">Masonry 4 columns</a></li>
<li><a href="blog-masonry-sidebar.html">Masonry sidebar</a></li>
</ul>
</li>
<li>
<a href="#">Mask</a>
<ul>
<li><a href="blog-mask-grid.html">Blog mask grid</a></li>
<li><a href="blog-mask-masonry.html">Blog mask masonry</a></li>
</ul>
</li>
<li>
<a href="post-single.html">Single Post</a>
</li>
</ul>
</li>
<li>
<a href="element.html">Elements</a>
<ul>
<li>
<a href="#">Elements 1</a>
<ul>
<li><a href="element-accordions.html">Accordions</a></li>
<li><a href="element-alerts.html">Alert &amp; Notification</a></li>
<li><a href="element-banner-effect.html">Banner Effect
</a></li>
<li><a href="element-banner.html">Banner
</a></li>
<li><a href="element-blog-posts.html">Blog Posts</a></li>
<li><a href="element-breadcrumb.html">Breadcrumb
</a></li>
<li><a href="element-buttons.html">Buttons</a></li>
<li><a href="element-cta.html">Call to Action</a></li>
<li><a href="element-countdown.html">Countdown
</a></li>
</ul>
</li>
<li>
<a href="#">Elements 2</a>
<ul>
<li><a href="element-counter.html">Counter </a></li>
<li><a href="element-creative-grid.html">Creative Grid
</a></li>
<li><a href="element-animation.html">Entrance Effect
</a></li>
<li><a href="element-floating.html">Floating
</a></li>
<li><a href="element-hotspot.html">Hotspot
</a></li>
<li><a href="element-icon-boxes.html">Icon Boxes</a></li>
<li><a href="element-icons.html">Icons</a></li>
<li><a href="element-image-box.html">Image box
</a></li>
<li><a href="element-instagrams.html">Instagrams</a></li>
</ul>
</li>
<li>
<a href="#">Elements 3</a>
<ul>
<li><a href="element-categories.html">Product Category</a></li>
<li><a href="element-products.html">Products</a></li>
<li><a href="element-product-banner.html">Products + Banner
</a></li>
<li><a href="element-product-grid.html">Products + Grid
</a></li>
<li><a href="element-product-single.html">Product Single
</a>
</li>
<li><a href="element-product-tab.html">Products + Tab
</a></li>
<li><a href="element-single-product.html">Single Product
</a></li>
<li><a href="element-slider.html">Slider
</a></li>
<li><a href="element-social-link.html">Social Icons </a></li>
</ul>
</li>
<li>
<a href="#">Elements 4</a>
<ul>
<li><a href="element-subcategory.html">Subcategory
</a></li>
<li><a href="element-svg-floating.html">Svg Floating
</a></li>
<li><a href="element-tabs.html">Tabs</a></li>
<li><a href="element-testimonials.html">Testimonials
</a></li>
<li><a href="element-titles.html">Title</a></li>
<li><a href="element-typography.html">Typography</a></li>
<li><a href="element-vendor.html">Vendor
</a></li>
<li><a href="element-video.html">Video
</a></li>
</ul>
</li>
</ul>
</li>
<li><a href="https://d-themes.com/buynow/riode.html">Buy Riode!</a></li>
</ul>

</div>
</div>

<div class="code-popup mfp-hide" id="code-popup">
<div class="code-console">
<div class="code-copy">HTML CODE
<i class="copy-icon far fa-copy">
<span class="tooltiptext tooltip-bottom">Copy to Clipboard</span>
</i>
</div>
<textarea autocomplete="off" id="textareaCode" spellcheck="false" class="code-text" readonly>
            </textarea>
</div>
</div>

<div class="sticky-icons-wrapper">
<div class="sticky-icon-links">
<ul>
<li><a href="#" class="demo-toggle"><i class="fas fa-home"></i><span>Demos</span></a></li>
<li><a href="documentation.html"><i class="fas fa-info-circle"></i><span>Documentation</span></a>
</li>
<li><a href="https://themeforest.net/downloads/"><i class="fas fa-star"></i><span>Reviews</span></a>
</li>
<li><a href="https://d-themes.com/buynow/riodehtml"><i class="fas fa-shopping-cart"></i><span>Buy
now!</span></a></li>
</ul>
</div>
<div class="demos-list">
<div class="demos-overlay"></div>
<a class="demos-close" href="#"><i class="close-icon"></i></a>
<div class="demos-content scrollable scrollable-light">
<h3 class="demos-title">Demos</h3>
<div class="demos">
</div>
</div>
</div>
</div>

<script data-cfasync="false" src="../../cdn-cgi/scripts/5c5dd728/cloudflare-static/email-decode.min.js"></script><script src="vendor/jquery/jquery.min.js"></script>
<script src="vendor/parallax/parallax.min.js"></script>
<script src="vendor/owl-carousel/owl.carousel.min.js"></script>
<script src="vendor/codemirror/codemirror.min.js"></script>
<script src="vendor/popup-code/popcode.min.js"></script>
<script src="vendor/magnific-popup/jquery.magnific-popup.min.js"></script>

<script src="js/main.min.js"></script>
</body>

<!-- Mirrored from d-themes.com/html/riode/element-banner.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 19 Aug 2023 09:33:44 GMT -->
</html>

Zerion Mini Shell 1.0