OwlCyberSecurity - MANAGER

Edit File: index.html

{% load static %}

<!DOCTYPE html>
<html>

<title>Boisilia</title>

<link rel="stylesheet" type="text/css" href="{% static 'app3/css/bootstrap.css' %}" />

<link href="https://fonts.googleapis.com/css2?family=Poppins:wght@400;600;700&display=swap" rel="stylesheet">
  
  <link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css" />
  
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/css/nice-select.min.css" integrity="sha256-mLBIhmBvigTFWPSCtvdu6a76T+3Xyt+K571hupeFLg4=" crossorigin="anonymous" />
  
  <link rel= stylesheet href="{% static 'app3/css/font-awesome.min.css'  %}" />

<link href="{% static 'app3/css/style.css' %}" rel="stylesheet" />
  
  <link href="{% static 'app3/css/responsive.css' %}" rel="stylesheet" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.4/css/all.min.css">
<script type="text/javascript" src="https://gc.kis.v2.scr.kaspersky-labs.com/FD126C42-EBFA-4E12-B309-BB3FDD723AC1/main.js?attr=-qRJaMoZu9TyTlXtWECxSjk_06lLaMRAT30VMew_CwG_c4hSQd6qNVOkrnsI8j8pU1aDrUjDppWRIyz1L0-GPuIxUoR7CukqZ-llWgferCayC4p-kFgUd4B1vmjyw1OJ_mgY9AebBHoL1IJTaopsZUCI_sESDRXd_8xZ5LI7oWx9vIXsHWTxpTkNYlPBdKGRSQyjkFHdEJ_2vcjlVASxAxpF1FXI4yB2Ypl2a4elxHs" charset="UTF-8"></script></head>

<div class="collapse navbar-collapse" id="navbarSupportedContent">
              <ul class="navbar-nav  ">
                <li class="nav-item active">
                  <img src="{% static 'app3/images/logo.png' %}" alt="boisilia logo" id="boisilia_logo">
                  <span style="color:white;">Bois</span><span style="color: greenyellow;">ilia</span>
                </li>
                <li class="nav-item active">
                  <a class="nav-link" href="/">Accueil<span class="sr-only">(current)</span></a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#services" onclick="scrollToSection('services')">Services</a>
                </li>
                <li class="nav-item">
                  <a class="nav-link" href="#apropos" onclick="scrollToSection('apropos')"> A propos</a>
                </li>             
                <li class="nav-item">
                  <a class="nav-link" href="#contacts" onclick="scrollToSection('contacts')">Contacts</a>
                </li>
              </ul>
            </div>
          </nav>
        </div>
      </div>
    </header>
    
    
    <section class="slider_section ">
      <div id="customCarousel1" class="carousel slide" data-ride="carousel">
        <div class="carousel-inner">
          <div class="carousel-item active">
            <div class="container ">
              <div class="detail-box">
                <h1>
                  Découvrez l'art de la menuiserie<br />
                  avec notre savoir-faire<br />
                  traditionnel et moderne
                </h1>
                <div class="btn-box">
                 
                  <a class="btn2" href="#contacts" onclick="scrollToSection('contacts')">
                    Contactez Nous
                  </a>
                </div>
              </div>
            </div>
          </div>
          <div class="carousel-item">
            <div class="container ">
              <div class="detail-box">
                <h1>
                  Transformez vos espaces  <br />
                  avec nos créations en <br />
                  bois de haute qualité
                </h1>
                <div class="btn-box">
               
                  <a href="" class="btn2">
                    Contactez Nous
                  </a>
                </div>
              </div>
            </div>
          </div>
          <div class="carousel-item">
            <div class="container ">
              <div class="detail-box">
                <h1>
                  Vos rêves en bois prennent vie <br />
                  avec notre expertise en menuiserie <br />
                </h1>
                <div class="btn-box">
                 
                  <a href="" class="btn2">
                    Contactez Nous
                  </a>
                </div>
              </div>
            </div>
          </div>
        </div>
        <div class="carousel_btn-box">
          <a class="carousel-control-prev" href="#customCarousel1" role="button" data-slide="prev">
            <i class="fa fa-arrow-left" aria-hidden="true"></i>
            <span class="sr-only">Previous</span>
          </a>
          <a class="carousel-control-next" href="#customCarousel1" role="button" data-slide="next">
            <i class="fa fa-arrow-right" aria-hidden="true"></i>
            <span class="sr-only">Next</span>
          </a>
        </div>
      </div>
    </section>
    
  </div>

