jQuery scrollTop viewport issue. How to add a custom value to position().top

[admin]

I'm developing a single page wordpress website. As it is a single page one I have used jQuery scrollTop for animating the menu. I want to go to specific div when I click on the corresponding menu link with div id..
Current Problem is the fixed positioned menu tab is crossing the content.. It shows over the div content (viewport issue).

I want to give a gap between this menu tab and div content for making the content fully visible.

jQuery code used for scrolling effect is as below:

$(document).ready(function() {

    $('a[href=#welcome]').click(function(){

     $('html, body').animate({scrollTop:$('#welcome').position().top}, 'slow');

     return false;

    });



});


$(document).ready(function() {

  $('a[href=#aboutus]').click(function(){
     $('html, body').animate({scrollTop:$('#aboutus').position().top}, 'slow');

     return false;

  });

});

What I need is to add some value like 200px to the above div's top position ".position().top}" so that I can scroll to a position below the top of the div...

Edit:"Sorry Guys... I made a mistake in above requirement.. I have to subtract a value from the div's top position so that I can scroll to a position above the top of the div.."

<br>How can i fix this? Any help will be appreciated..

Thanks in advance..