Fractal Starter
Project version : 0.1.2
<div class="site page-subsection theme-mariage">
    <header class="main-header header--white">
        <div class="container">
            <div class="header__brand">
                <a href="/">
               <img src="../../images/brand/brand-black.svg" alt="" class="XXL Organisation brand" />
            </a>
            </div>

            <div class="header__nav js-nav-inside">
                <!--
             * The primary subnav can have two different states:
             *
             * 1) By default, the subnav appear on hover from the trigger link.
             *
             * 2) With the 'js-dropdown--onclick' on the ul.primary-nav,
             *		the subnav appear on click from the trigger link.
             *
            -->

                <nav class="main-nav">
                    <ul class="nav-primary" data-ui-component="primary-main">
                        <li>
                            <a href="#">Home</a>
                        </li>
                        <li>
                            <a href="https://google.com" class="js-dropdown-link">About</a>

                            <ul class="nav-primary__sub-nav js-dropdown-menu">
                                <li><a href="#">Products</a></li>
                                <li><a href="#">Company</a></li>
                            </ul>
                        </li>
                        <li>
                            <a href="#">Contact</a>
                        </li>
                        <li>
                            <a href="#" class="js-dropdown-link">Services</a>

                            <ul class="nav-primary__sub-nav js-dropdown-menu">
                                <li><a href="#">Web</a></li>
                                <li><a href="#">Data</a></li>
                            </ul>
                        </li>
                    </ul>
                </nav>
            </div>

            <div class="header__search header__tools">
                <button class="button button--search js-open-search">
               <i class="icon icon--search"></i>
               <span>Rechercher</span>
            </button>
            </div>

            <div class="header__devis header__tools">
                <a href="#" class="button button--devis">
               <i class="icon icon--devis"></i>
               <span>Finaliser mon devis</span>
            </a>

                <div class="block-cart" id="cartSummary">
                    <ul class="lst__unstyled">
                        <li></li>
                        <li></li>
                        <li></li>

                        <span>et 7 autres produits...</span>
                    </ul>

                    <a href="#" class="button  button--rounded button--black button--full-width">Finaliser mon devis</a>

                </div>
            </div>

            <div class="header__button">
                <button class="button button--menu js-toggle-menu">
               <svg width="15" height="12" xmlns="http://www.w3.org/2000/svg" id="menu-icon">
                  <defs>
                     <linearGradient x1=".615%" y1="50%" y2="50%" id="a">
                        <stop stop-color="#E3CB78" offset="0%"/>
                        <stop stop-color="#BDA450" offset="49.584%"/>
                        <stop stop-color="#A07C2A" offset="100%"/>
                     </linearGradient>
                  </defs>
                  
                  <g fill="url(#a)" fill-rule="evenodd">
                     <rect id="bars-1" width="15" height="2" rx="1"/>
                     <rect id="bars-2" y="5" width="15" height="2" rx="1"/>
                     <rect id="bars-3" y="10" width="15" height="2" rx="1"/>
                  </g>
               </svg>
               <span>Menu</span>
            </button>
            </div>
        </div>
    </header>
    <div class="hero hero--innerpage">
        <div class="container">
            <div class="hero--innerpage__content">
                <h1>Structure</h1>
                <nav class="breadcrumb">
                    <ol>
                        <li class="item-first">
                            <a href="/" title="Accueil">
                        Accueil
                     </a>
                        </li>

                        <li class="item-last">
                            <span>Current page</span>
                        </li>
                    </ol>
                </nav>
            </div>
            <div class="hero--innerpage__thumbnail">
                <div class="outer--box">
                    <img src='https://source.unsplash.com/featured/?structure' />
                </div>
            </div>
        </div>
    </div>
    <main id="main">

        <section class="about-section">
            <div class="container container--quicklink-left container--spaced">
                <div class="section-card-product">
                    <div class="wrapper wrapper--three wrapper--no-row-gap">
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                        <article class="card-product">

                            <a href="#">
                                <div class="card-product__thumb">
                                    <img src="https://source.unsplash.com/featured/?light" alt="" />
                                </div>

                                <div class="card-product__content">
                                    <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                    <span class="card-product__content-price theme-color">
                                 35€
                              </span>
                                </div>

                                <div class="card-product__buttons">
                                    <span class="button button--gray">Voir</span>
                                    <object>
                                 <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                              </object>
                                </div>
                            </a>
                        </article>
                    </div>

                    <nav class="nav-pagination" aria-label="pagination">
                        <ul>
                            <li class="lnk-prev arrow-pagination">
                                <a href="#">
                       		   <span>Page précédente</span>
                              <i class="icon icon--chevron-left"></i>
               			   </a>
                            </li>

                            <li>
                                <a class="" data-page="1" href="#">
               				<span class="screen-reader-text">page </span> 1
               			</a>
                            </li>

                            <li class="active">
                                <span class="" data-page="2" aria-current="page">
               				<span class="screen-reader-text">page </span>2
                                </span>
                            </li>

                            <li>
                                <a class="" data-page="3" href="#">
               				<span class="screen-reader-text">page </span> 3
               			</a>
                            </li>

                            <li class="lnk-next arrow-pagination">
                                <a href="#">
                              <span>Page suivante</span>
                              <i class="icon icon--chevron-right"></i>
                           </a>
                            </li>
                        </ul>
                    </nav>
                </div>

                <aside class="block-quicklink">
                    <h4>Accès rapide</h4>

                    <nav class="nav-quicklink">
                        <ul>
                            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children">
                                <a href="#">
                           <span>Link</span>
                           <i class="icon icon--chevron-down"></i>
                        </a>

                                <ul aria-hidden="true">
                                    <li><a href="#">Sublink</a></li>
                                    <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-submenu">
                                        <a href="#">
                                 Sublink
                                 <i class="icon icon--chevron-down"></i>
                              </a>
                                        <ul aria-hidden="true">
                                            <li><a href="#">Sublink</a></li>
                                            <li><a href="#">Sublink</a></li>
                                            <li><a href="#">Sublink</a></li>
                                            <li><a href="#">Sublink</a></li>
                                            <li><a href="#">Sublink</a></li>
                                        </ul>
                                    </li>
                                    <li><a href="#">Sublink</a></li>
                                    <li><a href="#">Sublink</a></li>
                                    <li><a href="#">Sublink</a></li>
                                </ul>
                            </li>

                            <li class="menu-item menu-item-type-post_type menu-item-object-page">
                                <a href="#">
                           <span>Link</span>
                        </a>
                            </li>

                            <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children">
                                <a href="#">
                           <span>Link</span>
                           <i class="icon icon--chevron-down"></i>
                        </a>

                                <ul aria-hidden="true">
                                    <li><a href="#">Sublink</a></li>
                                    <li><a href="#">Sublink</a></li>
                                    <li><a href="#">Sublink</a></li>
                                    <li><a href="#">Sublink</a></li>
                                    <li><a href="#">Sublink</a></li>
                                </ul>
                            </li>

                        </ul>
                    </nav>
                </aside>
            </div>
        </section>
    </main>

    <section class="section-card-section">
        <div class="container">

            <div class="wrapper wrapper--four">
                <article class="card-subsection">
                    <a href="#" class="outer-box">
                        <div class="inner-box">
                            <img src="https://source.unsplash.com/random" alt="" />
                            <h3 class="h4">Sonorisation</h3>
                        </div>
                    </a>
                </article>
                <article class="card-subsection">
                    <a href="#" class="outer-box">
                        <div class="inner-box">
                            <img src="https://source.unsplash.com/random" alt="" />
                            <h3 class="h4">Sonorisation</h3>
                        </div>
                    </a>
                </article>
                <article class="card-subsection">
                    <a href="#" class="outer-box">
                        <div class="inner-box">
                            <img src="https://source.unsplash.com/random" alt="" />
                            <h3 class="h4">Sonorisation</h3>
                        </div>
                    </a>
                </article>
                <article class="card-subsection">
                    <a href="#" class="outer-box">
                        <div class="inner-box">
                            <img src="https://source.unsplash.com/random" alt="" />
                            <h3 class="h4">Sonorisation</h3>
                        </div>
                    </a>
                </article>
            </div>
        </div>
    </section>
    <div class="container">
        <div class="block-cta">
            <h2>Besoin d&#x27;une offre sur mesure ?</h2>

            <a href="#" class="button button--white button--rounded">Demander un devis</a>
        </div>
    </div>

    <section class="section-last-news">
        <div class="container container--sidebar-right container--spaced">
            <div class="last-news">
            </div>

            <div class="follow-components">
                <div class="icons-social">
                    <h3>Suivez-nous</h3>
                    <div class="icons-social__list">
                        <div class="icon-social icon-social--facebook">
                            <a href="#" title="Facebook" target="_blank" class="outer-box">
                                <div class="inner-box"></div>
                            </a>
                        </div>
                        <div class="icon-social icon-social--youtube">
                            <a href="#" title="Youtube" target="_blank" class="outer-box">
                                <div class="inner-box"></div>
                            </a>
                        </div>
                        <div class="icon-social icon-social--twitter">
                            <a href="#" title="Twitter" target="_blank" class="outer-box">
                                <div class="inner-box"></div>
                            </a>
                        </div>
                        <div class="icon-social icon-social--instagram">
                            <a href="#" title="Instagram" target="_blank" class="outer-box">
                                <div class="inner-box"></div>
                            </a>
                        </div>
                        <div class="icon-social icon-social--linkedin">
                            <a href="#" title="LinkedIn" target="_blank" class="outer-box">
                                <div class="inner-box"></div>
                            </a>
                        </div>
                        <div class="icon-social icon-social--vimeo">
                            <a href="#" title="Vimeo" target="_blank" class="outer-box">
                                <div class="inner-box"></div>
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>
    <div class="block-search" id="modal-block-search">
        <button class="block-search__close button js-close-search">
         <i class="icon icon--close"></i>
         <span>Annuler ma recherche</span>
      </button>

        <form class="block-search__form container container-l form-search" action="#" method="POST">
            <label>Rechercher parmi nos 2000 produits</label>
            <span class="input-container">
            <input type="search" />
            <button type="submit"><i class="icon icon--search icon--search-black"></i></button>
         </span>
        </form>

        <div class="block-search__result">

            <div class="container cards-result">
                <p class="result-number">127 produits répondent à votre recherche</p>

                <div class="cards-result__listing">
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                    <article class="card-product">

                        <a href="#">
                            <div class="card-product__thumb">
                                <img src="https://source.unsplash.com/featured/?light" alt="" />
                            </div>

                            <div class="card-product__content">
                                <h3 class="h5">Moduled Barre LED RVB Ayrton 250</h3>
                                <span class="card-product__content-price theme-color">
                              35€
                           </span>
                            </div>

                            <div class="card-product__buttons">
                                <span class="button button--gray">Voir</span>
                                <object>
                              <button class="button button--blue js-add-to-cart theme-button">Ajouter au devis</button>
                           </object>
                            </div>
                        </a>
                    </article>
                </div>
            </div>

        </div>
    </div>
    <footer>
        <div class="container">
            <div class="subfooter container container-m">
                <nav class="nav__footer">
                    <h6>Location</h6>
                    <button class="js-nav-toogle">Location</button>

                    <ul>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                    </ul>
                </nav>
                <nav class="nav__footer">
                    <h6>Mariages</h6>
                    <button class="js-nav-toogle">Mariages</button>

                    <ul>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                    </ul>
                </nav>
                <nav class="nav__footer">
                    <h6>Événements</h6>
                    <button class="js-nav-toogle">Événements</button>

                    <ul>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                    </ul>
                </nav>
                <nav class="nav__footer">
                    <h6>XXL Organisation</h6>
                    <button class="js-nav-toogle">XXL Organisation</button>

                    <ul>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                        <li><a href="">Lien</a></li>
                    </ul>
                </nav>
            </div>

            <div class="footer">
                <div class="logo">
                    <img src="/images/logo-label.png" alt="Logo Label des prestataires de service du spectacle vivant" />
                </div>

                <div class="copyright">
                    &copy XXL Organisation 2019

                    <ul class="lst__unstyled lst__inline">
                        <li><a href="#">Mentions légales</a></li>
                        <li><a href="#">Politique de confidentialité</a></li>
                    </ul>
                </div>

                <div class="animated-icons">
                    Réalisé avec
                    <div class="icons js-animate-icons">
                        <div class="icons-container">
                            <svg aria-hidden="true" data-prefix="fas" data-icon="cheeseburger" class="svg-inline--fa fa-cheeseburger fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M464 256h-48l-96 64-96-64H48a48 48 0 0 0 0 96h416a48 48 0 0 0 0-96zM58.6 224h394.7c34.6 0 54.6-43.9 34.8-75.9C448 83.2 359.5 32.1 256 32c-103.5.1-192 51.2-232.2 116.1-19.8 32 .3 75.9 34.8 75.9zM384 112a16 16 0 1 1-16 16 16 16 0 0 1 16-16zM256 80a16 16 0 1 1-16 16 16 16 0 0 1 16-16zm-128 32a16 16 0 1 1-16 16 16 16 0 0 1 16-16zm352 272H32a16 16 0 0 0-16 16v16a64.06 64.06 0 0 0 64 64h352a64.06 64.06 0 0 0 64-64v-16a16 16 0 0 0-16-16z"/></svg>
                            <svg aria-hidden="true" data-prefix="fas" data-icon="french-fries" class="svg-inline--fa fa-french-fries fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M432 224h-34c-6.92 0-13.7 4.27-15.19 11-8.6 39-62.09 69-126.79 69s-118.19-30-126.79-69c-1.49-6.76-8.27-11-15.19-11H80a16 16 0 0 0-15.62 19.47l54.1 243.47A32 32 0 0 0 149.73 512h212.54a32 32 0 0 0 31.24-25.06l54.1-243.47A16 16 0 0 0 432 224zm-80.45 4.14c.4-1.78 1.46-3.22 2.06-4.91l30.14-172.46a16 16 0 0 0-20.34-18.08l-34.28 10.25c-4.24 1.27-7.17 4.51-9.13 8.33v207.27c17.55-8.38 29.15-19.54 31.54-30.4zm79.9-36.14l16.3-93.23a16 16 0 0 0-20.34-18.08l-17.31 5.17-18.75 107.26c2.24-.32 4.33-1.12 6.63-1.12zM288 268.78V32a16 16 0 0 0-8.84-14.31l-32-16A16 16 0 0 0 224 16v252.78a160.62 160.62 0 0 0 64 0zM114 192c3.6 0 7 1 10.35 1.75l-20-107.16-19.74-5.9a16 16 0 0 0-20.36 18.08L80.55 192zm78 66.54V33.17l-3.76-20.1a16 16 0 0 0-25.39-9.81l-28.51 21.62a16 16 0 0 0-6.07 15.69l36.9 197.22c5.3 7.58 14.49 14.86 26.83 20.75z"/></svg>
                            <svg aria-hidden="true" data-prefix="fas" data-icon="beer" class="svg-inline--fa fa-beer fa-w-14" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 448 512"><path fill="currentColor" d="M368 96h-48V56c0-13.255-10.745-24-24-24H24C10.745 32 0 42.745 0 56v400c0 13.255 10.745 24 24 24h272c13.255 0 24-10.745 24-24v-42.11l80.606-35.977C429.396 365.063 448 336.388 448 304.86V176c0-44.112-35.888-80-80-80zm16 208.86a16.018 16.018 0 0 1-9.479 14.611L320 343.805V160h48c8.822 0 16 7.178 16 16v128.86zM208 384c-8.836 0-16-7.164-16-16V144c0-8.836 7.164-16 16-16s16 7.164 16 16v224c0 8.836-7.164 16-16 16zm-96 0c-8.836 0-16-7.164-16-16V144c0-8.836 7.164-16 16-16s16 7.164 16 16v224c0 8.836-7.164 16-16 16z"/></svg>
                            <svg aria-hidden="true" data-prefix="fas" data-icon="heart" class="svg-inline--fa fa-heart fa-w-16" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path fill="currentColor" d="M462.3 62.6C407.5 15.9 326 24.3 275.7 76.2L256 96.5l-19.7-20.3C186.1 24.3 104.5 15.9 49.7 62.6c-62.8 53.6-66.1 149.8-9.9 207.9l193.5 199.8c12.5 12.9 32.8 12.9 45.3 0l193.5-199.8c56.3-58.1 53-154.3-9.8-207.9z"/></svg>
                        </div>
                    </div>
                    par
                    <a rel="noopener" href="http://www.mediakod.com" title="Mediakod" class="mycopy" target="_blank">
                  <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" width="30" height="30" viewBox="0 0 595.2 524.2"><path d="M528 409.5v-45.3V162.5c0 0-0.5-5.4-2.9-12.6 -1.8-6.7-5-12.8-9.4-18 -4.3-5.6-10.2-10.5-18-13.5 -5.8-2.5-12.2-3.9-19-3.9h-92.3c0.8 0-79 92-84.6 98.3L209.5 115h-0.3c-0.3-0.3-0.5-0.5-0.5-0.5 -47.6 0-82.3 0-82.3 0 -26.5 0-48 21.5-48 48v201.7 4.7c0 26.5 21.5 48 48 48h401.6M320.4 274.8l75-93.5h68.2l-81.8 92.4 83.8 90.5h-69L320.4 274.8z"></path></svg>
               </a>
                </div>
            </div>
        </div>
    </footer>
