diff --git a/react/features/etherpad/components/native/SharedDocument.js b/react/features/etherpad/components/native/SharedDocument.js
index b7a5d433b..1b6efa8c3 100644
--- a/react/features/etherpad/components/native/SharedDocument.js
+++ b/react/features/etherpad/components/native/SharedDocument.js
@@ -59,9 +59,11 @@ class SharedDocument extends PureComponent<Props> {
                 addHeaderHeightValue = { true }
                 style = { styles.sharedDocContainer }>
                 <WebView
+                    hideKeyboardAccessoryView = { true }
                     renderLoading = { this._renderLoading }
                     source = {{ uri: _documentUrl }}
-                    startInLoadingState = { true } />
+                    startInLoadingState = { true }
+                    style = { styles.sharedDoc } />
             </JitsiScreen>
         );
     }
diff --git a/react/features/etherpad/components/native/styles.js b/react/features/etherpad/components/native/styles.js
index 4d4fa9ff6..a93e09c5e 100644
--- a/react/features/etherpad/components/native/styles.js
+++ b/react/features/etherpad/components/native/styles.js
@@ -1,22 +1,29 @@
 // @flow
 
-import { ColorPalette } from '../../../base/styles';
+import BaseTheme from '../../../base/ui/components/BaseTheme.native';
 
-export const INDICATOR_COLOR = ColorPalette.lightGrey;
+
+export const INDICATOR_COLOR = BaseTheme.palette.indicatorColor;
 
 export default {
     indicatorWrapper: {
         alignItems: 'center',
-        backgroundColor: ColorPalette.white,
+        backgroundColor: BaseTheme.palette.ui12,
         height: '100%',
         justifyContent: 'center'
     },
 
     sharedDocContainer: {
-        flex: 1
+        backgroundColor: BaseTheme.palette.ui12,
+        flex: 1,
+        paddingRight: BaseTheme.spacing[3]
+    },
+
+    sharedDoc: {
+        marginBottom: BaseTheme.spacing[3]
     },
 
     webView: {
-        backgroundColor: 'rgb(242, 242, 242)'
+        backgroundColor: BaseTheme.palette.ui12
     }
 };