Bootstrap Affix issue in synapsis

gistfile1.rb

vinod@vinod-Satellite-C50-A:~/projects/synapsify-webapp$ git diff
diff --git a/app/assets/javascripts/application.js b/app/assets/javascripts/application.js
index df6e0d8..63f1cd1 100644
--- a/app/assets/javascripts/application.js
+++ b/app/assets/javascripts/application.js
@@ -38,3 +38,4 @@
 //= analysisHeader
 //= uploadForm
 //= require_tree
+//= require bootstrap/affix
diff --git a/app/assets/stylesheets/reports.css.scss b/app/assets/stylesheets/reports.css.scss
index 79260ec..bcd8ed9 100644
--- a/app/assets/stylesheets/reports.css.scss
+++ b/app/assets/stylesheets/reports.css.scss
@@ -42,6 +42,11 @@
     margin-top: 15px;
   }
 
+.affix-bottom {
+    position: relative;
+}
+
+
   #show-filters {
     position: absolute;
     left: 0px;
diff --git a/app/views/reports/show.html.erb b/app/views/reports/show.html.erb
index 63b597f..4eed440 100644
--- a/app/views/reports/show.html.erb
+++ b/app/views/reports/show.html.erb
@@ -70,8 +70,7 @@
 
 <div class="container-fluid">
 
-       <!-- <div id="show-filters" class="text-muted" title="Show Filters"><%= image_tag 'hamburger.png', :style => 'height:20px;'%></i></div> -->
-       <div class="col-md-2 comment-filter" id="filters" data-spy="affix" data-offset-top="326">
+       <div class="col-md-2 comment-filter affix" id="filters" data-spy="affix" data-offset-top="800" data-offset-top="400">
                <!-- <div id="hide-filters" class="text-muted" title="Hide Filters"><%= image_tag 'hamburger.png', :style => 'height:20px;'%></div> -->
                <h4>Filter comments:</h4>
                <form role="form">

Along with above changes we have add below files in our app
    vendor/assets/javascripts/bootstrap-affix.js
    vendor/assets/javascripts/bootstrap.js
    vendor/assets/stylesheets/bootstrap.css