Replace Button by Box in index

components/kat-kay-la.js

@@ -2,7 +2,7 @@ import PropTypes from 'prop-types'
 import {useRouter} from 'next/router'
 import {
   Grid,
-  Button
+  Box
 } from '@mui/material'
 
 export default function KatKayLa({tit, kantite, route}) {
@@ -10,9 +10,18 @@ export default function KatKayLa({tit, kantite, route}) {
 
   return (
     <Grid item sx={{marginTop: 1}}>
-      <Button sx={{width: 100}} variant='outlined' onClick={() => router.push(route).then(() => window.scrollTo(0, 0))}>
+      <Box sx={{
+        width: 100,
+        padding: 1,
+        border: '1px solid rgba(76, 175, 80, 0.5)',
+        color: 'rgb(76, 175, 80)',
+        borderRadius: '4px',
+        textAlign: 'center',
+        cursor: 'pointer'
+      }} onClick={() => router.push(route).then(() => window.scrollTo(0, 0))}
+      >
         {kantite} <br /> {tit}
-      </Button>
+      </Box>
     </Grid>
   )
 }