diff --git a/core/static/css/base/amadeus.css b/core/static/css/base/amadeus.css
index 08ffbad..61b1dde 100644
--- a/core/static/css/base/amadeus.css
+++ b/core/static/css/base/amadeus.css
@@ -30,7 +30,7 @@
     margin: 10% 10% 5% 5%;
 }
 .breadcrumb{
-    margin-bottom: 5px;
+    margin-bottom: 25px;
 }
 .courseHome{
     text-align: center;
@@ -398,14 +398,18 @@ ul, li {
 /* Icon Topic */
 .divMoreActions {text-align: right; height: 39px; float: right;}
 .divMoreActions div button {padding-left: 10px; padding-right: 10px; padding-bottom: 10px; margin-bottom: 4px; height: 31px;}
-.headingOne {padding-top: 0px; padding-bottom: 50px;}
-.headingTwo {padding-top: 0px; padding-bottom: 50px;}
-.course{padding-top: 0px; padding-bottom: 0px; cursor:move; }
 .titleTopic {padding-top: 18px; padding-left: 0px;}
-.titleTopic-detail {padding-top: 8px;}
+.titleTopic-detail {padding-top: 8px;  color: white;}
 .titleTopic a h4 {margin-top: 0px; color: white; cursor:pointer;}
 .dropdown-menu .pull-right {
     right: 0;
   }
 .moreAccordion{ padding-left: 0px; padding-right: 0px;}
-.moreAccordion div button{ padding-left: 0px; padding-right: 0px;}
\ No newline at end of file
+.moreAccordion div button{ padding-left: 0px; padding-right: 0px;}
+.cards-content{ padding-left: 0px; padding-right: 0px; }
+.cards-detail{margin-left: 4%;}
+.cards-detail .panel .panel-heading{background-color:#81D4FA;}
+.cards-detail .panel .panel-heading h4{color:black;}
+.subject{ padding-top: 0px; padding-bottom: 0px; }
+.course{padding-top: 0px; padding-bottom: 0px;}
+.course-detail{padding-top: 10px; padding-bottom: 10px;}
\ No newline at end of file
diff --git a/courses/static/js/course.js b/courses/static/js/course.js
index a84e7a2..ca72c68 100644
--- a/courses/static/js/course.js
+++ b/courses/static/js/course.js
@@ -77,13 +77,4 @@ function replicate_course(url, course) {
             $(".course_replicate_form").html(data);
         }
     });
-}
-$(".caret-square").on('click', function(){
-    if( $(this).attr('title') == 'less'){
-      $(this).attr('title','more');
-      jQuery(this).html("<i class='fa fa-caret-square-o-up fa-2x' aria-hidden='true'></i>");
-    }else{
-      $(this).attr('title','less');
-      jQuery(this).html("<i class='fa fa-caret-square-o-down fa-2x' aria-hidden='true'></i>");
-    }
-  });
\ No newline at end of file
+}
\ No newline at end of file
diff --git a/courses/templates/course/course_card.html b/courses/templates/course/course_card.html
index 31bd5df..f0935b0 100644
--- a/courses/templates/course/course_card.html
+++ b/courses/templates/course/course_card.html
@@ -1,48 +1,45 @@
 {% load static i18n permission_tags %}
 {% load django_bootstrap_breadcrumbs %}
