From 8f8772893dcca539c2c7cbf1e4a1ca82ba972a6f Mon Sep 17 00:00:00 2001
From: "13621160019@163.com" <13621160019@163.com>
Date: Wed, 31 Mar 2021 18:17:36 +0800
Subject: [PATCH] changed query form column width from auto to xs={6} sm={3} in
 Web UI

---
 .../MyEMS/AuxiliarySystem/DistributionSystem.js      |  2 +-
 .../MyEMS/AuxiliarySystem/EnergyFlowDiagram.js       |  2 +-
 .../MyEMS/CombinedEquipment/CombinedEquipmentCost.js | 10 +++++-----
 .../CombinedEquipment/CombinedEquipmentEfficiency.js | 10 +++++-----
 .../CombinedEquipmentEnergyCategory.js               | 10 +++++-----
 .../CombinedEquipment/CombinedEquipmentEnergyItem.js | 10 +++++-----
 .../CombinedEquipment/CombinedEquipmentIncome.js     | 10 +++++-----
 .../MyEMS/CombinedEquipment/CombinedEquipmentLoad.js | 10 +++++-----
 .../CombinedEquipment/CombinedEquipmentOutput.js     | 10 +++++-----
 .../CombinedEquipment/CombinedEquipmentSaving.js     | 10 +++++-----
 .../CombinedEquipment/CombinedEquipmentStatistics.js | 10 +++++-----
 web/src/components/MyEMS/Equipment/EquipmentCost.js  | 10 +++++-----
 .../MyEMS/Equipment/EquipmentEfficiency.js           | 10 +++++-----
 .../MyEMS/Equipment/EquipmentEnergyCategory.js       | 10 +++++-----
 .../MyEMS/Equipment/EquipmentEnergyItem.js           | 10 +++++-----
 .../components/MyEMS/Equipment/EquipmentIncome.js    | 10 +++++-----
 web/src/components/MyEMS/Equipment/EquipmentLoad.js  | 10 +++++-----
 .../components/MyEMS/Equipment/EquipmentOutput.js    | 10 +++++-----
 .../components/MyEMS/Equipment/EquipmentSaving.js    | 10 +++++-----
 .../MyEMS/Equipment/EquipmentStatistics.js           | 10 +++++-----
 .../components/MyEMS/Equipment/EquipmentTracking.js  |  2 +-
 .../components/MyEMS/FDD/CombinedEquipmentFault.js   |  2 +-
 web/src/components/MyEMS/FDD/EquipmentFault.js       |  2 +-
 web/src/components/MyEMS/FDD/ShopfloorFault.js       |  2 +-
 web/src/components/MyEMS/FDD/SpaceFault.js           |  2 +-
 web/src/components/MyEMS/FDD/StoreFault.js           |  2 +-
 web/src/components/MyEMS/FDD/TenantFault.js          |  2 +-
 web/src/components/MyEMS/Meter/MeterCost.js          | 10 +++++-----
 web/src/components/MyEMS/Meter/MeterEnergy.js        | 10 +++++-----
 web/src/components/MyEMS/Meter/MeterRealtime.js      |  2 +-
 .../components/MyEMS/Meter/MeterSubmetersBalance.js  |  6 +++---
 web/src/components/MyEMS/Meter/MeterTracking.js      |  2 +-
 web/src/components/MyEMS/Meter/MeterTrend.js         |  6 +++---
 web/src/components/MyEMS/Meter/OfflineMeterCost.js   | 10 +++++-----
 web/src/components/MyEMS/Meter/OfflineMeterEnergy.js | 10 +++++-----
 web/src/components/MyEMS/Meter/VirtualMeterCost.js   | 10 +++++-----
 web/src/components/MyEMS/Meter/VirtualMeterEnergy.js | 10 +++++-----
 .../MyEMS/Monitoring/CombinedEquipments.js           |  2 +-
 .../MyEMS/Monitoring/ShopfloorEquipments.js          |  2 +-
 .../components/MyEMS/Monitoring/SpaceEquipments.js   |  2 +-
 .../components/MyEMS/Monitoring/StoreEquipments.js   |  2 +-
 .../components/MyEMS/Monitoring/TenantEquipments.js  |  2 +-
 web/src/components/MyEMS/Shopfloor/ShopfloorCost.js  | 10 +++++-----
 .../MyEMS/Shopfloor/ShopfloorEnergyCategory.js       | 10 +++++-----
 .../MyEMS/Shopfloor/ShopfloorEnergyItem.js           | 10 +++++-----
 web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js  | 10 +++++-----
 .../components/MyEMS/Shopfloor/ShopfloorSaving.js    | 10 +++++-----
 .../MyEMS/Shopfloor/ShopfloorStatistics.js           | 10 +++++-----
 web/src/components/MyEMS/Space/SpaceCost.js          | 10 +++++-----
 web/src/components/MyEMS/Space/SpaceEfficiency.js    | 10 +++++-----
 .../components/MyEMS/Space/SpaceEnergyCategory.js    | 10 +++++-----
 web/src/components/MyEMS/Space/SpaceEnergyItem.js    | 10 +++++-----
 web/src/components/MyEMS/Space/SpaceIncome.js        | 10 +++++-----
 web/src/components/MyEMS/Space/SpaceLoad.js          | 12 +++++-------
 web/src/components/MyEMS/Space/SpaceOutput.js        | 10 +++++-----
 web/src/components/MyEMS/Space/SpaceSaving.js        | 10 +++++-----
 web/src/components/MyEMS/Space/SpaceStatistics.js    | 10 +++++-----
 web/src/components/MyEMS/Store/StoreCost.js          | 10 +++++-----
 .../components/MyEMS/Store/StoreEnergyCategory.js    | 10 +++++-----
 web/src/components/MyEMS/Store/StoreEnergyItem.js    | 10 +++++-----
 web/src/components/MyEMS/Store/StoreLoad.js          | 10 +++++-----
 web/src/components/MyEMS/Store/StoreSaving.js        | 10 +++++-----
 web/src/components/MyEMS/Store/StoreStatistics.js    | 10 +++++-----
 web/src/components/MyEMS/Tenant/TenantBill.js        |  6 +++---
 web/src/components/MyEMS/Tenant/TenantCost.js        | 10 +++++-----
 .../components/MyEMS/Tenant/TenantEnergyCategory.js  | 10 +++++-----
 web/src/components/MyEMS/Tenant/TenantEnergyItem.js  | 10 +++++-----
 web/src/components/MyEMS/Tenant/TenantLoad.js        | 10 +++++-----
 web/src/components/MyEMS/Tenant/TenantSaving.js      | 10 +++++-----
 web/src/components/MyEMS/Tenant/TenantStatistics.js  | 10 +++++-----
 70 files changed, 280 insertions(+), 282 deletions(-)

