diff --git a/doto-frontend/src/components/ModalContent.css b/doto-frontend/src/components/ModalContent.css
index 73708f8a..1398dae4 100644
--- a/doto-frontend/src/components/ModalContent.css
+++ b/doto-frontend/src/components/ModalContent.css
@@ -51,10 +51,13 @@
 }
 
 #add-button {
+    position: relative;
+    right: -20px;
     text-align: right;
-    padding-top: 40px;
-    padding-bottom: 15px;
-    padding-right: 15px;
+    padding-top: 10px;
+    padding-bottom: 10px;
+    padding-right: 10px;
+    padding-left: 10px;
 }
 
 .spacing {
diff --git a/doto-frontend/src/components/ModalContent.js b/doto-frontend/src/components/ModalContent.js
index 59c41ffb..81a92f9f 100644
--- a/doto-frontend/src/components/ModalContent.js
+++ b/doto-frontend/src/components/ModalContent.js
@@ -17,7 +17,7 @@ const useStyles = makeStyles(theme => ({
     root: {
         "& > *": {
             margin: theme.spacing(1),
-            width: '55vw',
+            width: "55vw",
         },
     },
     taskNameInput: {
@@ -220,14 +220,12 @@ const ModalContent = props => {
                                 <MenuItem value={5}>5 Minutes Before</MenuItem>
                             </Select>
                         </FormControl>
+                        <Button id="add-button" variant="contained" color="default" onClick={handleAdd}>
+                            ADD
+                        </Button>
                     </div>
                 </form>
             </div>
-            <div id="add-button">
-                <Button variant="contained" color="default" onClick={handleAdd}>
-                    ADD
-                </Button>
-            </div>
         </div>
     );
 };