<div id="layerslider" class="row" style="height:643px;position:relative; z-index:0;">
                    
<div class="ls-layer">
<img src="<?php bloginfo('template_directory'); ?>/img/banner/1.jpg" class="ls-bg" alt="">
</div>
<div class="ls-layer">
<img src="<?php bloginfo('template_directory'); ?>/img/banner/2.jpg" class="ls-bg" alt="">
</div>
<div class="ls-layer">
<img src="<?php bloginfo('template_directory'); ?>/img/banner/3.jpg" class="ls-bg" alt="">
</div>

</div>




<!-- LayerSlider -->
	<link rel="stylesheet" href="<?php bloginfo('template_directory'); ?>/js/slider/layerslider.css">
    <script src="<?php bloginfo('template_directory'); ?>/js/slider/jquery-easing-1.3.js"></script>
    <!--<script src="<?php bloginfo('template_directory'); ?>/js/slider/jquery-transit-modified.js"></script>
    <script src="<?php bloginfo('template_directory'); ?>/js/slider/layerslider.transitions.js"></script>-->
    <script src="<?php bloginfo('template_directory'); ?>/js/slider/layerslider.kreaturamedia.jquery.js"></script>
    <script type='text/javascript'>
    jQuery('#layerslider').layerSlider({
        skinsPath : '<?php bloginfo('template_directory'); ?>/js/slider/ls_skins/',
        skin : 'fullwidth', /* default, fullwidth */
        thumbnailNavigation : 'disabled', /* disabled, hover */
        hoverPrevNext : false,
        responsive : true,
        responsiveUnder : 1068,
        sublayerContainer : 1068,
        navStartStop:false,
        imgPreload:true,
		autoStart               : true,
    firstLayer              : 1,
    twoWaySlideshow         : false,
    randomSlideshow         : false,
    keybNav                 : true,
    touchNav                : true,
    navPrevNext             : true,
    navButtons              : true,
    tnWidth                 : 100,
    tnHeight                : 60,
    tnContainerWidth        : '60%',
    tnActiveOpacity         : 35,
    tnInactiveOpacity       : 100,
    hoverBottomNav          : false,
    pauseOnHover            : false,
    globalBGColor           : 'transparent',
    globalBGImage           : false,
    animateFirstLayer       : false,
    yourLogo                : false,
    yourLogoStyle           : 'position: absolute; z-index: 1001; left: 10px; top: 10px;',
    yourLogoLink            : false,
    yourLogoTarget          : '_blank',
    loops                   : 0,
    forceLoopNum            : true,
    autoPlayVideos          : true,
    autoPauseSlideshow      : 'auto',
    youtubePreview          : 'maxresdefault.jpg',
    showBarTimer        : false,
    showCircleTimer     : true,
    slideDirection          : 'right',
    slideDelay              : 10000,
    durationIn              : 1000,
    durationOut             : 1000,
    easingIn                : 'easeInOutQuint',
    easingOut               : 'easeInOutQuint',
    delayIn                 : 0,
    delayOut                : 0
    });
    </script>
<!-- /LayerSlider -->