diff --git a/app/views/applied_project/applied_join_project.js.erb b/app/views/applied_project/applied_join_project.js.erb
index 5d9f7f87a..f090cb485 100644
--- a/app/views/applied_project/applied_join_project.js.erb
+++ b/app/views/applied_project/applied_join_project.js.erb
@@ -1,3 +1,3 @@
 var htmlvalue = "<%= escape_javascript(render :partial => 'applied_join_project', locals: {:project_id => (@project.nil? ? nil : @project.id)}) %>";
-pop_box_new(htmlvalue,460,40,50);
+pop_box_new(htmlvalue,460,190);
 
diff --git a/app/views/applied_project/applied_project_info.js.erb b/app/views/applied_project/applied_project_info.js.erb
index ab3cb396d..c1cc6176d 100644
--- a/app/views/applied_project/applied_project_info.js.erb
+++ b/app/views/applied_project/applied_project_info.js.erb
@@ -2,4 +2,4 @@
 $("#join_in_project_applied").html('<%= escape_javascript( render :partial => 'projects/applied_status') %>');
 <% end %>
 var htmlvalue = "<%= escape_javascript(render :partial => 'applied_project/applied_project_tip') %>";
-pop_box_new(htmlvalue,380,40,50);
+pop_box_new(htmlvalue,380,166);
diff --git a/app/views/courses/_course_activity_users.html.erb b/app/views/courses/_course_activity_users.html.erb
index 8b4df3e83..67ec2ede9 100644
--- a/app/views/courses/_course_activity_users.html.erb
+++ b/app/views/courses/_course_activity_users.html.erb
@@ -3,9 +3,9 @@
       <ul class="rankList">
       <h3 style="font-size: 14px; font-weight: normal;">
         <% if (User.current.logged? && course.open_student == 1) || (User.current.member_of_course?(course)) || User.current.admin? %>
-            <%= link_to "班级活跃度", course_member_path(course, :role => 2, :sort_type => 'act_score'), :class => 'sy_cblack' %>
+            <%= link_to "班级活跃度", course_member_path(course, :role => 2, :sort_type => 'act_score'), :class => 'fontGrey3' %>
         <% else %>
-            班级活跃度
+            <span class="fontGrey7"> 班级活跃度 </span>
         <% end %>
         <a class="sy_cmore fr" onmouseover ="message_titile_show2($(this),event)" onmouseout ="message_titile_hide2($(this))" style="cursor: pointer; position:relative;">积分规则</a>
         <div class="cl"></div>
diff --git a/app/views/courses/_course_heroes.html.erb b/app/views/courses/_course_heroes.html.erb
index 4699c12d2..bd285f9b0 100644
--- a/app/views/courses/_course_heroes.html.erb
+++ b/app/views/courses/_course_heroes.html.erb
@@ -3,9 +3,9 @@
     <ul class="rankList">
       <h4 style="font-size: 14px; font-weight: normal;">
         <% if (User.current.logged? && course.open_student == 1) || (User.current.member_of_course?(course)) || User.current.admin? %>
-            <%= link_to "班级英雄榜", course_member_path(course, :role => 2), :class => 'sy_cblack' %>
+            <%= link_to "班级英雄榜", course_member_path(course, :role => 2), :class => 'fontGrey3' %>
         <% else %>
-            <span>班级英雄榜</span>
+            <span class="fontGrey7">班级英雄榜</span>
         <% end %>
         <a class="contributor_course" onmouseover ="message_titile_show2($(this),event)" onmouseout ="message_titile_hide2($(this))" style="cursor:pointer;">积分规则</a></h4>
       <div  style="cursor:pointer;" class="numIntro undis">
diff --git a/app/views/courses/join_private_courses.js.erb b/app/views/courses/join_private_courses.js.erb
index 14402a9ff..fc53970e4 100644
--- a/app/views/courses/join_private_courses.js.erb
+++ b/app/views/courses/join_private_courses.js.erb
@@ -1,2 +1,2 @@
 var htmlvalue = "<%= escape_javascript(render :partial => 'join_private_course') %>";
-pop_box_new(htmlvalue,460,40,50);
+pop_box_new(htmlvalue,460,220);
diff --git a/app/views/layouts/base_courses.html.erb b/app/views/layouts/base_courses.html.erb
index 2972045aa..86a0a5518 100644
--- a/app/views/layouts/base_courses.html.erb
+++ b/app/views/layouts/base_courses.html.erb
@@ -131,7 +131,7 @@
       <%# 课程英雄榜 %>
       <%= render :partial => 'courses/course_heroes', :locals => {:course => @course} %>
       <div class="sy_class_leftbox mb15" >