diff --git a/web/src/components/MyEMS/AuxiliarySystem/DistributionSystem.js b/web/src/components/MyEMS/AuxiliarySystem/DistributionSystem.js
index 37f0cbda..d46b61eb 100644
--- a/web/src/components/MyEMS/AuxiliarySystem/DistributionSystem.js
+++ b/web/src/components/MyEMS/AuxiliarySystem/DistributionSystem.js
@@ -122,7 +122,7 @@ const DistributionSystem = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form >
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup>
                   <Label className={labelClasses} for="distributionSystemSelect">
                     {t('Distribution System')}
diff --git a/web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js b/web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js
index 7ae80801..041245cd 100644
--- a/web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js
+++ b/web/src/components/MyEMS/AuxiliarySystem/EnergyFlowDiagram.js
@@ -206,7 +206,7 @@ const EnergyFlowDiagram = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup>
                   <Label className={labelClasses} for="energyFlowDiagramSelect">
                     {t('Energy Flow Diagram')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentCost.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentCost.js
index 0fe0ffaa..f2ad26c7 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentCost.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentCost.js
@@ -564,7 +564,7 @@ const CombinedEquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -625,7 +625,7 @@ const CombinedEquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -638,7 +638,7 @@ const CombinedEquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -651,7 +651,7 @@ const CombinedEquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -663,7 +663,7 @@ const CombinedEquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEfficiency.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEfficiency.js
index c37a3fb4..1cba1287 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEfficiency.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEfficiency.js
@@ -462,7 +462,7 @@ const CombinedEquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -523,7 +523,7 @@ const CombinedEquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -536,7 +536,7 @@ const CombinedEquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -549,7 +549,7 @@ const CombinedEquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -561,7 +561,7 @@ const CombinedEquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyCategory.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyCategory.js
index ea2e8473..908dc17f 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyCategory.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyCategory.js
@@ -566,7 +566,7 @@ const CombinedEquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) =>
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -627,7 +627,7 @@ const CombinedEquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) =>
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -640,7 +640,7 @@ const CombinedEquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) =>
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -653,7 +653,7 @@ const CombinedEquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) =>
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -665,7 +665,7 @@ const CombinedEquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) =>
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyItem.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyItem.js
index fb0470f8..37a34eeb 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyItem.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentEnergyItem.js
@@ -528,7 +528,7 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -590,7 +590,7 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -603,7 +603,7 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -616,7 +616,7 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -628,7 +628,7 @@ const CombinedEquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentIncome.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentIncome.js
index 8308f2b1..751fe5ae 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentIncome.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentIncome.js
@@ -530,7 +530,7 @@ const CombinedEquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -591,7 +591,7 @@ const CombinedEquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -604,7 +604,7 @@ const CombinedEquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -617,7 +617,7 @@ const CombinedEquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -629,7 +629,7 @@ const CombinedEquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentLoad.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentLoad.js
index 461e46ee..c1b0f107 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentLoad.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentLoad.js
@@ -519,7 +519,7 @@ const CombinedEquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -580,7 +580,7 @@ const CombinedEquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -593,7 +593,7 @@ const CombinedEquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -606,7 +606,7 @@ const CombinedEquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -618,7 +618,7 @@ const CombinedEquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentOutput.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentOutput.js
index e2c78b24..77de5603 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentOutput.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentOutput.js
@@ -491,7 +491,7 @@ const CombinedEquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -552,7 +552,7 @@ const CombinedEquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -565,7 +565,7 @@ const CombinedEquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -578,7 +578,7 @@ const CombinedEquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -590,7 +590,7 @@ const CombinedEquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentSaving.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentSaving.js
index e534c8b9..e78ac43e 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentSaving.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentSaving.js
@@ -530,7 +530,7 @@ const CombinedEquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -591,7 +591,7 @@ const CombinedEquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -604,7 +604,7 @@ const CombinedEquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -617,7 +617,7 @@ const CombinedEquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -629,7 +629,7 @@ const CombinedEquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentStatistics.js b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentStatistics.js
index 11c8a7b9..9c6dbb77 100644
--- a/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentStatistics.js
+++ b/web/src/components/MyEMS/CombinedEquipment/CombinedEquipmentStatistics.js
@@ -501,7 +501,7 @@ const CombinedEquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -562,7 +562,7 @@ const CombinedEquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -575,7 +575,7 @@ const CombinedEquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -588,7 +588,7 @@ const CombinedEquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -600,7 +600,7 @@ const CombinedEquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentCost.js b/web/src/components/MyEMS/Equipment/EquipmentCost.js
index 7028eb34..71568033 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentCost.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentCost.js
@@ -521,7 +521,7 @@ const EquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -582,7 +582,7 @@ const EquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -595,7 +595,7 @@ const EquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -608,7 +608,7 @@ const EquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -620,7 +620,7 @@ const EquipmentCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentEfficiency.js b/web/src/components/MyEMS/Equipment/EquipmentEfficiency.js
index 2e736945..913f30bb 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentEfficiency.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentEfficiency.js
@@ -462,7 +462,7 @@ const EquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -523,7 +523,7 @@ const EquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -536,7 +536,7 @@ const EquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -549,7 +549,7 @@ const EquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -561,7 +561,7 @@ const EquipmentEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js b/web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js
index dbbb541f..faed8b4d 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentEnergyCategory.js
@@ -532,7 +532,7 @@ const EquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -593,7 +593,7 @@ const EquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -606,7 +606,7 @@ const EquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -619,7 +619,7 @@ const EquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -631,7 +631,7 @@ const EquipmentEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js b/web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js
index 2f3f5a58..e13b26b4 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentEnergyItem.js
@@ -491,7 +491,7 @@ const EquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -553,7 +553,7 @@ const EquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -566,7 +566,7 @@ const EquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -579,7 +579,7 @@ const EquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -591,7 +591,7 @@ const EquipmentEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentIncome.js b/web/src/components/MyEMS/Equipment/EquipmentIncome.js
index c7424d74..b904acbe 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentIncome.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentIncome.js
@@ -486,7 +486,7 @@ const EquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -547,7 +547,7 @@ const EquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -560,7 +560,7 @@ const EquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -573,7 +573,7 @@ const EquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -585,7 +585,7 @@ const EquipmentIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentLoad.js b/web/src/components/MyEMS/Equipment/EquipmentLoad.js
index 3d010b9a..7b295b10 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentLoad.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentLoad.js
@@ -467,7 +467,7 @@ const EquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -528,7 +528,7 @@ const EquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -541,7 +541,7 @@ const EquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -554,7 +554,7 @@ const EquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -566,7 +566,7 @@ const EquipmentLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentOutput.js b/web/src/components/MyEMS/Equipment/EquipmentOutput.js
index d2ab7b97..e492ecf4 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentOutput.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentOutput.js
@@ -453,7 +453,7 @@ const EquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -514,7 +514,7 @@ const EquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -527,7 +527,7 @@ const EquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -540,7 +540,7 @@ const EquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -552,7 +552,7 @@ const EquipmentOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentSaving.js b/web/src/components/MyEMS/Equipment/EquipmentSaving.js
index 56cb90cc..442e9616 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentSaving.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentSaving.js
@@ -494,7 +494,7 @@ const EquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -555,7 +555,7 @@ const EquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -568,7 +568,7 @@ const EquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -581,7 +581,7 @@ const EquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -593,7 +593,7 @@ const EquipmentSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentStatistics.js b/web/src/components/MyEMS/Equipment/EquipmentStatistics.js
index 967673f0..688b3c60 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentStatistics.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentStatistics.js
@@ -467,7 +467,7 @@ const EquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -528,7 +528,7 @@ const EquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -541,7 +541,7 @@ const EquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -554,7 +554,7 @@ const EquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -566,7 +566,7 @@ const EquipmentStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Equipment/EquipmentTracking.js b/web/src/components/MyEMS/Equipment/EquipmentTracking.js
index 7b5a0ae7..e81e2be4 100644
--- a/web/src/components/MyEMS/Equipment/EquipmentTracking.js
+++ b/web/src/components/MyEMS/Equipment/EquipmentTracking.js
@@ -294,7 +294,7 @@ const EquipmentTracking = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form >
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/FDD/CombinedEquipmentFault.js b/web/src/components/MyEMS/FDD/CombinedEquipmentFault.js
index 0b9712f4..1047912f 100644
--- a/web/src/components/MyEMS/FDD/CombinedEquipmentFault.js
+++ b/web/src/components/MyEMS/FDD/CombinedEquipmentFault.js
@@ -790,7 +790,7 @@ const CombinedEquipmentFault = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/FDD/EquipmentFault.js b/web/src/components/MyEMS/FDD/EquipmentFault.js
index c7f11274..47fe9d8b 100644
--- a/web/src/components/MyEMS/FDD/EquipmentFault.js
+++ b/web/src/components/MyEMS/FDD/EquipmentFault.js
@@ -789,7 +789,7 @@ const EquipmentFault = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/FDD/ShopfloorFault.js b/web/src/components/MyEMS/FDD/ShopfloorFault.js
index 254eb715..21e0e7f3 100644
--- a/web/src/components/MyEMS/FDD/ShopfloorFault.js
+++ b/web/src/components/MyEMS/FDD/ShopfloorFault.js
@@ -791,7 +791,7 @@ const ShopfloorFault = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/FDD/SpaceFault.js b/web/src/components/MyEMS/FDD/SpaceFault.js
index 339a42f5..ef29d9f9 100644
--- a/web/src/components/MyEMS/FDD/SpaceFault.js
+++ b/web/src/components/MyEMS/FDD/SpaceFault.js
@@ -712,7 +712,7 @@ const SpaceFault = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/FDD/StoreFault.js b/web/src/components/MyEMS/FDD/StoreFault.js
index 60c20825..a4377d43 100644
--- a/web/src/components/MyEMS/FDD/StoreFault.js
+++ b/web/src/components/MyEMS/FDD/StoreFault.js
@@ -788,7 +788,7 @@ const StoreFault = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/FDD/TenantFault.js b/web/src/components/MyEMS/FDD/TenantFault.js
index ac0ecdee..8793b24c 100644
--- a/web/src/components/MyEMS/FDD/TenantFault.js
+++ b/web/src/components/MyEMS/FDD/TenantFault.js
@@ -789,7 +789,7 @@ const TenantFault = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Meter/MeterCost.js b/web/src/components/MyEMS/Meter/MeterCost.js
index 91d00555..7ed86c62 100644
--- a/web/src/components/MyEMS/Meter/MeterCost.js
+++ b/web/src/components/MyEMS/Meter/MeterCost.js
@@ -435,7 +435,7 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -496,7 +496,7 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -509,7 +509,7 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -522,7 +522,7 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -534,7 +534,7 @@ const MeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Meter/MeterEnergy.js b/web/src/components/MyEMS/Meter/MeterEnergy.js
index 255314e2..8a39d326 100644
--- a/web/src/components/MyEMS/Meter/MeterEnergy.js
+++ b/web/src/components/MyEMS/Meter/MeterEnergy.js
@@ -436,7 +436,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -497,7 +497,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -510,7 +510,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -523,7 +523,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -535,7 +535,7 @@ const MeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Meter/MeterRealtime.js b/web/src/components/MyEMS/Meter/MeterRealtime.js
index 66db8e5e..29c90dd0 100644
--- a/web/src/components/MyEMS/Meter/MeterRealtime.js
+++ b/web/src/components/MyEMS/Meter/MeterRealtime.js
@@ -164,7 +164,7 @@ const MeterRealtime = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form >
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js b/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js
index 234dd57b..0cc0026d 100644
--- a/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js
+++ b/web/src/components/MyEMS/Meter/MeterSubmetersBalance.js
@@ -374,7 +374,7 @@ const MeterSubmetersBalance = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -418,7 +418,7 @@ const MeterSubmetersBalance = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -430,7 +430,7 @@ const MeterSubmetersBalance = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Meter/MeterTracking.js b/web/src/components/MyEMS/Meter/MeterTracking.js
index 6d2de852..b1399548 100644
--- a/web/src/components/MyEMS/Meter/MeterTracking.js
+++ b/web/src/components/MyEMS/Meter/MeterTracking.js
@@ -297,7 +297,7 @@ const MeterTracking = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form >
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Meter/MeterTrend.js b/web/src/components/MyEMS/Meter/MeterTrend.js
index de4f2626..abc155b6 100644
--- a/web/src/components/MyEMS/Meter/MeterTrend.js
+++ b/web/src/components/MyEMS/Meter/MeterTrend.js
@@ -362,7 +362,7 @@ const MeterTrend = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -391,7 +391,7 @@ const MeterTrend = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -403,7 +403,7 @@ const MeterTrend = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Meter/OfflineMeterCost.js b/web/src/components/MyEMS/Meter/OfflineMeterCost.js
index 7a048bd0..808befc6 100644
--- a/web/src/components/MyEMS/Meter/OfflineMeterCost.js
+++ b/web/src/components/MyEMS/Meter/OfflineMeterCost.js
@@ -434,7 +434,7 @@ const OfflineMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -495,7 +495,7 @@ const OfflineMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -508,7 +508,7 @@ const OfflineMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -521,7 +521,7 @@ const OfflineMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -533,7 +533,7 @@ const OfflineMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js b/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js
index a6095b15..1cbbb13a 100644
--- a/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js
+++ b/web/src/components/MyEMS/Meter/OfflineMeterEnergy.js
@@ -434,7 +434,7 @@ const OfflineMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -495,7 +495,7 @@ const OfflineMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -508,7 +508,7 @@ const OfflineMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -521,7 +521,7 @@ const OfflineMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -533,7 +533,7 @@ const OfflineMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Meter/VirtualMeterCost.js b/web/src/components/MyEMS/Meter/VirtualMeterCost.js
index 666c4382..147a1dc0 100644
--- a/web/src/components/MyEMS/Meter/VirtualMeterCost.js
+++ b/web/src/components/MyEMS/Meter/VirtualMeterCost.js
@@ -434,7 +434,7 @@ const VirtualMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -495,7 +495,7 @@ const VirtualMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -508,7 +508,7 @@ const VirtualMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -521,7 +521,7 @@ const VirtualMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -533,7 +533,7 @@ const VirtualMeterCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js b/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js
index aba2be65..f014aaac 100644
--- a/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js
+++ b/web/src/components/MyEMS/Meter/VirtualMeterEnergy.js
@@ -434,7 +434,7 @@ const VirtualMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form >
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -495,7 +495,7 @@ const VirtualMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -508,7 +508,7 @@ const VirtualMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -521,7 +521,7 @@ const VirtualMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -533,7 +533,7 @@ const VirtualMeterEnergy = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Monitoring/CombinedEquipments.js b/web/src/components/MyEMS/Monitoring/CombinedEquipments.js
index 75e55c5d..5e725333 100644
--- a/web/src/components/MyEMS/Monitoring/CombinedEquipments.js
+++ b/web/src/components/MyEMS/Monitoring/CombinedEquipments.js
@@ -226,7 +226,7 @@ const CombinedEquipments = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Monitoring/ShopfloorEquipments.js b/web/src/components/MyEMS/Monitoring/ShopfloorEquipments.js
index 2afdc914..28c20319 100644
--- a/web/src/components/MyEMS/Monitoring/ShopfloorEquipments.js
+++ b/web/src/components/MyEMS/Monitoring/ShopfloorEquipments.js
@@ -225,7 +225,7 @@ const TenantEquipments = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Monitoring/SpaceEquipments.js b/web/src/components/MyEMS/Monitoring/SpaceEquipments.js
index 7e2e7b1c..c7c37b33 100644
--- a/web/src/components/MyEMS/Monitoring/SpaceEquipments.js
+++ b/web/src/components/MyEMS/Monitoring/SpaceEquipments.js
@@ -149,7 +149,7 @@ const SpaceEquipments = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Monitoring/StoreEquipments.js b/web/src/components/MyEMS/Monitoring/StoreEquipments.js
index 4749b707..c4e5e98b 100644
--- a/web/src/components/MyEMS/Monitoring/StoreEquipments.js
+++ b/web/src/components/MyEMS/Monitoring/StoreEquipments.js
@@ -224,7 +224,7 @@ const TenantEquipments = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Monitoring/TenantEquipments.js b/web/src/components/MyEMS/Monitoring/TenantEquipments.js
index 41f21899..d81597d1 100644
--- a/web/src/components/MyEMS/Monitoring/TenantEquipments.js
+++ b/web/src/components/MyEMS/Monitoring/TenantEquipments.js
@@ -224,7 +224,7 @@ const TenantEquipments = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
diff --git a/web/src/components/MyEMS/Shopfloor/ShopfloorCost.js b/web/src/components/MyEMS/Shopfloor/ShopfloorCost.js
index f8639a42..5f112697 100644
--- a/web/src/components/MyEMS/Shopfloor/ShopfloorCost.js
+++ b/web/src/components/MyEMS/Shopfloor/ShopfloorCost.js
@@ -522,7 +522,7 @@ const ShopfloorCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -583,7 +583,7 @@ const ShopfloorCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -596,7 +596,7 @@ const ShopfloorCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -609,7 +609,7 @@ const ShopfloorCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -621,7 +621,7 @@ const ShopfloorCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js b/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js
index 616a9789..313e885b 100644
--- a/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js
+++ b/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyCategory.js
@@ -533,7 +533,7 @@ const ShopfloorEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -594,7 +594,7 @@ const ShopfloorEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -607,7 +607,7 @@ const ShopfloorEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -620,7 +620,7 @@ const ShopfloorEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -632,7 +632,7 @@ const ShopfloorEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js b/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js
index 8264a0d0..b93f4463 100644
--- a/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js
+++ b/web/src/components/MyEMS/Shopfloor/ShopfloorEnergyItem.js
@@ -493,7 +493,7 @@ const ShopfloorEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -555,7 +555,7 @@ const ShopfloorEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -568,7 +568,7 @@ const ShopfloorEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -581,7 +581,7 @@ const ShopfloorEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -593,7 +593,7 @@ const ShopfloorEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js b/web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js
index 607d093a..ef0d9590 100644
--- a/web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js
+++ b/web/src/components/MyEMS/Shopfloor/ShopfloorLoad.js
@@ -468,7 +468,7 @@ const ShopfloorLoad = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -529,7 +529,7 @@ const ShopfloorLoad = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -542,7 +542,7 @@ const ShopfloorLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -555,7 +555,7 @@ const ShopfloorLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -567,7 +567,7 @@ const ShopfloorLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js b/web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js
index f9232c7f..c48d78a9 100644
--- a/web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js
+++ b/web/src/components/MyEMS/Shopfloor/ShopfloorSaving.js
@@ -495,7 +495,7 @@ const ShopfloorSaving = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -556,7 +556,7 @@ const ShopfloorSaving = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -569,7 +569,7 @@ const ShopfloorSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -582,7 +582,7 @@ const ShopfloorSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -594,7 +594,7 @@ const ShopfloorSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js b/web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js
index 2dd0ffdf..db166f1f 100644
--- a/web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js
+++ b/web/src/components/MyEMS/Shopfloor/ShopfloorStatistics.js
@@ -471,7 +471,7 @@ const ShopfloorStatistics = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -532,7 +532,7 @@ const ShopfloorStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -545,7 +545,7 @@ const ShopfloorStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -558,7 +558,7 @@ const ShopfloorStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -570,7 +570,7 @@ const ShopfloorStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceCost.js b/web/src/components/MyEMS/Space/SpaceCost.js
index 13c69c06..02c352ca 100644
--- a/web/src/components/MyEMS/Space/SpaceCost.js
+++ b/web/src/components/MyEMS/Space/SpaceCost.js
@@ -495,7 +495,7 @@ const SpaceCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -541,7 +541,7 @@ const SpaceCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -554,7 +554,7 @@ const SpaceCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -567,7 +567,7 @@ const SpaceCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -579,7 +579,7 @@ const SpaceCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceEfficiency.js b/web/src/components/MyEMS/Space/SpaceEfficiency.js
index ed63a13a..3c11de69 100644
--- a/web/src/components/MyEMS/Space/SpaceEfficiency.js
+++ b/web/src/components/MyEMS/Space/SpaceEfficiency.js
@@ -387,7 +387,7 @@ const SpaceEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -434,7 +434,7 @@ const SpaceEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -447,7 +447,7 @@ const SpaceEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -460,7 +460,7 @@ const SpaceEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -472,7 +472,7 @@ const SpaceEfficiency = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceEnergyCategory.js b/web/src/components/MyEMS/Space/SpaceEnergyCategory.js
index c114b746..81ce7c6b 100644
--- a/web/src/components/MyEMS/Space/SpaceEnergyCategory.js
+++ b/web/src/components/MyEMS/Space/SpaceEnergyCategory.js
@@ -499,7 +499,7 @@ const SpaceEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -545,7 +545,7 @@ const SpaceEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -558,7 +558,7 @@ const SpaceEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -571,7 +571,7 @@ const SpaceEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -583,7 +583,7 @@ const SpaceEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceEnergyItem.js b/web/src/components/MyEMS/Space/SpaceEnergyItem.js
index 49a457b6..4617ef4c 100644
--- a/web/src/components/MyEMS/Space/SpaceEnergyItem.js
+++ b/web/src/components/MyEMS/Space/SpaceEnergyItem.js
@@ -456,7 +456,7 @@ const SpaceEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -502,7 +502,7 @@ const SpaceEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -515,7 +515,7 @@ const SpaceEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -528,7 +528,7 @@ const SpaceEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -540,7 +540,7 @@ const SpaceEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceIncome.js b/web/src/components/MyEMS/Space/SpaceIncome.js
index 845ea3e4..3572671e 100644
--- a/web/src/components/MyEMS/Space/SpaceIncome.js
+++ b/web/src/components/MyEMS/Space/SpaceIncome.js
@@ -459,7 +459,7 @@ const SpaceIncome = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -505,7 +505,7 @@ const SpaceIncome = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -518,7 +518,7 @@ const SpaceIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -531,7 +531,7 @@ const SpaceIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -543,7 +543,7 @@ const SpaceIncome = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceLoad.js b/web/src/components/MyEMS/Space/SpaceLoad.js
index c7319731..edf3e198 100644
--- a/web/src/components/MyEMS/Space/SpaceLoad.js
+++ b/web/src/components/MyEMS/Space/SpaceLoad.js
@@ -384,8 +384,6 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
         });
   };
   