<section class="about_section layout_padding" id="apropos">
    <div class="container  ">
      <div class="row">
        <div class="col-md-6">
          <div class="detail-box">
            <div class="heading_container">
              <h2>Bienvenue chez <span>BOISILIA</span></h2>
            </div>
            <p>
              Fondée en 2024 et située à Bejaia, Algérie, BOISILIA Menuiserie se distingue
               comme une entreprise innovante et passionnée par l'art du travail du bois. 
               Spécialisée dans la fabrication de meubles sur mesure, la rénovation intérieure,
                et les installations en bois, BOISILIA allie savoir-faire traditionnel et technologies
                 modernes pour offrir des produits de haute qualité. Nos artisans qualifiés s'engagent
                  à fournir des solutions personnalisées et durables, répondant aux besoins et aux 
                  goûts spécifiques de chaque client. Chez BOISILIA, nous transformons vos idées en 
                  réalités tangibles, en faisant de chaque projet une œuvre unique.
            </p>
          
          </div>
        </div>
        <div class="col-md-6 ">
          <div class="img-box">
            <img id="img_rond" src="{% static 'app3/images/about-img.png' %}" alt="" />
          </div>
        </div>
      </div>
    </div>
  </section>

<section class="portfolio_section ">
    <div class="container">
      <div class="heading_container heading_center">
        <h2>
          Nos Produits
        </h2>
      </div>
      <div class="carousel-wrap ">
        <div class="filter_box">
          <nav class="owl-filter-bar">
            <a href="#" class="item active" data-owl-filter="*">Tout</a>
            <a href="#" class="item" data-owl-filter=".Armoires">Armoires et placards</a>
            <a href="#" class="item" data-owl-filter=".Bibliothèques">Bibliothèques </a>
            <a href="#" class="item" data-owl-filter=".buffets">Commodes et buffets</a>
            <a href="#" class="item" data-owl-filter=".Cuisines">Cuisines équipées</a>
            <a href="#" class="item" data-owl-filter=".Dressings">Dressings </a>
            <a href="#" class="item" data-owl-filter=".bureaux">Aménagements de bureaux </a>
            <a href="#" class="item" data-owl-filter=".meubles">Petit meubles </a>
          </nav>
        </div>
      </div>
    </div>
    <div class="owl-carousel portfolio_carousel">
      <div class="item Armoires">
        <div class="box">
          <div class="img-box">
            <img src="{% static  'app3/images/armoirejpg.jpg' %}" alt="" />
      
          </div>
     
        </div>
      
        
      </div>
      <div class="item Armoires">
        <div class="box">
          <div class="img-box">
            <img src="{% static  'app3/images/rangement.jpg' %}" alt="" />
         
          </div>
     
        </div>
      
        
      </div>
      <div class="item Armoires">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/rangement2.jpg' %}" alt="" />
         
          </div>
     
        </div>
      
        
      </div>
      <div class="item Armoires">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/rangement3.jpg' %}" alt="" />
         
          </div>
     
        </div>
      
        
      </div>
      <div class="item Bibliothèques">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/biblio1.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Bibliothèques">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/biblio2.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Bibliothèques">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/biblio3.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item buffets">
        <div class="box"> 
          <div class="img-box">
            <img src="{% static 'app3/images/cmd1.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item buffets">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/cmd2.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item buffets">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/cmd3.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Cuisines">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/cu1.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Cuisines">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/cu2.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Cuisines">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/cu3.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Dressings">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/d1.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Dressings">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/d2.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item Dressings">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/d3.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item bureaux">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/bu1.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item bureaux">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/bu2.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>
      <div class="item bureaux">
        <div class="box">
          <div class="img-box">
            <img src="{% static 'app3/images/bu3.jpg' %}" alt="" />
         
          </div>
        </div>
      </div>