-
-<div class="panel-group ui-accordion ui-widget ui-helper-reset ui-sortable" id="accordion-{{course.slug}}" role="tablist" aria-multiselectable="false">
-    <div class="group">
-		<div class="panel panel-info">
-		    <div class="panel-heading course" role="tab" >
-		      <div class="row">
-                                <div class="col-md-1 moreAccordion" data-toggle="collapse" data-parent="#accordion-{{course.slug}}" href=".collapseOne-{{course.slug}}" aria-expanded="false" aria-controls="collapseOne-{{course.slug}}">
-                                    <button class="btn btn-default btn-sm caret-square"><i class="fa fa-caret-square-o-down fa-2x" aria-hidden="true"></i></button>
-                                </div>
-		        <div class="col-xs-9 col-md-4 titleTopic">
-                                    <a role="button" href="{% url 'course:view' course.slug %}">
-                                        <h4>{{course.name}}</h4>
-                                    </a>
-		        </div>
-		        {% if user|has_role:'professor' or user|has_role:'system_admin' %}
-		        <div class="col-xs-4 col-md-6 divMoreActions" >
-		            <div class="btn-group">
-		              <button class="btn btn-default btn-sm dropdown-toggle" type="button" id="moreActions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
-		                <i class="fa fa-ellipsis-v fa-2x" aria-hidden="true"></i>
-		               </button>
-		              <ul class="dropdown-menu pull-right" aria-labelledby="moreActions">
-		                <li><a href="{% url 'course:replicate_course' course.slug %}"><i class="fa fa-files-o fa-fw" aria-hidden="true"></i>{% trans 'Replicate' %}</a></li>
-		                <li><a href="javascript:delete_course('{% url 'course:delete' course.slug %}', '{{ course.slug }}', '{% trans "Are you sure you want to delete this course?" %}', '{% url 'course:manage' %}')"><i class="fa fa-trash fa-fw" aria-hidden="true"></i>&nbsp;{% trans 'Remove' %}</a></li>
-		              </ul>
-		            </div>
-		        </div>
-		        {% endif %}
-		      </div>
-		    </div>
-		    <div class="panel-collapse collapseOne-{{course.slug}} collapse in" role="tabpanel" aria-labelledby="headingOne" aria-expanded="true" aria-hidden="false" tabindex="0">
-		      <div class="panel-body">
-		        <p><b>Course Name: </b>{{course.name}}</p>
-		        <p><b>Coordinator: </b>{{course.professors.all.0}}</p>
-		        <p>
-		          <b>Description:</b>
-		          <i>
-		            {{course.content}}
-		          </i>
-		        </p>
-		      </div>
-		    </div>
-		</div>
-	</div>
+<div class="group">
+    <div class="panel panel-info">
+        <div class="panel-heading course">
+          <div class="row">
+            <div class="col-md-1 moreAccordion" data-toggle="collapse" data-parent="#accordion-{{course.slug}}" href=".collapseOne-{{course.slug}}" aria-expanded="false" aria-controls="collapseOne-{{course.slug}}">
+                <button class="btn btn-default btn-sm caret-square"><i class="fa fa-caret-square-o-down fa-2x" aria-hidden="true"></i></button>
+            </div>
+            <div class="col-xs-9 col-md-4 titleTopic">
+              <a role="button" href="{% url 'course:view' course.slug %}">
+                  <h4>{{course.name}}</h4>
+              </a>
+            </div>
+            {% if user|has_role:'professor' or user|has_role:'system_admin' %}
+            <div class="col-xs-4 col-md-6 divMoreActions" >
+                <div class="btn-group">
+                  <button class="btn btn-default btn-sm dropdown-toggle" type="button" id="moreActions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                    <i class="fa fa-ellipsis-v fa-2x" aria-hidden="true"></i>
+                   </button>
+                  <ul class="dropdown-menu pull-right" aria-labelledby="moreActions">
+                    <li><a href="{% url 'course:replicate_course' course.slug %}"><i class="fa fa-files-o fa-fw" aria-hidden="true"></i>{% trans 'Replicate' %}</a></li>
+                    <li><a href="javascript:delete_course('{% url 'course:delete' course.slug %}', '{{ course.slug }}', '{% trans "Are you sure you want to delete this course?" %}', '{% url 'course:manage' %}')"><i class="fa fa-trash fa-fw" aria-hidden="true"></i>&nbsp;{% trans 'Remove' %}</a></li>
+                  </ul>
+                </div>
+            </div>
+            {% endif %}
+          </div>
+        </div>
+        <div class="panel-collapse collapseOne-{{course.slug}} collapse in" role="tabpanel" aria-labelledby="headingOne" aria-expanded="true" aria-hidden="false" tabindex="0">
+          <div class="panel-body">
+            <p><b>Course Name: </b>{{course.name}}</p>
+            <p><b>Coordinator: </b>{{course.professors.all.0}}</p>
+            <p>
+              <b>Description:</b>
+              <i>
+                {{course.content}}
+              </i>
+            </p>
+          </div>
+        </div>
+    </div>
 </div>
 
 <div class="modal fade" id="replicateCourse" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