-
-
   return (
     <Fragment>
       <div>
@@ -397,7 +395,7 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -443,7 +441,7 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -456,7 +454,7 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -469,7 +467,7 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -481,7 +479,7 @@ const SpaceLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceOutput.js b/web/src/components/MyEMS/Space/SpaceOutput.js
index ff72e038..32982d15 100644
--- a/web/src/components/MyEMS/Space/SpaceOutput.js
+++ b/web/src/components/MyEMS/Space/SpaceOutput.js
@@ -418,7 +418,7 @@ const SpaceOutput = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -464,7 +464,7 @@ const SpaceOutput = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -477,7 +477,7 @@ const SpaceOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -490,7 +490,7 @@ const SpaceOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -502,7 +502,7 @@ const SpaceOutput = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceSaving.js b/web/src/components/MyEMS/Space/SpaceSaving.js
index 75a01f0d..a4c53544 100644
--- a/web/src/components/MyEMS/Space/SpaceSaving.js
+++ b/web/src/components/MyEMS/Space/SpaceSaving.js
@@ -460,7 +460,7 @@ const SpaceSaving = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -506,7 +506,7 @@ const SpaceSaving = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -519,7 +519,7 @@ const SpaceSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -532,7 +532,7 @@ const SpaceSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -544,7 +544,7 @@ const SpaceSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Space/SpaceStatistics.js b/web/src/components/MyEMS/Space/SpaceStatistics.js
index 258b78ae..1177464d 100644
--- a/web/src/components/MyEMS/Space/SpaceStatistics.js
+++ b/web/src/components/MyEMS/Space/SpaceStatistics.js
@@ -398,7 +398,7 @@ const SpaceStatistics = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -444,7 +444,7 @@ const SpaceStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -457,7 +457,7 @@ const SpaceStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -470,7 +470,7 @@ const SpaceStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -482,7 +482,7 @@ const SpaceStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Store/StoreCost.js b/web/src/components/MyEMS/Store/StoreCost.js
index 77dd733a..5fc1bfd0 100644
--- a/web/src/components/MyEMS/Store/StoreCost.js
+++ b/web/src/components/MyEMS/Store/StoreCost.js
@@ -524,7 +524,7 @@ const StoreCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -585,7 +585,7 @@ const StoreCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -598,7 +598,7 @@ const StoreCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -611,7 +611,7 @@ const StoreCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -623,7 +623,7 @@ const StoreCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Store/StoreEnergyCategory.js b/web/src/components/MyEMS/Store/StoreEnergyCategory.js
index fc9cc603..b3cb8d8c 100644
--- a/web/src/components/MyEMS/Store/StoreEnergyCategory.js
+++ b/web/src/components/MyEMS/Store/StoreEnergyCategory.js
@@ -533,7 +533,7 @@ const StoreEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -594,7 +594,7 @@ const StoreEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -607,7 +607,7 @@ const StoreEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -620,7 +620,7 @@ const StoreEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -632,7 +632,7 @@ const StoreEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Store/StoreEnergyItem.js b/web/src/components/MyEMS/Store/StoreEnergyItem.js
index ebdf0917..c4c864df 100644
--- a/web/src/components/MyEMS/Store/StoreEnergyItem.js
+++ b/web/src/components/MyEMS/Store/StoreEnergyItem.js
@@ -493,7 +493,7 @@ const StoreEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -554,7 +554,7 @@ const StoreEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -567,7 +567,7 @@ const StoreEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -580,7 +580,7 @@ const StoreEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -592,7 +592,7 @@ const StoreEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Store/StoreLoad.js b/web/src/components/MyEMS/Store/StoreLoad.js
index ff8fa740..02fc9ed3 100644
--- a/web/src/components/MyEMS/Store/StoreLoad.js
+++ b/web/src/components/MyEMS/Store/StoreLoad.js
@@ -470,7 +470,7 @@ const StoreLoad = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -531,7 +531,7 @@ const StoreLoad = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -544,7 +544,7 @@ const StoreLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -557,7 +557,7 @@ const StoreLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -569,7 +569,7 @@ const StoreLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Store/StoreSaving.js b/web/src/components/MyEMS/Store/StoreSaving.js
index bc6a0c88..102ee7e1 100644
--- a/web/src/components/MyEMS/Store/StoreSaving.js
+++ b/web/src/components/MyEMS/Store/StoreSaving.js
@@ -495,7 +495,7 @@ const StoreSaving = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -556,7 +556,7 @@ const StoreSaving = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -569,7 +569,7 @@ const StoreSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -582,7 +582,7 @@ const StoreSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -594,7 +594,7 @@ const StoreSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Store/StoreStatistics.js b/web/src/components/MyEMS/Store/StoreStatistics.js
index 202bf3a5..8fdfb7ad 100644
--- a/web/src/components/MyEMS/Store/StoreStatistics.js
+++ b/web/src/components/MyEMS/Store/StoreStatistics.js
@@ -470,7 +470,7 @@ const StoreStatistics = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -531,7 +531,7 @@ const StoreStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -544,7 +544,7 @@ const StoreStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -557,7 +557,7 @@ const StoreStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -569,7 +569,7 @@ const StoreStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Tenant/TenantBill.js b/web/src/components/MyEMS/Tenant/TenantBill.js
index 16408136..bf20219d 100644
--- a/web/src/components/MyEMS/Tenant/TenantBill.js
+++ b/web/src/components/MyEMS/Tenant/TenantBill.js
@@ -383,7 +383,7 @@ const Invoice = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -412,7 +412,7 @@ const Invoice = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -424,7 +424,7 @@ const Invoice = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Tenant/TenantCost.js b/web/src/components/MyEMS/Tenant/TenantCost.js
index 7738404f..520cda24 100644
--- a/web/src/components/MyEMS/Tenant/TenantCost.js
+++ b/web/src/components/MyEMS/Tenant/TenantCost.js
@@ -523,7 +523,7 @@ const TenantCost = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -584,7 +584,7 @@ const TenantCost = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -597,7 +597,7 @@ const TenantCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -610,7 +610,7 @@ const TenantCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -622,7 +622,7 @@ const TenantCost = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Tenant/TenantEnergyCategory.js b/web/src/components/MyEMS/Tenant/TenantEnergyCategory.js
index 06a189ef..355925d9 100644
--- a/web/src/components/MyEMS/Tenant/TenantEnergyCategory.js
+++ b/web/src/components/MyEMS/Tenant/TenantEnergyCategory.js
@@ -533,7 +533,7 @@ const TenantEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -594,7 +594,7 @@ const TenantEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -607,7 +607,7 @@ const TenantEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -620,7 +620,7 @@ const TenantEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -632,7 +632,7 @@ const TenantEnergyCategory = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Tenant/TenantEnergyItem.js b/web/src/components/MyEMS/Tenant/TenantEnergyItem.js
index e2509ff5..0492f35e 100644
--- a/web/src/components/MyEMS/Tenant/TenantEnergyItem.js
+++ b/web/src/components/MyEMS/Tenant/TenantEnergyItem.js
@@ -493,7 +493,7 @@ const TenantEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -554,7 +554,7 @@ const TenantEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -567,7 +567,7 @@ const TenantEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -580,7 +580,7 @@ const TenantEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -592,7 +592,7 @@ const TenantEnergyItem = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Tenant/TenantLoad.js b/web/src/components/MyEMS/Tenant/TenantLoad.js
index 8a123b58..2d708ab8 100644
--- a/web/src/components/MyEMS/Tenant/TenantLoad.js
+++ b/web/src/components/MyEMS/Tenant/TenantLoad.js
@@ -469,7 +469,7 @@ const TenantLoad = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -530,7 +530,7 @@ const TenantLoad = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -543,7 +543,7 @@ const TenantLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -556,7 +556,7 @@ const TenantLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -568,7 +568,7 @@ const TenantLoad = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Tenant/TenantSaving.js b/web/src/components/MyEMS/Tenant/TenantSaving.js
index 6d28ce62..28787a32 100644
--- a/web/src/components/MyEMS/Tenant/TenantSaving.js
+++ b/web/src/components/MyEMS/Tenant/TenantSaving.js
@@ -497,7 +497,7 @@ const TenantSaving = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -558,7 +558,7 @@ const TenantSaving = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -571,7 +571,7 @@ const TenantSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -584,7 +584,7 @@ const TenantSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -596,7 +596,7 @@ const TenantSaving = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}
diff --git a/web/src/components/MyEMS/Tenant/TenantStatistics.js b/web/src/components/MyEMS/Tenant/TenantStatistics.js
index 9d3a4290..113b833a 100644
--- a/web/src/components/MyEMS/Tenant/TenantStatistics.js
+++ b/web/src/components/MyEMS/Tenant/TenantStatistics.js
@@ -472,7 +472,7 @@ const TenantStatistics = ({ setRedirect, setRedirectUrl, t }) => {
         <CardBody className="p-3">
           <Form onSubmit={handleSubmit}>
             <Row form>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="space">
                     {t('Space')}
@@ -533,7 +533,7 @@ const TenantStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                   </CustomInput>
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodBeginsDatetime">
                     {t('Base Period Begins')}{t('(Optional)')}
@@ -546,7 +546,7 @@ const TenantStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="basePeriodEndsDatetime">
                     {t('Base Period Ends')}{t('(Optional)')}
@@ -559,7 +559,7 @@ const TenantStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodBeginsDatetime">
                     {t('Reporting Period Begins')}
@@ -571,7 +571,7 @@ const TenantStatistics = ({ setRedirect, setRedirectUrl, t }) => {
                     closeOnSelect={true} />
                 </FormGroup>
               </Col>
-              <Col xs="auto">
+              <Col xs={6} sm={3}>
                 <FormGroup className="form-group">
                   <Label className={labelClasses} for="reportingPeriodEndsDatetime">
                     {t('Reporting Period Ends')}