<? require('../admin/conf.inc.php');
require('includes/fonctions.php') ?>
<!DOCTYPE html>
<html>
<head>
	<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta name="format-detection" content="telephone=no" />
    <meta name="apple-mobile-web-app-capable" content="yes" />
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=no, minimal-ui"/>
    <link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
    <link href="css/idangerous.swiper.css" rel="stylesheet" type="text/css" />
    <link href="css/font-awesome.min.css" rel="stylesheet" type="text/css" />
    <link href='https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700%7CDancing+Script%7CMontserrat:400,700%7CMerriweather:400,300italic%7CLato:400,700,900' rel='stylesheet' type='text/css' />
    <link href='https://fonts.googleapis.com/css?family=Cantata+One' rel='stylesheet' type='text/css' />
    <link href="css/style.css" rel="stylesheet" type="text/css" />
    <!--[if IE 9]>
        <link href="css/ie9.css" rel="stylesheet" type="text/css" />
    <![endif]-->
    <link rel="shortcut icon" href="img/favicon-10.ico" />
  	<title>Expoz</title>
</head>
<body class="style-16">

    <!-- LOADER -->
    <div id="loader-wrapper">
        <div class="bubbles">
            <div class="title">Chargement</div>
            <span></span>
            <span id="bubble2"></span>
            <span id="bubble3"></span>
        </div>
    </div>

    <div id="content-block">

        <div class="content-center fixed-header-margin">
            <!-- HEADER -->
            <div class="header-wrapper style-16">
                <header class="type-4">
                    <div class="header-top">
                        <div class="header-top-entry">
                            <div class="title"><i class="fa fa-phone"></i>Une question ? <a href="tel:+33491586045"><b>04 91 58 60 45</b></a></div>
                        </div>
                        <div class="menu-button responsive-menu-toggle-class"><i class="fa fa-reorder"></i> Menu</div>
                        <div class="clear"></div>
                    </div>
                   
                    <div class="header-middle">
                        <div class="logo-wrapper">
                            <a id="logo" href="#"><img src="img/logo-16.png" alt="" /></a>
                        </div>
                        

                        <div class="middle-entry">
                            
                                
                            
                            <a href="#" class="icon-entry">
                                <span class="image">
                                    <i class="fa fa-eur"></i>
                                </span>
                                <span class="text">
                                    <b>Devis gratuit</b> <br> sous 24h
                                </span>
                            </a>
                            <a href="#" class="icon-entry">
                                <span class="image">
                                    <i class="fa fa-comments-o"></i>
                                </span>
                                <span class="text">
                                    <b>Support</b> <br> lun-ven 9h-17h
                                </span>
                            </a>
                        </div>

                        <div class="right-entries">
                            <a class="header-functionality-entry open-search-popup" href="#"><i class="fa fa-search"></i><span>Search</span></a>
                            <a class="header-functionality-entry open-cart-popup" href="#"><i class="fa fa-shopping-cart"></i><span>Ma sélection</span> <b>2 articles</b></a>
                        </div>

                    </div>

                    <div class="close-header-layer"></div>
                    <div class="navigation">
                        <div class="navigation-header responsive-menu-toggle-class">
                            <div class="title">Menu</div>
                            <div class="close-menu"></div>
                        </div>
                        <div class="header-simple-search hidden-xs hidden-sm hidden-md">
                            <div class="row">
                                <div class="col-md-3 col-md-push-9">
                                    <div class="simple-search-form">
                                        <form>
                                            <input type="text" placeholder="Rechercher dans le catalogue">
                                            <div class="simple-submit">
                                                <i class="fa fa-search"></i>
                                                <input type="submit">
                                            </div>
                                        </form>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="nav-overflow">
                            <? include("includes/nav.php") ?>
                        </div>
                        
                    </div>
                </header>
                <div class="clear"></div>
            </div>

            <div class="content-push">

                <div class="information-blocks">
                    <div class="row">
                        
                        <div class="col-md-3 col-md-push-9">
                            <div class="sidebar-navigation">
                                <div class="title">Catalogue<i class="fa fa-angle-down"></i></div>
                                <div class="list">
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Oriflamme</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Tente pliable</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Tente Expodôme</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Gonflable</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Drapeaux et Pavillons</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Signalétique & PLV</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Mobilier & Décoration</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Matériels pour exposition</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Banderoles</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Roll-Up & Pop-Up</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Abris & Tentes de réception</span></a>
                                    <a class="entry" href="#"><span><i class="fa fa-angle-right"></i>Grands mâts</span></a>
                                </div>
                            </div>
                        </div>

                        <div class="col-md-9 col-md-pull-3">

                            <div class="navigation-banner-swiper">
                                <div class="swiper-container" data-autoplay="5000" data-loop="1" data-speed="500" data-center="0" data-slides-per-view="1">
                                    <div class="swiper-wrapper">
                                        <div class="swiper-slide active" data-val="0"> 
                                            <div class="navigation-banner-wrapper align-1" style="background-image: url(img/slider/slider-1.jpg);">
                                                <div class="navigation-banner-content">
                                                    <div class="cell-view">
                                                        <h2 class="subtitle">Chez nous, la première impression est la</h2>
                                                        <h1 class="title">bonne !</h1>
                                                        <div class="description">Tous nos produits sont personnalisables.</div>
                                                        <div class="info">
                                                            <a class="button style-1" href="#">Découvrir</a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="clear"></div>
                                            </div>
                                        </div>
                                        <div class="swiper-slide" data-val="1"> 
                                            <div class="navigation-banner-wrapper align-1" style="background-image: url(img/slider/slider-2.jpg);">
                                                <div class="navigation-banner-content">
                                                    <div class="cell-view">
                                                        <h2 class="subtitle">Une question ?</h2>
                                                        <h1 class="title">Un conseil ?</h1>
                                                        <div class="description">Expoz vous accompagne et vous conseille sur le choix de vos outils de communication.</div>
                                                        <div class="info">
                                                            <a class="button style-1" href="#">En savoir plus</a>
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="clear"></div>
                                            </div>
                                        </div>
                                        <div class="swiper-slide" data-val="2"> 
                                            <div class="navigation-banner-wrapper align-2" style="background-image: url(img/slider/slider-3.jpg);">
                                                <div class="navigation-banner-content">
                                                    <div class="cell-view">
                                                        <h2 class="subtitle">&Agrave; la bonne heure !</h2>
                                                        <h1 class="title">24h</h1>
                                                        <div class="description">Recevez votre devis personnalisé sous 24h.</div>
                                                        <div class="info">
                                                            
                                                        </div>
                                                    </div>
                                                </div>
                                                <div class="clear"></div>
                                            </div>
                                        </div>
                                    </div>
                                    <div class="clear"></div>
                                    <div class="pagination"></div>
                                </div>
                            </div>

                        </div>

                    </div>
                </div>

                


                <div class="information-blocks" id="homeProducts">
                	
                    	
                        	<div class="swiper-tabs tabs-switch">
                            	<a class="block-title tab-switcher active">Nos produits</a>
                            	<div class="clear"></div>
                        	</div>
                        
                        <div class="row">
                    	<? $query_familles = mysqli_query($connexion, "SELECT 2014_articles.famille, 2014_familles.UrlRewrite, 2014_familles.desc1,image FROM 2014_articles INNER JOIN 2014_familles ON 2014_articles.famille = 2014_familles.famille GROUP BY 2014_articles.famille ORDER BY 2014_familles.ordre");
						while($famille = mysqli_fetch_assoc($query_familles)) { ?>
                        <div class="col-xs-6 col-sm-4 col-md-3 portfolio-container type-2">
                            <div class="portfolio-entry">
                                <h1 class="subTitle"><a href="#"><?= utf8_encode($famille['famille']) ?></a></h1>
                                <div class="image">
                                    <img src="<? if($famille['image'] != "") image("familles",$famille["image"],"192"); else echo "images/no-image.jpg";  ?>" alt="">
                                    <div class="hover-layer">
                                        <div class="info">
                                            <!--<div class="title"><?= utf8_encode($famille['famille']) ?></div>-->
                                            <div class="subtitle"><?= utf8_encode(substr($famille['desc1'],0,strpos($famille['desc1'],'.')+1)) ?></div>
                                            <div class="actions">
                                                <a href="#" class="action-button"><i class="fa fa-link"></i></a>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                                
                            </div>
                        </div>
                        <? } ?>
                    </div>
                </div>
                    
                    
                    
               
                            <div class="information-blocks">
                                <div class="tabs-container">
                                    <div class="swiper-tabs tabs-switch">
                                    	<a class="block-title tab-switcher active">Dernières news</a>
                            			<div class="clear"></div>
                        			</div>
                                    <div>
                                        <div class="tabs-entry">
                                            <div class="products-swiper">
                                                <div class="swiper-container" data-autoplay="0" data-loop="0" data-speed="500" data-center="0" data-slides-per-view="responsive" data-xs-slides="2" data-int-slides="2" data-sm-slides="3" data-md-slides="4" data-lg-slides="4" data-add-slides="4">
                                                    <div class="swiper-wrapper">
                                                        <? $queryNews = mysqli_query($connexion, "SELECT * FROM news ORDER BY id_news DESC LIMIT 0,6");
														while($news = mysqli_fetch_assoc($queryNews)) { ?>
                                                        <div class="swiper-slide"> 
                                                            <div class="paddings-container">
                                                                <div style="max-width: 310px;" class="product-slide-entry">
                                                                    <a class="product-image hover-class-1" href="#">
                                                                        <img src="../images/news/thumbs/<?= $news['image1'] ?>" alt="">
                                                                        <span class="hover-label">En savoir plus</span>
                                                                    </a>
                                                                    <a class="subtitle" href="#"><?= utf8_encode($news['titre']) ?></a>
                                                                    <div class="date">Postée <?= $news['date'] ?><br>
                                                                    <?= strip_tags(substr(utf8_encode($news['news']),0,80)) ?>...</div>
                                                                </div>
                                                            </div>
                                                        </div>
                                                        <? } ?>
                                                        
                                                        
                                                        
                                                        

                                                    </div>
                                                    <div class="pagination"></div>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>

                            

                            <div class="clear"></div>

                        

                


                <!-- FOOTER -->
                <div class="footer-wrapper style-3">
                    <? include("includes/footer.php") ?>
                </div>

            </div>

        </div>
        <div class="clear"></div>

    </div>

    <div class="search-box popup">
        <form>
            <div class="search-button">
                <i class="fa fa-search"></i>
                <input type="submit" />
            </div>
            <!--<div class="search-drop-down">
                <div class="title"><span>Toutes catégories</span><i class="fa fa-angle-down"></i></div>
                <div class="list">
                    <div class="overflow">
                        <div class="category-entry">Oriflamme</div>
                        <div class="category-entry">Tente pliable</div>
                        <div class="category-entry">Tente Expodôme</div>
                        <div class="category-entry">Gonflable</div>
                        <div class="category-entry">Drapeaux et pavillons</div>
                    </div>
                </div>
            </div>-->
            <div class="search-field">
                <input type="text" value="" placeholder="Rechercher" />
            </div>
        </form>
    </div>


    <div class="cart-box popup">
        <div class="popup-container">
            <div class="cart-entry">
                <a class="image"><img src="../images/produits/expodome-900-1.jpg" alt="" /></a>
                <div class="content">
                    <a class="title" href="#">Expodôme XL<br>9 m</a>
                    <div class="quantity">Quantité: 1</div>

                </div>
                <div class="button-x"><i class="fa fa-close"></i></div>
            </div>
            <div class="cart-entry">
                <a class="image"><img src="../images/produits/expodome-mur.jpg" alt="" /></a>
                <div class="content">
                    <a class="title" href="#">Mur standard - Expodôme 9 m</a>
                    <div class="quantity">Quantité: 1</div>
                </div>
                <div class="button-x"><i class="fa fa-close"></i></div>
            </div>
            <div class="cart-buttons">
                <div class="column" style="width:100%">
                    <a class="button style-4">Voir ma sélection</a>
                </div>
                <div class="clear"></div>
            </div>
        </div>
    </div>
   
    <script src="js/jquery-2.1.3.min.js"></script>
    <script src="js/idangerous.swiper.min.js"></script>
    <script src="js/global.js"></script>

    <!-- custom scrollbar -->
    <script src="js/jquery.mousewheel.js"></script>
    <script src="js/jquery.jscrollpane.min.js"></script>
</body>
</html>
