diff --git a/src/Components/RequirementsDialog.js b/src/Components/RequirementsDialog.js
index 7299b51fe046596f9333e81b3d2d3b27ba99ba3f..c890878b8bd5c0eef2212491fcf9eabd8e2c86c6 100644
--- a/src/Components/RequirementsDialog.js
+++ b/src/Components/RequirementsDialog.js
@@ -1,104 +1,74 @@
 import React from 'react';
-import { withStyles } from '@material-ui/core/styles';
+import { makeStyles } from '@material-ui/core/styles';
 import Button from '@material-ui/core/Button';
 import Dialog from '@material-ui/core/Dialog';
-import MuiDialogTitle from '@material-ui/core/DialogTitle';
-import MuiDialogContent from '@material-ui/core/DialogContent';
-import MuiDialogActions from '@material-ui/core/DialogActions';
-import IconButton from '@material-ui/core/IconButton';
-import CloseIcon from '@material-ui/icons/Close';
-import Typography from '@material-ui/core/Typography';
-import DetailsIcon from '@material-ui/icons/Details';
-import styled from 'styled-components'
-import { spacing } from '@material-ui/system'
+import DialogActions from '@material-ui/core/DialogActions';
+import DialogContent from '@material-ui/core/DialogContent';
+import DialogContentText from '@material-ui/core/DialogContentText';
+import DialogTitle from '@material-ui/core/DialogTitle';
+import FormControl from '@material-ui/core/FormControl';
+import FormControlLabel from '@material-ui/core/FormControlLabel';
+import InputLabel from '@material-ui/core/InputLabel';
+import MenuItem from '@material-ui/core/MenuItem';
+import Select from '@material-ui/core/Select';
+import Switch from '@material-ui/core/Switch';
 
-const styles = theme => ({
-  root: {
-    margin: 0,
-    padding: theme.spacing(2),
+const useStyles = makeStyles(theme => ({
+  form: {
+    display: 'flex',
+    flexDirection: 'column',
+    margin: 'auto',
+    width: 'fit-content',
   },
-  closeButton: {
-    position: 'absolute',
-    right: theme.spacing(1),
-    top: theme.spacing(1),
-    color: theme.palette.grey[500],
+  formControl: {
+    marginTop: theme.spacing(2),
+    minWidth: 120,
   },
-});
-
-const DialogTitle = withStyles(styles)(props => {
-  const { children, classes, onClose, ...other } = props;
-  return (
-    <MuiDialogTitle disableTypography className={classes.root} {...other}>
-      <Typography variant="h6" mr={8} pr={8}>{children}</Typography>
-      {onClose ? (
-        <IconButton aria-label="close" className={classes.closeButton} onClick={onClose}>
-          <CloseIcon />
-        </IconButton>
-      ) : null}
-    </MuiDialogTitle>
-  );
-});
-
-const DialogContent = withStyles(theme => ({
-  root: {
-    padding: theme.spacing(2),
+  formControlLabel: {
+    marginTop: theme.spacing(1),
   },
-}))(MuiDialogContent);
+}));
 
-const DialogActions = withStyles(theme => ({
-  root: {
-    margin: 0,
-    padding: theme.spacing(1),
-  },
-}))(MuiDialogActions);
-
-export default function RequirementDialog(props) {
+export default function MaxWidthDialog(props) {
+  const classes = useStyles();
   const [open, setOpen] = React.useState(false);
+  const fullWidth = true;
+  const maxWidth = 'sm';
 
   const handleClickOpen = () => {
     setOpen(true);
   };
+
   const handleClose = () => {
     setOpen(false);
   };
 
   return (
-    <div>
+    <React.Fragment>
       <Button variant="outlined" color="primary" onClick={handleClickOpen}>
-        <DetailsIcon /> Saiba mais
+        Mais
       </Button>
-      <Dialog onClose={handleClose} aria-labelledby="customized-dialog-title" open={open}>
-        <DialogTitle pr={5} mr={5} w-75 id="customized-dialog-title" onClose={handleClose}>
-            {props.title}
-        </DialogTitle>
-        <DialogContent dividers>
-          <Typography gutterBottom>
-              {props.description}
-              <h2>Requisitos</h2>
-              {props.requirements.map(
-                  (r) => {
-                  return (<div>
-                      <RequirementTitle>{r.name}</RequirementTitle>
-                      <RequirementDescription>{r.description}</RequirementDescription>
-                  </div>
-                  );}
-              )}
-          </Typography>
+      <Dialog
+        fullWidth={fullWidth}
+        maxWidth={maxWidth}
+        open={open}
+        onClose={handleClose}
+        aria-labelledby="max-width-dialog-title"
+      >
+        <DialogTitle id="max-width-dialog-title">Detalhes - {props.title}</DialogTitle>
+        <DialogContent>
+          <DialogContentText>
+            {props.description}
+            <h4>Requisitos</h4>
+          </DialogContentText>
         </DialogContent>
         <DialogActions>
-          <Button autoFocus onClick={handleClose} color="primary">
-            Save changes
+          <Button onClick={handleClose} color="primary">
+            Fechar
           </Button>
         </DialogActions>
       </Dialog>
-    </div>
+    </React.Fragment>
   );
 }
 
-const RequirementDescription = styled.p`
-    margin-left: 20px;
-    margin-right: 20px;
-`
-
-const RequirementTitle = styled.h3`
-`
\ No newline at end of file