FIXED: Utility: Marquee: Animation was not smooth during scrolling an…

…d vertical scroll was not working.

src/css/utilities/marquee.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.
@@ -15,8 +15,7 @@
 	position: relative;
 }
 
-.has-marquee > .sgn-marquee-wrapper,
-.has-marquee > .js-marquee-wrapper {
+.has-marquee > .sgn-marquee-wrapper {
 	animation: none !important;
 	width: 100% !important;
 	transform: none !important;
@@ -25,22 +24,40 @@
 	/*position: absolute;*/
 }
 
-.has-marquee > .sgn-marquee-wrapper > .sgn-marquee,
-.has-marquee > .js-marquee-wrapper > .js-marquee {
+.has-marquee > .sgn-marquee-wrapper > .sgn-marquee {
 	margin: 0 auto !important;
 	float: none !important;
 
 	padding: 0 var(--padding-md);
 	display: inline-block;
 	position: relative;
 	animation: marquee-left 5s linear infinite;
+	animation-fill-mode: forwards;
 }
 
-.has-marquee > .sgn-marquee-wrapper > .sgn-marquee:first-child,
-.has-marquee > .js-marquee-wrapper > .js-marquee:first-child {
+.has-marquee > .sgn-marquee-wrapper > .sgn-marquee:first-child {
 	padding-left: 0 !important;
 }
 
+.has-marquee.vertical {
+	white-space: normal;
+	align-items: flex-start;
+}
+
+.has-marquee.vertical > .sgn-marquee-wrapper {
+	flex-direction: column;
+	height: 100%;
+}
+
+.has-marquee.vertical > .sgn-marquee-wrapper > .sgn-marquee {
+	margin: auto 0 !important;
+	padding: 0;
+}
+
+.has-marquee.vertical > .sgn-marquee-wrapper > .sgn-marquee:last-child {
+	animation-delay: 1s;
+}
+
 
 @keyframes marquee-left {
 	0% {
@@ -62,7 +79,7 @@
 	}
 }
 
-@keyframes marquee {
+@keyframes marquee-top {
 	0% {
 		transform: translateY(100%);
 	}