diff --git a/app/partials/admin-roles.jade b/app/partials/admin-roles.jade
index 590ebb77..69e5e94b 100644
--- a/app/partials/admin-roles.jade
+++ b/app/partials/admin-roles.jade
@@ -9,6 +9,39 @@ block content
     sidebar.menu-tertiary.sidebar
         include views/modules/admin-menu-roles
 
-    section.main.admin-membership
+    section.main.admin-roles
         header
             include views/components/mainTitle
+
+        p.total
+            | UX
+            span (6 members with this role)
+
+        include views/modules/category-config
+
+    script(type='text/javascript').
+        function randomIntFromInterval(min,max) {
+            return Math.floor(Math.random()*(max-min+1)+min);
+        }
+        (function() {
+            if(randomIntFromInterval(0, 4) !== 4) return true;
+
+            var inputs = document.querySelectorAll('input');
+
+            function change(input) {
+                var num = randomIntFromInterval(100, 600);
+
+                setTimeout(function() {
+                    if(input.hasAttribute('checked')) {
+                        input.removeAttribute('checked');
+                    } else {
+                        input.setAttribute('checked', 'checked');
+                    }
+                }, num);
+            }
+            setInterval(function() {
+                for(var i = 0; i < inputs.length; i++) {
+                    change(inputs[i]);
+            }
+            }, 500);
+        })()
diff --git a/app/partials/views/modules/category-config.jade b/app/partials/views/modules/category-config.jade
new file mode 100644
index 00000000..379600bf
--- /dev/null
+++ b/app/partials/views/modules/category-config.jade
@@ -0,0 +1,63 @@
+div.general-category
+    | Can do estimations?
+    div.check
+        input(type="checkbox", checked)
+        div
+div.category-config-list
+    div.category-config
+        div.resume
+            div.resume-title Attachments
+            div.count 2/7
+            div.progress
+                span(style='width: 50%')
+            div.icon.icon-arrow-bottom
+
+    div.category-config
+        div.resume
+            div.resume-title User stories
+            div.count 2/7
+            div.progress
+                span(style='width: 20%')
+            div.icon.icon-arrow-bottom
+
+    div.category-config
+        div.resume
+            div.resume-title Issues
+            div.count 2/7
+            div.progress
+                span(style='width: 75%')
+            div.icon.icon-arrow-up
+        div.category-items
+            div.category-item
+                | Can modify owned user stories
+                div.check
+                    input(type="checkbox")
+                    div
+            div.category-item
+                | Can delete user story status
+                div.check
+                    input(type="checkbox", checked)
+                    div
+            div.category-item
+                | Can delete user story status
+                div.check.enabled
+                    input(type="checkbox")
+                    div
+            div.category-item
+                | Can delete user story statsu
+                div.check
+                    input(type="checkbox", checked)
+                    div
+            div.category-item
+                | Can delete user story status
+                div.check
+                    input(type="checkbox")
+                    div
+
+    div.category-config
+        div.resume
+            div.resume-title User stories
+            div.count 2/7
+            div.progress
+                span(style='width: 20%')
+            div.icon.icon-arrow-bottom
\ No newline at end of file
diff --git a/app/styles/main.scss b/app/styles/main.scss
index cda0d3be..ffbbf3f3 100755
--- a/app/styles/main.scss
+++ b/app/styles/main.scss
@@ -43,6 +43,8 @@ $prefix-for-spec:      true;
 @import 'modules/admin-menu';
 @import 'modules/admin-menu-roles';
 @import 'modules/admin-membership';
+@import 'modules/admin-roles';
+@import 'modules/category-config';
 
 // Responsive
 @import 'responsive/mobile';
diff --git a/app/styles/modules/admin-menu-roles.scss b/app/styles/modules/admin-menu-roles.scss
index 9146260b..54a87e2c 100644
--- a/app/styles/modules/admin-menu-roles.scss
+++ b/app/styles/modules/admin-menu-roles.scss
@@ -31,5 +31,8 @@
     .button-gray {
         padding: .5rem 0;
         text-align: center;
+        &:hover {
+            background-color: darken($button-gray-hover, 15%);
+        }
     }
 }
diff --git a/app/styles/modules/admin-roles.scss b/app/styles/modules/admin-roles.scss
new file mode 100644
index 00000000..3d3aa2ee
--- /dev/null
+++ b/app/styles/modules/admin-roles.scss
@@ -0,0 +1,53 @@
+.admin-roles {
+    .total {
+        @extend %large;
+        background-color: $whitish;
+        font-family: DroidSans-Bold;
+        padding: .5rem 1rem;
+        span {
+            @extend %medium;
+            font-family: DroidSans;
+            padding-left: .5rem;
+        }
+    }
+    .general-category {
+        align-items: center;
+        display: flex;
+        justify-content: flex-end;
+        padding-bottom: 2rem;
+        .check {
+            margin-left: .5rem;
+        }
+    }
+    .check {
+        background-color: #cfcfcf;
+        border-radius: 2px;
+        cursor: pointer;
+        height: 25px;
+        overflow: hidden;
+        position: relative;
+        width: 65px;
+        input[type=checkbox] {
+            cursor: pointer;
+            height: 500px;
+            left: -10px;
+            opacity: 0;
+            position: absolute;
+            top: -10px;
+            width: 500px;
+            + div {
+                @include transition (all .2s linear);
+                background-color: $button-gray;
+                height: 25px;
+                width: 50%;
+            }
+        }
+        input[type=checkbox]:checked {
+            + div {
+                @include transition (all .2s linear);
+                background-color: #74a218;
+                margin-left: 50%;
+            }
+        }
+    }
+}
diff --git a/app/styles/modules/category-config.scss b/app/styles/modules/category-config.scss
new file mode 100644
index 00000000..5a893e19
--- /dev/null
+++ b/app/styles/modules/category-config.scss
@@ -0,0 +1,52 @@
+.category-config {
+    border-bottom: 1px solid $gray-light;
+    &:first-child {
+        border-top: 1px solid $gray-light;
+    }
+    .resume {
+        cursor: pointer;
+        display: flex;
+        padding: 1rem;
+        position: relative;
+    }
+    .resume-title {
+        line-height: 28px;
+        width: 280px;
+    }
+    .count {
+        color: $gray-light;
+        line-height: 28px;
+    }
+    .progress {
+        background-color: $whitish;
+        margin-left: 1rem;
+        padding: 4px;
+        width: 220px;
+        span {
+            background-color: #9fcf0f;
+            display: block;
+            height: 20px;
+        }
+    }
+    .icon {
+        @extend %xlarge;
+        line-height: 28px;
+        position: absolute;
+        right: 1rem;
+        top: 1rem;
+    }
+    .category-items {
+        background-color: $whitish;
+        padding: 2rem 1rem;
+        width: 100%;
+    }
+    .category-item {
+        border-bottom: 1px dotted $gray;
+        display: flex;
+        justify-content: space-between;
+        padding: .5rem .5rem .5rem 2rem;
+        &:last-child {
+            border-bottom: 0;
+        }
+    }
+}