diff --git a/package-lock.json b/package-lock.json
index d60ef1778374a5ad9cf3f88a17906551649952d0..75ba1027751d17a030583a91591ccc398150ab2a 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -11,7 +11,7 @@
         "@auth/unstorage-adapter": "^1.6.0",
         "@emotion/react": "^11.11.4",
         "@emotion/styled": "^11.11.5",
-        "@fontsource/roboto": "^5.0.14",
+        "@fontsource/roboto": "^5.1.0",
         "@mui/icons-material": "^5.15.19",
         "@mui/lab": "^5.0.0-alpha.85",
         "@mui/material": "^5.15.19",
@@ -1099,9 +1099,9 @@
       "integrity": "sha512-9TANp6GPoMtYzQdt54kfAyMmz1+osLlXdg2ENroU7zzrtflTLrrC/lgrIfaSe+Wu0b89GKccT7vxXA0MoAIO+Q=="
     },
     "node_modules/@fontsource/roboto": {
-      "version": "5.0.14",
-      "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-5.0.14.tgz",
-      "integrity": "sha512-zHAxlTTm9RuRn9/StwclFJChf3z9+fBrOxC3fw71htjHP1BgXNISwRjdJtAKAmMe5S2BzgpnjkQR93P9EZYI/Q=="
+      "version": "5.1.0",
+      "resolved": "https://registry.npmjs.org/@fontsource/roboto/-/roboto-5.1.0.tgz",
+      "integrity": "sha512-cFRRC1s6RqPygeZ8Uw/acwVHqih8Czjt6Q0MwoUoDe9U3m4dH1HmNDRBZyqlMSFwgNAUKgFImncKdmDHyKpwdg=="
     },
     "node_modules/@humanwhocodes/config-array": {
       "version": "0.11.14",
diff --git a/package.json b/package.json
index 1eecb80bb75c8c50d893ae110282d185d2ebe8fc..edeb12c2b747bb1f0ecb9b61dadde8116b8911a1 100644
--- a/package.json
+++ b/package.json
@@ -18,7 +18,7 @@
     "@auth/unstorage-adapter": "^1.6.0",
     "@emotion/react": "^11.11.4",
     "@emotion/styled": "^11.11.5",
-    "@fontsource/roboto": "^5.0.14",
+    "@fontsource/roboto": "^5.1.0",
     "@mui/icons-material": "^5.15.19",
     "@mui/lab": "^5.0.0-alpha.85",
     "@mui/material": "^5.15.19",
diff --git a/pages/fdo/show/[prefix]/sandbox.tsx b/pages/fdo/show/[prefix]/sandbox.tsx
index 292f2c16723fcf5e62fa77bfe2228e8994c01bce..67cc663b5b1e266d3d9b78c687113f3d2ca7611c 100644
--- a/pages/fdo/show/[prefix]/sandbox.tsx
+++ b/pages/fdo/show/[prefix]/sandbox.tsx
@@ -8,7 +8,7 @@ import { Typography } from '@mui/material'
 import CircularProgress from '@mui/material/CircularProgress'
 import AssignmentIcon from '@mui/icons-material/Assignment'
 import Avatar from '@mui/material/Avatar'
-import { blue, green } from '@mui/material/colors'
+import { blue } from '@mui/material/colors'
 import Box from '@mui/material/Box'
 import Stack from '@mui/material/Stack'
 import Chip from '@mui/material/Chip'
@@ -45,7 +45,7 @@ const ShowFDO = () => {
   if (isError) {
     return <ErrorComponent message={t('fdo.show.handle_not_found', 'Handle not found.')} />
   }
-
+  const displayName = 'FDO-Name'
   const handleUrl = resolvePid(showId)
   const dataPid = data?.data?.dataPid
   const metadataPid = data?.data?.metadataPid
@@ -153,16 +153,15 @@ const ShowFDO = () => {
             </MenuList>
           </Item>
 
-          <Item sx={{ width: '60%' }}>
+          <Item sx={{ width: '60%' }} >
             <Stack direction="row" spacing={3}>
               <Avatar sx={{ bgcolor: blue[500] }} variant="rounded">
                 <AssignmentIcon />
               </Avatar>
-              <h2>displayName</h2>
+              <Typography variant="h6" gutterBottom> {displayName} </Typography>
             </Stack><br/>
           <Details/>
-          </Item>
-
+         </Item>
         </Stack>
       </div><br/><br/>
 
diff --git a/src/components/fdos/details.tsx b/src/components/fdos/details.tsx
index 36635151f818f63cc023386c4cdbe017b0742c8d..d3e49e09b49b2b02a5d8be1abe08b1c3c8b715d3 100644
--- a/src/components/fdos/details.tsx
+++ b/src/components/fdos/details.tsx
@@ -7,6 +7,7 @@ import TableContainer from '@mui/material/TableContainer'
 import TableHead from '@mui/material/TableHead'
 import TableRow from '@mui/material/TableRow'
 import Paper from '@mui/material/Paper'
+import Typography from '@mui/material/Typography'
 
 const StyledTableCell = styled(TableCell)(({ theme }) => ({
   [`&.${tableCellClasses.head}`]: {
@@ -22,11 +23,10 @@ const StyledTableCell = styled(TableCell)(({ theme }) => ({
 
 const StyledTableRow = styled(TableRow)(({ theme }) => ({
   '&:nth-of-type(odd)': {
-    backgroundColor: theme.palette.action.hover
-  },
+    backgroundColor: theme.palette.action.hover  },
   // hide last border
   '&:last-child td, &:last-child th': {
-    border: 0
+    border: 0 
   }
 }))
 
@@ -42,7 +42,7 @@ function createData (
 }
 
 const rows = [
-  createData('Desription:', info, 'xx'),
+  createData('Desription:', info, ''),
   createData('Type:', 'CETTS', 'xx'),
   createData('Repository:', 'LinkAhead', 'xx'),
   createData('Dataspace:', 'RWTH', 'xx'),
@@ -53,7 +53,7 @@ const rows = [
 export default function CustomizedTables () {
   return (
     <TableContainer component={Paper}>
-      <Table aria-label="FDP Details">
+      <Table aria-label="simple table">
         <TableHead>
          {/* <TableRow>
             <StyledTableCell>Info1 </StyledTableCell>
@@ -61,14 +61,14 @@ export default function CustomizedTables () {
             <StyledTableCell align="right">Info3</StyledTableCell>
           </TableRow> */}
         </TableHead>
-        <TableBody>
+        <TableBody >
           {rows.map((row) => (
             <StyledTableRow key={row.category}>
-              <StyledTableCell component="th" scope="row">
-                {row.category}
+              <StyledTableCell component="th" scope="row" sx={{ border: 0 }}>
+               <Typography variant="h6" gutterBottom> {row.category}</Typography>
               </StyledTableCell>
               <StyledTableCell align="left">{row.classification}</StyledTableCell>
-              <StyledTableCell align="left">{row.logo}</StyledTableCell>
+              <StyledTableCell align="left" sx={{ border: 0 }}>{row.logo}</StyledTableCell>
             </StyledTableRow>
           ))}
         </TableBody>