$(document).on('ready', function() {
        $(".center").slick({
          slidesToShow: 5,
          slidesToScroll: 1,
          autoplay: true,
          autoplaySpeed: 2000,
          
          responsive: [
            {
              breakpoint: 769,
              settings: {
                arrows: false,
                centerMode: true,
                centerPadding: '0',
                slidesToShow: 4
              }
            },
            {
              breakpoint: 480,
              settings: {
                arrows: false,
                centerMode: true,
                centerPadding: '0',
                slidesToShow: 2
              }
          }
         ]
      
        });
        
      });
      
      
      
       // Scroll reveal settings
        window.sr = ScrollReveal({
            scale: 1,
            duration: 1000,
            distance: '50px',
            easing: 'ease-in-out',
            delay: 200,
        });
        // Turn aniamtions off globally
        var animations = true;
        // All selectors to animate, either in sequence or per item
        scrollRevealSelectors = {
            single: [
                '.animation'
            ]
        };

        // use rotation in reveal configuration
        function scrollAnimations() {

            // Animate single elements
            sr.reveal('.animation');
        }
        $(window).on('load', function () {
            if (animations) {
                scrollAnimations();
            }
        });
        
        
        
        var Canvas = document.getElementById('canvas');
        var ctx = Canvas.getContext('2d');

        var resize = function() {
            Canvas.width = Canvas.clientWidth;
            Canvas.height = Canvas.clientHeight;
        };
        window.addEventListener('resize', resize);
        resize();

        var elements = [];
        var presets = {};

        presets.o = function (x, y, s, dx, dy) {
            return {
                x: x,
                y: y,
                r: 12 * s,
                w: 5 * s,
                dx: dx,
                dy: dy,
                draw: function(ctx, t) {
                    this.x += this.dx;
                    this.y += this.dy;

                    ctx.beginPath();
                    ctx.arc(this.x + + Math.sin((50 + x + (t / 10)) / 100) * 3, this.y + + Math.sin((45 + x + (t / 10)) / 100) * 4, this.r, 0, 2 * Math.PI, false);
                    ctx.lineWidth = this.w;
                    ctx.strokeStyle = '#a1d79d';
                    ctx.stroke();
                }
            }
        };

        presets.x = function (x, y, s, dx, dy, dr, r) {
            r = r || 0;
            return {
                x: x,
                y: y,
                s: 20 * s,
                w: 5 * s,
                r: r,
                dx: dx,
                dy: dy,
                dr: dr,
                draw: function(ctx, t) {
                    this.x += this.dx;
                    this.y += this.dy;
                    this.r += this.dr;

                    var _this = this;
                    var line = function(x, y, tx, ty, c, o) {
                        o = o || 0;
                        ctx.beginPath();
                        ctx.moveTo(-o + ((_this.s / 2) * x), o + ((_this.s / 2) * y));
                        ctx.lineTo(-o + ((_this.s / 2) * tx), o + ((_this.s / 2) * ty));
                        ctx.lineWidth = _this.w;
                        ctx.strokeStyle = c;
                        ctx.stroke();
                    };

                    ctx.save();

                    ctx.translate(this.x + Math.sin((x + (t / 10)) / 100) * 5, this.y + Math.sin((10 + x + (t / 10)) / 100) * 2);
                    ctx.rotate(this.r * Math.PI / 180);

                    line(-1, -1, 1, 1, '#fec514');
                    line(1, -1, -1, 1, '#fec514');

                    ctx.restore();
                }
            }
        };

        for(var x = 0; x < Canvas.width; x++) {
            for(var y = 0; y < Canvas.height; y++) {
                if(Math.round(Math.random() * 8000) == 1) {
                    var s = ((Math.random() * 5) + 1) / 10;
                    if(Math.round(Math.random()) == 1)
                        elements.push(presets.o(x, y, s, 0, 0));
                    else
                        elements.push(presets.x(x, y, s, 0, 0, ((Math.random() * 3) - 1) / 10, (Math.random() * 360)));
                }
            }
        }

        setInterval(function() {
            ctx.clearRect(0, 0, Canvas.width, Canvas.height);

            var time = new Date().getTime();
            for (var e in elements)
                        elements[e].draw(ctx, time);
        }, 10);
        
        
 
        if ($('.menu-bar').length) {
            $('.menu-bar').addClass('original').clone().insertAfter('.menu-bar').addClass('cloned').css('position','fixed').css('top','0').css('margin-top','0').css('z-index','500').removeClass('original').hide();
            function stickIt() {
                var orgElementPos = $('.original').offset();
                orgElementTop = orgElementPos.top;               
                if ($(window).scrollTop() >= (orgElementTop)) {
                    // scrolled past the original position; now only show the cloned, sticky element.

                    // Cloned element should always have same left position and width as original element.     
                    orgElement = $('.original');
                    coordsOrgElement = orgElement.offset();
                    leftOrgElement = coordsOrgElement.left;  
                    widthOrgElement = orgElement.css('width');
                    $('.cloned').css('left',leftOrgElement+'px').css('top',0).css('width',widthOrgElement).show();
                    $('.original').css('visibility','hidden');
                } else {
                    // not scrolled past the menu; only show the original menu.
                    $('.cloned').hide();
                    $('.original').css('visibility','visible');
                }
            }
            scrollIntervalID = setInterval(stickIt, 10);
        }     
    
        $('.tab-fix').click(function(){
            $('html, body').animate({
                    scrollTop: $( $(this).attr('href') ).offset().top
            }, 1000);
            return false;
            
        });
        $('.tab-fix').click(function(){
            $('.tab-fix').removeClass("active");
            $(this).addClass("active");
            });