diff --git a/Form/Core/DateFields.js b/Form/Core/DateFields.js
index 8c8ec3f..46da066 100644
--- a/Form/Core/DateFields.js
+++ b/Form/Core/DateFields.js
@@ -1,8 +1,10 @@
 import tw, { styled } from "twin.macro";
 import "styled-components/macro";
 import dayjs from "dayjs";
+import { DatePickerInput } from '@mantine/dates';
+import '@mantine/dates/styles.css';
 
-import Input, { useField } from "@shared/nej-react-components/Parts/Input";
+import { useField } from "@shared/nej-react-components/Parts/Input";
 
 export default function DateField(props) {
   
@@ -13,7 +15,10 @@ export default function DateField(props) {
 
   const {value: _x, onChange: _y, ...restProps} = props;
 
-  return <Input type="date" 
-    value={isValid ? parsedDate.format("YYYY-MM-DD") : ""} 
-    onChange={(e)=>onChange({ target: { value: e.target.value ? dayjs(e.target.value).toDate() : null, name: field.name } })} {...field}  {...restProps} />;
+  return <DatePickerInput 
+    value={isValid ? parsedDate.toDate() : null} 
+    onChange={(val)=>onChange({ target: { value: val, name: field.name } })} 
+    {...field}  
+    {...restProps} 
+  />;
 }
diff --git a/Form/Core/DateTimeField.js b/Form/Core/DateTimeField.js
index 653c1bc..001733a 100644
--- a/Form/Core/DateTimeField.js
+++ b/Form/Core/DateTimeField.js
@@ -1,22 +1,31 @@
 import tw, { styled } from "twin.macro";
 import "styled-components/macro";
 import dayjs from "dayjs";
+import utc from "dayjs/plugin/utc";
+import { DateTimePicker } from '@mantine/dates';
+import '@mantine/dates/styles.css';
 
-import Input, { useField } from "@shared/nej-react-components/Parts/Input";
+dayjs.extend(utc);
+
+import { useField } from "@shared/nej-react-components/Parts/Input";
 
 export default function DateTimeField(props) {
   
   const [{onChange, value, ...field}, meta, helpers] = useField(props);
 
-  const parsedDate = dayjs(value);
+  const parsedDate = dayjs.utc(value);
   const isValid = value && parsedDate.isValid();
+  const displayDate = isValid ? dayjs(parsedDate.format("YYYY-MM-DDTHH:mm:ss")).toDate() : null;
 
   const {value: _x, onChange: _y, ...restProps} = props;
 
-  return <Input type="datetime-local" 
-    value={isValid ? parsedDate.format("YYYY-MM-DDTHH:mm") : ""} 
-    onChange={(e)=>{
-      const val = e.target.value;
-      onChange({ target: { value: val ? dayjs(val).toDate() : null, name: field.name } });
-    }} {...field}  {...restProps} />;
+  return <DateTimePicker 
+    value={displayDate} 
+    onChange={(val)=>{
+      const outDate = val ? dayjs.utc(dayjs(val).format("YYYY-MM-DDTHH:mm:ss")).toDate() : null;
+      onChange({ target: { value: outDate, name: field.name } });
+    }} 
+    {...field}  
+    {...restProps} 
+  />;
 }