diff --git a/app/Resources/public/css/base.css b/app/Resources/public/css/base.css
index 3db036fee6..ef2953f53b 100644
--- a/app/Resources/public/css/base.css
+++ b/app/Resources/public/css/base.css
@@ -75,6 +75,9 @@ select {
   margin-top: 10px;
   margin-bottom: 10px;
 }
+#login_block #formLogin .form-group{
+  display: none;
+}
 #login_block .nav-pills{
   margin-bottom: 5px;
   padding-top: 10px;
@@ -135,7 +138,7 @@ ul#navigation {
   position: fixed;
   margin: 0px;
   padding: 0px;
-  top: 200px;
+  top: 280px;
   right: -10px;
   list-style: none;
   z-index:9999;
@@ -277,60 +280,6 @@ ul#navigation .report a {
 .session-group .items-session li{
     padding-bottom: 5px;
 }
-#main .nav .dropdown {
-  width:150px;
-  text-align: right;
-}
-#main .nav .dropdown:nth-child(n) {
-  width:auto;
-}
-.course-items .title{
-  margin-top: 0px;
-}
-label, input, button, select, textarea, p {
-    font-size: inherit;
-}
-.badge-group {
-    width: 200px;
-    position: relative;
-}
-.badge-group .badge {
-    float:left;
-    position:relative;
-}
-.badge-group  > :first-child {
-    z-index: 1000;
-}
-.badge-group  > :nth-child(2) {
-    z-index: 900;
-}
-.badge-group  > :nth-child(3) {
-    z-index: 800;
-}
-.badge-group  > :nth-child(4) {
-    z-index: 700;
-}
-.badge-group  > :nth-child(5) {
-    z-index: 600;
-}
-.badge-group .badge:not(:first-child) {
-    margin-left: -13px;
-    padding-left: 15px;
-}
-/* fixes the * */
-span.form_required  {
-    padding-right:5px;
-}
-form .formw {
-    margin-left: 170px;
-}
-form .form-button-login{
-  margin-top: 5px;
-}
-form .formw input {
-    float:left;
-}
-
 .formw input[type="checkbox"], .formw input[type="radio"] {
     margin-right: 5px;
     margin-top: 2px;
@@ -398,134 +347,6 @@ form .formw input {
 .actions fieldset {
     margin-top:0px;
 }
-#friend-container .thumbnail {
-    min-height: 140px;
-}
-#friend-container .thumbnail img {
-    max-height: 100px;
-}
-[dir=rtl] #friends > .thumbnails > li {
-    float: right;
-}
-.show-grid [class*="span"] {
-    background-color: #EEEEEE;
-    border-bottom-left-radius: 3px;
-    border-bottom-right-radius: 3px;
-    border-top-left-radius: 3px;
-    border-top-right-radius: 3px;
-    line-height: 30px;
-    min-height: 30px;
-    text-align: center;
-}
-
-a.tag {
-    background-color: #E0EAF1;
-    border-bottom: 1px solid #3E6D8E;
-    border-right: 1px solid #7F9FB6;
-    color: #3E6D8E;
-    font-size: 90%;
-    line-height: 2.4;
-    margin: 2px 2px 2px 0;
-    padding: 3px 4px;
-    text-decoration: none;
-    white-space: nowrap;
-}
-
-/* User portal */
-
-#settings h4 {
-    margin-bottom:10px;
-}
-
-/* Admin index.php */
-#settings .span6 {
-    min-height: 340px;
-    width: 47%;
-}
-#settings .span6 .well_border{
-    min-height: 300px;
-}
-#settings .form-search .span3 {
-    float: left;
-}
-
-/* user_portal course status icon */
-.coursestatusicons {
-    border: 0px solid #000;
-    float: left;
-    padding-right: 5px;
-    width: auto;
-}
-/* user_portal course list */
-.courses {
-    list-style-type: none;
-    margin-bottom: 5px;
-    height: 30px;
-}
-/* user_portal session list */
-.session_course_item .courses {
-    margin-bottom: 5px;
-    height:35px;
-}
-.session_course_item {
-    /* padding: 0px; */
-    margin: 0px;
-    margin-bottom:15px;
-    font-size:135%;
-}
-.userportal-course-item {
-    -webkit-border-radius: 10px;
-    -moz-border-radius: 10px;
-    border-radius: 10px;
-    background-color:#F9F9F9;
-    /*padding:5px 10px 5px 10px;
-    margin:0px 0px 10px 0px;    */
-}
-#course_category li,
-#hot_courses h5,
-.course_item h5,
-.categories-course-description h5,
-.course-box h5 {
-    font-size: 12px;
-    overflow-y : auto;
-    max-height:70px;
-    padding: 5px;
-}
-
-.session_box_title {
-    margin-bottom: 7px;
-}
-
-.session_course_item .item_closed, .userportal-course-item-title .item_closed {
-    font-size:80%;
-}
-#maincontent .courseslist li {
-    margin-bottom:8px;
-}
-
-.independent_course_item a {
-    font-size:135%;
-}
-
-.userportal-session-item {
-    -webkit-border-radius: 10px;
-    -moz-border-radius: 10px;
-    border-radius: 10px;
-    background-color:#F9F9F9;
-    padding:5px 10px 10px 6px;
-    margin:10px 0px;
-}
-
-.userportal-session-category-item {
-    -webkit-border-radius: 10px;
-    -moz-border-radius: 10px;
-    border-radius: 10px;
-    background-color:#F9F9F9;
-    padding:5px 10px 10px 16px;
-    /* height:40px; */
-    /*background-color:#f9f9f9; border:1px solid #dddddd; padding:5px 10px 5px 10px; margin-top: 10px; */
-}
-
 /*****************************************************
  *              AGENDA                               *
  *****************************************************/
@@ -1965,171 +1786,134 @@ input.maininput:focus {
 }
 
 #course_tools .content {
-    text-align:center;
-    margin-bottom: 20px;
+  text-align:center;
+  margin-bottom: 20px;
 }
 
 #course_tools .content a {
