 <% if Heroes.filter('Active',1) %>     
        <section id="hero">
            <div class="cycle-slideshow"
                        data-cycle-slides=".hero"
                        data-cycle-pager-template='<span class=""></span>'
                        data-speed="3000"
            >
                <% loop Heroes.filter('Active',1).sort('SortOrder') %>
                        <div style="background-image:url('{$BackgroundImage.URL}')" class="hero">
                            <div class="container">
                            <div class="row">
                            <div class="col-lg-7 col-md-7 col-sm-12 col-xs-12">
                                <div class="hero-content">
                                <% if Content %>
                                    $Content
                                <% end_if %>
                               </div><!--//hero-content-->
                            <% if HeroLink %><a href="$HeroLink.Link" class="hero-link"></a><% end_if %>
                                </div><!--//col--></div><!--//row--></div><!--//container-->
                        </div>   <!--//hero-->         

                <% end_loop %>
            <div class="cycle-pager"></div><!--hero_nav-->    
            </div><!--//cycle-slideshow-->
        </section><!--//#hero-->
    <% end_if %>
<div id="main">
    <section id="products" class="section-standard">
        <div class="container">
        <div class="row">
            <div class="col col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h2>Products<span class="marker"></span></h2>        
            </div><!--//col-->
        </div><!--//row-->
        <div class="product-grid">
        <div class="row">
            
                <% if TopProducts %>
                    
                    <% loop TopProducts %>
                        <div class="col col-lg-4 col-md-6 col-sm-6 col-xs-12">
                            <div class="product"><div class="product-chevron" style="background-image:url('{$Thumbnail.URL}')"></div>
                                <h3><a href="products/#{$URLSegment}">$Title</a></h3>
                        <p>$Teaser</p>
                        <p class="product-footer"><a href="products/#{$URLSegment}" class="link-arrow">Learn More</a></p></div><!--//col-->
                    </div><!--//product-->
                        <% end_loop %>
                       
                    <% end_if %>
                <!--<div class="product">
                    <h3>Castables</h3>
                    <p>to suit all applications requiring an Aluminum Silicate product</p>
                    <p class="product-footer"><a href="products/#product-id" class="link-arrow">Learn More</a></p>    
                </div>--><!--//product-->
           
        </div><!--//row-->
        </div><!--//product-grid-->     
        </div><!--//container-->
    </section><!--//#section-->
    
    <section id="industries" class="section-band">
        <div class="container">
        <div class="row">
        <div class="col col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h2>The Industries We Serve</h2>     
                <p>&nbsp;</p>
        </div><!--//col-->
       </div><!--//row-->
        <div class="row">
        <div class="col col-lg-12 col-md-12 col-sm-12 col-xs-12">
             <% if TopIndustries %>
                    
                    <% loop TopIndustries %>
                        
                         <div class="promo $URLSegment">
                             <div class="promo-icon" style="background-image:url('{$Icon.URL}')"></div>
                            <a href="{$BaseHref}industries/$URLSegment">$Title <span class="arrow"></span></a>
                        </div><!--//promo-->
                    <% end_loop %>
            <% end_if %>
        
             </div><!--//col-->
       </div><!--//row-->
        </div><!--//container-->
    </section><!--//#industries-->
    
    <section id="about" class="section-standard">    
    <div class="container">
        <div class="row">
            <div class="col col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <h2>About RSS Dixie<span class="marker"></span></h2>    
             </div><!--//col-->
        </div><!--//row-->
         <div class="row">
              <div class="col col-lg-8 offset-lg-2 col-md-8 offset-md-2 col-sm-12 col-xs-12">    
                $Content
                  <p class="text-center"><a href="about" class="btn">Learn more about us</a></p>
            </div><!--//col-->
        </div><!--//row-->
    </div><!--//container-->
    </section><!--//about-->
    <!--
    <section id="clients" class="section-scroller">

                    <h2>Proudly Trusted By:</h2>
                 <div id="scroller-clients" class="scroller">
                   <% loop TopClients %>
                       <div class="scroller-item">
                           <% if Link %>
                               <a href="$Link" target="_blank">$Logo</a>
                               <% else %>
                           $Logo
                            <% end_if %>       
                       </div>
                    <% end_loop %>   
                     
                     
                 </div>

    </section>-->
</div><!--//#main-->
            
<script type="text/javascript">
(function($) {
    $(document).ready(function()
    {
        $('#scroller-clients').slick({
            infinite:true,
          centerMode: true,
          centerPadding: '60px',
          slidesToShow: 5,
          autoplay:true,
          autoplaySpeed:3000,
          mobileFirst:true,
          responsive: [
    {
      breakpoint: 1024,
      settings: {
        arrows: true,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 5
      }
    },
   {
      breakpoint: 768,
      settings: {
        arrows: true,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 3
      }
    },
    {
      breakpoint: 480,
      settings: {
        arrows: true,
        centerMode: true,
        centerPadding: '40px',
        slidesToShow: 1
      }
    }
  ]
 
        });
    });
})(jQuery);
</script> 