diff --git a/courses/templates/course/index.html b/courses/templates/course/index.html
index 5fd8413..f8e703b 100644
--- a/courses/templates/course/index.html
+++ b/courses/templates/course/index.html
@@ -70,7 +70,7 @@
 		{% endfor %}
 	{% endif %}
 
-<div class="col-md-12">
+<div class="col-md-12 cards-content">
 	<form id="searchform" action="{% url 'course:manage' %}" method="get" accept-charset="utf-8">
 		<div class="input-group">
 		  <div class="form-group is-empty">
@@ -86,7 +86,7 @@
 
 
 </fieldset>
-	<div class="col-md-12">
+	<div class="col-md-12 cards-content">
 		{% if courses|length > 0 %}
 			{% if request.GET.category == 'all' or none or request.GET.category == '' %}
 				{% for course in list_courses %}
@@ -104,27 +104,6 @@
 			{% trans 'No courses found' %}
 		{% endif %}
 	</div>
-	<div class="col-md-12">
-		<nav aria-label="Page navigation">
-			<ul class="pagination">
-				{% if page_obj.has_previous %}
-				    <li>
-				        <a href="?page={{ page_obj.previous_page_number }}"><span><<</span></a>
-				    </li>
-				{% endif %}
-			    {% for page_number in paginator.page_range %}
-					<li{% if page_obj.number == page_number %} class="active"{% endif %}>
-	    				<a href="?page={{ page_number }}">{{ page_number }}</a>
-					</li>
-				{% endfor %}
-				{% if page_obj.has_next %}
-				    <li>
-				        <a href="?page={{ page_obj.next_page_number }}"><span>>></span></a>
-				    </li>
-				{% endif %}
-			</ul>
-		</nav>
-	</div>
 
 	<script type="text/javascript" src="{% static 'js/course.js' %}"></script>
 {% endblock %}
diff --git a/courses/templates/course/view.html b/courses/templates/course/view.html
index 054e2d1..1f48513 100644
--- a/courses/templates/course/view.html
+++ b/courses/templates/course/view.html
@@ -19,7 +19,7 @@
 {% endblock %}
 
 {% block sidebar %}
-  <div class="panel panel-primary navigation">
+  <div class="panel panel-primary">
         <div class="panel-heading">
             <h5>{% trans 'Menu' %}</h5>
         </div>
@@ -38,15 +38,15 @@
 
 {% block content %}
 
-  <div class="col-md-12">
+  <div class="col-md-12 cards-content">
     <div class="panel panel-info">
-      <div class="panel-heading headingOne">
+      <div class="panel-heading course-detail">
         <div class="row">
-          <div class="col-xs-8 col-md-10 titleTopic">
-            <h4>{{course}}</h4>
+          <div class="col-xs-8 col-md-4 .titleTopic-detail">
+            <h4>{{course.name}}</h4>
           </div>
           {% if user|has_role:'professor' and user in course.professors or user|has_role:'system_admin' %}
-            <div class="col-xs-4 col-md-2" id="divMoreActions">
+            <div class="col-xs-4 col-md-8" id="divMoreActions">
               <div class="btn-group">
                 <button class="btn btn-default btn-sm dropdown-toggle" type="button" id="moreActions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                   <i class="fa fa-ellipsis-v fa-2x" aria-hidden="true"></i>
