diff --git a/assets/less/zenodo-rdm/globals/site.overrides b/assets/less/zenodo-rdm/globals/site.overrides
index 32769d49..4d29f2da 100644
--- a/assets/less/zenodo-rdm/globals/site.overrides
+++ b/assets/less/zenodo-rdm/globals/site.overrides
@@ -55,11 +55,41 @@ a.inverted {
 }
 
 
-#contact-page {   
+#contact-page {
 
-  .panel-body {
-    padding-top: 2*@defaultPadding;
-    padding-left: 2*@defaultPadding;
+  .field.flex {
+    @media screen and (max-width: @largestMobileScreen) {
+      display: block;
+      width: 100% !important;
+    }
+
+    label {
+      min-width: 10rem;
+
+      + div {
+        flex: 1 1 0;
+      }
+    }
+
+    .toggle {
+      text-align: left;
+    }
+  }
+  
+  .label-padding {
+    padding-left: 10rem;
+
+    @media screen and (max-width: @largestMobileScreen) {
+      padding-left: 0;
+    }
+  }
+
+  .dropzone {
+    width: 100%;
+    border: 1px solid @borderColor;
+    border-radius: @defaultBorderRadius;
+    padding: @defaultPadding;
+    cursor: pointer;
   }
 }
 
diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/CategoryDropdown.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/CategoryDropdown.js
index d874b427..84d1ed3a 100644
--- a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/CategoryDropdown.js
+++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/CategoryDropdown.js
@@ -38,7 +38,7 @@ class CategoryDropdown extends Component {
     }
 
     render() {
-        const { categories } = this.props;
+        const { categories, className } = this.props;
         const { activeCategory} = this.state;
 
         const serializedCategories = categories.map((cat) => (this.serializeCategory(cat)));
@@ -52,8 +52,12 @@ class CategoryDropdown extends Component {
                     required
                     width={4}
                     onChange={this.onChange}
+                    className={className}
+                />
+                <div
+                    className="label-padding"
+                    dangerouslySetInnerHTML={{ __html: activeCategory?.description }}
                 />
-                {<div dangerouslySetInnerHTML={{ __html: activeCategory?.description }}/>}
             </>
         )
     }