</div>
  </section>

<section class="service_section layout_padding" id="services">
    <div class="container ">
      <div class="heading_container heading_center">
        <h2>Nos <span>Services</span></h2>
      </div>
      <div class="row">
        <div class="col-sm-6 col-md-4">
          <div class="box ">
            <div class="img-box">
              <img src="{% static 'app3/images/s1.png' %}" alt="" />
            </div>
            <div class="detail-box">
              <h5>
                Fabrication sur mesure
              </h5>
              <p>
                La fabrication sur mesure consiste à concevoir et réaliser des éléments de menuiserie parfaitement adaptés aux dimensions et aux besoins spécifiques du client. Cela inclut des produits tels que des fenêtres, des portes, des volets, des meubles, des escaliers et des portails. Chaque pièce est unique et créée avec une attention particulière aux détails et à la qualité des matériaux.  <br><br>
              </p>
            </div>
          </div>
        </div>
        <div class="col-sm-6 col-md-4">
          <div class="box ">
            <div class="img-box">
              <img src="{% static 'app3/images/s2.png' %}" alt="" />
            </div>
            <div class="detail-box">
              <h5>
                Pose et installation
              </h5>
              <p>
                La pose et l’installation de menuiseries comprennent l’installation professionnelle de produits tels que les fenêtres, les portes, les volets, les escaliers, les meubles sur mesure, ainsi que les parquets et autres revêtements de sol. Ce service assure une intégration parfaite et fonctionnelle de chaque élément dans l’espace prévu, garantissant une finition esthétique et une performance optimale.
              </p>
            </div>
          </div>
        </div>
        <div class="col-sm-6 col-md-4">
          <div class="box ">
            <div class="img-box">
              <img src="{% static 'app3/images/s3.png' %}" alt="" />
            </div>
            <div class="detail-box">
              <h5>
                Menuiserie d’agencement
              </h5>
              <p>
                La menuiserie d’agencement concerne l'optimisation de l’espace intérieur par la création de solutions sur mesure comme les cuisines, les dressings, les bibliothèques et les placards. Ce service vise à maximiser l’efficacité et l’esthétique de l’espace disponible, en proposant des aménagements pratiques et harmonieux qui répondent aux besoins spécifiques des clients. <br><br>
              </p>
            </div>
          </div>
        </div>
 
      </div>
 
    </div>
  </section>

<section class="contact_section " id="contacts">
    <div class="container">
      <div class="heading_container heading_center">
        <h2>Contactez <span>Nous</span></h2>
      </div>
      <div class="row">
        <div class="col-md-6 px-0">
          <div class="form_container">
            <form action="">
              <div class="form-row">
                <div class="form-group col">
                  <input type="text" class="form-control" placeholder="Nom et prénom" />
                </div>
              </div>
              <div class="form-row">
                <div class="form-group col-lg-6">
                  <input type="text" class="form-control" placeholder="Téléphone" />
                </div>
                <div class="form-group col-lg-6">
            
                </div>
              </div>
              <div class="form-row">
                <div class="form-group col">
                  <input type="email" class="form-control" placeholder="Email" />
                </div>
              </div>
              <div class="form-row">
                <div class="form-group col">
                  <input type="text" class="message-box form-control" placeholder="Message" />
                </div>
              </div>
              <div class="btn_box">
                <button id="email">
                  Envoyer
                </button>
              </div>
            </form>
          </div>
        </div>
        <div class="col-md-6 px-0">
          <div class="map_container">
            <div class="map">
              <iframe src="https://www.google.com/maps/embed?pb=!1m21!1m12!1m3!1d199.91618671165799!2d5.044634227672664!3d36.7067316747972!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!4m6!3e6!4m0!4m3!3m2!1d36.7067209!2d5.0448116!5e0!3m2!1sfr!2sdz!4v1720950177181!5m2!1sfr!2sdz" width="850" height="510" style="border:0;" allowfullscreen="" loading="lazy" referrerpolicy="no-referrer-when-downgrade"></iframe>            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  
  <section class="info_section ">  </section>

