index.html

<!DOCTYPE html>
<html lang="fa" dir="rtl">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>فروشگاه ادکلن</title>
  <link rel="stylesheet" href="./css/bootstrap.min.css">
  <link rel="stylesheet" href="./css/font-awesome.css">
  <link rel="stylesheet" href="./css/owl.carousel.min.css">
  <!-- main css -->
  <link rel="stylesheet" href="./css/style.css">
  <!-- default css -->
  <link rel="stylesheet" href="./css/skins/red.css">


  <!-- style switcher -->
  <link rel="stylesheet" title="red" class="alternate-style" href="./css/skins/red.css" disabled>
  <link rel="stylesheet" title="blue" class="alternate-style" href="./css/skins/blue.css" disabled>
  <link rel="stylesheet" title="black" class="alternate-style" href="./css/skins/black.css" disabled>
  <link rel="stylesheet" title="orange" class="alternate-style" href="./css/skins/orange.css" disabled>
  <link rel="stylesheet" title="purple" class="alternate-style" href="./css/skins/purple.css" disabled>
  <link rel="stylesheet" href="./css/skins/styleSwitcher.css">

</head>

<body>

  <!-- Header Section Start -->

  <header class="header fixed-top">
    <div class="container">
      <nav class="navbar navbar-expand-lg navbar-dark">
        <!-- Brand -->
        <a class="navbar-brand font-weight-bold" href="#">OldCoder</a>

        <!-- Toggler/collapsibe Button -->
        <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#collapsibleNavbar">
          <span class="navbar-toggler-icon"></span>
        </button>

        <!-- Navbar links -->
        <div class="collapse navbar-collapse" id="collapsibleNavbar">
          <ul class="navbar-nav">
            <li class="nav-item">
              <a class="nav-link active" href="#home">خانه</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#about">درباره ما</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#features">امکانات</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#products">محصولات</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#testimonial">مشتریان</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#faq">سوالات متداول</a>
            </li>
            <li class="nav-item">
              <a class="nav-link" href="#contact">تماس با ما</a>
            </li>
          </ul>
        </div>
      </nav>
    </div>
  </header>

  <!-- Header Section end -->


  <!-- Home Section Start -->

  <div class="home" id="home">
    <div class="shape">
      <div></div>
      <div></div>
      <div></div>
    </div>
    <div class="container">
      <div class="row min-vh-100 align-items-center">
        <div class="col-lg-6 text-sm-center">
          <div class="home-content">
            <h1 class="mb-5 text-white">ارائه بهترین محصولات</h1>
            <p class="text-white mb-5">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی
              مورد نیاز و کاربردهای متنوع با هدف بهبود ابزارهای کاربردی می باشد. کتابهای زیادی در شصت و سه درصد گذشته،
              حال و آینده شناخت فراوان جامعه و متخصصان را می طلبد تا با نرم افزارها شناخت بیشتری را برای طراحان رایانه
              ای علی الخصوص طراحان خلاقی و فرهنگ پیشرو در زبان فارسی ایجاد کرد.</p>
            <a href="#" class="home-btn">با تخفیف بخرید 220,000 تومان</a>
          </div>
        </div>
        <div class="col-lg-6">
          <div class="home-img text-left">
            <img src="./images/1.png" class="img-fluid w-75" alt="">
          </div>
        </div>
      </div>
    </div>
  </div>

  <!-- Home Section end -->


  <!-- about Section start -->


  <section class="about" id="about">
    <div class="container">
      <div class="row">
        <div class="col-md-6">
          <div class="title">
            <h6>درباره محصول</h6>
            <h2>برترین برند و با کیفیت ترین محصول</h2>
            <p class="text-muted mb-5">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است.
              چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است</p>
          </div>

          <ul class="list-unstyled">
            <li class="my-4"><i class="fas fa-check"></i>برترین برندها</li>
            <li class="my-4"><i class="fas fa-check"></i>محبوب ترین برندهای روز دنیا</li>
            <li class="my-4"><i class="fas fa-check"></i>خوش بوترین و ماندگارترین ها</li>
            <li class="my-4"><i class="fas fa-check"></i>ارزان ترین و با کیفیت ترین ها</li>
          </ul>

        </div>
        <div class="col-md-6">
          <div class="about-img text-center">
            <img src="./images/2.png" class="img-fluid" alt="">
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- about Section end -->


  <!-- features Section start -->

  <section class="features" id="features">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="title text-center">
            <h6>امکانات و خدمات</h6>
            <h2>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم </h2>
          </div>
        </div>
      </div>
      <div class="row">
        <div class="col-lg-4 col-md-6">
          <div class="features-item text-center">
            <i class="fas fa-headset"></i>
            <h4 class="font-weight-bold my-4 ">مشاوره رایگان</h4>
            <p class="text-muted">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است. </p>
          </div>
        </div>
        <div class="col-lg-4 col-md-6">
          <div class="features-item text-center">
            <i class="fas fa-shopping-cart"></i>
            <h4 class="font-weight-bold my-4 ">خرید آسان</h4>
            <p class="text-muted">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است.</p>
          </div>
        </div>
        <div class="col-lg-4 col-md-6">
          <div class="features-item text-center">
            <i class="fas fa-tags"></i>
            <h4 class="font-weight-bold my-4">تخفیف روزانه</h4>
            <p class="text-muted">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است.</p>
          </div>
        </div>
        <div class="col-lg-4 col-md-6">
          <div class="features-item text-center">
            <i class="fas fa-truck-moving"></i>
            <h4 class="font-weight-bold my-4">ارسال رایگان</h4>
            <p class="text-muted">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است.</p>
          </div>
        </div>
        <div class="col-lg-4 col-md-6">
          <div class="features-item text-center">
            <i class="fas fa-bong"></i>
            <h4 class="font-weight-bold my-4">بهترین کیفیت</h4>
            <p class="text-muted">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است.</p>
          </div>
        </div>
        <div class="col-lg-4 col-md-6">
          <div class="features-item text-center">
            <i class="fas fa-money-check-alt"></i>
            <h4 class="font-weight-bold my-4">گارانتی بازگشت</h4>
            <p class="text-muted">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان
              گرافیک است.</p>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- features Section end -->


  <!-- products Section start -->

  <section class="products text-center" id="products">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="title text-center">
            <h6>محصولات</h6>
            <h2>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم </h2>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="owl-carousel owl-theme" id="product-carousel">

          <div class="col-lg-12">
            <div class="product-item">
              <div class="product-img">
                <img src="./images/product/1.jpg" class="img-fluid" alt="">
                <div class="overlay d-flex">
                  <a href="" class="product-btn">بازدید</a>
                </div>
              </div>
              <div class="product-content">
                <div class="product-price">
                  <span class="new-price">310000 تومان</span>
                  <span class="old-price">340000 تومان</span>
                </div>
                <div class="product-name">
                  <h6>ادکلن اول</h6>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="product-item">
              <div class="product-img">
                <img src="./images/product/2.jpg" class="img-fluid" alt="">
                <div class="overlay d-flex">
                  <a href="" class="product-btn">بازدید</a>
                </div>
              </div>
              <div class="product-content">
                <div class="product-price">
                  <span class="new-price">310000 تومان</span>
                  <span class="old-price">340000 تومان</span>
                </div>
                <div class="product-name">
                  <h6>ادکلن اول</h6>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="product-item">
              <div class="product-img">
                <img src="./images/product/3.jpg" class="img-fluid" alt="">
                <div class="overlay d-flex">
                  <a href="" class="product-btn">بازدید</a>
                </div>
              </div>
              <div class="product-content">
                <div class="product-price">
                  <span class="new-price">310000 تومان</span>
                  <span class="old-price">340000 تومان</span>
                </div>
                <div class="product-name">
                  <h6>ادکلن اول</h6>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="product-item">
              <div class="product-img">
                <img src="./images/product/4.jpg" class="img-fluid" alt="">
                <div class="overlay d-flex">
                  <a href="" class="product-btn">بازدید</a>
                </div>
              </div>
              <div class="product-content">
                <div class="product-price">
                  <span class="new-price">310000 تومان</span>
                  <span class="old-price">340000 تومان</span>
                </div>
                <div class="product-name">
                  <h6>ادکلن اول</h6>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="product-item">
              <div class="product-img">
                <img src="./images/product/5.jpg" class="img-fluid" alt="">
                <div class="overlay d-flex">
                  <a href="" class="product-btn">بازدید</a>
                </div>
              </div>
              <div class="product-content">
                <div class="product-price">
                  <span class="new-price">310000 تومان</span>
                  <span class="old-price">340000 تومان</span>
                </div>
                <div class="product-name">
                  <h6>ادکلن اول</h6>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="product-item">
              <div class="product-img">
                <img src="./images/product/6.jpg" class="img-fluid" alt="">
                <div class="overlay d-flex">
                  <a href="" class="product-btn">بازدید</a>
                </div>
              </div>
              <div class="product-content">
                <div class="product-price">
                  <span class="new-price">310000 تومان</span>
                  <span class="old-price">340000 تومان</span>
                </div>
                <div class="product-name">
                  <h6>ادکلن اول</h6>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- products Section end -->


  <!-- testimonial Section start -->

  <section class="testimonial" id="testimonial">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="title text-center">
            <h6>نظرات مشتریان</h6>
            <h2 class="text-white">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم </h2>
          </div>
        </div>
      </div>

      <div class="row mt-5">
        <div class="owl-carousel owl-theme" id="testimonial-carousel">

          <div class="col-lg-12">
            <div class="testi-item">
              <div class="testi-comment mb-4">
                <p class="text-muted"><i class="fas fa-quote-right"></i>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از
                  صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که
                  لازم است <i class="fas fa-quote-left"></i></p>
                <div class="star mt-3">
                  <i class="fas fa-star-half"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                </div>
              </div>
              <div class="client-info d-flex align-items-center">
                <div class="client-info-img w-25">
                  <img src="./images/tetimonial/1.jpg" class="img-fluid img-thumbnail rounded-circle" alt="">
                </div>
                <div class="client-info-desc w-75 pr-3">
                  <h5>رضا احمدی</h5>
                  <p class="text-muted">لورم ایپسوم متن سارافیک است.</p>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="testi-item">
              <div class="testi-comment mb-4">
                <p class="text-muted"><i class="fas fa-quote-right"></i>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از
                  صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که
                  لازم است <i class="fas fa-quote-left"></i></p>
                <div class="star mt-3">
                  <i class="fas fa-star-half"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                </div>
              </div>
              <div class="client-info d-flex align-items-center">
                <div class="client-info-img w-25">
                  <img src="./images/tetimonial/2.jpg" class="img-fluid img-thumbnail rounded-circle" alt="">
                </div>
                <div class="client-info-desc w-75 pr-3">
                  <h5>رضا احمدی</h5>
                  <p class="text-muted">لورم ایپسوم متن سارافیک است.</p>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="testi-item">
              <div class="testi-comment mb-4">
                <p class="text-muted"><i class="fas fa-quote-right"></i>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از
                  صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که
                  لازم است <i class="fas fa-quote-left"></i></p>
                <div class="star mt-3">
                  <i class="fas fa-star-half"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                </div>
              </div>
              <div class="client-info d-flex align-items-center">
                <div class="client-info-img w-25">
                  <img src="./images/tetimonial/3.jpg" class="img-fluid img-thumbnail rounded-circle" alt="">
                </div>
                <div class="client-info-desc w-75 pr-3">
                  <h5>رضا احمدی</h5>
                  <p class="text-muted">لورم ایپسوم متن سارافیک است.</p>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="testi-item">
              <div class="testi-comment mb-4">
                <p class="text-muted"><i class="fas fa-quote-right"></i>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از
                  صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که
                  لازم است <i class="fas fa-quote-left"></i></p>
                <div class="star mt-3">
                  <i class="fas fa-star-half"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                </div>
              </div>
              <div class="client-info d-flex align-items-center">
                <div class="client-info-img w-25">
                  <img src="./images/tetimonial/4.jpg" class="img-fluid img-thumbnail rounded-circle" alt="">
                </div>
                <div class="client-info-desc w-75 pr-3">
                  <h5>رضا احمدی</h5>
                  <p class="text-muted">لورم ایپسوم متن سارافیک است.</p>
                </div>
              </div>
            </div>
          </div>
          <div class="col-lg-12">
            <div class="testi-item">
              <div class="testi-comment mb-4">
                <p class="text-muted"><i class="fas fa-quote-right"></i>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از
                  صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و متون بلکه روزنامه و مجله در ستون و سطرآنچنان که
                  لازم است <i class="fas fa-quote-left"></i></p>
                <div class="star mt-3">
                  <i class="fas fa-star-half"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                  <i class="fas fa-star"></i>
                </div>
              </div>
              <div class="client-info d-flex align-items-center">
                <div class="client-info-img w-25">
                  <img src="./images/tetimonial/5.jpg" class="img-fluid img-thumbnail rounded-circle" alt="">
                </div>
                <div class="client-info-desc w-75 pr-3">
                  <h5>رضا احمدی</h5>
                  <p class="text-muted">لورم ایپسوم متن سارافیک است.</p>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>
  <!-- testimonial Section end -->


  <!-- faq Section start -->

  <section class="faq" id="faq">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="title text-center">
            <h6>سوالات متداول</h6>
            <h2>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم </h2>
          </div>
        </div>
      </div>

      <div class="row mt-5">
        <div class="col-md-6">
          <div class="faq-item">
            <h5 class="font-weight-bold mb-4">چگونه میتوانم سفارش دهم؟</h5>
            <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و
              متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای
              متنوع با هدف بهبود ابزارهای کاربردی می باشد.</p>
          </div>
        </div>
        <div class="col-md-6">
          <div class="faq-item">
            <h5 class="font-weight-bold mb-4">چگونه میتوانم سفارش دهم؟</h5>
            <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و
              متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای
              متنوع با هدف بهبود ابزارهای کاربردی می باشد.</p>
          </div>
        </div>
        <div class="col-md-6">
          <div class="faq-item">
            <h5 class="font-weight-bold mb-4">چگونه میتوانم سفارش دهم؟</h5>
            <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و
              متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای
              متنوع با هدف بهبود ابزارهای کاربردی می باشد.</p>
          </div>
        </div>
        <div class="col-md-6">
          <div class="faq-item">
            <h5 class="font-weight-bold mb-4">چگونه میتوانم سفارش دهم؟</h5>
            <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و
              متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای
              متنوع با هدف بهبود ابزارهای کاربردی می باشد.</p>
          </div>
        </div>
        <div class="col-md-6">
          <div class="faq-item">
            <h5 class="font-weight-bold mb-4">چگونه میتوانم سفارش دهم؟</h5>
            <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و
              متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای
              متنوع با هدف بهبود ابزارهای کاربردی می باشد.</p>
          </div>
        </div>
        <div class="col-md-6">
          <div class="faq-item">
            <h5 class="font-weight-bold mb-4">چگونه میتوانم سفارش دهم؟</h5>
            <p>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم از صنعت چاپ و با استفاده از طراحان گرافیک است. چاپگرها و
              متون بلکه روزنامه و مجله در ستون و سطرآنچنان که لازم است و برای شرایط فعلی تکنولوژی مورد نیاز و کاربردهای
              متنوع با هدف بهبود ابزارهای کاربردی می باشد.</p>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- faq Section end -->


  <!-- newsletter Section start -->

  <section class="newsletter">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="title text-center">
            <h6>سوالات متداول</h6>
            <h2 class="text-white">لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم </h2>
          </div>
        </div>
      </div>


      <div class="row justify-content-center mt-5">
        <div class="col-lg-7 col-md-10">
          <form class="newsletter-form">
            <div class="input-email col-9">
              <input type="email" class="w-100 p-2 border-0" placeholder="ایمیل خود را وارد کنید">
            </div>
            <button class="col-3 btn">مشترک شوید</button>
          </form>
        </div>
      </div>
    </div>
  </section>

  <!-- newsletter Section end -->


  <!-- contact Section start -->

  <section class="contact" id="contact">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="title text-center">
            <h6>تماس با ما</h6>
            <h2>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم </h2>
          </div>
        </div>
      </div>

      <div class="row mt-5">
        <div class="col-lg-8">
          <form class="contact-form">
            <div class="row">
              <div class="col-md-6">
                <input type="text" class="w-100" placeholder="نام شما">
              </div>
              <div class="col-md-6">
                <input type="email" class="w-100" placeholder="ایمیل شما">
              </div>
            </div>
            <input type="text" class="w-100 mt-4" placeholder="موضوع">
            <textarea class="mt-5 w-100" placeholder="پیام شما"></textarea>
            <button class="btn">ارسال پیام</button>
          </form>
        </div>
        <div class="col-lg-4 pr-4">
          <div class="contact-item">
            <i class="fas fa-map-marked-alt"></i>
            <div class="contact-desc pr-2">
              <h5>آدرس</h5>
              <p>شیراز مرکز شهر سمت راست طبقه سوم پلاک 6</p>
            </div>
          </div>
          <div class="contact-item">
            <i class="fas fa-envelope"></i>
            <div class="contact-desc pr-2">
              <h5>ایمیل</h5>
              <p>oldcoder@gmail.com</p>
            </div>
          </div>
          <div class="contact-item">
            <i class="fas fa-phone"></i>
            <div class="contact-desc pr-2">
              <h5>تلفن</h5>
              <p>0713 - 8447466</p>
            </div>
          </div>
        </div>
      </div>
    </div>
  </section>

  <!-- contact Section end -->

  <!-- footer Section start -->

  <footer class="footer">
    <div class="container">
      <div class="row">
        <div class="col-lg-12">
          <div class="title text-center">
            <h4>پارس کدر</h4>
            <h5>لورم ایپسوم متن ساختگی با تولید سادگی نامفهوم </h5>
          </div>
        </div>
      </div>

      <div class="row">
        <div class="col-lg-12">
          <ul class="w-100 mt-5 d-flex align-items-center justify-content-center">
            <li><a href=""><i class="fab fa-instagram"></i></a></li>
            <li><a href=""><i class="fab fa-facebook"></i></a></li>
            <li><a href=""><i class="fab fa-youtube"></i></a></li>
            <li><a href=""><i class="fab fa-twitter"></i></a></li>
            <li><a href=""><i class="fab fa-linkedin-in"></i></a></li>
          </ul>
        </div>
      </div>
    </div>
    <div class="copy-right w-100 text-center">
      <p class="">کلیه حقوق مادی و معنوی این وبسایت محفوظ میباشد.</p>
    </div>
  </footer>

  <!-- footer Section end -->


  <!-- style switcher -->

  <div class="style-switcher">
    <div class="toggle-style-switcher">
      <i class="fas fa-cog fa-spin"></i>
    </div>
    <h4>تغییر استایل</h4>
    <ul class="list-unstyled">
      <li title="red" style="background-color: #d70d25;" onclick="setActiveStyle('red')"></li>
      <li title="blue" style="background-color: #0d47a1;" onclick="setActiveStyle('blue')"></li>
      <li title="black" style="background-color: #263238;" onclick="setActiveStyle('black')"></li>
      <li title="orange" style="background-color: #BF360C;" onclick="setActiveStyle('orange')"></li>
      <li title="purple" style="background-color: #311B92;" onclick="setActiveStyle('purple')"></li>
    </ul>
  </div>

  <!-- style switcher -->


  <script src="./js/jquery-3.6.0.min.js"></script>
  <script src="./js/bootstrap.bundle.min.js"></script>
  <script src="./js/font-awesome.js"></script>
  <script src="./js/owl.carousel.min.js"></script>
  <script src="./js/script.js"></script>
  <script src="./js/styleSwitcher.js"></script>
</body>

</html>