@extends('frontend.layouts.app')

@section('title','Aura | Aura Publishing')

@section('content')
    <!-- Slideshow - iOS Slider element with animateme scroll efect, custom height and bottom mask style 2 -->
    <div class="kl-slideshow iosslider-slideshow uh_light_gray maskcontainer--shadow_ud iosslider--custom-height scrollme">
        <!-- Loader -->
        <div class="kl-loader">
            <svg version="1.1" id="loader-1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" width="40px" height="40px" viewbox="0 0 40 40" enable-background="new 0 0 40 40" xml:space="preserve"><path opacity="0.2" fill="#000" d="M20.201,5.169c-8.254,0-14.946,6.692-14.946,14.946c0,8.255,6.692,14.946,14.946,14.946 s14.946-6.691,14.946-14.946C35.146,11.861,28.455,5.169,20.201,5.169z M20.201,31.749c-6.425,0-11.634-5.208-11.634-11.634 c0-6.425,5.209-11.634,11.634-11.634c6.425,0,11.633,5.209,11.633,11.634C31.834,26.541,26.626,31.749,20.201,31.749z"></path><path fill="#000" d="M26.013,10.047l1.654-2.866c-2.198-1.272-4.743-2.012-7.466-2.012h0v3.312h0 C22.32,8.481,24.301,9.057,26.013,10.047z" transform="rotate(98.3774 20 20)"><animatetransform attributetype="xml" attributename="transform" type="rotate" from="0 20 20" to="360 20 20" dur="0.5s" repeatcount="indefinite"></animatetransform></path></svg>
        </div>
        <!-- Loader -->
        <div class="bgback">
        </div>
        <!-- Animated Sparkles -->
        <div class="th-sparkles">
        </div>
        <!--/ Animated Sparkles -->
        <!-- iOS Slider wrapper with animateme scroll efect -->
        <div class="iosSlider kl-slideshow-inner animateme" data-trans="6000" data-autoplay="1" data-infinite="true" data-when="span" data-from="0" data-to="0.75" data-translatey="300" data-easing="linear">
            <!-- Slides -->
            <div class="kl-iosslider hideControls">
                <!-- Slide 1 -->
                <div class="item iosslider__item">
                    <!-- Image -->
                    <div class="slide-item-bg" style="background-image:url(kallyas/images/slider1.png);">
                    </div>
                    <!--/ Image -->
                </div>
                <!--/ Slide 1 -->

                <!-- Slide 2 -->
                <div class="item iosslider__item">
                    <!-- Image -->
                    <div class="slide-item-bg" style="background-image:url(kallyas/images/slider2.png);">
                    </div>
                    <!--/ Image -->
                </div>
                <!--/ Slide 2 -->

                <!-- Slide 4 -->
                <div class="item iosslider__item">
                    <!-- Image -->
                    <div class="slide-item-bg" style="background-image:url(kallyas/images/slider3.png);">
                    </div>
                    <!--/ Image -->
                </div>
                <!--/ Slide 4 -->

                <!-- Slide 5 -->
                <div class="item iosslider__item">
                    <!-- Image -->
                    <div class="slide-item-bg" style="background-image:url(kallyas/images/slider2.png);">
                    </div>
                    <!--/ Image -->
                </div>
                <!--/ Slide 5 -->
            </div>
            <!--/ Slides -->

            <!-- Navigation Controls - Prev -->
            <div class="kl-iosslider-prev">
                <!-- Arrow -->
                <span class="thin-arrows ta__prev"></span>
                <!--/ Arrow -->

                <!-- Label - prev -->
                <div class="btn-label">
                    PREV
                </div>
                <!--/ Label - prev -->
            </div>
            <!--/ Navigation Controls - Prev -->

            <!-- Navigation Controls - Next -->
            <div class="kl-iosslider-next">
                <!-- Arrow -->
                <span class="thin-arrows ta__next"></span>
                <!--/ Arrow -->

                <!-- Label - next -->
                <div class="btn-label">
                    NEXT
                </div>
                <!--/ Label - next -->
            </div>
            <!--/ Navigation Controls - Prev -->
        </div>
        <!--/ iOS Slider wrapper with animateme scroll efect -->

        <!-- Bullets -->
        <div class="kl-ios-selectors-block bullets2">
            <div class="selectors">
                <!-- Item #1 -->
                <div class="item iosslider__bull-item first">
                </div>
                <!--/ Item #1 -->

                <!-- Item #2 -->
                <div class="item iosslider__bull-item">
                </div>
                <!--/ Item #2 -->

                <!-- Item #3 -->
                <div class="item iosslider__bull-item">
                </div>
                <!--/ Item #3 -->

                <!-- Item #4 -->
                <div class="item iosslider__bull-item">
                </div>
                <!--/ Item #4 -->

                <!-- Item #5 -->
                <div class="item iosslider__bull-item">
                </div>
                <!--/ Item #5 -->
            </div>
            <!--/ .selectors -->
        </div>
        <!--/ Bullets -->

        <div class="scrollbarContainer">
        </div>

        <!-- Bottom mask style 2 -->
        <div class="kl-bottommask kl-bottommask--shadow_ud">
        </div>
        <!--/ Bottom mask style 2 -->
    </div>
    <!--/ Slideshow - iOS Slider element with animateme scroll efect, custom height and bottom mask style 2 -->

    
    
    <!-- Partners & Testimonials section with custom paddings -->
    <section class="hg_section hg_section--relative ptop-80 pbottom-80">
        <!-- Background -->
        <div class="kl-bg-source">
            <!-- Gradient overlay -->
            <div class="kl-bg-source__overlay" style="background:rgba(205,33,34,1); background: -moz-linear-gradient(left, rgba(205,33,34,1) 0%, rgba(245,72,76,1) 100%); background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(205,33,34,1)), color-stop(100%,rgba(245,72,76,1))); background: -webkit-linear-gradient(left, rgba(205,33,34,1) 0%,rgba(245,72,76,1) 100%); background: -o-linear-gradient(left, rgba(205,33,34,1) 0%,rgba(245,72,76,1) 100%); background: -ms-linear-gradient(left, rgba(205,33,34,1) 0%,rgba(245,72,76,1) 100%); background: linear-gradient(to right, rgba(205,33,34,1) 0%,rgba(245,72,76,1) 100%); ">
            </div>
            <!--/ Gradient overlay -->
        </div>
        <!--/ Background -->

        <div class="container">
            <div class="row">
                <div class="col-md-12 col-sm-12">
                    <!-- Title element with bottom line style -->
                    <div class="kl-title-block clearfix text-center tbk-symbol--line tbk-icon-pos--after-title">
                        <!-- Title with montserrat font, white color and bold style -->
                        <h3 class="tbk__title white montserrat fw-bold">CLIENT ME</h3>
                        <!--/ Title with montserrat font, white color and bold style -->

                        <!-- Title bottom symbol -->
                        <div class="tbk__symbol ">
                            <span></span>
                        </div>
                        <!--/ Title bottom symbol -->
                    </div>
                    <!--/ Title element with bottom line style -->

                    <!-- Testimonials & Partners element - light text style -->
                    <div class="testimonials-partners testimonials-partners--light">
                        <!-- Partners element -->
                        <div class="ts-pt-partners ts-pt-partners--y-title clearfix">
                            <!-- Title -->
                            <div class="ts-pt-partners__title">
                                TECHNOLOGIES
                            </div>
                            <!--/ Title -->

                            <!-- Partners carousel wrapper -->
                            <div class="ts-pt-partners__carousel-wrapper">
                                <div class="ts-pt-partners__carousel">
                                    <!-- Item #1 -->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo6.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #1 -->

                                    <!-- Item #2 -->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo7.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #2 -->

                                    <!-- Item #3 -->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo8.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #3 -->

                                    <!-- Item #4 -->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo1.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #4 -->

                                    <!-- Item #5 -->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo2.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #5 -->

                                    <!-- Item #6 -->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo3.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #6 -->

                                    <!-- Item #7 -->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo4.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #7 -->

                                    <!-- Item  #8-->
                                    <div class="ts-pt-partners__carousel-item">
                                        <!-- Partner image link -->
                                        <a class="ts-pt-partners__link" href="#" target="_self" title="">
                                            <!-- Image -->
                                            <img class="ts-pt-partners__img" src="http://kallyas.themeforest.netdna-cdn.com/images/logo5.svg" alt="" title="" />
                                            <!--/ Image -->
                                        </a>
                                        <!--/ Partner image link -->
                                    </div>
                                    <!--/ Item #8 -->
                                </div>
                                <!--/ .ts-pt-partners__carousel -->
                            </div>
                            <!--/ Partners carousel wrapper -->
                        </div>
                        <!--/ Partners element - .ts-pt-partners -->
                    </div>
                    <!--/ Testimonials & Partners element - light text style -->
                </div>
                <!--/ col-md-12 col-sm-12 -->
            </div>
            <!--/ row -->
        </div>
        <!--/ container -->
    </section>
    <!--/ Partners & Testimonials section with custom paddings -->

    <!-- Title with Call to Action Button section with custom paddings -->
    <section class="hg_section bg-white ptop-65 pb-20">
        <div class="container">
            <div class="row">
                <div class="col-md-9 col-sm-9">
                    <!-- Title element -->
                    <div class="kl-title-block clearfix text-left tbk-symbol-- tbk-icon-pos--after-title">
                        <!-- Title -->
                        <h3 class="tbk__title montserrat fw-semibold tcolor">WORK WITH US</h3>
                        <!--/ Title -->

                        <!-- Sub-Title -->
                        <h4 class="tbk__subtitle fw-thin">We'll do everything we can to make our next best project!</h4>
                        <!--/ Sub-Title -->
                    </div>
                    <!--/ Title element -->
                </div>
                <!--/ col-md-9 col-sm-9 -->

                <div class="col-md-3 col-sm-3">
                    <!-- spacer with custom height -->
                    <div class="th-spacer clearfix" style="height: 10px;">
                    </div>
                    <!--/ spacer with custom height -->

                    <!-- Button lined style -->
                    <div class="text-left">
                        <a class="btn-element btn btn-lined lined-custom btn-md btn-block " href="#" style="margin:0 0 10px 0;">
                            <span>GET A QUOTE</span>
                        </a>
                    </div>
                    <!--/ Button lined style -->
                </div>
                <!--/ col-md-3 col-sm-3 -->
            </div>
            <!--/ row -->
        </div>
        <!--/ container -->
    </section>
    <!--/ Title with Call to Action Button section with custom paddings -->

@endsection