@@ -61,12 +65,14 @@ class CategoryDropdown extends Component {
 
 CategoryDropdown.propTypes = {
     categories: PropTypes.array,
-    defaultCategory: PropTypes.string
+    defaultCategory: PropTypes.string,
+    className: PropTypes.string,
 };
 
 CategoryDropdown.defaultProps = {
     categories: [],
-    defaultCategory: ''
+    defaultCategory: '',
+    className: '',
 };
 
 export default CategoryDropdown;
\ No newline at end of file
diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/FileUploader.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/FileUploader.js
index 0af8f1e1..18281c6e 100644
--- a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/FileUploader.js
+++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/FileUploader.js
@@ -6,33 +6,30 @@ import FileTable from "./FileTable";
 
 const FileUploader = ({ dropzoneParams, maxFileSize, name, currentFiles, handleDelete }) => {
     return (
-        <Dropzone {...dropzoneParams}>
-            {({ getRootProps, getInputProps }) => {
-                const inpProps = {
-                    ...getInputProps(),
-                    // Display the dropzone input, otherwise it's hidden by default.
-                    style: {
-                        'display': 'block'
-                    },
-                    name: name
-                }
-                return (
-                    <div {...getRootProps()}>
-                        <input {...inpProps} />
-                        <label className="helptext mt-0">
-                            {`Optional. Max attachments size:`} {humanReadableBytes(maxFileSize, false)}
-                        </label>
-                        {currentFiles.length > 0
-                            &&
-                            <FileTable
-                                handleDelete={handleDelete}
-                                filesList={currentFiles}
-                            />
-                        }
+        <div>
+            <Dropzone {...dropzoneParams}>
+                {({ getRootProps, getInputProps }) => (
+                    <div id="file-dropzone" {...getRootProps({className: "dropzone"})}>
+                        <input {...getInputProps()} name={name} />
+                        <p className="ui medium header text-align-center m-0">
+                            Drag files here, or click to select files
+                        </p>
                     </div>
-                )
-            }}
-        </Dropzone>
+                )}
+            </Dropzone>
+
+            <label className="helptext mt-5">
+                {`Optional. Max attachments size:`} {humanReadableBytes(maxFileSize, false)}
+            </label>
+
+            {currentFiles.length > 0
+                &&
+                <FileTable
+                    handleDelete={handleDelete}
+                    filesList={currentFiles}
+                />
+            }
+        </div>
     );
 };
 
diff --git a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js
index 36ae193d..ec970aaa 100644
--- a/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js
+++ b/site/zenodo_rdm/assets/semantic-ui/js/zenodo_rdm/src/support/components/SupportForm.js
@@ -127,10 +127,8 @@ class SupportForm extends Component {
                             // TODO: show error message when files are rejected e.g size limit
                             console.error(rejectedFiles[0].errors);
                         },
-                        noClick: true,
-                        noKeyboard: true,
                         maxSize: maxFileSize,
-                        accept: ".jpeg,.jpg,.png"
+                        accept: ".jpeg,.jpg,.png",
                     };
                     return (
                         <SemanticForm
@@ -143,7 +141,8 @@ class SupportForm extends Component {
                                 fieldPath="name"
                                 required
                                 fluid={false}
-                                width={4}
+                                width={8}
+                                className="field flex"
                             />
                             <TextField
                                 disabled={isUserAuthenticated}
@@ -151,43 +150,30 @@ class SupportForm extends Component {
                                 fieldPath="email"
                                 required
                                 fluid={false}
-                                width={4}
+                                width={8}
+                                className="field flex"
                             />
                             <CategoryDropdown
                                 categories={categories}
                                 defaultCategory={defaultCategory}
+                                className="eight wide field flex"
                             />
                             <TextField
                                 label='Subject'
                                 fieldPath="subject"
-                                required
                                 fluid={false}
-                                className='mt-10'
+                                className='field flex rel-mt-1'
+                                required
                             />
                             <TextAreaField
-                                label='Description'
+                                label='How can we help?'
                                 fieldPath="description"
+                                className="field flex"
                                 required
                             />
-                            <div className="field">
-                                <label>
-                                    {`Browser & OS`}
-                                </label>
-                                <ToggleField
-                                    fieldPath='sysInfo'
-                                    offLabel='Include browser and system information to assist us with narrowing down the cause of your problem.'
-                                    onLabel='Include browser and system information to assist us with narrowing down the cause of your problem.'
-                                    offValue={false}
-                                    onValue={true}
-                                />
-                                <label className="helptext">
-                                    {sysInfo}
-                                </label>
-                            </div>
-                            <div className="field">
-                                <label>
-                                    {`Files`}
-                                </label>
+
+                            <div className="field flex">
+                                <label htmlFor="file-dropzone">Files</label>
                                 <FileUploader
                                     dropzoneParams={dropzoneParams}
                                     maxFileSize={maxFileSize}
@@ -200,7 +186,24 @@ class SupportForm extends Component {
                                     }}
                                 />
                             </div>
-                            <Modal.Actions>
+
+                            <div className="field flex">
+                                <label htmlFor="sysInfo">
+                                    Browser & OS
+                                </label>
+                                <div>
+                                    <ToggleField
+                                        fieldPath='sysInfo'
+                                        offLabel='Include browser and system information to assist us with narrowing down the cause of your problem.'
+                                        onLabel='Include browser and system information to assist us with narrowing down the cause of your problem.'
+                                        offValue={false}
+                                        onValue={true}
+                                    />
+                                    <label className="helptext">{sysInfo}</label>
+                                </div>
+                            </div>
+                            
+                            <Modal.Actions className="label-padding">
                                 <Button type="submit" positive>
                                     Send Request
                                 </Button>
diff --git a/site/zenodo_rdm/templates/semantic-ui/zenodo_rdm/support.html b/site/zenodo_rdm/templates/semantic-ui/zenodo_rdm/support.html
index 7972bba7..338823ad 100644
--- a/site/zenodo_rdm/templates/semantic-ui/zenodo_rdm/support.html
+++ b/site/zenodo_rdm/templates/semantic-ui/zenodo_rdm/support.html
@@ -8,9 +8,9 @@
 {%- set userData = user and { 'email': user.email, 'full_name': user.user_profile.full_name }%}
 
 {% block grid_section %}
-    <div id="contact-page" class="ui one column grid container p-15">
+    <div id="contact-page" class="ui one column grid container rel-pt-3">
         <div class="row">
-            <div class="column">
+            <div class="sixteen wide mobile sixteen wide tablet ten wide computer column">
                 <div class="panel-body mt-5">
                     <h2 class="ui header mb-10">Contact us</h2>
                     <p>Before making a request, you can have a look at our <a href="http://help.zenodo.org">FAQ</a> and <a href="http://about.zenodo.org">other resources</a> for more detailed information about the operation, features and goals of Zenodo.</p>
@@ -21,7 +21,7 @@ <h2 class="ui header mb-10">Contact us</h2>
             </div>
         </div>
         <div class="row">
-            <div class="column">
+            <div class="sixteen wide mobile sixteen wide tablet ten wide computer column">
                 {% block root_section %}    
                     <div id="zenodo-rdm-support-root" class="panel-body"></div>
                 {% endblock %}