@@ -74,7 +74,7 @@
 
     </div>
   </div>
- 
+
 <!-- MODAL CREATE SUBJECT -->
 <div class="modal" tabindex="-1" role="dialog  " id="createSubject">
   <div class="modal-dialog">
@@ -121,19 +121,22 @@
   </div>
 </div>
 </div>
-<div>
+<div class="cards-detail">
     {% if request.GET.category == 'all' or none or request.GET.category == '' %}
       {% for subject in subjects %}
         <div class="panel panel-info panel_{{ subject.id }}">
-          <div class="panel-heading headingTwo ui-sortable-handle" role="tab">
+          <div class="panel-heading heading_{{subject.id}} subject ui-sortable-handle">
             <div class="row">
-                <div class="col-xs-9 col-md-10 titleTopic">
-                  <a role="button" data-toggle="collapse" data-parent="#accordion" href=".collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
-                  <h4 style="color:white">{{subject.name}}</h4>
+                <div class="col-md-1 moreAccordion" data-toggle="collapse" data-parent="#accordion-{{subject.slug}}" href=".collapseSubject-{{subject.slug}}" aria-expanded="false" aria-controls="collapseSubject-{{subject.slug}}">
+                  <button class="btn btn-default btn-sm caret-square"><i class="fa fa-caret-square-o-down fa-2x" aria-hidden="true"></i></button>
+                </div>
+                <div class="col-xs-9 col-md-4 titleTopic">
+                  <a role="button" href="{% url 'course:view_subject' subject.slug %}">
+                    <h4>{{subject.name}}</h4>
                   </a>
                 </div>
                 {% if user|has_role:'professor' and user in subject.professors or user|has_role:'system_admin' %}
-                  <div class="col-xs-3 col-md-2" id="divMoreActions">
+                  <div class="col-xs-3 col-md-6" id="divMoreActions">
                     <div class="btn-group">
                       <button class="btn btn-default btn-sm dropdown-toggle" type="button" id="moreActions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                         <i class="fa fa-ellipsis-v fa-2x" aria-hidden="true"></i>
@@ -153,40 +156,44 @@
                 {% endif %}
             </div>
           </div>
-          <div class="panel-body">
-              <p><b>{% trans "Professor" %}: </b>{% for professor in subject.professors.all %}{% if not forloop.first %},{% endif %}
-                {{professor}}{% if forloop.last %}.{% endif %}{% endfor %}</p>
-                <p>
-                  <b>{% trans "Description" %}: </b>
-                  <i>
-                    {{subject.description}}
-                  </i>
-                </p>
-                <div class="row">
-                  <div class="col-xs-6 col-md-6">
-                    <p><b>{% trans "Begining" %}: </b>{{subject.init_date}}</p>
-                  </div>
-                  <div class="col-xs-6 col-md-6">
-                    <p><b>{% trans "End" %}: </b>{{subject.end_date}}</p>
-                  </div>
+          <div class="panel-collapse collapseSubject-{{subject.slug}} collapse in" aria-labelledby="heading_{{subject.id}}" aria-expanded="true" aria-hidden="false">
+           <div class="panel-body">
+            <p><b>{% trans "Professor" %}: </b>{% for professor in subject.professors.all %}{% if not forloop.first %},{% endif %}
+              {{professor}}{% if forloop.last %}.{% endif %}{% endfor %}</p>
+              <p>
+                <b>{% trans "Description" %}: </b>
+                <i>
+                  {{subject.description}}
+                </i>
+              </p>
+              <div class="row">
+                <div class="col-xs-6 col-md-6">
+                  <p><b>{% trans "Begining" %}: </b>{{subject.init_date}}</p>
                 </div>
