Sticky header with smooth scroll

Hi,

i′m creatign custom theme with sticky header after scroll and also with smooth scroll to an anchor. Website: https://startupweb.sk/

First time the page loads (or when the page is entirely at the top) and I click on page – ?o robíme or portfolio (doesn′t matter) page scroll down but header overlaps title. When I scroll with mouse and then I press menu items, page scroll to anchor link perfect. Only when page si entirely at the top, scrolling ins′t perfect.

Code for sticky header:

$(function() {
var stickyNavTop = $('.navigation').offset().top;

var stickyNav = function(){
var scrollTop = $(window).scrollTop();

if (scrollTop > stickyNavTop) {
    $('.navigation').addClass('sticky');
} else {
    $('.navigation').removeClass('sticky');
}
};

stickyNav();

$(window).scroll(function() {
    stickyNav();
});

});

Code for smooth scroll:

$(function() {
  $('a[href*="#"]:not([href="#"])').click(function() {
    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) {
      var target = $(this.hash);
      target = target.length ? target : $('[name=' + this.hash.slice(1) +']');
      if (target.length) {
        $('html, body').animate({
          scrollTop: target.offset().top -60
        }, 1000);
        return false;
      }
    }
  });
});

Please, could you help me and give me some advice what should i change.
Thanks