diff --git a/demo-shell-ng2/app/components/activiti/activiti-demo.component.css b/demo-shell-ng2/app/components/activiti/activiti-demo.component.css
index 15e60cbd0a..d15a1a7e6e 100644
--- a/demo-shell-ng2/app/components/activiti/activiti-demo.component.css
+++ b/demo-shell-ng2/app/components/activiti/activiti-demo.component.css
@@ -40,7 +40,7 @@
 }
 
 .activiti-demo-grid-item {
-    margin: 8px;
+    margin: 4px;
     box-shadow: 0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12);
     background-color: #f5f5f5;
     padding: 10px 10px 10px 10px;
@@ -59,14 +59,14 @@
 }
 
 .activiti-demo-tasks-list {
-    min-width: 300px;
+    min-width: 510px;
     padding: 0;
 }
 
 .activiti-demo-tasks-details,
 .activiti-demo-tasks-start {
     flex-grow: 1;
-    min-width: 730px;
+    min-width: 680px;
 }
 
 .activiti-demo-tasks-menu >>> .mat-list .mat-list-item .mat-list-item-content {
@@ -103,4 +103,8 @@
     vertical-align: middle;
     font-size: 14px;
     background-color: rgba(0,0,0,.05);
-}
\ No newline at end of file
+}
+
+.adf-pagination {
+    color: black;
+}
diff --git a/ng2-components/ng2-activiti-tasklist/README.md b/ng2-components/ng2-activiti-tasklist/README.md
index 53b8494545..1eef80467d 100644
--- a/ng2-components/ng2-activiti-tasklist/README.md
+++ b/ng2-components/ng2-activiti-tasklist/README.md
@@ -121,6 +121,8 @@ You can also use HTML-based schema declaration like shown below:
 | appId | string || The id of the app. |
 | processDefinitionKey | string || The processDefinitionKey of the process. |
 | processInstanceId | string || The processInstanceId of the process. |
+| page | number | 0 | The page of the tasks to fetch. |
+| size | number | 5 | The number of tasks to fetch. |
 | assignment | string || The assignment of the process. <ul>Possible values are: <li>assignee : where the current user is the assignee</li> <li>candidate: where the current user is a task candidate </li><li>group_x: where the task is assigned to a group where the current user is a member of.</li> <li>no value: where the current user is involved</li> </ul> |
 | state | string || Define state of the processes. Possible values are: `completed`, `active` |
 | hasIcon | boolean | true | Toggle the icon on the left . |
diff --git a/ng2-components/ng2-activiti-tasklist/index.ts b/ng2-components/ng2-activiti-tasklist/index.ts
index 5b5d6667d6..634ad4517c 100644
--- a/ng2-components/ng2-activiti-tasklist/index.ts
+++ b/ng2-components/ng2-activiti-tasklist/index.ts
@@ -18,7 +18,7 @@
 import { DatePipe } from '@angular/common';
 import { ModuleWithProviders, NgModule, NO_ERRORS_SCHEMA } from '@angular/core';
 import { MdAutocompleteModule, MdButtonModule, MdCardModule, MdDatepickerModule, MdGridListModule,
-    MdIconModule, MdInputModule, MdNativeDateModule, MdProgressSpinnerModule, MdSelectModule, MdRippleModule } from '@angular/material';
+    MdIconModule, MdInputModule, MdNativeDateModule, MdProgressSpinnerModule, MdRippleModule, MdSelectModule } from '@angular/material';
 import { ActivitiFormModule } from 'ng2-activiti-form';
 import { CoreModule, TRANSLATION_PROVIDER } from 'ng2-alfresco-core';
 import { DataTableModule } from 'ng2-alfresco-datatable';