-    font-size: 12px;
+  font-size: 12px;
 }
 
 .big_icon img {
-    padding:5px;
-    -moz-border-radius:10px;
-    -border-radius:10px;
-    -webkit-border-radius:10px;
-    border-radius:10px;
-    -webkit-box-shadow: 0 4px 8px #C8C8C8;
-    -opera-box-shadow: 0 4px 8px #C8C8C8;
-    -moz-box-shadow: 0 4px 8px #C8C8C8;
-    box-shadow: 0 4px 8px #C8C8C8;
-
+  padding:5px;
+  -moz-border-radius:10px;
+  -border-radius:10px;
+  -webkit-border-radius:10px;
+  border-radius:10px;
+  -webkit-box-shadow: 0 4px 8px #C8C8C8;
+  -opera-box-shadow: 0 4px 8px #C8C8C8;
+  -moz-box-shadow: 0 4px 8px #C8C8C8;
+  box-shadow: 0 4px 8px #C8C8C8;
+  border: 1px solid #e6e6e6;
 }
-
 .big_icon img:hover {
-    -webkit-box-shadow: 0 4px 18px #C8C8C8;
-    -opera-box-shadow: 0 4px 18px #C8C8C8;
-    -moz-box-shadow: 0 4px 18px #C8C8C8;
-    box-shadow: 0 4px 18px #C8C8C8;
+  -webkit-box-shadow: 0 4px 18px #C8C8C8;
+  -opera-box-shadow: 0 4px 18px #C8C8C8;
+  -moz-box-shadow: 0 4px 18px #C8C8C8;
+  box-shadow: 0 4px 18px #C8C8C8;
 }
-
 .courseadminview .big_icon a {
-    font-size:12px;
+  font-size:12px;
 }
-
 /* Fixes the administration block section */
 .admin_section div {
-    margin: 5px 0 14px 25px;
+  margin: 5px 0 14px 25px;
 }
-
 .rounded_div {
-    background: none repeat scroll 0 0 #FFFFFF;
-    border: 1px solid #E5E5E5;
-
-    -webkit-border-radius: 11px;
-    -opera-border-radius: 11px;
-    -moz-border-radius: 11px;
-    border-radius: 11px;
-
-    -webkit-box-shadow: 0 4px 18px #C8C8C8;
-    -opera-box-shadow:  0 4px 18px #C8C8C8;
-    -moz-box-shadow:    0 4px 18px #C8C8C8;
-    box-shadow:         0 4px 18px #C8C8C8;
-
-    float: left;
-    height: auto;
-    margin: 10px 8px 15px 15px;
-    padding: 18px;
+  background: none repeat scroll 0 0 #FFFFFF;
+  border: 1px solid #E5E5E5;
+  -webkit-border-radius: 11px;
+  -opera-border-radius: 11px;
+  -moz-border-radius: 11px;
+  border-radius: 11px;
+  -webkit-box-shadow: 0 4px 18px #C8C8C8;
+  -opera-box-shadow:  0 4px 18px #C8C8C8;
+  -moz-box-shadow:    0 4px 18px #C8C8C8;
+  box-shadow:         0 4px 18px #C8C8C8;
+  float: left;
+  height: auto;
+  margin: 10px 8px 15px 15px;
+  padding: 18px;
 }
-
 /* Makes the course elements more readable */
-.userportal-course-item {
-
-}
-
 .session_course_item {
-    padding: 6px 0px 6px 5px ;
+ padding: 6px 0px 6px 5px ;
 }
-
-/* LP tool*/
-
-
 #lp_overview .thumbnail {
-    text-align: center;
+ text-align: center;
 }
-
 .lp_resource {
-    padding:5px 10px;
-    list-style-type: none;
-    margin: 0;
-    padding: 0;
-    float:left;
-    width:100%;
+ padding:5px 10px;
+ list-style-type: none;
+ margin: 0;
+ padding: 0;
+ float:left;
+ width:100%;
 }
-
 .lp_resource_element, .lp_resource_element_no_link {
-    background-image:-moz-linear-gradient(top,#fefefe,#eee);
-    background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#fdfdfd),color-stop(1,#eee));
-    border: 1px solid #CCCCCC;
-    color: #444444;
-    cursor: pointer;
-    font-weight: bold;
-    text-decoration: none;
-    text-shadow: 0 1px 1px #F6F6F6;
-    margin:5px;
-    padding:5px;
-    list-style: none outside none;
+  background-image:-moz-linear-gradient(top,#fefefe,#eee);
+  background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,#fdfdfd),color-stop(1,#eee));
+  border: 1px solid #CCCCCC;
+  color: #444444;
+  cursor: pointer;
+  font-weight: bold;
+  text-decoration: none;
+  text-shadow: 0 1px 1px #F6F6F6;
+  margin:5px;
+  padding:5px;
+  list-style: none outside none;
 }
-
 .lp_resource_element_new a {
-    font-size: 14px;
+  font-size: 14px;
 }
-
 .doc_resource {
-    margin:6px;
+  margin:6px;
 }
-
 table.lp_build td.tree {
-    border:none;
+  border:none;
 }
 #resource_tab {
-    min-height:380px;
+  min-height:380px;
 }
-
 div.system_announcement {
-    background-color: #EEEEEE;
+  background-color: #EEEEEE;
 }
-
 .RequirementHeading, .RequirementText, .RequirementContent  {
   margin-top:12px;
   line-height: 18px;
   margin-bottom: 20px;
 }
-
 #toolshortcuts_horizontal {
-    padding: 0px 20px 2px 0px;
-    clear: right;
-    margin-left: auto;
-    margin-right: auto;
-    text-align: right;
-    width: 98%;
+  padding: 0px 20px 2px 0px;
+  clear: right;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: right;
+  width: 98%;
 }
-
 #toolshortcuts_vertical {
-    padding: 0px 0px 2px 0px;
-    clear: right;
-    margin-left: auto;
-    margin-right: auto;
-    text-align: right;
-    width: 40px;
+  padding: 0px 0px 2px 0px;
+  clear: right;
+  margin-left: auto;
+  margin-right: auto;
+  text-align: right;
+  width: 40px;
 }
