@@if(sliderNo === "one"){
    <!-- Begin Slider Area -->
    <div class="slider-area">

        <div class="quicky-element-carousel home-slider arrow-style" data-slick-options='{
                "slidesToShow": 1,
                "slidesToScroll": 1,
                "infinite": true,
                "arrows": true,
                "dots": false,
                "autoplay" : true,
                "fade" : true,
                "autoplaySpeed" : 7000,
                "pauseOnHover" : false,
                "pauseOnFocus" : false
                }' data-slick-responsive='[
                {"breakpoint":768, "settings": {
                "slidesToShow": 1
                }},
                {"breakpoint":575, "settings": {
                "slidesToShow": 1
                }}
            ]'>
            <div class="slide-item animation-style-01 bg-1">
                <div class="slider-progress"></div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="inner-slide">
                                <div class="slide-content">
                                    <h2>Basket Weave</h2>
                                    <p class="short-desc">Produce and supply various Handicraft items all over
                                        the world which were very attractive</p>
                                    <div class="slide-btn">
                                        <a class="quicky-btn horizontal-line_ltr" href="shop-left-sidebar.html">Discover Now!</a>
                                    </div>
                                </div>
                                <div class="slider-img">
                                    <img src="assets/images/slider/slider-product/1.png" alt="Slider Product">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="slide-item animation-style-02 bg-1">
                <div class="slider-progress"></div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="inner-slide">
                                <div class="slide-content">
                                    <h2>Basket Weave</h2>
                                    <p class="short-desc">Produce and supply various Handicraft items all over
                                        the world which were very attractive</p>
                                    <div class="slide-btn">
                                        <a class="quicky-btn horizontal-line_ltr" href="shop-left-sidebar.html">Discover Now!</a>
                                    </div>
                                </div>
                                <div class="slider-img">
                                    <img src="assets/images/slider/slider-product/2.png" alt="Slider Product">
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="slide-item animation-style-03 bg-1">
                <div class="slider-progress"></div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="inner-slide">
                                <div class="slider-img">
                                    <img src="assets/images/slider/slider-product/3.png" alt="Slider Product">
                                </div>
                                <div class="slide-content slide-content_right">
                                    <h2>Basket Weave</h2>
                                    <p class="short-desc">Produce and supply various Handicraft items all over
                                        the world which were very attractive</p>
                                    <div class="slide-btn">
                                        <a class="quicky-btn horizontal-line_ltr horizontal-line_rtl" href="shop-left-sidebar.html">Discover Now!</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <!-- Slider Area End Here -->
}
@@if(sliderNo === "two"){
    <!-- Begin Slider Area Two -->
    <div class="slider-area slider-area-2">

        <div class="quicky-element-carousel home-slider home-slider-2 arrow-style" data-slick-options='{
                "slidesToShow": 1,
                "slidesToScroll": 1,
                "infinite": true,
                "arrows": false,
                "dots": true,
                "autoplay" : true,
                "autoplaySpeed" : 7000,
                "pauseOnHover" : false,
                "pauseOnFocus" : false
                }' data-slick-responsive='[
                {"breakpoint":768, "settings": {
                "slidesToShow": 1
                }},
                {"breakpoint":575, "settings": {
                "slidesToShow": 1
                }}
            ]'>
            <div class="slide-item animation-style-01 position-relative bg-2">
                <div class="social-link social-link-2">
                    <ul>
                        <li class="facebook">
                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                            data-placement="left" title="Facebook">
                                Facebook
                            </a>
                        </li>
                        <li class="twitter">
                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank" data-placement="left" title="Twitter">
                                Twitter
                            </a>
                        </li>
                        <li class="instagram">
                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank" data-placement="left" title="Instagram">
                                Instagram
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="inner-slide">
                                <div class="slide-content">
                                    <h2 class="freestyle-script">Stylish & Dashing</h2>
                                    <p class="short-desc">Produce and supply various Handicraft items all over
                                        the world which were very attractive</p>
                                    <div class="slide-btn">
                                        <a class="quicky-btn horizontal-line_ltr" href="shop-left-sidebar.html">Shop Now!</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="slide-item animation-style-02 position-relative bg-3">
                <div class="social-link social-link-2">
                    <ul>
                        <li class="facebook">
                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                data-placement="left" title="Facebook">
                                Facebook
                            </a>
                        </li>
                        <li class="twitter">
                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                data-placement="left" title="Twitter">
                                Twitter
                            </a>
                        </li>
                        <li class="instagram">
                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank" data-placement="left"
                                title="Instagram">
                                Instagram
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="inner-slide">
                                <div class="slide-content">
                                    <h2 class="freestyle-script">Stylish & Dashing</h2>
                                    <p class="short-desc">Produce and supply various Handicraft items all over
                                        the world which were very attractive</p>
                                    <div class="slide-btn">
                                        <a class="quicky-btn horizontal-line_ltr" href="shop-left-sidebar.html">Shop Now!</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <!-- Slider Area Two End Here -->
}
@@if(sliderNo === "three"){
    <!-- Begin Slider Area Three -->
    <div class="slider-area-3">

        <div class="quicky-element-carousel home-slider home-slider-3 arrow-style" data-slick-options='{
                "slidesToShow": 1,
                "slidesToScroll": 1,
                "infinite": true,
                "arrows": false,
                "dots": true,
                "autoplay" : true,
                "autoplaySpeed" : 7000,
                "pauseOnHover" : false,
                "pauseOnFocus" : false,
                "vertical" : true
                }' data-slick-responsive='[
                {"breakpoint":768, "settings": {
                "slidesToShow": 1
                }},
                {"breakpoint":575, "settings": {
                "slidesToShow": 1
                }}
            ]'>
            <div class="slide-item animation-style-03 position-relative bg-4">
                <div class="social-link social-link-2">
                    <ul>
                        <li class="facebook">
                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                            data-placement="left" title="Facebook">
                                Facebook
                            </a>
                        </li>
                        <li class="twitter">
                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank" data-placement="left" title="Twitter">
                                Twitter
                            </a>
                        </li>
                        <li class="instagram">
                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank" data-placement="left" title="Instagram">
                                Instagram
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="inner-slide">
                                <div class="slider-img">
                                    <img src="assets/images/slider/slider-product/4.png" alt="Slider Product">
                                </div>
                                <div class="slide-content slide-content_right">
                                    <h2 class="freestyle-script">Stylish & Dashing</h2>
                                    <p class="short-desc">Produce and supply various Handicraft items all over
                                        the world which were very attractive</p>
                                    <div class="slide-btn">
                                        <a class="quicky-btn horizontal-line_ltr horizontal-line_rtl" href="shop-left-sidebar.html">Shop Now!</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="slide-item animation-style-02 position-relative bg-4">
                <div class="social-link social-link-2">
                    <ul>
                        <li class="facebook">
                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                data-placement="left" title="Facebook">
                                Facebook
                            </a>
                        </li>
                        <li class="twitter">
                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                data-placement="left" title="Twitter">
                                Twitter
                            </a>
                        </li>
                        <li class="instagram">
                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank" data-placement="left"
                                title="Instagram">
                                Instagram
                            </a>
                        </li>
                    </ul>
                </div>
                <div class="container">
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="inner-slide">
                                <div class="slider-img">
                                    <img src="assets/images/slider/slider-product/5.png" alt="Slider Product">
                                </div>
                                <div class="slide-content slide-content_right">
                                    <h2 class="freestyle-script">Stylish & Dashing</h2>
                                    <p class="short-desc">Produce and supply various Handicraft items all over
                                        the world which were very attractive</p>
                                    <div class="slide-btn">
                                        <a class="quicky-btn horizontal-line_ltr horizontal-line_rtl" href="shop-left-sidebar.html">Shop Now!</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>

    </div>
    <!-- Slider Area Three End Here -->
}
@@if(sliderNo === "four"){
    <!-- Begin Slider Area Four -->
    <div class="slider-area-4">

        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <div class="quicky-element-carousel home-slider home-slider-4 custom-dots" data-slick-options='{
                            "slidesToShow": 1,
                            "slidesToScroll": 1,
                            "infinite": true,
                            "arrows": false,
                            "dots": true,
                            "autoplay" : true,
                            "fade" : true,
                            "autoplaySpeed" : 7000,
                            "pauseOnHover" : false,
                            "pauseOnFocus" : false,
                            "appendArrows": ".slider-navigation"
                            }' data-slick-responsive='[
                            {"breakpoint":768, "settings": {
                            "slidesToShow": 1
                            }},
                            {"breakpoint":575, "settings": {
                            "slidesToShow": 1
                            }}
                        ]'>

                        <div class="slide-item animation-style-01 bg-5">
                            <div class="slider-progress"></div>
                            <div class="social-with_navigation">
                                <div class="social-link-3">
                                    <ul>
                                        <li class="facebook">
                                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Facebook">
                                                Fb
                                            </a>
                                        </li>
                                        <li class="twitter">
                                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Twitter">
                                                Tw
                                            </a>
                                        </li>
                                        <li class="instagram">
                                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Instagram">
                                                in
                                            </a>
                                        </li>
                                        <li class="google-plus">
                                            <a href="https://plus.google.com/" data-toggle="tooltip" target="_blank"
                                                title="Google Plus">
                                                G+
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="container">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="inner-slide">
                                            <div class="slide-content slide-content_absolute">
                                                <h2>Decoreted Time</h2>
                                                <p class="short-desc">Time is not visible  but it does not wait’s for any one, 
                                                        so make the proper use of time.</p>
                                                <div class="slide-btn">
                                                    <a class="quicky-btn vertical-line" href="shop-left-sidebar.html">Order Now</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="slide-item animation-style-03 bg-5">
                            <div class="slider-progress"></div>
                            <div class="social-with_navigation">
                                <div class="social-link-3">
                                    <ul>
                                        <li class="facebook">
                                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Facebook">
                                                Fb
                                            </a>
                                        </li>
                                        <li class="twitter">
                                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Twitter">
                                                Tw
                                            </a>
                                        </li>
                                        <li class="instagram">
                                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Instagram">
                                                in
                                            </a>
                                        </li>
                                        <li class="google-plus">
                                            <a href="https://plus.google.com/" data-toggle="tooltip" target="_blank"
                                                title="Google Plus">
                                                G+
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="container">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="inner-slide">
                                            <div class="slide-content slide-content_absolute">
                                                <h2>Decoreted Time</h2>
                                                <p class="short-desc">Time is not visible  but it does not wait’s for any one, 
                                                        so make the proper use of time.</p>
                                                <div class="slide-btn">
                                                    <a class="quicky-btn vertical-line" href="shop-left-sidebar.html">Order Now</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
            
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- Slider Area Four End Here -->
}
@@if(sliderNo === "five"){
    <!-- Begin Slider Area Five -->
    <div class="slider-area-5">

        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <div class="quicky-element-carousel home-slider custom-dots" data-slick-options='{
                            "slidesToShow": 1,
                            "slidesToScroll": 1,
                            "infinite": true,
                            "arrows": false,
                            "dots": true,
                            "autoplay" : true,
                            "fade" : true,
                            "autoplaySpeed" : 7000,
                            "pauseOnHover" : false,
                            "pauseOnFocus" : false,
                            "appendArrows": ".slider-navigation"
                            }' data-slick-responsive='[
                            {"breakpoint":768, "settings": {
                            "slidesToShow": 1
                            }},
                            {"breakpoint":575, "settings": {
                            "slidesToShow": 1
                            }}
                        ]'>

                        <div class="slide-item animation-style-01 bg-6">
                            <div class="slider-progress"></div>
                            <div class="social-with_navigation">
                                <div class="social-link-3">
                                    <ul>
                                        <li class="facebook">
                                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Facebook">
                                                Fb
                                            </a>
                                        </li>
                                        <li class="twitter">
                                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Twitter">
                                                Tw
                                            </a>
                                        </li>
                                        <li class="instagram">
                                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Instagram">
                                                in
                                            </a>
                                        </li>
                                        <li class="google-plus">
                                            <a href="https://plus.google.com/" data-toggle="tooltip" target="_blank"
                                                title="Google Plus">
                                                G+
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="container">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="inner-slide">
                                            <div class="slide-content">
                                                <h2>Decoreted Time</h2>
                                                <p class="short-desc">Time is not visible  but it does not wait’s for any one, 
                                                        so make the proper use of time.</p>
                                                <div class="slide-btn">
                                                    <a class="quicky-btn vertical-line titillium-font" href="shop-left-sidebar.html">Order Now</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="slide-item animation-style-03 bg-7">
                            <div class="slider-progress"></div>
                            <div class="social-with_navigation">
                                <div class="social-link-3">
                                    <ul>
                                        <li class="facebook">
                                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Facebook">
                                                Fb
                                            </a>
                                        </li>
                                        <li class="twitter">
                                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Twitter">
                                                Tw
                                            </a>
                                        </li>
                                        <li class="instagram">
                                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Instagram">
                                                in
                                            </a>
                                        </li>
                                        <li class="google-plus">
                                            <a href="https://plus.google.com/" data-toggle="tooltip" target="_blank"
                                                title="Google Plus">
                                                G+
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="container">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="inner-slide">
                                            <div class="slide-content">
                                                <h2>Decoreted Time</h2>
                                                <p class="short-desc">Time is not visible  but it does not wait’s for any one, 
                                                        so make the proper use of time.</p>
                                                <div class="slide-btn">
                                                    <a class="quicky-btn vertical-line" href="shop-left-sidebar.html">Order Now</a>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
            
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- Slider Area Five End Here -->
}
@@if(sliderNo === "six"){
    <!-- Begin Slider Area Six -->
    <div class="slider-area-6">

        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <div class="quicky-element-carousel home-slider custom-dots" data-slick-options='{
                            "slidesToShow": 1,
                            "slidesToScroll": 1,
                            "infinite": true,
                            "dots": true,
                            "autoplay" : true,
                            "fade" : true,
                            "autoplaySpeed" : 8000,
                            "pauseOnHover" : false,
                            "pauseOnFocus" : false
                            }' data-slick-responsive='[
                            {"breakpoint":768, "settings": {
                            "slidesToShow": 1
                            }},
                            {"breakpoint":575, "settings": {
                            "slidesToShow": 1
                            }}
                        ]'>

                        <div class="slide-item animation-style-04 bg-8">
                            <div class="slider-progress"></div>
                            <div class="social-with_navigation">
                                <div class="social-link-3">
                                    <ul>
                                        <li class="facebook">
                                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Facebook">
                                                Fb
                                            </a>
                                        </li>
                                        <li class="twitter">
                                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Twitter">
                                                Tw
                                            </a>
                                        </li>
                                        <li class="instagram">
                                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Instagram">
                                                in
                                            </a>
                                        </li>
                                        <li class="google-plus">
                                            <a href="https://plus.google.com/" data-toggle="tooltip" target="_blank"
                                                title="Google Plus">
                                                G+
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="container">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="inner-slide inner-slide-2">
                                            <div class="slider-img left-side_img">
                                                <img src="assets/images/slider/slider-product/6.png"
                                                    alt="Slider Product">
                                            </div>
                                            <div class="slide-content">
                                                <h2>Home Decore</h2>
                                                <p class="short-desc-2">Light is the way to cover the darkness which can help 
                                                        us to choose the right path and right dicision.</p>
                                                <div class="slide-btn">
                                                    <a class="quicky-btn vertical-line" href="shop-left-sidebar.html">Order Now</a>
                                                </div>
                                            </div>
                                            <div class="slider-img right-side_img">
                                                <img src="assets/images/slider/slider-product/7.png"
                                                    alt="Slider Product">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="slide-item animation-style-04 bg-8">
                            <div class="slider-progress"></div>
                            <div class="social-with_navigation">
                                <div class="social-link-3">
                                    <ul>
                                        <li class="facebook">
                                            <a href="https://www.facebook.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Facebook">
                                                Fb
                                            </a>
                                        </li>
                                        <li class="twitter">
                                            <a href="https://twitter.com" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Twitter">
                                                Tw
                                            </a>
                                        </li>
                                        <li class="instagram">
                                            <a href="https://www.instagram.com/" data-toggle="tooltip" target="_blank"
                                                data-placement="top" title="Instagram">
                                                in
                                            </a>
                                        </li>
                                        <li class="google-plus">
                                            <a href="https://plus.google.com/" data-toggle="tooltip" target="_blank"
                                                title="Google Plus">
                                                G+
                                            </a>
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div class="container">
                                <div class="row">
                                    <div class="col-lg-12">
                                        <div class="inner-slide inner-slide-2">
                                            <div class="slider-img left-side_img">
                                                <img src="assets/images/slider/slider-product/6.png"
                                                    alt="Slider Product">
                                            </div>
                                            <div class="slide-content">
                                                <h2>Home Decore</h2>
                                                <p class="short-desc-2">Light is the way to cover the darkness which can help 
                                                        us to choose the right path and right dicision.</p>
                                                <div class="slide-btn">
                                                    <a class="quicky-btn vertical-line"
                                                        href="shop-left-sidebar.html">Order Now</a>
                                                </div>
                                            </div>
                                            <div class="slider-img right-side_img">
                                                <img src="assets/images/slider/slider-product/7.png"
                                                    alt="Slider Product">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
            
                    </div>
                </div>
            </div>
        </div>

    </div>
    <!-- Slider Area Six End Here -->
}