diff --git a/app/Resources/public/css/base.css b/app/Resources/public/css/base.css
index 9671e4db82..b97663488f 100644
--- a/app/Resources/public/css/base.css
+++ b/app/Resources/public/css/base.css
@@ -6138,9 +6138,30 @@ div#chat-remote-video video {
 .filler-report .filler-report-data-init{
   width: 60%;
 }
+#hot-course .items-course{
+  padding: 10px;
+  border: 1px solid #e6e6e6;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  min-height: 350px;
+  margin-bottom: 10px;
+}
+#hot-course .items-course .items-course-info .title{
+  font-size: 14px;
+  min-height: 32px;
+}
+#hot-course .items-course .items-course-info .teachers{
+  font-size: 12px;
+  color: #666666;
+}
+#hot-course .items-course .items-course-info .ranking{
+  font-size: 10px;
+  color: #666666;
+}
 #whoisonline .items-user{
   text-align: center;
-  //border:1px solid #dddddd;
+  /*border:1px solid #dddddd; */
   padding: 15px;
   border-radius: 4px;
   -moz-border-radius: 4px;
diff --git a/main/inc/lib/course.lib.php b/main/inc/lib/course.lib.php
index 6ec462c420..ceda783856 100755
--- a/main/inc/lib/course.lib.php
+++ b/main/inc/lib/course.lib.php
@@ -4459,10 +4459,12 @@ class CourseManager
 
         $result = Database::query($sql);
         $courses = array();
+
         if (Database::num_rows($result)) {
             $courses = Database::store_result($result, 'ASSOC');
             $courses = self::process_hot_course_item($courses, $my_course_code_list);
         }
+
         return $courses;
     }
 
diff --git a/main/template/default/layout/hot_course_item.tpl b/main/template/default/layout/hot_course_item.tpl
index e7ba6bf993..d3560bc129 100755
--- a/main/template/default/layout/hot_course_item.tpl
+++ b/main/template/default/layout/hot_course_item.tpl
@@ -3,20 +3,21 @@
                     <div class="col-md-4">
                         <div class="items-course">
                             <div class="items-course-image">
-                                <img class="image-responsive" src="{{ hot_course.extra_info.course_image_large }}" alt="{{ hot_course.extra_info.title|e }}"/>
+                                <img class="img-responsive" src="{{ hot_course.extra_info.course_image_large }}" alt="{{ hot_course.extra_info.title|e }}"/>
                             </div>
-                        </div>
-                        <div class="items-course-info">
-                            <h4 class="title">{{ hot_course.extra_info.title}}</h4>
-                            <div class="teachers">{{ hot_course.extra_info.teachers }}</div>
-                            <div class="ranking">
-                                {{ hot_course.extra_info.rating_html }}
-                            </div>
-                            <div class="toolbar">
-                                {{ hot_course.extra_info.description_button }}
-                                {{ hot_course.extra_info.go_to_course_button }}
-                                {{ hot_course.extra_info.register_button }}
-                                {{ hot_course.extra_info.unsubscribe_button }}
+                            <div class="items-course-info">
+                                <h4 class="title">
+                                    <a title="{{ hot_course.extra_info.title}}" href="{{ hot_course.extra_info.course_public_url }}">{{ hot_course.extra_info.title}}</a>
+                                </h4>
+                                <div class="teachers">{{ hot_course.extra_info.teachers }}</div>
+                                <div class="ranking">
+                                    {{ hot_course.extra_info.rating_html }}
+                                </div>
+                                <div class="toolbar">
+                                    {{ hot_course.extra_info.description_button }}
+                                    {{ hot_course.extra_info.register_button }}
+                                    {{ hot_course.extra_info.unsubscribe_button }}
+                                </div>
                             </div>
                         </div>
                     </div>
diff --git a/main/template/default/layout/hot_courses.tpl b/main/template/default/layout/hot_courses.tpl
index 7d158dd47b..ce59c82c82 100755
--- a/main/template/default/layout/hot_courses.tpl
+++ b/main/template/default/layout/hot_courses.tpl
@@ -33,7 +33,7 @@ $(document).ready( function() {
             {% endif %}
         </h4>
     </div>
-    <div class="hot-course-body">
+    <div id="hot-course">
         <div class="row">
             {% include template ~ '/layout/hot_course_item.tpl' %}
         </div>