[ooosmileooo]

Всем привет.
У меня есть такой код:

<div class="view-sour"><a href="#" data-index="1" style="
    border: 5px solid #55555d;
    border-radius: 30px;
    display: inline-block;
    margin: 7px 0px 0px 0px;
    background: url(http://www.potolkoff.in.ua/wp-content/uploads/2016/07/swirl_pattern.png);
    color: black;
    width: 100%;
    height: 200px;
    padding-top: 58px;
    font-size: 33px;
">Матовые</a>
<div class="mm1">
<h1><b>Матовые</b></h1>
<h4 style="text-align: center;">Подходит для ценителей классики. Благодаря матовому полотну, можно получить ярко-белый, идеально ровный потолок без швов и шероховатостей.</h4>[envira-gallery id="83"]
<h3><b style="color: black; font-size: 21px;">Понравился такой потолок? Рассчитай и закажи звонок!</b></h3>
<a class="btn_m1" href="#section-10" target="_self">Рассчитать</a></div>
</div>

Таких блоков у меня 7 штук. Есть скрипт:

jQuery(function(){
    jQuery('.view-sour .mm1').hide();
    $a = jQuery('.view-sour > a');
    $a.on('click', function(event) {
      event.preventDefault();
      $a.not(this).next().slideUp(500);
      $a.not(this).removeClass('open');
      jQuery(this).next().slideToggle(500);
      jQuery(this).toggleClass('open');
      if(jQuery(this).hasClass('open')) {
       jQuery('html, body').animate({
         scrollTop: jQuery(this).offset().top - 63 + 'px'
     }, 2000);
     return false;
      }
    });
});

Проблема в том, что не правильно работает скролл. Я хочу, что бы после нажатия на див, автоматически скролилось к диву внутреннего блока. а что-то не выходит(
Вот сайт, кому интересно: potolkoff.in.ua