diff --git a/modules/about/client/less/about.less b/modules/about/client/less/about.less
index cd43812f..57c5a130 100644
--- a/modules/about/client/less/about.less
+++ b/modules/about/client/less/about.less
@@ -4,9 +4,9 @@
     .black-item {
         cursor: pointer;
         position: relative;
-        border: solid 1px #333;
+        border: solid 1px #1a1a1a;
         border-radius: 4px;
-        background-color: #555;
+        background-color: #2a2a2a;
         padding: 10px 0 15px 0;
         margin: 20px 0 0 0;
         overflow: hidden;
@@ -56,65 +56,30 @@
     .oper-item {
         cursor: pointer;
         position: relative;
-        border: solid 1px darken(@state-danger-text, 15%);
-        border-radius: 4px;
-        background-color: lighten(@state-danger-text, 5%);
         padding: 10px 0 10px 0;
-        margin: 20px 0 0 0;
+        //margin: 10px 0 0 0;
         overflow: hidden;
 
         &.is-admin {
-            background-color: darken(@state-danger-text, 10%);
-        }
-
-        .fa {
-            transition-property: transform, opacity;
-            transition-duration: .5s;
-            transition-timing-function: ease;
-            font-size: 7em;
-            color: #888;
-        }
-        span {
-            color: #ddd;
-            position: relative;
-            z-index: 100;
-        }
-        div {
-            color: #999;
-            position: relative;
-            z-index: 100;
-        }
-
-        &:hover {
-            .fa {
-                /* csslint ignore:start */
-                transform: scale(1.5);
-                /* csslint ignore:end */
-            }
-            .h3, .h4, div {
-                color: #fff;
-            }
-            .oper-icon {
-                opacity: 0.3;
-            }
+            //background-color: #ccc;
         }
         .oper-avatar {
             img {
                 cursor: pointer;
                 float: left;
-                margin-left: 10px;
+                margin: 0 10px;
                 border-radius: 3px;
                 height: 80px;
                 width: 80px;
             }
         }
-    }
-
-    .oper-icon {
-        position: absolute;
-        top: 2px;
-        right: -40px;
-        opacity: 0.5;
+        .oper-info {
+            margin-top: 5px;
+            .oper-name, oper-msg {
+                font-size: 18px;
+                font-weight: 500;
+            }
+        }
     }
 }
 
diff --git a/modules/about/client/views/operlist.client.view.html b/modules/about/client/views/operlist.client.view.html
index 9b40decc..8d1f3bb7 100644
--- a/modules/about/client/views/operlist.client.view.html
+++ b/modules/about/client/views/operlist.client.view.html
@@ -1,6 +1,6 @@
 <section class="container" ng-controller="AboutController as vm" ng-init="vm.getOperList();">
     <div class="row margin-top-20">
-        <div class="col-sm-12 col-md-10 col-md-offset-1">
+        <div class="col-sm-12">
             <span>
                 <h3 class="margin-bottom-30">
                     {{'ABOUT.OPER_LIST' | translate}}
@@ -14,17 +14,18 @@
             </div>
 
             <div class="row oper-list">
-                <div class="col-sm-6 col-md-4" ng-repeat="o in vm.operList">
-                    <div class="text-center oper-item"
+                <div class="col-sm-6 col-md-4 col-lg-3" ng-repeat="o in vm.operList">
+                    <div class="oper-item" mt-scale-by-mouse="{scale: 1.1, duration: '.5s'}"
                          ui-sref="userinfo({userId: o._id})"
                          ng-class="{'is-admin': o.isAdmin}">
                         <span user-info="o" info-class="oper-avatar" info-avatar></span>
-                        <span info-class="h4" user-info="o" info-name></span>
-                        <span to-class="h5" message-to="o" to-class="message-to-icon"></span>
+                        <div class="oper-info">
+                            <span info-class="oper-name" user-info="o" info-name></span>
+                            <span to-class="oper-msg" message-to="o" to-class="message-to-icon"></span>
 
-                        <div class="margin-top-10">ID: {{o.username}}</div>
-                        <div>{{o.isAdmin ? 'Administrator' : 'Operator'}}</div>
-                        <i class="fa fa-user-circle-o text-danger oper-icon"></i>
+                            <div class="margin-top-10">ID: {{o.username}}</div>
+                            <div>{{o.isAdmin ? 'Administrator' : 'Operator'}}</div>
+                        </div>
                     </div>
                 </div>
             </div>