<link href="<?php echo theme_url();?>/assets/layerslider/css/layerslider.css" rel="stylesheet">
<script src="<?php echo theme_url();?>/assets/layerslider/js/greensock.js" type="text/javascript"></script>
<!-- LayerSlider script files -->
<script src="<?php echo theme_url();?>/assets/layerslider/js/layerslider.transitions.js" type="text/javascript"></script>
<script src="<?php echo theme_url();?>/assets/layerslider/js/layerslider.kreaturamedia.jquery.js" type="text/javascript"></script>

<style>

    /*
        You can add your custom layer styles
        in the style attribute of the layer,
        to a style element or
        to an external css file
    */

    #layerslider * {
        font-family: Lato, 'BYekan', sans-serif;
    }

</style>
<div id="layerslider" style="width:100%;height:500px;">
    <div class="ls-slide" data-ls="transition2d:1;timeshift:-1000;">
        <img src="<?php echo theme_url();?>/assets/layerslider/img/fw-1.jpg" class="ls-bg" alt="Slide background"/>
        <img alt="slide-image" data-src="<?php echo theme_url();?>/assets/layerslider/img/vamera.png" src="<?php echo theme_url();?>/assets/layerslider/img/vamera.png" data-ls="offsetxin:0;easingin:easeInOutQuart;scalexin:0.7;scaleyin:0.7;offsetxout:-800;durationout:1000;" style="top: 124px; left: 845.5px;white-space: nowrap;" class="ls-l ls-preloaded">
        <p data-ls="durationin:2000;delayin:1500;easingin:easeOutElastic;rotatexin:-90;transformoriginin:50% top 0;durationout:1000;" style="top: 220px; left: 112.5px;font-weight: 300;height:40px;padding-right:10px;padding-left:10px;font-size:30px;line-height:37px;color:#ffffff;background:#82d10c;border-radius:3px;white-space: nowrap;" class="ls-l">BUY/SELL ANYTHING YOU WANT</p>
        <p data-ls="offsetxin:0;durationin:2000;delayin:2000;easingin:easeOutElastic;rotatexin:90;transformoriginin:50% top 0;offsetxout:-400;" style="top: 339px; left: 121.5px; font-family:'Indie Flower';font-size:31px;color:#6db509;white-space: nowrap;" class="ls-l">Lorem Ipsum dolor sit</p>
        <h1 style="top: 287px; left: 112.5px; font-weight: 900; padding: 0px 20px; font-family: Raleway; font-size: 24px; line-height: 40px; color: rgb(68, 68, 68); background: none repeat scroll 0% 0% rgb(255, 255, 255);white-space: nowrap;" class="ls-l">NEW STUFF - OLD STUFF - SERVICES - LOOKING FOR</h1>
        <img alt="slide-image" data-src="<?php echo theme_url();?>/assets/layerslider/img/discount.png" src="<?php echo theme_url();?>/assets/layerslider/img/discount.png" data-ls="delayin:1000;" style="top: 96px; left: 795.5px;white-space: nowrap;" class="ls-l ls-preloaded">
        <img class="ls-l ls-linkto-3" style="top:460px;left:610px;white-space: nowrap;" data-ls="offsetxin:-50;delayin:1000;rotatein:-40;offsetxout:-50;rotateout:-40;" src="<?php echo theme_url();?>/assets/layerslider/img/left.png" alt="slide-image">
        <img class="ls-l ls-linkto-2" style="top:460px;left:650px;white-space: nowrap;" data-ls="offsetxin:50;delayin:1000;offsetxout:50;" src="<?php echo theme_url();?>/assets/layerslider/img/right.png" alt="slide-image">
    </div>
    <div class="ls-slide" data-ls="transition2d:1;timeshift:-1000;">
        <img src="<?php echo theme_url();?>/assets/layerslider/img/fw-1.jpg" class="ls-bg" alt="Slide background"/>
        <img alt="slide-image" data-src="<?php echo theme_url();?>/assets/layerslider/img/business_hero.png" src="<?php echo theme_url();?>/assets/layerslider/img/business_hero.png" data-ls="offsetxin:0;easingin:easeInOutQuart;scalexin:0.7;scaleyin:0.7;offsetxout:-800;durationout:1000;" style="top: 124px; left: 700.5px;white-space: nowrap;" class="ls-l ls-preloaded">
        <p data-ls="durationin:2000;delayin:1500;easingin:easeOutElastic;rotatexin:-90;transformoriginin:50% top 0;durationout:1000;" style="top: 220px; left: 112.5px;font-weight: 300;height:40px;padding-right:10px;padding-left:10px;font-size:30px;line-height:37px;color:#ffffff;background:#f04705;border-radius:3px;white-space: nowrap;" class="ls-l">ALL YOUR FAVOURITE ELECTRONICS</p>
        <p data-ls="offsetxin:0;durationin:2000;delayin:2000;easingin:easeOutElastic;rotatexin:90;transformoriginin:50% top 0;offsetxout:-400;" style="top: 287px; left: 121.5px; font-family:'Indie Flower';font-size:31px;color:#f04705;white-space: nowrap;" class="ls-l">Lorem Ipsum dolor sit</p>
        <img class="ls-l ls-linkto-1" style="top:460px;left:610px;white-space: nowrap;" data-ls="offsetxin:-50;delayin:1000;rotatein:-40;offsetxout:-50;rotateout:-40;" src="<?php echo theme_url();?>/assets/layerslider/img/left.png" alt="slide-image">
        <img class="ls-l ls-linkto-3" style="top:460px;left:650px;white-space: nowrap;" data-ls="offsetxin:50;delayin:1000;offsetxout:50;" src="<?php echo theme_url();?>/assets/layerslider/img/right.png" alt="slide-image">
    </div>

    <div class="ls-slide" data-ls="transition2d:1;timeshift:-1000;">
        <img src="<?php echo theme_url();?>/assets/layerslider/img/fw-1.jpg" class="ls-bg" alt="Slide background"/>
        <img class="ls-l" style="top:129px;left:487px;white-space: nowrap;" data-ls="offsetxin:400;durationin:2000;offsetxout:400;" src="<?php echo theme_url();?>/assets/layerslider/img/d1.png" alt="slide-image">
        <img class="ls-l" style="top:104px;left:70px;white-space: nowrap;" data-ls="offsetxin:-200;durationin:2000;offsetxout:-200;" src="<?php echo theme_url();?>/assets/layerslider/img/d2.png" alt="slide-image">
        <p class="ls-l" style="top:320px;left:830px;font-weight: 300;height:40px;padding-right:10px;padding-left:10px;font-size:30px;line-height:37px;color:#ffffff;background:#544f8c;border-radius:3px;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:1500;easingin:easeOutElastic;rotatexin:-90;transformoriginin:50% top 0;offsetxout:-400;durationout:1000;">
            SELL ANYTHING
        </p>
        <p class="ls-l" style="top:360px;left:836px;font-family:'Indie Flower';font-size:31px;color:#544f8c;white-space: nowrap;" data-ls="offsetxin:0;durationin:2000;delayin:2000;easingin:easeOutElastic;rotatexin:90;transformoriginin:50% top 0;offsetxout:-600;">
            post your ad
        </p>
        <img class="ls-l ls-linkto-2" style="top:430px;left:960px;white-space: nowrap;" data-ls="offsetxin:-50;delayin:1000;offsetxout:-50;" src="<?php echo theme_url();?>/assets/layerslider/img/left.png" alt="slide-image">
        <img class="ls-l ls-linkto-1" style="top:430px;left:1000px;white-space: nowrap;" data-ls="offsetxin:50;delayin:1000;offsetxout:50;" src="<?php echo theme_url();?>/assets/layerslider/img/right.png" alt="slide-image">
    </div>
</div>
</div>

<!-- Initializing the slider -->
<script>
    var skins_path = '<?php echo theme_url();?>/assets/layerslider/skins/'
    jQuery("#layerslider").layerSlider({
        responsive: false,
        responsiveUnder: 1280,
        layersContainer: 1280,
        skin: 'noskin',
        hoverPrevNext: false,
        skinsPath: skins_path
    });
</script>