</div>
<div class="site page-subsection {{page_theme}}">
   {{> @header header_white=true }}

   {{> @hero-innerpage }}

   <main id="main">
      
      <section class="about-section">
         <div class="container container--quicklink-left container--spaced">
            <div class="section-card-product">
               <div class="wrapper wrapper--three wrapper--no-row-gap">
                  {{#each cards_product}}
                     {{> @card-product card_product=this }}
                  {{/each}}
               </div>

               {{> @nav-pagination }}
            </div>

            {{> @nav-quicklink }}
         </div>
      </section>
   </main>
   
   {{> @section-card-subsection }}
   
   <div class="container">
      {{> @block-cta }}
   </div>

   {{> @section-recent-news only_follow=true }}
   
   {{> @footer }}
</div>
{
  "page_theme": "theme-mariage",
  "hero": {
    "title": "Structure",
    "thumbnail": "<img src='https://source.unsplash.com/featured/?structure' />"
  },
  "cards_product": [
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    },
    {
      "title": "Moduled Barre LED RVB Ayrton 250",
      "thumb": "<img src=\"https://source.unsplash.com/featured/?light\" alt=\"\" />",
      "price": "35€"
    }
  ],
  "block_cta": {
    "title": "Besoin d'une offre sur mesure ?",
    "button": {
      "title": "Demander un devis",
      "link": "#"
    }
  },
  "section_card_page": {
    "items": [
      {
        "title": "Location",
        "content": "<p>Son, structure, vidéo, lumière, distribution, mobilier</p>",
        "link": "#",
        "thumbnail": "<img src=\"https://source.unsplash.com/random\" alt=\"\" />"
      }
    ]
  },
  "section_card_section": {
    "items": [
      {
        "title": "Sonorisation",
        "thumbnail": "<img src=\"https://source.unsplash.com/random\" alt=\"\" />"
      },
      {
        "title": "Sonorisation",
        "thumbnail": "<img src=\"https://source.unsplash.com/random\" alt=\"\" />"
      },
      {
        "title": "Sonorisation",
        "thumbnail": "<img src=\"https://source.unsplash.com/random\" alt=\"\" />"
      },
      {
        "title": "Sonorisation",
        "thumbnail": "<img src=\"https://source.unsplash.com/random\" alt=\"\" />"
      }
    ]
  },
  "block_socials": {
    "title": "Suivez-nous",
    "icons": [
      {
        "title": "Facebook",
        "class": "facebook",
        "link": "#"
      },
      {
        "title": "Youtube",
        "class": "youtube",
        "link": "#"
      },
      {
        "title": "Twitter",
        "class": "twitter",
        "link": "#"
      },
      {
        "title": "Instagram",
        "class": "instagram",
        "link": "#"
      }
    ]
  },
  "site": {
    "title": "XXL Organisation",
    "current_year": 2019,
    "social": {
      "title": "Suivez-nous",
      "icons": [
        {
          "title": "Facebook",
          "class": "facebook",
          "link": "#"
        },
        {
          "title": "Youtube",
          "class": "youtube",
          "link": "#"
        },
        {
          "title": "Twitter",
          "class": "twitter",
          "link": "#"
        },
        {
          "title": "Instagram",
          "class": "instagram",
          "link": "#"
        },
        {
          "title": "LinkedIn",
          "class": "linkedin",
          "link": "#"
        },
        {
          "title": "Vimeo",
          "class": "vimeo",
          "link": "#"
        }
      ]
    }
  },
  "footer_menu": {
    "menu_location": {
      "title": "Location",
      "items": [
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        }
      ]
    },
    "menu_events": {
      "title": "Événements",
      "items": [
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        }
      ]
    },
    "menu_mariage": {
      "title": "Mariages",
      "items": [
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        }
      ]
    },
    "menu_about": {
      "title": "XXL Organisation",
      "items": [
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        },
        {
          "title": "Lien",
          "link": "#"
        }
      ]
    },
    "menu_footer": {
      "items": [
        {
          "title": "Mentions légales",
          "link": "#"
        },
        {
          "title": "Politique de confidentialité",
          "link": "#"
        }
      ]
    }
  }
}

There are no notes for this item.