Vvveb.SectionsGroup['<?= lang('sections.group.header') ?>'] =
["header/header_style_1","header/header_style_2","header/header_style_3","header/header_style_4","header/header_style_5"];


Vvveb.Sections.add("header/header_style_1", {
name: "<?= lang('sections.header_style_1') ?>",
image: "<?= SITE_THEME_URL ?>/assets/preview/header_style_1.jpg",
html: `
<section class="banner-area-two banner-bg-two">
    <div class="container">
        <div class="row align-items-center">
            <div class="col-lg-6">
                <div class="banner-content-two">
                    <span class="sub-title" data-aos="fade-up" data-aos-delay="100">Bu Alanda Uzmanız</span>
                    <p class="title"  data-aos="fade-up" data-aos-delay="300">İşletmeniz İçin Akıllı Bir Yol Bulun</p>
                    <p data-aos="fade-up" data-aos-delay="500" id="description">Agilos, Verilerinizi Stratejik Bir Varlığa Dönüştürmenize
                        Ve Birinci Sınıf Iş Öngörüleri Elde Etmenize Yardımcı Olur.</p>
                    <div class="banner-btn" data-aos="fade-right" data-aos-delay="700">
                        <a href="#" class="btn" >Hizmetlerimiz</a>
                    </div>
                </div>
            </div>
            <div class="col-lg-6">
                <div class="banner-img text-center">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h2_banner_img.png" alt="" data-aos="fade-left"
                         data-aos-delay="400">
                </div>
            </div>
        </div>
    </div>
    <div class="background-container"><img src="<?= SITE_THEME_URL ?>/assets/img/banner/h2_banner_bg.jpg"></div>

    <div class="banner-shape-wrap">
        <img id="shape01" src="<?= SITE_THEME_URL ?>/assets/img/banner/h2_banner_shape01.png" alt="" style="z-index: 1;">
        <img id="shape02" src="<?= SITE_THEME_URL ?>/assets/img/banner/h2_banner_shape02.png" alt="" style="z-index: 1;">
        <img id="shape03" src="<?= SITE_THEME_URL ?>/assets/img/banner/h2_banner_shape03.png" alt="" data-aos="zoom-in-up"
             data-aos-delay="800" style="z-index: 1;">
    </div>
</section>
`,
});

Vvveb.Sections.add("header/header_style_2", {
name: "<?= lang('sections.header_style_2') ?>",
image: "<?= SITE_THEME_URL ?>/assets/preview/header_style_2.png",
html: `
<section class="banner-area-three">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-lg-7 col-md-9 order-0 order-lg-2">
                <div class="banner-img-three" data-aos="fade-left" data-aos-delay="300">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h3_banner_img01.jpg" alt="" class="main-img">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h3_banner_img02.jpg" alt="" class="img-two"
                         data-parallax='{"y" : 100 }'>
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h3_banner_img03.jpg" alt="" class="img-three"
                         data-parallax='{"x" : -100 }'>
                </div>
            </div>
            <div class="col-lg-5">
                <div class="banner-content-three">
                    <h2 class="title" data-aos="fade-right" data-aos-delay="0">Bugün iş danışmanlığına ihtiyacınız
                        var</h2>
                    <p data-aos="fade-right" data-aos-delay="300">Verilerinizi stratejik bir varlığa dönüştürmenize ve
                        birinci sınıf iş bilgileri edinmenize yardımcı olur.</p>
                    <div data-aos="fade-right" data-aos-delay="600">
                        <form action="#" class="banner-form" >
                            <input type="text" placeholder="E-mail Address">
                            <button type="submit"><i class="flaticon flaticon-right-arrow"></i></button>
                        </form>
                    </div>

                </div>
            </div>
        </div>
    </div>
    <div class="banner-shape-wrap-three">
        <img id="shape04" src="<?= SITE_THEME_URL ?>/assets/img/banner/h3_banner_shape01.png" alt="" style="z-index: 1;">
        <img id="shape05" src="<?= SITE_THEME_URL ?>/assets/img/banner/h3_banner_shape02.png" alt="" style="z-index: 1;">
    </div>
</section>
`,
});

