diff --git a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.roles/roles.hbs b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.roles/roles.hbs
index b9c4083c4e4..8524aa0051a 100644
--- a/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.roles/roles.hbs
+++ b/components/device-mgt/org.wso2.carbon.device.mgt.ui/src/main/resources/jaggeryapps/devicemgt/app/pages/cdmf.page.roles/roles.hbs
@@ -101,52 +101,52 @@ under the License.
 
 
     <div id="remove-role-modal-content" class="hide">
-        <div class="content">
-            <div class="row">
-                <div class="col-lg-5 col-md-6 col-centered">
-                    <h3>Do you really want to remove this role ?</h3>
-
-                    <div class="buttons">
-                        <a href="#" id="remove-role-yes-link" class="btn-operations">
-                            Remove
-                        </a>
-                        <a href="#" id="remove-role-cancel-link" class="btn-operations">
-                            Cancel
-                        </a>
-                    </div>
-                </div>
+        <div class="modal-header">
+            <h3 class="pull-left modal-title">Do you really want to remove this role ?</h3>
+            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fw fw-cancel"></i></button>
+        </div>
+        <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+        </div>
+        <div class="modal-footer">
+            <div class="buttons">
+                <a href="#" id="remove-role-yes-link" class="btn-operations">
+                    Remove
+                </a>
+                <a href="#" id="remove-role-cancel-link" class="btn-operations">
+                    Cancel
+                </a>
             </div>
         </div>
     </div>
 
     <div id="remove-role-success-content" class="hide">
-        <div class="content">
-            <div class="row">
-                <div class="col-lg-5 col-md-6 col-centered">
-                    <h3>Done. Role was successfully removed.</h3>
-
-                    <div class="buttons">
-                        <a href="#" id="remove-role-success-link" class="btn-operations">
-                            Ok
-                        </a>
-                    </div>
-                </div>
+        <div class="modal-header">
+            <h3 class="pull-left modal-title">Done. Role was successfully removed.</h3>
+            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fw fw-cancel"></i></button>
+        </div>
+        <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+        </div>
+        <div class="modal-footer">
+            <div class="buttons">
+                <a href="#" id="remove-role-success-link" class="btn-operations">
+                    Ok
+                </a>
             </div>
         </div>
     </div>
 
     <div id="remove-role-error-content" class="hide">
-        <div class="content">
-            <div class="row">
-                <div class="col-lg-5 col-md-6 col-centered">
-                    <h3>An unexpected error occurred. Please try again later.</h3>
-
-                    <div class="buttons">
-                        <a href="#" id="remove-role-error-link" class="btn-operations">
-                            Ok
-                        </a>
-                    </div>
-                </div>
+        <div class="modal-header">
+            <h3 class="pull-left modal-title">An unexpected error occurred. Please try again later.</h3>
+            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><i class="fw fw-cancel"></i></button>
+        </div>
+        <div class="modal-body add-margin-top-2x add-margin-bottom-2x">
+        </div>
+        <div class="modal-footer">
+            <div class="buttons">
+                <a href="#" id="remove-role-error-link" class="btn-operations">
+                    Ok
+                </a>
             </div>
         </div>
     </div>