diff --git a/src/css/components/preloaders.css b/src/css/components/preloaders.css
index 8a07b979..bb54e012 100644
--- a/src/css/components/preloaders.css
+++ b/src/css/components/preloaders.css
@@ -1,5 +1,5 @@
 /*
- * Copyright (c) 2022 SGNetworks. All rights reserved.
+ * Copyright (c) 2022-2023 SGNetworks. All rights reserved.
  *
  * The software is an exclusive copyright of "SGNetworks" and is provided as is exclusively with only "USAGE" access. "Modification",  "Alteration", "Re-distribution" is completely prohibited.
  * VIOLATING THE ABOVE TERMS IS A PUNISHABLE OFFENSE WHICH MAY LEAD TO LEGAL CONSEQUENCES.
@@ -46,8 +46,8 @@
 
 
 .sgn-preloader > .preloader > img {
-	width: 100%;
-	height: 100%;
+	width: calc(var(--sgn-preloader-circles-width) + ((var(--sgn-preloader-stripes-width) + var(--sgn-preloader-circles-margin)) * 2));
+	height: calc(var(--sgn-preloader-circles-height) + (var(--sgn-preloader-stripes-width) + var(--sgn-preloader-circles-margin)));
 	margin: var(--sgn-preloader-circles-margin);
 	display: flex;
 	justify-content: center;
@@ -55,6 +55,7 @@
 	position: relative;
 	top: 50%;
 	left: 50%;
+	animation: spin 4s ease-in-out forwards infinite;
 }
 
 .sgn-preloader > .preloader > .spinner > img {
@@ -198,4 +199,25 @@
 	}
 }
 
+@keyframes pulse {
+	from {
+		transform: scale(.8);
+	}
+	to {
+		transform: scale(1);
+	}
+}
+
+@keyframes spin {
+	0% {
+		transform: rotateY(0deg);
+	}
+	50% {
+		transform: rotateY(180deg);
+	}
+	100% {
+		transform: rotateY(360deg);
+	}
+}
+