-                <a href="{% url 'course:view_subject' subject.slug %}" class="btn btn-raised btn-default center-block view_btn" {% if user|show_subject_subscribe:subject %}style="display:none"{% endif %}>{% trans 'View Subject' %}<div class="ripple-container"></div></a>
-            </div>
+                <div class="col-xs-6 col-md-6">
+                  <p><b>{% trans "End" %}: </b>{{subject.end_date}}</p>
+                </div>
+              </div>
+          </div>
+         </div>
         </div>
       {% endfor %}
   {% else %}
         {% for subject in subjects_category %}
             {% if subject.category.name == request.GET.category %}
               <div class="panel panel-info panel_{{ subject.id }}">
-          <div class="panel-heading headingTwo ui-sortable-handle" role="tab">
-            <div class="row">
-                <div class="col-xs-9 col-md-10 titleTopic">
-                  <a role="button" data-toggle="collapse" data-parent="#accordion" href=".collapseTwo" aria-expanded="true" aria-controls="collapseTwo">
-                  <h4 style="color:white">{{subject.name}}</h4>
-                  </a>
-                </div>
+               <div class="panel-heading heading_{{subject.id}} subject ui-sortable-handle" role="tab">
+                <div class="row">
+                 <div class="col-md-1 moreAccordion" data-toggle="collapse" data-parent="#accordion-{{subject.slug}}" href=".collapseSubject-{{subject.slug}}" aria-expanded="false" aria-controls="collapseSubject-{{subject.slug}}">
+                  <button class="btn btn-default btn-sm caret-square"><i class="fa fa-caret-square-o-down fa-2x" aria-hidden="true"></i></button>
+                 </div>
+                 <div class="col-xs-9 col-md-4 titleTopic">
+                   <a role="button" href="{% url 'course:view_subject' subject.slug %}">
+                    <h4>{{subject.name}}</h4>
+                   </a>
+                 </div>
                 {% if user|has_role:'professor' and user in subject.professors or user|has_role:'system_admin' %}
-                  <div class="col-xs-3 col-md-2" id="divMoreActions">
+                  <div class="col-xs-3 col-md-6" id="divMoreActions">
                     <div class="btn-group">
                       <button class="btn btn-default btn-sm dropdown-toggle" type="button" id="moreActions" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                         <i class="fa fa-ellipsis-v fa-2x" aria-hidden="true"></i>
@@ -205,7 +212,8 @@
                 {% endif %}
             </div>
           </div>
-          <div class="panel-body">
+          <div class="panel-collapse collapseSubject-{{subject.slug}} collapse in" aria-labelledby="heading_{{subject.id}}" aria-expanded="true" aria-hidden="false">
+           <div class="panel-body">
               <p><b>{% trans "Professor" %}: </b>{% for professor in subject.professors.all %}{% if not forloop.first %},{% endif %}
                 {{professor}}{% if forloop.last %}.{% endif %}{% endfor %}</p>
                 <p>
@@ -222,8 +230,8 @@
                     <p><b>{% trans "End" %}: </b>{{subject.end_date}}</p>
                   </div>
                 </div>
-                <a href="{% url 'course:view_subject' subject.slug %}" class="btn btn-raised btn-default center-block view_btn" {% if user|show_subject_subscribe:subject %}style="display:none"{% endif %}>{% trans 'View Subject' %}<div class="ripple-container"></div></a>
             </div>
+           </div>
         </div>
             {% endif %}
         {% endfor %}
diff --git a/courses/templates/subject/index.html b/courses/templates/subject/index.html
index 10d9ce4..58c252a 100644
--- a/courses/templates/subject/index.html
+++ b/courses/templates/subject/index.html
@@ -17,7 +17,7 @@
 {% endblock %}
 
 {% block sidebar %}
-	<div class="panel panel-primary navigation">
+	<div class="panel panel-primary">
         <div class="panel-heading">
             <h5>{% trans 'Menu' %}</h5>
         </div>
--
libgit2 0.21.2