diff --git a/portal-ui/src/common/LoadingComponent.tsx b/portal-ui/src/common/LoadingComponent.tsx
index 6364454ce..d4bd13cee 100644
--- a/portal-ui/src/common/LoadingComponent.tsx
+++ b/portal-ui/src/common/LoadingComponent.tsx
@@ -15,7 +15,8 @@
 //  along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React from "react";
-import { CircularProgress, Grid } from "@mui/material";
+import { Grid } from "@mui/material";
+import Loader from "../screens/Console/Common/Loader/Loader";
 
 const LoadingComponent = () => {
   return (
@@ -28,7 +29,7 @@ const LoadingComponent = () => {
       style={{ minHeight: "100vh" }}
     >
       <Grid item xs={3} style={{ textAlign: "center" }}>
-        <CircularProgress />
+        <Loader style={{ width: 35, height: 35 }} />
         <br />
         Loading...
       </Grid>
diff --git a/portal-ui/src/screens/Console/Buckets/BucketDetails/SetRetentionConfig.tsx b/portal-ui/src/screens/Console/Buckets/BucketDetails/SetRetentionConfig.tsx
index 42485ed6a..021ad360f 100644
--- a/portal-ui/src/screens/Console/Buckets/BucketDetails/SetRetentionConfig.tsx
+++ b/portal-ui/src/screens/Console/Buckets/BucketDetails/SetRetentionConfig.tsx
@@ -16,7 +16,7 @@
 
 import React, { useEffect, useState } from "react";
 import { connect } from "react-redux";
-import { Button, LinearProgress, CircularProgress } from "@mui/material";
+import { Button, LinearProgress } from "@mui/material";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
@@ -36,6 +36,7 @@ import api from "../../../../common/api";
 import ModalWrapper from "../../Common/ModalWrapper/ModalWrapper";
 import RadioGroupSelector from "../../Common/FormComponents/RadioGroupSelector/RadioGroupSelector";
 import InputBoxWrapper from "../../Common/FormComponents/InputBoxWrapper/InputBoxWrapper";
+import Loader from "../../Common/Loader/Loader";
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -124,7 +125,7 @@ const SetRetentionConfig = ({
       }}
     >
       {loadingForm ? (
-        <CircularProgress color="primary" size={16} variant="indeterminate" />
+        <Loader style={{ width: 16, height: 16 }} />
       ) : (
         <form
           noValidate
diff --git a/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/ActionLink.tsx b/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/ActionLink.tsx
index 5179a1d11..203e5b3a3 100644
--- a/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/ActionLink.tsx
+++ b/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/ActionLink.tsx
@@ -15,7 +15,8 @@
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React from "react";
-import { Button, CircularProgress } from "@mui/material";
+import { Button } from "@mui/material";
+import Loader from "../../../Common/Loader/Loader";
 
 type ActionLinkProps = {
   isLoading: boolean;
@@ -54,11 +55,7 @@ const ActionLink = ({
       disableFocusRipple
       {...restProps}
     >
-      {isLoading ? (
-        <CircularProgress color="primary" size={16} variant="indeterminate" />
-      ) : (
-        label
-      )}
+      {isLoading ? <Loader style={{ width: 16, height: 16 }} /> : label}
     </Button>
   );
 };
diff --git a/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/BucketTags.tsx b/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/BucketTags.tsx
index 4760779c9..817040f09 100644
--- a/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/BucketTags.tsx
+++ b/portal-ui/src/screens/Console/Buckets/BucketDetails/SummaryItems/BucketTags.tsx
@@ -17,7 +17,7 @@ import React, { useEffect, useState } from "react";
 import { Bucket } from "../../../Watch/types";
 import { ErrorResponseHandler } from "../../../../../common/types";
 import useApi from "../../../Common/Hooks/useApi";
-import { Box, CircularProgress } from "@mui/material";
+import { Box } from "@mui/material";
 import { IAM_SCOPES } from "../../../../../common/SecureComponent/permissions";
 import { SecureComponent } from "../../../../../common/SecureComponent";
 import get from "lodash/get";
@@ -25,6 +25,7 @@ import Chip from "@mui/material/Chip";
 import CloseIcon from "@mui/icons-material/Close";
 import AddIcon from "@mui/icons-material/Add";
 import withSuspense from "../../../Common/Components/withSuspense";
+import Loader from "../../../Common/Loader/Loader";
 
 const AddBucketTagModal = withSuspense(
   React.lazy(() => import("../AddBucketTagModal"))
@@ -89,9 +90,7 @@ const BucketTags = ({ setErrorSnackMessage, bucketName }: BucketTagProps) => {
 
   return (
     <Box>
-      {isLoading ? (
-        <CircularProgress color="primary" size={16} variant="indeterminate" />
-      ) : null}
+      {isLoading ? <Loader style={{ width: 16, height: 16 }} /> : null}
       <SecureComponent
         scopes={[IAM_SCOPES.S3_GET_BUCKET_TAGGING]}
         resource={bucketName}
diff --git a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ObjectDetailPanel.tsx b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ObjectDetailPanel.tsx
index 1220a575b..9b0230cfe 100644
--- a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ObjectDetailPanel.tsx
+++ b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/ObjectDetailPanel.tsx
@@ -80,18 +80,6 @@ import InspectObject from "./InspectObject";
 
 const styles = () =>
   createStyles({
-    tag: {
-      marginRight: 6,
-      fontSize: 10,
-      fontWeight: 700,
-      "&.MuiChip-sizeSmall": {
-        height: 18,
-      },
-      "& .min-icon": {
-        height: 10,
-        width: 10,
-      },
-    },
     ObjectDetailsTitle: {
       display: "flex",
       alignItems: "center",
@@ -117,20 +105,6 @@ const styles = () =>
     capitalizeFirst: {
       textTransform: "capitalize",
     },
-    "@global": {
-      ".progressDetails": {
-        paddingTop: 3,
-        display: "inline-block",
-        position: "relative",
-        width: 18,
-        height: 18,
-      },
-      ".progressDetails > .MuiCircularProgress-root": {
-        position: "absolute",
-        left: 0,
-        top: 3,
-      },
-    },
     ...buttonsStyles,
     ...actionsTray,
     ...spacingUtils,
diff --git a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/types.tsx b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/types.tsx
index 1aa6c9629..46f88e420 100644
--- a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/types.tsx
+++ b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ListObjects/types.tsx
@@ -21,7 +21,7 @@ export interface BucketObject {
   last_modified: Date;
   content_type: string;
   version_id: string;
-  delete_flag?:boolean;
+  delete_flag?: boolean;
 }
 
 export interface BucketObjectsList {
diff --git a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ObjectDetails/VersionsNavigator.tsx b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ObjectDetails/VersionsNavigator.tsx
index a8c04eefe..6afd6a7cd 100644
--- a/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ObjectDetails/VersionsNavigator.tsx
+++ b/portal-ui/src/screens/Console/Buckets/ListBuckets/Objects/ObjectDetails/VersionsNavigator.tsx
@@ -60,65 +60,10 @@ import SelectWrapper from "../../../../Common/FormComponents/SelectWrapper/Selec
 
 const styles = (theme: Theme) =>
   createStyles({
-    propertiesIcon: {
-      marginLeft: 5,
-      "& .min-icon": {
-        height: 12,
-      },
-    },
-    tag: {
-      marginRight: 6,
-      fontSize: 10,
-      fontWeight: 700,
-      "&.MuiChip-sizeSmall": {
-        height: 18,
-      },
-      "& .min-icon": {
-        height: 10,
-        width: 10,
-      },
-    },
-    search: {
-      marginBottom: 8,
-      "&.MuiFormControl-root": {
-        marginRight: 0,
-      },
-    },
-    capitalizeFirst: {
-      textTransform: "capitalize",
-      "& .min-icon": {
-        width: 16,
-        height: 16,
-      },
-    },
-    titleCol: {
-      width: "25%",
-    },
-    titleItem: {
-      width: "35%",
-    },
     versionsContainer: {
       border: "#EAEDEE 1px solid",
       padding: 10,
     },
-    "@global": {
-      ".progressDetails": {
-        paddingTop: 3,
-        display: "inline-block",
-        position: "relative",
-        width: 18,
-        height: 18,
-      },
-      ".progressDetails > .MuiCircularProgress-root": {
-        position: "absolute",
-        left: 0,
-        top: 3,
-      },
-    },
-    tabsContainer: {
-      border: "1px solid #eaeaea",
-      borderTop: 0,
-    },
     noBottomBorder: {
       borderBottom: 0,
     },
diff --git a/portal-ui/src/screens/Console/Common/FormComponents/common/styleLibrary.ts b/portal-ui/src/screens/Console/Common/FormComponents/common/styleLibrary.ts
index 64818c9dd..f09fe23d5 100644
--- a/portal-ui/src/screens/Console/Common/FormComponents/common/styleLibrary.ts
+++ b/portal-ui/src/screens/Console/Common/FormComponents/common/styleLibrary.ts
@@ -384,7 +384,7 @@ export const objectBrowserCommon = {
     },
   },
   additionalOptions: {
-    paddingRight: "10px"
+    paddingRight: "10px",
   },
   smallLabel: {
     color: "#9C9C9C",
diff --git a/portal-ui/src/screens/Console/Common/IconsScreen.tsx b/portal-ui/src/screens/Console/Common/IconsScreen.tsx
index d2cbb3eed..81017b04c 100644
--- a/portal-ui/src/screens/Console/Common/IconsScreen.tsx
+++ b/portal-ui/src/screens/Console/Common/IconsScreen.tsx
@@ -33,7 +33,6 @@ import * as cicons from "../../../icons";
 import * as micons from "../../../icons/SidebarMenus";
 import Loader from "./Loader/Loader";
 
-
 interface IIconsScreenSimple {
   classes: any;
 }
@@ -47,7 +46,7 @@ const styles = (theme: Theme) =>
       "& .min-loader": {
         width: 45,
         height: 45,
-      }
+      },
     },
     def: {},
     red: {
@@ -106,12 +105,12 @@ const IconsScreen = ({ classes }: IIconsScreenSimple) => {
       </Grid>
       <h1>Loaders</h1>
       <Grid
-          container
-          spacing={4}
-          textAlign={"center"}
-          className={clsx(classes.root, {
-            [classes.red]: color === "red",
-          })}
+        container
+        spacing={4}
+        textAlign={"center"}
+        className={clsx(classes.root, {
+          [classes.red]: color === "red",
+        })}
       >
         <Grid item xs={3}>
           <Loader />
diff --git a/portal-ui/src/screens/Console/Common/Loader/loader.styles.css b/portal-ui/src/screens/Console/Common/Loader/loader.styles.css
index b0fdfac93..f87754787 100644
--- a/portal-ui/src/screens/Console/Common/Loader/loader.styles.css
+++ b/portal-ui/src/screens/Console/Common/Loader/loader.styles.css
@@ -1,300 +1,363 @@
+.min-loader {
+  width: 40px;
+  height: 40px;
+}
+
 #eB8dk2fHKWC2_tr {
-  animation: eB8dk2fHKWC2_tr__tr 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC2_tr__tr 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC2_tr__tr {
   0% {
     transform: translate(139.785027px, 140.086989px) rotate(45.236493deg);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   10% {
     transform: translate(139.785027px, 140.086989px) rotate(-197.740907deg);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   20% {
     transform: translate(139.785027px, 140.086989px) rotate(-108.6deg);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   30% {
     transform: translate(139.785027px, 140.086989px) rotate(-17.484014deg);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   33.333333% {
     transform: translate(139.785027px, 140.086989px) rotate(-17.48deg);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   43.333333% {
-    transform: translate(139.785027px, 140.086989px) rotate(160.887995deg)
+    transform: translate(139.785027px, 140.086989px) rotate(160.887995deg);
   }
   100% {
-    transform: translate(139.785027px, 140.086989px) rotate(160.887995deg)
+    transform: translate(139.785027px, 140.086989px) rotate(160.887995deg);
   }
 }
 
 #eB8dk2fHKWC2_ts {
-  animation: eB8dk2fHKWC2_ts__ts 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC2_ts__ts 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC2_ts__ts {
   0% {
-    transform: scale(1, 0.995019)
+    transform: scale(1, 0.995019);
   }
   33.333333% {
     transform: scale(1, 0.995019);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   43.333333% {
     transform: scale(0.101121, 0.102033);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   50% {
     transform: scale(0.1, 0.1);
-    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1)
+    animation-timing-function: cubic-bezier(0.42, 0, 0.58, 1);
   }
   60% {
-    transform: scale(1, 1)
+    transform: scale(1, 1);
   }
   100% {
-    transform: scale(1, 1)
+    transform: scale(1, 1);
   }
 }
 
 #eB8dk2fHKWC2 {
-  animation: eB8dk2fHKWC2_c_o 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC2_c_o 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC2_c_o {
   0% {
-    opacity: 1
+    opacity: 1;
   }
   6.666667% {
-    opacity: 1
+    opacity: 1;
   }
   10% {
-    opacity: 0
+    opacity: 0;
   }
   13.333333% {
-    opacity: 0
+    opacity: 0;
   }
   20% {
-    opacity: 1
+    opacity: 1;
   }
   30% {
-    opacity: 1
+    opacity: 1;
   }
   36.666667% {
-    opacity: 1
+    opacity: 1;
   }
   40% {
-    opacity: 0
+    opacity: 0;
   }
   100% {
-    opacity: 0
+    opacity: 0;
   }
 }
 
 #eB8dk2fHKWC4 {
-  animation: eB8dk2fHKWC4__m 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC4__m 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC4__m {
   0% {
-    d: path('M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
+    d: path(
+      "M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z"
+    );
   }
   10% {
-    d: path('M85.4,249.8C85.4,249.8,85.399999,249.800001,85.399999,249.800001C85.399999,249.800001,85.4,249.800002,85.4,249.800002C85.4,249.800002,90.484102,251.966034,95.043213,248.269966C100.484052,243.859082,98.694728,236.722769,97.073675,234.469349C95.517658,232.306335,94.559418,231.751273,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
+    d: path(
+      "M85.4,249.8C85.4,249.8,85.399999,249.800001,85.399999,249.800001C85.399999,249.800001,85.4,249.800002,85.4,249.800002C85.4,249.800002,90.484102,251.966034,95.043213,248.269966C100.484052,243.859082,98.694728,236.722769,97.073675,234.469349C95.517658,232.306335,94.559418,231.751273,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z"
+    );
   }
   20% {
-    d: path('M85.4,249.8C85.4,249.8,85.399999,249.800001,85.399999,249.800001C85.399999,249.800001,85.4,249.800002,85.4,249.800002C85.4,249.800002,90.484102,251.966034,95.043213,248.269966C100.484052,243.859082,98.694728,236.722769,97.073675,234.469349C95.517658,232.306335,94.559418,231.751273,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
+    d: path(
+      "M85.4,249.8C85.4,249.8,85.399999,249.800001,85.399999,249.800001C85.399999,249.800001,85.4,249.800002,85.4,249.800002C85.4,249.800002,90.484102,251.966034,95.043213,248.269966C100.484052,243.859082,98.694728,236.722769,97.073675,234.469349C95.517658,232.306335,94.559418,231.751273,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z"
+    );
   }
   30% {
-    d: path('M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
+    d: path(
+      "M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z"
+    );
   }
   33.333333% {
-    d: path('M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z')
+    d: path(
+      "M85.4,249.8C109.08,255.3,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,110.79,235.19,90.73,230.52C78.19,227.61,72.85,246.88,85.4,249.8C85.4,249.8,85.4,249.8,85.4,249.8Z"
+    );
   }
   43.333333% {
-    d: path('M84.281285,246.076032C107.50521,254.051555,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,86.465691,239.82846,53.85604,207.193233C41.31604,204.283233,32.439249,213.928672,40.474905,219.54755C40.474905,219.54755,61.310295,238.187372,84.281285,246.076032Z')
+    d: path(
+      "M84.281285,246.076032C107.50521,254.051555,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,86.465691,239.82846,53.85604,207.193233C41.31604,204.283233,32.439249,213.928672,40.474905,219.54755C40.474905,219.54755,61.310295,238.187372,84.281285,246.076032Z"
+    );
   }
   100% {
-    d: path('M84.281285,246.076032C107.50521,254.051555,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,86.465691,239.82846,53.85604,207.193233C41.31604,204.283233,32.439249,213.928672,40.474905,219.54755C40.474905,219.54755,61.310295,238.187372,84.281285,246.076032Z')
+    d: path(
+      "M84.281285,246.076032C107.50521,254.051555,133.72,257.37,157.65,252.14C181.65,246.89,202.95,233.55,219.27,215.35C227.84,205.79,213.74,191.6,205.13,201.21C190.9,217.1,173.27,228.26,152.34,232.86C132.03,237.32,86.465691,239.82846,53.85604,207.193233C41.31604,204.283233,32.439249,213.928672,40.474905,219.54755C40.474905,219.54755,61.310295,238.187372,84.281285,246.076032Z"
+    );
   }
 }
 
 #eB8dk2fHKWC6 {
-  animation: eB8dk2fHKWC6__m 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC6__m 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC6__m {
   0% {
-    d: path('M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z')
+    d: path(
+      "M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z"
+    );
   }
   10% {
-    d: path('M250.887564,168.08137C250.887564,168.081368,250.887563,168.081375,250.887563,168.081375C250.887563,168.081375,253.7831,157.676613,244.778825,154.781475C235.762034,151.882313,232.694053,158.881918,231.752888,162.486547C231.017121,165.304508,231.564293,168.517464,232.231509,169.666243C233.407087,171.690293,235.517449,173.828597,238.467701,174.606956C241.339242,175.364549,245.542656,175.427978,248.770823,172.704057C248.770823,172.704057,250.400569,171.202441,250.887564,168.08137Z')
+    d: path(
+      "M250.887564,168.08137C250.887564,168.081368,250.887563,168.081375,250.887563,168.081375C250.887563,168.081375,253.7831,157.676613,244.778825,154.781475C235.762034,151.882313,232.694053,158.881918,231.752888,162.486547C231.017121,165.304508,231.564293,168.517464,232.231509,169.666243C233.407087,171.690293,235.517449,173.828597,238.467701,174.606956C241.339242,175.364549,245.542656,175.427978,248.770823,172.704057C248.770823,172.704057,250.400569,171.202441,250.887564,168.08137Z"
+    );
   }
   20% {
-    d: path('M250.887564,168.08137C250.887564,168.081368,250.887563,168.081375,250.887563,168.081375C250.887563,168.081375,253.7831,157.676613,244.778825,154.781475C235.762034,151.882313,232.694053,158.881918,231.752888,162.486547C231.017121,165.304508,231.564293,168.517464,232.231509,169.666243C233.407087,171.690293,235.517449,173.828597,238.467701,174.606956C241.339242,175.364549,245.542656,175.427978,248.770823,172.704057C248.770823,172.704057,250.400569,171.202441,250.887564,168.08137Z')
+    d: path(
+      "M250.887564,168.08137C250.887564,168.081368,250.887563,168.081375,250.887563,168.081375C250.887563,168.081375,253.7831,157.676613,244.778825,154.781475C235.762034,151.882313,232.694053,158.881918,231.752888,162.486547C231.017121,165.304508,231.564293,168.517464,232.231509,169.666243C233.407087,171.690293,235.517449,173.828597,238.467701,174.606956C241.339242,175.364549,245.542656,175.427978,248.770823,172.704057C248.770823,172.704057,250.400569,171.202441,250.887564,168.08137Z"
+    );
   }
   30% {
-    d: path('M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z')
+    d: path(
+      "M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z"
+    );
   }
   33.333333% {
-    d: path('M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z')
+    d: path(
+      "M249.74,169.63C255.24,145.95,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,191.54,41.29,201.15,49.9C217.04,64.13,228.2,81.76,232.8,102.69C237.26,123,235.13,144.24,230.46,164.3C227.54,176.84,246.82,182.18,249.74,169.63C249.74,169.63,249.74,169.63,249.74,169.63Z"
+    );
   }
   43.333333% {
-    d: path('M241.985702,180.287452C255.201364,145.393106,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,189.760952,38.146938,199.370952,46.756938C229.706596,66.855753,234.126292,101.544407,234.194759,127.574104C235.798839,155.047874,216.192342,185.901625,205.13,201.21C199.980012,208.336696,214.039151,220.128533,219.270001,215.35C219.270001,215.35,237.299554,192.660656,241.985702,180.287452Z')
+    d: path(
+      "M241.985702,180.287452C255.201364,145.393106,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,189.760952,38.146938,199.370952,46.756938C229.706596,66.855753,234.126292,101.544407,234.194759,127.574104C235.798839,155.047874,216.192342,185.901625,205.13,201.21C199.980012,208.336696,214.039151,220.128533,219.270001,215.35C219.270001,215.35,237.299554,192.660656,241.985702,180.287452Z"
+    );
   }
   100% {
-    d: path('M241.985702,180.287452C255.201364,145.393106,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,189.760952,38.146938,199.370952,46.756938C229.706596,66.855753,234.126292,101.544407,234.194759,127.574104C235.798839,155.047874,216.192342,185.901625,205.13,201.21C199.980012,208.336696,214.039151,220.128533,219.270001,215.35C219.270001,215.35,237.299554,192.660656,241.985702,180.287452Z')
+    d: path(
+      "M241.985702,180.287452C255.201364,145.393106,257.31,121.31,252.08,97.38C246.83,73.38,233.49,52.08,215.29,35.76C205.73,27.19,189.760952,38.146938,199.370952,46.756938C229.706596,66.855753,234.126292,101.544407,234.194759,127.574104C235.798839,155.047874,216.192342,185.901625,205.13,201.21C199.980012,208.336696,214.039151,220.128533,219.270001,215.35C219.270001,215.35,237.299554,192.660656,241.985702,180.287452Z"
+    );
   }
 }
 
 #eB8dk2fHKWC8 {
-  animation: eB8dk2fHKWC8__m 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC8__m 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC8__m {
   0% {
-    d: path('M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z')
+    d: path(
+      "M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z"
+    );
   }
   10% {
-    d: path('M171.58686,7.8192C164.834536,7.661923,162.882928,13.414575,162.613915,14.669774C162.613914,14.669774,161.858025,17.37084,162.366976,18.743708C162.782522,19.864622,163.527502,21.022768,164.723558,21.957074C165.842173,22.830886,168.859974,24.254302,168.859974,24.254302C168.859974,24.254302,168.859968,24.254306,168.859967,24.254304C181.289967,27.534304,184.046866,11.109212,171.586866,7.819212C171.586866,7.819212,171.58686,7.8192,171.58686,7.8192Z')
+    d: path(
+      "M171.58686,7.8192C164.834536,7.661923,162.882928,13.414575,162.613915,14.669774C162.613914,14.669774,161.858025,17.37084,162.366976,18.743708C162.782522,19.864622,163.527502,21.022768,164.723558,21.957074C165.842173,22.830886,168.859974,24.254302,168.859974,24.254302C168.859974,24.254302,168.859968,24.254306,168.859967,24.254304C181.289967,27.534304,184.046866,11.109212,171.586866,7.819212C171.586866,7.819212,171.58686,7.8192,171.58686,7.8192Z"
+    );
   }
   20% {
-    d: path('M171.58686,7.8192C164.834536,7.661923,162.882928,13.414575,162.613915,14.669774C162.613914,14.669774,161.858025,17.37084,162.366976,18.743708C162.782522,19.864622,163.527502,21.022768,164.723558,21.957074C165.842173,22.830886,168.859974,24.254302,168.859974,24.254302C168.859974,24.254302,168.859968,24.254306,168.859967,24.254304C181.289967,27.534304,184.046866,11.109212,171.586866,7.819212C171.586866,7.819212,171.58686,7.8192,171.58686,7.8192Z')
+    d: path(
+      "M171.58686,7.8192C164.834536,7.661923,162.882928,13.414575,162.613915,14.669774C162.613914,14.669774,161.858025,17.37084,162.366976,18.743708C162.782522,19.864622,163.527502,21.022768,164.723558,21.957074C165.842173,22.830886,168.859974,24.254302,168.859974,24.254302C168.859974,24.254302,168.859968,24.254306,168.859967,24.254304C181.289967,27.534304,184.046866,11.109212,171.586866,7.819212C171.586866,7.819212,171.58686,7.8192,171.58686,7.8192Z"
+    );
   }
   30% {
-    d: path('M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z')
+    d: path(
+      "M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z"
+    );
   }
   33.333333% {
-    d: path('M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z')
+    d: path(
+      "M171.68,7.71C148.17,1.51,123.61,-1.28,99.53,3.25C75.39,7.79,53.7,20.49,36.85,38.21C28.01,47.52,41.68,62.11,50.57,52.76C65.27,37.3,83.22,26.66,104.27,22.68C124.7,18.82,145.87,21.58,165.79,26.83C178.22,30.11,184.14,11,171.68,7.71C171.68,7.71,171.68,7.71,171.68,7.71Z"
+    );
   }
   43.333333% {
-    d: path('M154.601291,1.547478C127.732134,-3.659063,101.676041,0.16217,89.834975,4.047622C73.018778,9.565582,43.015709,29.967817,36.85,38.21C28.01,47.52,41.568561,62.002759,50.57,52.76C67.005248,35.884138,77.788003,22.937369,100.935291,18.024709C148.028227,8.029949,175.904245,24.591662,199.370952,46.756938C210.775532,51.88401,219.463487,39.878796,215.289997,35.759998C189.664787,10.470596,154.601291,1.547478,154.601291,1.547478Z')
+    d: path(
+      "M154.601291,1.547478C127.732134,-3.659063,101.676041,0.16217,89.834975,4.047622C73.018778,9.565582,43.015709,29.967817,36.85,38.21C28.01,47.52,41.568561,62.002759,50.57,52.76C67.005248,35.884138,77.788003,22.937369,100.935291,18.024709C148.028227,8.029949,175.904245,24.591662,199.370952,46.756938C210.775532,51.88401,219.463487,39.878796,215.289997,35.759998C189.664787,10.470596,154.601291,1.547478,154.601291,1.547478Z"
+    );
   }
   100% {
-    d: path('M154.601291,1.547478C127.732134,-3.659063,101.676041,0.16217,89.834975,4.047622C73.018778,9.565582,43.015709,29.967817,36.85,38.21C28.01,47.52,41.568561,62.002759,50.57,52.76C67.005248,35.884138,77.788003,22.937369,100.935291,18.024709C148.028227,8.029949,175.904245,24.591662,199.370952,46.756938C210.775532,51.88401,219.463487,39.878796,215.289997,35.759998C189.664787,10.470596,154.601291,1.547478,154.601291,1.547478Z')
+    d: path(
+      "M154.601291,1.547478C127.732134,-3.659063,101.676041,0.16217,89.834975,4.047622C73.018778,9.565582,43.015709,29.967817,36.85,38.21C28.01,47.52,41.568561,62.002759,50.57,52.76C67.005248,35.884138,77.788003,22.937369,100.935291,18.024709C148.028227,8.029949,175.904245,24.591662,199.370952,46.756938C210.775532,51.88401,219.463487,39.878796,215.289997,35.759998C189.664787,10.470596,154.601291,1.547478,154.601291,1.547478Z"
+    );
   }
 }
 
 #eB8dk2fHKWC10 {
-  animation: eB8dk2fHKWC10__m 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC10__m 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC10__m {
   0% {
-    d: path('M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z')
+    d: path(
+      "M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z"
+    );
   }
   3.333333% {
-    d: path('M4.90273,88.748028C1.236063,104.534694,0.694614,122.375568,4.181281,138.328902C7.119767,155.82704,18.329955,178.442148,31.722495,188.944182C39.448991,194.869945,48.960631,181.919808,35.808325,167.974185C27.053341,155.46954,26.778713,144.786038,23.180834,130.168643C19.139468,114.899686,18.114526,100.786543,20.952073,87.411869C21.572437,79.045425,6.897064,77.595457,4.916661,86.915441L4.90273,88.748028Z')
+    d: path(
+      "M4.90273,88.748028C1.236063,104.534694,0.694614,122.375568,4.181281,138.328902C7.119767,155.82704,18.329955,178.442148,31.722495,188.944182C39.448991,194.869945,48.960631,181.919808,35.808325,167.974185C27.053341,155.46954,26.778713,144.786038,23.180834,130.168643C19.139468,114.899686,18.114526,100.786543,20.952073,87.411869C21.572437,79.045425,6.897064,77.595457,4.916661,86.915441L4.90273,88.748028Z"
+    );
   }
   10% {
-    d: path('M3.04819,95.324083C3.04819,95.324083,5.563842,99.566705,5.563842,99.566705C5.563842,99.566705,11.253926,104.287825,15.031546,103.153927C19.091035,103.791214,24.274539,98.764542,25.851733,95.404259C27.275674,92.370488,25.596139,87.698114,24.002501,85.705929C20.798403,80.519057,13.463578,80.659628,12.636219,80.655608C8.65731,80.636275,3.191193,86.96637,3.089982,89.826322L3.04819,95.324083Z')
+    d: path(
+      "M3.04819,95.324083C3.04819,95.324083,5.563842,99.566705,5.563842,99.566705C5.563842,99.566705,11.253926,104.287825,15.031546,103.153927C19.091035,103.791214,24.274539,98.764542,25.851733,95.404259C27.275674,92.370488,25.596139,87.698114,24.002501,85.705929C20.798403,80.519057,13.463578,80.659628,12.636219,80.655608C8.65731,80.636275,3.191193,86.96637,3.089982,89.826322L3.04819,95.324083Z"
+    );
   }
   20% {
-    d: path('M3.04819,95.324083C3.04819,95.324083,5.563842,99.566705,5.563842,99.566705C5.563842,99.566705,11.253926,104.287825,15.031546,103.153927C19.091035,103.791214,24.274539,98.764542,25.851733,95.404259C27.275674,92.370488,25.596139,87.698114,24.002501,85.705929C20.798403,80.519057,13.463578,80.659628,12.636219,80.655608C8.65731,80.636275,3.191193,86.96637,3.089982,89.826322L3.04819,95.324083Z')
+    d: path(
+      "M3.04819,95.324083C3.04819,95.324083,5.563842,99.566705,5.563842,99.566705C5.563842,99.566705,11.253926,104.287825,15.031546,103.153927C19.091035,103.791214,24.274539,98.764542,25.851733,95.404259C27.275674,92.370488,25.596139,87.698114,24.002501,85.705929C20.798403,80.519057,13.463578,80.659628,12.636219,80.655608C8.65731,80.636275,3.191193,86.96637,3.089982,89.826322L3.04819,95.324083Z"
+    );
   }
   30% {
-    d: path('M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z')
+    d: path(
+      "M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z"
+    );
   }
   33.333333% {
-    d: path('M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z')
+    d: path(
+      "M5.83,85.46C0.33,109.14,-1.74,133.78,3.49,157.71C8.74,181.71,22.08,203.01,40.28,219.33C49.84,227.9,64.03,213.8,54.42,205.19C38.53,190.96,27.37,173.33,22.77,152.4C18.31,132.09,20.44,110.85,25.11,90.79C28.03,78.25,8.75,72.91,5.83,85.46L5.83,85.46Z"
+    );
   }
   43.333333% {
-    d: path('M36.436007,38.11681C-7.498754,85.801617,-0.826469,134.911183,5.658972,158.164678C15.873566,192.855226,35.43893,215.965329,40.28,219.33C49.84,227.9,63.271136,215.585685,53.661136,206.975685C38.384036,191.128398,25.999041,166.121323,22.77,152.4C12.429986,121.009925,27.020185,73.061168,50.245766,52.61587C65.058304,39.576508,51.054205,23.186387,36.436019,38.116819L36.436007,38.11681Z')
+    d: path(
+      "M36.436007,38.11681C-7.498754,85.801617,-0.826469,134.911183,5.658972,158.164678C15.873566,192.855226,35.43893,215.965329,40.28,219.33C49.84,227.9,63.271136,215.585685,53.661136,206.975685C38.384036,191.128398,25.999041,166.121323,22.77,152.4C12.429986,121.009925,27.020185,73.061168,50.245766,52.61587C65.058304,39.576508,51.054205,23.186387,36.436019,38.116819L36.436007,38.11681Z"
+    );
   }
   100% {
-    d: path('M36.436007,38.11681C-7.498754,85.801617,-0.826469,134.911183,5.658972,158.164678C15.873566,192.855226,35.43893,215.965329,40.28,219.33C49.84,227.9,63.271136,215.585685,53.661136,206.975685C38.384036,191.128398,25.999041,166.121323,22.77,152.4C12.429986,121.009925,27.020185,73.061168,50.245766,52.61587C65.058304,39.576508,51.054205,23.186387,36.436019,38.116819L36.436007,38.11681Z')
+    d: path(
+      "M36.436007,38.11681C-7.498754,85.801617,-0.826469,134.911183,5.658972,158.164678C15.873566,192.855226,35.43893,215.965329,40.28,219.33C49.84,227.9,63.271136,215.585685,53.661136,206.975685C38.384036,191.128398,25.999041,166.121323,22.77,152.4C12.429986,121.009925,27.020185,73.061168,50.245766,52.61587C65.058304,39.576508,51.054205,23.186387,36.436019,38.116819L36.436007,38.11681Z"
+    );
   }
 }
 
 #eB8dk2fHKWC11_ts {
-  animation: eB8dk2fHKWC11_ts__ts 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC11_ts__ts 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC11_ts__ts {
   0% {
-    transform: translate(139.784999px, 140.086986px) scale(1, 1)
+    transform: translate(139.784999px, 140.086986px) scale(1, 1);
   }
   30% {
-    transform: translate(139.784999px, 140.086986px) scale(1, 1)
+    transform: translate(139.784999px, 140.086986px) scale(1, 1);
   }
   43.333333% {
-    transform: translate(139.784999px, 140.086986px) scale(0.102813, 0.102813)
+    transform: translate(139.784999px, 140.086986px) scale(0.102813, 0.102813);
   }
   50% {
-    transform: translate(139.784999px, 140.086986px) scale(0.102813, 0.102813)
+    transform: translate(139.784999px, 140.086986px) scale(0.102813, 0.102813);
   }
   60% {
-    transform: translate(139.784999px, 140.086986px) scale(1.001075, 1.001075)
+    transform: translate(139.784999px, 140.086986px) scale(1.001075, 1.001075);
   }
   100% {
-    transform: translate(139.784999px, 140.086986px) scale(1.001075, 1.001075)
+    transform: translate(139.784999px, 140.086986px) scale(1.001075, 1.001075);
   }
 }
 
 #eB8dk2fHKWC11 {
-  animation: eB8dk2fHKWC11_c_o 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC11_c_o 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC11_c_o {
   0% {
-    opacity: 0
+    opacity: 0;
   }
   30% {
-    opacity: 0
+    opacity: 0;
   }
   36.666667% {
-    opacity: 0
+    opacity: 0;
   }
   40% {
-    opacity: 1
+    opacity: 1;
   }
   100% {
-    opacity: 1
+    opacity: 1;
   }
 }
 
 #eB8dk2fHKWC13_tr {
-  animation: eB8dk2fHKWC13_tr__tr 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC13_tr__tr 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC13_tr__tr {
   0% {
-    transform: translate(139.785004px, 140.086979px) rotate(0deg)
+    transform: translate(139.785004px, 140.086979px) rotate(0deg);
   }
   10% {
-    transform: translate(139.785004px, 140.086979px) rotate(0deg)
+    transform: translate(139.785004px, 140.086979px) rotate(0deg);
   }
   20% {
-    transform: translate(139.785004px, 140.086979px) rotate(90.041277deg)
+    transform: translate(139.785004px, 140.086979px) rotate(90.041277deg);
   }
   100% {
-    transform: translate(139.785004px, 140.086979px) rotate(90.041277deg)
+    transform: translate(139.785004px, 140.086979px) rotate(90.041277deg);
   }
 }
 
 #eB8dk2fHKWC13 {
-  animation: eB8dk2fHKWC13_c_o 3000ms linear infinite normal forwards
+  animation: eB8dk2fHKWC13_c_o 3000ms linear infinite normal forwards;
 }
 
 @keyframes eB8dk2fHKWC13_c_o {
   0% {
-    opacity: 0
+    opacity: 0;
   }
   6.666667% {
-    opacity: 0
+    opacity: 0;
   }
   10% {
-    opacity: 1
+    opacity: 1;
   }
   13.333333% {
-    opacity: 1
+    opacity: 1;
   }
   20% {
-    opacity: 0
+    opacity: 0;
   }
   100% {
-    opacity: 0
+    opacity: 0;
   }
-}
\ No newline at end of file
+}
diff --git a/portal-ui/src/screens/Console/Common/TableWrapper/TableWrapper.tsx b/portal-ui/src/screens/Console/Common/TableWrapper/TableWrapper.tsx
index e03dbfe9a..999ad81d0 100644
--- a/portal-ui/src/screens/Console/Common/TableWrapper/TableWrapper.tsx
+++ b/portal-ui/src/screens/Console/Common/TableWrapper/TableWrapper.tsx
@@ -28,7 +28,6 @@ import {
 import { AutoSizer, Column, InfiniteLoader, Table } from "react-virtualized";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
-import CircularProgress from "@mui/material/CircularProgress";
 import ViewColumnIcon from "@mui/icons-material/ViewColumn";
 import ArrowDropDownIcon from "@mui/icons-material/ArrowDropDown";
 import ArrowDropUpIcon from "@mui/icons-material/ArrowDropUp";
@@ -40,6 +39,7 @@ import {
   radioIcons,
   TableRowPredefStyles,
 } from "../FormComponents/common/styleLibrary";
+import Loader from "../Loader/Loader";
 
 //Interfaces for table Items
 
@@ -394,10 +394,8 @@ const elementActions = (
       if (action.showLoaderFunction(vlSend)) {
         return (
           <div className={"progress-enabled"}>
-            <CircularProgress
-              color="primary"
-              size={18}
-              variant="indeterminate"
+            <Loader
+              style={{width: 18, height: 18}}
               key={`actions-loader-${action.type}-${index.toString()}`}
             />
           </div>
diff --git a/portal-ui/src/screens/Console/Common/TestWrapper/TestWrapper.tsx b/portal-ui/src/screens/Console/Common/TestWrapper/TestWrapper.tsx
index 7e63e6adb..c52e7e8d8 100644
--- a/portal-ui/src/screens/Console/Common/TestWrapper/TestWrapper.tsx
+++ b/portal-ui/src/screens/Console/Common/TestWrapper/TestWrapper.tsx
@@ -18,12 +18,13 @@ import React, { Fragment, useState, useEffect } from "react";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
-import { CircularProgress, Grid } from "@mui/material";
+import { Grid } from "@mui/material";
 import ArrowForwardIosIcon from "@mui/icons-material/ArrowForwardIos";
 import { DrivesIcon, VersionIcon } from "../../../../icons";
 import { ServerInfo, Usage } from "../../Dashboard/types";
 import { ErrorResponseHandler } from "../../../../common/types";
 import api from "../../../../common/api";
+import Loader from "../Loader/Loader";
 
 interface ITestWrapper {
   title: any;
@@ -210,7 +211,7 @@ const TestWrapper = ({
             ) : (
               <Fragment>
                 <Grid item xs={12} className={classes.loaderAlign}>
-                  <CircularProgress size={25} />
+                  <Loader style={{ width: 25, height: 25 }} />
                 </Grid>
               </Fragment>
             )}
diff --git a/portal-ui/src/screens/Console/Common/UsageBarWrapper/SummaryUsageBar.tsx b/portal-ui/src/screens/Console/Common/UsageBarWrapper/SummaryUsageBar.tsx
index 97f1c5249..a1ee31558 100644
--- a/portal-ui/src/screens/Console/Common/UsageBarWrapper/SummaryUsageBar.tsx
+++ b/portal-ui/src/screens/Console/Common/UsageBarWrapper/SummaryUsageBar.tsx
@@ -4,12 +4,12 @@ import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
 import { LinearProgress, Stack } from "@mui/material";
 import Grid from "@mui/material/Grid";
-import CircularProgress from "@mui/material/CircularProgress";
 import ErrorBlock from "../../../shared/ErrorBlock";
 import { CircleIcon } from "../../../../icons";
 import LabelValuePair from "./LabelValuePair";
 import { ValueUnit } from "../../Tenants/ListTenants/types";
 import { niceBytes } from "../../../../common/utils";
+import Loader from "../Loader/Loader";
 
 interface ISummaryUsageBar {
   maxValue: number | undefined;
@@ -134,11 +134,7 @@ const SummaryUsageBar = ({
       {loading && (
         <div className={classes.padChart}>
           <Grid item xs={12} className={classes.centerItem}>
-            <CircularProgress
-              color="primary"
-              size={40}
-              variant="indeterminate"
-            />
+            <Loader style={{ width: 40, height: 40 }} />
           </Grid>
         </div>
       )}
diff --git a/portal-ui/src/screens/Console/Common/UsageBarWrapper/UsageBarWrapper.tsx b/portal-ui/src/screens/Console/Common/UsageBarWrapper/UsageBarWrapper.tsx
index 3d7f5727a..0b63e742a 100644
--- a/portal-ui/src/screens/Console/Common/UsageBarWrapper/UsageBarWrapper.tsx
+++ b/portal-ui/src/screens/Console/Common/UsageBarWrapper/UsageBarWrapper.tsx
@@ -4,8 +4,8 @@ import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
 import { LinearProgress } from "@mui/material";
 import Grid from "@mui/material/Grid";
-import CircularProgress from "@mui/material/CircularProgress";
 import ErrorBlock from "../../../shared/ErrorBlock";
+import Loader from "../Loader/Loader";
 
 interface IProgressBar {
   maxValue: number;
@@ -102,11 +102,7 @@ const UsageBarWrapper = ({
       {loading && (
         <div className={classes.padChart}>
           <Grid item xs={12} className={classes.centerItem}>
-            <CircularProgress
-              color="primary"
-              size={40}
-              variant="indeterminate"
-            />
+            <Loader />
           </Grid>
         </div>
       )}
diff --git a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/BarChartWidget.tsx b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/BarChartWidget.tsx
index 743670e12..25e318a5e 100644
--- a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/BarChartWidget.tsx
+++ b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/BarChartWidget.tsx
@@ -25,7 +25,7 @@ import {
   XAxis,
   YAxis,
 } from "recharts";
-import { CircularProgress, useMediaQuery } from "@mui/material";
+import { useMediaQuery } from "@mui/material";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
@@ -40,6 +40,7 @@ import { ErrorResponseHandler } from "../../../../../common/types";
 import api from "../../../../../common/api";
 import { openZoomPage } from "../../actions";
 import { useTheme } from "@mui/styles";
+import Loader from "../../../Common/Loader/Loader";
 
 interface IBarChartWidget {
   classes: any;
@@ -174,7 +175,7 @@ const BarChartWidget = ({
       )}
       {loading && (
         <div className={classes.loadingAlign}>
-          <CircularProgress />
+          <Loader />
         </div>
       )}
       {!loading && (
diff --git a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/LinearGraphWidget.tsx b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/LinearGraphWidget.tsx
index d11f652a8..650a668ba 100644
--- a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/LinearGraphWidget.tsx
+++ b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/LinearGraphWidget.tsx
@@ -25,7 +25,7 @@ import {
   XAxis,
   YAxis,
 } from "recharts";
-import { CircularProgress, useMediaQuery } from "@mui/material";
+import { useMediaQuery } from "@mui/material";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
@@ -40,6 +40,7 @@ import api from "../../../../../common/api";
 import LineChartTooltip from "./tooltips/LineChartTooltip";
 import { openZoomPage } from "../../actions";
 import { useTheme } from "@mui/styles";
+import Loader from "../../../Common/Loader/Loader";
 
 interface ILinearGraphWidget {
   classes: any;
@@ -212,7 +213,7 @@ const LinearGraphWidget = ({
           zoomActivated ? classes.verticalAlignment : classes.containerElements
         }
       >
-        {loading && <CircularProgress className={classes.loadingAlign} />}
+        {loading && <Loader className={classes.loadingAlign} />}
         {!loading && (
           <React.Fragment>
             <div
diff --git a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/PieChartWidget.tsx b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/PieChartWidget.tsx
index b0a22edd1..7a77eab2a 100644
--- a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/PieChartWidget.tsx
+++ b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/PieChartWidget.tsx
@@ -16,7 +16,6 @@
 
 import React, { useEffect, useState } from "react";
 import { connect } from "react-redux";
-import { CircularProgress } from "@mui/material";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
@@ -29,6 +28,7 @@ import { splitSizeMetric, widgetDetailsToPanel } from "../utils";
 import { ErrorResponseHandler } from "../../../../../common/types";
 import get from "lodash/get";
 import api from "../../../../../common/api";
+import Loader from "../../../Common/Loader/Loader";
 
 interface IPieChartWidget {
   classes: any;
@@ -135,7 +135,7 @@ const PieChartWidget = ({
       <div className={classes.titleContainer}>{title}</div>
       {loading && (
         <div className={classes.loadingAlign}>
-          <CircularProgress />
+          <Loader />
         </div>
       )}
       {!loading && (
diff --git a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SimpleWidget.tsx b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SimpleWidget.tsx
index 6ad8a146a..0cb60f307 100644
--- a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SimpleWidget.tsx
+++ b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SimpleWidget.tsx
@@ -19,12 +19,12 @@ import { connect } from "react-redux";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
-import { CircularProgress } from "@mui/material";
 import api from "../../../../../common/api";
 import { widgetDetailsToPanel } from "../utils";
 import { IDashboardPanel } from "../types";
 import { setErrorSnackMessage } from "../../../../../actions";
 import { ErrorResponseHandler } from "../../../../../common/types";
+import Loader from "../../../Common/Loader/Loader";
 
 interface ISimpleWidget {
   classes: any;
@@ -118,7 +118,7 @@ const SimpleWidget = ({
     <Fragment>
       {loading && (
         <div className={classes.loadingAlign}>
-          <CircularProgress />
+          <Loader />
         </div>
       )}
       {!loading && (
diff --git a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleRepWidget.tsx b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleRepWidget.tsx
index cfa032443..cdf47d868 100644
--- a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleRepWidget.tsx
+++ b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleRepWidget.tsx
@@ -25,10 +25,10 @@ import { connect } from "react-redux";
 import { setErrorSnackMessage } from "../../../../../actions";
 import { IDashboardPanel } from "../types";
 import { widgetDetailsToPanel } from "../utils";
-import { CircularProgress } from "@mui/material";
 import { ErrorResponseHandler } from "../../../../../common/types";
-import api from "../../../../../common/api";
 import { representationNumber } from "../../../../../common/utils";
+import api from "../../../../../common/api";
+import Loader from "../../../Common/Loader/Loader";
 
 interface ISingleRepWidget {
   classes: any;
@@ -128,7 +128,7 @@ const SingleRepWidget = ({
       <div className={classes.titleContainer}>{title}</div>
       {loading && (
         <div className={classes.loadingAlign}>
-          <CircularProgress />
+          <Loader />
         </div>
       )}
       {!loading && (
diff --git a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleValueWidget.tsx b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleValueWidget.tsx
index fbfc665f4..c9096bd3a 100644
--- a/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleValueWidget.tsx
+++ b/portal-ui/src/screens/Console/Dashboard/Prometheus/Widgets/SingleValueWidget.tsx
@@ -15,16 +15,16 @@
 // along with this program.  If not, see <http://www.gnu.org/licenses/>.
 
 import React, { Fragment, useEffect, useState } from "react";
+import { connect } from "react-redux";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
-import { widgetCommon } from "../../../Common/FormComponents/common/styleLibrary";
 import api from "../../../../../common/api";
+import Loader from "../../../Common/Loader/Loader";
+import { widgetCommon } from "../../../Common/FormComponents/common/styleLibrary";
 import { splitSizeMetric, widgetDetailsToPanel } from "../utils";
 import { IDashboardPanel } from "../types";
-import { connect } from "react-redux";
 import { setErrorSnackMessage } from "../../../../../actions";
-import { CircularProgress } from "@mui/material";
 import { ErrorResponseHandler } from "../../../../../common/types";
 
 interface ISingleValueWidget {
@@ -124,7 +124,7 @@ const SingleValueWidget = ({
     <div className={classes.containerAlignment}>
       {loading && (
         <div className={classes.loadingAlign}>
-          <CircularProgress />
+          <Loader />
         </div>
       )}
       {!loading && (
diff --git a/portal-ui/src/screens/Console/HealthInfo/HealthInfo.tsx b/portal-ui/src/screens/Console/HealthInfo/HealthInfo.tsx
index 0da8a5530..e73e001f5 100644
--- a/portal-ui/src/screens/Console/HealthInfo/HealthInfo.tsx
+++ b/portal-ui/src/screens/Console/HealthInfo/HealthInfo.tsx
@@ -44,11 +44,11 @@ import {
 import { Button, Grid } from "@mui/material";
 import PageHeader from "../Common/PageHeader/PageHeader";
 import { setServerDiagStat, setSnackBarMessage } from "../../../actions";
-import CircularProgress from "@mui/material/CircularProgress";
 import TestWrapper from "../Common/TestWrapper/TestWrapper";
 import PageLayout from "../Common/Layout/PageLayout";
 import HelpBox from "../../../common/HelpBox";
 import WarnIcon from "../../../icons/WarnIcon";
+import Loader from "../Common/Loader/Loader";
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -266,7 +266,7 @@ const HealthInfo = ({
                   <div className={classes.localMessage}>{localMessage}</div>
                   {serverDiagnosticStatus === DiagStatInProgress ? (
                     <div className={classes.loading}>
-                      <CircularProgress size={25} />
+                      <Loader style={{ width: 25, height: 25 }} />
                     </div>
                   ) : (
                     <Fragment>
diff --git a/portal-ui/src/screens/Console/ObjectBrowser/actions.ts b/portal-ui/src/screens/Console/ObjectBrowser/actions.ts
index ac93622af..126440b2f 100644
--- a/portal-ui/src/screens/Console/ObjectBrowser/actions.ts
+++ b/portal-ui/src/screens/Console/ObjectBrowser/actions.ts
@@ -238,6 +238,6 @@ export const setSelectedVersion = (selectedVersion: string) => {
 export const setShowDeletedObjects = (status: boolean) => {
   return {
     type: BUCKET_BROWSER_SHOW_DELETED,
-    status
-  }
+    status,
+  };
 };
diff --git a/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx b/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx
index ea503ecc6..0a074cc2c 100644
--- a/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx
+++ b/portal-ui/src/screens/Console/Speedtest/Speedtest.tsx
@@ -17,7 +17,7 @@
 import React, { Fragment, useEffect, useState } from "react";
 import { connect } from "react-redux";
 import { IMessageEvent, w3cwebsocket as W3CWebSocket } from "websocket";
-import { Button, CircularProgress, Grid } from "@mui/material";
+import { Button, Grid } from "@mui/material";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
@@ -47,6 +47,7 @@ import { SecureComponent } from "../../../common/SecureComponent";
 import DistributedOnly from "../Common/DistributedOnly/DistributedOnly";
 import HelpBox from "../../../common/HelpBox";
 import WarnIcon from "../../../icons/WarnIcon";
+import Loader from "../Common/Loader/Loader";
 
 interface ISpeedtest {
   classes: any;
@@ -205,7 +206,7 @@ const Speedtest = ({ classes, distributedSetup }: ISpeedtest) => {
                     {start ? (
                       <Fragment>
                         Speedtest in progress...
-                        <CircularProgress size={15} />
+                        <Loader style={{ width: 15, height: 15 }} />
                       </Fragment>
                     ) : (
                       <Fragment>
diff --git a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLicense.tsx b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLicense.tsx
index 67a99ea94..6d5d954d9 100644
--- a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLicense.tsx
+++ b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLicense.tsx
@@ -19,7 +19,6 @@ import { connect } from "react-redux";
 import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
-import { CircularProgress } from "@mui/material";
 import Grid from "@mui/material/Grid";
 import {
   containerForHeader,
@@ -33,6 +32,7 @@ import { setTenantDetailsLoad } from "../actions";
 import { ErrorResponseHandler } from "../../../../common/types";
 import SubnetLicenseTenant from "./SubnetLicenseTenant";
 import api from "../../../../common/api";
+import Loader from "../../Common/Loader/Loader";
 
 interface ITenantLicense {
   classes: any;
@@ -102,7 +102,7 @@ const TenantLicense = ({
       <h1 className={classes.sectionTitle}>License</h1>
       {loadingTenant ? (
         <div className={classes.loaderAlign}>
-          <CircularProgress />
+          <Loader />
         </div>
       ) : (
         <Fragment>
diff --git a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLogging.tsx b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLogging.tsx
index 4c9f782e6..869032967 100644
--- a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLogging.tsx
+++ b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantLogging.tsx
@@ -26,7 +26,7 @@ import {
   tenantDetailsStyles,
 } from "../../Common/FormComponents/common/styleLibrary";
 import Grid from "@mui/material/Grid";
-import { CircularProgress, DialogContentText } from "@mui/material";
+import { DialogContentText } from "@mui/material";
 import Paper from "@mui/material/Paper";
 import api from "../../../../common/api";
 import { ITenant } from "../ListTenants/types";
@@ -41,6 +41,7 @@ import ConfirmDialog from "../../Common/ModalWrapper/ConfirmDialog";
 import FormSwitchWrapper from "../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
 import RBIconButton from "../../Buckets/BucketDetails/SummaryItems/RBIconButton";
 import { niceBytes } from "../../../../common/utils";
+import Loader from "../../Common/Loader/Loader";
 
 interface ITenantLogs {
   classes: any;
@@ -249,7 +250,7 @@ const TenantLogging = ({
                   {loadingTenant ? (
                     <tr>
                       <td className={classes.centerAlign} colSpan={4}>
-                        <CircularProgress />
+                          <Loader />
                       </td>
                     </tr>
                   ) : (
@@ -365,7 +366,7 @@ const TenantLogging = ({
                   {loadingTenant ? (
                     <tr>
                       <td className={classes.centerAlign} colSpan={4}>
-                        <CircularProgress />
+                          <Loader />
                       </td>
                     </tr>
                   ) : (
diff --git a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantMonitoring.tsx b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantMonitoring.tsx
index 148e7cf58..14c88773d 100644
--- a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantMonitoring.tsx
+++ b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantMonitoring.tsx
@@ -26,7 +26,7 @@ import {
   searchField,
   tenantDetailsStyles,
 } from "../../Common/FormComponents/common/styleLibrary";
-import { CircularProgress, DialogContentText } from "@mui/material";
+import { DialogContentText } from "@mui/material";
 import Paper from "@mui/material/Paper";
 import { ITenant } from "../ListTenants/types";
 import { setErrorSnackMessage } from "../../../../actions";
@@ -41,6 +41,7 @@ import KeyPairView from "./KeyPairView";
 import { niceBytes } from "../../../../common/utils";
 import ConfirmDialog from "../../Common/ModalWrapper/ConfirmDialog";
 import RBIconButton from "../../Buckets/BucketDetails/SummaryItems/RBIconButton";
+import Loader from "../../Common/Loader/Loader";
 
 interface ITenantMonitoring {
   classes: any;
@@ -223,7 +224,7 @@ const TenantMonitoring = ({
                   {loadingTenant ? (
                     <tr>
                       <td className={classes.centerAlign} colSpan={4}>
-                        <CircularProgress />
+                        <Loader />
                       </td>
                     </tr>
                   ) : (
diff --git a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantSecurity.tsx b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantSecurity.tsx
index 8daeab55f..04a33a63c 100644
--- a/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantSecurity.tsx
+++ b/portal-ui/src/screens/Console/Tenants/TenantDetails/TenantSecurity.tsx
@@ -32,7 +32,6 @@ import Moment from "react-moment";
 import FormSwitchWrapper from "../../Common/FormComponents/FormSwitchWrapper/FormSwitchWrapper";
 import {
   Button,
-  CircularProgress,
   DialogContentText,
   Typography,
 } from "@mui/material";
@@ -46,6 +45,7 @@ import { ErrorResponseHandler } from "../../../../common/types";
 import { setTenantDetailsLoad } from "../actions";
 import ConfirmDialog from "../../Common/ModalWrapper/ConfirmDialog";
 import { AddIcon, ConfirmModalIcon } from "../../../../icons";
+import Loader from "../../Common/Loader/Loader";
 
 interface ITenantSecurity {
   classes: any;
@@ -347,7 +347,7 @@ const TenantSecurity = ({
       {loadingTenant ? (
         <Paper className={classes.paperContainer}>
           <div className={classes.loaderAlign}>
-            <CircularProgress />
+            <Loader />
           </div>
         </Paper>
       ) : (
@@ -534,7 +534,9 @@ const TenantSecurity = ({
                             >
                               {certificateInfo.domains &&
                                 certificateInfo.domains.map((dom) => {
-                                  return <div key={`CA-domain-${dom}`}>{dom}</div>;
+                                  return (
+                                    <div key={`CA-domain-${dom}`}>{dom}</div>
+                                  );
                                 })}
                             </Typography>
                             <Typography
diff --git a/portal-ui/src/screens/Console/Tenants/TenantDetails/hop/Hop.tsx b/portal-ui/src/screens/Console/Tenants/TenantDetails/hop/Hop.tsx
index 3db6123f6..853f2e0d5 100644
--- a/portal-ui/src/screens/Console/Tenants/TenantDetails/hop/Hop.tsx
+++ b/portal-ui/src/screens/Console/Tenants/TenantDetails/hop/Hop.tsx
@@ -19,12 +19,13 @@ import { Theme } from "@mui/material/styles";
 import createStyles from "@mui/styles/createStyles";
 import withStyles from "@mui/styles/withStyles";
 import { Link } from "react-router-dom";
-import { Box, CircularProgress, IconButton } from "@mui/material";
+import { Box, IconButton } from "@mui/material";
 import PageHeader from "../../../Common/PageHeader/PageHeader";
 import { containerForHeader } from "../../../Common/FormComponents/common/styleLibrary";
 import ExitToAppIcon from "@mui/icons-material/ExitToApp";
 import history from "./../../../../../history";
 import RefreshIcon from "../../../../../icons/RefreshIcon";
+import Loader from "../../../Common/Loader/Loader";
 
 interface IHopSimple {
   classes: any;
@@ -144,7 +145,7 @@ const Hop = ({ classes, match }: IHopSimple) => {
       <div className={classes.divContainer}>
         {loading && (
           <div className={classes.loader}>
-            <CircularProgress />
+            <Loader />
           </div>
         )}
         <iframe
diff --git a/portal-ui/src/screens/LoginPage/LoginPage.tsx b/portal-ui/src/screens/LoginPage/LoginPage.tsx
index f2d4b4bdf..80bc67351 100644
--- a/portal-ui/src/screens/LoginPage/LoginPage.tsx
+++ b/portal-ui/src/screens/LoginPage/LoginPage.tsx
@@ -17,7 +17,6 @@
 import React, { useEffect, useState } from "react";
 import { connect } from "react-redux";
 import {
-  CircularProgress,
   InputAdornment,
   LinearProgress,
   TextFieldProps,
@@ -53,6 +52,7 @@ import UserFilledIcon from "../../icons/UsersFilledIcon";
 import { SupportMenuIcon } from "../../icons/SidebarMenus";
 import GithubIcon from "../../icons/GithubIcon";
 import clsx from "clsx";
+import Loader from "../Console/Common/Loader/Loader";
 
 const styles = (theme: Theme) =>
   createStyles({
@@ -205,6 +205,8 @@ const styles = (theme: Theme) =>
     },
     loadingLoginStrategy: {
       textAlign: "center",
+      width: 40,
+      height: 40,
     },
     headerTitle: {
       marginRight: "auto",
@@ -576,7 +578,7 @@ const Login = ({
       loginComponent = (
         <div className={classes.loaderAlignment}>
           {loadingFetchConfiguration ? (
-            <CircularProgress className={classes.loadingLoginStrategy} />
+            <Loader className={classes.loadingLoginStrategy} />
           ) : (
             <React.Fragment>
               <div>