-
 div.admin_section {
-    min-height: 260px;
+  min-height: 260px;
 }
 .admin_section li {
-    padding: 2px 0px 2px;
+  padding: 2px 0px 2px;
 }
-
 div.admin_section h4 {
-    font-size:16px;
-    letter-spacing:-1px;
-}
-
-.actions span {
-    /* margin-right:0px; */
+  font-size:16px;
+  letter-spacing:-1px;
 }
-
 #courseintro_empty {
-    float: right;
-    margin: 2px auto;
-    padding: 0;
+  float: right;
+  margin: 2px auto;
+  padding: 0;
 }
-
-
-
-/*PROFILE*/
-
 .profile_grid_container { width:100%;}
 .profile_grid_item {
     border:1px dotted #CCCCCC;
@@ -2918,12 +2702,6 @@ form .formw .freeze {
 .show_element {
     display: block !important;
 }
-
-/* agenda js  */
-#add_event_form fieldset {
-    width:400px;
-}
-
 .tag {
     background-color: #D3E6EF;
     border-radius: 3px 3px 3px 3px;
@@ -2934,7 +2712,6 @@ form .formw .freeze {
     margin: 0 10px 5px 0;
     padding: 0.4em 0.6em;
 }
-
 .label_tag {
     padding: 1px 3px 2px;
     margin:2px 3px 2px 0px;
@@ -2949,7 +2726,6 @@ form .formw .freeze {
     text-align: center;
     width: 155px;
 }
-
 .label_tag.personal_event {
     background:#3366CC;
 }
@@ -2965,8 +2741,6 @@ form .formw .freeze {
 .label_tag.session_event {
     background:#00496D;
 }
-
-
 .label_tag.important {
     background-color: #c43c35;
 }
@@ -2979,62 +2753,56 @@ form .formw .freeze {
 .label_tag.notice {
     background-color: #62cffc;
 }
-
 .label_tag.skill {
     background-color: #46a546;
 }
-
-
 .label_tag.course {
     background-color: #62cffc;
 }
-
-
-
-
 .invisible {
     color: #999;
 }
-
 .invisible h2 {
     color: #999;
 }
-
 .requirements td {
     padding:5px;
 }
-
 /* header cell in data table in tools */
 .data_table {
     margin-bottom: 18px;
     width: 100%;
     border: 1px solid #DDDDDD;
 }
-
+.data_table td{
+  font-size: 12px;
+}
 .data_table th, .data_table td {
-    border-top: 1px solid #DDDDDD;
-    line-height: 18px;
-    padding-top: 10px;
-    padding-bottom: 10px;
+  border-top: 1px solid #DDDDDD;
+  line-height: 18px;
+  padding-top: 10px;
+  padding-bottom: 10px;
+  text-align: center;
 }
 
 .data_table th {
-    padding: 8px 10px;
-    font-weight: bold;
-    background-color: #F2F2F2;
-    border-bottom: 1px solid #DDDDDD;
+  padding: 8px 10px;
+  font-weight: normal;
+  background-color: #EEEEEE;
+  border-bottom: 1px solid #DDDDDD;
+  color:#333;
 }
-.data_table td {
+.data_table th a{
+  color: #333;
 }
-
 .data_table_no_border {
-    border-collapse: collapse;
-    border-spacing: 0;
-    font-size: 12px;
-    margin-bottom: 15px;
-    margin-top: 8px;
-    text-align: left;
-    width: 100%;
+  border-collapse: collapse;
+  border-spacing: 0;
+  font-size: 12px;
+  margin-bottom: 15px;
+  margin-top: 8px;
+  text-align: left;
+  width: 100%;
 }
 
 .data_table_no_border td {
@@ -3059,10 +2827,25 @@ form .formw .freeze {
 }
 
 .data_table_pagination {
-    width:100%;
-    margin-top: 8px;
+  width:100%;
+  margin-top: 5px;
+  margin-bottom: 5px;
+}
+.table-well{
+  background:#ffffff;
+  border:1px solid #dddddd;
+  padding: 10px 20px;
+  border-radius: 4px;
+  -moz-border-radius: 4px;
+  -webkit-border-radius: 4px;
+  box-shadow: 0 1px 1px rgba(0,0,0,0.05);
+  margin-bottom: 20px;
+  margin-top: 10px;
+}
+.tabs-margin, .btn-toolbar{
+  margin-bottom: 15px;
+  margin-top: 15px;
 }
-
 .form-stacked .label {
     display: block;
     float: none;
@@ -3834,11 +3617,7 @@ a:active{
 
 #my_timeline {
     background: url("dot.gif") repeat-x scroll left 45px;
-    height: 350px;
     margin: 0px auto;
-    overflow: hidden;
-    position: relative;
-    width: 600px;
 }
 
 #dates {
@@ -4179,11 +3958,9 @@ a.forum_group_link {
     margin-right: 10px;
     vertical-align:middle;
 }
-
 .exercise_overview_options {
     text-align: center;
 }
-
 .new_actions {
     background-color: #EEEEEE;
     background-image: -moz-linear-gradient(center top , #F5F5F5 0%, #EEEEEE 100%);
@@ -4192,7 +3969,6 @@ a.forum_group_link {
     border-radius: 4px 4px 4px 4px;
     height: 53px;
 }
-
 .new_actions .nav > li > a {
     border-left: 1px solid #F5F5F5;
     border-radius: 0 0 0 0;
@@ -4201,7 +3977,6 @@ a.forum_group_link {
     padding-bottom: 11px;
     padding-top: 11px;
 }
-
 .new_actions-fixed {
     border-color: #D5D5D5;
     border-radius: 0 0 0 0;
@@ -4212,7 +3987,6 @@ a.forum_group_link {
     top: 0px;
     z-index: 1030;
 }
-
 .new_actions .nav > .active > a, .new_actions .nav > .active > a:hover {
     background-color: #E9E9E9;
     border-left: 0 none;
@@ -4221,43 +3995,34 @@ a.forum_group_link {
     color: #777777;
     padding-left: 13px;
 }
-
 .new_actions .nav-tabs > li > a, .new_actions .nav-pills > li > a {
     padding-left: 6px;
     padding-right: 6px;
 }
-
 .subnav .nav > li > .logout {
     padding-top:8px;
 }
-
-
 .doc_folder {
     margin-right:5px;
     margin-top:5px;
     width: 100%;
     float:left;
 }
-
 .doc_folder_hidden {
     color : grey;
 }
-
 .doc_resource{
     margin: 5px;
     width: 100%;
     float:left;
 }
-
 .lp_resource_element_new {
     border: 2px dotted green;
 }
-
 #course_thing_to_do .thumbnail {
     text-align: center;
     margin-bottom: 5px;
 }
-
 .handle{
     background-image: url('../../main/img/div_show.gif');
     background-repeat: no-repeat;
@@ -4265,7 +4030,6 @@ a.forum_group_link {
     padding-left: 25px;
     box-shadow:none;
 }
-
 .handle.collapsed{
     background-image:  url('../../main/img/div_show.gif');
     background-repeat: no-repeat;
@@ -6216,6 +5980,64 @@ div#chat-remote-video video {
     font-size:22px;
     margin-top:5px;
 }
+#work-list{
+  padding: 10px;
+  border:1px solid #dddddd;
+  border-radius: 5px;
+  -moz-border-radius: 5px;
+  -webkit-border-radius: 5px;
+  margin-bottom: 10px;
+}
+.ui-accordion .ui-accordion-content-active{
+
+}
+.ui-jqgrid-view .label-success{
+  font-size: 14px;
+}
+.ui-jqgrid-view .ui-widget-content a{
+  color:#666666;
+}
+.ui-jqgrid-view .ui-state-default,
+.ui-jqgrid-view .ui-widget-content .ui-state-default,
+.ui-jqgrid-view .ui-widget-header .ui-state-default{
+  background: #EEEEEE;
+  color: #666666;
+  border: none;
+}
+.ui-jqgrid-view table{
+  border-collapse: inherit;
+}
+.ui-jqgrid.ui-widget-content{
+  border: none;
+}
+.ui-jqgrid-view .ui-jqgrid-sortable{
+  font-size: 12px;
+}
+.ui-jqgrid-view .ui-jqgrid .ui-jqgrid-htable th div{
+  height: auto;
+}
+.ui-jqgrid-view .ui-th-ltr, .ui-jqgrid .ui-jqgrid-htable th.ui-th-ltr{
+  padding-bottom: 5px;
+  padding-top: 5px;
+}
+.ui-jqgrid tr.ui-row-ltr td{
+  border: none;
+}
+.ui-jqgrid tr.jqgrow td{
+  height: 45px;
+  font-size: 13px;
+}
+.ui-jqgrid .ui-jqgrid-labels .ui-state-hover{
+  background-color: #E7E7E7;
+}
+.ui-jqgrid .ui-pg-selbox{
+  font-size: 12px;
+  height: 25px;
+}
+.ui-jqgrid .ui-pg-input{
+  font-size: 12px;
+  height: 25px;
+}
 .ui-jqgrid .ui-pg-table td{
   font-size: 12px;
 }
@@ -6263,8 +6085,60 @@ div#chat-remote-video video {
 .ui-jqgrid .ui-jqgrid-htable th div{
   height: 25px;
 }
+/* ui diglog */
+.ui-dialog .ui-widget-header{
+  border:none;
+  background: none;
+}
+.ui-dialog.ui-widget-content{
+  border: 1px solid #DDD;
+  background: #ffffff;
+}
+.ui-dialog .ui-dialog-buttonpane{
+  border-top: 1px solid #DDD;
+}
+.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
+  background-color:#f5f5f5;
+  background-image:-moz-linear-gradient(top,#fff,#e6e6e6);
+  background-image:-webkit-gradient(linear,0 0,0 100%,from(#fff),to(#e6e6e6));
+  background-image:-webkit-linear-gradient(top,#fff,#e6e6e6);
+  background-image:-o-linear-gradient(top,#fff,#e6e6e6);
+  background-image:linear-gradient(to bottom,#fff,#e6e6e6);
+  background-repeat:repeat-x;
+  border-color:#e6e6e6 #e6e6e6 #bfbfbf;
+  border-color:rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
+  color:#333;
+  text-shadow:0 1px 1px rgba(255,255,255,.75);
+  box-shadow:inset 0 1px 0 rgba(255,255,255,.2),0 1px 2px rgba(0,0,0,.05)
+}
+
+.ui-state-hover,
+.ui-widget-content .ui-state-hover,
+.ui-widget-header .ui-state-hover,
+.ui-state-focus,
+.ui-widget-content .ui-state-focus,
+.ui-widget-header .ui-state-focus{
+  border-width: 1px;
+  border-style:solid;
+  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
+  border-color:rgba(0,0,0,.1) rgba(0,0,0,.1) rgba(0,0,0,.25);
+  background-position: 0px -15px;
+  background-color: #E6E6E6;
+  font-weight:normal;
+  color:#333333;
+}
+#dialog-form .dialog-form-content{
+  font-size: 12px;
+}
+#dialog-form .dialog-form-content .control-label{
+  font-size: 12px;
+  font-weight: normal;
+  padding-top: 0;
+}
+#dialog-form .dialog-form-content .multiple-select{
+  font-size: 12px;
+}
 #student-list-work{
-  padding: 10px;
   background-color: #ffffff;
   position: absolute;
   top:0px;
@@ -6277,11 +6151,34 @@ div#chat-remote-video video {
   -webkit-border-radius: 5px;
   box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.05);
 }
+.panel-student{
+  width: 550px;
+}
 #student-list-work .toolbar{
   text-align: center;
   padding-top: 5px;
   padding-bottom: 5px;
 }
+#datafiller .fillers{
+  list-style: none;
+  padding: 0;
+  margin: 0;
+}
+#datafiller .description{
+  padding: 10px;
+  margin-bottom: 10px;
+}
+#datafiller .fillers li{
+  padding-top: 5px;
+  padding-bottom: 5px;
+  margin-left: 10px;
+}
+.filler-report h3{
+  margin-top: 10px;
+}
+.filler-report .filler-report-data-init{
+  width: 60%;
+}
 /* CSS NEW TOP ******************************************************************************/
 /* CSS Responsive */
 @media (min-width: 1025px) and (max-width: 1200px) {
diff --git a/main/admin/filler.php b/main/admin/filler.php
index 2c93f0ed61..7b36ad03a8 100755
--- a/main/admin/filler.php
+++ b/main/admin/filler.php
@@ -61,12 +61,12 @@ if (count($output)>0) {
     Display::display_normal_message($result,false);
 }
 ?>
-<div class="well_border">
-  <h4><?php Display::display_icon('bug.gif', 'DataFiller'); echo ' '.api_ucfirst(get_lang('DataFiller'));?></h4>
-  <div><?php echo get_lang('ThisSectionIsOnlyVisibleOnSourceInstalls');?></div>
-  <ul>
-    <li><a href="filler.php?fill=users"><?php echo get_lang('FillUsers');?></a></li>
-    <li><a href="filler.php?fill=courses"><?php echo get_lang('FillCourses');?></a></li>
+<div id="datafiller" class="actions">
+  <h4><?php echo Display::return_icon('bug.png',get_lang('DataFiller'),null,ICON_SIZE_MEDIUM).' '.get_lang('DataFiller')?></h4>
+  <div class="description"><?php echo get_lang('ThisSectionIsOnlyVisibleOnSourceInstalls');?></div>
+  <ul class="fillers">
+    <li><a href="filler.php?fill=users"><?php echo Display::return_icon('user.png',get_lang('FillUsers'),null,ICON_SIZE_SMALL).' '.get_lang('FillUsers');?></a></li>
+    <li><a href="filler.php?fill=courses"><?php echo Display::return_icon('new-course.png',get_lang('FillCourses'),null,ICON_SIZE_SMALL).' '.get_lang('FillCourses');?></a></li>
   </ul>
 </div>
 <?php
diff --git a/main/auth/my_progress.php b/main/auth/my_progress.php
index 53a2143672..e49324187e 100755
--- a/main/auth/my_progress.php
+++ b/main/auth/my_progress.php
@@ -69,9 +69,9 @@ if (!empty($course_user_list)) {
         $dates .= '<li><a href="#'.$login.'">'.api_get_utc_datetime($login).'</a></li>';
         $issues .= '<li id ="'.$login.'">
                         <div class="row">
-                            <div class="span2"><div class="thumbnail">'.$course_image.'</div>
+                            <div class="col-md-12"><div class="thumbnail">'.$course_image.'</div>
                         </div>
-                        <div class="span3">'.sprintf(
+                        <div class="col-md-3">'.sprintf(
                             get_lang('YouHaveEnteredTheCourseXInY'),
                             $courseInfo['code'],
                             api_convert_and_format_date($login, DATE_FORMAT_LONG)
@@ -88,7 +88,7 @@ if (!empty($dates)) {
     if (!empty($content)) {
         $content .= '<br /><br />';
     }
-    $content .= '<div class="row"><div class="span12">'.Display::page_subheader(get_lang('Timeline')).'</div>';
+    $content .= '<div class="row"><div class="col-md-12">'.Display::page_subheader(get_lang('Timeline')).'</div>';
     $content .= '<div id="my_timeline">
         <div class="actions">
             <a href="#" id="prev"></a> <!-- optional -->
diff --git a/main/calendar/agenda_js.php b/main/calendar/agenda_js.php
index 5d3aa6c093..fc32d7d91e 100755
--- a/main/calendar/agenda_js.php
+++ b/main/calendar/agenda_js.php
@@ -224,7 +224,7 @@ $agenda->showToForm($form, $sendTo, array(), $addOnlyItemsInSendTo);
 $form->addElement('html', '</div>');
 
 $form->addElement('html', '<div id="visible_to_read_only" style="display: none">');
-$form->addElement('label', get_lang('To'), '<div id="visible_to_read_only_users"></div>');
+$form->addElement('label', get_lang('To'),'<div id="visible_to_read_only_users"></div>');
 $form->addElement('html', '</div>');
 
 $form->addElement('label', get_lang('Agenda'), '<div id ="color_calendar"></div>');
diff --git a/main/course_info/infocours.php b/main/course_info/infocours.php
index 9d6dc802a6..39b41daeae 100755
--- a/main/course_info/infocours.php
+++ b/main/course_info/infocours.php
@@ -118,10 +118,11 @@ if ($form->validate() && is_settings_editable()) {
 
 // Display course picture
 $course_path = api_get_path(SYS_COURSE_PATH).$currentCourseRepository;   // course path
+
 if (file_exists($course_path.'/course-pic85x85.png')) {
     $course_web_path = api_get_path(WEB_COURSE_PATH).$currentCourseRepository;   // course web path
     $course_medium_image = $course_web_path.'/course-pic85x85.png?'.rand(1, 1000); // redimensioned image 85x85
-    $image_html =  '<div class="row"><div class="formw"><img src="'.$course_medium_image.'" /></div></div>';
+    $image_html =  '<div class="row"><label class="col-md-2 control-label">'.get_lang('Image').'</label> <div class="col-md-8"><img src="'.$course_medium_image.'" /></div></div>';
 }
 $form->addElement('html', $image_html);
 
@@ -143,7 +144,7 @@ $form->applyFilter('department_url', 'html_filter');
 $form->addElement('file', 'picture', get_lang('AddPicture'));
 $allowed_picture_types = array ('jpg', 'jpeg', 'png', 'gif');
 $form->addRule('picture', get_lang('OnlyImagesAllowed').' ('.implode(',', $allowed_picture_types).')', 'filetype', $allowed_picture_types);
-
+$form->addElement('html', '<div class="form-group "><div class="col-md-2"></div> <div class="col-md-8 help-image">'.get_lang('UniqueAnswerImagePreferredSize200x150').'</div></div>');
 $form->addElement('checkbox', 'delete_picture', null, get_lang('DeletePicture'));
 
 if (api_get_setting('pdf_export_watermark_by_course') == 'true') {
diff --git a/main/img/icons/128/unknown.png b/main/img/icons/128/unknown.png
new file mode 100644
index 0000000000..addd1b6b81
Binary files /dev/null and b/main/img/icons/128/unknown.png differ
diff --git a/main/img/icons/16/unknown.png b/main/img/icons/16/unknown.png
new file mode 100644
index 0000000000..9a641fcc45
Binary files /dev/null and b/main/img/icons/16/unknown.png differ
diff --git a/main/img/icons/22/unknown.png b/main/img/icons/22/unknown.png
new file mode 100644
index 0000000000..e3e9779503
Binary files /dev/null and b/main/img/icons/22/unknown.png differ
diff --git a/main/img/icons/32/bug.png b/main/img/icons/32/bug.png
index 3a153de34e..c45910fd7f 100755
Binary files a/main/img/icons/32/bug.png and b/main/img/icons/32/bug.png differ
diff --git a/main/img/icons/32/unknown.png b/main/img/icons/32/unknown.png
new file mode 100644
index 0000000000..ea5339cfd4
Binary files /dev/null and b/main/img/icons/32/unknown.png differ
diff --git a/main/img/icons/48/bug.png b/main/img/icons/48/bug.png
index 524bee495d..98005af2d9 100755
Binary files a/main/img/icons/48/bug.png and b/main/img/icons/48/bug.png differ
diff --git a/main/img/icons/48/unknown.png b/main/img/icons/48/unknown.png
new file mode 100644
index 0000000000..84086b6959
Binary files /dev/null and b/main/img/icons/48/unknown.png differ
diff --git a/main/img/icons/64/unknown.png b/main/img/icons/64/unknown.png
new file mode 100644
index 0000000000..ba81a2e749
Binary files /dev/null and b/main/img/icons/64/unknown.png differ
diff --git a/main/img/icons/svg/unknown.svg b/main/img/icons/svg/unknown.svg
new file mode 100644
index 0000000000..08fbd4d09a
--- /dev/null
+++ b/main/img/icons/svg/unknown.svg
@@ -0,0 +1,68 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd"
+   xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape"
+   height="24"
+   version="1.1"
+   width="24"
+   id="svg2"
+   inkscape:version="0.91 r"
+   sodipodi:docname="unknown.svg">
+  <metadata
+     id="metadata16">
+    <rdf:RDF>
+      <cc:Work
+         rdf:about="">
+        <dc:format>image/svg+xml</dc:format>
+        <dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" />
+        <dc:title></dc:title>
+      </cc:Work>
+    </rdf:RDF>
+  </metadata>
+  <defs
+     id="defs14" />
+  <sodipodi:namedview
+     pagecolor="#ffffff"
+     bordercolor="#666666"
+     borderopacity="1"
+     objecttolerance="10"
+     gridtolerance="10"
+     guidetolerance="10"
+     inkscape:pageopacity="0"
+     inkscape:pageshadow="2"
+     inkscape:window-width="1920"
+     inkscape:window-height="1051"
+     id="namedview12"
+     showgrid="false"
+     inkscape:zoom="19.666667"
+     inkscape:cx="9.0308807"
+     inkscape:cy="6.3407536"
+     inkscape:window-x="0"
+     inkscape:window-y="0"
+     inkscape:window-maximized="1"
+     inkscape:current-layer="svg2" />
+  <rect
+     style="opacity:1;fill:#f9f9f9;fill-opacity:1;stroke:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1"
+     id="rect4144"
+     width="24"
+     height="24"
+     x="0.11523365"
+     y="0.015081692"
+     inkscape:export-filename="/var/www/chamilo/main/img/icons/16/unknown.png"
+     inkscape:export-xdpi="60"
+     inkscape:export-ydpi="60" />
+  <path
+     inkscape:connector-curvature="0"
+     d="m 14.974917,17.068064 c -0.08463,-0.893441 -0.05218,-1.516966 -0.05218,-2.333368 0.423185,-0.212276 1.181439,-1.56574 1.309555,-2.709146 0.33275,-0.02605 0.857384,-0.336426 1.011006,-1.56186 C 17.326199,9.8058023 16.996928,9.4355662 16.79635,9.3191751 17.337796,7.7623035 18.462425,2.9459204 14.716368,2.4482089 14.330864,1.8008517 13.343626,1.4732933 12.060737,1.4732933 6.9280266,1.5636348 6.3089012,5.1789706 7.4341093,9.3191751 7.234111,9.4355662 6.9048384,9.8058023 6.9871565,10.46369 c 0.1542016,1.225434 0.6782553,1.535811 1.0110062,1.56186 0.1275351,1.142852 0.9159345,2.49687 1.3402785,2.709146 0,0.816402 0.03189,1.439927 -0.05275,2.333368 -1.0156435,2.610491 -7.8683409,1.87778 -8.18486,6.912535 l 22.0288048,0 c -0.31594,-5.034755 -7.139073,-4.302044 -8.154716,-6.912535 z"
+     id="path4156"
+     style="fill:#34495e;fill-opacity:1"
+     inkscape:export-filename="/var/www/chamilo/main/img/icons/16/unknown.png"
+     inkscape:export-xdpi="60"
+     inkscape:export-ydpi="60" />
+</svg>
diff --git a/main/inc/lib/agenda.lib.php b/main/inc/lib/agenda.lib.php
index 842e5d218c..891fcf66cd 100644
--- a/main/inc/lib/agenda.lib.php
+++ b/main/inc/lib/agenda.lib.php
@@ -1751,7 +1751,7 @@ class Agenda
      */
     public static function construct_not_selected_select_form($group_list = null, $user_list = null, $to_already_selected = array())
     {
-        $html = '<select id="users_to_send_id" data-placeholder="'.get_lang('Select').'" name="users_to_send[]" multiple="multiple" style="width:250px" class="chzn-select">';
+        $html = '<select id="users_to_send_id" data-placeholder="'.get_lang('Select').'" name="users_to_send[]" multiple="multiple">';
         if ($to_already_selected == 'everyone') {
             $html .= '<option value="everyone" checked="checked">'.get_lang('Everyone').'</option>';
         } else {
@@ -1813,8 +1813,7 @@ class Agenda
             'id' => 'users_to_send_id',
             'data-placeholder' => get_lang('Select'),
             'multiple' => 'multiple',
-            'style' => 'width:250px',
-            //'class' => 'chzn-select'
+            'class' => 'multiple-select'
         );
 
         if (!empty($attributes)) {
diff --git a/main/inc/lib/api.lib.php b/main/inc/lib/api.lib.php
index 441a17625e..6a6bb7d7c1 100644
--- a/main/inc/lib/api.lib.php
+++ b/main/inc/lib/api.lib.php
@@ -1865,6 +1865,13 @@ function api_format_course_array($course_data)
     }
     $_course['course_image'] = $url_image;
 
+    if (file_exists(api_get_path(SYS_COURSE_PATH).$course_data['directory'].'/course-pic.png')) {
+        $url_image = api_get_path(WEB_COURSE_PATH).$course_data['directory'].'/course-pic.png';
+    } else {
+        $url_image = Display::return_icon('course.png', null, null, ICON_SIZE_BIG, null, true);
+    }
+    $_course['course_image_large'] = $url_image;
+
     return $_course;
 }
 
diff --git a/main/inc/lib/display.lib.php b/main/inc/lib/display.lib.php
index 471b99cbcf..5288fcb702 100755
--- a/main/inc/lib/display.lib.php
+++ b/main/inc/lib/display.lib.php
@@ -1040,7 +1040,7 @@ class Display
              $lis .= self::tag('li', $item, array('class' => $class));
             $i++;
         }
-        return self::tag('ul', $lis, array('class' => 'nav nav-tabs'));
+        return self::tag('ul', $lis, array('class' => 'nav nav-tabs tabs-margin'));
     }
 
     /**
diff --git a/main/inc/lib/sortable_table.class.php b/main/inc/lib/sortable_table.class.php
index 965b34bce5..0a39503e15 100755
--- a/main/inc/lib/sortable_table.class.php
+++ b/main/inc/lib/sortable_table.class.php
@@ -260,7 +260,8 @@ class SortableTable extends HTML_Table
             // Only show pagination info when there are items to paginate
 
             if ($this->get_total_number_of_items() > $this->default_items_per_page) {
-                $html  = '<table class="data_table_pagination">';
+                $html  = '<div class="table-well">';
+                $html .= '<table class="data_table_pagination">';
                 $html .= '<tr>';
                 $html .= '<td style="width:25%;">';
                 $html .= $form;
@@ -273,6 +274,7 @@ class SortableTable extends HTML_Table
                 $html .= '</td>';
                 $html .= '</tr>';
                 $html .= '</table>';
+                $html .= '</div>';
             }
 
             if (count($this->form_actions) > 0) {
diff --git a/main/inc/lib/usermanager.lib.php b/main/inc/lib/usermanager.lib.php
index 629f4c51eb..247fca7ac9 100755
--- a/main/inc/lib/usermanager.lib.php
+++ b/main/inc/lib/usermanager.lib.php
@@ -1467,28 +1467,28 @@ class UserManager
         $pictureWebFile = $imageWebPath['file'];
         $pictureWebDir = $imageWebPath['dir'];
 
-        $pictureAnonymous = 'unknown.jpg';
+        $pictureAnonymous = 'icons/128/unknown.png';
         $gravatarSize = 22;
         $realSizeName = 'small_';
 
         switch ($size) {
             case USER_IMAGE_SIZE_SMALL:
-                $pictureAnonymous = 'unknown_22.jpg';
+                $pictureAnonymous = 'icons/22/unknown.png';
                 $realSizeName = 'small_';
                 $gravatarSize = 22;
                 break;
             case USER_IMAGE_SIZE_MEDIUM:
-                $pictureAnonymous = 'unknown_50_50.jpg';
+                $pictureAnonymous = 'icons/64/unknown.png';
                 $realSizeName = 'medium_';
                 $gravatarSize = 50;
                 break;
             case USER_IMAGE_SIZE_ORIGINAL:
-                $pictureAnonymous = 'unknown.jpg';
+                $pictureAnonymous = 'icons/128/unknown.png';
                 $realSizeName = '';
                 $gravatarSize = 108;
                 break;
             case USER_IMAGE_SIZE_BIG:
-                $pictureAnonymous = 'unknown.jpg';
+                $pictureAnonymous = 'icons/128/unknown.png';
                 $realSizeName = 'big_';
                 $gravatarSize = 200;
                 break;
diff --git a/main/inc/lib/userportal.lib.php b/main/inc/lib/userportal.lib.php
index 74e52af96f..9ac9b2bd41 100755
--- a/main/inc/lib/userportal.lib.php
+++ b/main/inc/lib/userportal.lib.php
@@ -1325,7 +1325,7 @@ class IndexManager
      */
     public function return_hot_courses()
     {
-        return CourseManager::return_hot_courses();
+        return CourseManager::return_hot_courses(30, 6);
     }
 
 }
diff --git a/main/template/default/agenda/month.tpl b/main/template/default/agenda/month.tpl
index c85b4d5701..ad0047b51b 100755
--- a/main/template/default/agenda/month.tpl
+++ b/main/template/default/agenda/month.tpl
@@ -531,7 +531,7 @@ $(document).ready(function() {
 {{ actions_div }}
 
 <div id="simple-dialog-form" style="display:none;">
-    <div style="width:640px">
+    <div style="width:500px">
         <form name="form-simple" class="form-horizontal">
             <span id="calendar_course_info_simple"></span>
             <span id="calendar_session_info"></span>
@@ -574,7 +574,7 @@ $(document).ready(function() {
 </div>
 
 <div id="dialog-form" style="display:none;">
-	<div style="width:640px">
+	<div class="dialog-form-content">
         {{ form_add }}
 	</div>
 </div>
diff --git a/main/template/default/layout/head.tpl b/main/template/default/layout/head.tpl
index 5fedbff22e..8ea76b16ec 100755
--- a/main/template/default/layout/head.tpl
+++ b/main/template/default/layout/head.tpl
@@ -162,28 +162,6 @@ $(window).resize(function() {
 
 $(document).scroll(function() {
 
-    // Top bar scroll effect
-    if ($('body').width() > 959) {
-        if ($('.subnav').length) {
-            if (!$('.subnav').attr('data-top')) {
-                // If already fixed, then do nothing
-                if ($('.subnav').hasClass('subnav-fixed')) return;
-                // Remember top position
-                var offset = $('.subnav').offset();
-                $('.subnav').attr('data-top', offset.top);
-            }
-
-            if ($('.subnav').attr('data-top') - $('.subnav').outerHeight() <= $(this).scrollTop()) {
-                $('.subnav').addClass('subnav-fixed');
-            } else {
-                $('.subnav').removeClass('subnav-fixed');
-            }
-            //$('.subnav .brand').show();
-        }
-    } else {
-        //$('.subnav .brand').hide();
-    }
-
     //Exercise warning fixed at the top
     var fixed =  $("#exercise_clock_warning");
     if (fixed.length) {
@@ -324,6 +302,13 @@ function showConfirmationPopup(obj, urlParam)
 $(function() {
 
     check_brand();
+    //if exists the toolbar admin
+
+    if($('#toolbar').length){
+        var heigthToolBar= $('#toolbar').height();
+        $('header').css('margin-top', heigthToolBar+'px');
+        $('#page-back').css('padding-top', heigthToolBar+20+'px');
+    }
 
     // Removes the yellow input in Chrome
     if (navigator.userAgent.toLowerCase().indexOf("chrome") >= 0) {
@@ -337,17 +322,6 @@ $(function() {
         });
     }
 
-    // Fixes buttons to the new btn class.
-    /* if (!$('#button').hasClass('btn')) {
-        $("button").addClass('btn');
-    } */
-
-    // Dropdown effect.
-    $('.dropdown-toggle').dropdown();
-
-    // Responsive effect.
-    $(".collapse").collapse();
-
     $(".accordion_jquery").accordion({
         autoHeight: false,
         active: false, // all items closed by default
diff --git a/main/template/default/layout/hot_course_item.tpl b/main/template/default/layout/hot_course_item.tpl
index 8769ffc1e4..e7ba6bf993 100755
--- a/main/template/default/layout/hot_course_item.tpl
+++ b/main/template/default/layout/hot_course_item.tpl
@@ -1,28 +1,24 @@
-{% for hot_course in hot_courses %}               
-    {% if hot_course.extra_info.title %}        
-
-
-                <div class="row">
-                    <div class="col-md-2">
-                        <div class="thumbnail">
-                            <img src="{{ hot_course.extra_info.course_image }}" alt="{{ hot_course.extra_info.title|e }}" width="85" height="85" />
+{% for hot_course in hot_courses %}
+    {% if hot_course.extra_info.title %}
+                    <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 }}"/>
+                            </div>
                         </div>
-                    </div>
-                    <div class="col-md-10">
-                        <div class="categories-course-description">
-                            <div class="text-h3">{{ hot_course.extra_info.title}}</div>
-                            <div class="text-h5">{{ hot_course.extra_info.teachers }}</div>
-                            {{ hot_course.extra_info.rating_html }}
+                        <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>
                         </div>
-                        <p>                                                            
-                            {{ 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 }}
-                        </p>
                     </div>
-                </div>
-
-
     {% endif %}
 {% endfor %}
diff --git a/main/template/default/layout/hot_courses.tpl b/main/template/default/layout/hot_courses.tpl
index 8cf33f64a1..7d158dd47b 100755
--- a/main/template/default/layout/hot_courses.tpl
+++ b/main/template/default/layout/hot_courses.tpl
@@ -21,8 +21,8 @@ $(document).ready( function() {
 });
 </script>
 <section id="hot_courses">
-    <div class="panel panel-default">
-        <div class="panel-heading">
+    <div class="hot-course-head">
+        <h4 class="hot-course-title">
             {{ "HottestCourses"|get_lang}}
             {% if _u.is_admin %}
             <span class="pull-right">
@@ -31,9 +31,10 @@ $(document).ready( function() {
                 </a>
             </span>
             {% endif %}
-
-        </div>
-        <div class="panel-body">
+        </h4>
+    </div>
+    <div class="hot-course-body">
+        <div class="row">
             {% include template ~ '/layout/hot_course_item.tpl' %}
         </div>
     </div>
diff --git a/main/template/default/layout/menu.tpl b/main/template/default/layout/menu.tpl
index 4e1f1630f1..7cf36dcd54 100755
--- a/main/template/default/layout/menu.tpl
+++ b/main/template/default/layout/menu.tpl
@@ -2,7 +2,7 @@
     <div class="container">
         <!-- Brand and toggle get grouped for better mobile display -->
         <div class="navbar-header">
-            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menuone">
+            <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#menuone" aria-expanded="false">
                 <span class="sr-only">Toggle navigation</span>
                 <span class="icon-bar"></span>
                 <span class="icon-bar"></span>
diff --git a/main/template/default/layout/topbar.tpl b/main/template/default/layout/topbar.tpl
index 24d475dbad..9344ffcdf9 100755
--- a/main/template/default/layout/topbar.tpl
+++ b/main/template/default/layout/topbar.tpl
@@ -1,6 +1,6 @@
 <!-- Topbar -->
 {% if show_toolbar == 1 %}
-    <nav class="navbar navbar-inverse navbar-fixed-top">
+    <nav id="toolbar-admin" class="navbar navbar-inverse navbar-fixed-top">
         <div class="container-fluid">
 
             <div class="navbar-header">
diff --git a/main/template/default/skill/badge.tpl b/main/template/default/skill/badge.tpl
index bfac270c84..ea7d60625e 100644
--- a/main/template/default/skill/badge.tpl
+++ b/main/template/default/skill/badge.tpl
@@ -23,7 +23,7 @@
                         </p>
                     </div>
                     <div class="col-xs-12 col-md-6">
-                        <img class="img-responsive" src="{{ 'openbadges.png' | icon() }}" width="22" height="22">
+                        <img class="img-responsive" src="{{ 'openbadges.png' | icon() }}">
                     </div>
                 </div>