-        <h3>班级推荐</h3>
+        <h3 class="fontGrey7">班级推荐</h3>
         <%= render :partial => 'courses/recommendation', :locals => {:course => @course} %>
       </div>
     </div><!--sy_class_l end-->
diff --git a/public/javascripts/application.js b/public/javascripts/application.js
index 9841a20a7..fb6bb6864 100644
--- a/public/javascripts/application.js
+++ b/public/javascripts/application.js
@@ -1493,13 +1493,68 @@ function pop_up_box(value,tWidth,tTop,tLeft){
 }
 
 // 公共弹框样式
-function pop_box_new(value, Width, Top, Left){
+function pop_box_new(value, Width, Height){
+    w = ($(window).width() - Width)/2;
+    h = ($(window).height() - Height)/2;
     $("#ajax-modal").html(value);
     showModal('ajax-modal', Width + 'px');
     $('#ajax-modal').siblings().remove();
-    $('#ajax-modal').parent().css({"top": Top+"%","left": Left+"%","transform":"translate(-50%,-50%)","padding":"0","border":"none"});
+    $('#ajax-modal').parent().css({"top": h+"px","left": w+"px","padding":"0","border":"none","position":"fixed"});
     $('#ajax-modal').css({"padding":"0"});
+    $('#ajax-modal').parent().attr("id","popupWrap");
+
+    //拖拽
+    function Drag(id) {
+        this.div = document.getElementById(id);
+        if (this.div) {
+            this.div.style.cursor = "move";
+            this.div.style.position = "fixed";
+        }
+        this.disX = 0;
+        this.disY = 0;
+        var _this = this;
+        this.div.onmousedown = function (evt) {
+            _this.getDistance(evt);
+            document.onmousemove = function (evt) {
+                _this.setPosition(evt);
+            }
+            _this.div.onmouseup = function () {
+                _this.clearEvent();
+            }
+        }
+    }
+    Drag.prototype.getDistance = function (evt) {
+        var oEvent = evt || event;
+        this.disX = oEvent.clientX - this.div.offsetLeft;
+        this.disY = oEvent.clientY - this.div.offsetTop;
+    }
+    Drag.prototype.setPosition = function (evt) {
+        var oEvent = evt || event;
+        var l = oEvent.clientX - this.disX;
+        var t = oEvent.clientY - this.disY;
+        if (l <= 0) {
+            l = 0;
+        }
+        else if (l >= document.documentElement.clientWidth - this.div.offsetWidth) {
+            l = document.documentElement.clientWidth - this.div.offsetWidth;
+        }
+        if (t <= 0) {
+            t = 0;
+        }
+        else if (t >= document.documentElement.clientHeight - this.div.offsetHeight) {
+            t = document.documentElement.clientHeight - this.div.offsetHeight;
+        }
+        this.div.style.left = l + "px";
+        this.div.style.top = t + "px";
+    }
+    Drag.prototype.clearEvent = function () {
+        this.div.onmouseup = null;
+        document.onmousemove = null;
+    }
 
+    window.onload = function () {
+        new Drag("popupWrap");
+    }
 }
 
 // 公共提示弹框样式
diff --git a/public/stylesheets/css/common.css b/public/stylesheets/css/common.css
index cfbf83394..a06bc89ea 100644
--- a/public/stylesheets/css/common.css
+++ b/public/stylesheets/css/common.css
@@ -94,6 +94,7 @@ h4{ font-size:14px;}/*color:#3b3b3b;*/
 .flow_hidden{ width:300px;overflow:hidden; white-space: nowrap; text-overflow:ellipsis;}
 .white_space{white-space:nowrap;}
 .pr {position:relative;}
+
 .markPopup {width:290px; height:auto;  padding:5px 0px 15px 15px; background-color:#ffffff; z-index:1000;}
 .markInput { outline:none; border:1px solid #e6e6e6; height:30px; width:50px; color:#3d3c3c; margin-bottom:10px; text-align:center; margin-right:5px; padding-left:0;}
 .markPercentage {margin:10px 0; border:1px solid #e6e6e6; width:70px; height:30px; outline:none; font-size:12px; color:#3d3c3c;}
@@ -397,6 +398,7 @@ a:hover.c_grey{ color:#333;}
 .fontGrey4{color:#999999;}
 .fontGrey5 {color:#a1a1a1;}
 .fontGrey6 {color:#7a7a7a;}
+.fontGrey7 {color:#555;}
 .fontBlue {color:#3498db;}
 span.newsBlack {color:#4b4b4b; font-size:13px; font-weight:bold}
 a.underline {text-decoration:underline;}
@@ -404,6 +406,7 @@ a.fontBlue {color:#297fb8;}
 .fontBlue2 {color:#269ac9 !important;}
 a.fontGrey {color:#cecece;}
 a.fontGrey2 {color:#888888;}
+a.fontGrey3 {color:#555;}
 a.link-black {color:#000;}
 a.link-black:hover {color:#3b94d6;}
 a.link-blue {color:#3b94d6;}
diff --git a/public/stylesheets/css/public.css b/public/stylesheets/css/public.css
index 6712d5ef0..47d50b00e 100644
--- a/public/stylesheets/css/public.css
+++ b/public/stylesheets/css/public.css
@@ -262,7 +262,7 @@ div.flash.warning, .conflict {
 /*弹出框*/
 .black_overlay{display:none;position:fixed;top:0px;left:0px;width:100%;height:100%;background-color:black;z-index:1001;-moz-opacity:0.8;opacity:.80;filter:alpha(opacity=80);}
 .white_content{display:none;position:fixed;top:15%;left:30%;width:420px;height: auto; margin-bottom:20px;padding:16px;border:3px solid #269ac9;background-color:white;z-index:1002;overflow:auto;}
-.white_content02{display:none;position:fixed;top:15%;left:30%;width:200px;height: auto; margin-bottom:20px;padding:10px;border:3px solid #269ac9;background-color:white;z-index:1002;overflow:auto; width:456px;}
+.white_content02{display:none;position:fixed;top:25%;left:40%;width:200px;height: auto; margin-bottom:20px;padding:10px;border:3px solid #269ac9;background-color:white;z-index:1002;overflow:auto; width:456px;}
 .newhwork_content{ display:none;position:fixed;top:15%;left:30%;width:600px;height: auto; margin-bottom:20px;padding:16px;border:3px solid #269ac9;background-color:white;z-index:1002;overflow:auto;}
 .floatbox{ width:420px; border:3px solid #269ac9; background:#fff; padding:5px;}
 a.box_close{ display:block; float:right; width:16px; height:16px; background:url(../images/img_floatbox.png) 0 0 no-repeat;}
diff --git a/public/stylesheets/sy_public.css b/public/stylesheets/sy_public.css
index f52fc6699..42365faa4 100644
--- a/public/stylesheets/sy_public.css
+++ b/public/stylesheets/sy_public.css
@@ -4,7 +4,6 @@
 .sy_corange{ color: #ee4a1f;}
 .sy_f14{ font-size: 14px;}
 .sy_f16{ font-size: 16px;}
-a.sy_cgrey{ color: #888;}
 a:hover.sy_cgrey{ color:#ee4a1f;}
 a.sy_corange{ color: #ee4a1f; }
 a:hover.sy_corange{ text-decoration:underline;}
diff --git a/public/stylesheets/syllabus.css b/public/stylesheets/syllabus.css
index dad467c68..d0f8d0286 100644
--- a/public/stylesheets/syllabus.css
+++ b/public/stylesheets/syllabus.css
@@ -399,10 +399,10 @@ a:hover.sy_btn_orange{
 .accordion li > a {
     display: block;
     padding: 0 10px 0 40px;
-    height:49px;
+    height:45px;
     line-height:49px;
-    color: #333;
-    font-size:16px;
+    color: #555;
+    font-size:14px;
     background: #f8f8f8;
     border:1px solid #e5e5e5;
     border-bottom:none;
@@ -425,19 +425,19 @@ a:hover.sy_btn_orange{
     margin-top:15px;
     font-size:12px;
     padding: 0 10px;
-    background: #dbdbdb;
+    background: #ccc;
     -webkit-border-radius: 15px;
     -moz-border-radius: 15px;
     border-radius: 15px;
     margin-left:10px;
-    color: #333;
+    color: #888;
 }
 .accordion > li:hover > a span,
 .accordion > li:target > a span,
 .accordion > li > a.active span {
     margin-left:10px;
-    color: #333;
-    background: #dbdbdb;
+    color: #888;
+    background: #ccc;
 }
 /* Images */
 .accordion > li > a:before {