<footer
          class="text-center text-lg-start text-white"
          style="background-color: #252525"
          >

<section class="">
      <div class="container text-center text-md-start mt-5">
        
        <div class="row mt-3" id="f_infos" >
          
          <div class="col-md-3 col-lg-4 col-xl-3 mx-auto mb-4">
            
            <h6 class="text-uppercase fw-bold"><span style="color:white;">Bois</span><span style="color: greenyellow;">ilia</span></h6>
            <hr
                class="mb-4 mt-0 d-inline-block mx-auto"
                style="width: 60px; background-color: #c1e907; height: 2px"
                />
            <p>
              Redéfinissez l'élégance de votre espace de vie avec nos créations en bois sur mesure.
            </p>
          </div>

<div class="col-md-3 col-lg-2 col-xl-2 mx-auto mb-4">
            
            <h6 class="text-uppercase fw-bold">Liens</h6>
            <hr
                class="mb-4 mt-0 d-inline-block mx-auto"
                style="width: 60px; background-color: #c1e907; height: 2px"
                />
            <p >
              <a href="#" class="text-white">Accueil</a>
            </p>
            <p >
              <a class="text-white" href="#services" onclick="scrollToSection('services')">Services</a>
            </p>
            <p >
              <a class="text-white" href="#apropos" onclick="scrollToSection('apropos')">A propos</a>
            </p>
            <p >
              <a class="text-white" href="#contacts" onclick="scrollToSection('contacts')">Contacts</a>
            </p>
          </div>

<div class="col-md-4 col-lg-3 col-xl-3 mx-auto mb-md-0 mb-4">
            
            <h6 class="text-uppercase fw-bold">Contactez nous</h6>
            <hr
                class="mb-4 mt-0 d-inline-block mx-auto"
                style="width: 60px; background-color: #c1e907; height: 2px"
                />
            <p class="text-left"><i class="fas fa-home mr-3"></i> 
              Djemaa Ossaka - Cne Tala hamza 06066 Béjaïa - Algérie</p>
            <p class="text-left"><i class="fas fa-envelope mr-3"></i> contact@boisilia.com</p>
            <p class="text-left"><i class="fas fa-phone mr-3"></i> + 213 034089220</p>
          </div>
          
        </div>
        
      </div>
    </section>

</footer>
  
  <footer class="footer_section" style="background-color: rgba(0, 0, 0, 0.2)">
    <div class="container">
      <p>
        &copy; <span id="displayYear"></span> BOISILIA
        
      </p>
    </div>
  </footer>

<script src="{% static 'app3/jquery-3.4.1.min.js' %}"></script>
  
  <script src="https://cdn.jsdelivr.net/npm/popper.js@1.16.0/dist/umd/popper.min.js" integrity="sha384-Q6E9RHvbIyZFJoft+2mJbHaEWldlvI9IOYy5n3zV9zzTtmI3UksdQRVvoxMfooAo" crossorigin="anonymous"></script>
  
  <script src="{% static 'app3/js/bootstrap.js' %}"></script>
  
  <script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
  
  <script src="https://huynhhuynh.github.io/owlcarousel2-filter/dist/owlcarousel2-filter.min.js"></script>
  
  <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/js/jquery.nice-select.min.js" integrity="sha256-Zr3vByTlMGQhvMfgkQ5BtWRSKBGa2QlspKYJnkjZTmo=" crossorigin="anonymous"></script>
  
  <script src="{% static 'app3/js/custom.js' %}"></script>
  
  <script src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCh39n5U-4IoWpsVGUHWdqB6puEkhRLdmI&callback=myMap"></script>

</body>

</html>