diff --git a/src/DotNetMashup.Web/Views/Home/Index.cshtml b/src/DotNetMashup.Web/Views/Home/Index.cshtml
index ebd2201..d0a2293 100644
--- a/src/DotNetMashup.Web/Views/Home/Index.cshtml
+++ b/src/DotNetMashup.Web/Views/Home/Index.cshtml
@@ -31,27 +31,35 @@
 
 @section scripts{
     <script type="text/javascript">
-        var page = @Model.CurrentPage;
-        $('img').addClass('img-responsive');
-        var loading = false;
-        $(window).on('scroll', function () {
-            var y_scroll_pos = window.pageYOffset +615;
-            var loadingImage = $('.loadWheel')
-            var loadingPosition = $('footer');
-            var scroll_pos_test = loadingPosition.position().top;
-            if (y_scroll_pos >= scroll_pos_test && loading === false) {
-                loading = true
-                loadingImage.show();
-                $.ajax('/Home/Tiles', {data:{page:page+1}})
-                .done(function(data){
-                    page++;
-                    loading = false;
-                    loadingImage.hide();
-                    var resd = $(data);
-                    resd.find('img').addClass('img-responsive');
-                    $('#tilesContainer').append(resd);
-                });
-            }
+        $(document).ready(function(){
+            var page = @Model.CurrentPage;
+            $('img').addClass('img-responsive');
+            $('.tile').addClass('show');
+            var loading = false;
+            $(window).on('scroll', function () {
+                var loadingImage = $('.loadWheel');
+                var tile = $('.tile').last();
+                if($(window).scrollTop() + tile.height() + 150 >= tile.position().top && !loading )  {
+                    loading = true
+                    loadingImage.show();
+                    $.ajax('/Home/Tiles', {data:{page:page+1}})
+                    .done(function(data){
+                        page++;
+                        loading = false;
+                        loadingImage.hide();
+                        var resd = $(data);
+                        resd.find('img').addClass('img-responsive');
+                        $('#tilesContainer').append(resd).find('.tile').addClass('show');
+                        
+                    })
+                    .error(function(){
+                        loadingImage.hide();
+                    });
+                }
+            });
+
+
         });
+       
     </script>
 }
\ No newline at end of file
diff --git a/src/DotNetMashup.Web/Views/Shared/DisplayTemplates/GithubAnnouncement.cshtml b/src/DotNetMashup.Web/Views/Shared/DisplayTemplates/GithubAnnouncement.cshtml
index 9afa454..f4e831b 100644
--- a/src/DotNetMashup.Web/Views/Shared/DisplayTemplates/GithubAnnouncement.cshtml
+++ b/src/DotNetMashup.Web/Views/Shared/DisplayTemplates/GithubAnnouncement.cshtml
@@ -6,7 +6,7 @@
             <div class="col-md-2"><img class="img-responsive img" src="@Model.Author.ImageUrl" /></div>
             <div class="col-md-10">
                 <h2><i class="fa fa-github" style="font-size:32px"></i> @Model.Author.Name</h2>
-                <h2><a href="@Model.OriginalLink">#@Model.IssueNumber @Model.Title</a></h2>
+                <h2 class="breakword"><a href="@Model.OriginalLink">#@Model.IssueNumber @Model.Title</a></h2>
             </div>
         </div>
         <hr />
diff --git a/src/DotNetMashup.Web/Views/Shared/_Layout.cshtml b/src/DotNetMashup.Web/Views/Shared/_Layout.cshtml
index d76dffd..0f0058d 100644
--- a/src/DotNetMashup.Web/Views/Shared/_Layout.cshtml
+++ b/src/DotNetMashup.Web/Views/Shared/_Layout.cshtml
@@ -11,7 +11,7 @@
 </head>
 <body>
     <div class="headerwrap">
-        <h2 style="color: #FFFFFF; text-align:center;">ASP.NET News Mashups</h2>
+        <h2 class="head"><a asp-action="Index">ASP.NET News Mashups</a></h2>
     </div>
     <div class="container body-content">
         @RenderBody()
diff --git a/src/DotNetMashup.Web/wwwroot/css/site.css b/src/DotNetMashup.Web/wwwroot/css/site.css
index e24e53c..3185fb2 100644
--- a/src/DotNetMashup.Web/wwwroot/css/site.css
+++ b/src/DotNetMashup.Web/wwwroot/css/site.css
@@ -7,6 +7,15 @@
     -moz-box-shadow: 7px 10px 20px -7px rgba(0,0,0,0.75);
     box-shadow: 7px 10px 20px -7px rgba(0,0,0,0.75);
     padding: 5px;
+    -moz-transition: opacity .5s ease-in;
+    -o-transition: opacity .5s ease-in;
+    -webkit-transition: opacity .5s ease-in;
+    transition: opacity .5s ease-in;
+    opacity: 0;
+}
+.tile.show{
+
+   opacity: 1;
 }
 
 body {
@@ -60,4 +69,11 @@ code, pre {
     white-space: pre-wrap; /* css-3 */
     -ms-word-wrap: break-word;
     word-wrap: break-word; /* Internet Explorer 5.5+ */
-}
\ No newline at end of file
+}
+.head{
+    color: #FFFFFF; text-align:center;
+
+}
+a.head, a:hover, a:visited{
+     color: #FFFFFF; text-align:center;
+}
