diff --git a/media/avatars/groups/default.png b/media/avatars/groups/default.png
index f2554d8660..17725015dc 100644
Binary files a/media/avatars/groups/default.png and b/media/avatars/groups/default.png differ
diff --git a/media/css/seahub.css b/media/css/seahub.css
index 931d174853..245f293054 100644
--- a/media/css/seahub.css
+++ b/media/css/seahub.css
@@ -1749,6 +1749,9 @@ textarea:-moz-placeholder {/* for FF */
     height:80px;
 }
 /* group, org */
+.group-hl {
+    background:#fbfbfb;
+}
 .group-list,
 .user-list {
     margin-top:30px;
@@ -1761,7 +1764,9 @@ textarea:-moz-placeholder {/* for FF */
     margin:0 17px 30px 0;
 }
 .group-list .group {
-	margin-bottom:25px;
+    width:310px;
+    padding:10px;
+	margin-bottom:20px;
 }
 .group-list .group,
 .user-list .user {
@@ -1772,6 +1777,9 @@ textarea:-moz-placeholder {/* for FF */
     color:#333;
     width:250px;
 }
+.group .txt {
+    width:240px;
+}
 .group h4 {
     margin:0 0 4px;
 }
@@ -1785,16 +1793,12 @@ textarea:-moz-placeholder {/* for FF */
 }
 .group .fast .a {
     font-size:18px;
-    color:#FEAC74;
-    margin-right:5px;
+    margin:8px 12px 0 0;
     display:inline-block;
     vertical-align:middle;
     line-height:24px;
     height:24px;
 }
-.group .fast .discuss {
-    margin-top:-2px; /* for vertical alignment */
-}
 .group .fast .a:hover {
     text-decoration:none;
 }
diff --git a/seahub/group/templates/group/groups.html b/seahub/group/templates/group/groups.html
index e495a2b01f..8a6270309b 100644
--- a/seahub/group/templates/group/groups.html
+++ b/seahub/group/templates/group/groups.html
@@ -22,9 +22,11 @@
 
 $('.group').hover(
 	function() {
+        $(this).addClass('group-hl'); 
 		$('.fast', $(this)).removeClass('vh');
 	},
 	function() {
+        $(this).removeClass('group-hl'); 
 		$('.fast', $(this)).addClass('vh');
 	}
 );
diff --git a/seahub/group/templates/group/groups_right_panel.html b/seahub/group/templates/group/groups_right_panel.html
index 5f9abb1673..e12efba8f5 100644
--- a/seahub/group/templates/group/groups_right_panel.html
+++ b/seahub/group/templates/group/groups_right_panel.html
@@ -7,16 +7,16 @@
 <ul class="group-list w100 ovhd">
     {% for group in joined_groups %}
     <li class="group ovhd">
-    <a href="{{ SITE_ROOT }}group/{{ group.props.id }}/" class="no-deco fleft" title="{{ group.props.group_name }}">{% grp_avatar group.props.id 56 %}</a>
+    <a href="{{ SITE_ROOT }}group/{{ group.props.id }}/" class="no-deco fleft" title="{{ group.props.group_name }}">{% grp_avatar group.props.id 48 %}</a>
     <div class="txt fright">
         <h4><a href="{% url 'group_info' group.props.id %}">{{ group.props.group_name }}</a></h4>
         <p><span class="item-name">{% trans "Creator: " %}</span>{{ group.props.creator_name }}</p>
         <p><span class="item-name">{% trans "Time: "%}</span>{{ group.props.timestamp|tsstr_sec }}</p>
         <div class="fast vh">
-            <a href="{% url 'group_info' group.props.id %}" title="{% trans "Libraries" %}" class="a"><span class="sf2-icon-archive"></span></a>
-            <a href="{% url 'group_discuss' group.props.id %}" title="{% trans "Discussion" %}" class="a discuss"><span class="icon-comment"></span></a>
+            <a href="{% url 'group_info' group.props.id %}" title="{% trans "Libraries" %}" class="a"><img src="{{MEDIA_URL}}img/lib.png" alt="" /></a>
+            <a href="{% url 'group_discuss' group.props.id %}" title="{% trans "Discussion" %}" class="a"><img src="{{MEDIA_URL}}img/msgs.png" alt="" /></a>
             {% if group.wiki_enabled %}
-            <a href="{% url 'group_wiki' group.props.id %}" title="{% trans "Wiki" %}" class="a"><span class="icon-book"></span></a>
+            <a href="{% url 'group_wiki' group.props.id %}" title="{% trans "Wiki" %}" class="a"><img src="{{MEDIA_URL}}img/wiki.png" alt="" /></a>
             {% endif %}
         </div>
     </div>