diff --git a/groups/new-homepage-3/homepage3-js-css.html b/groups/new-homepage-3/homepage3-js-css.html
index 1bb1d6d..6516b9e 100644
--- a/groups/new-homepage-3/homepage3-js-css.html
+++ b/groups/new-homepage-3/homepage3-js-css.html
@@ -86,12 +86,26 @@ img {
 
 /* style the hours */
 .hours {
-        text-align:right;
-        border-top: solid white 0px !important;
+        text-align:center;
 }
 
-.date {
-        border-top: solid white 0px !important;
+.padding-0 {
+        padding-left: 5px;
+        padding-right: 5px;
+        flex:1 1 auto;
+        display: flex;
+}
+
+.equal {
+  display: -webkit-box;
+  display: -moz-box;
+  display: -ms-flexbox;
+  display: -webkit-flex;
+  display: flex;
+}
+
+.panel {
+  flex:1 0 100%;
 }
 
 /* style the yamm menu */
@@ -127,25 +141,28 @@ img {
 /* End of Yamm */
 </style>
 
+<!-- the configuration file for the hours widget -->
 <script type="text/javascript" src="//libapps.s3.amazonaws.com/sites/2365/include/hours.js"></script>
 
+<!-- the code for the hours widget -->
 <script type="text/javascript">
 window.onload = function () {
         const h = JSON.parse(hours)
-        const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
+        const options_weekday = { weekday: 'short' };
+        const options_date = { month: 'short', day: 'numeric' }
         for (var i = 0; i < h.length; i++) {
                 let targetDate = new Date(h[i]["Date"] + "T00:00:00.000-05:00");
                 let today = new Date();
                 if (targetDate.getFullYear() === today.getFullYear() &&
                     targetDate.getMonth() === today.getMonth() &&
                     targetDate.getDate() === today.getDate()) {
-                           document.getElementById('hours0').innerHTML = "<td class='hours col-xs-7'>" + targetDate.toLocaleDateString("en-US", options) + "</td><td class='date col-xs-5'>" + h[i]["Hours"] + "</td>"
+                           document.getElementById('hours0').innerHTML = "<p>" +targetDate.toLocaleDateString("en-US", options_weekday) + "<br />" +targetDate.toLocaleDateString("en-US", options_date) + "</p><p>" + h[i]["Hours"] + "</p>"
                            var start = true;
-                           var count = 1
-                } else if (start === true && count < 7) {
-                        document.getElementById('hours' + count).innerHTML = "<td class='hours col-xs-7'>" + targetDate.toLocaleDateString("en-US", options) + "</td><td class='date col-xs-5'>" + h[i]["Hours"] + "</td>"
-                        count++
-                 }
+                           var count = 1;
+                } else if (start === true && count < 5) {
+                        document.getElementById('hours' + count).innerHTML = "<p>" +targetDate.toLocaleDateString("en-US", options_weekday) + "<br />" +targetDate.toLocaleDateString("en-US", options_date) + "</p><p>" + h[i]["Hours"] + "</p>"
+                        count++;
+                };
         };
 };
 </script>
diff --git a/groups/new-homepage-3/homepage3-template.html b/groups/new-homepage-3/homepage3-template.html
index c8b681f..42e0c5b 100644
--- a/groups/new-homepage-3/homepage3-template.html
+++ b/groups/new-homepage-3/homepage3-template.html
@@ -134,20 +134,48 @@
                                         </div>
                                        <div class="panel panel-default hide-body-border">
                                                <div class="panel-heading show-panel">
-                                                       <span class="panel-title content-panel-title">LIbrary Hours</span>
+                                                       <span class="panel-title content-panel-title">Upcoming Library Hours</span>
                                                </div>
                                                <div class="panel-body">
-                                                       <table class="table">
-                                                               <tbody>
-                                                                       <tr id="hours0"></tr>
-                                                                       <tr id="hours1"></tr>
-                                                                       <tr id="hours2"></tr>
-                                                                       <tr id="hours3"></tr>
-                                                                       <tr id="hours4"></tr>
-                                                                       <tr id="hours5"></tr>
-                                                                       <tr id="hours6"></tr>
-                                                               </tbody>
-                                                       </table>
+                                                       <div class="row equal">
+                                                               <div class="col-md-1 padding-0"></div>
+                                                               <div class="col-md-2 padding-0">
+                                                                        <div class="panel panel-default">
+                                                                               <div class="panel-body hours-panel-body">
+                                                                                      <span id="hours0" class="hours"></span>
+                                                                               </div>
+                                                                       </div>
+                                                               </div>
+                                                               <div class="col-md-2 padding-0">
+                                                                       <div class="panel panel-default">
+                                                                               <div class="panel-body hours-panel-body">
+                                                                                      <span id="hours1" class="hours"></span>
+                                                                               </div>
+                                                                       </div>
+                                                               </div>
+                                                               <div class="col-md-2 padding-0">
+                                                                       <div class="panel panel-default">
+                                                                               <div class="panel-body hours-panel-body">
+                                                                                       <span id="hours2" class="hours"></span>
+                                                                               </div>
+                                                                       </div>
+                                                               </div>
+                                                               <div class="col-md-2 padding-0">
+                                                                       <div class="panel panel-default">
+                                                                               <div class="panel-body hours-panel-body">
+                                                                                       <span id="hours3" class="hours"></span>
+                                                                               </div>
+                                                                       </div>
+                                                               </div>
+                                                               <div class="col-md-2 padding-0">
+                                                                       <div class="panel panel-default">
+                                                                               <div class="panel-body hours-panel-body">
+                                                                                       <span id="hours4" class="hours"></span>
+                                                                               </div>
+                                                                       </div>
+                                                               </div>
+                                                               <div class="col-md-1 padding-0"></div>
+                                                       </div>
                                                </div>
                                         </div>
                                 </div>