PageSourceSearch

https://be-smart.site/index.html

html be-smart.site collected 2026-10-07 23:05:10 UTC 39,141 bytes, 1,131 lines download raw bytes

1<!DOCTYPE html>
2<!-- saved from url=(0059)https://templates.envytheme.com/exolot/default/index-2.html -->
3<html lang="en">
4  <head>
5    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
6    <!-- Required meta tags -->
7<!-- Owl Carousel CSS -->
8<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css">
9<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.theme.default.min.css">
10
11<!-- Owl Carousel JS -->
12<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
vendor: 1 bytes, line 12
12
13<script src="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/owl.carousel.min.js"></script>
13
14
15    <meta
16      name="viewport"
17      content="width=device-width, initial-scale=1, shrink-to-fit=no"
18    />
19
20    <!-- Bootstrap CSS -->
21    <link rel="stylesheet" href="./css/bootstrap.min.css" />
22    <!-- Animate CSS -->
23    <link rel="stylesheet" href="./css/animate.css" />
24    <!-- Owl Carousel CSS -->
25    <link rel="stylesheet" href="./css/owl.carousel.css" />
26    <!-- Magnific Popup CSS -->
27    <link rel="stylesheet" href="./css/magnific-popup.css" />
28    <!-- Owl Theme Default CSS -->
29    <link rel="stylesheet" href="./css/owl.theme.default.min.css" />
30    <!-- Style CSS -->
31    <link rel="stylesheet" href="./css/style.css" />
32    <!-- Responsive CSS -->
33    <link rel="stylesheet" href="./css/responsive.css" />
34
35    <title>BEsmart</title>
36  </head>
37
38  <body
39    data-bs-spy="scroll"
40    data-bs-offset="70"
41    data-new-gr-c-s-check-loaded="14.1052.0"
42    data-gr-ext-installed=""
43  >
44    <!-- Start Prealoader Area -->
45    <div class="preloader-area" style="display: none">
46      <div class="sk-circle">
47        <div class="sk-circle1 sk-child"></div>
48        <div class="sk-circle2 sk-child"></div>
49        <div class="sk-circle3 sk-child"></div>
50        <div class="sk-circle4 sk-child"></div>
51        <div class="sk-circle5 sk-child"></div>
52        <div class="sk-circle6 sk-child"></div>
53        <div class="sk-circle7 sk-child"></div>
54        <div class="sk-circle8 sk-child"></div>
55        <div class="sk-circle9 sk-child"></div>
56        <div class="sk-circle10 sk-child"></div>
57        <div class="sk-circle11 sk-child"></div>
58        <div class="sk-circle12 sk-child"></div>
59      </div>
60    </div>
61    <!-- End Prealoader Area -->
62
63    <!-- Start Navbar Area -->
64    <nav class="navbar navbar-expand-lg navbar-light bg-light">
65      <div class="container">
66        <a
67          class="navbar-brand"
68          href="index.html"
69          ><span>BE</span>smart</a
70        >
71        <button
72          class="navbar-toggler"
73          type="button"
74          data-bs-toggle="collapse"
75          data-bs-target="#navbarSupportedContent"
76          aria-controls="navbarSupportedContent"
77          aria-expanded="false"
78          aria-label="Toggle navigation"
79        >
80          <span class="navbar-toggler-icon"></span>
81        </button>
82
83        <div class="collapse navbar-collapse" id="navbarSupportedContent">
84          <ul class="navbar-nav ms-auto">
85            <li class="nav-item">
86              <a
87                class="nav-link active"
88                href="index.html"
89                >Home</a
90              >
91            </li>
92            <li class="nav-item">
93              <a
94                class="nav-link"
95                href="#about"
96                >Über uns</a
97              >
98            </li>
99            <li class="nav-item">
100              <a
101                class="nav-link"
102                href="#services"
103                >Dienstleistungen</a
104              >
105            </li>
106
107             <li class="nav-item">
108              <a
109                class="nav-link"
110                href="#whatsapp"
111                >Kontakt</a
112              >
113            </li>
114            <li class="nav-item">
115              <a
116                class="nav-link"
117                href="#"
118                data-bs-toggle="modal"
119                data-bs-target="#myModal"
120                ><span></span
121              ></a>
122            </li>
123          </ul>
124        </div>
125      </div>
126    </nav>
127    <!-- End Navbar Area -->
128
129    <!-- Right Side Modal -->
130    <div class="modal right fade" id="myModal" tabindex="-1" role="dialog">
131      <div class="modal-dialog" role="document">
132        <div class="modal-content">
133          <div class="modal-header">
134            <button
135              type="button"
136              class="close"
137              data-bs-dismiss="modal"
138              aria-label="Close"
139            >
140              <span aria-hidden="true">×</span>
141            </button>
142          </div>
143          <div class="modal-body">
144            <div class="logo">
145              <a
146                href="index.html"
147                >.BE<span>smart.</span></a
148              >
149            </div>
150            <p>
151              Wir sind Ihre Experten für maßgeschneiderte digitale Lösungen.
152            Wir entwickeln und realisieren Projekte für jede Branche und jeden Service.
153            </p>
154            <ul class="modal-contact-info">
155
156              <li>
157                <i class="icofont-ui-call"></i> <b>+ 49 15231996679</b> Anruf oder Chat
158              </li>
159              <li>
160                <i class="icofont-envelope"></i> <b>[email protected]</b> Anfragen
161              </li>
162            </ul>
163
164            <ul class="social-links">
165              <li>
166                <a
167                  href="#"
168                  ><i class="icofont-facebook"></i
169                ></a>
170              </li>
171              <li>
172                <a
173                  href="#"
174                  ><i class="icofont-twitter"></i
175                ></a>
176              </li>
177              <li>
178                <a
179                  href="#"
180                  ><i class="icofont-instagram"></i
181                ></a>
182              </li>
183              <li>
184                <a
185                  href="#"
186                  ><i class="icofont-linkedin"></i
187                ></a>
188              </li>
189              <li>
190                <a
191                  href="#"
192                  ><i class="icofont-pinterest"></i
193                ></a>
194              </li>
195            </ul>
196          </div>
197        </div>
198      </div>
199    </div>
200    <!-- End Right Side Modal -->
201
202    <!-- Start Main Banner -->
203    <div id="home" class="main-banner item-bg-two">
204      <div class="d-table">
205        <div class="d-table-cell">
206          <div class="container">
207            <div class="hero-content">
208              <h5>Sei Kreativ.</h5>
209              <h1><span>BE</span> smart.</h1>
210              <p>
211                Wir sind Ihre Experten für maßgeschneiderte Applikationen.</br>
212            Wir entwickeln und realisieren Projekte für jede Branche und jeden Service.
213              </p>
214              <a
215                href="#services"
216                class="btn btn-primary"
217                >Mehr Informationen</a
218              >
219
220            </div>
221          </div>
222        </div>
223      </div>
224
225      <div class="down_arrow">
226        <a
227          href="#about"
228          class="scroll_down"
229        ></a>
230      </div>
231
232      <div class="animation-box1">
233        <img src="./img/3.png" alt="image" />
234      </div>
235      <div class="animation-box2">
236        <img src="./img/2.png" alt="image" />
237      </div>
238      <div class="animation-box3">
239        <img src="./img/1.png" alt="image" />
240      </div>
241      <div class="animation-box4">
242        <img src="./img/5.png" alt="image" />
243      </div>
244      <div class="animation-box6">
245        <img src="./img/6.png" alt="image" />
246      </div>
247
248      <div class="creative-box1"></div>
249    </div>
250    <!-- End Main Banner -->
251
252    <!-- Start Welcome Area -->
253    <section class="welcome-area ptb-100">
254      <div class="container">
255        <div class="section-title">
256          <span>Wir realisieren Ideen</span>
257          <h2>Willkommen bei  <b>BEsmart</b></h2>
258          <p>
259
260
261          </p>
262        </div>
263
264        <div class="row">
265          <div class="col-lg-4 col-md-6 col-sm-6">
266            <div class="single-box">
267              <i class="icon icon-Magnet"></i>
268              <h3>App-Entwicklung</h3>
269              <p>
270                Wir erstellen maßgeschneiderte und plattformübergreifende mobile Apps für iOS und Android, die perfekt auf Ihre Anforderungen abgestimmt sind.
271              </p>
272            </div>
273          </div>
274
275          <div class="col-lg-4 col-md-6 col-sm-6">
276            <div class="single-box">
277              <i class="icon icon-Notebook"></i>
278              <h3>Plattformen aller Art</h3>
279              <p>
280                Von E-Commerce bis hin zu sozialen Netzwerken entwickeln wir vielseitige Plattformen, die Ihre Geschäftsprozesse optimieren.
281              </p>
282            </div>
283          </div>
284
285          <div
286            class="col-lg-4 col-md-6 col-sm-6 offset-lg-0 offset-md-3 offset-sm-3"
287          >
288            <div class="single-box">
289              <i class="icon icon-Headset"></i>
290              <h3>Webdesign</h3>
291              <p>
292                Professionelles Webdesign und -entwicklung für ansprechende und funktionale Websites, die Ihre Marke repräsentieren.
293              </p>
294            </div>
295          </div>
296        </div>
297      </div>
298    </section>
299    <!-- End Welcome Area -->
300
301    <!-- Start About Area -->
302    <section id="about" class="about-area ptb-100 bg-f9f9f9">
303      <div class="container">
304        <div class="row">
305          <div class="about-image">
306            <img src="./img/about-img.png" alt="about-img" />
307          </div>
308
309          <div class="col-lg-6 col-md-12 col-sm-12 offset-lg-6">
310            <div class="row">
311              <div
312                class="about-slides owl-carousel owl-theme owl-loaded owl-drag"
313              >
314                <div class="owl-stage-outer">
315                  <div
316                    class="owl-stage"
317                    style="
318                      transform: translate3d(-1272px, 0px, 0px);
319                      transition: all 0s ease 0s;
320                      width: 4452px;
321                    "
322                  >
323
324                    <div class="owl-item cloned" style="width: 636px">
325                      <div class="col-lg-12">
326                        <div class="about-title">
327                          <h3>Warum <b>BEsmart</b></h3>
328                          <h5>
329                          <span>Erfahrung &amp; Nachhaltigkeit</span>
330                          </h5>
331                          <p>Mit jahrelanger Expertise und einem engagierten Team bieten wir Ihnen innovative und maßgeschneiderte Lösungen, die Ihr Unternehmen voranbringen.
332                          </p>
333                        </div>
334
335                        <div class="why-choose-us">
336                          <div class="row m-0">
337                            <div class="col-lg-4 col-md-4 p-0">
338                              <div class="single-choose">
339                                <i class="icon icon-Notebook"></i>
340                                <h5>UI/UX Design</h5>
341                              </div>
342                            </div>
343
344                            <div class="col-lg-4 col-md-4 p-0">
345                              <div class="single-choose">
346                                <i class="icon icon-DesktopMonitor"></i>
347                                <h5>Android / iOS</h5>
348                              </div>
349                            </div>
350
351                            <div class="col-lg-4 col-md-4 p-0">
352                              <div class="single-choose">
353                                <i class="icon icon-Headset"></i>
354                                <h5>Support</h5>
355                              </div>
356                            </div>
357
358                            <div class="col-lg-4 col-md-4 p-0">
359                              <div class="single-choose">
360                                <i class="icon icon-DesktopMonitor"></i>
361                                <h5>maßgeschneidertes Design</h5>
362                              </div>
363                            </div>
364
365                            <div class="col-lg-4 col-md-4 p-0">
366                              <div class="single-choose">
367                                <i class="icon icon-DesktopMonitor"></i>
368                                <h5>Team</h5>
369                              </div>
370                            </div>
371
372                            <div class="col-lg-4 col-md-4 p-0">
373                              <div class="single-choose">
374                                <i class="icon icon-DesktopMonitor"></i>
375                                <h5>SEO &amp; Marketing</h5>
376                              </div>
377                            </div>
378                          </div>
379                        </div>
380                      </div>
381                    </div>
382                    <div class="owl-item active" style="width: 636px">
383                      <div class="col-lg-12">
384                        <div class="about-title">
385                          <h3>Über <b>BEsmart</b></h3>
386                          <h5>
387                            <span>Web- &amp; App-Entwicklung</span>
388                          </h5>
389                          <p>
390                            Wir helfen Ihnen, Kosten zu sparen. Umfassender Kundensupport. Konsequent kundenorientiert.
391                          </p>
392                        </div>
393
394                        <div class="our-skill">
395                          <div class="single-progress">
396                            <h3 class="progress-title">App-Entwicklung</h3>
397                            <div class="progress">
398                              <div class="progress-bar" style="width: 95%">
399                                <div class="progress-value">95%</div>
400                              </div>
401                            </div>
402                          </div>
403
404                          <div class="single-progress">
405                            <h3 class="progress-title">Marketing</h3>
406                            <div class="progress">
407                              <div class="progress-bar" style="width: 95%">
408                                <div class="progress-value">75%</div>
409                              </div>
410                            </div>
411                          </div>
412
413                          <div class="single-progress">
414                            <h3 class="progress-title">Web Design</h3>
415                            <div class="progress">
416                              <div class="progress-bar" style="width: 95%">
417                                <div class="progress-value">95%</div>
418                              </div>
419                            </div>
420                          </div>
421
422                          <div class="single-progress">
423                            <h3 class="progress-title">Web Development</h3>
424                            <div class="progress">
425                              <div class="progress-bar" style="width: 92%">
426                                <div class="progress-value">95%</div>
427                              </div>
428                            </div>
429                          </div>
430                        </div>
431                      </div>
432                    </div>
433                       <div class="owl-item cloned" style="width: 636px">
434                      <div class="col-lg-12">
435                        <div class="about-title">
436                          <h3>Datenanalyse <b>-Bigdata</b></h3>
437                          <h5>
438                            We are digital <span>marketing &amp; branding</span>
439                          </h5>
440
441                        </div>
442
443                        <div class="our-mission">
444                          <p>
445                            Darüber hinaus sind wir spezialisiert auf Datenanalyse und Business Intelligence,
446                            um Ihnen wertvolle Einblicke und datenbasierte Entscheidungen zu ermöglichen.
447                          </p>
448
449                        </div>
450                      </div>
451                    </div>
452                  </div>
453                </div>
454                <div class="owl-nav disabled">
455                  <button type="button" role="presentation" class="owl-prev">
456                    <i class="icon icon-Arrow"></i></button
457                  ><button type="button" role="presentation" class="owl-next">
458                    <i class="icon icon-Arrow"></i>
459                  </button>
460                </div>
461                <div class="owl-dots">
462
463                </div>
464              </div>
465            </div>
466          </div>
467        </div>
468      </div>
469      <div class="animation-box1">
470        <img src="./img/3.png" alt="image" />
471      </div>
472      <div class="animation-box2">
473        <img src="./img/4.png" alt="image" />
474      </div>
475      <div class="animation-box3">
476        <img src="./img/1.png" alt="image" />
477      </div>
478      <div class="animation-box6">
479        <img src="./img/6.png" alt="image" />
480      </div>
481    </section>
482    <!-- End About Area -->
483
484    <!-- Start Services Area -->
485    <section id="services" class="services-area ptb-100">
486      <div class="container">
487        <div class="section-title">
488          <h2>Unsere <b>Dienstleistungen</b></h2>
489          <p>
490
491
492
493
494          </p>
495        </div>
496
497        <div class="row">
498          <div class="col-lg-3 col-md-6 col-sm-6">
499            <div class="single-services">
500              <i class="icon icon-Crown"></i>
501              <h3>App-Entwicklung (iOS/Android)</h3>
502              <p>
503                Wir erstellen maßgeschneiderte mobile Apps für iOS und Android,
504                die perfekt auf Ihre Anforderungen abgestimmt sind.
505              </p>
506
507              <div class="bg-number">1</div>
508            </div>
509          </div>
510
511          <div class="col-lg-3 col-md-6 col-sm-6">
512            <div class="single-services">
513              <i class="icon icon-Pen"></i>
514              <h3>UX/UI Design</h3>
515              <p>
516              Wir setzen auf state-of-the-art UX/UI Tools wie Sketch, Figma, Adobe XD, Zeplin und InVision, um maßgeschneiderte Designs zu gestalten.
517              </p>
518
519              <div class="bg-number">2</div>
520            </div>
521          </div>
522
523          <div class="col-lg-3 col-md-6 col-sm-6">
524            <div class="single-services">
525              <i class="icon icon-DSLRCamera"></i>
526              <h3>Modernste Frameworks</h3>
527              <p>
528                Wir verwenden moderne Frameworks wie React, Angular, Vue.js für Web-Apps und Flutter, React Native für mobile Apps, um Ihnen die besten Lösungen zu bieten.
529              </p>
530
531              <div class="bg-number">3</div>
532            </div>
533          </div>
534
535          <div class="col-lg-3 col-md-6 col-sm-6">
536            <div class="single-services">
537              <i class="icon icon-ChartUp"></i>
538              <h3>Plattformen aller Art</h3>
539              <p>
540Von E-Commerce bis hin zu sozialen Netzwerken entwickeln wir
541vielseitige Plattformen, die Ihre Geschäftsprozesse optimieren.
542              </p>
543
544              <div class="bg-number">4</div>
545            </div>
546          </div>
547
548          
549
550          
551
552          
553
554          
555        </div>
556      </div>
557      <div class="animation-box5">
558        <img src="./img/vector-bg.png" class="rotateme" alt="vector" />
559      </div>
560    </section>
561    <!-- End Services Area -->
562
563    <!--
564
565       <!-- Partner Area -->
566<!-- Partner Area (Logo Slider) -->
567<div class="partner-area ptb-100 bg-white">
568  <div class="container">
569    <div class="section-port text-center">
570      <h2>Unsere Partner und Referenzen</h2>
571
572      <!-- Slider für Partner-Logos -->
573      <div class="partner-slider owl-carousel owl-theme">
574        <!-- Logo 1 -->
575        <div class="item">
576          <a href="https://www.lern-fabrik.digital">
577            <img src="./img/portfolio-1.svg" alt="" class="img-fluid">
578          </a>
579        </div>
580
581        <!-- Logo 2 -->
582        <div class="item">
583          <a href="https://www.be-smart.site/amsos/">
584            <img src="./img/portfolio-3.svg" alt="" class="img-fluid">
585          </a>
586        </div>
587
588        <!-- Logo 3 -->
589        <div class="item">
590          <a href="#">
591            <img src="./img/portfolio-4.svg" alt="" class="img-fluid">
592          </a>
593        </div>
594
595        <!-- Logo 4 -->
596        <div class="item">
597          <a href="#">
598            <img src="./img/portfolio-5.svg" alt="" class="img-fluid">
599          </a>
600        </div>
601
602        <!-- Logo 5 -->
603        <div class="item">
604          <a href="#">
605            <img src="./img/pim.jpg" alt="" class="img-fluid">
606          </a>
607        </div>
608
609        <!-- Logo 6 -->
610        <div class="item">
611          <a href="#">
612            <img src="./img/tiebreak.png" alt="" class="img-fluid">
613          </a>
614        </div>
615      </div>
616    </div>
617  </div>
618</div>
619
620<!-- Styles for the Partner Slider -->
621<style>
622  .partner-area {
623    background-color: #fff;  /* Weißer Hintergrund */
624    padding-top: 50px;
625    padding-bottom: 50px;
626  }
627
628  .section-port h2 {
629    font-size: 2rem;
630    font-weight: 600;
631    color: #333;
632  }
633
634  .section-port .lead {
635    font-size: 1.125rem;
636    margin-bottom: 30px;
637    color: #555;
638  }
639
640  .partner-slider .item {
641    text-align: center;
642    padding: 20px;
643  }
644
645  .partner-slider img {
646    max-width: 150px;
647    margin: 0 auto;
648    opacity: 0.8;
649    transition: opacity 0.3s ease;
650  }
651
652  .partner-slider img:hover {
653    opacity: 1;
654  }
655
656  .owl-nav {
657    display: none;
658  }
659</style>
660
661<script>
662  $(document).ready(function() {
663    $(".partner-slider").owlCarousel({
664      loop: true,
665      margin: 20,
666      nav: false,
667      items: 5, // Zeigt 5 Logos gleichzeitig an
668      autoplay: true,
669      autoplayTimeout: 2000, // Bilder wechseln alle 2 Sekunden
670      autoplayHoverPause: true,
671    });
672  });
673</script>
673
674
675
676
677    <!--====== FAQ PART START ======-->
678    <section id="services" class="services-area ptb-100">
679      <div class="container">
680        <div class="section-title">
681          <h2>Häufige gestellte <b>Fragen</b></h2>
682          <p>
683        </p>
684        </div>
685
686                    </div> <!-- section title -->
687                </div>
688            </div> <!-- row -->
689            <div class="row">
690                <div class="col-lg-12">
691                    <div class="accordion" id="faqAccordion">
692                        <div class="card wow fadeInUp" data-wow-duration="1.3s" data-wow-delay="0.2s">
693                            <div class="card-header" id="headingOne">
694                                <h5 class="mb-0">
695                                    <button class="btn btn-link collapsed custom-btn" type="button" data-toggle="collapse" data-target="#collapseOne" aria-expanded="false" aria-controls="collapseOne">
696                                        Frage 1: Was versteht man unter "rundum" Dienstleistungen?
697                                    </button>
698                                </h5>
699                            </div>
700                            <div id="collapseOne" class="collapse" aria-labelledby="headingOne" data-parent="#faqAccordion">
701                                <div class="card-body">
702                                    Antwort: Unter "rundum" Dienstleistungen verstehen wir ein umfassendes Angebot, das alle Aspekte eines Projekts abdeckt. Von der Planung und Beratung über die Umsetzung bis hin zur Nachbetreuung stehen wir Ihnen in allen Phasen zur Seite.
703                                </div>
704                            </div>
705                        </div>
706                        <div class="card wow fadeInUp" data-wow-duration="1.3s" data-wow-delay="0.3s">
707                            <div class="card-header" id="headingTwo">
708                                <h5 class="mb-0">
709                                    <button class="btn btn-link collapsed custom-btn" type="button" data-toggle="collapse" data-target="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo">
710                                        Frage 2: Wie läuft die Entwicklung einer App bei Ihnen ab?
711                                    </button>
712                                </h5>
713                            </div>
714                            <div id="collapseTwo" class="collapse" aria-labelledby="headingTwo" data-parent="#faqAccordion">
715                                <div class="card-body">
716                                    Antwort: Die App-Entwicklung bei uns erfolgt in mehreren Schritten: Zunächst analysieren wir Ihre Anforderungen und erstellen ein Konzept. Danach folgt die Designphase, gefolgt von der eigentlichen Entwicklung. Abschließend testen wir die App ausführlich, bevor sie live geschaltet wird. Während des gesamten Prozesses halten wir Sie stets auf dem Laufenden.
717                                </div>
718                            </div>
719                        </div>
720                        <div class="card wow fadeInUp" data-wow-duration="1.3s" data-wow-delay="0.4s">
721                            <div class="card-header" id="headingThree">
722                                <h5 class="mb-0">
723                                    <button class="btn btn-link collapsed custom-btn" type="button" data-toggle="collapse" data-target="#collapseThree" aria-expanded="false" aria-controls="collapseThree">
724                                        Frage 3: Welche Leistungen bieten Sie im Bereich der Webseitenerstellung an?
725                                    </button>
726                                </h5>
727                            </div>
728                            <div id="collapseThree" class="collapse" aria-labelledby="headingThree" data-parent="#faqAccordion">
729                                <div class="card-body">
730                                    Antwort: Im Bereich der Webseitenerstellung bieten wir eine Vielzahl von Leistungen an, darunter Webdesign, Entwicklung von responsiven Webseiten, Content-Management-Systeme (CMS), E-Commerce-Lösungen sowie Suchmaschinenoptimierung (SEO). Unser Ziel ist es, Ihnen eine maßgeschneiderte Webseite zu liefern, die Ihren Anforderungen entspricht und Ihre Zielgruppe anspricht.
731                                </div>
732                            </div>
733                        </div>
734                        <div class="card wow fadeInUp" data-wow-duration="1.3s" data-wow-delay="0.5s">
735                            <div class="card-header" id="headingFour">
736                                <h5 class="mb-0">
737                                    <button class="btn btn-link collapsed custom-btn" type="button" data-toggle="collapse" data-target="#collapseFour" aria-expanded="false" aria-controls="collapseFour">
738                                        Frage 4: Welche weiteren Dienstleistungen bieten Sie an?
739                                    </button>
740                                </h5>
741                            </div>
742                            <div id="collapseFour" class="collapse" aria-labelledby="headingFour" data-parent="#faqAccordion">
743                                <div class="card-body">
744                                    Antwort: Neben App- und Webentwicklung bieten wir auch Dienstleistungen in den Bereichen digitales Marketing, IT-Beratung, Cloud-Lösungen und maßgeschneiderte Softwareentwicklung an. Unser Ziel ist es, Ihnen eine umfassende Unterstützung zu bieten, damit Sie Ihre Geschäftsziele erreichen können.
745                                </div>
746                            </div>
747                        </div>
748                        <div class="card wow fadeInUp" data-wow-duration="1.3s" data-wow-delay="0.6s">
749                            <div class="card-header" id="headingFive">
750                                <h5 class="mb-0">
751                                    <button class="btn btn-link collapsed custom-btn" type="button" data-toggle="collapse" data-target="#collapseFive" aria-expanded="false" aria-controls="collapseFive">
752                                        Frage 5: Wie funktioniert Ihr Support?
753                                    </button>
754                                </h5>
755                            </div>
756                            <div id="collapseFive" class="collapse" aria-labelledby="headingFive" data-parent="#faqAccordion">
757                                <div class="card-body">
758                                    Antwort: Unser Support-Team steht Ihnen rund um die Uhr zur Verfügung, um Ihnen bei Fragen oder Problemen zu helfen. Sie können uns per E-Mail, Telefon oder über unser Online-Support-Portal erreichen. Wir bieten auch Wartungsverträge an, um sicherzustellen, dass Ihre Systeme stets auf dem neuesten Stand und funktionsfähig sind.
759                                </div>
760                            </div>
761                        </div>
762                    </div> <!-- accordion -->
763                </div>
764            </div> <!-- row -->
765        </div> <!-- container -->
766
767
768        </section>
769
770
771        <section id="whatsapp" class="section" style="background-color: #f1f1f1; padding: 60px 0;">
772            <div class="container text-center">
773                <h2 class="section-title">Kontaktieren Sie uns über WhatsApp!</h2>
774                <p class="section-description">Schnelle und unkomplizierte Kommunikation für Ihre Fragen und Anliegen.</p>
775                <a href="https://wa.me/4915231996679?text=Hallo,%20ich%20habe%20eine%20Frage%20zu%20Ihrer%20App."
776                   class="btn btn-whatsapp"
777                   target="_blank"
778                   rel="noopener noreferrer">
779                    <i class="fab fa-whatsapp"></i> Kontakt über WhatsApp
780                </a>
781            </div>
782        </section>
783
784    <!--====== FAQ PART ENDS ======-->
785
786    <!-- Custom CSS for the FAQ section -->
787    <style>
788
789    #whatsapp {
790        background-color: #f1f1f1;
791        padding: 60px 0;
792    }
793
794    #whatsapp .section-title {
795        font-size: 36px;
796        font-weight: 700;
797        margin-bottom: 15px;
798        color: #333;
799    }
800
801    #whatsapp .section-description {
802        font-size: 18px;
803        font-weight: 400;
804        margin-bottom: 30px;
805        color: #666;
806    }
807
808    #whatsapp .btn-whatsapp {
809        background-color: #25D366;
810        border-color: #25D366;
811        color: white;
812        font-size: 16px;
813        padding: 10px 20px;
814        text-decoration: none;
815        display: inline-flex;
816        align-items: center;
817        margin-top: 20px;
818    }
819
820    #whatsapp .btn-whatsapp:hover {
821        background-color: #1DA851;
822        border-color: #1DA851;
823    }
824
825    #whatsapp .btn-whatsapp i {
826        margin-right: 8px;
827    }
828
829
830
831
832        .custom-btn {
833            color: #2D4101;
834            text-decoration: none;
835        }
836        .custom-btn:hover {
837            color: #5a7302;
838        }
839        .card-header {
840            background-color: #f8f9fa;
841            border-bottom: 1px solid #dee2e6;
842        }
843        .card-body {
844            background-color: #ffffff;
845        }
846    </style>
847
848    <!-- Bootstrap JS and dependencies (jQuery and Popper.js) -->
849    
849<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
849
850    
850<script src="https://cdn.jsdelivr.net/npm/@popperjs/[email protected]/dist/umd/popper.min.js"></script>
850
851    
851<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/js/bootstrap.min.js"></script>
851
852
853
854        <!--====== CONTACT PART START ======-->
855        <section id="contact" class="section">
856            <div class="container">
857                <div class="row">
858
859
860
861
862                    <div class="col-md-12 headline wow bounceInLeft">
863                        <h2>Oder gerne auch über unser Kontaktformular!</h2>
864                        <p>Wir freuen uns von Ihnen zu hören.</p>
865                    </div>
866
867                    <div class="col-md-6 wow bounceInRight">
868                        <form id="contact-form" role="form">
869                            <div class="form-group">
870                                <label for="c_name">Name</label>
871                                <input type="text" id="c_name" class="form-control" name="c_name" placeholder="Name" required>
872                            </div>
873                            <div class="form-group">
874                                <label for="c_email">E-Mail-Adresse</label>
875                                <input type="email" id="c_email" class="form-control" name="c_email" placeholder="E-Mail" required>
876                            </div>
877                            <div class="form-group">
878                                <label for="c_message">Nachricht</label>
879                                <textarea class="form-control" id="c_message" name="c_message" rows="7" placeholder="Ihre Nachricht" required></textarea>
880                            </div>
881                            <button type="submit" class="btn btn-custom-1">
882                                <i class="fa fa-bullhorn icon-before"></i> Senden
883                            </button>
884                            <div class="ajax-response mt-3"></div>
885                        </form>
886                    </div>
887                </div>
888            </div>
889        </section>
890
891        
891<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
891
892        
892<script>
893            $(document).ready(function() {
894                $('#contact-form').submit(function(event) {
895                    event.preventDefault(); // Verhindert das Standardverhalten des Formulars (Seiten-Neuladen)
896
897                    var formData = {
898                        c_name: $('#c_name').val(),
899                        c_email: $('#c_email').val(),
900                        c_message: $('#c_message').val()
901                    };
902
903                    $.ajax({
904                        type: 'POST',
905                        url: 'send_email.php', // Pfad zu deinem Server-Skript
906                        data: formData,
907                        dataType: 'json',
908                        encode: true,
909                        success: function(response) {
910                            // Verarbeitung der Antwort vom Server
911                            if(response.success) {
912                                $('.ajax-response').html('<div class="alert alert-success">' + response.message + '</div>');
913                            } else {
914                                $('.ajax-response').html('<div class="alert alert-danger">' + response.message + '</div>');
915                            }
916                        },
917                        error: function(response) {
918                            $('.ajax-response').html('<div class="alert alert-danger">Es gab ein Problem mit der Übermittlung des Formulars.</div>');
919                        }
920                    });
921                });
922            });
923        </script>
923
924
925    <style>
926
927    /* Stile für das Kontaktformular */
928    #contact {
929        background-color: #f9f9f9;
930        padding: 80px 0;
931    }
932
933    #contact .headline h2 {
934        font-size: 36px;
935        font-weight: 700;
936        margin-bottom: 15px;
937        color: #333;
938    }
939
940    #contact .headline p {
941        font-size: 18px;
942        font-weight: 400;
943        margin-bottom: 30px;
944        color: #666;
945    }
946
947    #contact .icon-list {
948        list-style: none;
949        padding-left: 0;
950        font-size: 16px;
951        color: #333;
952    }
953
954    #contact .icon-list li {
955        margin-bottom: 10px;
956        line-height: 1.8;
957    }
958
959    #contact .profile-widget {
960        margin-top: 30px;
961    }
962
963    #contact .widget-social {
964        list-style: none;
965        padding-left: 0;
966    }
967
968    #contact .widget-social li {
969        display: inline-block;
970        margin-right: 10px;
971    }
972
973    #contact .widget-social li a {
974        font-size: 20px;
975        color: #666;
976    }
977
978    #contact .widget-social li a:hover {
979        color: #333;
980    }
981
982    #contact .form-group {
983        margin-bottom: 20px;
984    }
985
986    #contact .form-group label {
987        font-weight: 600;
988        color: #333;
989    }
990
991    #contact .form-control {
992        border: 1px solid #ddd;
993        border-radius: 0;
994        padding: 12px;
995        font-size: 16px;
996        color: #666;
997    }
998
999    #contact .form-control:focus {
1000        border-color: #333;
1001        box-shadow: none;
1002    }
1003
1004    #contact .btn-custom-1 {
1005        background-color: #333;
1006        color: #fff;
1007        border: none;
1008        padding: 12px 30px;
1009        font-size: 16px;
1010        transition: background-color 0.3s ease;
1011    }
1012
1013    #contact .btn-custom-1:hover {
1014        background-color: #555;
1015    }
1016
1017
1018
1019    </style>
1020
1021
1022
1023
1024
1025
1026        <!--====== BACK TOP TOP PART START ======-->
1027
1028        <a href="#" class="back-to-top"><i class="lni lni-chevron-up"></i></a>
1029
1030        <!--====== BACK TOP TOP PART ENDS ======-->
1031
1032
1033        <!--====== Bootstrap js ======-->
1034        
1034<script src="assets/js/bootstrap.bundle-5.0.0.alpha-min.js"></script>
1034
1035
1036        <!--====== glide js ======-->
1037        
1037<script src="assets/js/glide.min.js"></script>
1037
1038
1039        <!--====== wow js ======-->
1040        
1040<script src="assets/js/wow.min.js"></script>
1040
1041
1042        <!--====== Contact Form js ======-->
1043        
1043<script src="assets/js/contact-form.js"></script>
1043
1044
1045        <!--====== Main js ======-->
1046        
1046<script src="assets/js/main.js"></script>
1046
1047
1048
1049
1050    <!-- Callout section start -->
1051
1052
1053
1054
1055
1056
1057
1058
1059
1060
1061
1062
1063
1064
1065
1066
1067
1068
1069
1070
1071
1072    <!-- Start Footer Area -->
1073    <footer class="footer-area">
1074      <div class="container">
1075        <div class="row">
1076          <div class="col-lg-6 col-md-6">
1077            <p>Copyright @ 2024 BEsmart.</p>
1078          </div>
1079
1080          <div class="col-lg-6 col-md-6">
1081            <ul>
1082              <li>
1083                <a
1084                  href="impressum.html"
1085                  >Impressum</a
1086                >
1087              </li>
1088              <li>
1089                <a
1090                  href="datenschutz.html"
1091                  >Datenschutz</a
1092                >
1093              </li>
1094            </ul>
1095          </div>
1096        </div>
1097      </div>
1098    </footer>
1099    <!-- End Footer Area -->
1100
1101    <div class="go-top" style="display: none">
1102      <i class="icofont-stylish-up"></i>
1103    </div>
1104
1105    <!-- jQuery Min JS -->
1106    
1106<script src="./js/jquery.min.js"></script>
1106
1107    <!-- Prpper JS -->
1108    
1108<script src="./js/popper.min.js"></script>
1108
1109    <!-- Bootstrap Min JS -->
1110    
1110<script src="./js/bootstrap.min.js"></script>
1110
1111    <!-- Owl Carousel Min Js -->
1112    
1112<script src="./js/owl.carousel.min.js"></script>
1112
1113    <!-- Jquery Magnific Popup Min Js -->
1114    
1114<script src="./js/jquery.magnific-popup.min.js"></script>
1114
1115    <!-- Jquery Mixitup Min Js -->
1116    
1116<script src="./js/jquery.mixitup.min.js"></script>
1116
1117    <!-- ajaxChimp Min JS -->
1118    
1118<script src="./js/jquery.ajaxchimp.min.js"></script>
1118
1119    <!-- Form Validator JS -->
1120    
1120<script src="./js/form-validator.min.js"></script>
1120
1121    <!-- Contact Form JS -->
1122    
1122<script src="./js/contact-form-script.js"></script>
1122
1123    <!-- WoW Min JS -->
1124    
1124<script src="./js/wow.js"></script>
1124
1125    <!-- Main JS -->
1126    
1126<script src="./js/main.js"></script>
1126
1127  </body>
1128  <grammarly-desktop-integration
1129    data-grammarly-shadow-root="true"
1130  ></grammarly-desktop-integration>
1131</html>

Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.