Vvveb.Sections.add("header/header_style_3", {
name: "<?= lang('sections.header_style_3') ?>",
image: "<?= SITE_THEME_URL ?>/assets/preview/header_style_3.png",
html: `
<section class="banner-area-four banner-bg-four">
    <div class="container">
        <div class="row justify-content-center">
            <div class="col-xl-7 col-lg-6 col-md-10 order-0 order-lg-2">
                <div class="banner-img-four text-end">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h4_banner_img.png" alt="" data-aos="fade-left"
                         data-aos-delay="400">
                </div>
            </div>
            <div class="col-xl-5 col-lg-6">
                <div class="banner-content-four">
                    <span class="sub-title" data-aos="fade-up" data-aos-delay="0">Sigorta Acenteliği</span>
                    <h2 class="title" data-aos="fade-up" data-aos-delay="200">Güvenlik Sigortası ile Hayatın Tadını
                        Çıkarın</h2>
                    <p data-aos="fade-up" data-aos-delay="400">Agilos helps you to convert your data into rategic asset
                        emand get top-notch business insights.</p>
                    <a href="#" class="btn btn-three" data-aos="fade-up" data-aos-delay="600">Daha Fazlasını
                        Keşfedin</a>
                </div>
            </div>
        </div>
    </div>
    <div class="background-container"><img src="<?= SITE_THEME_URL ?>/assets/img/banner/h4_banner_bg.jpg"> </div>
    <div class="banner-shape-wrap-four" >
        <img id="shape06" src="<?= SITE_THEME_URL ?>/assets/img/banner/h4_banner_shape01.png" alt="" style="z-index: 1;">
        <img id="shape07" src="<?= SITE_THEME_URL ?>/assets/img/banner/h4_banner_shape02.png" alt="" data-aos="zoom-in"
             data-aos-delay="600" style="z-index: 1;">
        <img id="shape08" src="<?= SITE_THEME_URL ?>/assets/img/banner/h4_banner_shape03.png" alt="" data-aos="zoom-in-up"
             data-aos-delay="800" style="z-index: 1;">
    </div>
</section>
`,
});

Vvveb.Sections.add("header/header_style_4", {
name: "<?= lang('sections.header_style_4') ?>",
image: "<?= SITE_THEME_URL ?>/assets/preview/header_style_4.png",
html: `
<section class="banner-area-five has-animation">
    <div class="container">
        <div class="row align-items-center justify-content-center">
            <div class="col-lg-7 col-md-10 order-0 order-lg-2">
                <div class="banner-img-five">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h5_banner_main_img.png" alt="" class="main-img">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h5_banner_shape01.png" alt="" class="shape-one"
                         data-aos="fade-up-left" data-aos-delay="600">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h5_banner_shape02.png" alt="" class="shape-two">
                    <img src="<?= SITE_THEME_URL ?>/assets/img/banner/h5_banner_shape03.png" alt=""
                         class="shape-three">
                </div>
            </div>
            <div class="col-lg-5">
                <div class="banner-content-five">
                    <h2 class="title" data-aos="fade-right" data-aos-delay="0">İşletmeniz İçin Dijital
                        <span>Ürünler
                                        <svg viewBox="0 0 183 16" fill="none" xmlns="http://www.w3.org/2000/svg">
                                            <path d="M1.1884 13.1749C27.3244 9.45935 96.6096 -9.08021 181.595 12.5919"
                                                  stroke="#0055FF" stroke-width="4"/>
                                        </svg>
                                    </span> Alın
                    </h2>
                    <p data-aos="fade-right" data-aos-delay="300">Bilinmeyen bir yazıcı dizgi tipini aldığında ve
                        bir tür örnek kitap hazırlayın. Sadece beş yüzyıl boyunca hayatta kalmayı değil, aynı zamanda sıçramayı da başardı</p>
                    <a href="#" class="btn btn-three" data-aos="fade-right" data-aos-delay="600">
                        Hizmetler</a>
                </div>
            </div>
        </div>
    </div>
</section>
`,
});

Vvveb.Sections.add("header/header_style_5", {
name: "<?= lang('sections.header_style_5') ?>",
image: "<?= SITE_THEME_URL ?>/assets/preview/header_style_5.png",
html: `
<section class="slider-area" data-component-sliders>
    <div class="slider-active" data-vvveb-disabled-noback="">
        <div class="single-slider slider-bg" style="background: url('<?= SITE_THEME_URL ?>/assets/img/banner/banner_bg.jpg')">

            <div class="container">
                <div class="row">
                    <div class="col-lg-6">
                        <div class="slider-content">
                            <span class="sub-title" data-animation="fadeInUp" data-delay=".2s">Bu Alanda Uzmanız</span>
                            <h2 class="title" data-animation="fadeInUp" data-delay=".4s">İşletmenizi Daha Verimli Bir
                                Şekilde Büyütün</h2>
                            <p data-animation="fadeInUp" data-delay=".6s">Agilos helps you to convert your data into a
                                strategic asset and get top-notch business insights.</p>
                            <a href="#" class="btn" data-animation="fadeInUp"
                               data-delay=".8s">hizmetlerimiz</a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</section>
`,
});