diff --git a/dist/tailshape.css b/dist/tailshape.css
index c5b18ed..30ddb14 100755
--- a/dist/tailshape.css
+++ b/dist/tailshape.css
@@ -563,10 +563,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   top: 0px;
 }
 
-.right-4 {
-  right: 1rem;
-}
-
 .bottom-auto {
   bottom: auto;
 }
@@ -583,6 +579,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   bottom: 0px;
 }
 
+.right-4 {
+  right: 1rem;
+}
+
 .top-3 {
   top: 0.75rem;
 }
@@ -591,6 +591,62 @@ Ensure the default browser behavior of the `hidden` attribute.
   top: 4rem;
 }
 
+.-left-8 {
+  left: -2rem;
+}
+
+.-bottom-8 {
+  bottom: -2rem;
+}
+
+.top-full {
+  top: 100%;
+}
+
+.bottom-1 {
+  bottom: 0.25rem;
+}
+
+.bottom-32 {
+  bottom: 8rem;
+}
+
+.-right-28 {
+  right: -7rem;
+}
+
+.left-40 {
+  left: 10rem;
+}
+
+.right-10 {
+  right: 2.5rem;
+}
+
+.right-20 {
+  right: 5rem;
+}
+
+.left-1\/2 {
+  left: 50%;
+}
+
+.top-24 {
+  top: 6rem;
+}
+
+.z-0 {
+  z-index: 0;
+}
+
+.z-40 {
+  z-index: 40;
+}
+
+.z-30 {
+  z-index: 30;
+}
+
 .z-20 {
   z-index: 20;
 }
@@ -599,20 +655,12 @@ Ensure the default browser behavior of the `hidden` attribute.
   z-index: 10;
 }
 
-.z-0 {
-  z-index: 0;
-}
-
 .z-50 {
   z-index: 50;
 }
 
-.z-40 {
-  z-index: 40;
-}
-
-.z-30 {
-  z-index: 30;
+.z-\[-1\] {
+  z-index: -1;
 }
 
 .order-1 {
@@ -647,14 +695,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   grid-column: span 6 / span 6;
 }
 
-.col-auto {
-  grid-column: auto;
-}
-
 .col-span-8 {
   grid-column: span 8 / span 8;
 }
 
+.col-auto {
+  grid-column: auto;
+}
+
 .float-right {
   float: right;
 }
@@ -667,6 +715,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin: 0.25rem;
 }
 
+.m-auto {
+  margin: auto;
+}
+
 .m-2 {
   margin: 0.5rem;
 }
@@ -675,8 +727,12 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin: 2.5rem;
 }
 
-.m-auto {
-  margin: auto;
+.m-3 {
+  margin: 0.75rem;
+}
+
+.m-4 {
+  margin: 1rem;
 }
 
 .mx-auto {
@@ -724,19 +780,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-bottom: 1.5rem;
 }
 
-.mx-16 {
-  margin-left: 4rem;
-  margin-right: 4rem;
-}
-
-.mx-8 {
-  margin-left: 2rem;
-  margin-right: 2rem;
-}
-
-.my-8 {
-  margin-top: 2rem;
-  margin-bottom: 2rem;
+.my-12 {
+  margin-top: 3rem;
+  margin-bottom: 3rem;
 }
 
 .my-5 {
@@ -754,9 +800,19 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-bottom: 0.5rem;
 }
 
-.my-12 {
-  margin-top: 3rem;
-  margin-bottom: 3rem;
+.mx-16 {
+  margin-left: 4rem;
+  margin-right: 4rem;
+}
+
+.mx-8 {
+  margin-left: 2rem;
+  margin-right: 2rem;
+}
+
+.my-8 {
+  margin-top: 2rem;
+  margin-bottom: 2rem;
 }
 
 .mx-0 {
@@ -794,6 +850,26 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-right: -0.75rem;
 }
 
+.my-auto {
+  margin-top: auto;
+  margin-bottom: auto;
+}
+
+.mx-3 {
+  margin-left: 0.75rem;
+  margin-right: 0.75rem;
+}
+
+.my-\[6px\] {
+  margin-top: 6px;
+  margin-bottom: 6px;
+}
+
+.mx-32 {
+  margin-left: 8rem;
+  margin-right: 8rem;
+}
+
 .mt-12 {
   margin-top: 3rem;
 }
@@ -878,14 +954,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-bottom: 1rem;
 }
 
-.mt-8 {
-  margin-top: 2rem;
-}
-
-.mt-32 {
-  margin-top: 8rem;
-}
-
 .mt-0 {
   margin-top: 0px;
 }
@@ -918,32 +986,48 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-top: -5rem;
 }
 
-.ml-4 {
-  margin-left: 1rem;
+.mt-8 {
+  margin-top: 2rem;
 }
 
-.mb-16 {
-  margin-bottom: 4rem;
+.mt-28 {
+  margin-top: 7rem;
 }
 
-.mt-5 {
-  margin-top: 1.25rem;
+.ml-auto {
+  margin-left: auto;
 }
 
-.ml-5 {
-  margin-left: 1.25rem;
+.mt-24 {
+  margin-top: 6rem;
 }
 
-.-mr-12 {
-  margin-right: -3rem;
+.-mt-4 {
+  margin-top: -1rem;
 }
 
 .mr-4 {
   margin-right: 1rem;
 }
 
-.-ml-1 {
-  margin-left: -0.25rem;
+.mt-32 {
+  margin-top: 8rem;
+}
+
+.mb-16 {
+  margin-bottom: 4rem;
+}
+
+.ml-4 {
+  margin-left: 1rem;
+}
+
+.mr-3 {
+  margin-right: 0.75rem;
+}
+
+.mt-5 {
+  margin-top: 1.25rem;
 }
 
 .mb-5 {
@@ -954,8 +1038,40 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-top: 5rem;
 }
 
-.mt-24 {
-  margin-top: 6rem;
+.ml-5 {
+  margin-left: 1.25rem;
+}
+
+.-mr-12 {
+  margin-right: -3rem;
+}
+
+.-ml-1 {
+  margin-left: -0.25rem;
+}
+
+.-ml-0 {
+  margin-left: -0px;
+}
+
+.-mb-1 {
+  margin-bottom: -0.25rem;
+}
+
+.mr-5 {
+  margin-right: 1.25rem;
+}
+
+.-mr-1 {
+  margin-right: -0.25rem;
+}
+
+.-mt-2 {
+  margin-top: -0.5rem;
+}
+
+.-mr-2 {
+  margin-right: -0.5rem;
 }
 
 .ml-0 {
@@ -994,10 +1110,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-bottom: 5rem;
 }
 
-.mr-5 {
-  margin-right: 1.25rem;
-}
-
 .-ml-2 {
   margin-left: -0.5rem;
 }
@@ -1030,40 +1142,12 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-left: 2.5rem;
 }
 
-.mt-28 {
-  margin-top: 7rem;
+.ml-20 {
+  margin-left: 5rem;
 }
 
-.ml-auto {
-  margin-left: auto;
-}
-
-.-mt-4 {
-  margin-top: -1rem;
-}
-
-.mr-3 {
-  margin-right: 0.75rem;
-}
-
-.-ml-0 {
-  margin-left: -0px;
-}
-
-.-mb-1 {
-  margin-bottom: -0.25rem;
-}
-
-.-mr-1 {
-  margin-right: -0.25rem;
-}
-
-.-mt-2 {
-  margin-top: -0.5rem;
-}
-
-.-mr-2 {
-  margin-right: -0.5rem;
+.mt-14 {
+  margin-top: 3.5rem;
 }
 
 .block {
@@ -1118,14 +1202,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   height: 1.5rem;
 }
 
-.h-full {
-  height: 100%;
-}
-
-.h-3 {
-  height: 0.75rem;
-}
-
 .h-px {
   height: 1px;
 }
@@ -1134,24 +1210,28 @@ Ensure the default browser behavior of the `hidden` attribute.
   height: auto;
 }
 
-.h-20 {
-  height: 5rem;
+.h-0 {
+  height: 0px;
 }
 
-.h-screen {
-  height: 100vh;
+.h-full {
+  height: 100%;
+}
+
+.h-3 {
+  height: 0.75rem;
 }
 
 .h-64 {
   height: 16rem;
 }
 
-.h-24 {
-  height: 6rem;
+.h-20 {
+  height: 5rem;
 }
 
-.h-0 {
-  height: 0px;
+.h-screen {
+  height: 100vh;
 }
 
 .h-0\.5 {
@@ -1166,6 +1246,50 @@ Ensure the default browser behavior of the `hidden` attribute.
   height: 1.75rem;
 }
 
+.h-24 {
+  height: 6rem;
+}
+
+.h-72 {
+  height: 18rem;
+}
+
+.h-96 {
+  height: 24rem;
+}
+
+.h-\[1px\] {
+  height: 1px;
+}
+
+.h-\[2px\] {
+  height: 2px;
+}
+
+.h-11 {
+  height: 2.75rem;
+}
+
+.h-56 {
+  height: 14rem;
+}
+
+.h-32 {
+  height: 8rem;
+}
+
+.h-3\/4 {
+  height: 75%;
+}
+
+.h-1\/4 {
+  height: 25%;
+}
+
+.h-5\/6 {
+  height: 83.333333%;
+}
+
 .min-h-screen {
   min-height: 100vh;
 }
@@ -1210,46 +1334,22 @@ Ensure the default browser behavior of the `hidden` attribute.
   width: 6rem;
 }
 
-.w-12 {
-  width: 3rem;
-}
-
 .w-6 {
   width: 1.5rem;
 }
 
-.w-3 {
-  width: 0.75rem;
+.w-12 {
+  width: 3rem;
 }
 
 .w-40 {
   width: 10rem;
 }
 
-.w-5\/6 {
-  width: 83.333333%;
-}
-
-.w-11\/12 {
-  width: 91.666667%;
-}
-
-.w-20 {
-  width: 5rem;
-}
-
-.w-1\/2 {
-  width: 50%;
-}
-
 .w-2\/3 {
   width: 66.666667%;
 }
 
-.w-screen {
-  width: 100vw;
-}
-
 .w-1\/3 {
   width: 33.333333%;
 }
@@ -1270,14 +1370,78 @@ Ensure the default browser behavior of the `hidden` attribute.
   width: 75%;
 }
 
+.w-1\/2 {
+  width: 50%;
+}
+
+.w-3 {
+  width: 0.75rem;
+}
+
 .w-36 {
   width: 9rem;
 }
 
+.w-5\/6 {
+  width: 83.333333%;
+}
+
+.w-11\/12 {
+  width: 91.666667%;
+}
+
+.w-20 {
+  width: 5rem;
+}
+
+.w-screen {
+  width: 100vw;
+}
+
 .w-1\/5 {
   width: 20%;
 }
 
+.w-3\/6 {
+  width: 50%;
+}
+
+.w-4\/6 {
+  width: 66.666667%;
+}
+
+.w-4\/5 {
+  width: 80%;
+}
+
+.w-2\/4 {
+  width: 50%;
+}
+
+.w-60 {
+  width: 15rem;
+}
+
+.w-\[30px\] {
+  width: 30px;
+}
+
+.w-0 {
+  width: 0px;
+}
+
+.w-48 {
+  width: 12rem;
+}
+
+.w-16 {
+  width: 4rem;
+}
+
+.w-7\/12 {
+  width: 58.333333%;
+}
+
 .min-w-0 {
   min-width: 0px;
 }
@@ -1302,10 +1466,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   max-width: 80rem;
 }
 
-.max-w-sm {
-  max-width: 24rem;
-}
-
 .max-w-md {
   max-width: 28rem;
 }
@@ -1314,6 +1474,22 @@ Ensure the default browser behavior of the `hidden` attribute.
   max-width: 100%;
 }
 
+.max-w-2xl {
+  max-width: 42rem;
+}
+
+.max-w-screen-lg {
+  max-width: 1024px;
+}
+
+.max-w-screen-md {
+  max-width: 768px;
+}
+
+.max-w-sm {
+  max-width: 24rem;
+}
+
 .max-w-6xl {
   max-width: 72rem;
 }
@@ -1326,16 +1502,12 @@ Ensure the default browser behavior of the `hidden` attribute.
   max-width: 56rem;
 }
 
-.max-w-2xl {
-  max-width: 42rem;
+.max-w-\[480px\] {
+  max-width: 480px;
 }
 
-.max-w-screen-lg {
-  max-width: 1024px;
-}
-
-.max-w-screen-md {
-  max-width: 768px;
+.max-w-\[250px\] {
+  max-width: 250px;
 }
 
 .flex-auto {
@@ -1362,6 +1534,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   flex-grow: 1;
 }
 
+.origin-top-right {
+  transform-origin: top right;
+}
+
 .-translate-y-1\/2 {
   --tw-translate-y: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -1377,8 +1553,43 @@ Ensure the default browser behavior of the `hidden` attribute.
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
-.translate-x-1 {
-  --tw-translate-x: 0.25rem;
+.-translate-x-80 {
+  --tw-translate-x: -20rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.translate-x-12 {
+  --tw-translate-x: 3rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.translate-x-64 {
+  --tw-translate-x: 16rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.-translate-x-64 {
+  --tw-translate-x: -16rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.translate-x-1\/2 {
+  --tw-translate-x: 50%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.-translate-x-full {
+  --tw-translate-x: -100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.translate-x-full {
+  --tw-translate-x: 100%;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.-translate-x-1\/2 {
+  --tw-translate-x: -50%;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
@@ -1387,13 +1598,18 @@ Ensure the default browser behavior of the `hidden` attribute.
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+.rotate-180 {
+  --tw-rotate: 180deg;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .rotate-90 {
   --tw-rotate: 90deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
-.rotate-180 {
-  --tw-rotate: 180deg;
+.-rotate-12 {
+  --tw-rotate: -12deg;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
@@ -1414,6 +1630,18 @@ Ensure the default browser behavior of the `hidden` attribute.
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+.scale-75 {
+  --tw-scale-x: .75;
+  --tw-scale-y: .75;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.scale-95 {
+  --tw-scale-x: .95;
+  --tw-scale-y: .95;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .transform {
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
@@ -1495,6 +1723,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   justify-content: flex-start;
 }
 
+.justify-end {
+  justify-content: flex-end;
+}
+
 .justify-center {
   justify-content: center;
 }
@@ -1503,10 +1735,22 @@ Ensure the default browser behavior of the `hidden` attribute.
   justify-content: space-between;
 }
 
+.justify-around {
+  justify-content: space-around;
+}
+
 .justify-evenly {
   justify-content: space-evenly;
 }
 
+.justify-items-start {
+  justify-items: start;
+}
+
+.justify-items-center {
+  justify-items: center;
+}
+
 .gap-4 {
   gap: 1rem;
 }
@@ -1543,6 +1787,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   gap: 0.25rem;
 }
 
+.gap-6 {
+  gap: 1.5rem;
+}
+
 .gap-x-3 {
   -moz-column-gap: 0.75rem;
        column-gap: 0.75rem;
@@ -1599,18 +1847,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-left: calc(0.75rem * calc(1 - var(--tw-space-x-reverse)));
 }
 
-.space-y-12 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-y-reverse: 0;
-  margin-top: calc(3rem * calc(1 - var(--tw-space-y-reverse)));
-  margin-bottom: calc(3rem * var(--tw-space-y-reverse));
-}
-
-.space-x-2 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
-  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
-}
-
 .space-y-8 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(2rem * calc(1 - var(--tw-space-y-reverse)));
@@ -1623,10 +1859,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
 }
 
-.space-x-0 > :not([hidden]) ~ :not([hidden]) {
+.space-x-2 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 0;
-  margin-right: calc(0px * var(--tw-space-x-reverse));
-  margin-left: calc(0px * calc(1 - var(--tw-space-x-reverse)));
+  margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
 }
 
 .space-x-8 > :not([hidden]) ~ :not([hidden]) {
@@ -1635,12 +1871,24 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-left: calc(2rem * calc(1 - var(--tw-space-x-reverse)));
 }
 
+.space-y-12 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-y-reverse: 0;
+  margin-top: calc(3rem * calc(1 - var(--tw-space-y-reverse)));
+  margin-bottom: calc(3rem * var(--tw-space-y-reverse));
+}
+
 .space-y-5 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 0;
   margin-top: calc(1.25rem * calc(1 - var(--tw-space-y-reverse)));
   margin-bottom: calc(1.25rem * var(--tw-space-y-reverse));
 }
 
+.space-x-0 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0px * var(--tw-space-x-reverse));
+  margin-left: calc(0px * calc(1 - var(--tw-space-x-reverse)));
+}
+
 .space-x-5 > :not([hidden]) ~ :not([hidden]) {
   --tw-space-x-reverse: 0;
   margin-right: calc(1.25rem * var(--tw-space-x-reverse));
@@ -1659,6 +1907,12 @@ Ensure the default browser behavior of the `hidden` attribute.
   margin-left: calc(2.5rem * calc(1 - var(--tw-space-x-reverse)));
 }
 
+.space-x-1\.5 > :not([hidden]) ~ :not([hidden]) {
+  --tw-space-x-reverse: 0;
+  margin-right: calc(0.375rem * var(--tw-space-x-reverse));
+  margin-left: calc(0.375rem * calc(1 - var(--tw-space-x-reverse)));
+}
+
 .space-y-reverse > :not([hidden]) ~ :not([hidden]) {
   --tw-space-y-reverse: 1;
 }
@@ -1690,6 +1944,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(243 244 246 / var(--tw-divide-opacity));
 }
 
+.divide-gray-600 > :not([hidden]) ~ :not([hidden]) {
+  --tw-divide-opacity: 1;
+  border-color: rgb(75 85 99 / var(--tw-divide-opacity));
+}
+
 .divide-opacity-50 > :not([hidden]) ~ :not([hidden]) {
   --tw-divide-opacity: 0.5;
 }
@@ -1710,6 +1969,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   align-self: center;
 }
 
+.self-stretch {
+  align-self: stretch;
+}
+
 .overflow-hidden {
   overflow: hidden;
 }
@@ -1760,28 +2023,40 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-radius: 0.75rem;
 }
 
+.rounded-2xl {
+  border-radius: 1rem;
+}
+
 .rounded-t {
   border-top-left-radius: 0.25rem;
   border-top-right-radius: 0.25rem;
 }
 
-.rounded-l-xl {
-  border-top-left-radius: 0.75rem;
-  border-bottom-left-radius: 0.75rem;
+.rounded-b-none {
+  border-bottom-right-radius: 0px;
+  border-bottom-left-radius: 0px;
+}
+
+.rounded-br {
+  border-bottom-right-radius: 0.25rem;
+}
+
+.rounded-bl {
+  border-bottom-left-radius: 0.25rem;
 }
 
 .border {
   border-width: 1px;
 }
 
-.border-2 {
-  border-width: 2px;
-}
-
 .border-0 {
   border-width: 0px;
 }
 
+.border-2 {
+  border-width: 2px;
+}
+
 .border-4 {
   border-width: 4px;
 }
@@ -1794,10 +2069,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-top-width: 1px;
 }
 
-.border-b-4 {
-  border-bottom-width: 4px;
-}
-
 .border-t-2 {
   border-top-width: 2px;
 }
@@ -1810,6 +2081,18 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-bottom-width: 2px;
 }
 
+.border-b-4 {
+  border-bottom-width: 4px;
+}
+
+.border-t-4 {
+  border-top-width: 4px;
+}
+
+.border-r {
+  border-right-width: 1px;
+}
+
 .border-none {
   border-style: none;
 }
@@ -1829,19 +2112,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(243 244 246 / var(--tw-border-opacity));
 }
 
-.border-white\/10 {
-  border-color: rgb(255 255 255 / 0.1);
-}
-
 .border-gray-200 {
   --tw-border-opacity: 1;
   border-color: rgb(229 231 235 / var(--tw-border-opacity));
 }
 
-.border-white\/25 {
-  border-color: rgb(255 255 255 / 0.25);
-}
-
 .border-gray-700 {
   --tw-border-opacity: 1;
   border-color: rgb(55 65 81 / var(--tw-border-opacity));
@@ -1852,40 +2127,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(156 163 175 / var(--tw-border-opacity));
 }
 
-.border-transparent {
-  border-color: transparent;
-}
-
-.border-pink-500 {
-  --tw-border-opacity: 1;
-  border-color: rgb(236 72 153 / var(--tw-border-opacity));
-}
-
-.border-black {
-  --tw-border-opacity: 1;
-  border-color: rgb(0 0 0 / var(--tw-border-opacity));
-}
-
-.border-indigo-500 {
-  --tw-border-opacity: 1;
-  border-color: rgb(99 102 241 / var(--tw-border-opacity));
-}
-
-.border-purple-500 {
-  --tw-border-opacity: 1;
-  border-color: rgb(168 85 247 / var(--tw-border-opacity));
-}
-
-.border-blue-400 {
-  --tw-border-opacity: 1;
-  border-color: rgb(96 165 250 / var(--tw-border-opacity));
-}
-
-.border-teal-500 {
-  --tw-border-opacity: 1;
-  border-color: rgb(20 184 166 / var(--tw-border-opacity));
-}
-
 .border-gray-600 {
   --tw-border-opacity: 1;
   border-color: rgb(75 85 99 / var(--tw-border-opacity));
@@ -1896,11 +2137,28 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(255 255 255 / var(--tw-border-opacity));
 }
 
+.border-white\/10 {
+  border-color: rgb(255 255 255 / 0.1);
+}
+
+.border-transparent {
+  border-color: transparent;
+}
+
+.border-white\/25 {
+  border-color: rgb(255 255 255 / 0.25);
+}
+
 .border-gray-500 {
   --tw-border-opacity: 1;
   border-color: rgb(107 114 128 / var(--tw-border-opacity));
 }
 
+.border-pink-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(236 72 153 / var(--tw-border-opacity));
+}
+
 .border-blue-700 {
   --tw-border-opacity: 1;
   border-color: rgb(29 78 216 / var(--tw-border-opacity));
@@ -1916,11 +2174,76 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(59 130 246 / var(--tw-border-opacity));
 }
 
+.border-purple-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(168 85 247 / var(--tw-border-opacity));
+}
+
+.border-black {
+  --tw-border-opacity: 1;
+  border-color: rgb(0 0 0 / var(--tw-border-opacity));
+}
+
+.border-indigo-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(99 102 241 / var(--tw-border-opacity));
+}
+
+.border-blue-400 {
+  --tw-border-opacity: 1;
+  border-color: rgb(96 165 250 / var(--tw-border-opacity));
+}
+
+.border-teal-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(20 184 166 / var(--tw-border-opacity));
+}
+
+.border-cyan-300 {
+  --tw-border-opacity: 1;
+  border-color: rgb(103 232 249 / var(--tw-border-opacity));
+}
+
+.border-cyan-700 {
+  --tw-border-opacity: 1;
+  border-color: rgb(14 116 144 / var(--tw-border-opacity));
+}
+
+.border-cyan-600 {
+  --tw-border-opacity: 1;
+  border-color: rgb(8 145 178 / var(--tw-border-opacity));
+}
+
+.border-cyan-400 {
+  --tw-border-opacity: 1;
+  border-color: rgb(34 211 238 / var(--tw-border-opacity));
+}
+
+.border-indigo-700 {
+  --tw-border-opacity: 1;
+  border-color: rgb(67 56 202 / var(--tw-border-opacity));
+}
+
+.border-orange-500 {
+  --tw-border-opacity: 1;
+  border-color: rgb(249 115 22 / var(--tw-border-opacity));
+}
+
 .border-b-gray-500 {
   --tw-border-opacity: 1;
   border-bottom-color: rgb(107 114 128 / var(--tw-border-opacity));
 }
 
+.border-b-gray-300 {
+  --tw-border-opacity: 1;
+  border-bottom-color: rgb(209 213 219 / var(--tw-border-opacity));
+}
+
+.border-b-gray-800 {
+  --tw-border-opacity: 1;
+  border-bottom-color: rgb(31 41 55 / var(--tw-border-opacity));
+}
+
 .bg-gray-100 {
   --tw-bg-opacity: 1;
   background-color: rgb(243 244 246 / var(--tw-bg-opacity));
@@ -1961,11 +2284,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(126 34 206 / var(--tw-bg-opacity));
 }
 
-.bg-black {
-  --tw-bg-opacity: 1;
-  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
-}
-
 .bg-gray-300 {
   --tw-bg-opacity: 1;
   background-color: rgb(209 213 219 / var(--tw-bg-opacity));
@@ -1975,14 +2293,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: transparent;
 }
 
-.bg-red-700 {
+.bg-black {
   --tw-bg-opacity: 1;
-  background-color: rgb(185 28 28 / var(--tw-bg-opacity));
-}
-
-.bg-gray-50 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(249 250 251 / var(--tw-bg-opacity));
+  background-color: rgb(0 0 0 / var(--tw-bg-opacity));
 }
 
 .bg-gray-200 {
@@ -1990,9 +2303,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(229 231 235 / var(--tw-bg-opacity));
 }
 
-.bg-green-600 {
+.bg-gray-50 {
   --tw-bg-opacity: 1;
-  background-color: rgb(22 163 74 / var(--tw-bg-opacity));
+  background-color: rgb(249 250 251 / var(--tw-bg-opacity));
 }
 
 .bg-yellow-500 {
@@ -2000,9 +2313,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(234 179 8 / var(--tw-bg-opacity));
 }
 
-.bg-purple-500 {
+.bg-indigo-50 {
   --tw-bg-opacity: 1;
-  background-color: rgb(168 85 247 / var(--tw-bg-opacity));
+  background-color: rgb(238 242 255 / var(--tw-bg-opacity));
 }
 
 .bg-indigo-600 {
@@ -2010,9 +2323,64 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(79 70 229 / var(--tw-bg-opacity));
 }
 
-.bg-green-500 {
+.bg-cyan-100 {
   --tw-bg-opacity: 1;
-  background-color: rgb(34 197 94 / var(--tw-bg-opacity));
+  background-color: rgb(207 250 254 / var(--tw-bg-opacity));
+}
+
+.bg-cyan-300 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(103 232 249 / var(--tw-bg-opacity));
+}
+
+.bg-red-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(239 68 68 / var(--tw-bg-opacity));
+}
+
+.bg-orange-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(249 115 22 / var(--tw-bg-opacity));
+}
+
+.bg-gray-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(75 85 99 / var(--tw-bg-opacity));
+}
+
+.bg-red-700 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(185 28 28 / var(--tw-bg-opacity));
+}
+
+.bg-purple-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(147 51 234 / var(--tw-bg-opacity));
+}
+
+.bg-teal-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(20 184 166 / var(--tw-bg-opacity));
+}
+
+.bg-gray-400 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(156 163 175 / var(--tw-bg-opacity));
+}
+
+.bg-green-600 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(22 163 74 / var(--tw-bg-opacity));
+}
+
+.bg-blue-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
+}
+
+.bg-blue-100 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(219 234 254 / var(--tw-bg-opacity));
 }
 
 .bg-blue-900 {
@@ -2020,6 +2388,21 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(30 58 138 / var(--tw-bg-opacity));
 }
 
+.bg-red-400 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(248 113 113 / var(--tw-bg-opacity));
+}
+
+.bg-purple-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(168 85 247 / var(--tw-bg-opacity));
+}
+
+.bg-green-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(34 197 94 / var(--tw-bg-opacity));
+}
+
 .bg-pink-500 {
   --tw-bg-opacity: 1;
   background-color: rgb(236 72 153 / var(--tw-bg-opacity));
@@ -2035,14 +2418,29 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(30 64 175 / var(--tw-bg-opacity));
 }
 
-.bg-orange-500 {
+.bg-blue-700 {
   --tw-bg-opacity: 1;
-  background-color: rgb(249 115 22 / var(--tw-bg-opacity));
+  background-color: rgb(29 78 216 / var(--tw-bg-opacity));
 }
 
-.bg-blue-100 {
+.bg-purple-400 {
   --tw-bg-opacity: 1;
-  background-color: rgb(219 234 254 / var(--tw-bg-opacity));
+  background-color: rgb(192 132 252 / var(--tw-bg-opacity));
+}
+
+.bg-gray-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(107 114 128 / var(--tw-bg-opacity));
+}
+
+.bg-\[\#242526\] {
+  --tw-bg-opacity: 1;
+  background-color: rgb(36 37 38 / var(--tw-bg-opacity));
+}
+
+.bg-\[\#3A3B3C\] {
+  --tw-bg-opacity: 1;
+  background-color: rgb(58 59 60 / var(--tw-bg-opacity));
 }
 
 .bg-indigo-700 {
@@ -2065,84 +2463,69 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(96 165 250 / var(--tw-bg-opacity));
 }
 
-.bg-teal-500 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(20 184 166 / var(--tw-bg-opacity));
-}
-
 .bg-green-400 {
   --tw-bg-opacity: 1;
   background-color: rgb(74 222 128 / var(--tw-bg-opacity));
 }
 
-.bg-purple-400 {
+.bg-emerald-500 {
   --tw-bg-opacity: 1;
-  background-color: rgb(192 132 252 / var(--tw-bg-opacity));
+  background-color: rgb(16 185 129 / var(--tw-bg-opacity));
 }
 
-.bg-gray-400 {
+.bg-cyan-600 {
   --tw-bg-opacity: 1;
-  background-color: rgb(156 163 175 / var(--tw-bg-opacity));
+  background-color: rgb(8 145 178 / var(--tw-bg-opacity));
 }
 
-.bg-indigo-50 {
+.bg-emerald-50 {
   --tw-bg-opacity: 1;
-  background-color: rgb(238 242 255 / var(--tw-bg-opacity));
+  background-color: rgb(236 253 245 / var(--tw-bg-opacity));
 }
 
-.bg-cyan-100 {
+.bg-blue-50 {
   --tw-bg-opacity: 1;
-  background-color: rgb(207 250 254 / var(--tw-bg-opacity));
+  background-color: rgb(239 246 255 / var(--tw-bg-opacity));
 }
 
-.bg-cyan-300 {
+.bg-cyan-700 {
   --tw-bg-opacity: 1;
-  background-color: rgb(103 232 249 / var(--tw-bg-opacity));
+  background-color: rgb(14 116 144 / var(--tw-bg-opacity));
 }
 
-.bg-red-500 {
+.bg-cyan-400 {
   --tw-bg-opacity: 1;
-  background-color: rgb(239 68 68 / var(--tw-bg-opacity));
+  background-color: rgb(34 211 238 / var(--tw-bg-opacity));
 }
 
-.bg-gray-600 {
+.bg-red-600 {
   --tw-bg-opacity: 1;
-  background-color: rgb(75 85 99 / var(--tw-bg-opacity));
+  background-color: rgb(220 38 38 / var(--tw-bg-opacity));
 }
 
-.bg-purple-600 {
+.bg-indigo-200 {
   --tw-bg-opacity: 1;
-  background-color: rgb(147 51 234 / var(--tw-bg-opacity));
+  background-color: rgb(199 210 254 / var(--tw-bg-opacity));
 }
 
-.bg-blue-500 {
+.bg-indigo-100 {
   --tw-bg-opacity: 1;
-  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
+  background-color: rgb(224 231 255 / var(--tw-bg-opacity));
 }
 
-.bg-blue-700 {
+.bg-yellow-700 {
   --tw-bg-opacity: 1;
-  background-color: rgb(29 78 216 / var(--tw-bg-opacity));
+  background-color: rgb(161 98 7 / var(--tw-bg-opacity));
 }
 
-.bg-gray-500 {
+.bg-yellow-800 {
   --tw-bg-opacity: 1;
-  background-color: rgb(107 114 128 / var(--tw-bg-opacity));
+  background-color: rgb(133 77 14 / var(--tw-bg-opacity));
 }
 
-.bg-\[\#242526\] {
+.bg-red-200 {
   --tw-bg-opacity: 1;
-  background-color: rgb(36 37 38 / var(--tw-bg-opacity));
-}
-
-.bg-\[\#3A3B3C\] {
-  --tw-bg-opacity: 1;
-  background-color: rgb(58 59 60 / var(--tw-bg-opacity));
-}
-
-.bg-red-400 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(248 113 113 / var(--tw-bg-opacity));
+  background-color: rgb(254 202 202 / var(--tw-bg-opacity));
 }
 
 .bg-opacity-50 {
@@ -2157,6 +2540,26 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-bg-opacity: 0.25;
 }
 
+.bg-opacity-5 {
+  --tw-bg-opacity: 0.05;
+}
+
+.bg-opacity-90 {
+  --tw-bg-opacity: 0.9;
+}
+
+.bg-opacity-80 {
+  --tw-bg-opacity: 0.8;
+}
+
+.bg-opacity-20 {
+  --tw-bg-opacity: 0.2;
+}
+
+.bg-opacity-10 {
+  --tw-bg-opacity: 0.1;
+}
+
 .bg-gradient-to-r {
   background-image: linear-gradient(to right, var(--tw-gradient-stops));
 }
@@ -2165,6 +2568,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-image: url(https://images.unsplash.com/photo-1514525253161-7a46d19cd819?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1267&q=80);
 }
 
+.bg-\[url\(\)\] {
+  background-image: url();
+}
+
+.bg-\[url\(https\:\/\/images\.pexels\.com\/photos\/57690\/pexels-photo-57690\.jpeg\?auto\=compress\&cs\=tinysrgb\&dpr\=2\&h\=650\&w\=940\)\] {
+  background-image: url(https://images.pexels.com/photos/57690/pexels-photo-57690.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940);
+}
+
 .from-pink-500 {
   --tw-gradient-from: #ec4899;
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(236 72 153 / 0));
@@ -2175,6 +2586,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(74 222 128 / 0));
 }
 
+.from-yellow-500 {
+  --tw-gradient-from: #eab308;
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(234 179 8 / 0));
+}
+
 .via-red-500 {
   --tw-gradient-stops: var(--tw-gradient-from), #ef4444, var(--tw-gradient-to, rgb(239 68 68 / 0));
 }
@@ -2187,27 +2603,39 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-gradient-to: #a855f7;
 }
 
+.to-transparent {
+  --tw-gradient-to: transparent;
+}
+
 .bg-cover {
   background-size: cover;
 }
 
+.bg-fixed {
+  background-attachment: fixed;
+}
+
 .bg-clip-text {
   -webkit-background-clip: text;
           background-clip: text;
 }
 
+.bg-center {
+  background-position: center;
+}
+
 .bg-no-repeat {
   background-repeat: no-repeat;
 }
 
-.fill-current {
-  fill: currentColor;
-}
-
 .fill-black {
   fill: #000;
 }
 
+.fill-current {
+  fill: currentColor;
+}
+
 .fill-green-600 {
   fill: #16a34a;
 }
@@ -2224,10 +2652,19 @@ Ensure the default browser behavior of the `hidden` attribute.
   fill: #1f2937;
 }
 
+.fill-white {
+  fill: #fff;
+}
+
 .stroke-gray-500 {
   stroke: #6b7280;
 }
 
+.object-contain {
+  -o-object-fit: contain;
+     object-fit: contain;
+}
+
 .object-cover {
   -o-object-fit: cover;
      object-fit: cover;
@@ -2250,14 +2687,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding: 1rem;
 }
 
-.p-2 {
-  padding: 0.5rem;
-}
-
 .p-1 {
   padding: 0.25rem;
 }
 
+.p-2 {
+  padding: 0.5rem;
+}
+
 .p-8 {
   padding: 2rem;
 }
@@ -2278,6 +2715,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding: 0px;
 }
 
+.p-80 {
+  padding: 20rem;
+}
+
+.p-28 {
+  padding: 7rem;
+}
+
 .px-4 {
   padding-left: 1rem;
   padding-right: 1rem;
@@ -2328,16 +2773,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-bottom: 1.5rem;
 }
 
-.py-3 {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
-}
-
-.px-12 {
-  padding-left: 3rem;
-  padding-right: 3rem;
-}
-
 .py-8 {
   padding-top: 2rem;
   padding-bottom: 2rem;
@@ -2363,19 +2798,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-bottom: 0.25rem;
 }
 
-.px-10 {
-  padding-left: 2.5rem;
-  padding-right: 2.5rem;
-}
-
-.px-1 {
-  padding-left: 0.25rem;
-  padding-right: 0.25rem;
-}
-
-.px-8 {
-  padding-left: 2rem;
-  padding-right: 2rem;
+.py-3 {
+  padding-top: 0.75rem;
+  padding-bottom: 0.75rem;
 }
 
 .px-20 {
@@ -2383,6 +2808,16 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-right: 5rem;
 }
 
+.px-10 {
+  padding-left: 2.5rem;
+  padding-right: 2.5rem;
+}
+
+.px-12 {
+  padding-left: 3rem;
+  padding-right: 3rem;
+}
+
 .py-32 {
   padding-top: 8rem;
   padding-bottom: 8rem;
@@ -2393,6 +2828,16 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-right: 0px;
 }
 
+.px-8 {
+  padding-left: 2rem;
+  padding-right: 2rem;
+}
+
+.px-1 {
+  padding-left: 0.25rem;
+  padding-right: 0.25rem;
+}
+
 .py-5 {
   padding-top: 1.25rem;
   padding-bottom: 1.25rem;
@@ -2403,6 +2848,36 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-bottom: 12rem;
 }
 
+.px-80 {
+  padding-left: 20rem;
+  padding-right: 20rem;
+}
+
+.px-40 {
+  padding-left: 10rem;
+  padding-right: 10rem;
+}
+
+.py-\[6px\] {
+  padding-top: 6px;
+  padding-bottom: 6px;
+}
+
+.px-7 {
+  padding-left: 1.75rem;
+  padding-right: 1.75rem;
+}
+
+.py-2\.5 {
+  padding-top: 0.625rem;
+  padding-bottom: 0.625rem;
+}
+
+.py-9 {
+  padding-top: 2.25rem;
+  padding-bottom: 2.25rem;
+}
+
 .pl-3 {
   padding-left: 0.75rem;
 }
@@ -2451,6 +2926,22 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-top: 2rem;
 }
 
+.pb-4 {
+  padding-bottom: 1rem;
+}
+
+.pb-2 {
+  padding-bottom: 0.5rem;
+}
+
+.pb-8 {
+  padding-bottom: 2rem;
+}
+
+.pb-3 {
+  padding-bottom: 0.75rem;
+}
+
 .pt-32 {
   padding-top: 8rem;
 }
@@ -2459,30 +2950,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-bottom: 3rem;
 }
 
-.pb-4 {
-  padding-bottom: 1rem;
-}
-
-.pr-12 {
-  padding-right: 3rem;
-}
-
 .pl-10 {
   padding-left: 2.5rem;
 }
 
-.pr-5 {
-  padding-right: 1.25rem;
-}
-
-.pr-10 {
-  padding-right: 2.5rem;
-}
-
-.pb-0 {
-  padding-bottom: 0px;
-}
-
 .pt-2 {
   padding-top: 0.5rem;
 }
@@ -2491,8 +2962,40 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-right: 0px;
 }
 
-.pb-8 {
-  padding-bottom: 2rem;
+.pr-12 {
+  padding-right: 3rem;
+}
+
+.pr-5 {
+  padding-right: 1.25rem;
+}
+
+.pr-10 {
+  padding-right: 2.5rem;
+}
+
+.pr-4 {
+  padding-right: 1rem;
+}
+
+.pl-24 {
+  padding-left: 6rem;
+}
+
+.pl-6 {
+  padding-left: 1.5rem;
+}
+
+.pl-2 {
+  padding-left: 0.5rem;
+}
+
+.pt-0\.5 {
+  padding-top: 0.125rem;
+}
+
+.pt-0 {
+  padding-top: 0px;
 }
 
 .pt-48 {
@@ -2503,10 +3006,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-left: 3rem;
 }
 
-.pl-2 {
-  padding-left: 0.5rem;
-}
-
 .pr-8 {
   padding-right: 2rem;
 }
@@ -2531,32 +3030,48 @@ Ensure the default browser behavior of the `hidden` attribute.
   padding-bottom: 14rem;
 }
 
-.pb-2 {
-  padding-bottom: 0.5rem;
+.pb-24 {
+  padding-bottom: 6rem;
 }
 
-.pb-3 {
-  padding-bottom: 0.75rem;
+.pb-5 {
+  padding-bottom: 1.25rem;
 }
 
-.pr-4 {
-  padding-right: 1rem;
+.pt-20 {
+  padding-top: 5rem;
 }
 
-.pl-24 {
-  padding-left: 6rem;
+.pr-6 {
+  padding-right: 1.5rem;
 }
 
-.pl-6 {
-  padding-left: 1.5rem;
+.pt-\[120px\] {
+  padding-top: 120px;
 }
 
-.pt-0\.5 {
-  padding-top: 0.125rem;
+.pb-\[110px\] {
+  padding-bottom: 110px;
 }
 
-.pt-0 {
-  padding-top: 0px;
+.pt-11 {
+  padding-top: 2.75rem;
+}
+
+.pt-80 {
+  padding-top: 20rem;
+}
+
+.pl-20 {
+  padding-left: 5rem;
+}
+
+.pb-7 {
+  padding-bottom: 1.75rem;
+}
+
+.pt-14 {
+  padding-top: 3.5rem;
 }
 
 .text-left {
@@ -2579,6 +3094,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
 }
 
+.font-serif {
+  font-family: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
+}
+
 .text-sm {
   font-size: 0.875rem;
   line-height: 1.25rem;
@@ -2609,16 +3128,21 @@ Ensure the default browser behavior of the `hidden` attribute.
   line-height: 1.75rem;
 }
 
-.text-4xl {
-  font-size: 2.25rem;
-  line-height: 2.5rem;
-}
-
 .text-3xl {
   font-size: 1.875rem;
   line-height: 2.25rem;
 }
 
+.text-7xl {
+  font-size: 4.5rem;
+  line-height: 1;
+}
+
+.text-4xl {
+  font-size: 2.25rem;
+  line-height: 2.5rem;
+}
+
 .text-5xl {
   font-size: 3rem;
   line-height: 1;
@@ -2629,11 +3153,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   line-height: 1;
 }
 
-.text-7xl {
-  font-size: 4.5rem;
-  line-height: 1;
-}
-
 .font-medium {
   font-weight: 500;
 }
@@ -2646,10 +3165,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   font-weight: 600;
 }
 
-.font-extrabold {
-  font-weight: 800;
-}
-
 .font-normal {
   font-weight: 400;
 }
@@ -2658,6 +3173,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   font-weight: 300;
 }
 
+.font-extrabold {
+  font-weight: 800;
+}
+
 .font-black {
   font-weight: 900;
 }
@@ -2674,6 +3193,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   text-transform: capitalize;
 }
 
+.italic {
+  font-style: italic;
+}
+
 .leading-normal {
   line-height: 1.5;
 }
@@ -2694,6 +3217,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   line-height: 1;
 }
 
+.leading-4 {
+  line-height: 1rem;
+}
+
+.leading-5 {
+  line-height: 1.25rem;
+}
+
 .leading-tight {
   line-height: 1.25;
 }
@@ -2702,22 +3233,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   line-height: 1.375;
 }
 
-.leading-10 {
-  line-height: 2.5rem;
-}
-
-.leading-5 {
-  line-height: 1.25rem;
-}
-
-.leading-4 {
-  line-height: 1rem;
-}
-
 .leading-6 {
   line-height: 1.5rem;
 }
 
+.leading-10 {
+  line-height: 2.5rem;
+}
+
 .tracking-wide {
   letter-spacing: 0.025em;
 }
@@ -2730,14 +3253,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   letter-spacing: 0.1em;
 }
 
-.tracking-tight {
-  letter-spacing: -0.025em;
-}
-
 .tracking-normal {
   letter-spacing: 0em;
 }
 
+.tracking-tight {
+  letter-spacing: -0.025em;
+}
+
 .text-blue-500 {
   --tw-text-opacity: 1;
   color: rgb(59 130 246 / var(--tw-text-opacity));
@@ -2773,6 +3296,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(209 213 219 / var(--tw-text-opacity));
 }
 
+.text-purple-400 {
+  --tw-text-opacity: 1;
+  color: rgb(192 132 252 / var(--tw-text-opacity));
+}
+
 .text-gray-800 {
   --tw-text-opacity: 1;
   color: rgb(31 41 55 / var(--tw-text-opacity));
@@ -2818,6 +3346,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(55 65 81 / var(--tw-text-opacity));
 }
 
+.text-blue-900 {
+  --tw-text-opacity: 1;
+  color: rgb(30 58 138 / var(--tw-text-opacity));
+}
+
 .text-purple-600 {
   --tw-text-opacity: 1;
   color: rgb(147 51 234 / var(--tw-text-opacity));
@@ -2828,21 +3361,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(167 139 250 / var(--tw-text-opacity));
 }
 
-.text-green-600 {
-  --tw-text-opacity: 1;
-  color: rgb(22 163 74 / var(--tw-text-opacity));
-}
-
-.text-blue-900 {
-  --tw-text-opacity: 1;
-  color: rgb(30 58 138 / var(--tw-text-opacity));
-}
-
-.text-purple-400 {
-  --tw-text-opacity: 1;
-  color: rgb(192 132 252 / var(--tw-text-opacity));
-}
-
 .text-yellow-500 {
   --tw-text-opacity: 1;
   color: rgb(234 179 8 / var(--tw-text-opacity));
@@ -2853,21 +3371,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(249 250 251 / var(--tw-text-opacity));
 }
 
-.text-purple-500 {
-  --tw-text-opacity: 1;
-  color: rgb(168 85 247 / var(--tw-text-opacity));
-}
-
-.text-indigo-500 {
-  --tw-text-opacity: 1;
-  color: rgb(99 102 241 / var(--tw-text-opacity));
-}
-
-.text-indigo-600 {
-  --tw-text-opacity: 1;
-  color: rgb(79 70 229 / var(--tw-text-opacity));
-}
-
 .text-gray-200 {
   --tw-text-opacity: 1;
   color: rgb(229 231 235 / var(--tw-text-opacity));
@@ -2878,28 +3381,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(0 0 0 / var(--tw-text-opacity));
 }
 
-.text-yellow-400 {
+.text-pink-400 {
   --tw-text-opacity: 1;
-  color: rgb(250 204 21 / var(--tw-text-opacity));
-}
-
-.text-blue-400 {
-  --tw-text-opacity: 1;
-  color: rgb(96 165 250 / var(--tw-text-opacity));
-}
-
-.text-blue-800 {
-  --tw-text-opacity: 1;
-  color: rgb(30 64 175 / var(--tw-text-opacity));
-}
-
-.text-transparent {
-  color: transparent;
-}
-
-.text-pink-500 {
-  --tw-text-opacity: 1;
-  color: rgb(236 72 153 / var(--tw-text-opacity));
+  color: rgb(244 114 182 / var(--tw-text-opacity));
 }
 
 .text-green-500 {
@@ -2907,26 +3391,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(34 197 94 / var(--tw-text-opacity));
 }
 
-.text-yellow-900 {
-  --tw-text-opacity: 1;
-  color: rgb(113 63 18 / var(--tw-text-opacity));
-}
-
-.text-teal-500 {
-  --tw-text-opacity: 1;
-  color: rgb(20 184 166 / var(--tw-text-opacity));
-}
-
-.text-green-400 {
-  --tw-text-opacity: 1;
-  color: rgb(74 222 128 / var(--tw-text-opacity));
-}
-
-.text-pink-400 {
-  --tw-text-opacity: 1;
-  color: rgb(244 114 182 / var(--tw-text-opacity));
-}
-
 .text-pink-700 {
   --tw-text-opacity: 1;
   color: rgb(190 24 93 / var(--tw-text-opacity));
@@ -2942,16 +3406,60 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(29 78 216 / var(--tw-text-opacity));
 }
 
+.text-blue-400 {
+  --tw-text-opacity: 1;
+  color: rgb(96 165 250 / var(--tw-text-opacity));
+}
+
 .text-green-700 {
   --tw-text-opacity: 1;
   color: rgb(21 128 61 / var(--tw-text-opacity));
 }
 
+.text-green-400 {
+  --tw-text-opacity: 1;
+  color: rgb(74 222 128 / var(--tw-text-opacity));
+}
+
 .text-red-400 {
   --tw-text-opacity: 1;
   color: rgb(248 113 113 / var(--tw-text-opacity));
 }
 
+.text-green-600 {
+  --tw-text-opacity: 1;
+  color: rgb(22 163 74 / var(--tw-text-opacity));
+}
+
+.text-blue-800 {
+  --tw-text-opacity: 1;
+  color: rgb(30 64 175 / var(--tw-text-opacity));
+}
+
+.text-transparent {
+  color: transparent;
+}
+
+.text-purple-500 {
+  --tw-text-opacity: 1;
+  color: rgb(168 85 247 / var(--tw-text-opacity));
+}
+
+.text-indigo-500 {
+  --tw-text-opacity: 1;
+  color: rgb(99 102 241 / var(--tw-text-opacity));
+}
+
+.text-indigo-600 {
+  --tw-text-opacity: 1;
+  color: rgb(79 70 229 / var(--tw-text-opacity));
+}
+
+.text-yellow-400 {
+  --tw-text-opacity: 1;
+  color: rgb(250 204 21 / var(--tw-text-opacity));
+}
+
 .text-cyan-800 {
   --tw-text-opacity: 1;
   color: rgb(21 94 117 / var(--tw-text-opacity));
@@ -2967,6 +3475,41 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(220 38 38 / var(--tw-text-opacity));
 }
 
+.text-pink-500 {
+  --tw-text-opacity: 1;
+  color: rgb(236 72 153 / var(--tw-text-opacity));
+}
+
+.text-yellow-900 {
+  --tw-text-opacity: 1;
+  color: rgb(113 63 18 / var(--tw-text-opacity));
+}
+
+.text-teal-500 {
+  --tw-text-opacity: 1;
+  color: rgb(20 184 166 / var(--tw-text-opacity));
+}
+
+.text-blue-600 {
+  --tw-text-opacity: 1;
+  color: rgb(37 99 235 / var(--tw-text-opacity));
+}
+
+.text-red-500 {
+  --tw-text-opacity: 1;
+  color: rgb(239 68 68 / var(--tw-text-opacity));
+}
+
+.text-indigo-800 {
+  --tw-text-opacity: 1;
+  color: rgb(55 48 163 / var(--tw-text-opacity));
+}
+
+.text-indigo-700 {
+  --tw-text-opacity: 1;
+  color: rgb(67 56 202 / var(--tw-text-opacity));
+}
+
 .underline {
   -webkit-text-decoration-line: underline;
           text-decoration-line: underline;
@@ -2982,21 +3525,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   -moz-osx-font-smoothing: grayscale;
 }
 
-.placeholder-gray-400::-moz-placeholder {
-  --tw-placeholder-opacity: 1;
-  color: rgb(156 163 175 / var(--tw-placeholder-opacity));
-}
-
-.placeholder-gray-400:-ms-input-placeholder {
-  --tw-placeholder-opacity: 1;
-  color: rgb(156 163 175 / var(--tw-placeholder-opacity));
-}
-
-.placeholder-gray-400::placeholder {
-  --tw-placeholder-opacity: 1;
-  color: rgb(156 163 175 / var(--tw-placeholder-opacity));
-}
-
 .placeholder-gray-50::-moz-placeholder {
   --tw-placeholder-opacity: 1;
   color: rgb(249 250 251 / var(--tw-placeholder-opacity));
@@ -3012,6 +3540,21 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(249 250 251 / var(--tw-placeholder-opacity));
 }
 
+.placeholder-gray-400::-moz-placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(156 163 175 / var(--tw-placeholder-opacity));
+}
+
+.placeholder-gray-400:-ms-input-placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(156 163 175 / var(--tw-placeholder-opacity));
+}
+
+.placeholder-gray-400::placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(156 163 175 / var(--tw-placeholder-opacity));
+}
+
 .placeholder-gray-800::-moz-placeholder {
   --tw-placeholder-opacity: 1;
   color: rgb(31 41 55 / var(--tw-placeholder-opacity));
@@ -3050,6 +3593,18 @@ Ensure the default browser behavior of the `hidden` attribute.
   opacity: 0.75;
 }
 
+.opacity-0 {
+  opacity: 0;
+}
+
+.opacity-100 {
+  opacity: 1;
+}
+
+.opacity-70 {
+  opacity: 0.7;
+}
+
 .shadow-sm {
   --tw-shadow: 0 1px 2px 0 rgb(0 0 0 / 0.05);
   --tw-shadow-colored: 0 1px 2px 0 var(--tw-shadow-color);
@@ -3074,18 +3629,18 @@ Ensure the default browser behavior of the `hidden` attribute.
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
-.shadow-2xl {
-  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
-  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-}
-
 .shadow-xl {
   --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.shadow-2xl {
+  --tw-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
+  --tw-shadow-colored: 0 25px 50px -12px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
 .shadow-inner {
   --tw-shadow: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
   --tw-shadow-colored: inset 0 2px 4px 0 var(--tw-shadow-color);
@@ -3102,21 +3657,37 @@ Ensure the default browser behavior of the `hidden` attribute.
   outline-offset: 2px;
 }
 
-.outline {
-  outline-style: solid;
-}
-
 .ring-2 {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
 
+.ring-1 {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(1px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+
 .ring-gray-800 {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(31 41 55 / var(--tw-ring-opacity));
 }
 
+.ring-black {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(0 0 0 / var(--tw-ring-opacity));
+}
+
+.ring-opacity-5 {
+  --tw-ring-opacity: 0.05;
+}
+
+.blur-xl {
+  --tw-blur: blur(24px);
+  filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
+}
+
 .filter {
   filter: var(--tw-blur) var(--tw-brightness) var(--tw-contrast) var(--tw-grayscale) var(--tw-hue-rotate) var(--tw-invert) var(--tw-saturate) var(--tw-sepia) var(--tw-drop-shadow);
 }
@@ -3143,6 +3714,12 @@ Ensure the default browser behavior of the `hidden` attribute.
   transition-duration: 150ms;
 }
 
+.transition-transform {
+  transition-property: transform;
+  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
+  transition-duration: 150ms;
+}
+
 .duration-300 {
   transition-duration: 300ms;
 }
@@ -3155,6 +3732,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   transition-duration: 700ms;
 }
 
+.duration-100 {
+  transition-duration: 100ms;
+}
+
 .duration-150 {
   transition-duration: 150ms;
 }
@@ -3163,10 +3744,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   transition-duration: 500ms;
 }
 
-.duration-100 {
-  transition-duration: 100ms;
-}
-
 .ease-in-out {
   transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
 }
@@ -3175,6 +3752,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   transition-timing-function: cubic-bezier(0, 0, 0.2, 1);
 }
 
+.ease-in {
+  transition-timing-function: cubic-bezier(0.4, 0, 1, 1);
+}
+
 .section_divider {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
@@ -3244,39 +3825,82 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-ring-opacity: 0.4;
 }
 
+.hover\:translate-x-1:hover {
+  --tw-translate-x: 0.25rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .hover\:translate-y-2:hover {
   --tw-translate-y: 0.5rem;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
-.hover\:translate-x-1:hover {
-  --tw-translate-x: 0.25rem;
+.hover\:scale-105:hover {
+  --tw-scale-x: 1.05;
+  --tw-scale-y: 1.05;
   transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
 }
 
+.hover\:rounded:hover {
+  border-radius: 0.25rem;
+}
+
+.hover\:rounded-none:hover {
+  border-radius: 0px;
+}
+
+.hover\:border:hover {
+  border-width: 1px;
+}
+
+.hover\:border-2:hover {
+  border-width: 2px;
+}
+
+.hover\:border-x-0:hover {
+  border-left-width: 0px;
+  border-right-width: 0px;
+}
+
+.hover\:border-b-2:hover {
+  border-bottom-width: 2px;
+}
+
+.hover\:border-t-0:hover {
+  border-top-width: 0px;
+}
+
+.hover\:border-l-0:hover {
+  border-left-width: 0px;
+}
+
+.hover\:border-none:hover {
+  border-style: none;
+}
+
 .hover\:border-green-700:hover {
   --tw-border-opacity: 1;
   border-color: rgb(21 128 61 / var(--tw-border-opacity));
 }
 
-.hover\:border-white:hover {
-  --tw-border-opacity: 1;
-  border-color: rgb(255 255 255 / var(--tw-border-opacity));
-}
-
 .hover\:border-blue-500:hover {
   --tw-border-opacity: 1;
   border-color: rgb(59 130 246 / var(--tw-border-opacity));
 }
 
-.hover\:bg-blue-700:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(29 78 216 / var(--tw-bg-opacity));
+.hover\:border-indigo-300:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(165 180 252 / var(--tw-border-opacity));
 }
 
-.hover\:bg-white:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+.hover\:border-indigo-800:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(55 48 163 / var(--tw-border-opacity));
+}
+
+.hover\:border-b-blue-300:hover {
+  --tw-border-opacity: 1;
+  border-bottom-color: rgb(147 197 253 / var(--tw-border-opacity));
 }
 
 .hover\:bg-gray-50:hover {
@@ -3299,11 +3923,41 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(79 70 229 / var(--tw-bg-opacity));
 }
 
+.hover\:bg-purple-700:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(126 34 206 / var(--tw-bg-opacity));
+}
+
 .hover\:bg-gray-200:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(229 231 235 / var(--tw-bg-opacity));
 }
 
+.hover\:bg-blue-700:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(29 78 216 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-white:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-blue-400:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(96 165 250 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-gray-800:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-blue-800:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(30 64 175 / var(--tw-bg-opacity));
+}
+
 .hover\:bg-purple-600:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(147 51 234 / var(--tw-bg-opacity));
@@ -3338,36 +3992,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(107 114 128 / var(--tw-bg-opacity));
 }
 
-.hover\:bg-blue-800:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(30 64 175 / var(--tw-bg-opacity));
-}
-
-.hover\:bg-yellow-400:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(250 204 21 / var(--tw-bg-opacity));
-}
-
-.hover\:bg-yellow-500:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(234 179 8 / var(--tw-bg-opacity));
-}
-
-.hover\:bg-purple-700:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(126 34 206 / var(--tw-bg-opacity));
-}
-
-.hover\:bg-blue-400:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(96 165 250 / var(--tw-bg-opacity));
-}
-
-.hover\:bg-gray-800:hover {
-  --tw-bg-opacity: 1;
-  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
-}
-
 .hover\:bg-gray-100:hover {
   --tw-bg-opacity: 1;
   background-color: rgb(243 244 246 / var(--tw-bg-opacity));
@@ -3398,9 +4022,72 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(192 132 252 / var(--tw-bg-opacity));
 }
 
-.hover\:text-purple-800:hover {
+.hover\:bg-yellow-400:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(250 204 21 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-yellow-500:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(234 179 8 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-indigo-800:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(55 48 163 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-green-800:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(22 101 52 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-cyan-800:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(21 94 117 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-cyan-600:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(8 145 178 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-orange-600:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(234 88 12 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-indigo-700:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(67 56 202 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-indigo-200:hover {
+  --tw-bg-opacity: 1;
+  background-color: rgb(199 210 254 / var(--tw-bg-opacity));
+}
+
+.hover\:bg-opacity-90:hover {
+  --tw-bg-opacity: 0.9;
+}
+
+.hover\:bg-opacity-100:hover {
+  --tw-bg-opacity: 1;
+}
+
+.hover\:text-purple-200:hover {
   --tw-text-opacity: 1;
-  color: rgb(107 33 168 / var(--tw-text-opacity));
+  color: rgb(233 213 255 / var(--tw-text-opacity));
+}
+
+.hover\:text-purple-400:hover {
+  --tw-text-opacity: 1;
+  color: rgb(192 132 252 / var(--tw-text-opacity));
+}
+
+.hover\:text-purple-300:hover {
+  --tw-text-opacity: 1;
+  color: rgb(216 180 254 / var(--tw-text-opacity));
 }
 
 .hover\:text-teal-400:hover {
@@ -3423,9 +4110,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(147 51 234 / var(--tw-text-opacity));
 }
 
-.hover\:text-red-500:hover {
+.hover\:text-purple-800:hover {
   --tw-text-opacity: 1;
-  color: rgb(239 68 68 / var(--tw-text-opacity));
+  color: rgb(107 33 168 / var(--tw-text-opacity));
 }
 
 .hover\:text-blue-700:hover {
@@ -3433,16 +4120,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(29 78 216 / var(--tw-text-opacity));
 }
 
-.hover\:text-purple-200:hover {
-  --tw-text-opacity: 1;
-  color: rgb(233 213 255 / var(--tw-text-opacity));
-}
-
-.hover\:text-purple-400:hover {
-  --tw-text-opacity: 1;
-  color: rgb(192 132 252 / var(--tw-text-opacity));
-}
-
 .hover\:text-gray-500:hover {
   --tw-text-opacity: 1;
   color: rgb(107 114 128 / var(--tw-text-opacity));
@@ -3453,6 +4130,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(31 41 55 / var(--tw-text-opacity));
 }
 
+.hover\:text-red-500:hover {
+  --tw-text-opacity: 1;
+  color: rgb(239 68 68 / var(--tw-text-opacity));
+}
+
 .hover\:text-blue-400:hover {
   --tw-text-opacity: 1;
   color: rgb(96 165 250 / var(--tw-text-opacity));
@@ -3463,41 +4145,21 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(244 114 182 / var(--tw-text-opacity));
 }
 
-.hover\:text-purple-500:hover {
-  --tw-text-opacity: 1;
-  color: rgb(168 85 247 / var(--tw-text-opacity));
-}
-
-.hover\:text-white:hover {
-  --tw-text-opacity: 1;
-  color: rgb(255 255 255 / var(--tw-text-opacity));
-}
-
-.hover\:text-gray-300:hover {
-  --tw-text-opacity: 1;
-  color: rgb(209 213 219 / var(--tw-text-opacity));
-}
-
 .hover\:text-indigo-600:hover {
   --tw-text-opacity: 1;
   color: rgb(79 70 229 / var(--tw-text-opacity));
 }
 
-.hover\:text-gray-600:hover {
-  --tw-text-opacity: 1;
-  color: rgb(75 85 99 / var(--tw-text-opacity));
-}
-
-.hover\:text-purple-300:hover {
-  --tw-text-opacity: 1;
-  color: rgb(216 180 254 / var(--tw-text-opacity));
-}
-
 .hover\:text-gray-400:hover {
   --tw-text-opacity: 1;
   color: rgb(156 163 175 / var(--tw-text-opacity));
 }
 
+.hover\:text-white:hover {
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+}
+
 .hover\:text-orange-500:hover {
   --tw-text-opacity: 1;
   color: rgb(249 115 22 / var(--tw-text-opacity));
@@ -3523,11 +4185,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(234 179 8 / var(--tw-text-opacity));
 }
 
-.hover\:text-red-400:hover {
-  --tw-text-opacity: 1;
-  color: rgb(248 113 113 / var(--tw-text-opacity));
-}
-
 .hover\:text-blue-500:hover {
   --tw-text-opacity: 1;
   color: rgb(59 130 246 / var(--tw-text-opacity));
@@ -3543,11 +4200,31 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(219 39 119 / var(--tw-text-opacity));
 }
 
+.hover\:text-red-400:hover {
+  --tw-text-opacity: 1;
+  color: rgb(248 113 113 / var(--tw-text-opacity));
+}
+
+.hover\:text-gray-300:hover {
+  --tw-text-opacity: 1;
+  color: rgb(209 213 219 / var(--tw-text-opacity));
+}
+
+.hover\:text-purple-500:hover {
+  --tw-text-opacity: 1;
+  color: rgb(168 85 247 / var(--tw-text-opacity));
+}
+
 .hover\:text-yellow-600:hover {
   --tw-text-opacity: 1;
   color: rgb(202 138 4 / var(--tw-text-opacity));
 }
 
+.hover\:text-gray-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(75 85 99 / var(--tw-text-opacity));
+}
+
 .hover\:text-gray-100:hover {
   --tw-text-opacity: 1;
   color: rgb(243 244 246 / var(--tw-text-opacity));
@@ -3558,6 +4235,26 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(37 99 235 / var(--tw-text-opacity));
 }
 
+.hover\:text-gray-50:hover {
+  --tw-text-opacity: 1;
+  color: rgb(249 250 251 / var(--tw-text-opacity));
+}
+
+.hover\:text-blue-300:hover {
+  --tw-text-opacity: 1;
+  color: rgb(147 197 253 / var(--tw-text-opacity));
+}
+
+.hover\:text-indigo-500:hover {
+  --tw-text-opacity: 1;
+  color: rgb(99 102 241 / var(--tw-text-opacity));
+}
+
+.hover\:text-indigo-700:hover {
+  --tw-text-opacity: 1;
+  color: rgb(67 56 202 / var(--tw-text-opacity));
+}
+
 .hover\:text-opacity-75:hover {
   --tw-text-opacity: 0.75;
 }
@@ -3577,6 +4274,12 @@ Ensure the default browser behavior of the `hidden` attribute.
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
+.hover\:shadow-md:hover {
+  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
+  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
+  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
+}
+
 .hover\:shadow-xl:hover {
   --tw-shadow: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
   --tw-shadow-colored: 0 20px 25px -5px var(--tw-shadow-color), 0 8px 10px -6px var(--tw-shadow-color);
@@ -3589,12 +4292,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
 }
 
-.hover\:shadow-md:hover {
-  --tw-shadow: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
-  --tw-shadow-colored: 0 4px 6px -1px var(--tw-shadow-color), 0 2px 4px -2px var(--tw-shadow-color);
-  box-shadow: var(--tw-ring-offset-shadow, 0 0 #0000), var(--tw-ring-shadow, 0 0 #0000), var(--tw-shadow);
-}
-
 .hover\:ring-2:hover {
   --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
   --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(2px + var(--tw-ring-offset-width)) var(--tw-ring-color);
@@ -3621,6 +4318,15 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(99 102 241 / var(--tw-border-opacity));
 }
 
+.focus\:border-gray-500:focus {
+  --tw-border-opacity: 1;
+  border-color: rgb(107 114 128 / var(--tw-border-opacity));
+}
+
+.focus\:border-transparent:focus {
+  border-color: transparent;
+}
+
 .focus\:border-purple-600:focus {
   --tw-border-opacity: 1;
   border-color: rgb(147 51 234 / var(--tw-border-opacity));
@@ -3641,15 +4347,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(202 138 4 / var(--tw-border-opacity));
 }
 
-.focus\:border-gray-500:focus {
-  --tw-border-opacity: 1;
-  border-color: rgb(107 114 128 / var(--tw-border-opacity));
-}
-
-.focus\:border-transparent:focus {
-  border-color: transparent;
-}
-
 .focus\:border-blue-400:focus {
   --tw-border-opacity: 1;
   border-color: rgb(96 165 250 / var(--tw-border-opacity));
@@ -3665,6 +4362,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(59 130 246 / var(--tw-border-opacity));
 }
 
+.focus\:border-blue-700:focus {
+  --tw-border-opacity: 1;
+  border-color: rgb(29 78 216 / var(--tw-border-opacity));
+}
+
 .focus\:bg-transparent:focus {
   background-color: transparent;
 }
@@ -3674,16 +4376,16 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(243 244 246 / var(--tw-bg-opacity));
 }
 
-.focus\:bg-purple-600:focus {
-  --tw-bg-opacity: 1;
-  background-color: rgb(147 51 234 / var(--tw-bg-opacity));
-}
-
 .focus\:bg-white:focus {
   --tw-bg-opacity: 1;
   background-color: rgb(255 255 255 / var(--tw-bg-opacity));
 }
 
+.focus\:bg-purple-600:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgb(147 51 234 / var(--tw-bg-opacity));
+}
+
 .focus\:bg-gray-300:focus {
   --tw-bg-opacity: 1;
   background-color: rgb(209 213 219 / var(--tw-bg-opacity));
@@ -3694,6 +4396,26 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(229 231 235 / var(--tw-bg-opacity));
 }
 
+.focus\:bg-blue-500:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
+}
+
+.focus\:bg-blue-400:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgb(96 165 250 / var(--tw-bg-opacity));
+}
+
+.focus\:bg-gray-600:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgb(75 85 99 / var(--tw-bg-opacity));
+}
+
+.focus\:bg-gray-800:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgb(31 41 55 / var(--tw-bg-opacity));
+}
+
 .focus\:text-white:focus {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
@@ -3749,6 +4471,16 @@ Ensure the default browser behavior of the `hidden` attribute.
   box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
 }
 
+.focus\:ring-0:focus {
+  --tw-ring-offset-shadow: var(--tw-ring-inset) 0 0 0 var(--tw-ring-offset-width) var(--tw-ring-offset-color);
+  --tw-ring-shadow: var(--tw-ring-inset) 0 0 0 calc(0px + var(--tw-ring-offset-width)) var(--tw-ring-color);
+  box-shadow: var(--tw-ring-offset-shadow), var(--tw-ring-shadow), var(--tw-shadow, 0 0 #0000);
+}
+
+.focus\:ring-inset:focus {
+  --tw-ring-inset: inset;
+}
+
 .focus\:ring-gray-300:focus {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(209 213 219 / var(--tw-ring-opacity));
@@ -3774,11 +4506,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-ring-color: rgb(168 85 247 / var(--tw-ring-opacity));
 }
 
-.focus\:ring-gray-500:focus {
-  --tw-ring-opacity: 1;
-  --tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity));
-}
-
 .focus\:ring-teal-400:focus {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(45 212 191 / var(--tw-ring-opacity));
@@ -3789,11 +4516,26 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-ring-color: rgb(31 41 55 / var(--tw-ring-opacity));
 }
 
+.focus\:ring-gray-500:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(107 114 128 / var(--tw-ring-opacity));
+}
+
 .focus\:ring-blue-500:focus {
   --tw-ring-opacity: 1;
   --tw-ring-color: rgb(59 130 246 / var(--tw-ring-opacity));
 }
 
+.focus\:ring-indigo-400:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(129 140 248 / var(--tw-ring-opacity));
+}
+
+.focus\:ring-indigo-500:focus {
+  --tw-ring-opacity: 1;
+  --tw-ring-color: rgb(99 102 241 / var(--tw-ring-opacity));
+}
+
 .focus\:ring-opacity-40:focus {
   --tw-ring-opacity: 0.4;
 }
@@ -3814,11 +4556,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-ring-offset-color: #e9d5ff;
 }
 
-.active\:bg-blue-500:active {
-  --tw-bg-opacity: 1;
-  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
-}
-
 .active\:bg-yellow-400:active {
   --tw-bg-opacity: 1;
   background-color: rgb(250 204 21 / var(--tw-bg-opacity));
@@ -3829,6 +4566,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(45 212 191 / var(--tw-bg-opacity));
 }
 
+.active\:bg-blue-500:active {
+  --tw-bg-opacity: 1;
+  background-color: rgb(59 130 246 / var(--tw-bg-opacity));
+}
+
 .active\:bg-teal-600:active {
   --tw-bg-opacity: 1;
   background-color: rgb(13 148 136 / var(--tw-bg-opacity));
@@ -3853,6 +4595,17 @@ Ensure the default browser behavior of the `hidden` attribute.
   display: block;
 }
 
+.group:hover .group-hover\:translate-x-6 {
+  --tw-translate-x: 1.5rem;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
+.group:hover .group-hover\:scale-110 {
+  --tw-scale-x: 1.1;
+  --tw-scale-y: 1.1;
+  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+}
+
 .group:hover .group-hover\:cursor-pointer {
   cursor: pointer;
 }
@@ -3875,6 +4628,21 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(168 85 247 / var(--tw-bg-opacity));
 }
 
+.group:hover .group-hover\:bg-green-200 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(187 247 208 / var(--tw-bg-opacity));
+}
+
+.group:hover .group-hover\:text-white {
+  --tw-text-opacity: 1;
+  color: rgb(255 255 255 / var(--tw-text-opacity));
+}
+
+.group:hover .group-hover\:text-gray-800 {
+  --tw-text-opacity: 1;
+  color: rgb(31 41 55 / var(--tw-text-opacity));
+}
+
 .dark .dark\:divide-gray-600 > :not([hidden]) ~ :not([hidden]) {
   --tw-divide-opacity: 1;
   border-color: rgb(75 85 99 / var(--tw-divide-opacity));
@@ -3892,6 +4660,24 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-radius: 0.25rem;
 }
 
+.dark .dark\:rounded-md {
+  border-radius: 0.375rem;
+}
+
+.dark .dark\:border-x-0 {
+  border-left-width: 0px;
+  border-right-width: 0px;
+}
+
+.dark .dark\:border-y-0 {
+  border-top-width: 0px;
+  border-bottom-width: 0px;
+}
+
+.dark .dark\:border-none {
+  border-style: none;
+}
+
 .dark .dark\:border-gray-400 {
   --tw-border-opacity: 1;
   border-color: rgb(156 163 175 / var(--tw-border-opacity));
@@ -3907,16 +4693,16 @@ Ensure the default browser behavior of the `hidden` attribute.
   border-color: rgb(75 85 99 / var(--tw-border-opacity));
 }
 
-.dark .dark\:border-gray-50 {
-  --tw-border-opacity: 1;
-  border-color: rgb(249 250 251 / var(--tw-border-opacity));
-}
-
 .dark .dark\:border-white {
   --tw-border-opacity: 1;
   border-color: rgb(255 255 255 / var(--tw-border-opacity));
 }
 
+.dark .dark\:border-gray-50 {
+  --tw-border-opacity: 1;
+  border-color: rgb(249 250 251 / var(--tw-border-opacity));
+}
+
 .dark .dark\:border-yellow-300 {
   --tw-border-opacity: 1;
   border-color: rgb(253 224 71 / var(--tw-border-opacity));
@@ -3936,11 +4722,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(31 41 55 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-violet-400 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(167 139 250 / var(--tw-bg-opacity));
-}
-
 .dark .dark\:bg-purple-800 {
   --tw-bg-opacity: 1;
   background-color: rgb(107 33 168 / var(--tw-bg-opacity));
@@ -3956,6 +4737,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(0 0 0 / var(--tw-bg-opacity));
 }
 
+.dark .dark\:bg-violet-400 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(167 139 250 / var(--tw-bg-opacity));
+}
+
 .dark .dark\:bg-indigo-400 {
   --tw-bg-opacity: 1;
   background-color: rgb(129 140 248 / var(--tw-bg-opacity));
@@ -3971,11 +4757,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(125 211 252 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-gray-400 {
-  --tw-bg-opacity: 1;
-  background-color: rgb(156 163 175 / var(--tw-bg-opacity));
-}
-
 .dark .dark\:bg-indigo-600 {
   --tw-bg-opacity: 1;
   background-color: rgb(79 70 229 / var(--tw-bg-opacity));
@@ -4001,6 +4782,16 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(103 232 249 / var(--tw-bg-opacity));
 }
 
+.dark .dark\:bg-emerald-400 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(52 211 153 / var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-blue-900 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(30 58 138 / var(--tw-bg-opacity));
+}
+
 .dark .dark\:bg-cyan-400 {
   --tw-bg-opacity: 1;
   background-color: rgb(34 211 238 / var(--tw-bg-opacity));
@@ -4016,29 +4807,44 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(37 99 235 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-cyan-500 {
+.dark .dark\:bg-gray-400 {
   --tw-bg-opacity: 1;
-  background-color: rgb(6 182 212 / var(--tw-bg-opacity));
+  background-color: rgb(156 163 175 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-emerald-400 {
+.dark .dark\:bg-gray-500 {
   --tw-bg-opacity: 1;
-  background-color: rgb(52 211 153 / var(--tw-bg-opacity));
+  background-color: rgb(107 114 128 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-blue-900 {
+.dark .dark\:bg-indigo-800 {
   --tw-bg-opacity: 1;
-  background-color: rgb(30 58 138 / var(--tw-bg-opacity));
+  background-color: rgb(55 48 163 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-gray-200 {
+.dark .dark\:bg-emerald-600 {
   --tw-bg-opacity: 1;
-  background-color: rgb(229 231 235 / var(--tw-bg-opacity));
+  background-color: rgb(5 150 105 / var(--tw-bg-opacity));
 }
 
-.dark .dark\:bg-gray-100 {
+.dark .dark\:bg-cyan-600 {
   --tw-bg-opacity: 1;
-  background-color: rgb(243 244 246 / var(--tw-bg-opacity));
+  background-color: rgb(8 145 178 / var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-emerald-50 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(236 253 245 / var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-emerald-500 {
+  --tw-bg-opacity: 1;
+  background-color: rgb(16 185 129 / var(--tw-bg-opacity));
+}
+
+.dark .dark\:bg-white {
+  --tw-bg-opacity: 1;
+  background-color: rgb(255 255 255 / var(--tw-bg-opacity));
 }
 
 .dark .dark\:bg-opacity-40 {
@@ -4049,6 +4855,15 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-image: linear-gradient(to right, var(--tw-gradient-stops));
 }
 
+.dark .dark\:bg-gradient-to-b {
+  background-image: linear-gradient(to bottom, var(--tw-gradient-stops));
+}
+
+.dark .dark\:from-black {
+  --tw-gradient-from: #000;
+  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(0 0 0 / 0));
+}
+
 .dark .dark\:from-emerald-800 {
   --tw-gradient-from: #065f46;
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(6 95 70 / 0));
@@ -4059,25 +4874,19 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(5 150 105 / 0));
 }
 
-.dark .dark\:from-black {
-  --tw-gradient-from: #000;
-  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(0 0 0 / 0));
-}
-
 .dark .dark\:from-cyan-300 {
   --tw-gradient-from: #67e8f9;
   --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(103 232 249 / 0));
 }
 
-.dark .dark\:from-slate-600 {
-  --tw-gradient-from: #475569;
-  --tw-gradient-stops: var(--tw-gradient-from), var(--tw-gradient-to, rgb(71 85 105 / 0));
-}
-
 .dark .dark\:via-emerald-500 {
   --tw-gradient-stops: var(--tw-gradient-from), #10b981, var(--tw-gradient-to, rgb(16 185 129 / 0));
 }
 
+.dark .dark\:to-green-800 {
+  --tw-gradient-to: #166534;
+}
+
 .dark .dark\:to-cyan-800 {
   --tw-gradient-to: #155e75;
 }
@@ -4086,22 +4895,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-gradient-to: #14b8a6;
 }
 
-.dark .dark\:to-green-800 {
-  --tw-gradient-to: #166534;
-}
-
 .dark .dark\:to-emerald-500 {
   --tw-gradient-to: #10b981;
 }
 
-.dark .dark\:to-slate-600 {
-  --tw-gradient-to: #475569;
-}
-
-.dark .dark\:to-red-300 {
-  --tw-gradient-to: #fca5a5;
-}
-
 .dark .dark\:fill-white {
   fill: #fff;
 }
@@ -4126,6 +4923,10 @@ Ensure the default browser behavior of the `hidden` attribute.
   stroke: #f87171;
 }
 
+.dark .dark\:stroke-white {
+  stroke: #fff;
+}
+
 .dark .dark\:p-1 {
   padding: 0.25rem;
 }
@@ -4143,14 +4944,9 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
-.dark .dark\:text-gray-50 {
+.dark .dark\:text-gray-300 {
   --tw-text-opacity: 1;
-  color: rgb(249 250 251 / var(--tw-text-opacity));
-}
-
-.dark .dark\:text-gray-900 {
-  --tw-text-opacity: 1;
-  color: rgb(17 24 39 / var(--tw-text-opacity));
+  color: rgb(209 213 219 / var(--tw-text-opacity));
 }
 
 .dark .dark\:text-purple-400 {
@@ -4158,6 +4954,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(192 132 252 / var(--tw-text-opacity));
 }
 
+.dark .dark\:text-gray-400 {
+  --tw-text-opacity: 1;
+  color: rgb(156 163 175 / var(--tw-text-opacity));
+}
+
 .dark .dark\:text-purple-300 {
   --tw-text-opacity: 1;
   color: rgb(216 180 254 / var(--tw-text-opacity));
@@ -4173,19 +4974,24 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(229 231 235 / var(--tw-text-opacity));
 }
 
-.dark .dark\:text-gray-300 {
-  --tw-text-opacity: 1;
-  color: rgb(209 213 219 / var(--tw-text-opacity));
-}
-
 .dark .dark\:text-purple-700 {
   --tw-text-opacity: 1;
   color: rgb(126 34 206 / var(--tw-text-opacity));
 }
 
-.dark .dark\:text-gray-400 {
+.dark .dark\:text-sky-400 {
   --tw-text-opacity: 1;
-  color: rgb(156 163 175 / var(--tw-text-opacity));
+  color: rgb(56 189 248 / var(--tw-text-opacity));
+}
+
+.dark .dark\:text-gray-50 {
+  --tw-text-opacity: 1;
+  color: rgb(249 250 251 / var(--tw-text-opacity));
+}
+
+.dark .dark\:text-gray-900 {
+  --tw-text-opacity: 1;
+  color: rgb(17 24 39 / var(--tw-text-opacity));
 }
 
 .dark .dark\:text-gray-100 {
@@ -4198,16 +5004,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(107 114 128 / var(--tw-text-opacity));
 }
 
-.dark .dark\:text-violet-400 {
-  --tw-text-opacity: 1;
-  color: rgb(167 139 250 / var(--tw-text-opacity));
-}
-
-.dark .dark\:text-sky-400 {
-  --tw-text-opacity: 1;
-  color: rgb(56 189 248 / var(--tw-text-opacity));
-}
-
 .dark .dark\:text-sky-300 {
   --tw-text-opacity: 1;
   color: rgb(125 211 252 / var(--tw-text-opacity));
@@ -4233,6 +5029,26 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(31 41 55 / var(--tw-text-opacity));
 }
 
+.dark .dark\:text-emerald-300 {
+  --tw-text-opacity: 1;
+  color: rgb(110 231 183 / var(--tw-text-opacity));
+}
+
+.dark .dark\:text-black {
+  --tw-text-opacity: 1;
+  color: rgb(0 0 0 / var(--tw-text-opacity));
+}
+
+.dark .dark\:text-cyan-400 {
+  --tw-text-opacity: 1;
+  color: rgb(34 211 238 / var(--tw-text-opacity));
+}
+
+.dark .dark\:text-violet-400 {
+  --tw-text-opacity: 1;
+  color: rgb(167 139 250 / var(--tw-text-opacity));
+}
+
 .dark .dark\:text-gray-700 {
   --tw-text-opacity: 1;
   color: rgb(55 65 81 / var(--tw-text-opacity));
@@ -4258,36 +5074,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(129 140 248 / var(--tw-text-opacity));
 }
 
-.dark .dark\:text-cyan-400 {
-  --tw-text-opacity: 1;
-  color: rgb(34 211 238 / var(--tw-text-opacity));
-}
-
 .dark .dark\:text-red-400 {
   --tw-text-opacity: 1;
   color: rgb(248 113 113 / var(--tw-text-opacity));
 }
 
-.dark .dark\:text-black {
-  --tw-text-opacity: 1;
-  color: rgb(0 0 0 / var(--tw-text-opacity));
-}
-
-.dark .dark\:text-emerald-300 {
-  --tw-text-opacity: 1;
-  color: rgb(110 231 183 / var(--tw-text-opacity));
-}
-
-.dark .dark\:text-cyan-200 {
-  --tw-text-opacity: 1;
-  color: rgb(165 243 252 / var(--tw-text-opacity));
-}
-
-.dark .dark\:text-gray-600 {
-  --tw-text-opacity: 1;
-  color: rgb(75 85 99 / var(--tw-text-opacity));
-}
-
 .dark .dark\:placeholder-white::-moz-placeholder {
   --tw-placeholder-opacity: 1;
   color: rgb(255 255 255 / var(--tw-placeholder-opacity));
@@ -4318,6 +5109,21 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(209 213 219 / var(--tw-placeholder-opacity));
 }
 
+.dark .dark\:placeholder-gray-500::-moz-placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(107 114 128 / var(--tw-placeholder-opacity));
+}
+
+.dark .dark\:placeholder-gray-500:-ms-input-placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(107 114 128 / var(--tw-placeholder-opacity));
+}
+
+.dark .dark\:placeholder-gray-500::placeholder {
+  --tw-placeholder-opacity: 1;
+  color: rgb(107 114 128 / var(--tw-placeholder-opacity));
+}
+
 .dark .dark\:opacity-20 {
   opacity: 0.2;
 }
@@ -4348,16 +5154,19 @@ Ensure the default browser behavior of the `hidden` attribute.
   --tw-ring-color: rgb(103 232 249 / var(--tw-ring-opacity));
 }
 
-.dark .dark\:transition {
-  transition-property: color, background-color, border-color, fill, stroke, opacity, box-shadow, transform, filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter;
-  transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, opacity, box-shadow, transform, filter, backdrop-filter, -webkit-text-decoration-color, -webkit-backdrop-filter;
-  transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-  transition-duration: 150ms;
+.dark .dark\:placeholder\:text-emerald-300::-moz-placeholder {
+  --tw-text-opacity: 1;
+  color: rgb(110 231 183 / var(--tw-text-opacity));
 }
 
-.dark .dark\:duration-300 {
-  transition-duration: 300ms;
+.dark .dark\:placeholder\:text-emerald-300:-ms-input-placeholder {
+  --tw-text-opacity: 1;
+  color: rgb(110 231 183 / var(--tw-text-opacity));
+}
+
+.dark .dark\:placeholder\:text-emerald-300::placeholder {
+  --tw-text-opacity: 1;
+  color: rgb(110 231 183 / var(--tw-text-opacity));
 }
 
 .dark .dark\:placeholder\:text-red-400::-moz-placeholder {
@@ -4375,57 +5184,66 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(248 113 113 / var(--tw-text-opacity));
 }
 
-.dark .dark\:placeholder\:text-gray-800::-moz-placeholder {
-  --tw-text-opacity: 1;
-  color: rgb(31 41 55 / var(--tw-text-opacity));
-}
-
-.dark .dark\:placeholder\:text-gray-800:-ms-input-placeholder {
-  --tw-text-opacity: 1;
-  color: rgb(31 41 55 / var(--tw-text-opacity));
-}
-
-.dark .dark\:placeholder\:text-gray-800::placeholder {
-  --tw-text-opacity: 1;
-  color: rgb(31 41 55 / var(--tw-text-opacity));
-}
-
-.dark .dark\:placeholder\:text-emerald-300::-moz-placeholder {
-  --tw-text-opacity: 1;
-  color: rgb(110 231 183 / var(--tw-text-opacity));
-}
-
-.dark .dark\:placeholder\:text-emerald-300:-ms-input-placeholder {
-  --tw-text-opacity: 1;
-  color: rgb(110 231 183 / var(--tw-text-opacity));
-}
-
-.dark .dark\:placeholder\:text-emerald-300::placeholder {
-  --tw-text-opacity: 1;
-  color: rgb(110 231 183 / var(--tw-text-opacity));
-}
-
 .dark .dark\:focus-within\:border-blue-300:focus-within {
   --tw-border-opacity: 1;
   border-color: rgb(147 197 253 / var(--tw-border-opacity));
 }
 
-.dark .dark\:hover\:translate-x-1:hover {
-  --tw-translate-x: 0.25rem;
-  transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+.dark .dark\:focus-within\:border-blue-400:focus-within {
+  --tw-border-opacity: 1;
+  border-color: rgb(96 165 250 / var(--tw-border-opacity));
 }
 
-.dark .dark\:hover\:border-b:hover {
-  border-bottom-width: 1px;
+.dark .dark\:hover\:rounded:hover {
+  border-radius: 0.25rem;
 }
 
-.dark .dark\:hover\:border-b-2:hover {
+.dark .dark\:hover\:border:hover {
+  border-width: 1px;
+}
+
+.dark .dark\:hover\:border-2:hover {
+  border-width: 2px;
+}
+
+.dark .dark\:hover\:border-x-2:hover {
+  border-left-width: 2px;
+  border-right-width: 2px;
+}
+
+.dark .dark\:hover\:border-y-2:hover {
+  border-top-width: 2px;
   border-bottom-width: 2px;
 }
 
-.dark .dark\:hover\:border-b-cyan-500:hover {
+.dark .hover\:dark\:border-gray-700:hover {
   --tw-border-opacity: 1;
-  border-bottom-color: rgb(6 182 212 / var(--tw-border-opacity));
+  border-color: rgb(55 65 81 / var(--tw-border-opacity));
+}
+
+.dark .dark\:hover\:border-gray-700:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(55 65 81 / var(--tw-border-opacity));
+}
+
+.dark .dark\:hover\:border-gray-800:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(31 41 55 / var(--tw-border-opacity));
+}
+
+.dark .dark\:hover\:border-red-800:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(153 27 27 / var(--tw-border-opacity));
+}
+
+.dark .dark\:hover\:border-red-300:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(252 165 165 / var(--tw-border-opacity));
+}
+
+.dark .dark\:hover\:border-gray-300:hover {
+  --tw-border-opacity: 1;
+  border-color: rgb(209 213 219 / var(--tw-border-opacity));
 }
 
 .dark .dark\:hover\:bg-gray-600:hover {
@@ -4458,28 +5276,18 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(55 65 81 / var(--tw-bg-opacity));
 }
 
+.dark .dark\:hover\:bg-transparent:hover {
+  background-color: transparent;
+}
+
+.dark .dark\:hover\:bg-none:hover {
+  background-image: none;
+}
+
 .dark .dark\:hover\:stroke-cyan-400:hover {
   stroke: #22d3ee;
 }
 
-.dark .dark\:hover\:p-2:hover {
-  padding: 0.5rem;
-}
-
-.dark .dark\:hover\:px-2:hover {
-  padding-left: 0.5rem;
-  padding-right: 0.5rem;
-}
-
-.dark .dark\:hover\:font-bold:hover {
-  font-weight: 700;
-}
-
-.dark .hover\:dark\:text-violet-400:hover {
-  --tw-text-opacity: 1;
-  color: rgb(167 139 250 / var(--tw-text-opacity));
-}
-
 .dark .dark\:hover\:text-purple-500:hover {
   --tw-text-opacity: 1;
   color: rgb(168 85 247 / var(--tw-text-opacity));
@@ -4500,6 +5308,16 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(107 33 168 / var(--tw-text-opacity));
 }
 
+.dark .dark\:hover\:text-sky-800:hover {
+  --tw-text-opacity: 1;
+  color: rgb(7 89 133 / var(--tw-text-opacity));
+}
+
+.dark .hover\:dark\:text-violet-400:hover {
+  --tw-text-opacity: 1;
+  color: rgb(167 139 250 / var(--tw-text-opacity));
+}
+
 .dark .dark\:hover\:text-gray-300:hover {
   --tw-text-opacity: 1;
   color: rgb(209 213 219 / var(--tw-text-opacity));
@@ -4510,11 +5328,6 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(255 255 255 / var(--tw-text-opacity));
 }
 
-.dark .dark\:hover\:text-sky-800:hover {
-  --tw-text-opacity: 1;
-  color: rgb(7 89 133 / var(--tw-text-opacity));
-}
-
 .dark .dark\:hover\:text-sky-300:hover {
   --tw-text-opacity: 1;
   color: rgb(125 211 252 / var(--tw-text-opacity));
@@ -4585,9 +5398,14 @@ Ensure the default browser behavior of the `hidden` attribute.
   color: rgb(8 145 178 / var(--tw-text-opacity));
 }
 
-.dark .dark\:hover\:underline:hover {
-  -webkit-text-decoration-line: underline;
-          text-decoration-line: underline;
+.dark .dark\:hover\:text-gray-50:hover {
+  --tw-text-opacity: 1;
+  color: rgb(249 250 251 / var(--tw-text-opacity));
+}
+
+.dark .dark\:hover\:text-gray-600:hover {
+  --tw-text-opacity: 1;
+  color: rgb(75 85 99 / var(--tw-text-opacity));
 }
 
 .dark .dark\:hover\:ring-2:hover {
@@ -4631,6 +5449,11 @@ Ensure the default browser behavior of the `hidden` attribute.
   background-color: rgb(17 24 39 / var(--tw-bg-opacity));
 }
 
+.dark .dark\:focus\:bg-gray-700:focus {
+  --tw-bg-opacity: 1;
+  background-color: rgb(55 65 81 / var(--tw-bg-opacity));
+}
+
 .dark .dark\:focus\:text-white:focus {
   --tw-text-opacity: 1;
   color: rgb(255 255 255 / var(--tw-text-opacity));
@@ -4683,14 +5506,19 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-right: 0px;
   }
 
+  .sm\:mx-6 {
+    margin-left: 1.5rem;
+    margin-right: 1.5rem;
+  }
+
   .sm\:my-5 {
     margin-top: 1.25rem;
     margin-bottom: 1.25rem;
   }
 
-  .sm\:mx-6 {
-    margin-left: 1.5rem;
-    margin-right: 1.5rem;
+  .sm\:mx-auto {
+    margin-left: auto;
+    margin-right: auto;
   }
 
   .sm\:mt-0 {
@@ -4705,12 +5533,20 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-left: auto;
   }
 
+  .sm\:mr-4 {
+    margin-right: 1rem;
+  }
+
   .sm\:ml-4 {
     margin-left: 1rem;
   }
 
-  .sm\:mr-4 {
-    margin-right: 1rem;
+  .sm\:ml-0 {
+    margin-left: 0px;
+  }
+
+  .sm\:mb-0 {
+    margin-bottom: 0px;
   }
 
   .sm\:-mr-20 {
@@ -4721,10 +5557,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-top: 1.5rem;
   }
 
-  .sm\:mb-0 {
-    margin-bottom: 0px;
-  }
-
   .sm\:mr-3 {
     margin-right: 0.75rem;
   }
@@ -4745,8 +5577,28 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-right: 2.5rem;
   }
 
-  .sm\:ml-0 {
-    margin-left: 0px;
+  .sm\:mb-12 {
+    margin-bottom: 3rem;
+  }
+
+  .sm\:mt-12 {
+    margin-top: 3rem;
+  }
+
+  .sm\:mt-5 {
+    margin-top: 1.25rem;
+  }
+
+  .sm\:mt-8 {
+    margin-top: 2rem;
+  }
+
+  .sm\:ml-3 {
+    margin-left: 0.75rem;
+  }
+
+  .sm\:ml-5 {
+    margin-left: 1.25rem;
   }
 
   .sm\:block {
@@ -4769,6 +5621,18 @@ Ensure the default browser behavior of the `hidden` attribute.
     height: 2.5rem;
   }
 
+  .sm\:h-80 {
+    height: 20rem;
+  }
+
+  .sm\:h-screen {
+    height: 100vh;
+  }
+
+  .sm\:h-72 {
+    height: 18rem;
+  }
+
   .sm\:w-10 {
     width: 2.5rem;
   }
@@ -4781,6 +5645,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 16rem;
   }
 
+  .sm\:w-1\/4 {
+    width: 25%;
+  }
+
+  .sm\:w-1\/2 {
+    width: 50%;
+  }
+
   .sm\:w-full {
     width: 100%;
   }
@@ -4793,10 +5665,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 66.666667%;
   }
 
-  .sm\:w-1\/2 {
-    width: 50%;
-  }
-
   .sm\:w-5\/6 {
     width: 83.333333%;
   }
@@ -4805,10 +5673,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 33.333333%;
   }
 
-  .sm\:w-1\/4 {
-    width: 25%;
-  }
-
   .sm\:max-w-xl {
     max-width: 36rem;
   }
@@ -4821,6 +5685,17 @@ Ensure the default browser behavior of the `hidden` attribute.
     flex-shrink: 0;
   }
 
+  .sm\:-translate-x-64 {
+    --tw-translate-x: -16rem;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }
+
+  .sm\:scale-125 {
+    --tw-scale-x: 1.25;
+    --tw-scale-y: 1.25;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
+  }
+
   .sm\:grid-cols-3 {
     grid-template-columns: repeat(3, minmax(0, 1fr));
   }
@@ -4883,6 +5758,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
   }
 
+  .sm\:rounded-xl {
+    border-radius: 0.75rem;
+  }
+
+  .sm\:rounded-full {
+    border-radius: 9999px;
+  }
+
   .sm\:border-none {
     border-style: none;
   }
@@ -4910,6 +5793,11 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-right: 2.5rem;
   }
 
+  .sm\:px-4 {
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+
   .sm\:px-8 {
     padding-left: 2rem;
     padding-right: 2rem;
@@ -4930,9 +5818,28 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-bottom: 8rem;
   }
 
-  .sm\:px-4 {
-    padding-left: 1rem;
-    padding-right: 1rem;
+  .sm\:px-12 {
+    padding-left: 3rem;
+    padding-right: 3rem;
+  }
+
+  .sm\:py-12 {
+    padding-top: 3rem;
+    padding-bottom: 3rem;
+  }
+
+  .sm\:py-5 {
+    padding-top: 1.25rem;
+    padding-bottom: 1.25rem;
+  }
+
+  .sm\:py-20 {
+    padding-top: 5rem;
+    padding-bottom: 5rem;
+  }
+
+  .sm\:pt-12 {
+    padding-top: 3rem;
   }
 
   .sm\:pl-0 {
@@ -4955,8 +5862,16 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-right: 2.5rem;
   }
 
-  .sm\:pt-12 {
-    padding-top: 3rem;
+  .sm\:pt-0 {
+    padding-top: 0px;
+  }
+
+  .sm\:pb-16 {
+    padding-bottom: 4rem;
+  }
+
+  .sm\:pb-14 {
+    padding-bottom: 3.5rem;
   }
 
   .sm\:text-left {
@@ -4977,6 +5892,11 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 2.25rem;
   }
 
+  .sm\:text-5xl {
+    font-size: 3rem;
+    line-height: 1;
+  }
+
   .sm\:text-4xl {
     font-size: 2.25rem;
     line-height: 2.5rem;
@@ -4987,11 +5907,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 1.5rem;
   }
 
-  .sm\:text-5xl {
-    font-size: 3rem;
-    line-height: 1;
-  }
-
   .sm\:text-sm {
     font-size: 0.875rem;
     line-height: 1.25rem;
@@ -5002,6 +5917,15 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 1.75rem;
   }
 
+  .sm\:text-\[42px\] {
+    font-size: 42px;
+  }
+
+  .sm\:text-8xl {
+    font-size: 6rem;
+    line-height: 1;
+  }
+
   .sm\:leading-none {
     line-height: 1;
   }
@@ -5020,6 +5944,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     position: relative;
   }
 
+  .md\:bottom-10 {
+    bottom: 2.5rem;
+  }
+
   .md\:order-1 {
     order: 1;
   }
@@ -5048,20 +5976,23 @@ Ensure the default browser behavior of the `hidden` attribute.
     grid-column: span 4 / span 4;
   }
 
+  .md\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }
+
   .md\:m-0 {
     margin: 0px;
   }
 
+  .md\:m-6 {
+    margin: 1.5rem;
+  }
+
   .md\:mx-0 {
     margin-left: 0px;
     margin-right: 0px;
   }
 
-  .md\:my-0 {
-    margin-top: 0px;
-    margin-bottom: 0px;
-  }
-
   .md\:-mx-8 {
     margin-left: -2rem;
     margin-right: -2rem;
@@ -5082,6 +6013,11 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-right: 1rem;
   }
 
+  .md\:my-0 {
+    margin-top: 0px;
+    margin-bottom: 0px;
+  }
+
   .md\:mx-2 {
     margin-left: 0.5rem;
     margin-right: 0.5rem;
@@ -5097,6 +6033,11 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-right: 0.25rem;
   }
 
+  .md\:mx-12 {
+    margin-left: 3rem;
+    margin-right: 3rem;
+  }
+
   .md\:mr-2 {
     margin-right: 0.5rem;
   }
@@ -5121,14 +6062,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-bottom: 6rem;
   }
 
-  .md\:mr-8 {
-    margin-right: 2rem;
-  }
-
-  .md\:mt-10 {
-    margin-top: 2.5rem;
-  }
-
   .md\:mb-4 {
     margin-bottom: 1rem;
   }
@@ -5137,24 +6070,12 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-bottom: 2rem;
   }
 
-  .md\:ml-12 {
-    margin-left: 3rem;
+  .md\:mr-8 {
+    margin-right: 2rem;
   }
 
-  .md\:mr-3 {
-    margin-right: 0.75rem;
-  }
-
-  .md\:-mr-4 {
-    margin-right: -1rem;
-  }
-
-  .md\:-ml-4 {
-    margin-left: -1rem;
-  }
-
-  .md\:mr-10 {
-    margin-right: 2.5rem;
+  .md\:mt-10 {
+    margin-top: 2.5rem;
   }
 
   .md\:-ml-5 {
@@ -5177,10 +6098,62 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-right: 0px;
   }
 
+  .md\:ml-12 {
+    margin-left: 3rem;
+  }
+
+  .md\:mr-3 {
+    margin-right: 0.75rem;
+  }
+
+  .md\:-mr-4 {
+    margin-right: -1rem;
+  }
+
+  .md\:-ml-4 {
+    margin-left: -1rem;
+  }
+
+  .md\:mr-10 {
+    margin-right: 2.5rem;
+  }
+
+  .md\:ml-0 {
+    margin-left: 0px;
+  }
+
+  .md\:mt-4 {
+    margin-top: 1rem;
+  }
+
+  .md\:mt-8 {
+    margin-top: 2rem;
+  }
+
+  .md\:ml-10 {
+    margin-left: 2.5rem;
+  }
+
+  .md\:mt-16 {
+    margin-top: 4rem;
+  }
+
+  .md\:mt-5 {
+    margin-top: 1.25rem;
+  }
+
+  .md\:ml-7 {
+    margin-left: 1.75rem;
+  }
+
   .md\:block {
     display: block;
   }
 
+  .md\:inline {
+    display: inline;
+  }
+
   .md\:flex {
     display: flex;
   }
@@ -5193,26 +6166,34 @@ Ensure the default browser behavior of the `hidden` attribute.
     display: none;
   }
 
-  .md\:h-10 {
-    height: 2.5rem;
+  .md\:h-auto {
+    height: auto;
   }
 
   .md\:h-full {
     height: 100%;
   }
 
-  .md\:h-24 {
-    height: 6rem;
-  }
-
-  .md\:h-auto {
-    height: auto;
+  .md\:h-10 {
+    height: 2.5rem;
   }
 
   .md\:h-5 {
     height: 1.25rem;
   }
 
+  .md\:h-24 {
+    height: 6rem;
+  }
+
+  .md\:h-96 {
+    height: 24rem;
+  }
+
+  .md\:h-6 {
+    height: 1.5rem;
+  }
+
   .md\:w-1\/4 {
     width: 25%;
   }
@@ -5233,36 +6214,20 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 33.333333%;
   }
 
-  .md\:w-3\/6 {
-    width: 50%;
-  }
-
-  .md\:w-10 {
-    width: 2.5rem;
+  .md\:w-8 {
+    width: 2rem;
   }
 
   .md\:w-2\/3 {
     width: 66.666667%;
   }
 
-  .md\:w-full {
-    width: 100%;
-  }
-
-  .md\:w-11\/12 {
-    width: 91.666667%;
-  }
-
-  .md\:w-10\/12 {
-    width: 83.333333%;
-  }
-
   .md\:w-1\/3 {
     width: 33.333333%;
   }
 
-  .md\:w-8 {
-    width: 2rem;
+  .md\:w-full {
+    width: 100%;
   }
 
   .md\:w-5\/12 {
@@ -5273,6 +6238,30 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 16.666667%;
   }
 
+  .md\:w-11\/12 {
+    width: 91.666667%;
+  }
+
+  .md\:w-10\/12 {
+    width: 83.333333%;
+  }
+
+  .md\:w-3\/6 {
+    width: 50%;
+  }
+
+  .md\:w-10 {
+    width: 2.5rem;
+  }
+
+  .md\:w-32 {
+    width: 8rem;
+  }
+
+  .md\:w-7\/12 {
+    width: 58.333333%;
+  }
+
   .md\:max-w-full {
     max-width: 100%;
   }
@@ -5281,6 +6270,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     max-width: 28rem;
   }
 
+  .md\:max-w-screen-lg {
+    max-width: 1024px;
+  }
+
   .md\:max-w-lg {
     max-width: 32rem;
   }
@@ -5289,16 +6282,23 @@ Ensure the default browser behavior of the `hidden` attribute.
     max-width: 24rem;
   }
 
+  .md\:max-w-3xl {
+    max-width: 48rem;
+  }
+
   .md\:max-w-6xl {
     max-width: 72rem;
   }
 
-  .md\:max-w-screen-lg {
-    max-width: 1024px;
+  .md\:-translate-x-24 {
+    --tw-translate-x: -6rem;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }
 
-  .md\:max-w-3xl {
-    max-width: 48rem;
+  .md\:scale-125 {
+    --tw-scale-x: 1.25;
+    --tw-scale-y: 1.25;
+    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
   }
 
   .md\:grid-cols-4 {
@@ -5313,18 +6313,30 @@ Ensure the default browser behavior of the `hidden` attribute.
     grid-template-columns: repeat(5, minmax(0, 1fr));
   }
 
-  .md\:grid-cols-2 {
-    grid-template-columns: repeat(2, minmax(0, 1fr));
-  }
-
   .md\:grid-cols-9 {
     grid-template-columns: repeat(9, minmax(0, 1fr));
   }
 
+  .md\:grid-cols-2 {
+    grid-template-columns: repeat(2, minmax(0, 1fr));
+  }
+
+  .md\:grid-cols-6 {
+    grid-template-columns: repeat(6, minmax(0, 1fr));
+  }
+
+  .md\:grid-cols-12 {
+    grid-template-columns: repeat(12, minmax(0, 1fr));
+  }
+
   .md\:flex-row {
     flex-direction: row;
   }
 
+  .md\:flex-col {
+    flex-direction: column;
+  }
+
   .md\:flex-nowrap {
     flex-wrap: nowrap;
   }
@@ -5369,12 +6381,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-left: calc(1.5rem * calc(1 - var(--tw-space-x-reverse)));
   }
 
-  .md\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
-    --tw-space-x-reverse: 0;
-    margin-right: calc(0.5rem * var(--tw-space-x-reverse));
-    margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
-  }
-
   .md\:space-x-3 > :not([hidden]) ~ :not([hidden]) {
     --tw-space-x-reverse: 0;
     margin-right: calc(0.75rem * var(--tw-space-x-reverse));
@@ -5387,6 +6393,12 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-bottom: calc(0px * var(--tw-space-y-reverse));
   }
 
+  .md\:space-x-2 > :not([hidden]) ~ :not([hidden]) {
+    --tw-space-x-reverse: 0;
+    margin-right: calc(0.5rem * var(--tw-space-x-reverse));
+    margin-left: calc(0.5rem * calc(1 - var(--tw-space-x-reverse)));
+  }
+
   .md\:space-x-8 > :not([hidden]) ~ :not([hidden]) {
     --tw-space-x-reverse: 0;
     margin-right: calc(2rem * var(--tw-space-x-reverse));
@@ -5399,6 +6411,12 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
   }
 
+  .md\:space-y-3 > :not([hidden]) ~ :not([hidden]) {
+    --tw-space-y-reverse: 0;
+    margin-top: calc(0.75rem * calc(1 - var(--tw-space-y-reverse)));
+    margin-bottom: calc(0.75rem * var(--tw-space-y-reverse));
+  }
+
   .md\:divide-x-2 > :not([hidden]) ~ :not([hidden]) {
     --tw-divide-x-reverse: 0;
     border-right-width: calc(2px * var(--tw-divide-x-reverse));
@@ -5447,6 +6465,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     border-left-width: 1px;
   }
 
+  .md\:border-t {
+    border-top-width: 1px;
+  }
+
   .md\:border-l-0 {
     border-left-width: 0px;
   }
@@ -5455,10 +6477,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     border-right-width: 0px;
   }
 
-  .md\:border-t {
-    border-top-width: 1px;
-  }
-
   .md\:border-solid {
     border-style: solid;
   }
@@ -5479,11 +6497,40 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding: 0px;
   }
 
+  .md\:p-6 {
+    padding: 1.5rem;
+  }
+
   .md\:px-24 {
     padding-left: 6rem;
     padding-right: 6rem;
   }
 
+  .md\:px-8 {
+    padding-left: 2rem;
+    padding-right: 2rem;
+  }
+
+  .md\:py-0 {
+    padding-top: 0px;
+    padding-bottom: 0px;
+  }
+
+  .md\:px-4 {
+    padding-left: 1rem;
+    padding-right: 1rem;
+  }
+
+  .md\:py-3 {
+    padding-top: 0.75rem;
+    padding-bottom: 0.75rem;
+  }
+
+  .md\:py-32 {
+    padding-top: 8rem;
+    padding-bottom: 8rem;
+  }
+
   .md\:px-10 {
     padding-left: 2.5rem;
     padding-right: 2.5rem;
@@ -5494,24 +6541,19 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-bottom: 1rem;
   }
 
-  .md\:px-8 {
-    padding-left: 2rem;
-    padding-right: 2rem;
-  }
-
   .md\:px-0 {
     padding-left: 0px;
     padding-right: 0px;
   }
 
-  .md\:py-32 {
-    padding-top: 8rem;
-    padding-bottom: 8rem;
+  .md\:px-20 {
+    padding-left: 5rem;
+    padding-right: 5rem;
   }
 
-  .md\:py-0 {
-    padding-top: 0px;
-    padding-bottom: 0px;
+  .md\:px-2 {
+    padding-left: 0.5rem;
+    padding-right: 0.5rem;
   }
 
   .md\:px-5 {
@@ -5529,24 +6571,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-bottom: 10rem;
   }
 
-  .md\:px-4 {
-    padding-left: 1rem;
-    padding-right: 1rem;
+  .md\:px-16 {
+    padding-left: 4rem;
+    padding-right: 4rem;
   }
 
-  .md\:py-3 {
-    padding-top: 0.75rem;
-    padding-bottom: 0.75rem;
-  }
-
-  .md\:px-20 {
-    padding-left: 5rem;
-    padding-right: 5rem;
-  }
-
-  .md\:px-2 {
-    padding-left: 0.5rem;
-    padding-right: 0.5rem;
+  .md\:py-12 {
+    padding-top: 3rem;
+    padding-bottom: 3rem;
   }
 
   .md\:pl-20 {
@@ -5565,22 +6597,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-bottom: 3rem;
   }
 
-  .md\:pl-16 {
-    padding-left: 4rem;
-  }
-
-  .md\:pr-10 {
-    padding-right: 2.5rem;
-  }
-
-  .md\:pt-40 {
-    padding-top: 10rem;
-  }
-
-  .md\:pb-64 {
-    padding-bottom: 16rem;
-  }
-
   .md\:pt-0 {
     padding-top: 0px;
   }
@@ -5601,6 +6617,38 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-bottom: 1.5rem;
   }
 
+  .md\:pl-16 {
+    padding-left: 4rem;
+  }
+
+  .md\:pr-10 {
+    padding-right: 2.5rem;
+  }
+
+  .md\:pt-40 {
+    padding-top: 10rem;
+  }
+
+  .md\:pb-64 {
+    padding-bottom: 16rem;
+  }
+
+  .md\:pr-16 {
+    padding-right: 4rem;
+  }
+
+  .md\:pl-8 {
+    padding-left: 2rem;
+  }
+
+  .md\:pb-20 {
+    padding-bottom: 5rem;
+  }
+
+  .md\:pr-4 {
+    padding-right: 1rem;
+  }
+
   .md\:text-left {
     text-align: left;
   }
@@ -5618,9 +6666,9 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 1;
   }
 
-  .md\:text-lg {
-    font-size: 1.125rem;
-    line-height: 1.75rem;
+  .md\:text-base {
+    font-size: 1rem;
+    line-height: 1.5rem;
   }
 
   .md\:text-4xl {
@@ -5628,19 +6676,19 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 2.5rem;
   }
 
-  .md\:text-6xl {
-    font-size: 3.75rem;
-    line-height: 1;
-  }
-
   .md\:text-xl {
     font-size: 1.25rem;
     line-height: 1.75rem;
   }
 
-  .md\:text-base {
-    font-size: 1rem;
-    line-height: 1.5rem;
+  .md\:text-lg {
+    font-size: 1.125rem;
+    line-height: 1.75rem;
+  }
+
+  .md\:text-6xl {
+    font-size: 3.75rem;
+    line-height: 1;
   }
 
   .md\:text-sm {
@@ -5648,6 +6696,16 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 1.25rem;
   }
 
+  .md\:text-9xl {
+    font-size: 8rem;
+    line-height: 1;
+  }
+
+  .md\:text-7xl {
+    font-size: 4.5rem;
+    line-height: 1;
+  }
+
   .md\:font-medium {
     font-weight: 500;
   }
@@ -5656,14 +6714,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 1.375;
   }
 
-  .md\:leading-tight {
-    line-height: 1.25;
-  }
-
   .md\:leading-none {
     line-height: 1;
   }
 
+  .md\:leading-tight {
+    line-height: 1.25;
+  }
+
   .md\:tracking-tight {
     letter-spacing: -0.025em;
   }
@@ -5703,6 +6761,10 @@ Ensure the default browser behavior of the `hidden` attribute.
 }
 
 @media (min-width: 1024px) {
+  .lg\:static {
+    position: static;
+  }
+
   .lg\:absolute {
     position: absolute;
   }
@@ -5711,10 +6773,19 @@ Ensure the default browser behavior of the `hidden` attribute.
     position: relative;
   }
 
+  .lg\:inset-y-0 {
+    top: 0px;
+    bottom: 0px;
+  }
+
   .lg\:left-1\/2 {
     left: 50%;
   }
 
+  .lg\:right-0 {
+    right: 0px;
+  }
+
   .lg\:order-last {
     order: 9999;
   }
@@ -5739,6 +6810,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     grid-column: span 5 / span 5;
   }
 
+  .lg\:col-span-1 {
+    grid-column: span 1 / span 1;
+  }
+
   .lg\:col-start-1 {
     grid-column-start: 1;
   }
@@ -5767,6 +6842,21 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-right: -0.5rem;
   }
 
+  .lg\:mx-6 {
+    margin-left: 1.5rem;
+    margin-right: 1.5rem;
+  }
+
+  .lg\:my-0 {
+    margin-top: 0px;
+    margin-bottom: 0px;
+  }
+
+  .lg\:-mx-6 {
+    margin-left: -1.5rem;
+    margin-right: -1.5rem;
+  }
+
   .lg\:mt-0 {
     margin-top: 0px;
   }
@@ -5799,10 +6889,18 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-left: 2rem;
   }
 
+  .lg\:mb-16 {
+    margin-bottom: 4rem;
+  }
+
   .lg\:mr-12 {
     margin-right: 3rem;
   }
 
+  .lg\:ml-0 {
+    margin-left: 0px;
+  }
+
   .lg\:mr-8 {
     margin-right: 2rem;
   }
@@ -5823,22 +6921,30 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-top: 2.5rem;
   }
 
-  .lg\:mb-16 {
-    margin-bottom: 4rem;
+  .lg\:-mt-40 {
+    margin-top: -10rem;
   }
 
-  .lg\:ml-0 {
-    margin-left: 0px;
+  .lg\:ml-4 {
+    margin-left: 1rem;
+  }
+
+  .lg\:ml-12 {
+    margin-left: 3rem;
+  }
+
+  .lg\:ml-20 {
+    margin-left: 5rem;
+  }
+
+  .lg\:mt-5 {
+    margin-top: 1.25rem;
   }
 
   .lg\:block {
     display: block;
   }
 
-  .lg\:inline-block {
-    display: inline-block;
-  }
-
   .lg\:inline {
     display: inline;
   }
@@ -5847,6 +6953,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     display: flex;
   }
 
+  .lg\:inline-flex {
+    display: inline-flex;
+  }
+
   .lg\:grid {
     display: grid;
   }
@@ -5863,6 +6973,18 @@ Ensure the default browser behavior of the `hidden` attribute.
     height: 100%;
   }
 
+  .lg\:h-96 {
+    height: 24rem;
+  }
+
+  .lg\:h-\[32rem\] {
+    height: 32rem;
+  }
+
+  .lg\:h-1\/3 {
+    height: 33.333333%;
+  }
+
   .lg\:w-1\/4 {
     width: 25%;
   }
@@ -5891,10 +7013,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 33.333333%;
   }
 
-  .lg\:w-2\/6 {
-    width: 33.333333%;
-  }
-
   .lg\:w-1\/2 {
     width: 50%;
   }
@@ -5903,12 +7021,8 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 66.666667%;
   }
 
-  .lg\:w-screen {
-    width: 100vw;
-  }
-
-  .lg\:w-3\/4 {
-    width: 75%;
+  .lg\:w-2\/6 {
+    width: 33.333333%;
   }
 
   .lg\:w-2\/5 {
@@ -5923,6 +7037,30 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 14rem;
   }
 
+  .lg\:w-screen {
+    width: 100vw;
+  }
+
+  .lg\:w-3\/4 {
+    width: 75%;
+  }
+
+  .lg\:w-full {
+    width: 100%;
+  }
+
+  .lg\:w-5\/12 {
+    width: 41.666667%;
+  }
+
+  .lg\:w-1\/12 {
+    width: 8.333333%;
+  }
+
+  .lg\:w-11\/12 {
+    width: 91.666667%;
+  }
+
   .lg\:max-w-screen-xl {
     max-width: 1280px;
   }
@@ -5951,6 +7089,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     max-width: 64rem;
   }
 
+  .lg\:max-w-md {
+    max-width: 28rem;
+  }
+
+  .lg\:max-w-lg {
+    max-width: 32rem;
+  }
+
   .lg\:flex-1 {
     flex: 1 1 0%;
   }
@@ -5959,6 +7105,10 @@ Ensure the default browser behavior of the `hidden` attribute.
     flex-grow: 1;
   }
 
+  .lg\:flex-grow-0 {
+    flex-grow: 0;
+  }
+
   .lg\:-translate-x-1\/2 {
     --tw-translate-x: -50%;
     transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
@@ -5988,14 +7138,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     grid-template-columns: repeat(5, minmax(0, 1fr));
   }
 
-  .lg\:grid-cols-3 {
-    grid-template-columns: repeat(3, minmax(0, 1fr));
-  }
-
   .lg\:grid-cols-8 {
     grid-template-columns: repeat(8, minmax(0, 1fr));
   }
 
+  .lg\:grid-cols-3 {
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+  }
+
   .lg\:flex-row {
     flex-direction: row;
   }
@@ -6056,6 +7206,12 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-left: calc(4rem * calc(1 - var(--tw-space-x-reverse)));
   }
 
+  .lg\:space-x-5 > :not([hidden]) ~ :not([hidden]) {
+    --tw-space-x-reverse: 0;
+    margin-right: calc(1.25rem * var(--tw-space-x-reverse));
+    margin-left: calc(1.25rem * calc(1 - var(--tw-space-x-reverse)));
+  }
+
   .lg\:border-transparent {
     border-color: transparent;
   }
@@ -6078,6 +7234,11 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-right: 2rem;
   }
 
+  .lg\:px-12 {
+    padding-left: 3rem;
+    padding-right: 3rem;
+  }
+
   .lg\:px-20 {
     padding-left: 5rem;
     padding-right: 5rem;
@@ -6093,26 +7254,6 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-right: 8rem;
   }
 
-  .lg\:py-24 {
-    padding-top: 6rem;
-    padding-bottom: 6rem;
-  }
-
-  .lg\:px-6 {
-    padding-left: 1.5rem;
-    padding-right: 1.5rem;
-  }
-
-  .lg\:px-5 {
-    padding-left: 1.25rem;
-    padding-right: 1.25rem;
-  }
-
-  .lg\:px-12 {
-    padding-left: 3rem;
-    padding-right: 3rem;
-  }
-
   .lg\:py-8 {
     padding-top: 2rem;
     padding-bottom: 2rem;
@@ -6128,6 +7269,46 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-right: 10rem;
   }
 
+  .lg\:py-24 {
+    padding-top: 6rem;
+    padding-bottom: 6rem;
+  }
+
+  .lg\:px-6 {
+    padding-left: 1.5rem;
+    padding-right: 1.5rem;
+  }
+
+  .lg\:px-5 {
+    padding-left: 1.25rem;
+    padding-right: 1.25rem;
+  }
+
+  .lg\:py-16 {
+    padding-top: 4rem;
+    padding-bottom: 4rem;
+  }
+
+  .lg\:px-0 {
+    padding-left: 0px;
+    padding-right: 0px;
+  }
+
+  .lg\:py-32 {
+    padding-top: 8rem;
+    padding-bottom: 8rem;
+  }
+
+  .lg\:py-7 {
+    padding-top: 1.75rem;
+    padding-bottom: 1.75rem;
+  }
+
+  .lg\:px-7 {
+    padding-left: 1.75rem;
+    padding-right: 1.75rem;
+  }
+
   .lg\:pl-12 {
     padding-left: 3rem;
   }
@@ -6140,14 +7321,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-top: 0px;
   }
 
-  .lg\:pl-32 {
-    padding-left: 8rem;
-  }
-
   .lg\:pr-16 {
     padding-right: 4rem;
   }
 
+  .lg\:pl-32 {
+    padding-left: 8rem;
+  }
+
   .lg\:pt-40 {
     padding-top: 10rem;
   }
@@ -6164,10 +7345,38 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-right: 5rem;
   }
 
+  .lg\:pb-56 {
+    padding-bottom: 14rem;
+  }
+
+  .lg\:pr-24 {
+    padding-right: 6rem;
+  }
+
+  .lg\:pt-\[150px\] {
+    padding-top: 150px;
+  }
+
+  .lg\:pr-0 {
+    padding-right: 0px;
+  }
+
+  .lg\:pl-10 {
+    padding-left: 2.5rem;
+  }
+
+  .lg\:pb-28 {
+    padding-bottom: 7rem;
+  }
+
   .lg\:text-left {
     text-align: left;
   }
 
+  .lg\:text-center {
+    text-align: center;
+  }
+
   .lg\:text-right {
     text-align: right;
   }
@@ -6177,6 +7386,11 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 2rem;
   }
 
+  .lg\:text-sm {
+    font-size: 0.875rem;
+    line-height: 1.25rem;
+  }
+
   .lg\:text-5xl {
     font-size: 3rem;
     line-height: 1;
@@ -6187,16 +7401,30 @@ Ensure the default browser behavior of the `hidden` attribute.
     line-height: 1.5rem;
   }
 
-  .lg\:text-sm {
-    font-size: 0.875rem;
-    line-height: 1.25rem;
-  }
-
   .lg\:text-3xl {
     font-size: 1.875rem;
     line-height: 2.25rem;
   }
 
+  .lg\:text-4xl {
+    font-size: 2.25rem;
+    line-height: 2.5rem;
+  }
+
+  .lg\:text-\[40px\] {
+    font-size: 40px;
+  }
+
+  .lg\:text-xl {
+    font-size: 1.25rem;
+    line-height: 1.75rem;
+  }
+
+  .lg\:text-9xl {
+    font-size: 8rem;
+    line-height: 1;
+  }
+
   .lg\:text-white {
     --tw-text-opacity: 1;
     color: rgb(255 255 255 / var(--tw-text-opacity));
@@ -6215,6 +7443,14 @@ Ensure the default browser behavior of the `hidden` attribute.
 }
 
 @media (min-width: 1280px) {
+  .xl\:col-span-2 {
+    grid-column: span 2 / span 2;
+  }
+
+  .xl\:col-span-3 {
+    grid-column: span 3 / span 3;
+  }
+
   .xl\:mb-8 {
     margin-bottom: 2rem;
   }
@@ -6235,6 +7471,14 @@ Ensure the default browser behavior of the `hidden` attribute.
     margin-top: -3rem;
   }
 
+  .xl\:mt-28 {
+    margin-top: 7rem;
+  }
+
+  .xl\:inline {
+    display: inline;
+  }
+
   .xl\:w-11\/12 {
     width: 91.666667%;
   }
@@ -6251,10 +7495,22 @@ Ensure the default browser behavior of the `hidden` attribute.
     width: 50%;
   }
 
+  .xl\:w-10\/12 {
+    width: 83.333333%;
+  }
+
+  .xl\:max-w-screen-xl {
+    max-width: 1280px;
+  }
+
   .xl\:max-w-3xl {
     max-width: 48rem;
   }
 
+  .xl\:max-w-7xl {
+    max-width: 80rem;
+  }
+
   .xl\:max-w-6xl {
     max-width: 72rem;
   }
@@ -6263,22 +7519,40 @@ Ensure the default browser behavior of the `hidden` attribute.
     max-width: 100%;
   }
 
-  .xl\:max-w-screen-xl {
-    max-width: 1280px;
+  .xl\:max-w-lg {
+    max-width: 32rem;
   }
 
-  .xl\:max-w-7xl {
-    max-width: 80rem;
+  .xl\:max-w-2xl {
+    max-width: 42rem;
   }
 
   .xl\:grid-cols-4 {
     grid-template-columns: repeat(4, minmax(0, 1fr));
   }
 
+  .xl\:grid-cols-5 {
+    grid-template-columns: repeat(5, minmax(0, 1fr));
+  }
+
   .xl\:flex-row {
     flex-direction: row;
   }
 
+  .xl\:p-6 {
+    padding: 1.5rem;
+  }
+
+  .xl\:px-20 {
+    padding-left: 5rem;
+    padding-right: 5rem;
+  }
+
+  .xl\:px-12 {
+    padding-left: 3rem;
+    padding-right: 3rem;
+  }
+
   .xl\:px-0 {
     padding-left: 0px;
     padding-right: 0px;
@@ -6289,14 +7563,18 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-bottom: 10rem;
   }
 
-  .xl\:px-12 {
-    padding-left: 3rem;
-    padding-right: 3rem;
+  .xl\:px-10 {
+    padding-left: 2.5rem;
+    padding-right: 2.5rem;
   }
 
-  .xl\:px-20 {
-    padding-left: 5rem;
-    padding-right: 5rem;
+  .xl\:py-20 {
+    padding-top: 5rem;
+    padding-bottom: 5rem;
+  }
+
+  .xl\:pt-8 {
+    padding-top: 2rem;
   }
 
   .xl\:pt-40 {
@@ -6323,8 +7601,12 @@ Ensure the default browser behavior of the `hidden` attribute.
     padding-right: 0px;
   }
 
-  .xl\:pt-8 {
-    padding-top: 2rem;
+  .xl\:pb-32 {
+    padding-bottom: 8rem;
+  }
+
+  .xl\:pb-20 {
+    padding-bottom: 5rem;
   }
 
   .xl\:text-center {
@@ -6350,6 +7632,20 @@ Ensure the default browser behavior of the `hidden` attribute.
     font-size: 2.25rem;
     line-height: 2.5rem;
   }
+
+  .xl\:text-\[42px\] {
+    font-size: 42px;
+  }
+
+  .xl\:text-9xl {
+    font-size: 8rem;
+    line-height: 1;
+  }
+
+  .xl\:text-2xl {
+    font-size: 1.5rem;
+    line-height: 2rem;
+  }
 }
 
 @media (min-width: 1536px) {
diff --git a/public/componets/hero/16_hero.html b/public/componets/hero/16_hero.html
new file mode 100644
index 0000000..98405a9
--- /dev/null
+++ b/public/componets/hero/16_hero.html
@@ -0,0 +1,38 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+
+  <!-- hero 16 start -->
+  <section class="section_divider" id="hero_16">
+    <div>Hero 16</div>
+  </section>
+  <section class= " dark:bg-gradient-to-b dark:from-emerald-600 dark:to-cyan-800 pb-5">
+    <div class="">
+      <div class="container flex flex-col items-center px-4 py-16 pb-24 mx-auto text-center lg:pb-56 md:py-32 md:px-10 lg:px-32 dark:text-coolGray-900">
+        <h1 class="text-5xl font-bold leading-none sm:text-6xl xl:max-w-3xl dark:text-coolGray-900">Provident blanditiis wlk exercitationem</h1>
+        <p class="mt-6 mb-8 text-lg sm:mb-12 xl:max-w-3xl dark:text-gray-900">Cupiditate minima voluptate temporibus quia? Architecto beatae esse ab amet vero eaque explicabo!</p>
+        <div class="flex flex-wrap justify-center">
+          <button type="button" class="px-8 py-3 m-2 text-lg font-semibold transition duration-500 border-b-2  hover:rounded hover:border border-gray-300 dark:border-x-0 dark:border-y-0 dark:rounded dark:bg-gray-800 dark:text-gray-50 dark:hover:border-x-2 dark:hover:border-y-2 dark:hover:bg-transparent dark:hover:text-gray-800 dark:hover:border-gray-800 ">Get started</button>
+          <button type="button" class="px-8 py-3 m-2 text-lg transition duration-500 border rounded hover:border-b-2 hover:border-t-0 hover:border-x-0 hover:rounded-none dark:hover:rounded  dark:border-gray-700 dark:text-gray-900 dark:hover:bg-gray-800 dark:hover:text-gray-50">Learn more</button>
+        </div>
+      </div>
+    </div>
+    <!-- <img src="https://source.unsplash.com/random/480x320" alt="" class="w-5/6 mx-auto mb-12 -mt-20 rounded-lg shadow-md lg:-mt-40 dark:bg-gray-800"> -->
+    <img src="https://images.unsplash.com/photo-1645119675435-fc5b106eddeb?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&ixid=MnwxfDB8MXxyYW5kb218MHx8fHx8fHx8MTY0NTMzODQyMQ&ixlib=rb-1.2.1&q=80&w=480" class=" w-3/6 mx-auto mb-12 -mt-20 rounded-lg shadow-md lg:-mt-40 dark:bg-gray-800" alt="">
+  </section>
+
+<!-- hero 16 end -->
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/17_hero.html b/public/componets/hero/17_hero.html
new file mode 100644
index 0000000..38b3c25
--- /dev/null
+++ b/public/componets/hero/17_hero.html
@@ -0,0 +1,48 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+  <!-- hero 17 start  -->
+  <section class="section_divider" id="hero_17">
+    <div>Hero 17</div>
+  </section>
+  
+  <section class="py-20 dark:bg-gray-800 dark:text-gray-100">
+    <div class="container grid gap-6 mx-auto text-center lg:grid-cols-2 xl:grid-cols-5">
+      <div class=" mx-auto px-6 pt-20 pb-20 rounded-md sm:px-12 md:px-16 xl:col-span-2 dark:bg-gray-900">
+        <span class="block mb-2 dark:text-indigo-400">Some design system</span>
+        <h1 class="text-5xl font-extrabold dark:text-gray-50">Build it with Some Company</h1>
+        <p class="my-8">
+          <span class="font-medium dark:text-indigo-400 ">Modular and versatile.</span>Fugit vero facilis dolor sit neque cupiditate minus esse accusamus cumque at.
+        </p>
+        <form novalidate="" action="" class="self-stretch space-y-3">
+          <div class="pb-3">
+            <label for="name" class="text-sm sr-only">Your name</label>
+            <input id="name" type="text" placeholder="Your name" class="w-full py-2 px-2 text-gray-800 outline-none dark:rounded-md border-b-2 border-b-gray-800 dark:border-gray-700">
+          </div>
+          <div class="pb-3">
+            <label for="lastname" class="text-sm sr-only">Email address</label>
+            <input id="lastname" type="text" placeholder="Email address" class="w-full py-2 px-2 text-gray-800 outline-none dark:rounded-md  border-b-2 border-b-gray-800  dark:border-gray-700">
+          </div>
+          <button type="button" class="w-full py-2 font-semibold rounded bg-gray-800 text-gray-50 dark:bg-indigo-400 dark:text-gray-900">Join the waitlist</button>
+        </form>
+      </div>
+      <!-- <img src="https://source.unsplash.com/random/480x360" alt="" class="object-cover w-full rounded-md xl:col-span-3 dark:bg-coolGray-500"> -->
+      <img src="https://images.unsplash.com/photo-1643609186613-e9e96efeb9ec?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=360&ixid=MnwxfDB8MXxyYW5kb218MHx8fHx8fHx8MTY0NTM0MDIzNQ&ixlib=rb-1.2.1&q=80&w=480" alt="" class="object-cover w-5/6 my-auto mx-auto rounded-md xl:col-span-3 dark:bg-gray-500">
+    </div>
+  </section>
+
+
+  <!-- hero 17 end -->
+
+
+</body>
+</html>
diff --git a/public/componets/hero/18_hero.html b/public/componets/hero/18_hero.html
new file mode 100644
index 0000000..b507387
--- /dev/null
+++ b/public/componets/hero/18_hero.html
@@ -0,0 +1,40 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+  <!-- hero 18 start  -->
+  <section class="section_divider">
+    <div>Hero 18</div>
+
+    <section class="bg-white dark:bg-gray-800">
+      
+      <div class="container px-6 py-16 mx-auto">
+          <div class=" lg:flex">
+              <div class="w-full lg:w-1/2">
+                  <div class="lg:max-w-lg">
+                      <h1 class="text-2xl font-semibold text-gray-800 uppercase dark:text-white lg:text-3xl">Best Place To Choose Your Clothes</h1>
+                      <p class="mt-2 text-gray-600 dark:text-gray-400">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro beatae error laborum ab amet sunt recusandae? Reiciendis natus perspiciatis optio.</p>
+                      <button class="w-full px-3 py-2 mt-6 text-xs font-medium text-white uppercase transition-colors duration-200 transform bg-blue-600 rounded-md lg:w-auto hover:bg-blue-500 focus:outline-none focus:bg-blue-500">Shop Now</button>
+                  </div>
+              </div>
+      
+              <div class="flex items-center justify-center w-full mt-6 lg:mt-0 lg:w-1/2">
+                  <img class="w-full h-full lg:max-w-2xl" src="https://merakiui.com/_nuxt/img/Catalogue-pana.32658f1.svg" alt="Catalogue-pana.svg">
+              </div>
+          </div>
+      </div>
+    </section>
+
+  <!-- hero 18 end  -->
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/19_hero.html b/public/componets/hero/19_hero.html
new file mode 100644
index 0000000..c757106
--- /dev/null
+++ b/public/componets/hero/19_hero.html
@@ -0,0 +1,49 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+<!-- hero 19 start -->
+<section class="section_divider">
+    <div>Hero 19</div>
+  </section>
+  
+  <section class="bg-white dark:bg-gray-800">
+  
+    <div class="container px-6 py-16 mx-auto">
+        <div class="items-center lg:flex">
+            <div class="w-full lg:w-1/2">
+                <div class="lg:max-w-lg text-left">
+                    <h1 class="text-2xl font-semibold text-gray-800 dark:text-white lg:text-3xl">Subscribe To The <span class="text-blue-500">Newsletter</span></h1>
+  
+                    <p class="mt-4 text-gray-600 dark:text-gray-400">be the first to knows when our <span class="font-medium text-blue-500">Brand</span> is live</p>
+  
+                    <div class="flex flex-col mt-8 space-y-3 lg:space-y-0 lg:flex-row">
+                        <input id="email" type="text" class="px-4 py-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:outline-none focus:ring focus:ring-opacity-40 focus:ring-blue-300" placeholder="Email Address">
+                        
+                        <button class="w-full px-4 py-2 text-sm font-medium tracking-wide text-white capitalize transition-colors duration-200 transform bg-blue-500 rounded-lg lg:w-auto lg:mx-4 hover:bg-blue-400 focus:outline-none focus:bg-blue-400">
+                            Subscribe
+                        </button>
+                    </div>
+                </div>
+            </div>
+    
+            <div class="flex items-center justify-center w-full mt-6 lg:mt-0 lg:w-1/2">
+                <img class="w-full h-full max-w-md" src="https://merakiui.com/_nuxt/img/Email-campaign-bro.882e33f.svg" alt="#">
+            </div>
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 19 end -->
+  
+
+</body>
+</html>
diff --git a/public/componets/hero/20_hero.html b/public/componets/hero/20_hero.html
new file mode 100644
index 0000000..f27b587
--- /dev/null
+++ b/public/componets/hero/20_hero.html
@@ -0,0 +1,69 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+<!-- hero 20 start -->
+<section class="section_divider">
+    <div>Hero 20</div>
+  </section>
+  
+  <section class="bg-white dark:bg-gray-800">
+   
+    <div class="container px-6 py-16 mx-auto text-center">
+        <div class="max-w-lg mx-auto">
+            <h1 class="text-3xl font-bold text-gray-800 dark:text-white md:text-4xl">Create beautiful website layout with Meraki UI.</h1>
+            
+            <p class="mt-6 text-gray-500 dark:text-gray-300">
+                Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero similique obcaecati illum mollitia.
+            </p>
+  
+            <div class="w-full max-w-sm mx-auto mt-6 bg-transparent border rounded-md dark:border-gray-700 focus-within:border-blue-400 focus-within:ring focus-within:ring-blue-300 dark:focus-within:border-blue-300 focus-within:ring-opacity-40">
+                <form class="flex flex-col md:flex-row">
+                    <input type="email" placeholder="Enter your email address" class="flex-1 h-10 px-4 py-2 m-1 text-gray-700 placeholder-gray-400 bg-transparent border-none appearance-none dark:text-gray-200 focus:outline-none focus:placeholder-transparent focus:ring-0" /> 
+                    
+                    <button type="button" class="h-10 px-4 py-2 m-1 text-white transition-colors duration-200 transform bg-blue-500 rounded-md hover:bg-blue-400 focus:outline-none focus:bg-blue-400">
+                        Join Us
+                    </button>
+                </form>
+            </div>
+        </div>
+  
+        <div class="max-w-screen-xl mx-auto mt-20">
+            <div class="grid grid-cols-2 gap-8 md:grid-cols-6 lg:grid-cols-5">
+                <div class="flex items-center justify-center col-span-1 md:col-span-2 lg:col-span-1">
+                    <svg class="h-12 text-gray-500 fill-current dark:text-gray-300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 266 100"><path fill="none" d="M0 0h266v100H0z"></path><path d="M140.021 49.597c-1.784 0-3.07.585-4.374 1.181v13.486c1.249.119 1.965.119 3.15.119 4.282 0 4.869-1.961 4.869-4.699v-6.441c0-2.022-.671-3.646-3.645-3.646zm-28.438-.736c-2.971 0-3.649 1.631-3.649 3.651v1.135h7.294v-1.135c0-2.02-.678-3.651-3.645-3.651zm-55.09 14.037c0 1.598.754 2.428 2.418 2.428 1.785 0 2.842-.582 4.145-1.18v-3.199h-3.903c-1.848 0-2.66.344-2.66 1.951zm111.191-13.301c-2.976 0-4.007 1.624-4.007 3.646v7.379c0 2.027 1.031 3.656 4.007 3.656 2.968 0 4.007-1.629 4.007-3.656v-7.379c-.001-2.022-1.04-3.646-4.007-3.646zM41.909 71.172h-8.748V49.998H28.79v-7.296h4.372V38.32c0-5.953 2.467-9.492 9.479-9.492h5.838v7.298H44.83c-2.73 0-2.91 1.02-2.91 2.923l-.011 3.652h6.61l-.773 7.296h-5.837v21.175zm29.897.055h-7.291l-.315-1.844c-3.329 1.844-6.3 2.143-8.26 2.143-5.347 0-8.193-3.572-8.193-8.512 0-5.828 3.321-7.908 9.262-7.908h6.047v-1.26c0-2.975-.341-3.848-4.916-3.848h-7.48l.731-7.296h8.176c10.038 0 12.239 3.171 12.239 11.203v17.322zm24.793-20.694c-4.537-.778-5.84-.949-8.023-.949-3.921 0-5.106.865-5.106 4.195v6.299c0 3.33 1.185 4.199 5.106 4.199 2.183 0 3.486-.174 8.023-.955v7.117c-3.974.891-6.563 1.125-8.751 1.125-9.392 0-13.125-4.939-13.125-12.074v-5.111c0-7.141 3.733-12.089 13.125-12.089 2.188 0 4.777.235 8.751 1.13v7.113zm27.376 8.957h-16.042v.588c0 3.33 1.186 4.199 5.106 4.199 3.524 0 5.675-.174 10.204-.955v7.117c-4.368.891-6.644 1.125-10.929 1.125-9.393 0-13.128-4.939-13.128-12.074v-5.844c0-6.243 2.771-11.356 12.396-11.356s12.393 5.054 12.393 11.356v5.844zm28.437.135c0 6.896-1.971 11.926-13.911 11.926-4.312 0-6.841-.379-11.6-1.111V31.02l8.745-1.459V43.35c1.89-.702 4.336-1.059 6.562-1.059 8.746 0 10.203 3.921 10.203 10.222v7.112zm28.033.15c0 5.949-2.456 11.719-12.732 11.719-10.281 0-12.783-5.77-12.783-11.719v-5.744c0-5.952 2.502-11.723 12.783-11.723 10.276 0 12.732 5.771 12.732 11.723v5.744zm28.014 0c0 5.949-2.459 11.719-12.733 11.719-10.281 0-12.783-5.77-12.783-11.719v-5.744c0-5.952 2.502-11.723 12.783-11.723 10.274 0 12.733 5.771 12.733 11.723v5.744zm28.749 11.397h-9.479l-8.017-13.383v13.383h-8.748V31.019l8.748-1.459v25.849l8.017-12.707h9.479l-8.752 13.867 8.752 14.603zm-41.512-21.575c-2.971 0-4.002 1.624-4.002 3.646v7.379c0 2.027 1.031 3.656 4.002 3.656 2.967 0 4.017-1.629 4.017-3.656v-7.379c0-2.022-1.05-3.646-4.017-3.646zm46.505 16.581c1.473 0 2.646 1.201 2.646 2.701 0 1.523-1.174 2.711-2.657 2.711-1.476 0-2.673-1.188-2.673-2.711 0-1.5 1.197-2.701 2.673-2.701h.011zm-.011.42c-1.187 0-2.158 1.021-2.158 2.281 0 1.283.972 2.291 2.169 2.291 1.198.012 2.155-1.008 2.155-2.279s-.957-2.293-2.155-2.293h-.011zm-.503 3.853h-.48v-3.014c.252-.035.492-.07.852-.07.456 0 .754.096.937.227.177.133.272.336.272.623 0 .398-.262.637-.585.734v.023c.263.049.442.287.503.73.07.469.143.648.19.746h-.503c-.071-.098-.144-.373-.204-.77-.07-.383-.264-.527-.648-.527h-.333v1.298zm0-1.668h.348c.394 0 .729-.145.729-.518 0-.264-.19-.527-.729-.527-.157 0-.266.012-.348.023v1.022z"></path></svg>
+                </div>
+  
+                <div class="flex items-center justify-center col-span-1 md:col-span-2 lg:col-span-1">
+                    <svg class="h-10 text-gray-500 fill-current dark:text-gray-300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 316 60"><g transform="translate(9.259 4.552) scale(.4941)"><path d="M52.1 102.1V82.5c20.8 0 36.8-20.6 28.9-42.4-3-8.1-9.4-14.6-17.5-17.5-21.8-7.9-42.4 8.1-42.4 28.9H1.5c0-33.1 32-58.9 66.7-48.1 15.2 4.7 27.2 16.8 31.9 31.9 10.8 34.8-14.9 66.8-48 66.8z"></path><path d="M32.6 63h19.5v19.5H32.6zm-15 34.5v-15h15v15h-15zM5 70h12.6v12.5H5z" fill-rule="evenodd"></path><path d="M181.5 30.2c-5.8-4-13-6.1-21.4-6.1h-18.3v58.1h18.3c8.4 0 15.6-2.1 21.4-6.4 3.2-2.2 5.7-5.4 7.4-9.3s2.6-8.5 2.6-13.7c0-5.1-.9-9.7-2.6-13.6-1.7-3.8-4.2-6.9-7.4-9zm-29 3.8h5.8c6.4 0 11.7 1.3 15.7 3.7 4.4 2.7 6.7 7.8 6.7 15.1 0 7.6-2.3 12.9-6.7 15.8-3.8 2.5-9.1 3.8-15.6 3.8h-5.8V34z"></path><use xlink:href="#A"></use><path d="M199 41.3h10.3v41H199zm47.8 3.4c-3.1-2.8-6.6-4.4-10.3-4.4-5.7 0-10.4 2-14.1 5.8s-5.5 8.8-5.5 14.7c0 5.8 1.8 10.7 5.5 14.7 3.7 3.8 8.4 5.8 14.1 5.8 4 0 7.4-1.1 10.2-3.3v1c0 3.4-.9 6-2.7 7.9-1.8 1.8-4.3 2.7-7.4 2.7-4.8 0-7.7-1.9-11.4-6.8l-7 6.7.2.3c1.5 2.1 3.8 4.2 6.9 6.2s6.9 3 11.5 3c6.1 0 11.1-1.9 14.7-5.6 3.7-3.7 5.5-8.7 5.5-14.9V41.3h-10.1v3.4zm-2.7 24.2c-1.8 2-4.1 3-7.1 3s-5.3-1-7-3c-1.8-2-2.7-4.7-2.7-8s.9-6.1 2.7-8.1 4.1-3.1 7-3.1c3 0 5.3 1 7.1 3.1 1.8 2 2.7 4.8 2.7 8.1s-1 6-2.7 8zm21.6-27.6H276v41h-10.3z"></path><use xlink:href="#A" x="66.7"></use><path d="M298.6 30.3h-10.1v11.1h-5.9v9.4h5.9v17c0 5.3 1.1 9.1 3.2 11.3s5.8 3.3 11.1 3.3c1.7 0 3.4-.1 5-.2h.5v-9.4l-3.5.2c-2.5 0-4.1-.4-4.9-1.3s-1.2-2.7-1.2-5.4V50.7h9.6v-9.4h-9.6v-11zm57.9-6.2h10.3v58.1h-10.3zm114.4 43.5c-1.8 2.1-3.7 3.9-5.2 4.8-1.4.9-3.2 1.4-5.3 1.4-3 0-5.5-1.1-7.5-3.4s-3-5.2-3-8.7 1-6.4 2.9-8.6c2-2.3 4.4-3.4 7.4-3.4 3.3 0 6.8 2.1 9.8 5.6l6.8-6.5c-4.4-5.8-10.1-8.5-16.9-8.5-5.7 0-10.6 2.1-14.6 6.1s-6 9.2-6 15.3 2 11.2 6 15.3 8.9 6.1 14.6 6.1c7.5 0 13.5-3.2 17.5-9.1l-6.5-6.4zM513.2 47c-1.5-2-3.5-3.7-5.9-4.9-2.5-1.2-5.3-1.8-8.5-1.8-5.8 0-10.5 2.1-14 6.3-3.4 4.2-5.2 9.3-5.2 15.4 0 6.2 1.9 11.3 5.7 15.3 3.7 3.9 8.8 5.9 14.9 5.9 6.9 0 12.7-2.8 16.9-8.4l.2-.3-6.7-6.5c-.6.8-1.5 1.6-2.3 2.4-1 1-2 1.7-3 2.2-1.5.8-3.3 1.1-5.2 1.1-2.9 0-5.2-.8-7-2.5-1.7-1.5-2.7-3.6-2.9-6.2h27.3l.1-3.8c0-2.7-.4-5.2-1.1-7.6-.7-2.3-1.8-4.5-3.3-6.6zm-22.5 9.7c.5-2 1.4-3.6 2.7-4.9 1.4-1.4 3.2-2.1 5.4-2.1 2.5 0 4.4.7 5.7 2.1 1.2 1.3 1.9 2.9 2.1 4.8h-15.9zm62.1-12.3c-3.1-2.7-7.4-4-12.8-4-3.4 0-6.6.8-9.5 2.2-2.7 1.4-5.3 3.6-7 6.6l.1.1 6.6 6.3c2.7-4.3 5.7-5.8 9.7-5.8 2.2 0 3.9.6 5.3 1.7s2 2.6 2 4.4v2c-2.6-.8-5.1-1.2-7.6-1.2-5.1 0-9.3 1.2-12.4 3.6s-4.7 5.9-4.7 10.2c0 3.8 1.3 7 4 9.3 2.7 2.2 6 3.4 9.9 3.4s7.6-1.6 10.9-4.3v3.4h10.1V55.9c.2-4.9-1.4-8.8-4.6-11.5zm-18.3 22.2c1.2-.8 2.8-1.2 4.9-1.2 2.5 0 5.1.5 7.8 1.5v4C545 73 542 74 538.3 74c-1.8 0-3.2-.4-4.1-1.2s-1.4-1.7-1.4-3 .6-2.4 1.7-3.2zm62.7-21.4c-2.9-3.2-6.9-4.8-12-4.8-4.1 0-7.4 1.2-9.9 3.5v-2.5h-10.1v41h10.3V59.7c0-3.1.7-5.6 2.2-7.3 1.5-1.8 3.4-2.6 6.1-2.6 2.3 0 4.1.8 5.4 2.3 1.3 1.6 2 3.7 2 6.4v23.7h10.3V58.5c0-5.6-1.4-10.1-4.3-13.3zm-253.6-.8c-3.1-2.7-7.4-4-12.8-4-3.4 0-6.6.8-9.5 2.2-2.7 1.4-5.3 3.6-7 6.6l.1.1 6.6 6.3c2.7-4.3 5.7-5.8 9.7-5.8 2.2 0 3.9.6 5.3 1.7s2 2.6 2 4.4v2c-2.6-.8-5.1-1.2-7.6-1.2-5.1 0-9.3 1.2-12.4 3.6s-4.7 5.9-4.7 10.2c0 3.8 1.3 7 4 9.3 2.7 2.2 6 3.4 9.9 3.4s7.6-1.6 10.9-4.3v3.4h10.1V55.9c.1-4.9-1.5-8.8-4.6-11.5zm-18.3 22.2c1.2-.8 2.8-1.2 4.9-1.2 2.5 0 5.1.5 7.8 1.5v4c-2.2 2.1-5.2 3.1-8.9 3.1-1.8 0-3.2-.4-4.1-1.2s-1.4-1.7-1.4-3 .5-2.4 1.7-3.2zm78.9 16.5c-16.5 0-30-13.4-30-30s13.4-30 30-30c16.5 0 30 13.4 30 30s-13.5 30-30 30zm0-49.3c-10.7 0-19.4 8.7-19.4 19.4s8.7 19.4 19.4 19.4 19.4-8.7 19.4-19.4-8.7-19.4-19.4-19.4z"></path></g><defs><path d="M204.3 23.4c-1.8 0-3.3.6-4.5 1.8s-1.9 2.7-1.9 4.4c0 1.8.6 3.3 1.9 4.5 1.2 1.2 2.7 1.9 4.5 1.9s3.3-.6 4.5-1.9c1.2-1.2 1.9-2.8 1.9-4.5 0-1.8-.6-3.3-1.9-4.4-1.2-1.2-2.8-1.8-4.5-1.8z"></path></defs></svg>
+                </div>
+  
+                <div class="flex items-center justify-center col-span-1 md:col-span-2 lg:col-span-1">
+                    <svg class="h-8 mt-2 text-gray-500 fill-current dark:text-gray-300" viewBox="0 0 398 120" xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero"><path d="M247.292 94.106C224.124 111.016 190.526 120 161.608 120c-40.544 0-77.046-14.822-104.673-39.476-2.164-1.936-.235-4.583 2.369-3.082 29.806 17.15 66.66 27.475 104.731 27.475 25.677 0 53.906-5.271 79.884-16.163 3.923-1.646 7.21 2.545 3.373 5.352"></path><path d="M256.533 82.534c-2.965-3.771-19.551-1.787-27.003-.897-2.254.277-2.605-1.692-.57-3.122 13.233-9.265 34.922-6.587 37.447-3.487 2.54 3.13-.666 24.802-13.073 35.147-1.91 1.59-3.718.744-2.877-1.357 2.782-6.952 9.04-22.505 6.076-26.284zM230.05 13.058V4.063c.015-1.378 1.04-2.29 2.291-2.283l40.493-.007c1.295 0 2.335.94 2.335 2.268v7.726c-.015 1.29-1.113 2.983-3.053 5.668l-20.97 29.843c7.78-.182 16.022.985 23.093 4.939 1.596.897 2.027 2.217 2.152 3.516v9.607c0 1.32-1.457 2.86-2.987 2.057-12.458-6.507-29-7.214-42.776.08-1.405.745-2.884-.765-2.884-2.086v-9.133c0-1.459.03-3.961 1.508-6.186l24.302-34.738h-21.162c-1.295 0-2.327-.927-2.342-2.276zM82.354 69.294H70.042c-1.171-.08-2.108-.956-2.203-2.072l.014-63.006c0-1.262 1.062-2.268 2.38-2.268L81.71 1.94c1.2.059 2.159.963 2.232 2.116v8.221h.234C87.163 4.326 92.8.613 100.39.613c7.708 0 12.539 3.713 15.98 11.664C119.361 4.326 126.14.613 133.393.613c5.175 0 10.804 2.123 14.251 6.893 3.916 5.311 3.111 12.993 3.111 19.755l-.015 39.764c0 1.255-1.061 2.262-2.379 2.262h-12.304c-1.23-.08-2.203-1.05-2.203-2.262l-.007-33.41c0-2.648.234-9.28-.344-11.796-.923-4.246-3.675-5.435-7.24-5.435-2.986 0-6.09 1.985-7.356 5.165-1.266 3.188-1.15 8.484-1.15 12.066v33.403c0 1.255-1.06 2.262-2.378 2.262h-12.297c-1.237-.08-2.21-1.051-2.21-2.262l-.015-33.41c0-7.025 1.142-17.362-7.59-17.362-8.858 0-8.506 10.074-8.506 17.362l-.007 33.403c-.022 1.276-1.084 2.283-2.401 2.283zm227.788-55.82c-9.084 0-9.662 12.328-9.662 20.017s-.117 24.131 9.545 24.131c9.545 0 10.006-13.262 10.006-21.345 0-5.303-.234-11.664-1.845-16.705-1.383-4.377-4.143-6.098-8.044-6.098zM310.025.613c18.284 0 28.173 15.647 28.173 35.533 0 19.222-10.92 34.468-28.173 34.468-17.933 0-27.712-15.647-27.712-35.132C282.305 15.86 292.2.612 310.025.612zm51.882 68.681h-12.275c-1.23-.08-2.211-1.05-2.211-2.261l-.015-63.028c.103-1.16 1.12-2.057 2.365-2.057l11.426-.008c1.076.059 1.961.788 2.188 1.766v9.636h.234c3.448-8.622 8.279-12.73 16.785-12.73 5.519 0 10.92 1.992 14.375 7.427C398 13.072 398 21.556 398 27.662v39.64c-.14 1.117-1.142 1.985-2.364 1.985h-12.349c-1.141-.073-2.064-.912-2.188-1.984V33.097c0-6.894.805-16.968-7.708-16.968-2.993 0-5.753 1.984-7.13 5.033-1.72 3.845-1.953 7.69-1.953 11.935v33.928c-.03 1.262-1.091 2.27-2.401 2.27zm-151.715-.16c-.813.73-1.991.78-2.913.284-4.092-3.385-4.824-4.953-7.064-8.177-6.756 6.864-11.543 8.921-20.305 8.921-10.372 0-18.438-6.376-18.438-19.134 0-9.965 5.424-16.742 13.139-20.061 6.683-2.925 16.023-3.458 23.167-4.253v-1.598c0-2.925.234-6.375-1.5-8.9-1.501-2.26-4.378-3.195-6.918-3.195-4.692 0-8.871 2.4-9.904 7.375-.212 1.11-1.024 2.204-2.137 2.262l-11.938-1.291c-1.01-.234-2.13-1.029-1.838-2.568C166.288 4.362 179.37 0 191.087 0c5.995 0 13.827 1.59 18.556 6.113 5.995 5.58 5.416 13.021 5.416 21.126v19.127c0 5.756 2.401 8.28 4.648 11.373.79 1.116.967 2.444-.036 3.26-2.518 2.102-6.983 5.968-9.443 8.15l-.036-.015zm-12.414-29.931v-2.656c-8.908 0-18.322 1.897-18.322 12.35 0 5.319 2.767 8.908 7.488 8.908 3.455 0 6.566-2.123 8.528-5.58 2.423-4.254 2.306-8.237 2.306-13.022zM48.72 69.133c-.813.73-1.991.781-2.913.285-4.092-3.385-4.824-4.953-7.064-8.177-6.763 6.864-11.55 8.921-20.305 8.921C8.06 70.162 0 63.786 0 51.028c0-9.965 5.417-16.742 13.139-20.061 6.683-2.925 16.015-3.458 23.16-4.253v-1.598c0-2.925.233-6.375-1.501-8.9-1.5-2.26-4.377-3.195-6.91-3.195-4.7 0-8.879 2.4-9.904 7.375-.212 1.11-1.024 2.204-2.137 2.262L3.91 21.367c-1.01-.234-2.13-1.029-1.845-2.568C4.81 4.362 17.89.007 29.615.007c5.995 0 13.827 1.59 18.556 6.113 5.995 5.581 5.416 13.022 5.416 21.126v19.128c0 5.755 2.401 8.28 4.648 11.372.79 1.116.967 2.444-.036 3.261-2.518 2.101-6.99 5.967-9.45 8.148l-.03-.021zm-12.422-29.93v-2.656c-8.908 0-18.32 1.897-18.32 12.35 0 5.319 2.766 8.908 7.487 8.908 3.462 0 6.573-2.123 8.528-5.58 2.422-4.254 2.305-8.237 2.305-13.022z"></path></g></svg>
+                </div>
+  
+                <div class="flex items-center justify-center col-span-1 md:col-span-3 lg:col-span-1">
+                    <svg class="h-5 mt-1 text-gray-500 fill-current dark:text-gray-300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 278.7 36.3"><g><path class="st0" d="M238.1 14.4v21.9h7V21.7h25.6v14.6h7V14.4h-39.6m6.2-7.1h27c3.8-.7 6.5-4.1 7.3-7.3H237c.8 3.2 3.6 6.5 7.3 7.3m-27.5 29c3.5-1.5 5.4-4.1 6.2-7.1h-31.5V.1h-7.1v36.2h32.4M131.9 7.2h25c3.8-1.1 6.9-4 7.7-7.1H125v21.4h32.4V29H132c-4 1.1-7.4 3.8-9.1 7.3h41.5V14.4H132l-.1-7.2m-61.6.1h27c3.8-.7 6.6-4.1 7.3-7.3H62.9c.8 3.2 3.6 6.5 7.4 7.3m0 14.3h27c3.8-.7 6.6-4.1 7.3-7.3H62.9c.8 3.2 3.6 6.5 7.4 7.3m0 14.7h27c3.8-.7 6.6-4.1 7.3-7.3H62.9c.8 3.2 3.6 6.6 7.4 7.3M0 .1c.8 3.2 3.6 6.4 7.3 7.2h11.4l.6.2v28.7h7.1V7.5l.6-.2h11.4c3.8-1 6.5-4 7.3-7.2V0L0 .1"></path></g></svg>
+                </div>
+                
+                <div class="flex items-center justify-center col-span-2 md:col-span-3 lg:col-span-1">
+                    <svg class="h-8 text-gray-500 fill-current dark:text-gray-300" viewBox="0 0 2270 546" xmlns="http://www.w3.org/2000/svg"><g fill-rule="evenodd"><path d="M888.413 394.397l-31.127 144.717h-71.593L903.977 14.642h84.81l111.28 524.472h-72.371l-30.35-144.717H888.413zm100.373-58.364l-24.124-125.3c-7.003-35.797-14.007-82.463-19.441-119.828h-3.126c-5.434 38.13-13.242 86.365-20.22 119.827l-24.902 125.301h91.813zM1373.34.648v441.205c0 28.806 1.556 70.828 3.1 97.274h-63.02l-4.67-45.9h-2.334c-12.451 26.445-41.244 52.138-79.362 52.138-70.037 0-112.837-76.275-112.837-193.755 0-133.848 56.794-196.881 116.728-196.881 30.336 0 54.46 14.02 67.689 42.8h1.556V.648h73.15zm-73.163 304.258c0-6.991 0-15.551-.778-23.359-3.89-34.227-23.345-63.798-49.79-63.798-45.927 0-61.477 63.798-61.477 133.848 0 77.818 20.232 132.278 59.142 132.278 16.342 0 38.118-8.56 50.569-53.681 1.556-6.226 2.334-15.577 2.334-24.111V304.906zm247.399 240.446c-75.471 0-129.957-64.59-129.957-194.52 0-137.752 64.576-196.116 133.835-196.116 74.705 0 128.387 66.924 128.387 194.546 0 150.19-73.927 196.09-131.5 196.09h-.765zm2.321-57.573c45.122 0 55.251-80.153 55.251-137.726 0-56.82-10.116-137.739-56.794-137.739-48.26 0-57.586 80.919-57.586 137.74 0 63.02 10.895 137.725 58.364 137.725h.765zM1723.938.648h73.137V203.74h1.556c19.455-34.227 45.913-49.025 79.375-49.025 64.577 0 105.055 73.15 105.055 189.099 0 135.391-55.25 201.537-117.506 201.537-37.353 0-58.364-20.246-74.719-53.708h-3.086l-3.904 47.47h-63.02c1.556-25.668 3.112-68.468 3.112-97.274V.648zm73.137 404.618c0 8.586.778 17.146 3.113 23.358 11.66 45.926 34.24 55.251 49.012 55.251 43.579 0 59.92-57.572 59.92-135.391 0-72.371-17.106-130.735-60.698-130.735-24.124 0-43.578 28.793-49.025 56.03-1.557 7.781-2.335 17.91-2.335 25.68v105.807h.013zm293.92-40.453c.779 97.273 42.788 121.384 87.145 121.384 26.458 0 49.025-6.213 65.367-14.007l10.895 52.916c-22.568 11.673-56.808 17.912-90.27 17.912-94.925 0-144.73-71.594-144.73-188.321 0-123.732 56.795-199.994 135.392-199.994s115.172 75.484 115.172 170.435c0 18.664-.792 30.35-1.557 40.453l-177.413-.778zm109.712-52.126c.778-66.924-22.567-102.707-51.347-102.707-38.144 0-55.264 55.251-57.586 102.707h108.933z" fill-rule="nonzero"></path><path d="M373.462 16.043h218.501v523.07L373.462 16.044zm-153.926 0H.88v523.07l218.657-523.07zm76.976 192.77l139.218 330.3H344.5l-41.633-105.197H200.964l95.548-225.103z"></path></g></svg>
+                </div>
+            </div>
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 20 end -->
+  
+
+
+</body>
+</html>
diff --git a/public/componets/hero/21_hero.html b/public/componets/hero/21_hero.html
new file mode 100644
index 0000000..be69044
--- /dev/null
+++ b/public/componets/hero/21_hero.html
@@ -0,0 +1,77 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+<!-- hero 21 start -->
+<section class="section_divider">
+    <div>Hero 21</div>
+  </section>
+  
+  <section class="bg-white dark:bg-gray-800">
+    
+  
+    <div class="container flex flex-col px-6 py-10 mx-auto space-y-6 lg:h-[32rem] lg:py-16 lg:flex-row lg:items-center">
+        <div class="w-full lg:w-1/2">
+            <div class="lg:max-w-lg">
+                <h1 class="text-3xl text-left font-bold tracking-wide text-gray-800 dark:text-white lg:text-5xl">
+                    Easiest way to create your website
+                </h1>
+                
+                <div class="mt-8 space-y-5 ">
+                    <p class="flex items-center -mx-2 text-gray-700 dark:text-gray-200">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 mx-2 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                        </svg>
+  
+                        <span class="mx-2">Clean and Simple Layout</span>
+                    </p>
+  
+                    <p class="flex items-center -mx-2 text-gray-700 dark:text-gray-200">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 mx-2 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                        </svg>
+  
+                        <span class="mx-2">Just Copy Paste Codeing</span>
+                    </p>
+  
+                    <p class="flex items-center -mx-2 text-gray-700 dark:text-gray-200">
+                        <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 mx-2 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                        </svg>
+  
+                        <span class="mx-2">Easy to Use</span>
+                    </p>
+                </div>
+                
+            </div>
+  
+            <div class="w-full mt-8 bg-transparent border rounded-md lg:max-w-sm dark:border-gray-700 focus-within:border-blue-400 focus-within:ring focus-within:ring-blue-300 dark:focus-within:border-blue-400 focus-within:ring-opacity-40">
+                <form class="flex flex-col lg:flex-row">
+                    <input type="email" placeholder="Enter your email address" class="flex-1 h-10 px-4 py-2 m-1 text-gray-700 placeholder-gray-400 bg-transparent border-none appearance-none dark:text-gray-200 focus:outline-none focus:placeholder-transparent focus:ring-0" /> 
+                    
+                    <button type="button" class="h-10 w-full px-4 py-2 m-1 text-white transition-colors duration-200 transform bg-blue-500 rounded-md hover:bg-blue-400 focus:outline-none focus:bg-blue-400">
+                        Join Us
+                    </button>
+                </form>
+            </div>
+        </div>
+  
+        <div class="flex items-center justify-center w-full h-96 lg:w-1/2">
+            <img class="object-cover w-full h-full mx-auto rounded-md lg:max-w-2xl" src="https://images.unsplash.com/photo-1543269664-7eef42226a21?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80" alt="glasses photo">
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 21 end -->
+  
+
+</body>
+</html>
diff --git a/public/componets/hero/22_hero.html b/public/componets/hero/22_hero.html
new file mode 100644
index 0000000..14f7f51
--- /dev/null
+++ b/public/componets/hero/22_hero.html
@@ -0,0 +1,88 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+<!-- hero 22 start -->
+<section class="section_divider">
+    <div>Hero 22 </div>
+  </section>
+  
+  <section class="bg-white dark:bg-gray-800">
+  
+  
+    <div class="container flex flex-col px-6 py-10 mx-auto space-y-6 lg:h-[32rem] lg:py-16 lg:flex-row lg:items-center">
+        <div class="w-full lg:w-1/2">
+            <div class="lg:max-w-lg">
+                <h1 class="text-2xl font-medium tracking-wide text-gray-800 dark:text-white lg:text-4xl">Find your premium new glasses exported from US</h1>
+                <p class="mt-2 text-gray-600 dark:text-gray-300">We work with the best remunated glasses dealers in US to find your new glasses.</p>
+                <div class="grid gap-6 mt-8 sm:grid-cols-2">
+                    <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                        <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                        </svg>
+  
+                        <span class="mx-3">Premium selection</span>
+                    </div>
+  
+                    <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                        <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                        </svg>
+  
+                        <span class="mx-3">Insurance sometext</span>
+                    </div>
+  
+                    <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                        <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                        </svg>
+  
+                        <span class="mx-3">All legal documents</span>
+                    </div>
+  
+                    <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                        <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                        </svg>
+  
+                        <span class="mx-3">From US glasses dealers</span>
+                    </div>
+  
+                    <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                        <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                        </svg>
+  
+                        <span class="mx-3">Payment Security</span>
+                    </div>
+  
+                    <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                        <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                        </svg>
+  
+                        <span class="mx-3">Fast shipping (+ Express)</span>
+                    </div>
+                </div>
+            </div>
+        </div>
+  
+        <div class="flex items-center justify-center w-full h-96 lg:w-1/2">
+            <img class="object-cover w-full h-full max-w-2xl rounded-md" src="https://images.unsplash.com/photo-1555181126-cf46a03827c0?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1050&q=80" alt="glasses photo">
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 22 end -->
+  
+
+
+</body>
+</html>
diff --git a/public/componets/hero/23_hero.html b/public/componets/hero/23_hero.html
new file mode 100644
index 0000000..f6ecff1
--- /dev/null
+++ b/public/componets/hero/23_hero.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 23</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+<!-- hero 23 start -->
+<section class="section_divider">
+    <div>Hero 23</div>
+  </section>
+  
+      <!-- Require css -->
+      <style>
+        .pattern {
+            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 304 304' width='304' height='304'%3E%3Cpath fill='%23a0aec0' fill-opacity='0.1' d='M44.1 224a5 5 0 1 1 0 2H0v-2h44.1zm160 48a5 5 0 1 1 0 2H82v-2h122.1zm57.8-46a5 5 0 1 1 0-2H304v2h-42.1zm0 16a5 5 0 1 1 0-2H304v2h-42.1zm6.2-114a5 5 0 1 1 0 2h-86.2a5 5 0 1 1 0-2h86.2zm-256-48a5 5 0 1 1 0 2H0v-2h12.1zm185.8 34a5 5 0 1 1 0-2h86.2a5 5 0 1 1 0 2h-86.2zM258 12.1a5 5 0 1 1-2 0V0h2v12.1zm-64 208a5 5 0 1 1-2 0v-54.2a5 5 0 1 1 2 0v54.2zm48-198.2V80h62v2h-64V21.9a5 5 0 1 1 2 0zm16 16V64h46v2h-48V37.9a5 5 0 1 1 2 0zm-128 96V208h16v12.1a5 5 0 1 1-2 0V210h-16v-76.1a5 5 0 1 1 2 0zm-5.9-21.9a5 5 0 1 1 0 2H114v48H85.9a5 5 0 1 1 0-2H112v-48h12.1zm-6.2 130a5 5 0 1 1 0-2H176v-74.1a5 5 0 1 1 2 0V242h-60.1zm-16-64a5 5 0 1 1 0-2H114v48h10.1a5 5 0 1 1 0 2H112v-48h-10.1zM66 284.1a5 5 0 1 1-2 0V274H50v30h-2v-32h18v12.1zM236.1 176a5 5 0 1 1 0 2H226v94h48v32h-2v-30h-48v-98h12.1zm25.8-30a5 5 0 1 1 0-2H274v44.1a5 5 0 1 1-2 0V146h-10.1zm-64 96a5 5 0 1 1 0-2H208v-80h16v-14h-42.1a5 5 0 1 1 0-2H226v18h-16v80h-12.1zm86.2-210a5 5 0 1 1 0 2H272V0h2v32h10.1zM98 101.9V146H53.9a5 5 0 1 1 0-2H96v-42.1a5 5 0 1 1 2 0zM53.9 34a5 5 0 1 1 0-2H80V0h2v34H53.9zm60.1 3.9V66H82v64H69.9a5 5 0 1 1 0-2H80V64h32V37.9a5 5 0 1 1 2 0zM101.9 82a5 5 0 1 1 0-2H128V37.9a5 5 0 1 1 2 0V82h-28.1zm16-64a5 5 0 1 1 0-2H146v44.1a5 5 0 1 1-2 0V18h-26.1zm102.2 270a5 5 0 1 1 0 2H98v14h-2v-16h124.1zM242 149.9V160h16v34h-16v62h48v48h-2v-46h-48v-66h16v-30h-16v-12.1a5 5 0 1 1 2 0zM53.9 18a5 5 0 1 1 0-2H64V2H48V0h18v18H53.9zm112 32a5 5 0 1 1 0-2H192V0h50v2h-48v48h-28.1zm-48-48a5 5 0 0 1-9.8-2h2.07a3 3 0 1 0 5.66 0H178v34h-18V21.9a5 5 0 1 1 2 0V32h14V2h-58.1zm0 96a5 5 0 1 1 0-2H137l32-32h39V21.9a5 5 0 1 1 2 0V66h-40.17l-32 32H117.9zm28.1 90.1a5 5 0 1 1-2 0v-76.51L175.59 80H224V21.9a5 5 0 1 1 2 0V82h-49.59L146 112.41v75.69zm16 32a5 5 0 1 1-2 0v-99.51L184.59 96H300.1a5 5 0 0 1 3.9-3.9v2.07a3 3 0 0 0 0 5.66v2.07a5 5 0 0 1-3.9-3.9H185.41L162 121.41v98.69zm-144-64a5 5 0 1 1-2 0v-3.51l48-48V48h32V0h2v50H66v55.41l-48 48v2.69zM50 53.9v43.51l-48 48V208h26.1a5 5 0 1 1 0 2H0v-65.41l48-48V53.9a5 5 0 1 1 2 0zm-16 16V89.41l-34 34v-2.82l32-32V69.9a5 5 0 1 1 2 0zM12.1 32a5 5 0 1 1 0 2H9.41L0 43.41V40.6L8.59 32h3.51zm265.8 18a5 5 0 1 1 0-2h18.69l7.41-7.41v2.82L297.41 50H277.9zm-16 160a5 5 0 1 1 0-2H288v-71.41l16-16v2.82l-14 14V210h-28.1zm-208 32a5 5 0 1 1 0-2H64v-22.59L40.59 194H21.9a5 5 0 1 1 0-2H41.41L66 216.59V242H53.9zm150.2 14a5 5 0 1 1 0 2H96v-56.6L56.6 162H37.9a5 5 0 1 1 0-2h19.5L98 200.6V256h106.1zm-150.2 2a5 5 0 1 1 0-2H80v-46.59L48.59 178H21.9a5 5 0 1 1 0-2H49.41L82 208.59V258H53.9zM34 39.8v1.61L9.41 66H0v-2h8.59L32 40.59V0h2v39.8zM2 300.1a5 5 0 0 1 3.9 3.9H3.83A3 3 0 0 0 0 302.17V256h18v48h-2v-46H2v42.1zM34 241v63h-2v-62H0v-2h34v1zM17 18H0v-2h16V0h2v18h-1zm273-2h14v2h-16V0h2v16zm-32 273v15h-2v-14h-14v14h-2v-16h18v1zM0 92.1A5.02 5.02 0 0 1 6 97a5 5 0 0 1-6 4.9v-2.07a3 3 0 1 0 0-5.66V92.1zM80 272h2v32h-2v-32zm37.9 32h-2.07a3 3 0 0 0-5.66 0h-2.07a5 5 0 0 1 9.8 0zM5.9 0A5.02 5.02 0 0 1 0 5.9V3.83A3 3 0 0 0 3.83 0H5.9zm294.2 0h2.07A3 3 0 0 0 304 3.83V5.9a5 5 0 0 1-3.9-5.9zm3.9 300.1v2.07a3 3 0 0 0-1.83 1.83h-2.07a5 5 0 0 1 3.9-3.9zM97 100a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-48 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 96a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-144a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM49 36a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM33 68a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 240a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm80-176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm112 176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 180a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 84a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'%3E%3C/path%3E%3C/svg%3E");
+        }
+        </style>
+    
+        <section class="bg-gray-900 pattern">
+            <div class="container px-6 mx-auto">
+                
+                <div class="flex flex-col items-center py-6 lg:h-[32rem] lg:flex-row">
+                    <div class="lg:w-1/2">
+                        <h2 class="text-4xl font-semibold text-gray-100">Brand</h2>
+    
+                        <h3 class="text-2xl font-semibold text-gray-100">
+                            Hello <span class="text-blue-400">Guest</span>
+                        </h3>
+    
+                        <p class="mt-3 text-gray-100">Lorem ipsum dolor sit amet, consectetur adipiscing.</p>
+                    </div>
+    
+                    <div class="flex mt-8 lg:w-1/2 lg:justify-end lg:mt-0">
+                        <div class="max-w-sm bg-white rounded-lg dark:bg-gray-800">
+                            <div class="p-5 text-center">
+                                <h2 class="text-2xl font-semibold text-gray-700 dark:text-white fo">Sign In</h2>
+    
+                                <form action="#">
+                                    <div class="mt-4">
+                                        <input class="block w-full px-4 py-2 text-gray-700 placeholder-gray-400 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-500 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:ring-blue-300 focus:outline-none focus:ring" type="email" placeholder="Email address" aria-label="Email address">
+                                        <input class="block w-full px-4 py-2 mt-4 text-gray-700 placeholder-gray-400 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-500 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:ring-blue-300 focus:outline-none focus:ring" type="password" placeholder="Password" aria-label="Password">
+                                    </div>
+    
+                                    <div class="flex items-center justify-between mt-4">
+                                        <a href="#f" class="text-sm text-gray-600 dark:text-gray-200 hover:underline">Forget Password?</a>
+    
+                                        <button class="px-4 py-2 font-semibold text-white transition-colors duration-200 transform bg-gray-900 rounded-md hover:bg-gray-800 dark:hover:bg-gray-700 focus:outline-none focus:bg-gray-800 dark:focus:bg-gray-700">Login</button>
+                                    </div>
+                                </form>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </section>
+  <!-- hero 23 end -->
+  
+
+
+</body>
+</html>
diff --git a/public/componets/hero/24_hero.html b/public/componets/hero/24_hero.html
new file mode 100644
index 0000000..13bc367
--- /dev/null
+++ b/public/componets/hero/24_hero.html
@@ -0,0 +1,62 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+  <!-- hero 24 start -->
+  <section class="section_divider">
+    <div>Hero 24</div>
+  </section>
+  <section class="text-gray-600 body-font">
+    <div class="container mx-auto flex px-5 py-24 md:flex-row flex-col items-center">
+      <div class="lg:flex-grow md:w-1/2 lg:pr-24 md:pr-16 flex flex-col md:items-start md:text-left mb-16 md:mb-0 items-center text-center">
+        <h1 class="title-font sm:text-4xl text-3xl mb-4 font-medium dark:text-gray-100 text-gray-900">Knausgaard typewriter readymade marfa</h1>
+        <p class="mb-8 leading-relaxed">Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid swag typewriter affogato, hella selvage wolf narwhal dreamcatcher.</p>
+        <div class="flex w-full md:justify-start justify-center items-end">
+          <div class="relative mr-4 md:w-full lg:w-full xl:w-1/2 w-2/4">
+            <label for="hero-field" class="leading-7 text-sm text-gray-600">Email</label>
+            <input type="text" id="hero-field" name="hero-field" class="w-full bg-gray-100 rounded border bg-opacity-50 border-gray-300 focus:ring-2 focus:ring-indigo-200 focus:bg-transparent focus:border-indigo-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out">
+          </div>
+          <button class="inline-flex text-white bg-indigo-500 border-0 py-2 px-6 focus:outline-none hover:bg-indigo-600 rounded text-lg">Button</button>
+        </div>
+        <p class="text-sm mt-2 text-gray-500 mb-8 w-full">Neutra shabby chic ramps, viral fixie.</p>
+        <div class="flex lg:flex-row md:flex-col">
+          <button class="bg-gray-100 inline-flex py-3 px-5 rounded-lg items-center hover:bg-gray-200 focus:outline-none">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="w-6 h-6" viewBox="0 0 512 512">
+              <path d="M99.617 8.057a50.191 50.191 0 00-38.815-6.713l230.932 230.933 74.846-74.846L99.617 8.057zM32.139 20.116c-6.441 8.563-10.148 19.077-10.148 30.199v411.358c0 11.123 3.708 21.636 10.148 30.199l235.877-235.877L32.139 20.116zM464.261 212.087l-67.266-37.637-81.544 81.544 81.548 81.548 67.273-37.64c16.117-9.03 25.738-25.442 25.738-43.908s-9.621-34.877-25.749-43.907zM291.733 279.711L60.815 510.629c3.786.891 7.639 1.371 11.492 1.371a50.275 50.275 0 0027.31-8.07l266.965-149.372-74.849-74.847z"></path>
+            </svg>
+            <span class="ml-4 flex items-start flex-col leading-none">
+              <span class="text-xs text-gray-600 mb-1">GET IT ON</span>
+              <span class="title-font font-medium">Google Play</span>
+            </span>
+          </button>
+          <button class="bg-gray-100 inline-flex py-3 px-5 rounded-lg items-center lg:ml-4 md:ml-0 ml-4 md:mt-4 mt-0 lg:mt-0 hover:bg-gray-200 focus:outline-none">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="w-6 h-6" viewBox="0 0 305 305">
+              <path d="M40.74 112.12c-25.79 44.74-9.4 112.65 19.12 153.82C74.09 286.52 88.5 305 108.24 305c.37 0 .74 0 1.13-.02 9.27-.37 15.97-3.23 22.45-5.99 7.27-3.1 14.8-6.3 26.6-6.3 11.22 0 18.39 3.1 25.31 6.1 6.83 2.95 13.87 6 24.26 5.81 22.23-.41 35.88-20.35 47.92-37.94a168.18 168.18 0 0021-43l.09-.28a2.5 2.5 0 00-1.33-3.06l-.18-.08c-3.92-1.6-38.26-16.84-38.62-58.36-.34-33.74 25.76-51.6 31-54.84l.24-.15a2.5 2.5 0 00.7-3.51c-18-26.37-45.62-30.34-56.73-30.82a50.04 50.04 0 00-4.95-.24c-13.06 0-25.56 4.93-35.61 8.9-6.94 2.73-12.93 5.09-17.06 5.09-4.64 0-10.67-2.4-17.65-5.16-9.33-3.7-19.9-7.9-31.1-7.9l-.79.01c-26.03.38-50.62 15.27-64.18 38.86z"></path>
+              <path d="M212.1 0c-15.76.64-34.67 10.35-45.97 23.58-9.6 11.13-19 29.68-16.52 48.38a2.5 2.5 0 002.29 2.17c1.06.08 2.15.12 3.23.12 15.41 0 32.04-8.52 43.4-22.25 11.94-14.5 17.99-33.1 16.16-49.77A2.52 2.52 0 00212.1 0z"></path>
+            </svg>
+            <span class="ml-4 flex items-start flex-col leading-none">
+              <span class="text-xs text-gray-600 mb-1">Download on the</span>
+              <span class="title-font font-medium">App Store</span>
+            </span>
+          </button>
+        </div>
+      </div>
+      <div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6">
+        <img class="object-cover object-center rounded" alt="hero" src="https://dummyimage.com/720x600">
+      </div>
+    </div>
+  </section>
+
+  <!-- hero 24 end -->
+
+
+</body>
+</html>
diff --git a/public/componets/hero/25_hero.html b/public/componets/hero/25_hero.html
new file mode 100644
index 0000000..2bb4c2b
--- /dev/null
+++ b/public/componets/hero/25_hero.html
@@ -0,0 +1,262 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 6</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+  <!-- hero 25 start -->
+  <section class="section_divider" id="hero_25">
+    <div>Hero 25</div>
+  </section>
+
+  <div class="relative pt-[120px] lg:pt-[150px] pb-[110px] bg-white dark:bg-gray-800">
+    <div class="container mx-auto">
+      <div class="flex flex-wrap -mx-4">
+        <div class="w-full lg:w-5/12 px-4">
+          <div class="hero-content">
+            <h1 class=" text-gray-800 dark:text-gray-300 font-bold text-4xl sm:text-[42px] lg:text-[40px] xl:text-[42px] leading-snug mb-3 " >
+              Kickstart <br />
+              Startup Website <br />
+              with TailGrids.
+            </h1>
+            <p class="text-gray-600 mb-8 text-body-color max-w-[480px]">
+              With TailGrids, business and students thrive together. Business
+              can perfectly match their staffing to changing demand throughout
+              the dayed.
+            </p>
+            <ul class="flex flex-wrap items-center">
+              <li>
+                <a
+                  href="javascript:void(0)"
+                  class="
+                    py-4
+                    px-6
+                    sm:px-10
+                    lg:px-8
+                    xl:px-10
+                    inline-flex
+                    items-center
+                    justify-center
+                    text-center text-white text-base
+                    bg-blue-500
+                    hover:bg-opacity-90
+                    font-normal
+                    rounded-lg
+                  "
+                >
+                  Get Started
+                </a>
+              </li>
+              <li>
+                <a
+                  href="javascript:void(0)"
+                  class="
+                    py-4
+                    px-6
+                    sm:px-10
+                    lg:px-8
+                    xl:px-10
+                    inline-flex
+                    items-center
+                    justify-center
+                    text-center text-base
+                    font-normal
+                    text-body-color
+                    hover:text-blue-300
+                    hover:border-b-blue-300
+                    m-3
+                    border-b-2
+                  "
+                >
+                  <span class="mr-2">
+                    <svg
+                      width="22"
+                      height="22"
+                      viewBox="0 0 22 22"
+                      fill="none"
+                      xmlns="http://www.w3.org/2000/svg"
+                    >
+                      <circle cx="11" cy="11" r="11" fill="#3056D3" />
+                      <rect
+                        x="6.90906"
+                        y="13.3636"
+                        width="8.18182"
+                        height="1.63636"
+                        fill="white"
+                      />
+                      <rect
+                        x="10.1818"
+                        y="6"
+                        width="1.63636"
+                        height="4.09091"
+                        fill="white"
+                      />
+                      <path
+                        d="M11 12.5454L13.8343 9.47726H8.16576L11 12.5454Z"
+                        fill="white"
+                      />
+                    </svg>
+                  </span>
+                  Download App
+                </a>
+              </li>
+            </ul>
+            <div class="clients pt-16">
+              <h6
+                class="
+                  font-normal
+                  text-xs
+                  flex
+                  items-center
+                  text-body-color
+                  mb-2
+                "
+              >
+                Some Of Our Clients
+                <span
+                  class="w-8 h-[1px] bg-body-color inline-block ml-2"
+                ></span>
+              </h6>
+              <div class="flex items-center">
+                <div class="w-full py-3 mr-4">
+                  <svg width="200" class="  w-5/6" height="52" viewBox="0 0 200 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path  opacity="0.56" d="M19.3545 4.27083C19.3545 1.9112 21.2792 0 23.6556 0H25.8061C40.0588 0 51.6126 11.4725 51.6126 25.625V46.9792C51.6126 49.3388 49.6879 51.25 47.3115 51.25H45.161C30.9083 51.25 19.3545 39.7775 19.3545 25.625V4.27083Z" fill="#4A6CF7"/>
+                    <path opacity="0.88" d="M21.5054 51.25C33.3825 51.25 43.0108 41.6894 43.0108 29.8958C43.0108 18.1022 33.3825 8.54163 21.5054 8.54163C9.62829 8.54163 0 18.1022 0 29.8958C0 41.6894 9.62829 51.25 21.5054 51.25Z" fill="#4A6CF7"/>
+                    <path class="dark:fill-white" d="M81.0229 40.7165H88.1982L78.1245 12.8125H70.2804L60.2148 40.7165H67.3079L68.9756 35.7876H79.3546L81.0229 40.7165ZM77.6127 30.5407H70.7595L74.1611 20.3251L77.6127 30.5407ZM101.443 32.4088L96.3315 18.5364H88.76L97.76 39.9612L92.6821 51.25H99.981L113.853 18.5364H106.521L101.443 32.4088ZM123.076 30.4214C123.076 26.6055 124.942 25.4925 128.155 25.4925H130.012V18.2979C127.04 18.2979 124.62 19.8879 123.076 22.2331V18.5364H116.297V40.7165H123.076V30.4214ZM154.891 29.6264C154.891 22.5908 149.904 18.2184 143.397 18.2184C136.94 18.2184 131.903 22.5908 131.903 29.6264C131.903 36.6621 136.825 41.0344 143.323 41.0344C149.821 41.0344 154.891 36.6621 154.891 29.6264ZM138.806 29.6264C138.806 25.8502 140.945 24.1013 143.397 24.1013C145.775 24.1013 147.997 25.8502 147.997 29.6264C147.997 33.3628 145.742 35.1516 143.323 35.1516C140.862 35.1516 138.806 33.3628 138.806 29.6264ZM169.572 30.5009C169.572 37.6955 174.246 40.9947 179.96 40.9947C185.665 40.9947 190.381 37.6955 190.381 30.5009V13.0113H186.772V30.5407C186.772 35.6286 184.08 37.8148 179.993 37.8148C175.914 37.8148 173.181 35.6286 173.181 30.5407V13.0113H169.572V30.5009ZM196.4 40.7165H200V13.0113H196.4V40.7165Z" fill="#2D2D2D"/>
+                    </svg>
+                  <!-- <img src="https://cdn.tailgrids.com/1.0/assets/images/brands/ayroui.svg" class="" alt="ayroui" /> -->
+                </div>
+                <div class="w-full py-3 mr-4">
+                  <svg width="200" class="w-5/6" height="47" viewBox="0 0 200 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M75.5301 31.8596H72.292V14.1332H78.9419C79.745 14.1211 80.5411 14.2857 81.2735 14.6155C81.9469 14.9207 82.5533 15.3562 83.058 15.8967C83.5506 16.4232 83.9405 17.0371 84.2076 17.7071C84.6749 18.8552 84.7468 20.1263 84.4116 21.3198C84.2746 21.8124 84.0683 22.2828 83.7992 22.7175C83.2252 23.6361 82.4073 24.3769 81.4369 24.8569C82.3026 26.038 83.1635 27.2075 84.0197 28.3654C84.8758 29.5233 85.7415 30.6881 86.6168 31.8596H84.0728C83.864 31.8547 83.6572 31.8167 83.4602 31.7473C83.2047 31.6631 82.9615 31.5448 82.7375 31.3957C82.4592 31.2159 82.1982 31.0106 81.9576 30.7827C81.665 30.4961 81.4023 30.1804 81.1735 29.8407L77.9476 25.4863H75.5301V31.8596ZM79.0419 22.223C79.3514 22.2212 79.6566 22.1514 79.9362 22.0187C80.2165 21.8916 80.4691 21.7103 80.6794 21.4853C80.8918 21.2605 81.0612 20.9988 81.1797 20.713C81.3019 20.4261 81.3651 20.1175 81.3654 19.8056C81.3657 19.4884 81.3026 19.1745 81.1797 18.882C81.0602 18.5968 80.8908 18.3352 80.6794 18.1097C80.4685 17.8859 80.2161 17.7054 79.9362 17.5784C79.657 17.4447 79.3515 17.3748 79.0419 17.374H75.5301V22.2107L79.0419 22.223Z" fill="#070707"/>
+                    <path d="M95.2659 14.1326H98.2016L105.955 31.8594H103.936C103.49 31.8634 103.052 31.7393 102.674 31.5019C102.296 31.2649 101.998 30.9194 101.819 30.5108L100.765 28.1118H92.7024L91.6631 30.5108C91.578 30.7105 91.4605 30.8948 91.3153 31.0564C91.1666 31.2207 90.9959 31.3637 90.808 31.4814C90.6177 31.6027 90.411 31.6963 90.1943 31.7593C89.9797 31.8258 89.7562 31.8595 89.5314 31.8594H87.5122L95.2659 14.1326ZM94.1386 24.8566H99.3289L97.013 19.4885C96.9143 19.2709 96.8415 19.0425 96.7962 18.808C96.7593 18.6036 96.7348 18.4442 96.7266 18.338C96.7115 18.498 96.6869 18.657 96.653 18.8141C96.6071 19.045 96.5385 19.2709 96.4484 19.4885L94.1386 24.8566Z" fill="#070707"/>
+                    <path d="M115.276 31.8596H112.019V24.3501C112.023 24.1043 111.964 23.8615 111.847 23.6453C111.708 23.402 111.555 23.1667 111.389 22.9403L104.881 14.1333H107.368C107.867 14.1226 108.361 14.2327 108.809 14.4541C109.227 14.6696 109.583 14.989 109.843 15.3818L113.343 20.1204C113.446 20.2577 113.522 20.4129 113.568 20.578C113.609 20.7334 113.631 20.8335 113.639 20.8744C113.655 20.776 113.678 20.679 113.709 20.5842C113.758 20.4154 113.84 20.2578 113.95 20.1204L117.438 15.3941C117.692 14.9919 118.049 14.6651 118.472 14.4479C118.921 14.2306 119.415 14.1227 119.913 14.1333H122.429L115.904 22.9525C115.806 23.0854 115.718 23.2058 115.646 23.3183C115.572 23.4235 115.504 23.5327 115.442 23.6453C115.385 23.7512 115.342 23.8637 115.313 23.9804C115.283 24.1012 115.268 24.2255 115.27 24.3501L115.276 31.8596Z" fill="#070707"/>
+                    <path d="M140.335 23.3506V30.1609C139.934 30.5302 139.481 30.8405 138.992 31.0823C138.491 31.3291 137.965 31.5238 137.423 31.6633C136.855 31.8079 136.276 31.9067 135.691 31.9588C135.095 32.0119 134.488 32.0384 133.876 32.0384C132.655 32.047 131.447 31.8048 130.326 31.327C129.244 30.87 128.259 30.2127 127.426 29.3905C126.595 28.5677 125.931 27.5938 125.472 26.5224C125 25.4067 124.757 24.209 124.757 22.999C124.757 21.7891 125 20.5913 125.472 19.4756C125.934 18.4006 126.6 17.4241 127.434 16.5994C128.269 15.7777 129.252 15.1206 130.334 14.6629C132.58 13.7299 135.107 13.7167 137.363 14.6262C138.426 15.0662 139.394 15.7002 140.22 16.4955L140.097 16.6076C139.951 16.7537 139.78 16.8726 139.593 16.9581C139.401 17.038 139.195 17.0776 138.988 17.0743C138.702 17.0763 138.423 16.99 138.19 16.8277C137.573 16.4078 136.899 16.0776 136.187 15.8472C135.443 15.6098 134.665 15.4914 133.884 15.4966C133.204 15.494 132.528 15.583 131.872 15.7616C131.24 15.9326 130.633 16.1876 130.069 16.5199C129.511 16.8466 128.995 17.2402 128.535 17.692C128.075 18.1447 127.678 18.6552 127.352 19.2106C127.022 19.7749 126.765 20.3783 126.587 21.0064C126.402 21.6544 126.311 22.3248 126.313 22.998C126.311 23.6723 126.405 24.3436 126.593 24.9915C126.961 26.2492 127.651 27.3907 128.598 28.304C129.068 28.7578 129.592 29.1522 130.159 29.4781C130.736 29.8091 131.355 30.064 131.998 30.2364C132.656 30.4145 133.336 30.5037 134.02 30.5014C134.865 30.5042 135.708 30.3903 136.522 30.163C137.331 29.934 138.102 29.5907 138.813 29.1438V24.8916H137.231C137.028 24.8952 136.827 24.857 136.64 24.7794C136.451 24.702 136.283 24.5867 136.142 24.4412C136.013 24.3031 135.912 24.1419 135.843 23.9663C135.773 23.7847 135.738 23.5919 135.738 23.3976V23.3486L140.335 23.3506Z" fill="#070707"/>
+                    <path d="M147.095 31.8596H145.528V14.1327H151.819C152.495 14.1274 153.165 14.2596 153.788 14.521C154.384 14.7726 154.926 15.1339 155.384 15.5856C155.843 16.0381 156.209 16.5738 156.463 17.1632C156.728 17.7725 156.862 18.4292 156.858 19.0921C156.859 19.6957 156.752 20.2947 156.543 20.8618C156.343 21.4166 156.051 21.935 155.68 22.3964C155.312 22.8488 154.862 23.2287 154.351 23.5162C153.831 23.8094 153.255 23.9924 152.659 24.0537L158.599 31.8596H157.86C157.001 31.8596 156.363 31.5449 155.956 30.9217L150.728 24.0537H147.095V31.8596ZM147.095 15.6776V22.5068H151.819C152.281 22.5097 152.741 22.4194 153.166 22.2411C153.579 22.0695 153.953 21.8211 154.27 21.5096C154.586 21.1969 154.838 20.828 155.015 20.4225C155.2 20.0028 155.294 19.5497 155.291 19.0921C155.294 18.6373 155.2 18.1868 155.015 17.77C154.657 16.9524 153.996 16.3009 153.166 15.9494C152.742 15.7673 152.282 15.6747 151.819 15.6776H147.095Z" fill="#070707"/>
+                    <path d="M164.15 31.8595H162.718V14.1326H164.15V31.8595Z" fill="#070707"/>
+                    <path d="M170.238 31.8594V14.1326H176.76C178.332 14.1264 179.877 14.5451 181.23 15.3444C182.545 16.1201 183.642 17.2161 184.419 18.5301C185.216 19.8855 185.637 21.4295 185.637 23.0022C185.637 24.5747 185.216 26.1188 184.419 27.4743C184.031 28.128 183.564 28.7308 183.027 29.2683C181.943 30.3528 180.595 31.1366 179.117 31.5428C178.35 31.7562 177.557 31.8628 176.76 31.8594H170.238ZM176.76 30.3125C177.743 30.3204 178.717 30.125 179.622 29.7383C180.488 29.3678 181.278 28.8367 181.948 28.1731C182.617 27.5068 183.151 26.7171 183.52 25.8476C183.899 24.9468 184.094 23.9794 184.094 23.0022C184.094 22.0248 183.899 21.0574 183.52 20.1567C183.15 19.2859 182.616 18.4943 181.948 17.8251C181.279 17.1589 180.489 16.6257 179.622 16.2537C178.717 15.8664 177.744 15.6702 176.76 15.6774H171.785V30.3125H176.76Z" fill="#070707"/>
+                    <path d="M196.863 16.4735C196.672 16.3429 196.503 16.2185 196.36 16.1042C196.06 15.8646 195.71 15.6957 195.335 15.6105C195.065 15.5557 194.79 15.5311 194.514 15.5371C194.049 15.5344 193.585 15.6161 193.149 15.7778C192.736 15.9291 192.351 16.1484 192.012 16.4266C191.693 16.6892 191.429 17.0125 191.237 17.3773C191.049 17.7311 190.95 18.1256 190.951 18.5259C190.94 18.9127 191 19.2984 191.133 19.6623C191.264 19.9729 191.477 20.2432 191.748 20.4458C192.093 20.7072 192.473 20.9194 192.878 21.0763C193.345 21.2694 193.923 21.4856 194.61 21.725C194.976 21.8611 195.317 21.9848 195.636 22.0964C195.95 22.2106 196.252 22.329 196.53 22.4472C196.8 22.5605 197.063 22.6879 197.319 22.8287C197.563 22.9662 197.798 23.1211 198.02 23.2919C198.579 23.7069 199.007 24.2736 199.25 24.9241C199.492 25.6026 199.612 26.318 199.603 27.0377C199.615 27.7594 199.457 28.474 199.144 29.1249C198.847 29.7313 198.424 30.2682 197.903 30.6999C197.362 31.1435 196.74 31.4807 196.071 31.6935C195.345 31.929 194.585 32.0454 193.821 32.0383C192.273 32.0383 190.97 31.5813 189.909 30.6672C189.643 30.4261 189.397 30.1641 189.171 29.8839C188.992 29.6579 188.828 29.42 188.681 29.1718L188.866 29.0616C189.102 28.9168 189.372 28.8358 189.649 28.827C189.842 28.8261 190.034 28.8529 190.22 28.9065C190.403 28.9615 190.571 29.0619 190.706 29.1983C190.99 29.4679 191.3 29.7098 191.63 29.9206C191.876 30.0734 192.138 30.1979 192.412 30.2919C192.642 30.3665 192.879 30.4137 193.12 30.4327C193.346 30.449 193.58 30.4612 193.821 30.4694C194.326 30.4853 194.829 30.429 195.316 30.3021C195.802 30.184 196.262 29.9763 196.67 29.69C197.073 29.4058 197.409 29.0366 197.652 28.6087C197.916 28.1291 198.048 27.5884 198.033 27.0419C198.056 26.4826 197.955 25.9251 197.735 25.4097C197.548 25.0165 197.265 24.6754 196.914 24.4161C196.531 24.1446 196.11 23.9301 195.665 23.7796C195.185 23.6096 194.667 23.4177 194.113 23.2042C193.409 22.9247 192.767 22.6635 192.188 22.4269C191.657 22.2149 191.158 21.9299 190.706 21.5801C190.297 21.258 189.969 20.846 189.748 20.3764C189.499 19.7912 189.384 19.1587 189.407 18.524C189.399 17.8698 189.557 17.224 189.866 16.647C190.165 16.0955 190.567 15.6064 191.052 15.2065C191.541 14.8058 192.097 14.4923 192.693 14.2804C193.28 14.0673 193.9 13.9569 194.524 13.9539C195.007 13.9478 195.487 14.0166 195.948 14.1579C196.356 14.2849 196.747 14.4589 197.113 14.6761C197.457 14.879 197.778 15.1169 198.071 15.3861C198.356 15.65 198.619 15.9098 198.859 16.1655L198.473 16.4368C198.369 16.5126 198.255 16.573 198.133 16.6163C197.981 16.6647 197.823 16.6875 197.665 16.6837C197.383 16.6936 197.103 16.6205 196.863 16.4735Z" fill="#070707"/>
+                    <path d="M67.0338 22.3796V29.8101C66.6026 30.242 66.1131 30.6122 65.5792 30.9098C65.0588 31.1994 64.5075 31.4304 63.9356 31.5988C63.3526 31.7689 62.7549 31.8846 62.1503 31.9443C61.5285 32.0074 60.9038 32.0388 60.2788 32.0382C59.0621 32.0479 57.8566 31.8084 56.7368 31.3351C55.6567 30.8769 54.6726 30.221 53.836 29.4012C53.0041 28.5777 52.3395 27.6027 51.8781 26.5293C51.3977 25.4148 51.1542 24.2136 51.1631 23.001C51.1539 21.3962 51.5797 19.8186 52.3957 18.4344C52.7954 17.7633 53.2787 17.1452 53.8339 16.5946C54.9516 15.4873 56.3391 14.6879 57.8606 14.2745C58.6489 14.0583 59.4632 13.9504 60.2807 13.9536C60.9378 13.9525 61.5927 14.0273 62.2325 14.1763C62.8704 14.3239 63.4904 14.5398 64.0816 14.8202C64.6762 15.1073 65.2424 15.4495 65.7724 15.8423C66.3141 16.2415 66.8182 16.6889 67.2783 17.1793L66.5304 17.9336C66.3187 18.1644 66.0592 18.347 65.7698 18.4688C65.4804 18.5905 65.1681 18.6484 64.854 18.6388C64.3997 18.6425 63.9557 18.5045 63.5843 18.2443C63.111 17.9204 62.5935 17.6658 62.0476 17.4879C61.4797 17.3047 60.886 17.213 60.289 17.216C59.5121 17.2132 58.743 17.369 58.0291 17.6739C56.6239 18.258 55.4989 19.3583 54.8878 20.7462C54.5763 21.4552 54.4175 22.2211 54.4214 22.9948C54.4153 23.7819 54.5807 24.5609 54.9063 25.2782C55.3861 26.3286 56.1596 27.2193 57.1346 27.8438C58.1095 28.4683 59.2445 28.8004 60.404 28.8003C60.7995 28.791 61.194 28.7575 61.5854 28.7002C61.9548 28.645 62.3205 28.567 62.6804 28.467C63.0566 28.3638 63.4167 28.2097 63.7507 28.0093V25.5174L62.7235 25.499C62.4152 25.5002 62.1102 25.4346 61.8298 25.3068C61.5561 25.1738 61.3349 24.9537 61.2012 24.6813C61.0195 24.2715 60.9384 23.8244 60.9649 23.3772V22.3856L67.0338 22.3796Z" fill="#070707"/>
+                    <path d="M43.8741 25.8933C45.3307 14.5062 37.2806 4.09427 25.8933 2.63757C14.5063 1.18086 4.09428 9.23106 2.63757 20.6182C1.18087 32.0053 9.23107 42.4173 20.6182 43.874C32.0053 45.3307 42.4173 37.2805 43.8741 25.8933Z" fill="#070707"/>
+                    <path d="M24.0262 22.9287V24.9213H28.3896V28.2541H24.0569V28.2423C23.9411 28.2423 23.8205 28.2541 23.7047 28.2541C23.0611 28.2559 22.4236 28.128 21.8303 27.8783C20.9682 27.5137 20.2294 26.908 19.703 26.1339C19.0564 25.1758 18.7763 24.017 18.9137 22.8694C19.0512 21.7218 19.5971 20.6619 20.4516 19.8837C21.3062 19.1055 22.4123 18.6608 23.5678 18.6309C24.7233 18.6011 25.8508 18.9881 26.7444 19.7212H35.2536C35.1449 19.3809 35.0173 19.0452 34.8826 18.719C34.0291 16.6972 32.6434 14.9446 30.873 13.6477C29.1027 12.3509 27.0137 11.5583 24.8287 11.3543C22.6436 11.1503 20.4441 11.5426 18.4643 12.4894C16.4844 13.4361 14.7983 14.9019 13.5854 16.7309C12.3725 18.5597 11.678 20.6833 11.5761 22.8755C11.4742 25.0677 11.9685 27.2466 13.0065 29.1801C14.0444 31.1137 15.5872 32.7296 17.4707 33.856C19.3542 34.9825 21.5078 35.5772 23.7023 35.5768H35.7571V22.924L24.0262 22.9287ZM28.3896 33.5653H24.3713C24.22 33.5653 24.064 33.5818 23.8985 33.5843H23.5487C21.8065 33.5598 20.1 33.087 18.5937 32.2115C17.0873 31.3359 15.832 30.087 14.9485 28.5853C14.0651 27.0836 13.5835 25.3795 13.55 23.6375C13.5165 21.8955 13.9323 20.1743 14.7575 18.6397C15.5825 17.1051 16.789 15.8089 18.2606 14.8761C19.7321 13.9433 21.4192 13.4053 23.1591 13.314C24.8991 13.2227 26.6332 13.5811 28.1943 14.3548C29.7555 15.1284 31.091 16.2912 32.0721 17.731H27.3968C26.5076 17.1573 25.4969 16.7988 24.4449 16.6839C23.3929 16.569 22.3287 16.701 21.3366 17.0694C20.3447 17.4377 19.4521 18.0323 18.73 18.8058C18.0078 19.5793 17.4761 20.5105 17.1766 21.5255C16.8773 22.5405 16.8187 23.6113 17.0056 24.653C17.1925 25.6945 17.6196 26.6782 18.2529 27.5259C18.8864 28.3736 19.7087 29.0619 20.6547 29.5363C21.6006 30.0106 22.6441 30.258 23.7023 30.2586H28.3896V33.5653ZM33.7835 33.5843H30.3844L30.4034 33.5724H30.3844V30.2632H33.7835V33.5843ZM33.7835 28.2588H30.3844V24.926H33.7835V28.2588Z" fill="#262626"/>
+                    <path d="M23.4375 22.2999V24.2925H27.8032V27.6252H23.4659V27.6135C23.3501 27.6135 23.2295 27.6252 23.1161 27.6252C22.3269 27.6268 21.5496 27.4333 20.8532 27.0622C20.1568 26.6911 19.5628 26.1537 19.1238 25.498C18.6779 24.8334 18.4038 24.0685 18.3262 23.2719C18.2487 22.4753 18.3701 21.6719 18.6794 20.9337C19.0436 20.0705 19.6503 19.3315 20.4262 18.8064C21.0897 18.3591 21.8544 18.0841 22.6509 18.0065C23.4474 17.929 24.2507 18.0512 24.9881 18.362C25.4138 18.5409 25.8118 18.7797 26.17 19.0712H34.6793C34.5681 18.7307 34.4429 18.3951 34.3081 18.069C33.4516 16.0506 32.0644 14.302 30.2938 13.0089C28.5233 11.7157 26.4355 10.9263 24.2523 10.7245C22.0692 10.5227 19.8721 10.916 17.8945 11.8627C15.9168 12.8093 14.2326 14.274 13.0207 16.1011C11.8086 17.9282 11.1142 20.0493 11.011 22.2394C10.9079 24.4296 11.3998 26.6066 12.4347 28.5396C13.4696 30.4725 15.0087 32.0889 16.8886 33.2172C18.7685 34.3456 20.9188 34.9437 23.1114 34.948H35.1661V22.2882L23.4375 22.2999ZM27.8032 32.9365H23.785C23.6314 32.9365 23.4778 32.953 23.3123 32.9554H22.9695C21.2267 32.9335 19.519 32.4628 18.011 31.5887C16.5031 30.7147 15.2458 29.4669 14.3605 27.9655C13.4752 26.4641 12.9917 24.76 12.9567 23.0173C12.9217 21.2748 13.3364 19.5526 14.1607 18.0169C14.9848 16.4812 16.191 15.1839 17.6626 14.2499C19.1343 13.3161 20.8217 12.7771 22.5623 12.6851C24.3028 12.5933 26.0376 12.9514 27.5994 13.7251C29.1612 14.4987 30.4973 15.6619 31.4788 17.1022H26.8081C25.9195 16.524 24.9082 16.1614 23.8546 16.0432C22.8011 15.9249 21.7346 16.0544 20.74 16.4213C19.7453 16.7882 18.8501 17.3822 18.1257 18.1563C17.4011 18.9303 16.8675 19.8627 16.5672 20.8794C16.2668 21.8962 16.208 22.969 16.3955 24.0123C16.5831 25.0557 17.0117 26.0409 17.6473 26.8894C18.2829 27.7379 19.1079 28.4262 20.0565 28.8996C21.0052 29.3728 22.0512 29.6179 23.1114 29.6155H27.7986L27.8032 32.9365ZM33.1972 32.9554H29.7982L29.8147 32.9436H29.7982V29.6155H33.1972V32.9554ZM33.1972 27.63H29.7982V24.2972H33.1972V27.63Z" fill="white"/>
+                    <path d="M27.8035 29.6179H29.7984V30.5657H27.8035V29.6179Z" fill="#999999"/>
+                    <path d="M26.189 24.2926H27.8033V25.2404H29.7959V24.2926H31.259V24.2902H26.189V24.2926Z" fill="#999999"/>
+                    </svg>
+                  <!-- <img
+                    src="https://cdn.tailgrids.com/1.0/assets/images/brands/graygrids.svg"
+                    alt="graygrids"
+                  /> -->
+                </div>
+                <div class="w-full py-3 mr-4">
+                  <svg width="200" class="w-5/6 " height="52" viewBox="0 0 200 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path class="dark:fill-white" d="M184.095 31.7551L199.903 12.6912H192.143L177.969 29.7803V29.6708L171.547 37.4577L170.149 39.152C170.109 39.2195 170.071 39.2888 170.029 39.3563L167.621 42.2593C167.175 42.6648 166.703 43.0415 166.205 43.3827C164.093 44.8297 161.568 45.6708 158.823 45.6716V45.7708C156.996 45.7676 155.271 45.3936 153.697 44.7185C151.331 43.7019 149.308 41.9976 147.883 39.8559C146.459 37.7107 145.629 35.1471 145.628 32.3589C145.628 30.4977 145.997 28.7415 146.664 27.1392C147.665 24.7348 149.344 22.6813 151.455 21.234C153.567 19.7877 156.092 18.9471 158.839 18.9459C161.741 18.9471 164.401 19.8867 166.583 21.4892L170.065 16.6092C166.917 14.2885 163.023 12.9167 158.839 12.9175C156.203 12.9175 153.677 13.4619 151.384 14.4469C147.944 15.9243 145.027 18.3859 142.961 21.4867C140.897 24.5856 139.689 28.3428 139.691 32.3589C139.691 32.4252 139.696 32.4927 139.696 32.5597H139.592C139.592 34.4189 139.223 36.1764 138.555 37.7787C137.553 40.1813 135.876 42.2361 133.767 43.6827C131.654 45.1289 129.128 45.9703 126.383 45.9719C124.549 45.9708 122.82 45.5964 121.241 44.9181C118.874 43.9031 116.851 42.1983 115.425 40.0559C114.759 39.0517 114.223 37.9535 113.841 36.7848C113.596 36.6627 113.33 36.5253 113.049 36.3732C111.696 35.6375 110 34.5639 108.61 33.1548C108.027 32.5629 107.505 31.9783 107.036 31.4125C107.067 31.7897 107.085 32.172 107.085 32.5597C107.085 34.4189 106.717 36.1764 106.048 37.7787C105.048 40.1813 103.369 42.2361 101.259 43.6827C99.1468 45.1289 96.6205 45.9703 93.8753 45.9719C92.0424 45.9708 90.3125 45.5964 88.7333 44.9181C86.3664 43.9031 84.3439 42.1983 82.9191 40.0559C81.4937 37.9115 80.6651 35.3463 80.6645 32.5597C80.6645 30.6995 81.0341 28.9419 81.7013 27.3389C82.7013 24.936 84.3807 22.8825 86.4904 21.4352C88.6029 19.9889 91.128 19.1471 93.8753 19.1465C95.7068 19.1465 97.4372 19.5223 99.0163 20.1995C101.383 21.2155 103.406 22.9197 104.831 25.0617C104.863 25.1105 104.893 25.1597 104.925 25.2092L104.934 25.2057L104.934 25.21L104.943 25.2321C104.944 25.2355 104.947 25.2412 104.948 25.246C105.003 25.3315 105.054 25.4207 105.107 25.5067C105.24 25.8108 105.506 26.3873 105.925 27.1395C105.967 27.2147 106.012 27.2939 106.058 27.3732C106.092 27.4567 106.13 27.5381 106.163 27.6221C106.552 28.2665 107.048 29.0072 107.661 29.8013C107.695 29.8451 107.725 29.8876 107.759 29.9308C108.295 30.6304 108.925 31.3601 109.646 32.0755C109.651 32.0808 109.655 32.0849 109.659 32.0889C109.665 32.0949 109.671 32.0995 109.676 32.1055C109.79 32.2189 109.906 32.3303 110.025 32.442C110.072 32.4849 110.118 32.5281 110.165 32.5707C110.921 33.2676 111.768 33.9415 112.729 34.5469C113.808 35.2279 115.025 35.8192 116.371 36.2444C117.718 36.6708 119.195 36.9291 120.774 36.9536H120.776C120.912 36.9559 121.045 36.9573 121.178 36.9573C123.722 36.9579 126.004 36.5541 128.007 35.8349C129.51 35.2965 130.853 34.5833 132.031 33.7571C133.799 32.5155 135.193 31.0272 136.28 29.5021C137.367 27.974 138.149 26.408 138.72 24.9627C139.156 23.8564 139.38 22.7573 139.38 21.7049C139.38 21.0993 139.307 20.5147 139.169 19.9699C138.931 19.0159 138.504 18.2009 138.029 17.5597C137.312 16.5935 136.509 15.9915 135.885 15.6008C135.255 15.2121 134.785 15.0324 134.645 14.9811L134.635 15.0151C132.133 13.8011 129.329 13.1184 126.383 13.1189C123.747 13.1184 121.22 13.662 118.928 14.6475C116.684 15.612 114.664 16.9956 112.956 18.7016V0.0322266H107.02V16.2941C107.383 16.6467 107.759 17.0291 108.151 17.4465C109.652 19.0493 110.625 20.5981 111.479 22.0227C112.334 23.4512 113.073 24.7457 114.111 25.9273C114.268 26.1083 114.436 26.2863 114.61 26.4631C115.63 24.4373 117.149 22.7036 118.998 21.4352C121.109 19.9889 123.636 19.1471 126.383 19.1465C128.791 19.1471 131.027 19.794 132.969 20.9297L132.992 20.888C133.119 20.9888 133.235 21.1055 133.3 21.2057C133.348 21.2765 133.379 21.3377 133.401 21.4083C133.423 21.4787 133.443 21.5609 133.443 21.7049C133.443 21.8981 133.405 22.2184 133.207 22.7237C132.834 23.6704 132.341 24.6691 131.71 25.6173C131.237 26.3285 130.686 27.0124 130.051 27.6353C129.094 28.5703 127.952 29.3731 126.519 29.9617C125.087 30.5492 123.352 30.9284 121.178 30.9289C121.076 30.9289 120.975 30.9284 120.873 30.9269H120.872C119.974 30.9115 119.165 30.7835 118.414 30.5723C117.104 30.2025 115.966 29.5733 114.966 28.8001C114.617 28.5303 114.287 28.2405 113.975 27.9411C113.975 27.9396 113.975 27.9359 113.977 27.9331C113.827 27.7928 113.684 27.6508 113.543 27.5093C112.723 26.65 112.052 25.7409 111.56 24.958C111.184 24.3621 110.798 23.8656 110.623 23.5124C110.536 23.3349 110.362 23.0597 110.362 23.0597C109.474 21.5727 108.551 20.0615 107.076 18.4853C107.057 18.4644 107.037 18.4472 107.02 18.4261V18.4272C106.262 17.7009 105.449 17.0341 104.582 16.4399C101.53 14.3449 97.8301 13.1173 93.8753 13.1189C91.2392 13.1184 88.7139 13.662 86.4205 14.6475C82.9805 16.1257 80.0628 18.5871 77.9987 21.6875C75.9349 24.7863 74.7259 28.5429 74.7271 32.5597C74.7259 35.2351 75.2623 37.8001 76.2327 40.1269C77.6881 43.6201 80.1123 46.5817 83.1669 48.6775C86.2192 50.7739 89.9191 52.0007 93.8753 52C96.5104 52.0003 99.0369 51.4557 101.329 50.4701C104.769 48.9924 107.686 46.5315 109.751 43.4309C109.881 43.2352 110.007 43.0383 110.13 42.8375C111.556 45.1584 113.447 47.1489 115.673 48.6775C118.726 50.7739 122.426 52.0007 126.383 52C129.017 52.0003 131.543 51.4557 133.836 50.4701C137.273 48.9924 140.193 46.5315 142.256 43.4309C142.4 43.2161 142.539 42.9977 142.672 42.7755C144.089 45.0364 145.947 46.9789 148.132 48.4767C151.184 50.5724 154.883 51.7992 158.839 51.7988C161.472 51.7992 164.001 51.2551 166.292 50.2697C168.436 49.3496 170.375 48.0471 172.032 46.4463V51.8737H177.969V39.1395L180.197 36.4547L192.387 51.8737H200L184.095 31.7551ZM177.969 0.0322266H172.032V32.2655C172.032 33.1399 171.948 33.9905 171.789 34.8151L177.969 27.3235V0.0322266Z" fill="#252F3F"/>
+                    <path d="M34.0189 13.86V29.6573C34.0189 37.0165 29.5688 41.4615 22.8228 41.4615C16.0761 41.4615 11.3399 37.0165 11.3399 29.6573V0H0V29.6573C0 43.1377 8.89879 51.5177 22.8228 51.5177C36.6743 51.5177 45.3589 43.1377 45.3589 29.6573V0H45.1597C39.1795 1.94948 34.7181 7.32973 34.0189 13.86Z" fill="url(#paint0_linear)"/>
+                    <path d="M55.0664 0H54.8716V51.0084H66.2117V13.8703C66.1046 8.20185 61.0501 1.95073 55.0664 0Z" fill="url(#paint1_linear)"/>
+                    <path d="M34.0188 13.86V29.6573C34.0188 29.6668 34.0181 29.6763 34.0181 29.6868C34.0208 29.8439 34.0292 29.9997 34.0292 30.158C34.0292 40.7971 26.1371 49.5599 15.9741 50.7539C18.0892 51.2541 20.3769 51.5177 22.8227 51.5177C36.6741 51.5177 45.3588 43.1377 45.3588 29.6573V0H45.1596C39.1793 1.94948 34.718 7.32973 34.0188 13.86Z" fill="url(#paint2_linear)"/>
+                    <path d="M11.3399 13.8856V0H0V0.00225067C6.02904 1.95524 10.5469 7.33424 11.3399 13.8856Z" fill="url(#paint3_linear)"/>
+                    <path d="M54.8716 35.8926V51.0083H66.0733C59.8266 48.7703 55.2712 42.8986 54.8716 35.8926Z" fill="url(#paint4_linear)"/>
+                      <defs>
+                        <linearGradient id="paint0_linear" x1="38.8079" y1="46.5383" x2="8.58038" y2="-5.02959" gradientUnits="userSpaceOnUse">
+                            <stop stop-color="#2535C5"/>
+                            <stop offset="0.169697" stop-color="#36409B"/>
+                            <stop offset="0.575758" stop-color="#475BC6"/>
+                            <stop offset="1" stop-color="#7075E4"/>
+                        </linearGradient>
+
+                        <linearGradient id="paint1_linear" x1="60.5417" y1="0" x2="60.5417" y2="51.0085" gradientUnits="userSpaceOnUse">
+                          <stop stop-color="#375AD8"/>
+                          <stop offset="0.472727" stop-color="#3C56DD"/>
+                          <stop offset="1" stop-color="#2A1A8F"/>
+                        </linearGradient>
+
+                        <linearGradient id="paint2_linear" x1="30.6663" y1="0" x2="30.6663" y2="51.518" gradientUnits="userSpaceOnUse">
+                          <stop stop-color="#233593"/>
+                          <stop offset="0.472727" stop-color="#4957D7"/>
+                          <stop offset="0.890909" stop-color="#5465FF"/>
+                          <stop offset="1" stop-color="#6A67FF"/>
+                        </linearGradient>
+
+                        <linearGradient id="paint3_linear" x1="4.28592" y1="8.72853" x2="11.4261" y2="-0.208004" gradientUnits="userSpaceOnUse">
+                          <stop stop-color="#3A4A9C"/>
+                          <stop offset="0.327273" stop-color="#475BC6"/>
+                          <stop offset="1" stop-color="#7090E4"/>
+                        </linearGradient>
+
+                        <linearGradient id="paint4_linear" x1="60.8992" y1="42.9276" x2="53.9964" y2="51.1328" gradientUnits="userSpaceOnUse">
+                          <stop stop-color="#2D3792"/>
+                          <stop offset="0.193939" stop-color="#3F2BB8"/>
+                          <stop offset="1" stop-color="#3C38FF"/>
+                        </linearGradient>
+                        
+                      </defs>
+                    </svg>
+                  
+                  <!-- <img src="https://cdn.tailgrids.com/1.0/assets/images/brands/uideck.svg" alt="uideck" /> -->
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+        <div class="hidden lg:block lg:w-1/12 px-4"></div>
+        <div class="w-full lg:w-6/12 px-4">
+          <div class="lg:text-right lg:ml-auto">
+            <div class="relative inline-block z-10 pt-11 lg:pt-0">
+              <img
+                src="https://cdn.tailgrids.com/1.0/assets/images/hero/hero-image-01.png"
+                alt="hero"
+                class="max-w-full lg:ml-auto"
+              />
+              <span class="absolute -left-8 -bottom-8 z-[-1]">
+                <svg
+                  width="93"
+                  height="93"
+                  viewBox="0 0 93 93"
+                  fill="none"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <circle cx="2.5" cy="2.5" r="2.5" fill="#3056D3" />
+                  <circle cx="2.5" cy="24.5" r="2.5" fill="#3056D3" />
+                  <circle cx="2.5" cy="46.5" r="2.5" fill="#3056D3" />
+                  <circle cx="2.5" cy="68.5" r="2.5" fill="#3056D3" />
+                  <circle cx="2.5" cy="90.5" r="2.5" fill="#3056D3" />
+                  <circle cx="24.5" cy="2.5" r="2.5" fill="#3056D3" />
+                  <circle cx="24.5" cy="24.5" r="2.5" fill="#3056D3" />
+                  <circle cx="24.5" cy="46.5" r="2.5" fill="#3056D3" />
+                  <circle cx="24.5" cy="68.5" r="2.5" fill="#3056D3" />
+                  <circle cx="24.5" cy="90.5" r="2.5" fill="#3056D3" />
+                  <circle cx="46.5" cy="2.5" r="2.5" fill="#3056D3" />
+                  <circle cx="46.5" cy="24.5" r="2.5" fill="#3056D3" />
+                  <circle cx="46.5" cy="46.5" r="2.5" fill="#3056D3" />
+                  <circle cx="46.5" cy="68.5" r="2.5" fill="#3056D3" />
+                  <circle cx="46.5" cy="90.5" r="2.5" fill="#3056D3" />
+                  <circle cx="68.5" cy="2.5" r="2.5" fill="#3056D3" />
+                  <circle cx="68.5" cy="24.5" r="2.5" fill="#3056D3" />
+                  <circle cx="68.5" cy="46.5" r="2.5" fill="#3056D3" />
+                  <circle cx="68.5" cy="68.5" r="2.5" fill="#3056D3" />
+                  <circle cx="68.5" cy="90.5" r="2.5" fill="#3056D3" />
+                  <circle cx="90.5" cy="2.5" r="2.5" fill="#3056D3" />
+                  <circle cx="90.5" cy="24.5" r="2.5" fill="#3056D3" />
+                  <circle cx="90.5" cy="46.5" r="2.5" fill="#3056D3" />
+                  <circle cx="90.5" cy="68.5" r="2.5" fill="#3056D3" />
+                  <circle cx="90.5" cy="90.5" r="2.5" fill="#3056D3" />
+                </svg>
+              </span>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+
+<!-- hero 25 end -->
+
+
+</body>
+</html>
diff --git a/public/componets/hero/26_hero.html b/public/componets/hero/26_hero.html
new file mode 100644
index 0000000..e1a24c5
--- /dev/null
+++ b/public/componets/hero/26_hero.html
@@ -0,0 +1,50 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 26</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+     
+  <!-- hero 26 start -->
+  
+  <section class="section_divider" id="hero_26">
+    <div>Hero 26</div>
+  </section>
+
+    <section class="bg-white dark:bg-gray-800">
+    
+    <div class="container flex flex-col px-6 py-4 mx-auto space-y-6 md:h-128 md:py-16 md:flex-row md:items-center md:space-x-6">
+        <div class="flex flex-col items-center w-full md:flex-row md:w-1/2">
+            <div class="flex justify-center order-2 mt-6 md:mt-0 md:space-y-3 md:flex-col">
+                <button class="w-3 h-3 mx-2 bg-blue-500 rounded-full md:mx-0 focus:outline-none"></button>
+                <button class="w-3 h-3 mx-2 bg-gray-300 rounded-full md:mx-0 focus:outline-none hover:bg-blue-500"></button>
+                <button class="w-3 h-3 mx-2 bg-gray-300 rounded-full md:mx-0 focus:outline-none hover:bg-blue-500"></button>
+                <button class="w-3 h-3 mx-2 bg-gray-300 rounded-full md:mx-0 focus:outline-none hover:bg-blue-500"></button>
+            </div>
+
+            <div class="max-w-lg md:mx-12 md:order-2 text-left">
+                <h1 class="text-3xl font-medium tracking-wide text-gray-800 dark:text-white md:text-4xl">The best Apple Watch apps</h1>
+                <p class="mt-4 text-gray-600 dark:text-gray-300">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aut quia asperiores alias vero magnam recusandae adipisci ad vitae laudantium quod rem voluptatem eos accusantium cumque.</p>
+                <div class="mt-6">
+                    <a href="#" class="block px-3 py-2 font-semibold text-center text-white transition-colors duration-200 transform bg-blue-500 rounded-md md:inline hover:bg-blue-400">Download from App Store</a>
+                </div>
+            </div>
+        </div>
+
+        <div class="flex items-center justify-center w-full h-96 md:w-1/2">
+            <img class="object-cover w-full h-full max-w-2xl rounded-md" src="https://images.unsplash.com/photo-1579586337278-3befd40fd17a?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1352&q=80" alt="apple watch photo">
+        </div>
+    </div>
+    </section>
+
+  <!-- hero 26 end -->
+
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/27_hero.html b/public/componets/hero/27_hero.html
new file mode 100644
index 0000000..8aa5cdc
--- /dev/null
+++ b/public/componets/hero/27_hero.html
@@ -0,0 +1,59 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 27</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+  <!-- hero 27 start -->
+  <section class="section_divider" id="hero_27">
+    <div>Hero 27</div>
+  </section>
+    
+  <section class="pt-24 bg-white dark:bg-gray-800">
+    <div class="px-12 mx-auto max-w-7xl">
+        <div class="w-full mx-auto text-left md:w-11/12 xl:w-9/12 md:text-center">
+            <h1 class="mb-8 text-4xl font-extrabold leading-none tracking-normal text-gray-900 md:text-6xl md:tracking-tight">
+                <span>Start</span> <span class="block w-full py-2 text-transparent bg-clip-text leading-12 bg-gradient-to-r from-green-400 to-purple-500 lg:inline">building a buzz</span> <span>around your product 🚀</span>
+            </h1>
+            <p class="px-0 mb-8 text-lg text-gray-600 md:text-xl lg:px-24">
+                Start gaining the traction you've always wanted with our next-level templates and designs. Crafted to help you tell your story.
+            </p>
+            <div class="mb-4 space-x-0 md:space-x-2 md:mb-8">
+                <a href="#_" class="inline-flex items-center justify-center w-full px-6 py-3 mb-2 text-lg text-white bg-green-400 hover:text-gray-800 rounded-2xl sm:w-auto sm:mb-0">
+                    Get Started
+                    <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
+                </a>
+                <a href="#_" class="inline-flex items-center justify-center w-full px-6 py-3 mb-2 text-lg bg-gray-100 hover:text-gray-800 rounded-2xl sm:w-auto sm:mb-0">
+                    Learn More
+                    <svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path></svg>
+                </a>
+            </div>
+        </div>
+        <div class="w-full mx-auto mt-20 text-center md:w-10/12">
+            <div class="relative z-0 w-full mt-8">
+                <div class="relative overflow-hidden shadow-2xl">
+                    <div class="flex items-center flex-none px-4 bg-green-400 rounded-b-none h-11 rounded-xl">
+                        <div class="flex space-x-1.5">
+                            <div class="w-3 h-3 border-2 border-white rounded-full"></div>
+                            <div class="w-3 h-3 border-2 border-white rounded-full"></div>
+                            <div class="w-3 h-3 border-2 border-white rounded-full"></div>
+                        </div>
+                    </div>
+                    <img src="https://cdn.devdojo.com/images/march2021/green-dashboard.jpg">
+                </div>
+            </div>
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 27 end -->
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/28_hero.html b/public/componets/hero/28_hero.html
new file mode 100644
index 0000000..af45d1c
--- /dev/null
+++ b/public/componets/hero/28_hero.html
@@ -0,0 +1,43 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 28</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+  <!-- hero 28 start -->
+  <section class="section_divider" id="hero_28">
+    <div>Hero 28</div>
+  </section>
+  
+  <div class="h-screen ">
+  <div class="bg-green-600 w-full h-full p-28 flex items-center justify-center">
+    <div class="max-w-3xl flex h-full m-4 md:m-6">
+      <div class="relative group sm:w-full md:w-1/2 hover:bg-green-800 border-t border-l border-b border-r md:border-r-0 bg-opacity-5 transition-all duration-300">
+      <nav>
+        <ul class="flex p-4 md:p-6 space-x-6 text-white">
+        <li class="cursor-pointer">Platform</li>
+        <li class="cursor-pointer">Services</li>
+        <li class="cursor-pointer">FAQ</li>
+        <ul></nav>
+      <h1 class="pl-4 md:pl-8 mt-6 md:mt-8 text-2xl text-white font-serif transform group-hover:translate-x-6 duration-300 uppercase leading-snug">Fintech: <br/>Top 5 mobile<br/> payment apps</h1>
+      <p class="absolute bottom-1 p-4 md:pl-8 text-white text-xs">Get our app and link your existing cards to Linkr.<br/> and  pay with your cell phone on the go.<br/> Browse, spending, set limits, and more. Link it up.</span>
+      <div class="absolute z-50 bottom-32 md:bottom-10 right-0 transform translate-x-12 flex items-center justify-center w-20 h-20 rounded-full bg-white group-hover:bg-green-200 text-indigo-800 group-hover:text-gray-800 font-semibold cursor-pointer group-hover:scale-110 duration-300 select-none">Get It!</div>
+      </div>
+    <div class="md:w-1/2 hidden md:block bg-indigo-700">
+      <img src="https://images.unsplash.com/photo-1546621083-17f1e50980e9?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=2800&q=80" alt="mobile payment" class="h-full" />
+    </div>
+  </div>
+  </div>
+  </div>
+  
+  <!-- hero 28 end -->
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/29_hero.html b/public/componets/hero/29_hero.html
new file mode 100644
index 0000000..326eab9
--- /dev/null
+++ b/public/componets/hero/29_hero.html
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 29</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+  <!-- hero 29 start  -->
+  <section class="section_divider">
+    <div>Hero 29</div>
+  </section>
+    
+  <div class="flex flex-wrap md items-center h-screen">
+    <div class="bg-white dark:bg-gray-800 w-full md:w-1/2 h-screen">
+      <div class="mx-32 text-left">
+        <h1 class="text-6xl font-bold mt-16">Tokyo</h1>
+
+        <!-- country region island -->
+        <div class="flex mt-16 font-light text-gray-500">
+          <div class="mr-10">
+            <span class="uppercase">Country</span>
+            <p class="text-2xl text-gray-900 font-semibold pt-2">Japan</p>
+          </div>
+          <div class="pr-4">
+            <span class="uppercase">Region</span>
+            <p class="text-2xl text-gray-900 font-semibold pt-2">Kanto</p>
+          </div>
+          <div class="pr-4">
+            <span class="uppercase">island</span>
+            <p class="text-2xl text-gray-900 font-semibold pt-2">Honshu</p>
+          </div>
+        </div>
+
+        <!-- description -->
+        <div
+          class="description w-full sm: md:w-2/3 mt-16 text-gray-500 text-sm"
+        >
+          Tokyo, Japan’s busy capital, mixes the ultramodern and the
+          traditional, from neon-lit skyscrapers to historic temples. The
+          opulent Meiji Shinto Shrine is known for its towering gate and
+          surrounding woods. The Imperial Palace sits amid large public
+          gardens
+        </div>
+
+        <button class="uppercase mt-5 text-sm font-semibold hover:underline">
+          read more
+        </button>
+      </div>
+    </div>
+    <div class="bg-red-600 w-full md:w-1/2 h-screen">
+      <img
+        src="https://source.unsplash.com/7H77FWkK_x4/1600x900"
+        class="h-screen w-full"
+        alt=""
+      />
+    </div>
+  </div>
+  
+  <!-- hero 29 end  -->
+
+
+</body>
+</html>
diff --git a/public/componets/hero/30_hero.html b/public/componets/hero/30_hero.html
new file mode 100644
index 0000000..b6a1278
--- /dev/null
+++ b/public/componets/hero/30_hero.html
@@ -0,0 +1,39 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 30</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+  <!-- hero 30 start -->
+  <section class="section_divider">
+    <div>Hero 30</div>
+  </section>
+
+	<section id="up" class=" bg-[url(https://images.pexels.com/photos/57690/pexels-photo-57690.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940)] bg-center bg-fixed bg-no-repeat bg-cover h-screen relative">
+		<div class="h-screen bg-opacity-50 bg-black flex items-center justify-center" style="background:rgba(0,0,0,0.5);">
+			<div class="mx-2 text-center">
+				<h1 class="text-gray-100 font-extrabold text-4xl xs:text-5xl md:text-6xl">
+					<span class="text-white">Right</span> Place To
+           </h1>
+           <h2 class="text-gray-200 font-extrabold text-3xl xs:text-4xl md:text-5xl leading-tight">
+            Get a <span class="text-white">Better</span> and <span class="text-white">Professionals</span> Design
+           </h2>
+           <div class="inline-flex">
+           <button class="p-2 my-5 mx-2 bg-indigo-700 hover:bg-indigo-800 font-bold text-white rounded border-2 border-transparent hover:border-indigo-800 shadow-md transition duration-500 md:text-xl">Hire US!</button>
+           <a href="#about"><button class="p-2 my-5 mx-2 bg-transparent border-2 bg-indigo-200 bg-opacity-75 hover:bg-opacity-100 border-indigo-700 rounded hover:border-indigo-800 font-bold text-indigo-800 shadow-md transition duration-500 md:text-lg">Learn More</button></a>
+           </div>
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 30 end -->
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/31_hero.html b/public/componets/hero/31_hero.html
new file mode 100644
index 0000000..f9f684c
--- /dev/null
+++ b/public/componets/hero/31_hero.html
@@ -0,0 +1,80 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 30</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+  <!-- hero 31 start -->
+  <section class="section_divider">
+    <div>Hero 31</div>
+  </section>
+
+
+    <div class="hero bg-gray-100 dark:bg-gray-800 py-16">
+        <!-- container -->
+        <div class="container px-4 sm:px-8 lg:px-16 xl:px-20 mx-auto">
+            <!-- hero wrapper -->
+            <div class="hero-wrapper grid grid-cols-1 md:grid-cols-12 gap-8 items-center">
+
+                <!-- hero text -->
+                <div class="hero-text col-span-6">
+                    <h1 class=" font-bold text-4xl md:text-5xl max-w-xl dark:text-gray-100 text-gray-900 leading-tight text-left"> It's Ok , We Can Only Try</h1>
+                    <hr class=" w-12 h-1 bg-orange-500 rounded-full mt-8">
+                    <p class="text-gray-800 leading-relaxed dark:text-gray-100 mt-8 font-semibold text-left">Your ultimate travel companion. Carries all the information you need while travelling</p>
+                    <div class="get-app flex space-x-5 mt-10 justify-center md:justify-start">
+                        <button class="apple bg-white shadow-md px-3 py-2 rounded-lg flex items-center space-x-4">
+                            <div class="logo">
+                                <svg 
+                                    class="w-6 h-6"
+                                    xmlns="http://www.w3.org/2000/svg" 
+                                    width="419.955" height="512" 
+                                    viewBox="0 0 419.955 512">
+                                    <g transform="translate(-46.022)">
+                                        <path d="M185.255,512c-76.2-.439-139.233-155.991-139.233-235.21,0-129.4,97.075-157.734,134.487-157.734,16.86,0,34.863,6.621,50.742,12.48,11.1,4.087,22.588,8.306,28.975,8.306,3.823,0,12.832-3.589,20.786-6.738,16.963-6.753,38.071-15.146,62.651-15.146h.146c18.354,0,74,4.028,107.461,54.272l7.837,11.777-11.279,8.511c-16.113,12.158-45.513,34.336-45.513,78.267,0,52.031,33.3,72.041,49.292,81.665,7.061,4.248,14.37,8.628,14.37,18.208,0,6.255-49.922,140.566-122.417,140.566-17.739,0-30.278-5.332-41.338-10.034-11.191-4.761-20.845-8.862-36.8-8.862-8.086,0-18.311,3.823-29.136,7.881C221.5,505.73,204.752,512,185.753,512Z"/><path d="M351.343,0c1.888,68.076-46.8,115.3-95.425,112.342C247.9,58.015,304.54,0,351.343,0Z"/>
+                                    </g>
+                                </svg>
+                            </div>
+                            <div class="text">
+                                <p class=" text-xs text-gray-600" style="font-size: 0.5rem;">Download on the</p>
+                                <p class=" text-xs font-semibold text-gray-900">Apple Store</p>
+                            </div>
+                        </button>
+                        <button class="google bg-white shadow-md px-3 py-2 rounded-lg flex items-center space-x-4">
+                            <div class="image">
+                                <svg 
+                                    class="w-6 h-6"
+                                    xmlns="http://www.w3.org/2000/svg" 
+                                    width="436.057" height="469.847" 
+                                    viewBox="0 0 436.057 469.847">
+                                    <g transform="translate(-16.896)">
+                                        <path d="M270.336,234.965,34.39,462.165A40.146,40.146,0,0,1,16.9,428.672V41.258A40.146,40.146,0,0,1,34.39,7.765Z" fill="#2196f3"/><path d="M352.9,155.6l-82.56,79.36L34.39,7.765a31.446,31.446,0,0,1,2.773-1.92A40.363,40.363,0,0,1,77.91,5.2Z" fill="#4caf50"/><path d="M452.95,234.965a40.791,40.791,0,0,1-21.333,36.267L352.9,314.325l-82.56-79.36L352.9,155.6l78.72,43.093A40.791,40.791,0,0,1,452.95,234.965Z" fill="#ffc107"/><path d="M352.9,314.325,77.91,464.725a40.9,40.9,0,0,1-40.747-.64,31.44,31.44,0,0,1-2.773-1.92l235.947-227.2Z" fill="#f44336"/>
+                                    </g>
+                                </svg>
+                            </div>
+                            <div class="text">
+                                <p class="text-xs text-gray-600" style="font-size: 0.5rem;">Download it from</p>
+                                <p class="text-xs font-semibold text-gray-900">Google play</p>
+                            </div>
+                        </button>
+                    </div>
+                </div>
+
+                <!-- hero image -->
+                <div class="hero-image col-span-6">
+                    <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300"><title>#102_travelling_twocolour</title><path d="M81.77,83.39c-28.67,17.47-45.66,49.51-43,83C40.18,183.48,46.54,200,63.35,209c44.83,24,240.55,24.45,269.51-18s18.19-102.84-44.8-128C233.46,41.18,155.82,38.3,81.77,83.39Z" fill="#e6e6e6" opacity="0.3"/><path d="M283.69,206V180.64a4.65,4.65,0,0,1,4.64-4.65h18.49a4.65,4.65,0,0,1,4.64,4.65V206" fill="none" stroke="#ffd200" stroke-miterlimit="10" stroke-width="2"/><path d="M283.69,206V180.64a4.65,4.65,0,0,1,4.64-4.65h18.49a4.65,4.65,0,0,1,4.64,4.65V206" fill="none" stroke="#000" stroke-miterlimit="10" stroke-width="2" opacity="0.08"/><path d="M159.26,145.74s-18.34,7.36-12.41,28.68,6.48,23.63,19.71,22.32,4.66-22.32,4.66-22.32Z" fill="#ffd200"/><path d="M152.37,79.92s-50.86,11.79-64.24,41.59l45.05,3.4,11.54-7Z" fill="#ed8936"/><path d="M152.37,79.92s-50.86,11.79-64.24,41.59l45.05,3.4,11.54-7Z" fill="#fff" opacity="0.46"/><ellipse cx="200.42" cy="272.36" rx="154.08" ry="11.83" fill="#e6e6e6" opacity="0.45"/><path d="M134.79,246.33s-4.45,3.22-8.54.91-7.67.77-4.87,4.13,14.8,5,14.8,5l4.51-7.28Z" fill="#ed8936"/><path d="M215.08,260.56s1.94,5.15,6.62,5.47,6,4.88,1.79,6.14-15.12-4-15.12-4l.26-8.57Z" fill="#ed8936"/><path d="M79.19,260.08s-10.59-2.9-12.89-12.75c0,0,16.41-3.32,16.87,13.62Z" fill="#ed8936" opacity="0.58"/><path d="M80.49,259s-7.4-11.7-.89-22.64c0,0,12.48,7.93,6.93,22.66Z" fill="#ed8936" opacity="0.73"/><path d="M82.4,259s3.9-12.35,15.72-14.69c0,0,2.21,8-7.65,14.73Z" fill="#ed8936"/><polygon points="74.72 258.75 76.86 273.44 90.38 273.5 92.37 258.83 74.72 258.75" fill="#24285b"/><path d="M156.2,53.77s1.74,6.3,4.27,10a3.28,3.28,0,0,0,4.58.82c1.83-1.3,3.93-3.59,3.41-7.08l-.15-6a5.88,5.88,0,0,0-4.6-5C159.34,45.28,155,50,156.2,53.77Z" fill="#f4a28c"/><polygon points="169.43 54.63 177.9 74.3 166.73 78.19 165.05 62.32 169.43 54.63" fill="#f4a28c"/><path d="M170.86,55.92h0a.62.62,0,0,1-.23.72,4.34,4.34,0,0,1-5.25-.1,5.45,5.45,0,0,1-2.08-5.6,25.94,25.94,0,0,1-5.48,2.52,6,6,0,0,1-2,.32l-3.28-4s-4.23-3.66-1.89-5.67,4.76.61,6.11-2.44,1.54-4.07,4.27-3.72.83,3.12,4.53,1.7,4.36.08,5,1.75a3.1,3.1,0,0,1-.12,1.82A20.1,20.1,0,0,0,170.86,55.92Z" fill="#24285b"/><path d="M164.66,56.6s-.83-2.37,1-2.85,3.06,3,.77,4.16Z" fill="#f4a28c"/><path d="M157.5,57.68l-.83,3A1,1,0,0,0,157.85,62l2.51-.43Z" fill="#f4a28c"/><rect x="289.35" y="173.73" width="16.36" height="5.3" fill="#24285b"/><path d="M165.31,64.43s1.44-.49,3.72-3.33c0,0,1.05,4.15-3.26,8Z" fill="#ce8172" opacity="0.31"/><path d="M162.12,76.62l6.43-1.16a90.83,90.83,0,0,0,8.92-2.08c11-3.14,43.37-10.53,52.58,8.2,11.16,22.69-7.47,96.3-7.47,96.3h-51s-10.41-30.66-25.29-49.62S121,88.21,162.12,76.62Z" fill="#ed8936"/><path d="M152.37,79.92s-2.56,16.32,19.86,4l-5.75-8A58,58,0,0,0,152.37,79.92Z" opacity="0.08"/><path d="M94.92,139.7c-10.16-3.16-11.68-17-2.47-22.37a25.2,25.2,0,0,1,10.9-3.2c17.08-1.26,46.18-2.85,46.18-2.85s17.52,5.7,14.77,14.24-15.08-5.06-15.08-5.06S116.66,146.46,94.92,139.7Z" fill="#f4a28c"/><rect x="144.58" y="110.56" width="6.04" height="12.3" transform="translate(-14.69 21.47) rotate(-7.93)" fill="#24285b"/><rect x="143.84" y="109.5" width="6.04" height="3.82" transform="matrix(0.99, -0.14, 0.14, 0.99, -13.96, 21.32)" fill="#ffd200"/><path d="M166.48,75.84s-7.76,7.14,1.21,8.67,9.78-11.13,9.78-11.13Z" fill="#f4a28c"/><path d="M171.63,177.88l-38.45,68.45,9.93,6.91s21.24-35.45,46.53-53.26a6.38,6.38,0,0,1,9.72,3.27c6.84,21.15,7.42,58,7.42,58H218.5l4.08-83.34Z" fill="#24285b"/><path d="M171.63,177.88s19.15-15,25.92-36.41a6.57,6.57,0,0,1,11.08-2.37l18.2,19.68,3.67-20.57L217.19,96.09,192,79.92l-5,19.51Z" opacity="0.08"/><path d="M163.36,158.94s11.81-11.72,14.11-50.86c1.91-32.56,6.58-38.92,16.33-41.2,15.06-3.54,18.65.94,23.39,7.63,0,0-24.08,1.49-23.24,16.56s-2.51,68.75-22.32,86.81C171.63,177.88,162.44,177.11,163.36,158.94Z" fill="#ffd200"/><path d="M163.36,158.94s11.81-11.72,14.11-50.86c1.91-32.56,6.58-38.92,16.33-41.2,15.06-3.54,18.65.94,23.39,7.63,0,0-24.08,1.49-23.24,16.56s-2.51,68.75-22.32,86.81C171.63,177.88,162.44,177.11,163.36,158.94Z" fill="#fff" opacity="0.46"/><path d="M196.37,93.76c-5-12,8.93-27.14,21-22.46,10.32,4,21.35,12.84,27.34,30.64C258.94,144.25,291,164.7,291,164.7s16.36,2.7,16.36,8.65-19.34,0-19.34,0-50.2-20.83-76.24-54.3C204,109,199.22,100.59,196.37,93.76Z" fill="#f4a28c"/><path d="M226.35,134.56s19.94-6.75,25-16.62c0,0-7.22-38.91-32.87-47.28-8.44-2.75-17.87.34-22.29,8C190.83,88,192,105.22,226.35,134.56Z" fill="#ed8936"/><path d="M226.35,134.56s19.94-6.75,25-16.62c0,0-7.22-38.91-32.87-47.28-8.44-2.75-17.87.34-22.29,8C190.83,88,192,105.22,226.35,134.56Z" fill="#fff" opacity="0.46"/><rect x="271.49" y="198.46" width="52.16" height="67.53" fill="#ffd200"/><rect x="278.47" y="265.99" width="6.37" height="6.37" fill="#24285b"/><rect x="309.43" y="265.99" width="6.37" height="6.37" fill="#24285b"/><rect x="280.14" y="211.01" width="7.25" height="40.35" opacity="0.08"/><rect x="293.95" y="211.01" width="7.25" height="40.35" opacity="0.08"/><rect x="306.92" y="211.01" width="7.25" height="40.35" opacity="0.08"/><circle cx="222.58" cy="34.77" r="21.04" fill="#24285b"/><polygon points="214.44 34.77 196.44 52.7 220.3 43.18 214.44 34.77" fill="#24285b"/><rect x="220.3" y="25.3" width="3.51" height="11.08" fill="#fff"/><rect x="220.3" y="39.43" width="3.51" height="3.51" fill="#fff"/></svg>
+                </div>
+            </div>
+        </div>
+    </div>
+        
+  <!-- hero 31 end -->
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/32_hero.html b/public/componets/hero/32_hero.html
new file mode 100644
index 0000000..834f148
--- /dev/null
+++ b/public/componets/hero/32_hero.html
@@ -0,0 +1,54 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 30</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+<!-- hero 32 start -->
+<section class="section_divider">
+    <div>Hero 32</div>
+  </section>
+  
+  <div class="relative bg-white dark:bg-gray-800 overflow-hidden">
+    <div class="max-w-7xl mx-auto">
+      <div class="relative z-10 pb-8  pt-10 dark:bg-gray-800 bg-white sm:pb-16 md:pb-20 lg:max-w-2xl lg:w-full lg:pb-28 xl:pb-32">
+        <svg class="hidden lg:block absolute right-0 inset-y-0 h-full w-48 dark:text-gray-800 text-white transform translate-x-1/2" fill="currentColor" viewBox="0 0 100 100" preserveAspectRatio="none" aria-hidden="true">
+          <polygon points="50,0 100,0 50,100 0,100" />
+        </svg>
+  
+        <main class="mt-10 mx-auto max-w-7xl px-4 sm:mt-12 sm:px-6 md:mt-16 lg:mt-20 lg:px-8 xl:mt-28">
+          <div class="sm:text-center lg:text-left">
+            <h1 class="text-4xl tracking-tight font-extrabold text-gray-900 sm:text-5xl md:text-6xl">
+              <span class="block xl:inline">Data to enrich your</span>
+              <span class="block text-indigo-600 xl:inline">online business</span>
+            </h1>
+            <p class="mt-3 text-base text-gray-500 sm:mt-5 sm:text-lg sm:max-w-xl sm:mx-auto md:mt-5 md:text-xl lg:mx-0">Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat fugiat aliqua.</p>
+            <div class="mt-5 sm:mt-8 sm:flex sm:justify-center lg:justify-start">
+              <div class="rounded-md shadow">
+                <a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 md:py-4 md:text-lg md:px-10"> Get started </a>
+              </div>
+              <div class="mt-3 sm:mt-0 sm:ml-3">
+                <a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-200 md:py-4 md:text-lg md:px-10"> Live demo </a>
+              </div>
+            </div>
+          </div>
+        </main>
+      </div>
+    </div>
+    <div class="lg:absolute lg:inset-y-0 lg:right-0 lg:w-1/2">
+      <img class="h-56 w-full object-cover sm:h-72 md:h-96 lg:w-full lg:h-full" src="https://images.unsplash.com/photo-1551434678-e076c223a692?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80" alt="">
+    </div>
+  </div>
+  
+  
+  <!-- hero 32 end -->
+  
+
+
+</body>
+</html>
diff --git a/public/componets/hero/33_hero.html b/public/componets/hero/33_hero.html
new file mode 100644
index 0000000..5f4996f
--- /dev/null
+++ b/public/componets/hero/33_hero.html
@@ -0,0 +1,75 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 30</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+
+  <!-- hero 33 start -->
+  <section class="section_divider">
+    <div>Hero 33</div>
+  </section>
+
+    
+  <div class="dark:bg-gray-900">
+    <!--- more free and premium Tailwind CSS components at https://tailwinduikit.com/ --->
+    <div class="container mx-auto py-9 md:py-12 lg:py-24">
+      <div class="flex flex-col lg:flex-row justify-center items-strech mx-4">
+        <div class="lg:w-4/12 flex justify-center items-center">
+          <div>
+            <h1 class="dark:text-white text-4xl md:text-5xl xl:text-6xl font-semibold text-gray-900 w-7/12 text-left">Amoire</h1>
+            <p class="dark:text-gray-300 md:w-7/12 lg:w-11/12 xl:w-10/12 mt-4 lg:mt-5 text-base leading-normal text-gray-600 text-left">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using.</p>
+          </div>
+        </div>
+        <div class="lg:w-8/12 mt-6 md:mt-8 lg:mt-0">
+          <div class="relative w-full h-full">
+            <img src="https://i.ibb.co/gmV2mLr/pexels-maksim-goncharenok-4352247-1-1-1.png" alt="A lounge sofa" role="img" class="w-full  relative hidden lg:block" />
+            <img src="https://i.ibb.co/Mhgkt2f/pexels-maksim-goncharenok-4352247-1-1-1.png" alt="A lounge sofa" role="img" class="w-full h-full lg:hidden" />
+            <div class="hidden lg:block absolute bottom-0 right-0 bg-red-200 w-1/2">
+              <button class="dark:hover:bg-gray-800 dark:bg-white dark:hover:text-gray-50 dark:text-gray-800 bg-gray-800 text-xl xl:text-2xl font-medium text-white flex justify-between w-full items-center p-5 xl:p-6 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-800 hover:bg-gray-700">
+                Discover More
+                <div>
+                  <svg class="fill-stroke dark:hover:text-gray-600" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M6.66663 16H25.3333" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M20 21.3333L25.3333 16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M20 10.667L25.3333 16.0003" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                  </svg>
+                </div>
+              </button>
+            </div>
+          </div>
+          <div class="mt-6 md:mt-8 lg:hidden">
+            <button class="dark:hover:bg-gray-800 dark:bg-white dark:hover:text-gray-50 dark:text-gray-800 bg-gray-800 text-base md:text-xl font-semibold leading-tight text-white flex justify-between items-center px-5 py-4 lg:py-7 lg:px-7 w-full md:w-5/12 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-800 hover:bg-gray-700">
+              Discover More
+              <div>
+                <svg class="fill-stroke" width="22" height="24" viewBox="0 0 22 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                  <g clip-path="url(#clip0)">
+                    <path d="M0.453735 12H14.4537" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M10.4539 16L14.4539 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M10.4539 8L14.4539 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                  </g>
+                  <defs>
+                    <clipPath id="clip0">
+                      <rect width="21.7269" height="24" fill="white" />
+                    </clipPath>
+                  </defs>
+                </svg>
+              </div>
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- hero 33 end -->
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/34_hero.html b/public/componets/hero/34_hero.html
new file mode 100644
index 0000000..feee572
--- /dev/null
+++ b/public/componets/hero/34_hero.html
@@ -0,0 +1,15 @@
+<!DOCTYPE html>
+<html lang="en" class="">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Hero 30</title>
+    <link rel="stylesheet" href="./../../../dist/tailshape.css">
+</head>
+<body>
+
+
+
+</body>
+</html>
diff --git a/public/componets/hero/hero.html b/public/componets/hero/hero.html
index 697e8a5..6a29ee1 100644
--- a/public/componets/hero/hero.html
+++ b/public/componets/hero/hero.html
@@ -100,7 +100,7 @@
     <!-- hero 2 end -->
 
     <!-- hero 3 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_3">
       <div>Hero 3</div>
     </section>
     
@@ -142,7 +142,7 @@
     <!-- hero 3 end -->
 
     <!-- hero 4 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_4">
       <div>Hero 4</div>
     </section>
 
@@ -174,7 +174,7 @@
 
     
     <!-- hero 5 start -->
-    <section class="section_divider" id="hero_2">
+    <section class="section_divider" id="hero_5">
       <div>Hero 5</div>
     </section>
             
@@ -200,7 +200,7 @@
     <!-- hero 5 end -->
       
     <!-- hero 6 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_6">
       <div>Hero 6</div>
     </section>
       
@@ -258,8 +258,8 @@
                 </h1>
                 <p class="mt-6 text-base text-gray-600 xl:text-lg s">Your guide to mental health and happiness. How about
                     try to meditate? Start to meditate just 5 min per day and see the results.</p>
-                <div class="items-center justify-center m-10 rflex">
-                    <a href="#_" class="flex items-center self-start justify-center px-5 py-3 text-base font-medium leading-tight text-white bg-blue-800 border border-transparent rounded-lg shadow md:py-4 md:text-lg xl:text-xl md:px-10">
+                <div class=" mt-10 ">
+                    <a href="#_" class=" px-5 py-3 text-base font-medium leading-tight text-white bg-blue-800 border border-transparent rounded-lg shadow md:py-4 md:text-lg xl:text-xl md:px-10">
                         Come with us
                     </a>
                 </div>
@@ -273,7 +273,7 @@
     <!-- hero 7 end -->
 
     <!-- hero 8 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_8">
       <div>Hero 8</div>
     </section>
 
@@ -313,7 +313,7 @@
     <!-- hero 8 end -->
 
     <!-- hero 9 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_9">
       <div>Hero 9</div>
     </section>
     
@@ -384,7 +384,7 @@
     <!-- hero 9 end -->
 
     <!-- hero 10 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_10">
       <div>Hero 10</div>
     </section>
         
@@ -436,7 +436,7 @@
 
     
     <!-- hero 11 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_11">
       <div>Hero 11</div>
     </section>
     
@@ -455,7 +455,7 @@
     <!-- hero 11 end -->
 
     <!-- hero 12 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_12">
       <div>Hero 12</div>
     </section>
 
@@ -491,7 +491,7 @@
 
 
     <!-- hero 13 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_13">
       <div>Hero 13</div>
     </section>
         
@@ -533,7 +533,7 @@
     <!-- hero 13 end -->
 
     <!-- hero 14 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_14">
       <div>Hero 14</div>
     </section>
 
@@ -544,7 +544,7 @@
   <!-- hero 14 end -->
 
   <!-- hero 15 start -->
-    <section class="section_divider">
+    <section class="section_divider" id="hero_15">
       <div>Hero 15</div>
     </section>
 
@@ -563,6 +563,1009 @@
 
   <!-- hero 15 end -->
 
+
+  <!-- hero 16 start -->
+    <section class="section_divider">
+      <div>Hero 16</div>
+    </section>
+    <section class= " dark:bg-gradient-to-b dark:from-emerald-600 dark:to-cyan-800 pb-5">
+      <div class="">
+        <div class="container flex flex-col items-center px-4 py-16 pb-24 mx-auto text-center lg:pb-56 md:py-32 md:px-10 lg:px-32 dark:text-coolGray-900">
+          <h1 class="text-5xl font-bold leading-none sm:text-6xl xl:max-w-3xl dark:text-coolGray-900">Provident blanditiis wlk exercitationem</h1>
+          <p class="mt-6 mb-8 text-lg sm:mb-12 xl:max-w-3xl dark:text-gray-900">Cupiditate minima voluptate temporibus quia? Architecto beatae esse ab amet vero eaque explicabo!</p>
+          <div class="flex flex-wrap justify-center">
+            <button type="button" class="px-8 py-3 m-2 text-lg font-semibold transition duration-500 border-b-2  hover:rounded hover:border border-gray-300 dark:border-x-0 dark:border-y-0 dark:rounded dark:bg-gray-800 dark:text-gray-50 dark:hover:border-x-2 dark:hover:border-y-2 dark:hover:bg-transparent dark:hover:text-gray-800 dark:hover:border-gray-800 ">Get started</button>
+            <button type="button" class="px-8 py-3 m-2 text-lg transition duration-500 border rounded hover:border-b-2 hover:border-t-0 hover:border-x-0 hover:rounded-none dark:hover:rounded  dark:border-gray-700 dark:text-gray-900 dark:hover:bg-gray-800 dark:hover:text-gray-50">Learn more</button>
+          </div>
+        </div>
+      </div>
+      <!-- <img src="https://source.unsplash.com/random/480x320" alt="" class="w-5/6 mx-auto mb-12 -mt-20 rounded-lg shadow-md lg:-mt-40 dark:bg-gray-800"> -->
+      <img src="https://images.unsplash.com/photo-1645119675435-fc5b106eddeb?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=320&ixid=MnwxfDB8MXxyYW5kb218MHx8fHx8fHx8MTY0NTMzODQyMQ&ixlib=rb-1.2.1&q=80&w=480" class=" w-3/6 mx-auto mb-12 -mt-20 rounded-lg shadow-md lg:-mt-40 dark:bg-gray-800" alt="">
+    </section>
+  
+  <!-- hero 16 end -->
+
+  <!-- hero 17 start  -->
+  <section class="section_divider">
+    <div>Hero 17</div>
+  </section>
+  
+  <section class="py-20 dark:bg-gray-800 dark:text-gray-100">
+    <div class="container grid gap-6 mx-auto text-center lg:grid-cols-2 xl:grid-cols-5">
+      <div class=" mx-auto px-6 pt-20 pb-20 rounded-md sm:px-12 md:px-16 xl:col-span-2 dark:bg-gray-900">
+        <span class="block mb-2 dark:text-indigo-400">Some design system</span>
+        <h1 class="text-5xl font-extrabold dark:text-gray-50">Build it with Some Company</h1>
+        <p class="my-8">
+          <span class="font-medium dark:text-indigo-400 ">Modular and versatile.</span>Fugit vero facilis dolor sit neque cupiditate minus esse accusamus cumque at.
+        </p>
+        <form novalidate="" action="" class="self-stretch space-y-3">
+          <div class="pb-3">
+            <label for="name" class="text-sm sr-only">Your name</label>
+            <input id="name" type="text" placeholder="Your name" class="w-full py-2 px-2 text-gray-800 outline-none dark:rounded-md border-b-2 border-b-gray-800 dark:border-gray-700">
+          </div>
+          <div class="pb-3">
+            <label for="lastname" class="text-sm sr-only">Email address</label>
+            <input id="lastname" type="text" placeholder="Email address" class="w-full py-2 px-2 text-gray-800 outline-none dark:rounded-md  border-b-2 border-b-gray-800  dark:border-gray-700">
+          </div>
+          <button type="button" class="w-full py-2 font-semibold rounded bg-gray-800 text-gray-50 dark:bg-indigo-400 dark:text-gray-900">Join the waitlist</button>
+        </form>
+      </div>
+      <!-- <img src="https://source.unsplash.com/random/480x360" alt="" class="object-cover w-full rounded-md xl:col-span-3 dark:bg-coolGray-500"> -->
+      <img src="https://images.unsplash.com/photo-1643609186613-e9e96efeb9ec?crop=entropy&cs=tinysrgb&fit=crop&fm=jpg&h=360&ixid=MnwxfDB8MXxyYW5kb218MHx8fHx8fHx8MTY0NTM0MDIzNQ&ixlib=rb-1.2.1&q=80&w=480" alt="" class="object-cover w-5/6 my-auto mx-auto rounded-md xl:col-span-3 dark:bg-gray-500">
+    </div>
+  </section>
+
+
+  <!-- hero 17 end -->
+
+  <!-- hero 18 start  -->
+  <section class="section_divider">
+    <div>Hero 18</div>
+
+    <section class="bg-white dark:bg-gray-800">
+      
+      <div class="container px-6 py-16 mx-auto">
+          <div class=" lg:flex">
+              <div class="w-full lg:w-1/2">
+                  <div class="lg:max-w-lg">
+                      <h1 class="text-2xl font-semibold text-gray-800 uppercase dark:text-white lg:text-3xl">Best Place To Choose Your Clothes</h1>
+                      <p class="mt-2 text-gray-600 dark:text-gray-400">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Porro beatae error laborum ab amet sunt recusandae? Reiciendis natus perspiciatis optio.</p>
+                      <button class="w-full px-3 py-2 mt-6 text-xs font-medium text-white uppercase transition-colors duration-200 transform bg-blue-600 rounded-md lg:w-auto hover:bg-blue-500 focus:outline-none focus:bg-blue-500">Shop Now</button>
+                  </div>
+              </div>
+      
+              <div class="flex items-center justify-center w-full mt-6 lg:mt-0 lg:w-1/2">
+                  <img class="w-full h-full lg:max-w-2xl" src="https://merakiui.com/_nuxt/img/Catalogue-pana.32658f1.svg" alt="Catalogue-pana.svg">
+              </div>
+          </div>
+      </div>
+    </section>
+
+  <!-- hero 18 end  -->
+
+<!-- hero 19 start -->
+<section class="section_divider">
+  <div>Hero 19</div>
+</section>
+
+<section class="bg-white dark:bg-gray-800">
+
+  <div class="container px-6 py-16 mx-auto">
+      <div class="items-center lg:flex">
+          <div class="w-full lg:w-1/2">
+              <div class="lg:max-w-lg text-left">
+                  <h1 class="text-2xl font-semibold text-gray-800 dark:text-white lg:text-3xl">Subscribe To The <span class="text-blue-500">Newsletter</span></h1>
+
+                  <p class="mt-4 text-gray-600 dark:text-gray-400">be the first to knows when our <span class="font-medium text-blue-500">Brand</span> is live</p>
+
+                  <div class="flex flex-col mt-8 space-y-3 lg:space-y-0 lg:flex-row">
+                      <input id="email" type="text" class="px-4 py-2 text-gray-700 bg-white border rounded-md dark:bg-gray-800 dark:text-gray-300 dark:border-gray-600 focus:border-blue-400 dark:focus:border-blue-300 focus:outline-none focus:ring focus:ring-opacity-40 focus:ring-blue-300" placeholder="Email Address">
+                      
+                      <button class="w-full px-4 py-2 text-sm font-medium tracking-wide text-white capitalize transition-colors duration-200 transform bg-blue-500 rounded-lg lg:w-auto lg:mx-4 hover:bg-blue-400 focus:outline-none focus:bg-blue-400">
+                          Subscribe
+                      </button>
+                  </div>
+              </div>
+          </div>
+  
+          <div class="flex items-center justify-center w-full mt-6 lg:mt-0 lg:w-1/2">
+              <img class="w-full h-full max-w-md" src="https://merakiui.com/_nuxt/img/Email-campaign-bro.882e33f.svg" alt="#">
+          </div>
+      </div>
+  </div>
+</section>
+
+<!-- hero 19 end -->
+
+
+
+<!-- hero 20 start -->
+<section class="section_divider">
+  <div>Hero 20</div>
+</section>
+
+<section class="bg-white dark:bg-gray-800">
+ 
+  <div class="container px-6 py-16 mx-auto text-center">
+      <div class="max-w-lg mx-auto">
+          <h1 class="text-3xl font-bold text-gray-800 dark:text-white md:text-4xl">Create beautiful website layout with Meraki UI.</h1>
+          
+          <p class="mt-6 text-gray-500 dark:text-gray-300">
+              Lorem ipsum dolor sit, amet consectetur adipisicing elit. Libero similique obcaecati illum mollitia.
+          </p>
+
+          <div class="w-full max-w-sm mx-auto mt-6 bg-transparent border rounded-md dark:border-gray-700 focus-within:border-blue-400 focus-within:ring focus-within:ring-blue-300 dark:focus-within:border-blue-300 focus-within:ring-opacity-40">
+              <form class="flex flex-col md:flex-row">
+                  <input type="email" placeholder="Enter your email address" class="flex-1 h-10 px-4 py-2 m-1 text-gray-700 placeholder-gray-400 bg-transparent border-none appearance-none dark:text-gray-200 focus:outline-none focus:placeholder-transparent focus:ring-0" /> 
+                  
+                  <button type="button" class="h-10 px-4 py-2 m-1 text-white transition-colors duration-200 transform bg-blue-500 rounded-md hover:bg-blue-400 focus:outline-none focus:bg-blue-400">
+                      Join Us
+                  </button>
+              </form>
+          </div>
+      </div>
+
+      <div class="max-w-screen-xl mx-auto mt-20">
+          <div class="grid grid-cols-2 gap-8 md:grid-cols-6 lg:grid-cols-5">
+              <div class="flex items-center justify-center col-span-1 md:col-span-2 lg:col-span-1">
+                  <svg class="h-12 text-gray-500 fill-current dark:text-gray-300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 266 100"><path fill="none" d="M0 0h266v100H0z"></path><path d="M140.021 49.597c-1.784 0-3.07.585-4.374 1.181v13.486c1.249.119 1.965.119 3.15.119 4.282 0 4.869-1.961 4.869-4.699v-6.441c0-2.022-.671-3.646-3.645-3.646zm-28.438-.736c-2.971 0-3.649 1.631-3.649 3.651v1.135h7.294v-1.135c0-2.02-.678-3.651-3.645-3.651zm-55.09 14.037c0 1.598.754 2.428 2.418 2.428 1.785 0 2.842-.582 4.145-1.18v-3.199h-3.903c-1.848 0-2.66.344-2.66 1.951zm111.191-13.301c-2.976 0-4.007 1.624-4.007 3.646v7.379c0 2.027 1.031 3.656 4.007 3.656 2.968 0 4.007-1.629 4.007-3.656v-7.379c-.001-2.022-1.04-3.646-4.007-3.646zM41.909 71.172h-8.748V49.998H28.79v-7.296h4.372V38.32c0-5.953 2.467-9.492 9.479-9.492h5.838v7.298H44.83c-2.73 0-2.91 1.02-2.91 2.923l-.011 3.652h6.61l-.773 7.296h-5.837v21.175zm29.897.055h-7.291l-.315-1.844c-3.329 1.844-6.3 2.143-8.26 2.143-5.347 0-8.193-3.572-8.193-8.512 0-5.828 3.321-7.908 9.262-7.908h6.047v-1.26c0-2.975-.341-3.848-4.916-3.848h-7.48l.731-7.296h8.176c10.038 0 12.239 3.171 12.239 11.203v17.322zm24.793-20.694c-4.537-.778-5.84-.949-8.023-.949-3.921 0-5.106.865-5.106 4.195v6.299c0 3.33 1.185 4.199 5.106 4.199 2.183 0 3.486-.174 8.023-.955v7.117c-3.974.891-6.563 1.125-8.751 1.125-9.392 0-13.125-4.939-13.125-12.074v-5.111c0-7.141 3.733-12.089 13.125-12.089 2.188 0 4.777.235 8.751 1.13v7.113zm27.376 8.957h-16.042v.588c0 3.33 1.186 4.199 5.106 4.199 3.524 0 5.675-.174 10.204-.955v7.117c-4.368.891-6.644 1.125-10.929 1.125-9.393 0-13.128-4.939-13.128-12.074v-5.844c0-6.243 2.771-11.356 12.396-11.356s12.393 5.054 12.393 11.356v5.844zm28.437.135c0 6.896-1.971 11.926-13.911 11.926-4.312 0-6.841-.379-11.6-1.111V31.02l8.745-1.459V43.35c1.89-.702 4.336-1.059 6.562-1.059 8.746 0 10.203 3.921 10.203 10.222v7.112zm28.033.15c0 5.949-2.456 11.719-12.732 11.719-10.281 0-12.783-5.77-12.783-11.719v-5.744c0-5.952 2.502-11.723 12.783-11.723 10.276 0 12.732 5.771 12.732 11.723v5.744zm28.014 0c0 5.949-2.459 11.719-12.733 11.719-10.281 0-12.783-5.77-12.783-11.719v-5.744c0-5.952 2.502-11.723 12.783-11.723 10.274 0 12.733 5.771 12.733 11.723v5.744zm28.749 11.397h-9.479l-8.017-13.383v13.383h-8.748V31.019l8.748-1.459v25.849l8.017-12.707h9.479l-8.752 13.867 8.752 14.603zm-41.512-21.575c-2.971 0-4.002 1.624-4.002 3.646v7.379c0 2.027 1.031 3.656 4.002 3.656 2.967 0 4.017-1.629 4.017-3.656v-7.379c0-2.022-1.05-3.646-4.017-3.646zm46.505 16.581c1.473 0 2.646 1.201 2.646 2.701 0 1.523-1.174 2.711-2.657 2.711-1.476 0-2.673-1.188-2.673-2.711 0-1.5 1.197-2.701 2.673-2.701h.011zm-.011.42c-1.187 0-2.158 1.021-2.158 2.281 0 1.283.972 2.291 2.169 2.291 1.198.012 2.155-1.008 2.155-2.279s-.957-2.293-2.155-2.293h-.011zm-.503 3.853h-.48v-3.014c.252-.035.492-.07.852-.07.456 0 .754.096.937.227.177.133.272.336.272.623 0 .398-.262.637-.585.734v.023c.263.049.442.287.503.73.07.469.143.648.19.746h-.503c-.071-.098-.144-.373-.204-.77-.07-.383-.264-.527-.648-.527h-.333v1.298zm0-1.668h.348c.394 0 .729-.145.729-.518 0-.264-.19-.527-.729-.527-.157 0-.266.012-.348.023v1.022z"></path></svg>
+              </div>
+
+              <div class="flex items-center justify-center col-span-1 md:col-span-2 lg:col-span-1">
+                  <svg class="h-10 text-gray-500 fill-current dark:text-gray-300" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 316 60"><g transform="translate(9.259 4.552) scale(.4941)"><path d="M52.1 102.1V82.5c20.8 0 36.8-20.6 28.9-42.4-3-8.1-9.4-14.6-17.5-17.5-21.8-7.9-42.4 8.1-42.4 28.9H1.5c0-33.1 32-58.9 66.7-48.1 15.2 4.7 27.2 16.8 31.9 31.9 10.8 34.8-14.9 66.8-48 66.8z"></path><path d="M32.6 63h19.5v19.5H32.6zm-15 34.5v-15h15v15h-15zM5 70h12.6v12.5H5z" fill-rule="evenodd"></path><path d="M181.5 30.2c-5.8-4-13-6.1-21.4-6.1h-18.3v58.1h18.3c8.4 0 15.6-2.1 21.4-6.4 3.2-2.2 5.7-5.4 7.4-9.3s2.6-8.5 2.6-13.7c0-5.1-.9-9.7-2.6-13.6-1.7-3.8-4.2-6.9-7.4-9zm-29 3.8h5.8c6.4 0 11.7 1.3 15.7 3.7 4.4 2.7 6.7 7.8 6.7 15.1 0 7.6-2.3 12.9-6.7 15.8-3.8 2.5-9.1 3.8-15.6 3.8h-5.8V34z"></path><use xlink:href="#A"></use><path d="M199 41.3h10.3v41H199zm47.8 3.4c-3.1-2.8-6.6-4.4-10.3-4.4-5.7 0-10.4 2-14.1 5.8s-5.5 8.8-5.5 14.7c0 5.8 1.8 10.7 5.5 14.7 3.7 3.8 8.4 5.8 14.1 5.8 4 0 7.4-1.1 10.2-3.3v1c0 3.4-.9 6-2.7 7.9-1.8 1.8-4.3 2.7-7.4 2.7-4.8 0-7.7-1.9-11.4-6.8l-7 6.7.2.3c1.5 2.1 3.8 4.2 6.9 6.2s6.9 3 11.5 3c6.1 0 11.1-1.9 14.7-5.6 3.7-3.7 5.5-8.7 5.5-14.9V41.3h-10.1v3.4zm-2.7 24.2c-1.8 2-4.1 3-7.1 3s-5.3-1-7-3c-1.8-2-2.7-4.7-2.7-8s.9-6.1 2.7-8.1 4.1-3.1 7-3.1c3 0 5.3 1 7.1 3.1 1.8 2 2.7 4.8 2.7 8.1s-1 6-2.7 8zm21.6-27.6H276v41h-10.3z"></path><use xlink:href="#A" x="66.7"></use><path d="M298.6 30.3h-10.1v11.1h-5.9v9.4h5.9v17c0 5.3 1.1 9.1 3.2 11.3s5.8 3.3 11.1 3.3c1.7 0 3.4-.1 5-.2h.5v-9.4l-3.5.2c-2.5 0-4.1-.4-4.9-1.3s-1.2-2.7-1.2-5.4V50.7h9.6v-9.4h-9.6v-11zm57.9-6.2h10.3v58.1h-10.3zm114.4 43.5c-1.8 2.1-3.7 3.9-5.2 4.8-1.4.9-3.2 1.4-5.3 1.4-3 0-5.5-1.1-7.5-3.4s-3-5.2-3-8.7 1-6.4 2.9-8.6c2-2.3 4.4-3.4 7.4-3.4 3.3 0 6.8 2.1 9.8 5.6l6.8-6.5c-4.4-5.8-10.1-8.5-16.9-8.5-5.7 0-10.6 2.1-14.6 6.1s-6 9.2-6 15.3 2 11.2 6 15.3 8.9 6.1 14.6 6.1c7.5 0 13.5-3.2 17.5-9.1l-6.5-6.4zM513.2 47c-1.5-2-3.5-3.7-5.9-4.9-2.5-1.2-5.3-1.8-8.5-1.8-5.8 0-10.5 2.1-14 6.3-3.4 4.2-5.2 9.3-5.2 15.4 0 6.2 1.9 11.3 5.7 15.3 3.7 3.9 8.8 5.9 14.9 5.9 6.9 0 12.7-2.8 16.9-8.4l.2-.3-6.7-6.5c-.6.8-1.5 1.6-2.3 2.4-1 1-2 1.7-3 2.2-1.5.8-3.3 1.1-5.2 1.1-2.9 0-5.2-.8-7-2.5-1.7-1.5-2.7-3.6-2.9-6.2h27.3l.1-3.8c0-2.7-.4-5.2-1.1-7.6-.7-2.3-1.8-4.5-3.3-6.6zm-22.5 9.7c.5-2 1.4-3.6 2.7-4.9 1.4-1.4 3.2-2.1 5.4-2.1 2.5 0 4.4.7 5.7 2.1 1.2 1.3 1.9 2.9 2.1 4.8h-15.9zm62.1-12.3c-3.1-2.7-7.4-4-12.8-4-3.4 0-6.6.8-9.5 2.2-2.7 1.4-5.3 3.6-7 6.6l.1.1 6.6 6.3c2.7-4.3 5.7-5.8 9.7-5.8 2.2 0 3.9.6 5.3 1.7s2 2.6 2 4.4v2c-2.6-.8-5.1-1.2-7.6-1.2-5.1 0-9.3 1.2-12.4 3.6s-4.7 5.9-4.7 10.2c0 3.8 1.3 7 4 9.3 2.7 2.2 6 3.4 9.9 3.4s7.6-1.6 10.9-4.3v3.4h10.1V55.9c.2-4.9-1.4-8.8-4.6-11.5zm-18.3 22.2c1.2-.8 2.8-1.2 4.9-1.2 2.5 0 5.1.5 7.8 1.5v4C545 73 542 74 538.3 74c-1.8 0-3.2-.4-4.1-1.2s-1.4-1.7-1.4-3 .6-2.4 1.7-3.2zm62.7-21.4c-2.9-3.2-6.9-4.8-12-4.8-4.1 0-7.4 1.2-9.9 3.5v-2.5h-10.1v41h10.3V59.7c0-3.1.7-5.6 2.2-7.3 1.5-1.8 3.4-2.6 6.1-2.6 2.3 0 4.1.8 5.4 2.3 1.3 1.6 2 3.7 2 6.4v23.7h10.3V58.5c0-5.6-1.4-10.1-4.3-13.3zm-253.6-.8c-3.1-2.7-7.4-4-12.8-4-3.4 0-6.6.8-9.5 2.2-2.7 1.4-5.3 3.6-7 6.6l.1.1 6.6 6.3c2.7-4.3 5.7-5.8 9.7-5.8 2.2 0 3.9.6 5.3 1.7s2 2.6 2 4.4v2c-2.6-.8-5.1-1.2-7.6-1.2-5.1 0-9.3 1.2-12.4 3.6s-4.7 5.9-4.7 10.2c0 3.8 1.3 7 4 9.3 2.7 2.2 6 3.4 9.9 3.4s7.6-1.6 10.9-4.3v3.4h10.1V55.9c.1-4.9-1.5-8.8-4.6-11.5zm-18.3 22.2c1.2-.8 2.8-1.2 4.9-1.2 2.5 0 5.1.5 7.8 1.5v4c-2.2 2.1-5.2 3.1-8.9 3.1-1.8 0-3.2-.4-4.1-1.2s-1.4-1.7-1.4-3 .5-2.4 1.7-3.2zm78.9 16.5c-16.5 0-30-13.4-30-30s13.4-30 30-30c16.5 0 30 13.4 30 30s-13.5 30-30 30zm0-49.3c-10.7 0-19.4 8.7-19.4 19.4s8.7 19.4 19.4 19.4 19.4-8.7 19.4-19.4-8.7-19.4-19.4-19.4z"></path></g><defs><path d="M204.3 23.4c-1.8 0-3.3.6-4.5 1.8s-1.9 2.7-1.9 4.4c0 1.8.6 3.3 1.9 4.5 1.2 1.2 2.7 1.9 4.5 1.9s3.3-.6 4.5-1.9c1.2-1.2 1.9-2.8 1.9-4.5 0-1.8-.6-3.3-1.9-4.4-1.2-1.2-2.8-1.8-4.5-1.8z"></path></defs></svg>
+              </div>
+
+              <div class="flex items-center justify-center col-span-1 md:col-span-2 lg:col-span-1">
+                  <svg class="h-8 mt-2 text-gray-500 fill-current dark:text-gray-300" viewBox="0 0 398 120" xmlns="http://www.w3.org/2000/svg"><g fill-rule="nonzero"><path d="M247.292 94.106C224.124 111.016 190.526 120 161.608 120c-40.544 0-77.046-14.822-104.673-39.476-2.164-1.936-.235-4.583 2.369-3.082 29.806 17.15 66.66 27.475 104.731 27.475 25.677 0 53.906-5.271 79.884-16.163 3.923-1.646 7.21 2.545 3.373 5.352"></path><path d="M256.533 82.534c-2.965-3.771-19.551-1.787-27.003-.897-2.254.277-2.605-1.692-.57-3.122 13.233-9.265 34.922-6.587 37.447-3.487 2.54 3.13-.666 24.802-13.073 35.147-1.91 1.59-3.718.744-2.877-1.357 2.782-6.952 9.04-22.505 6.076-26.284zM230.05 13.058V4.063c.015-1.378 1.04-2.29 2.291-2.283l40.493-.007c1.295 0 2.335.94 2.335 2.268v7.726c-.015 1.29-1.113 2.983-3.053 5.668l-20.97 29.843c7.78-.182 16.022.985 23.093 4.939 1.596.897 2.027 2.217 2.152 3.516v9.607c0 1.32-1.457 2.86-2.987 2.057-12.458-6.507-29-7.214-42.776.08-1.405.745-2.884-.765-2.884-2.086v-9.133c0-1.459.03-3.961 1.508-6.186l24.302-34.738h-21.162c-1.295 0-2.327-.927-2.342-2.276zM82.354 69.294H70.042c-1.171-.08-2.108-.956-2.203-2.072l.014-63.006c0-1.262 1.062-2.268 2.38-2.268L81.71 1.94c1.2.059 2.159.963 2.232 2.116v8.221h.234C87.163 4.326 92.8.613 100.39.613c7.708 0 12.539 3.713 15.98 11.664C119.361 4.326 126.14.613 133.393.613c5.175 0 10.804 2.123 14.251 6.893 3.916 5.311 3.111 12.993 3.111 19.755l-.015 39.764c0 1.255-1.061 2.262-2.379 2.262h-12.304c-1.23-.08-2.203-1.05-2.203-2.262l-.007-33.41c0-2.648.234-9.28-.344-11.796-.923-4.246-3.675-5.435-7.24-5.435-2.986 0-6.09 1.985-7.356 5.165-1.266 3.188-1.15 8.484-1.15 12.066v33.403c0 1.255-1.06 2.262-2.378 2.262h-12.297c-1.237-.08-2.21-1.051-2.21-2.262l-.015-33.41c0-7.025 1.142-17.362-7.59-17.362-8.858 0-8.506 10.074-8.506 17.362l-.007 33.403c-.022 1.276-1.084 2.283-2.401 2.283zm227.788-55.82c-9.084 0-9.662 12.328-9.662 20.017s-.117 24.131 9.545 24.131c9.545 0 10.006-13.262 10.006-21.345 0-5.303-.234-11.664-1.845-16.705-1.383-4.377-4.143-6.098-8.044-6.098zM310.025.613c18.284 0 28.173 15.647 28.173 35.533 0 19.222-10.92 34.468-28.173 34.468-17.933 0-27.712-15.647-27.712-35.132C282.305 15.86 292.2.612 310.025.612zm51.882 68.681h-12.275c-1.23-.08-2.211-1.05-2.211-2.261l-.015-63.028c.103-1.16 1.12-2.057 2.365-2.057l11.426-.008c1.076.059 1.961.788 2.188 1.766v9.636h.234c3.448-8.622 8.279-12.73 16.785-12.73 5.519 0 10.92 1.992 14.375 7.427C398 13.072 398 21.556 398 27.662v39.64c-.14 1.117-1.142 1.985-2.364 1.985h-12.349c-1.141-.073-2.064-.912-2.188-1.984V33.097c0-6.894.805-16.968-7.708-16.968-2.993 0-5.753 1.984-7.13 5.033-1.72 3.845-1.953 7.69-1.953 11.935v33.928c-.03 1.262-1.091 2.27-2.401 2.27zm-151.715-.16c-.813.73-1.991.78-2.913.284-4.092-3.385-4.824-4.953-7.064-8.177-6.756 6.864-11.543 8.921-20.305 8.921-10.372 0-18.438-6.376-18.438-19.134 0-9.965 5.424-16.742 13.139-20.061 6.683-2.925 16.023-3.458 23.167-4.253v-1.598c0-2.925.234-6.375-1.5-8.9-1.501-2.26-4.378-3.195-6.918-3.195-4.692 0-8.871 2.4-9.904 7.375-.212 1.11-1.024 2.204-2.137 2.262l-11.938-1.291c-1.01-.234-2.13-1.029-1.838-2.568C166.288 4.362 179.37 0 191.087 0c5.995 0 13.827 1.59 18.556 6.113 5.995 5.58 5.416 13.021 5.416 21.126v19.127c0 5.756 2.401 8.28 4.648 11.373.79 1.116.967 2.444-.036 3.26-2.518 2.102-6.983 5.968-9.443 8.15l-.036-.015zm-12.414-29.931v-2.656c-8.908 0-18.322 1.897-18.322 12.35 0 5.319 2.767 8.908 7.488 8.908 3.455 0 6.566-2.123 8.528-5.58 2.423-4.254 2.306-8.237 2.306-13.022zM48.72 69.133c-.813.73-1.991.781-2.913.285-4.092-3.385-4.824-4.953-7.064-8.177-6.763 6.864-11.55 8.921-20.305 8.921C8.06 70.162 0 63.786 0 51.028c0-9.965 5.417-16.742 13.139-20.061 6.683-2.925 16.015-3.458 23.16-4.253v-1.598c0-2.925.233-6.375-1.501-8.9-1.5-2.26-4.377-3.195-6.91-3.195-4.7 0-8.879 2.4-9.904 7.375-.212 1.11-1.024 2.204-2.137 2.262L3.91 21.367c-1.01-.234-2.13-1.029-1.845-2.568C4.81 4.362 17.89.007 29.615.007c5.995 0 13.827 1.59 18.556 6.113 5.995 5.581 5.416 13.022 5.416 21.126v19.128c0 5.755 2.401 8.28 4.648 11.372.79 1.116.967 2.444-.036 3.261-2.518 2.101-6.99 5.967-9.45 8.148l-.03-.021zm-12.422-29.93v-2.656c-8.908 0-18.32 1.897-18.32 12.35 0 5.319 2.766 8.908 7.487 8.908 3.462 0 6.573-2.123 8.528-5.58 2.422-4.254 2.305-8.237 2.305-13.022z"></path></g></svg>
+              </div>
+
+              <div class="flex items-center justify-center col-span-1 md:col-span-3 lg:col-span-1">
+                  <svg class="h-5 mt-1 text-gray-500 fill-current dark:text-gray-300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 278.7 36.3"><g><path class="st0" d="M238.1 14.4v21.9h7V21.7h25.6v14.6h7V14.4h-39.6m6.2-7.1h27c3.8-.7 6.5-4.1 7.3-7.3H237c.8 3.2 3.6 6.5 7.3 7.3m-27.5 29c3.5-1.5 5.4-4.1 6.2-7.1h-31.5V.1h-7.1v36.2h32.4M131.9 7.2h25c3.8-1.1 6.9-4 7.7-7.1H125v21.4h32.4V29H132c-4 1.1-7.4 3.8-9.1 7.3h41.5V14.4H132l-.1-7.2m-61.6.1h27c3.8-.7 6.6-4.1 7.3-7.3H62.9c.8 3.2 3.6 6.5 7.4 7.3m0 14.3h27c3.8-.7 6.6-4.1 7.3-7.3H62.9c.8 3.2 3.6 6.5 7.4 7.3m0 14.7h27c3.8-.7 6.6-4.1 7.3-7.3H62.9c.8 3.2 3.6 6.6 7.4 7.3M0 .1c.8 3.2 3.6 6.4 7.3 7.2h11.4l.6.2v28.7h7.1V7.5l.6-.2h11.4c3.8-1 6.5-4 7.3-7.2V0L0 .1"></path></g></svg>
+              </div>
+              
+              <div class="flex items-center justify-center col-span-2 md:col-span-3 lg:col-span-1">
+                  <svg class="h-8 text-gray-500 fill-current dark:text-gray-300" viewBox="0 0 2270 546" xmlns="http://www.w3.org/2000/svg"><g fill-rule="evenodd"><path d="M888.413 394.397l-31.127 144.717h-71.593L903.977 14.642h84.81l111.28 524.472h-72.371l-30.35-144.717H888.413zm100.373-58.364l-24.124-125.3c-7.003-35.797-14.007-82.463-19.441-119.828h-3.126c-5.434 38.13-13.242 86.365-20.22 119.827l-24.902 125.301h91.813zM1373.34.648v441.205c0 28.806 1.556 70.828 3.1 97.274h-63.02l-4.67-45.9h-2.334c-12.451 26.445-41.244 52.138-79.362 52.138-70.037 0-112.837-76.275-112.837-193.755 0-133.848 56.794-196.881 116.728-196.881 30.336 0 54.46 14.02 67.689 42.8h1.556V.648h73.15zm-73.163 304.258c0-6.991 0-15.551-.778-23.359-3.89-34.227-23.345-63.798-49.79-63.798-45.927 0-61.477 63.798-61.477 133.848 0 77.818 20.232 132.278 59.142 132.278 16.342 0 38.118-8.56 50.569-53.681 1.556-6.226 2.334-15.577 2.334-24.111V304.906zm247.399 240.446c-75.471 0-129.957-64.59-129.957-194.52 0-137.752 64.576-196.116 133.835-196.116 74.705 0 128.387 66.924 128.387 194.546 0 150.19-73.927 196.09-131.5 196.09h-.765zm2.321-57.573c45.122 0 55.251-80.153 55.251-137.726 0-56.82-10.116-137.739-56.794-137.739-48.26 0-57.586 80.919-57.586 137.74 0 63.02 10.895 137.725 58.364 137.725h.765zM1723.938.648h73.137V203.74h1.556c19.455-34.227 45.913-49.025 79.375-49.025 64.577 0 105.055 73.15 105.055 189.099 0 135.391-55.25 201.537-117.506 201.537-37.353 0-58.364-20.246-74.719-53.708h-3.086l-3.904 47.47h-63.02c1.556-25.668 3.112-68.468 3.112-97.274V.648zm73.137 404.618c0 8.586.778 17.146 3.113 23.358 11.66 45.926 34.24 55.251 49.012 55.251 43.579 0 59.92-57.572 59.92-135.391 0-72.371-17.106-130.735-60.698-130.735-24.124 0-43.578 28.793-49.025 56.03-1.557 7.781-2.335 17.91-2.335 25.68v105.807h.013zm293.92-40.453c.779 97.273 42.788 121.384 87.145 121.384 26.458 0 49.025-6.213 65.367-14.007l10.895 52.916c-22.568 11.673-56.808 17.912-90.27 17.912-94.925 0-144.73-71.594-144.73-188.321 0-123.732 56.795-199.994 135.392-199.994s115.172 75.484 115.172 170.435c0 18.664-.792 30.35-1.557 40.453l-177.413-.778zm109.712-52.126c.778-66.924-22.567-102.707-51.347-102.707-38.144 0-55.264 55.251-57.586 102.707h108.933z" fill-rule="nonzero"></path><path d="M373.462 16.043h218.501v523.07L373.462 16.044zm-153.926 0H.88v523.07l218.657-523.07zm76.976 192.77l139.218 330.3H344.5l-41.633-105.197H200.964l95.548-225.103z"></path></g></svg>
+              </div>
+          </div>
+      </div>
+  </div>
+</section>
+
+<!-- hero 20 end -->
+
+<!-- hero 21 start -->
+<section class="section_divider">
+  <div>Hero 21</div>
+</section>
+
+<section class="bg-white dark:bg-gray-800">
+  
+
+  <div class="container flex flex-col px-6 py-10 mx-auto space-y-6 lg:h-[32rem] lg:py-16 lg:flex-row lg:items-center">
+      <div class="w-full lg:w-1/2">
+          <div class="lg:max-w-lg">
+              <h1 class="text-3xl text-left font-bold tracking-wide text-gray-800 dark:text-white lg:text-5xl">
+                  Easiest way to create your website
+              </h1>
+              
+              <div class="mt-8 space-y-5 ">
+                  <p class="flex items-center -mx-2 text-gray-700 dark:text-gray-200">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 mx-2 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                      </svg>
+
+                      <span class="mx-2">Clean and Simple Layout</span>
+                  </p>
+
+                  <p class="flex items-center -mx-2 text-gray-700 dark:text-gray-200">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 mx-2 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                      </svg>
+
+                      <span class="mx-2">Just Copy Paste Codeing</span>
+                  </p>
+
+                  <p class="flex items-center -mx-2 text-gray-700 dark:text-gray-200">
+                      <svg xmlns="http://www.w3.org/2000/svg" class="w-6 h-6 mx-2 text-blue-500" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12l2 2 4-4m6 2a9 9 0 11-18 0 9 9 0 0118 0z" />
+                      </svg>
+
+                      <span class="mx-2">Easy to Use</span>
+                  </p>
+              </div>
+              
+          </div>
+
+          <div class="w-full mt-8 bg-transparent border rounded-md lg:max-w-sm dark:border-gray-700 focus-within:border-blue-400 focus-within:ring focus-within:ring-blue-300 dark:focus-within:border-blue-400 focus-within:ring-opacity-40">
+              <form class="flex flex-col lg:flex-row">
+                  <input type="email" placeholder="Enter your email address" class="flex-1 h-10 px-4 py-2 m-1 text-gray-700 placeholder-gray-400 bg-transparent border-none appearance-none dark:text-gray-200 focus:outline-none focus:placeholder-transparent focus:ring-0" /> 
+                  
+                  <button type="button" class="h-10 w-full px-4 py-2 m-1 text-white transition-colors duration-200 transform bg-blue-500 rounded-md hover:bg-blue-400 focus:outline-none focus:bg-blue-400">
+                      Join Us
+                  </button>
+              </form>
+          </div>
+      </div>
+
+      <div class="flex items-center justify-center w-full h-96 lg:w-1/2">
+          <img class="object-cover w-full h-full mx-auto rounded-md lg:max-w-2xl" src="https://images.unsplash.com/photo-1543269664-7eef42226a21?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&auto=format&fit=crop&w=1470&q=80" alt="glasses photo">
+      </div>
+  </div>
+</section>
+
+<!-- hero 21 end -->
+
+<!-- hero 22 start -->
+<section class="section_divider">
+  <div>Hero 22 </div>
+</section>
+
+<section class="bg-white dark:bg-gray-800">
+
+
+  <div class="container flex flex-col px-6 py-10 mx-auto space-y-6 lg:h-[32rem] lg:py-16 lg:flex-row lg:items-center">
+      <div class="w-full lg:w-1/2">
+          <div class="lg:max-w-lg">
+              <h1 class="text-2xl font-medium tracking-wide text-gray-800 dark:text-white lg:text-4xl">Find your premium new glasses exported from US</h1>
+              <p class="mt-2 text-gray-600 dark:text-gray-300">We work with the best remunated glasses dealers in US to find your new glasses.</p>
+              <div class="grid gap-6 mt-8 sm:grid-cols-2">
+                  <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                      <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                      </svg>
+
+                      <span class="mx-3">Premium selection</span>
+                  </div>
+
+                  <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                      <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                      </svg>
+
+                      <span class="mx-3">Insurance sometext</span>
+                  </div>
+
+                  <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                      <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                      </svg>
+
+                      <span class="mx-3">All legal documents</span>
+                  </div>
+
+                  <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                      <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                      </svg>
+
+                      <span class="mx-3">From US glasses dealers</span>
+                  </div>
+
+                  <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                      <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                      </svg>
+
+                      <span class="mx-3">Payment Security</span>
+                  </div>
+
+                  <div class="flex items-center text-gray-800 -px-3 dark:text-gray-200">
+                      <svg class="w-5 h-5 mx-3" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+                          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7" />
+                      </svg>
+
+                      <span class="mx-3">Fast shipping (+ Express)</span>
+                  </div>
+              </div>
+          </div>
+      </div>
+
+      <div class="flex items-center justify-center w-full h-96 lg:w-1/2">
+          <img class="object-cover w-full h-full max-w-2xl rounded-md" src="https://images.unsplash.com/photo-1555181126-cf46a03827c0?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=1050&q=80" alt="glasses photo">
+      </div>
+  </div>
+</section>
+
+<!-- hero 22 end -->
+
+<!-- hero 23 start -->
+<section class="section_divider">
+  <div>Hero 23</div>
+</section>
+
+    <!-- Require css -->
+    <style>
+      .pattern {
+          background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 304 304' width='304' height='304'%3E%3Cpath fill='%23a0aec0' fill-opacity='0.1' d='M44.1 224a5 5 0 1 1 0 2H0v-2h44.1zm160 48a5 5 0 1 1 0 2H82v-2h122.1zm57.8-46a5 5 0 1 1 0-2H304v2h-42.1zm0 16a5 5 0 1 1 0-2H304v2h-42.1zm6.2-114a5 5 0 1 1 0 2h-86.2a5 5 0 1 1 0-2h86.2zm-256-48a5 5 0 1 1 0 2H0v-2h12.1zm185.8 34a5 5 0 1 1 0-2h86.2a5 5 0 1 1 0 2h-86.2zM258 12.1a5 5 0 1 1-2 0V0h2v12.1zm-64 208a5 5 0 1 1-2 0v-54.2a5 5 0 1 1 2 0v54.2zm48-198.2V80h62v2h-64V21.9a5 5 0 1 1 2 0zm16 16V64h46v2h-48V37.9a5 5 0 1 1 2 0zm-128 96V208h16v12.1a5 5 0 1 1-2 0V210h-16v-76.1a5 5 0 1 1 2 0zm-5.9-21.9a5 5 0 1 1 0 2H114v48H85.9a5 5 0 1 1 0-2H112v-48h12.1zm-6.2 130a5 5 0 1 1 0-2H176v-74.1a5 5 0 1 1 2 0V242h-60.1zm-16-64a5 5 0 1 1 0-2H114v48h10.1a5 5 0 1 1 0 2H112v-48h-10.1zM66 284.1a5 5 0 1 1-2 0V274H50v30h-2v-32h18v12.1zM236.1 176a5 5 0 1 1 0 2H226v94h48v32h-2v-30h-48v-98h12.1zm25.8-30a5 5 0 1 1 0-2H274v44.1a5 5 0 1 1-2 0V146h-10.1zm-64 96a5 5 0 1 1 0-2H208v-80h16v-14h-42.1a5 5 0 1 1 0-2H226v18h-16v80h-12.1zm86.2-210a5 5 0 1 1 0 2H272V0h2v32h10.1zM98 101.9V146H53.9a5 5 0 1 1 0-2H96v-42.1a5 5 0 1 1 2 0zM53.9 34a5 5 0 1 1 0-2H80V0h2v34H53.9zm60.1 3.9V66H82v64H69.9a5 5 0 1 1 0-2H80V64h32V37.9a5 5 0 1 1 2 0zM101.9 82a5 5 0 1 1 0-2H128V37.9a5 5 0 1 1 2 0V82h-28.1zm16-64a5 5 0 1 1 0-2H146v44.1a5 5 0 1 1-2 0V18h-26.1zm102.2 270a5 5 0 1 1 0 2H98v14h-2v-16h124.1zM242 149.9V160h16v34h-16v62h48v48h-2v-46h-48v-66h16v-30h-16v-12.1a5 5 0 1 1 2 0zM53.9 18a5 5 0 1 1 0-2H64V2H48V0h18v18H53.9zm112 32a5 5 0 1 1 0-2H192V0h50v2h-48v48h-28.1zm-48-48a5 5 0 0 1-9.8-2h2.07a3 3 0 1 0 5.66 0H178v34h-18V21.9a5 5 0 1 1 2 0V32h14V2h-58.1zm0 96a5 5 0 1 1 0-2H137l32-32h39V21.9a5 5 0 1 1 2 0V66h-40.17l-32 32H117.9zm28.1 90.1a5 5 0 1 1-2 0v-76.51L175.59 80H224V21.9a5 5 0 1 1 2 0V82h-49.59L146 112.41v75.69zm16 32a5 5 0 1 1-2 0v-99.51L184.59 96H300.1a5 5 0 0 1 3.9-3.9v2.07a3 3 0 0 0 0 5.66v2.07a5 5 0 0 1-3.9-3.9H185.41L162 121.41v98.69zm-144-64a5 5 0 1 1-2 0v-3.51l48-48V48h32V0h2v50H66v55.41l-48 48v2.69zM50 53.9v43.51l-48 48V208h26.1a5 5 0 1 1 0 2H0v-65.41l48-48V53.9a5 5 0 1 1 2 0zm-16 16V89.41l-34 34v-2.82l32-32V69.9a5 5 0 1 1 2 0zM12.1 32a5 5 0 1 1 0 2H9.41L0 43.41V40.6L8.59 32h3.51zm265.8 18a5 5 0 1 1 0-2h18.69l7.41-7.41v2.82L297.41 50H277.9zm-16 160a5 5 0 1 1 0-2H288v-71.41l16-16v2.82l-14 14V210h-28.1zm-208 32a5 5 0 1 1 0-2H64v-22.59L40.59 194H21.9a5 5 0 1 1 0-2H41.41L66 216.59V242H53.9zm150.2 14a5 5 0 1 1 0 2H96v-56.6L56.6 162H37.9a5 5 0 1 1 0-2h19.5L98 200.6V256h106.1zm-150.2 2a5 5 0 1 1 0-2H80v-46.59L48.59 178H21.9a5 5 0 1 1 0-2H49.41L82 208.59V258H53.9zM34 39.8v1.61L9.41 66H0v-2h8.59L32 40.59V0h2v39.8zM2 300.1a5 5 0 0 1 3.9 3.9H3.83A3 3 0 0 0 0 302.17V256h18v48h-2v-46H2v42.1zM34 241v63h-2v-62H0v-2h34v1zM17 18H0v-2h16V0h2v18h-1zm273-2h14v2h-16V0h2v16zm-32 273v15h-2v-14h-14v14h-2v-16h18v1zM0 92.1A5.02 5.02 0 0 1 6 97a5 5 0 0 1-6 4.9v-2.07a3 3 0 1 0 0-5.66V92.1zM80 272h2v32h-2v-32zm37.9 32h-2.07a3 3 0 0 0-5.66 0h-2.07a5 5 0 0 1 9.8 0zM5.9 0A5.02 5.02 0 0 1 0 5.9V3.83A3 3 0 0 0 3.83 0H5.9zm294.2 0h2.07A3 3 0 0 0 304 3.83V5.9a5 5 0 0 1-3.9-5.9zm3.9 300.1v2.07a3 3 0 0 0-1.83 1.83h-2.07a5 5 0 0 1 3.9-3.9zM97 100a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-48 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 96a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-144a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm96 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM49 36a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-32 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM33 68a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 240a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm80-176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 48a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm112 176a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm-16 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 180a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0 16a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm0-32a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16 0a3 3 0 1 0 0-6 3 3 0 0 0 0 6zM17 84a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm32 64a3 3 0 1 0 0-6 3 3 0 0 0 0 6zm16-16a3 3 0 1 0 0-6 3 3 0 0 0 0 6z'%3E%3C/path%3E%3C/svg%3E");
+      }
+      </style>
+  
+      <section class="bg-gray-900 pattern">
+          <div class="container px-6 mx-auto">
+              
+              <div class="flex flex-col items-center py-6 lg:h-[32rem] lg:flex-row">
+                  <div class="lg:w-1/2">
+                      <h2 class="text-4xl font-semibold text-gray-100">Brand</h2>
+  
+                      <h3 class="text-2xl font-semibold text-gray-100">
+                          Hello <span class="text-blue-400">Guest</span>
+                      </h3>
+  
+                      <p class="mt-3 text-gray-100">Lorem ipsum dolor sit amet, consectetur adipiscing.</p>
+                  </div>
+  
+                  <div class="flex mt-8 lg:w-1/2 lg:justify-end lg:mt-0">
+                      <div class="max-w-sm bg-white rounded-lg dark:bg-gray-800">
+                          <div class="p-5 text-center">
+                              <h2 class="text-2xl font-semibold text-gray-700 dark:text-white fo">Sign In</h2>
+  
+                              <form action="#">
+                                  <div class="mt-4">
+                                      <input class="block w-full px-4 py-2 text-gray-700 placeholder-gray-400 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-500 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:ring-blue-300 focus:outline-none focus:ring" type="email" placeholder="Email address" aria-label="Email address">
+                                      <input class="block w-full px-4 py-2 mt-4 text-gray-700 placeholder-gray-400 bg-white border rounded-md dark:bg-gray-800 dark:border-gray-600 dark:placeholder-gray-500 focus:border-blue-400 dark:focus:border-blue-300 focus:ring-opacity-40 focus:ring-blue-300 focus:outline-none focus:ring" type="password" placeholder="Password" aria-label="Password">
+                                  </div>
+  
+                                  <div class="flex items-center justify-between mt-4">
+                                      <a href="#f" class="text-sm text-gray-600 dark:text-gray-200 hover:underline">Forget Password?</a>
+  
+                                      <button class="px-4 py-2 font-semibold text-white transition-colors duration-200 transform bg-gray-900 rounded-md hover:bg-gray-800 dark:hover:bg-gray-700 focus:outline-none focus:bg-gray-800 dark:focus:bg-gray-700">Login</button>
+                                  </div>
+                              </form>
+                          </div>
+                      </div>
+                  </div>
+              </div>
+          </div>
+      </section>
+<!-- hero 23 end -->
+
+
+  <!-- hero 24 start -->
+  <section class="section_divider">
+    <div>Hero 24</div>
+  </section>
+  <section class="text-gray-600 body-font">
+    <div class="container mx-auto flex px-5 py-24 md:flex-row flex-col items-center">
+      <div class="lg:flex-grow md:w-1/2 lg:pr-24 md:pr-16 flex flex-col md:items-start md:text-left mb-16 md:mb-0 items-center text-center">
+        <h1 class="title-font sm:text-4xl text-3xl mb-4 font-medium dark:text-gray-100 text-gray-900">Knausgaard typewriter readymade marfa</h1>
+        <p class="mb-8 leading-relaxed">Chillwave portland ugh, knausgaard fam polaroid iPhone. Man braid swag typewriter affogato, hella selvage wolf narwhal dreamcatcher.</p>
+        <div class="flex w-full md:justify-start justify-center items-end">
+          <div class="relative mr-4 md:w-full lg:w-full xl:w-1/2 w-2/4">
+            <label for="hero-field" class="leading-7 text-sm text-gray-600">Email</label>
+            <input type="text" id="hero-field" name="hero-field" class="w-full bg-gray-100 rounded border bg-opacity-50 border-gray-300 focus:ring-2 focus:ring-indigo-200 focus:bg-transparent focus:border-indigo-500 text-base outline-none text-gray-700 py-1 px-3 leading-8 transition-colors duration-200 ease-in-out">
+          </div>
+          <button class="inline-flex text-white bg-indigo-500 border-0 py-2 px-6 focus:outline-none hover:bg-indigo-600 rounded text-lg">Button</button>
+        </div>
+        <p class="text-sm mt-2 text-gray-500 mb-8 w-full">Neutra shabby chic ramps, viral fixie.</p>
+        <div class="flex lg:flex-row md:flex-col">
+          <button class="bg-gray-100 inline-flex py-3 px-5 rounded-lg items-center hover:bg-gray-200 focus:outline-none">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="w-6 h-6" viewBox="0 0 512 512">
+              <path d="M99.617 8.057a50.191 50.191 0 00-38.815-6.713l230.932 230.933 74.846-74.846L99.617 8.057zM32.139 20.116c-6.441 8.563-10.148 19.077-10.148 30.199v411.358c0 11.123 3.708 21.636 10.148 30.199l235.877-235.877L32.139 20.116zM464.261 212.087l-67.266-37.637-81.544 81.544 81.548 81.548 67.273-37.64c16.117-9.03 25.738-25.442 25.738-43.908s-9.621-34.877-25.749-43.907zM291.733 279.711L60.815 510.629c3.786.891 7.639 1.371 11.492 1.371a50.275 50.275 0 0027.31-8.07l266.965-149.372-74.849-74.847z"></path>
+            </svg>
+            <span class="ml-4 flex items-start flex-col leading-none">
+              <span class="text-xs text-gray-600 mb-1">GET IT ON</span>
+              <span class="title-font font-medium">Google Play</span>
+            </span>
+          </button>
+          <button class="bg-gray-100 inline-flex py-3 px-5 rounded-lg items-center lg:ml-4 md:ml-0 ml-4 md:mt-4 mt-0 lg:mt-0 hover:bg-gray-200 focus:outline-none">
+            <svg xmlns="http://www.w3.org/2000/svg" fill="currentColor" class="w-6 h-6" viewBox="0 0 305 305">
+              <path d="M40.74 112.12c-25.79 44.74-9.4 112.65 19.12 153.82C74.09 286.52 88.5 305 108.24 305c.37 0 .74 0 1.13-.02 9.27-.37 15.97-3.23 22.45-5.99 7.27-3.1 14.8-6.3 26.6-6.3 11.22 0 18.39 3.1 25.31 6.1 6.83 2.95 13.87 6 24.26 5.81 22.23-.41 35.88-20.35 47.92-37.94a168.18 168.18 0 0021-43l.09-.28a2.5 2.5 0 00-1.33-3.06l-.18-.08c-3.92-1.6-38.26-16.84-38.62-58.36-.34-33.74 25.76-51.6 31-54.84l.24-.15a2.5 2.5 0 00.7-3.51c-18-26.37-45.62-30.34-56.73-30.82a50.04 50.04 0 00-4.95-.24c-13.06 0-25.56 4.93-35.61 8.9-6.94 2.73-12.93 5.09-17.06 5.09-4.64 0-10.67-2.4-17.65-5.16-9.33-3.7-19.9-7.9-31.1-7.9l-.79.01c-26.03.38-50.62 15.27-64.18 38.86z"></path>
+              <path d="M212.1 0c-15.76.64-34.67 10.35-45.97 23.58-9.6 11.13-19 29.68-16.52 48.38a2.5 2.5 0 002.29 2.17c1.06.08 2.15.12 3.23.12 15.41 0 32.04-8.52 43.4-22.25 11.94-14.5 17.99-33.1 16.16-49.77A2.52 2.52 0 00212.1 0z"></path>
+            </svg>
+            <span class="ml-4 flex items-start flex-col leading-none">
+              <span class="text-xs text-gray-600 mb-1">Download on the</span>
+              <span class="title-font font-medium">App Store</span>
+            </span>
+          </button>
+        </div>
+      </div>
+      <div class="lg:max-w-lg lg:w-full md:w-1/2 w-5/6">
+        <img class="object-cover object-center rounded" alt="hero" src="https://dummyimage.com/720x600">
+      </div>
+    </div>
+  </section>
+
+  <!-- hero 24 end -->
+
+  <!-- hero 25 start -->
+    <section class="section_divider" id="hero_25">
+      <div>Hero 25</div>
+    </section>
+
+    <div class="relative pt-[120px] lg:pt-[150px] pb-[110px] bg-white dark:bg-gray-800">
+      <div class="container mx-auto">
+        <div class="flex flex-wrap -mx-4">
+          <div class="w-full lg:w-5/12 px-4">
+            <div class="hero-content">
+              <h1 class=" text-gray-800 dark:text-gray-300 font-bold text-4xl sm:text-[42px] lg:text-[40px] xl:text-[42px] leading-snug mb-3 " >
+                Kickstart <br />
+                Startup Website <br />
+                with TailGrids.
+              </h1>
+              <p class="text-gray-600 mb-8 text-body-color max-w-[480px]">
+                With TailGrids, business and students thrive together. Business
+                can perfectly match their staffing to changing demand throughout
+                the dayed.
+              </p>
+              <ul class="flex flex-wrap items-center">
+                <li>
+                  <a
+                    href="javascript:void(0)"
+                    class="
+                      py-4
+                      px-6
+                      sm:px-10
+                      lg:px-8
+                      xl:px-10
+                      inline-flex
+                      items-center
+                      justify-center
+                      text-center text-white text-base
+                      bg-blue-500
+                      hover:bg-opacity-90
+                      font-normal
+                      rounded-lg
+                    "
+                  >
+                    Get Started
+                  </a>
+                </li>
+                <li>
+                  <a
+                    href="javascript:void(0)"
+                    class="
+                      py-4
+                      px-6
+                      sm:px-10
+                      lg:px-8
+                      xl:px-10
+                      inline-flex
+                      items-center
+                      justify-center
+                      text-center text-base
+                      font-normal
+                      text-body-color
+                      hover:text-blue-300
+                      hover:border-b-blue-300
+                      m-3
+                      border-b-2
+                    "
+                  >
+                    <span class="mr-2">
+                      <svg
+                        width="22"
+                        height="22"
+                        viewBox="0 0 22 22"
+                        fill="none"
+                        xmlns="http://www.w3.org/2000/svg"
+                      >
+                        <circle cx="11" cy="11" r="11" fill="#3056D3" />
+                        <rect
+                          x="6.90906"
+                          y="13.3636"
+                          width="8.18182"
+                          height="1.63636"
+                          fill="white"
+                        />
+                        <rect
+                          x="10.1818"
+                          y="6"
+                          width="1.63636"
+                          height="4.09091"
+                          fill="white"
+                        />
+                        <path
+                          d="M11 12.5454L13.8343 9.47726H8.16576L11 12.5454Z"
+                          fill="white"
+                        />
+                      </svg>
+                    </span>
+                    Download App
+                  </a>
+                </li>
+              </ul>
+              <div class="clients pt-16">
+                <h6
+                  class="
+                    font-normal
+                    text-xs
+                    flex
+                    items-center
+                    text-body-color
+                    mb-2
+                  "
+                >
+                  Some Of Our Clients
+                  <span
+                    class="w-8 h-[1px] bg-body-color inline-block ml-2"
+                  ></span>
+                </h6>
+                <div class="flex items-center">
+                  <div class="w-full py-3 mr-4">
+                    <svg width="200" class="  w-5/6" height="52" viewBox="0 0 200 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+                      <path  opacity="0.56" d="M19.3545 4.27083C19.3545 1.9112 21.2792 0 23.6556 0H25.8061C40.0588 0 51.6126 11.4725 51.6126 25.625V46.9792C51.6126 49.3388 49.6879 51.25 47.3115 51.25H45.161C30.9083 51.25 19.3545 39.7775 19.3545 25.625V4.27083Z" fill="#4A6CF7"/>
+                      <path opacity="0.88" d="M21.5054 51.25C33.3825 51.25 43.0108 41.6894 43.0108 29.8958C43.0108 18.1022 33.3825 8.54163 21.5054 8.54163C9.62829 8.54163 0 18.1022 0 29.8958C0 41.6894 9.62829 51.25 21.5054 51.25Z" fill="#4A6CF7"/>
+                      <path class="dark:fill-white" d="M81.0229 40.7165H88.1982L78.1245 12.8125H70.2804L60.2148 40.7165H67.3079L68.9756 35.7876H79.3546L81.0229 40.7165ZM77.6127 30.5407H70.7595L74.1611 20.3251L77.6127 30.5407ZM101.443 32.4088L96.3315 18.5364H88.76L97.76 39.9612L92.6821 51.25H99.981L113.853 18.5364H106.521L101.443 32.4088ZM123.076 30.4214C123.076 26.6055 124.942 25.4925 128.155 25.4925H130.012V18.2979C127.04 18.2979 124.62 19.8879 123.076 22.2331V18.5364H116.297V40.7165H123.076V30.4214ZM154.891 29.6264C154.891 22.5908 149.904 18.2184 143.397 18.2184C136.94 18.2184 131.903 22.5908 131.903 29.6264C131.903 36.6621 136.825 41.0344 143.323 41.0344C149.821 41.0344 154.891 36.6621 154.891 29.6264ZM138.806 29.6264C138.806 25.8502 140.945 24.1013 143.397 24.1013C145.775 24.1013 147.997 25.8502 147.997 29.6264C147.997 33.3628 145.742 35.1516 143.323 35.1516C140.862 35.1516 138.806 33.3628 138.806 29.6264ZM169.572 30.5009C169.572 37.6955 174.246 40.9947 179.96 40.9947C185.665 40.9947 190.381 37.6955 190.381 30.5009V13.0113H186.772V30.5407C186.772 35.6286 184.08 37.8148 179.993 37.8148C175.914 37.8148 173.181 35.6286 173.181 30.5407V13.0113H169.572V30.5009ZM196.4 40.7165H200V13.0113H196.4V40.7165Z" fill="#2D2D2D"/>
+                      </svg>
+                    <!-- <img src="https://cdn.tailgrids.com/1.0/assets/images/brands/ayroui.svg" class="" alt="ayroui" /> -->
+                  </div>
+                  <div class="w-full py-3 mr-4">
+                    <svg width="200" class="w-5/6" height="47" viewBox="0 0 200 47" fill="none" xmlns="http://www.w3.org/2000/svg">
+                      <path d="M75.5301 31.8596H72.292V14.1332H78.9419C79.745 14.1211 80.5411 14.2857 81.2735 14.6155C81.9469 14.9207 82.5533 15.3562 83.058 15.8967C83.5506 16.4232 83.9405 17.0371 84.2076 17.7071C84.6749 18.8552 84.7468 20.1263 84.4116 21.3198C84.2746 21.8124 84.0683 22.2828 83.7992 22.7175C83.2252 23.6361 82.4073 24.3769 81.4369 24.8569C82.3026 26.038 83.1635 27.2075 84.0197 28.3654C84.8758 29.5233 85.7415 30.6881 86.6168 31.8596H84.0728C83.864 31.8547 83.6572 31.8167 83.4602 31.7473C83.2047 31.6631 82.9615 31.5448 82.7375 31.3957C82.4592 31.2159 82.1982 31.0106 81.9576 30.7827C81.665 30.4961 81.4023 30.1804 81.1735 29.8407L77.9476 25.4863H75.5301V31.8596ZM79.0419 22.223C79.3514 22.2212 79.6566 22.1514 79.9362 22.0187C80.2165 21.8916 80.4691 21.7103 80.6794 21.4853C80.8918 21.2605 81.0612 20.9988 81.1797 20.713C81.3019 20.4261 81.3651 20.1175 81.3654 19.8056C81.3657 19.4884 81.3026 19.1745 81.1797 18.882C81.0602 18.5968 80.8908 18.3352 80.6794 18.1097C80.4685 17.8859 80.2161 17.7054 79.9362 17.5784C79.657 17.4447 79.3515 17.3748 79.0419 17.374H75.5301V22.2107L79.0419 22.223Z" fill="#070707"/>
+                      <path d="M95.2659 14.1326H98.2016L105.955 31.8594H103.936C103.49 31.8634 103.052 31.7393 102.674 31.5019C102.296 31.2649 101.998 30.9194 101.819 30.5108L100.765 28.1118H92.7024L91.6631 30.5108C91.578 30.7105 91.4605 30.8948 91.3153 31.0564C91.1666 31.2207 90.9959 31.3637 90.808 31.4814C90.6177 31.6027 90.411 31.6963 90.1943 31.7593C89.9797 31.8258 89.7562 31.8595 89.5314 31.8594H87.5122L95.2659 14.1326ZM94.1386 24.8566H99.3289L97.013 19.4885C96.9143 19.2709 96.8415 19.0425 96.7962 18.808C96.7593 18.6036 96.7348 18.4442 96.7266 18.338C96.7115 18.498 96.6869 18.657 96.653 18.8141C96.6071 19.045 96.5385 19.2709 96.4484 19.4885L94.1386 24.8566Z" fill="#070707"/>
+                      <path d="M115.276 31.8596H112.019V24.3501C112.023 24.1043 111.964 23.8615 111.847 23.6453C111.708 23.402 111.555 23.1667 111.389 22.9403L104.881 14.1333H107.368C107.867 14.1226 108.361 14.2327 108.809 14.4541C109.227 14.6696 109.583 14.989 109.843 15.3818L113.343 20.1204C113.446 20.2577 113.522 20.4129 113.568 20.578C113.609 20.7334 113.631 20.8335 113.639 20.8744C113.655 20.776 113.678 20.679 113.709 20.5842C113.758 20.4154 113.84 20.2578 113.95 20.1204L117.438 15.3941C117.692 14.9919 118.049 14.6651 118.472 14.4479C118.921 14.2306 119.415 14.1227 119.913 14.1333H122.429L115.904 22.9525C115.806 23.0854 115.718 23.2058 115.646 23.3183C115.572 23.4235 115.504 23.5327 115.442 23.6453C115.385 23.7512 115.342 23.8637 115.313 23.9804C115.283 24.1012 115.268 24.2255 115.27 24.3501L115.276 31.8596Z" fill="#070707"/>
+                      <path d="M140.335 23.3506V30.1609C139.934 30.5302 139.481 30.8405 138.992 31.0823C138.491 31.3291 137.965 31.5238 137.423 31.6633C136.855 31.8079 136.276 31.9067 135.691 31.9588C135.095 32.0119 134.488 32.0384 133.876 32.0384C132.655 32.047 131.447 31.8048 130.326 31.327C129.244 30.87 128.259 30.2127 127.426 29.3905C126.595 28.5677 125.931 27.5938 125.472 26.5224C125 25.4067 124.757 24.209 124.757 22.999C124.757 21.7891 125 20.5913 125.472 19.4756C125.934 18.4006 126.6 17.4241 127.434 16.5994C128.269 15.7777 129.252 15.1206 130.334 14.6629C132.58 13.7299 135.107 13.7167 137.363 14.6262C138.426 15.0662 139.394 15.7002 140.22 16.4955L140.097 16.6076C139.951 16.7537 139.78 16.8726 139.593 16.9581C139.401 17.038 139.195 17.0776 138.988 17.0743C138.702 17.0763 138.423 16.99 138.19 16.8277C137.573 16.4078 136.899 16.0776 136.187 15.8472C135.443 15.6098 134.665 15.4914 133.884 15.4966C133.204 15.494 132.528 15.583 131.872 15.7616C131.24 15.9326 130.633 16.1876 130.069 16.5199C129.511 16.8466 128.995 17.2402 128.535 17.692C128.075 18.1447 127.678 18.6552 127.352 19.2106C127.022 19.7749 126.765 20.3783 126.587 21.0064C126.402 21.6544 126.311 22.3248 126.313 22.998C126.311 23.6723 126.405 24.3436 126.593 24.9915C126.961 26.2492 127.651 27.3907 128.598 28.304C129.068 28.7578 129.592 29.1522 130.159 29.4781C130.736 29.8091 131.355 30.064 131.998 30.2364C132.656 30.4145 133.336 30.5037 134.02 30.5014C134.865 30.5042 135.708 30.3903 136.522 30.163C137.331 29.934 138.102 29.5907 138.813 29.1438V24.8916H137.231C137.028 24.8952 136.827 24.857 136.64 24.7794C136.451 24.702 136.283 24.5867 136.142 24.4412C136.013 24.3031 135.912 24.1419 135.843 23.9663C135.773 23.7847 135.738 23.5919 135.738 23.3976V23.3486L140.335 23.3506Z" fill="#070707"/>
+                      <path d="M147.095 31.8596H145.528V14.1327H151.819C152.495 14.1274 153.165 14.2596 153.788 14.521C154.384 14.7726 154.926 15.1339 155.384 15.5856C155.843 16.0381 156.209 16.5738 156.463 17.1632C156.728 17.7725 156.862 18.4292 156.858 19.0921C156.859 19.6957 156.752 20.2947 156.543 20.8618C156.343 21.4166 156.051 21.935 155.68 22.3964C155.312 22.8488 154.862 23.2287 154.351 23.5162C153.831 23.8094 153.255 23.9924 152.659 24.0537L158.599 31.8596H157.86C157.001 31.8596 156.363 31.5449 155.956 30.9217L150.728 24.0537H147.095V31.8596ZM147.095 15.6776V22.5068H151.819C152.281 22.5097 152.741 22.4194 153.166 22.2411C153.579 22.0695 153.953 21.8211 154.27 21.5096C154.586 21.1969 154.838 20.828 155.015 20.4225C155.2 20.0028 155.294 19.5497 155.291 19.0921C155.294 18.6373 155.2 18.1868 155.015 17.77C154.657 16.9524 153.996 16.3009 153.166 15.9494C152.742 15.7673 152.282 15.6747 151.819 15.6776H147.095Z" fill="#070707"/>
+                      <path d="M164.15 31.8595H162.718V14.1326H164.15V31.8595Z" fill="#070707"/>
+                      <path d="M170.238 31.8594V14.1326H176.76C178.332 14.1264 179.877 14.5451 181.23 15.3444C182.545 16.1201 183.642 17.2161 184.419 18.5301C185.216 19.8855 185.637 21.4295 185.637 23.0022C185.637 24.5747 185.216 26.1188 184.419 27.4743C184.031 28.128 183.564 28.7308 183.027 29.2683C181.943 30.3528 180.595 31.1366 179.117 31.5428C178.35 31.7562 177.557 31.8628 176.76 31.8594H170.238ZM176.76 30.3125C177.743 30.3204 178.717 30.125 179.622 29.7383C180.488 29.3678 181.278 28.8367 181.948 28.1731C182.617 27.5068 183.151 26.7171 183.52 25.8476C183.899 24.9468 184.094 23.9794 184.094 23.0022C184.094 22.0248 183.899 21.0574 183.52 20.1567C183.15 19.2859 182.616 18.4943 181.948 17.8251C181.279 17.1589 180.489 16.6257 179.622 16.2537C178.717 15.8664 177.744 15.6702 176.76 15.6774H171.785V30.3125H176.76Z" fill="#070707"/>
+                      <path d="M196.863 16.4735C196.672 16.3429 196.503 16.2185 196.36 16.1042C196.06 15.8646 195.71 15.6957 195.335 15.6105C195.065 15.5557 194.79 15.5311 194.514 15.5371C194.049 15.5344 193.585 15.6161 193.149 15.7778C192.736 15.9291 192.351 16.1484 192.012 16.4266C191.693 16.6892 191.429 17.0125 191.237 17.3773C191.049 17.7311 190.95 18.1256 190.951 18.5259C190.94 18.9127 191 19.2984 191.133 19.6623C191.264 19.9729 191.477 20.2432 191.748 20.4458C192.093 20.7072 192.473 20.9194 192.878 21.0763C193.345 21.2694 193.923 21.4856 194.61 21.725C194.976 21.8611 195.317 21.9848 195.636 22.0964C195.95 22.2106 196.252 22.329 196.53 22.4472C196.8 22.5605 197.063 22.6879 197.319 22.8287C197.563 22.9662 197.798 23.1211 198.02 23.2919C198.579 23.7069 199.007 24.2736 199.25 24.9241C199.492 25.6026 199.612 26.318 199.603 27.0377C199.615 27.7594 199.457 28.474 199.144 29.1249C198.847 29.7313 198.424 30.2682 197.903 30.6999C197.362 31.1435 196.74 31.4807 196.071 31.6935C195.345 31.929 194.585 32.0454 193.821 32.0383C192.273 32.0383 190.97 31.5813 189.909 30.6672C189.643 30.4261 189.397 30.1641 189.171 29.8839C188.992 29.6579 188.828 29.42 188.681 29.1718L188.866 29.0616C189.102 28.9168 189.372 28.8358 189.649 28.827C189.842 28.8261 190.034 28.8529 190.22 28.9065C190.403 28.9615 190.571 29.0619 190.706 29.1983C190.99 29.4679 191.3 29.7098 191.63 29.9206C191.876 30.0734 192.138 30.1979 192.412 30.2919C192.642 30.3665 192.879 30.4137 193.12 30.4327C193.346 30.449 193.58 30.4612 193.821 30.4694C194.326 30.4853 194.829 30.429 195.316 30.3021C195.802 30.184 196.262 29.9763 196.67 29.69C197.073 29.4058 197.409 29.0366 197.652 28.6087C197.916 28.1291 198.048 27.5884 198.033 27.0419C198.056 26.4826 197.955 25.9251 197.735 25.4097C197.548 25.0165 197.265 24.6754 196.914 24.4161C196.531 24.1446 196.11 23.9301 195.665 23.7796C195.185 23.6096 194.667 23.4177 194.113 23.2042C193.409 22.9247 192.767 22.6635 192.188 22.4269C191.657 22.2149 191.158 21.9299 190.706 21.5801C190.297 21.258 189.969 20.846 189.748 20.3764C189.499 19.7912 189.384 19.1587 189.407 18.524C189.399 17.8698 189.557 17.224 189.866 16.647C190.165 16.0955 190.567 15.6064 191.052 15.2065C191.541 14.8058 192.097 14.4923 192.693 14.2804C193.28 14.0673 193.9 13.9569 194.524 13.9539C195.007 13.9478 195.487 14.0166 195.948 14.1579C196.356 14.2849 196.747 14.4589 197.113 14.6761C197.457 14.879 197.778 15.1169 198.071 15.3861C198.356 15.65 198.619 15.9098 198.859 16.1655L198.473 16.4368C198.369 16.5126 198.255 16.573 198.133 16.6163C197.981 16.6647 197.823 16.6875 197.665 16.6837C197.383 16.6936 197.103 16.6205 196.863 16.4735Z" fill="#070707"/>
+                      <path d="M67.0338 22.3796V29.8101C66.6026 30.242 66.1131 30.6122 65.5792 30.9098C65.0588 31.1994 64.5075 31.4304 63.9356 31.5988C63.3526 31.7689 62.7549 31.8846 62.1503 31.9443C61.5285 32.0074 60.9038 32.0388 60.2788 32.0382C59.0621 32.0479 57.8566 31.8084 56.7368 31.3351C55.6567 30.8769 54.6726 30.221 53.836 29.4012C53.0041 28.5777 52.3395 27.6027 51.8781 26.5293C51.3977 25.4148 51.1542 24.2136 51.1631 23.001C51.1539 21.3962 51.5797 19.8186 52.3957 18.4344C52.7954 17.7633 53.2787 17.1452 53.8339 16.5946C54.9516 15.4873 56.3391 14.6879 57.8606 14.2745C58.6489 14.0583 59.4632 13.9504 60.2807 13.9536C60.9378 13.9525 61.5927 14.0273 62.2325 14.1763C62.8704 14.3239 63.4904 14.5398 64.0816 14.8202C64.6762 15.1073 65.2424 15.4495 65.7724 15.8423C66.3141 16.2415 66.8182 16.6889 67.2783 17.1793L66.5304 17.9336C66.3187 18.1644 66.0592 18.347 65.7698 18.4688C65.4804 18.5905 65.1681 18.6484 64.854 18.6388C64.3997 18.6425 63.9557 18.5045 63.5843 18.2443C63.111 17.9204 62.5935 17.6658 62.0476 17.4879C61.4797 17.3047 60.886 17.213 60.289 17.216C59.5121 17.2132 58.743 17.369 58.0291 17.6739C56.6239 18.258 55.4989 19.3583 54.8878 20.7462C54.5763 21.4552 54.4175 22.2211 54.4214 22.9948C54.4153 23.7819 54.5807 24.5609 54.9063 25.2782C55.3861 26.3286 56.1596 27.2193 57.1346 27.8438C58.1095 28.4683 59.2445 28.8004 60.404 28.8003C60.7995 28.791 61.194 28.7575 61.5854 28.7002C61.9548 28.645 62.3205 28.567 62.6804 28.467C63.0566 28.3638 63.4167 28.2097 63.7507 28.0093V25.5174L62.7235 25.499C62.4152 25.5002 62.1102 25.4346 61.8298 25.3068C61.5561 25.1738 61.3349 24.9537 61.2012 24.6813C61.0195 24.2715 60.9384 23.8244 60.9649 23.3772V22.3856L67.0338 22.3796Z" fill="#070707"/>
+                      <path d="M43.8741 25.8933C45.3307 14.5062 37.2806 4.09427 25.8933 2.63757C14.5063 1.18086 4.09428 9.23106 2.63757 20.6182C1.18087 32.0053 9.23107 42.4173 20.6182 43.874C32.0053 45.3307 42.4173 37.2805 43.8741 25.8933Z" fill="#070707"/>
+                      <path d="M24.0262 22.9287V24.9213H28.3896V28.2541H24.0569V28.2423C23.9411 28.2423 23.8205 28.2541 23.7047 28.2541C23.0611 28.2559 22.4236 28.128 21.8303 27.8783C20.9682 27.5137 20.2294 26.908 19.703 26.1339C19.0564 25.1758 18.7763 24.017 18.9137 22.8694C19.0512 21.7218 19.5971 20.6619 20.4516 19.8837C21.3062 19.1055 22.4123 18.6608 23.5678 18.6309C24.7233 18.6011 25.8508 18.9881 26.7444 19.7212H35.2536C35.1449 19.3809 35.0173 19.0452 34.8826 18.719C34.0291 16.6972 32.6434 14.9446 30.873 13.6477C29.1027 12.3509 27.0137 11.5583 24.8287 11.3543C22.6436 11.1503 20.4441 11.5426 18.4643 12.4894C16.4844 13.4361 14.7983 14.9019 13.5854 16.7309C12.3725 18.5597 11.678 20.6833 11.5761 22.8755C11.4742 25.0677 11.9685 27.2466 13.0065 29.1801C14.0444 31.1137 15.5872 32.7296 17.4707 33.856C19.3542 34.9825 21.5078 35.5772 23.7023 35.5768H35.7571V22.924L24.0262 22.9287ZM28.3896 33.5653H24.3713C24.22 33.5653 24.064 33.5818 23.8985 33.5843H23.5487C21.8065 33.5598 20.1 33.087 18.5937 32.2115C17.0873 31.3359 15.832 30.087 14.9485 28.5853C14.0651 27.0836 13.5835 25.3795 13.55 23.6375C13.5165 21.8955 13.9323 20.1743 14.7575 18.6397C15.5825 17.1051 16.789 15.8089 18.2606 14.8761C19.7321 13.9433 21.4192 13.4053 23.1591 13.314C24.8991 13.2227 26.6332 13.5811 28.1943 14.3548C29.7555 15.1284 31.091 16.2912 32.0721 17.731H27.3968C26.5076 17.1573 25.4969 16.7988 24.4449 16.6839C23.3929 16.569 22.3287 16.701 21.3366 17.0694C20.3447 17.4377 19.4521 18.0323 18.73 18.8058C18.0078 19.5793 17.4761 20.5105 17.1766 21.5255C16.8773 22.5405 16.8187 23.6113 17.0056 24.653C17.1925 25.6945 17.6196 26.6782 18.2529 27.5259C18.8864 28.3736 19.7087 29.0619 20.6547 29.5363C21.6006 30.0106 22.6441 30.258 23.7023 30.2586H28.3896V33.5653ZM33.7835 33.5843H30.3844L30.4034 33.5724H30.3844V30.2632H33.7835V33.5843ZM33.7835 28.2588H30.3844V24.926H33.7835V28.2588Z" fill="#262626"/>
+                      <path d="M23.4375 22.2999V24.2925H27.8032V27.6252H23.4659V27.6135C23.3501 27.6135 23.2295 27.6252 23.1161 27.6252C22.3269 27.6268 21.5496 27.4333 20.8532 27.0622C20.1568 26.6911 19.5628 26.1537 19.1238 25.498C18.6779 24.8334 18.4038 24.0685 18.3262 23.2719C18.2487 22.4753 18.3701 21.6719 18.6794 20.9337C19.0436 20.0705 19.6503 19.3315 20.4262 18.8064C21.0897 18.3591 21.8544 18.0841 22.6509 18.0065C23.4474 17.929 24.2507 18.0512 24.9881 18.362C25.4138 18.5409 25.8118 18.7797 26.17 19.0712H34.6793C34.5681 18.7307 34.4429 18.3951 34.3081 18.069C33.4516 16.0506 32.0644 14.302 30.2938 13.0089C28.5233 11.7157 26.4355 10.9263 24.2523 10.7245C22.0692 10.5227 19.8721 10.916 17.8945 11.8627C15.9168 12.8093 14.2326 14.274 13.0207 16.1011C11.8086 17.9282 11.1142 20.0493 11.011 22.2394C10.9079 24.4296 11.3998 26.6066 12.4347 28.5396C13.4696 30.4725 15.0087 32.0889 16.8886 33.2172C18.7685 34.3456 20.9188 34.9437 23.1114 34.948H35.1661V22.2882L23.4375 22.2999ZM27.8032 32.9365H23.785C23.6314 32.9365 23.4778 32.953 23.3123 32.9554H22.9695C21.2267 32.9335 19.519 32.4628 18.011 31.5887C16.5031 30.7147 15.2458 29.4669 14.3605 27.9655C13.4752 26.4641 12.9917 24.76 12.9567 23.0173C12.9217 21.2748 13.3364 19.5526 14.1607 18.0169C14.9848 16.4812 16.191 15.1839 17.6626 14.2499C19.1343 13.3161 20.8217 12.7771 22.5623 12.6851C24.3028 12.5933 26.0376 12.9514 27.5994 13.7251C29.1612 14.4987 30.4973 15.6619 31.4788 17.1022H26.8081C25.9195 16.524 24.9082 16.1614 23.8546 16.0432C22.8011 15.9249 21.7346 16.0544 20.74 16.4213C19.7453 16.7882 18.8501 17.3822 18.1257 18.1563C17.4011 18.9303 16.8675 19.8627 16.5672 20.8794C16.2668 21.8962 16.208 22.969 16.3955 24.0123C16.5831 25.0557 17.0117 26.0409 17.6473 26.8894C18.2829 27.7379 19.1079 28.4262 20.0565 28.8996C21.0052 29.3728 22.0512 29.6179 23.1114 29.6155H27.7986L27.8032 32.9365ZM33.1972 32.9554H29.7982L29.8147 32.9436H29.7982V29.6155H33.1972V32.9554ZM33.1972 27.63H29.7982V24.2972H33.1972V27.63Z" fill="white"/>
+                      <path d="M27.8035 29.6179H29.7984V30.5657H27.8035V29.6179Z" fill="#999999"/>
+                      <path d="M26.189 24.2926H27.8033V25.2404H29.7959V24.2926H31.259V24.2902H26.189V24.2926Z" fill="#999999"/>
+                      </svg>
+                    <!-- <img
+                      src="https://cdn.tailgrids.com/1.0/assets/images/brands/graygrids.svg"
+                      alt="graygrids"
+                    /> -->
+                  </div>
+                  <div class="w-full py-3 mr-4">
+                    <svg width="200" class="w-5/6 " height="52" viewBox="0 0 200 52" fill="none" xmlns="http://www.w3.org/2000/svg">
+                      <path class="dark:fill-white" d="M184.095 31.7551L199.903 12.6912H192.143L177.969 29.7803V29.6708L171.547 37.4577L170.149 39.152C170.109 39.2195 170.071 39.2888 170.029 39.3563L167.621 42.2593C167.175 42.6648 166.703 43.0415 166.205 43.3827C164.093 44.8297 161.568 45.6708 158.823 45.6716V45.7708C156.996 45.7676 155.271 45.3936 153.697 44.7185C151.331 43.7019 149.308 41.9976 147.883 39.8559C146.459 37.7107 145.629 35.1471 145.628 32.3589C145.628 30.4977 145.997 28.7415 146.664 27.1392C147.665 24.7348 149.344 22.6813 151.455 21.234C153.567 19.7877 156.092 18.9471 158.839 18.9459C161.741 18.9471 164.401 19.8867 166.583 21.4892L170.065 16.6092C166.917 14.2885 163.023 12.9167 158.839 12.9175C156.203 12.9175 153.677 13.4619 151.384 14.4469C147.944 15.9243 145.027 18.3859 142.961 21.4867C140.897 24.5856 139.689 28.3428 139.691 32.3589C139.691 32.4252 139.696 32.4927 139.696 32.5597H139.592C139.592 34.4189 139.223 36.1764 138.555 37.7787C137.553 40.1813 135.876 42.2361 133.767 43.6827C131.654 45.1289 129.128 45.9703 126.383 45.9719C124.549 45.9708 122.82 45.5964 121.241 44.9181C118.874 43.9031 116.851 42.1983 115.425 40.0559C114.759 39.0517 114.223 37.9535 113.841 36.7848C113.596 36.6627 113.33 36.5253 113.049 36.3732C111.696 35.6375 110 34.5639 108.61 33.1548C108.027 32.5629 107.505 31.9783 107.036 31.4125C107.067 31.7897 107.085 32.172 107.085 32.5597C107.085 34.4189 106.717 36.1764 106.048 37.7787C105.048 40.1813 103.369 42.2361 101.259 43.6827C99.1468 45.1289 96.6205 45.9703 93.8753 45.9719C92.0424 45.9708 90.3125 45.5964 88.7333 44.9181C86.3664 43.9031 84.3439 42.1983 82.9191 40.0559C81.4937 37.9115 80.6651 35.3463 80.6645 32.5597C80.6645 30.6995 81.0341 28.9419 81.7013 27.3389C82.7013 24.936 84.3807 22.8825 86.4904 21.4352C88.6029 19.9889 91.128 19.1471 93.8753 19.1465C95.7068 19.1465 97.4372 19.5223 99.0163 20.1995C101.383 21.2155 103.406 22.9197 104.831 25.0617C104.863 25.1105 104.893 25.1597 104.925 25.2092L104.934 25.2057L104.934 25.21L104.943 25.2321C104.944 25.2355 104.947 25.2412 104.948 25.246C105.003 25.3315 105.054 25.4207 105.107 25.5067C105.24 25.8108 105.506 26.3873 105.925 27.1395C105.967 27.2147 106.012 27.2939 106.058 27.3732C106.092 27.4567 106.13 27.5381 106.163 27.6221C106.552 28.2665 107.048 29.0072 107.661 29.8013C107.695 29.8451 107.725 29.8876 107.759 29.9308C108.295 30.6304 108.925 31.3601 109.646 32.0755C109.651 32.0808 109.655 32.0849 109.659 32.0889C109.665 32.0949 109.671 32.0995 109.676 32.1055C109.79 32.2189 109.906 32.3303 110.025 32.442C110.072 32.4849 110.118 32.5281 110.165 32.5707C110.921 33.2676 111.768 33.9415 112.729 34.5469C113.808 35.2279 115.025 35.8192 116.371 36.2444C117.718 36.6708 119.195 36.9291 120.774 36.9536H120.776C120.912 36.9559 121.045 36.9573 121.178 36.9573C123.722 36.9579 126.004 36.5541 128.007 35.8349C129.51 35.2965 130.853 34.5833 132.031 33.7571C133.799 32.5155 135.193 31.0272 136.28 29.5021C137.367 27.974 138.149 26.408 138.72 24.9627C139.156 23.8564 139.38 22.7573 139.38 21.7049C139.38 21.0993 139.307 20.5147 139.169 19.9699C138.931 19.0159 138.504 18.2009 138.029 17.5597C137.312 16.5935 136.509 15.9915 135.885 15.6008C135.255 15.2121 134.785 15.0324 134.645 14.9811L134.635 15.0151C132.133 13.8011 129.329 13.1184 126.383 13.1189C123.747 13.1184 121.22 13.662 118.928 14.6475C116.684 15.612 114.664 16.9956 112.956 18.7016V0.0322266H107.02V16.2941C107.383 16.6467 107.759 17.0291 108.151 17.4465C109.652 19.0493 110.625 20.5981 111.479 22.0227C112.334 23.4512 113.073 24.7457 114.111 25.9273C114.268 26.1083 114.436 26.2863 114.61 26.4631C115.63 24.4373 117.149 22.7036 118.998 21.4352C121.109 19.9889 123.636 19.1471 126.383 19.1465C128.791 19.1471 131.027 19.794 132.969 20.9297L132.992 20.888C133.119 20.9888 133.235 21.1055 133.3 21.2057C133.348 21.2765 133.379 21.3377 133.401 21.4083C133.423 21.4787 133.443 21.5609 133.443 21.7049C133.443 21.8981 133.405 22.2184 133.207 22.7237C132.834 23.6704 132.341 24.6691 131.71 25.6173C131.237 26.3285 130.686 27.0124 130.051 27.6353C129.094 28.5703 127.952 29.3731 126.519 29.9617C125.087 30.5492 123.352 30.9284 121.178 30.9289C121.076 30.9289 120.975 30.9284 120.873 30.9269H120.872C119.974 30.9115 119.165 30.7835 118.414 30.5723C117.104 30.2025 115.966 29.5733 114.966 28.8001C114.617 28.5303 114.287 28.2405 113.975 27.9411C113.975 27.9396 113.975 27.9359 113.977 27.9331C113.827 27.7928 113.684 27.6508 113.543 27.5093C112.723 26.65 112.052 25.7409 111.56 24.958C111.184 24.3621 110.798 23.8656 110.623 23.5124C110.536 23.3349 110.362 23.0597 110.362 23.0597C109.474 21.5727 108.551 20.0615 107.076 18.4853C107.057 18.4644 107.037 18.4472 107.02 18.4261V18.4272C106.262 17.7009 105.449 17.0341 104.582 16.4399C101.53 14.3449 97.8301 13.1173 93.8753 13.1189C91.2392 13.1184 88.7139 13.662 86.4205 14.6475C82.9805 16.1257 80.0628 18.5871 77.9987 21.6875C75.9349 24.7863 74.7259 28.5429 74.7271 32.5597C74.7259 35.2351 75.2623 37.8001 76.2327 40.1269C77.6881 43.6201 80.1123 46.5817 83.1669 48.6775C86.2192 50.7739 89.9191 52.0007 93.8753 52C96.5104 52.0003 99.0369 51.4557 101.329 50.4701C104.769 48.9924 107.686 46.5315 109.751 43.4309C109.881 43.2352 110.007 43.0383 110.13 42.8375C111.556 45.1584 113.447 47.1489 115.673 48.6775C118.726 50.7739 122.426 52.0007 126.383 52C129.017 52.0003 131.543 51.4557 133.836 50.4701C137.273 48.9924 140.193 46.5315 142.256 43.4309C142.4 43.2161 142.539 42.9977 142.672 42.7755C144.089 45.0364 145.947 46.9789 148.132 48.4767C151.184 50.5724 154.883 51.7992 158.839 51.7988C161.472 51.7992 164.001 51.2551 166.292 50.2697C168.436 49.3496 170.375 48.0471 172.032 46.4463V51.8737H177.969V39.1395L180.197 36.4547L192.387 51.8737H200L184.095 31.7551ZM177.969 0.0322266H172.032V32.2655C172.032 33.1399 171.948 33.9905 171.789 34.8151L177.969 27.3235V0.0322266Z" fill="#252F3F"/>
+                      <path d="M34.0189 13.86V29.6573C34.0189 37.0165 29.5688 41.4615 22.8228 41.4615C16.0761 41.4615 11.3399 37.0165 11.3399 29.6573V0H0V29.6573C0 43.1377 8.89879 51.5177 22.8228 51.5177C36.6743 51.5177 45.3589 43.1377 45.3589 29.6573V0H45.1597C39.1795 1.94948 34.7181 7.32973 34.0189 13.86Z" fill="url(#paint0_linear)"/>
+                      <path d="M55.0664 0H54.8716V51.0084H66.2117V13.8703C66.1046 8.20185 61.0501 1.95073 55.0664 0Z" fill="url(#paint1_linear)"/>
+                      <path d="M34.0188 13.86V29.6573C34.0188 29.6668 34.0181 29.6763 34.0181 29.6868C34.0208 29.8439 34.0292 29.9997 34.0292 30.158C34.0292 40.7971 26.1371 49.5599 15.9741 50.7539C18.0892 51.2541 20.3769 51.5177 22.8227 51.5177C36.6741 51.5177 45.3588 43.1377 45.3588 29.6573V0H45.1596C39.1793 1.94948 34.718 7.32973 34.0188 13.86Z" fill="url(#paint2_linear)"/>
+                      <path d="M11.3399 13.8856V0H0V0.00225067C6.02904 1.95524 10.5469 7.33424 11.3399 13.8856Z" fill="url(#paint3_linear)"/>
+                      <path d="M54.8716 35.8926V51.0083H66.0733C59.8266 48.7703 55.2712 42.8986 54.8716 35.8926Z" fill="url(#paint4_linear)"/>
+                        <defs>
+                          <linearGradient id="paint0_linear" x1="38.8079" y1="46.5383" x2="8.58038" y2="-5.02959" gradientUnits="userSpaceOnUse">
+                              <stop stop-color="#2535C5"/>
+                              <stop offset="0.169697" stop-color="#36409B"/>
+                              <stop offset="0.575758" stop-color="#475BC6"/>
+                              <stop offset="1" stop-color="#7075E4"/>
+                          </linearGradient>
+
+                          <linearGradient id="paint1_linear" x1="60.5417" y1="0" x2="60.5417" y2="51.0085" gradientUnits="userSpaceOnUse">
+                            <stop stop-color="#375AD8"/>
+                            <stop offset="0.472727" stop-color="#3C56DD"/>
+                            <stop offset="1" stop-color="#2A1A8F"/>
+                          </linearGradient>
+
+                          <linearGradient id="paint2_linear" x1="30.6663" y1="0" x2="30.6663" y2="51.518" gradientUnits="userSpaceOnUse">
+                            <stop stop-color="#233593"/>
+                            <stop offset="0.472727" stop-color="#4957D7"/>
+                            <stop offset="0.890909" stop-color="#5465FF"/>
+                            <stop offset="1" stop-color="#6A67FF"/>
+                          </linearGradient>
+
+                          <linearGradient id="paint3_linear" x1="4.28592" y1="8.72853" x2="11.4261" y2="-0.208004" gradientUnits="userSpaceOnUse">
+                            <stop stop-color="#3A4A9C"/>
+                            <stop offset="0.327273" stop-color="#475BC6"/>
+                            <stop offset="1" stop-color="#7090E4"/>
+                          </linearGradient>
+
+                          <linearGradient id="paint4_linear" x1="60.8992" y1="42.9276" x2="53.9964" y2="51.1328" gradientUnits="userSpaceOnUse">
+                            <stop stop-color="#2D3792"/>
+                            <stop offset="0.193939" stop-color="#3F2BB8"/>
+                            <stop offset="1" stop-color="#3C38FF"/>
+                          </linearGradient>
+                          
+                        </defs>
+                      </svg>
+                    
+                    <!-- <img src="https://cdn.tailgrids.com/1.0/assets/images/brands/uideck.svg" alt="uideck" /> -->
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+          <div class="hidden lg:block lg:w-1/12 px-4"></div>
+          <div class="w-full lg:w-6/12 px-4">
+            <div class="lg:text-right lg:ml-auto">
+              <div class="relative inline-block z-10 pt-11 lg:pt-0">
+                <img
+                  src="https://cdn.tailgrids.com/1.0/assets/images/hero/hero-image-01.png"
+                  alt="hero"
+                  class="max-w-full lg:ml-auto"
+                />
+                <span class="absolute -left-8 -bottom-8 z-[-1]">
+                  <svg
+                    width="93"
+                    height="93"
+                    viewBox="0 0 93 93"
+                    fill="none"
+                    xmlns="http://www.w3.org/2000/svg"
+                  >
+                    <circle cx="2.5" cy="2.5" r="2.5" fill="#3056D3" />
+                    <circle cx="2.5" cy="24.5" r="2.5" fill="#3056D3" />
+                    <circle cx="2.5" cy="46.5" r="2.5" fill="#3056D3" />
+                    <circle cx="2.5" cy="68.5" r="2.5" fill="#3056D3" />
+                    <circle cx="2.5" cy="90.5" r="2.5" fill="#3056D3" />
+                    <circle cx="24.5" cy="2.5" r="2.5" fill="#3056D3" />
+                    <circle cx="24.5" cy="24.5" r="2.5" fill="#3056D3" />
+                    <circle cx="24.5" cy="46.5" r="2.5" fill="#3056D3" />
+                    <circle cx="24.5" cy="68.5" r="2.5" fill="#3056D3" />
+                    <circle cx="24.5" cy="90.5" r="2.5" fill="#3056D3" />
+                    <circle cx="46.5" cy="2.5" r="2.5" fill="#3056D3" />
+                    <circle cx="46.5" cy="24.5" r="2.5" fill="#3056D3" />
+                    <circle cx="46.5" cy="46.5" r="2.5" fill="#3056D3" />
+                    <circle cx="46.5" cy="68.5" r="2.5" fill="#3056D3" />
+                    <circle cx="46.5" cy="90.5" r="2.5" fill="#3056D3" />
+                    <circle cx="68.5" cy="2.5" r="2.5" fill="#3056D3" />
+                    <circle cx="68.5" cy="24.5" r="2.5" fill="#3056D3" />
+                    <circle cx="68.5" cy="46.5" r="2.5" fill="#3056D3" />
+                    <circle cx="68.5" cy="68.5" r="2.5" fill="#3056D3" />
+                    <circle cx="68.5" cy="90.5" r="2.5" fill="#3056D3" />
+                    <circle cx="90.5" cy="2.5" r="2.5" fill="#3056D3" />
+                    <circle cx="90.5" cy="24.5" r="2.5" fill="#3056D3" />
+                    <circle cx="90.5" cy="46.5" r="2.5" fill="#3056D3" />
+                    <circle cx="90.5" cy="68.5" r="2.5" fill="#3056D3" />
+                    <circle cx="90.5" cy="90.5" r="2.5" fill="#3056D3" />
+                  </svg>
+                </span>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+
+  <!-- hero 25 end -->
+  
+  <!-- hero 26 start -->
+  
+  <section class="section_divider">
+    <div>Hero 26</div>
+  </section>
+
+<section class="bg-white dark:bg-gray-800">
+ 
+  <div class="container flex flex-col px-6 py-4 mx-auto space-y-6 md:h-128 md:py-16 md:flex-row md:items-center md:space-x-6">
+      <div class="flex flex-col items-center w-full md:flex-row md:w-1/2">
+          <div class="flex justify-center order-2 mt-6 md:mt-0 md:space-y-3 md:flex-col">
+              <button class="w-3 h-3 mx-2 bg-blue-500 rounded-full md:mx-0 focus:outline-none"></button>
+              <button class="w-3 h-3 mx-2 bg-gray-300 rounded-full md:mx-0 focus:outline-none hover:bg-blue-500"></button>
+              <button class="w-3 h-3 mx-2 bg-gray-300 rounded-full md:mx-0 focus:outline-none hover:bg-blue-500"></button>
+              <button class="w-3 h-3 mx-2 bg-gray-300 rounded-full md:mx-0 focus:outline-none hover:bg-blue-500"></button>
+          </div>
+
+          <div class="max-w-lg md:mx-12 md:order-2 text-left">
+              <h1 class="text-3xl font-medium tracking-wide text-gray-800 dark:text-white md:text-4xl">The best Apple Watch apps</h1>
+              <p class="mt-4 text-gray-600 dark:text-gray-300">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Aut quia asperiores alias vero magnam recusandae adipisci ad vitae laudantium quod rem voluptatem eos accusantium cumque.</p>
+              <div class="mt-6">
+                  <a href="#" class="block px-3 py-2 font-semibold text-center text-white transition-colors duration-200 transform bg-blue-500 rounded-md md:inline hover:bg-blue-400">Download from App Store</a>
+              </div>
+          </div>
+      </div>
+
+      <div class="flex items-center justify-center w-full h-96 md:w-1/2">
+          <img class="object-cover w-full h-full max-w-2xl rounded-md" src="https://images.unsplash.com/photo-1579586337278-3befd40fd17a?ixid=MnwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8&ixlib=rb-1.2.1&auto=format&fit=crop&w=1352&q=80" alt="apple watch photo">
+      </div>
+  </div>
+</section>
+
+  <!-- hero 26 end -->
+
+
+  <!-- hero 27 start -->
+  <section class="section_divider">
+    <div>Hero 27</div>
+  </section>
+    
+  <section class="pt-24 bg-white dark:bg-gray-800">
+    <div class="px-12 mx-auto max-w-7xl">
+        <div class="w-full mx-auto text-left md:w-11/12 xl:w-9/12 md:text-center">
+            <h1 class="mb-8 text-4xl font-extrabold leading-none tracking-normal text-gray-900 md:text-6xl md:tracking-tight">
+                <span>Start</span> <span class="block w-full py-2 text-transparent bg-clip-text leading-12 bg-gradient-to-r from-green-400 to-purple-500 lg:inline">building a buzz</span> <span>around your product 🚀</span>
+            </h1>
+            <p class="px-0 mb-8 text-lg text-gray-600 md:text-xl lg:px-24">
+                Start gaining the traction you've always wanted with our next-level templates and designs. Crafted to help you tell your story.
+            </p>
+            <div class="mb-4 space-x-0 md:space-x-2 md:mb-8">
+                <a href="#_" class="inline-flex items-center justify-center w-full px-6 py-3 mb-2 text-lg text-white bg-green-400 hover:text-gray-800 rounded-2xl sm:w-auto sm:mb-0">
+                    Get Started
+                    <svg class="w-4 h-4 ml-1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"><path fill-rule="evenodd" d="M10.293 3.293a1 1 0 011.414 0l6 6a1 1 0 010 1.414l-6 6a1 1 0 01-1.414-1.414L14.586 11H3a1 1 0 110-2h11.586l-4.293-4.293a1 1 0 010-1.414z" clip-rule="evenodd"></path></svg>
+                </a>
+                <a href="#_" class="inline-flex items-center justify-center w-full px-6 py-3 mb-2 text-lg bg-gray-100 hover:text-gray-800 rounded-2xl sm:w-auto sm:mb-0">
+                    Learn More
+                    <svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9.663 17h4.673M12 3v1m6.364 1.636l-.707.707M21 12h-1M4 12H3m3.343-5.657l-.707-.707m2.828 9.9a5 5 0 117.072 0l-.548.547A3.374 3.374 0 0014 18.469V19a2 2 0 11-4 0v-.531c0-.895-.356-1.754-.988-2.386l-.548-.547z"></path></svg>
+                </a>
+            </div>
+        </div>
+        <div class="w-full mx-auto mt-20 text-center md:w-10/12">
+            <div class="relative z-0 w-full mt-8">
+                <div class="relative overflow-hidden shadow-2xl">
+                    <div class="flex items-center flex-none px-4 bg-green-400 rounded-b-none h-11 rounded-xl">
+                        <div class="flex space-x-1.5">
+                            <div class="w-3 h-3 border-2 border-white rounded-full"></div>
+                            <div class="w-3 h-3 border-2 border-white rounded-full"></div>
+                            <div class="w-3 h-3 border-2 border-white rounded-full"></div>
+                        </div>
+                    </div>
+                    <img src="https://cdn.devdojo.com/images/march2021/green-dashboard.jpg">
+                </div>
+            </div>
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 27 end -->
+
+
+  <!-- hero 28 start -->
+  <section class="section_divider">
+    <div>Hero 28</div>
+  </section>
+  
+  <div class="h-screen ">
+  <div class="bg-green-600 w-full h-full p-28 flex items-center justify-center">
+    <div class="max-w-3xl flex h-full m-4 md:m-6">
+      <div class="relative group sm:w-full md:w-1/2 hover:bg-green-800 border-t border-l border-b border-r md:border-r-0 bg-opacity-5 transition-all duration-300">
+      <nav>
+        <ul class="flex p-4 md:p-6 space-x-6 text-white">
+        <li class="cursor-pointer">Platform</li>
+        <li class="cursor-pointer">Services</li>
+        <li class="cursor-pointer">FAQ</li>
+        <ul></nav>
+      <h1 class="pl-4 md:pl-8 mt-6 md:mt-8 text-2xl text-white font-serif transform group-hover:translate-x-6 duration-300 uppercase leading-snug">Fintech: <br/>Top 5 mobile<br/> payment apps</h1>
+      <p class="absolute bottom-1 p-4 md:pl-8 text-white text-xs">Get our app and link your existing cards to Linkr.<br/> and  pay with your cell phone on the go.<br/> Browse, spending, set limits, and more. Link it up.</span>
+      <div class="absolute z-50 bottom-32 md:bottom-10 right-0 transform translate-x-12 flex items-center justify-center w-20 h-20 rounded-full bg-white group-hover:bg-green-200 text-indigo-800 group-hover:text-gray-800 font-semibold cursor-pointer group-hover:scale-110 duration-300 select-none">Get It!</div>
+      </div>
+    <div class="md:w-1/2 hidden md:block bg-indigo-700">
+      <img src="https://images.unsplash.com/photo-1546621083-17f1e50980e9?ixid=MXwxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHw%3D&ixlib=rb-1.2.1&auto=format&fit=crop&w=2800&q=80" alt="mobile payment" class="h-full" />
+    </div>
+  </div>
+  </div>
+  </div>
+  
+  <!-- hero 28 end -->
+  
+  <!-- hero 29 start  -->
+  <section class="section_divider">
+    <div>Hero 29</div>
+  </section>
+    
+  <div class="flex flex-wrap md items-center h-screen">
+    <div class="bg-white dark:bg-gray-800 w-full md:w-1/2 h-screen">
+      <div class="mx-32 text-left">
+        <h1 class="text-6xl font-bold mt-16">Tokyo</h1>
+
+        <!-- country region island -->
+        <div class="flex mt-16 font-light text-gray-500">
+          <div class="mr-10">
+            <span class="uppercase">Country</span>
+            <p class="text-2xl text-gray-900 font-semibold pt-2">Japan</p>
+          </div>
+          <div class="pr-4">
+            <span class="uppercase">Region</span>
+            <p class="text-2xl text-gray-900 font-semibold pt-2">Kanto</p>
+          </div>
+          <div class="pr-4">
+            <span class="uppercase">island</span>
+            <p class="text-2xl text-gray-900 font-semibold pt-2">Honshu</p>
+          </div>
+        </div>
+
+        <!-- description -->
+        <div
+          class="description w-full sm: md:w-2/3 mt-16 text-gray-500 text-sm"
+        >
+          Tokyo, Japan’s busy capital, mixes the ultramodern and the
+          traditional, from neon-lit skyscrapers to historic temples. The
+          opulent Meiji Shinto Shrine is known for its towering gate and
+          surrounding woods. The Imperial Palace sits amid large public
+          gardens
+        </div>
+
+        <button class="uppercase mt-5 text-sm font-semibold hover:underline">
+          read more
+        </button>
+      </div>
+    </div>
+    <div class="bg-red-600 w-full md:w-1/2 h-screen">
+      <img
+        src="https://source.unsplash.com/7H77FWkK_x4/1600x900"
+        class="h-screen w-full"
+        alt=""
+      />
+    </div>
+  </div>
+  
+  <!-- hero 29 end  -->
+
+
+  <!-- hero 30 start -->
+  <section class="section_divider">
+    <div>Hero 30</div>
+  </section>
+
+	<section id="up" class=" bg-[url(https://images.pexels.com/photos/57690/pexels-photo-57690.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=650&w=940)] bg-center bg-fixed bg-no-repeat bg-cover h-screen relative">
+		<div class="h-screen bg-opacity-50 bg-black flex items-center justify-center" style="background:rgba(0,0,0,0.5);">
+			<div class="mx-2 text-center">
+				<h1 class="text-gray-100 font-extrabold text-4xl xs:text-5xl md:text-6xl">
+					<span class="text-white">Right</span> Place To
+           </h1>
+           <h2 class="text-gray-200 font-extrabold text-3xl xs:text-4xl md:text-5xl leading-tight">
+            Get a <span class="text-white">Better</span> and <span class="text-white">Professionals</span> Design
+           </h2>
+           <div class="inline-flex">
+           <button class="p-2 my-5 mx-2 bg-indigo-700 hover:bg-indigo-800 font-bold text-white rounded border-2 border-transparent hover:border-indigo-800 shadow-md transition duration-500 md:text-xl">Hire US!</button>
+           <a href="#about"><button class="p-2 my-5 mx-2 bg-transparent border-2 bg-indigo-200 bg-opacity-75 hover:bg-opacity-100 border-indigo-700 rounded hover:border-indigo-800 font-bold text-indigo-800 shadow-md transition duration-500 md:text-lg">Learn More</button></a>
+           </div>
+        </div>
+    </div>
+  </section>
+  
+  <!-- hero 30 end -->
+
+
+  <!-- hero 31 start -->
+  <section class="section_divider">
+    <div>Hero 31</div>
+  </section>
+
+
+    <div class="hero bg-gray-100 dark:bg-gray-800 py-16">
+        <!-- container -->
+        <div class="container px-4 sm:px-8 lg:px-16 xl:px-20 mx-auto">
+            <!-- hero wrapper -->
+            <div class="hero-wrapper grid grid-cols-1 md:grid-cols-12 gap-8 items-center">
+
+                <!-- hero text -->
+                <div class="hero-text col-span-6">
+                    <h1 class=" font-bold text-4xl md:text-5xl max-w-xl dark:text-gray-100 text-gray-900 leading-tight text-left"> It's Ok , We Can Only Try</h1>
+                    <hr class=" w-12 h-1 bg-orange-500 rounded-full mt-8">
+                    <p class="text-gray-800 leading-relaxed dark:text-gray-100 mt-8 font-semibold text-left">Your ultimate travel companion. Carries all the information you need while travelling</p>
+                    <div class="get-app flex space-x-5 mt-10 justify-center md:justify-start">
+                        <button class="apple bg-white shadow-md px-3 py-2 rounded-lg flex items-center space-x-4">
+                            <div class="logo">
+                                <svg 
+                                    class="w-6 h-6"
+                                    xmlns="http://www.w3.org/2000/svg" 
+                                    width="419.955" height="512" 
+                                    viewBox="0 0 419.955 512">
+                                    <g transform="translate(-46.022)">
+                                        <path d="M185.255,512c-76.2-.439-139.233-155.991-139.233-235.21,0-129.4,97.075-157.734,134.487-157.734,16.86,0,34.863,6.621,50.742,12.48,11.1,4.087,22.588,8.306,28.975,8.306,3.823,0,12.832-3.589,20.786-6.738,16.963-6.753,38.071-15.146,62.651-15.146h.146c18.354,0,74,4.028,107.461,54.272l7.837,11.777-11.279,8.511c-16.113,12.158-45.513,34.336-45.513,78.267,0,52.031,33.3,72.041,49.292,81.665,7.061,4.248,14.37,8.628,14.37,18.208,0,6.255-49.922,140.566-122.417,140.566-17.739,0-30.278-5.332-41.338-10.034-11.191-4.761-20.845-8.862-36.8-8.862-8.086,0-18.311,3.823-29.136,7.881C221.5,505.73,204.752,512,185.753,512Z"/><path d="M351.343,0c1.888,68.076-46.8,115.3-95.425,112.342C247.9,58.015,304.54,0,351.343,0Z"/>
+                                    </g>
+                                </svg>
+                            </div>
+                            <div class="text">
+                                <p class=" text-xs text-gray-600" style="font-size: 0.5rem;">Download on the</p>
+                                <p class=" text-xs font-semibold text-gray-900">Apple Store</p>
+                            </div>
+                        </button>
+                        <button class="google bg-white shadow-md px-3 py-2 rounded-lg flex items-center space-x-4">
+                            <div class="image">
+                                <svg 
+                                    class="w-6 h-6"
+                                    xmlns="http://www.w3.org/2000/svg" 
+                                    width="436.057" height="469.847" 
+                                    viewBox="0 0 436.057 469.847">
+                                    <g transform="translate(-16.896)">
+                                        <path d="M270.336,234.965,34.39,462.165A40.146,40.146,0,0,1,16.9,428.672V41.258A40.146,40.146,0,0,1,34.39,7.765Z" fill="#2196f3"/><path d="M352.9,155.6l-82.56,79.36L34.39,7.765a31.446,31.446,0,0,1,2.773-1.92A40.363,40.363,0,0,1,77.91,5.2Z" fill="#4caf50"/><path d="M452.95,234.965a40.791,40.791,0,0,1-21.333,36.267L352.9,314.325l-82.56-79.36L352.9,155.6l78.72,43.093A40.791,40.791,0,0,1,452.95,234.965Z" fill="#ffc107"/><path d="M352.9,314.325,77.91,464.725a40.9,40.9,0,0,1-40.747-.64,31.44,31.44,0,0,1-2.773-1.92l235.947-227.2Z" fill="#f44336"/>
+                                    </g>
+                                </svg>
+                            </div>
+                            <div class="text">
+                                <p class="text-xs text-gray-600" style="font-size: 0.5rem;">Download it from</p>
+                                <p class="text-xs font-semibold text-gray-900">Google play</p>
+                            </div>
+                        </button>
+                    </div>
+                </div>
+
+                <!-- hero image -->
+                <div class="hero-image col-span-6">
+                    <svg id="Layer_1" data-name="Layer 1" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 400 300"><title>#102_travelling_twocolour</title><path d="M81.77,83.39c-28.67,17.47-45.66,49.51-43,83C40.18,183.48,46.54,200,63.35,209c44.83,24,240.55,24.45,269.51-18s18.19-102.84-44.8-128C233.46,41.18,155.82,38.3,81.77,83.39Z" fill="#e6e6e6" opacity="0.3"/><path d="M283.69,206V180.64a4.65,4.65,0,0,1,4.64-4.65h18.49a4.65,4.65,0,0,1,4.64,4.65V206" fill="none" stroke="#ffd200" stroke-miterlimit="10" stroke-width="2"/><path d="M283.69,206V180.64a4.65,4.65,0,0,1,4.64-4.65h18.49a4.65,4.65,0,0,1,4.64,4.65V206" fill="none" stroke="#000" stroke-miterlimit="10" stroke-width="2" opacity="0.08"/><path d="M159.26,145.74s-18.34,7.36-12.41,28.68,6.48,23.63,19.71,22.32,4.66-22.32,4.66-22.32Z" fill="#ffd200"/><path d="M152.37,79.92s-50.86,11.79-64.24,41.59l45.05,3.4,11.54-7Z" fill="#ed8936"/><path d="M152.37,79.92s-50.86,11.79-64.24,41.59l45.05,3.4,11.54-7Z" fill="#fff" opacity="0.46"/><ellipse cx="200.42" cy="272.36" rx="154.08" ry="11.83" fill="#e6e6e6" opacity="0.45"/><path d="M134.79,246.33s-4.45,3.22-8.54.91-7.67.77-4.87,4.13,14.8,5,14.8,5l4.51-7.28Z" fill="#ed8936"/><path d="M215.08,260.56s1.94,5.15,6.62,5.47,6,4.88,1.79,6.14-15.12-4-15.12-4l.26-8.57Z" fill="#ed8936"/><path d="M79.19,260.08s-10.59-2.9-12.89-12.75c0,0,16.41-3.32,16.87,13.62Z" fill="#ed8936" opacity="0.58"/><path d="M80.49,259s-7.4-11.7-.89-22.64c0,0,12.48,7.93,6.93,22.66Z" fill="#ed8936" opacity="0.73"/><path d="M82.4,259s3.9-12.35,15.72-14.69c0,0,2.21,8-7.65,14.73Z" fill="#ed8936"/><polygon points="74.72 258.75 76.86 273.44 90.38 273.5 92.37 258.83 74.72 258.75" fill="#24285b"/><path d="M156.2,53.77s1.74,6.3,4.27,10a3.28,3.28,0,0,0,4.58.82c1.83-1.3,3.93-3.59,3.41-7.08l-.15-6a5.88,5.88,0,0,0-4.6-5C159.34,45.28,155,50,156.2,53.77Z" fill="#f4a28c"/><polygon points="169.43 54.63 177.9 74.3 166.73 78.19 165.05 62.32 169.43 54.63" fill="#f4a28c"/><path d="M170.86,55.92h0a.62.62,0,0,1-.23.72,4.34,4.34,0,0,1-5.25-.1,5.45,5.45,0,0,1-2.08-5.6,25.94,25.94,0,0,1-5.48,2.52,6,6,0,0,1-2,.32l-3.28-4s-4.23-3.66-1.89-5.67,4.76.61,6.11-2.44,1.54-4.07,4.27-3.72.83,3.12,4.53,1.7,4.36.08,5,1.75a3.1,3.1,0,0,1-.12,1.82A20.1,20.1,0,0,0,170.86,55.92Z" fill="#24285b"/><path d="M164.66,56.6s-.83-2.37,1-2.85,3.06,3,.77,4.16Z" fill="#f4a28c"/><path d="M157.5,57.68l-.83,3A1,1,0,0,0,157.85,62l2.51-.43Z" fill="#f4a28c"/><rect x="289.35" y="173.73" width="16.36" height="5.3" fill="#24285b"/><path d="M165.31,64.43s1.44-.49,3.72-3.33c0,0,1.05,4.15-3.26,8Z" fill="#ce8172" opacity="0.31"/><path d="M162.12,76.62l6.43-1.16a90.83,90.83,0,0,0,8.92-2.08c11-3.14,43.37-10.53,52.58,8.2,11.16,22.69-7.47,96.3-7.47,96.3h-51s-10.41-30.66-25.29-49.62S121,88.21,162.12,76.62Z" fill="#ed8936"/><path d="M152.37,79.92s-2.56,16.32,19.86,4l-5.75-8A58,58,0,0,0,152.37,79.92Z" opacity="0.08"/><path d="M94.92,139.7c-10.16-3.16-11.68-17-2.47-22.37a25.2,25.2,0,0,1,10.9-3.2c17.08-1.26,46.18-2.85,46.18-2.85s17.52,5.7,14.77,14.24-15.08-5.06-15.08-5.06S116.66,146.46,94.92,139.7Z" fill="#f4a28c"/><rect x="144.58" y="110.56" width="6.04" height="12.3" transform="translate(-14.69 21.47) rotate(-7.93)" fill="#24285b"/><rect x="143.84" y="109.5" width="6.04" height="3.82" transform="matrix(0.99, -0.14, 0.14, 0.99, -13.96, 21.32)" fill="#ffd200"/><path d="M166.48,75.84s-7.76,7.14,1.21,8.67,9.78-11.13,9.78-11.13Z" fill="#f4a28c"/><path d="M171.63,177.88l-38.45,68.45,9.93,6.91s21.24-35.45,46.53-53.26a6.38,6.38,0,0,1,9.72,3.27c6.84,21.15,7.42,58,7.42,58H218.5l4.08-83.34Z" fill="#24285b"/><path d="M171.63,177.88s19.15-15,25.92-36.41a6.57,6.57,0,0,1,11.08-2.37l18.2,19.68,3.67-20.57L217.19,96.09,192,79.92l-5,19.51Z" opacity="0.08"/><path d="M163.36,158.94s11.81-11.72,14.11-50.86c1.91-32.56,6.58-38.92,16.33-41.2,15.06-3.54,18.65.94,23.39,7.63,0,0-24.08,1.49-23.24,16.56s-2.51,68.75-22.32,86.81C171.63,177.88,162.44,177.11,163.36,158.94Z" fill="#ffd200"/><path d="M163.36,158.94s11.81-11.72,14.11-50.86c1.91-32.56,6.58-38.92,16.33-41.2,15.06-3.54,18.65.94,23.39,7.63,0,0-24.08,1.49-23.24,16.56s-2.51,68.75-22.32,86.81C171.63,177.88,162.44,177.11,163.36,158.94Z" fill="#fff" opacity="0.46"/><path d="M196.37,93.76c-5-12,8.93-27.14,21-22.46,10.32,4,21.35,12.84,27.34,30.64C258.94,144.25,291,164.7,291,164.7s16.36,2.7,16.36,8.65-19.34,0-19.34,0-50.2-20.83-76.24-54.3C204,109,199.22,100.59,196.37,93.76Z" fill="#f4a28c"/><path d="M226.35,134.56s19.94-6.75,25-16.62c0,0-7.22-38.91-32.87-47.28-8.44-2.75-17.87.34-22.29,8C190.83,88,192,105.22,226.35,134.56Z" fill="#ed8936"/><path d="M226.35,134.56s19.94-6.75,25-16.62c0,0-7.22-38.91-32.87-47.28-8.44-2.75-17.87.34-22.29,8C190.83,88,192,105.22,226.35,134.56Z" fill="#fff" opacity="0.46"/><rect x="271.49" y="198.46" width="52.16" height="67.53" fill="#ffd200"/><rect x="278.47" y="265.99" width="6.37" height="6.37" fill="#24285b"/><rect x="309.43" y="265.99" width="6.37" height="6.37" fill="#24285b"/><rect x="280.14" y="211.01" width="7.25" height="40.35" opacity="0.08"/><rect x="293.95" y="211.01" width="7.25" height="40.35" opacity="0.08"/><rect x="306.92" y="211.01" width="7.25" height="40.35" opacity="0.08"/><circle cx="222.58" cy="34.77" r="21.04" fill="#24285b"/><polygon points="214.44 34.77 196.44 52.7 220.3 43.18 214.44 34.77" fill="#24285b"/><rect x="220.3" y="25.3" width="3.51" height="11.08" fill="#fff"/><rect x="220.3" y="39.43" width="3.51" height="3.51" fill="#fff"/></svg>
+                </div>
+            </div>
+        </div>
+    </div>
+        
+  <!-- hero 31 end -->
+
+  <!-- hero 32 start -->
+  <section class="section_divider">
+    <div>Hero 32</div>
+  </section>
+
+  <div class="relative bg-white dark:bg-gray-800 overflow-hidden">
+    <div class="max-w-7xl mx-auto">
+      <div class="relative z-10 pb-8  pt-10 dark:bg-gray-800 bg-white sm:pb-16 md:pb-20 lg:max-w-2xl lg:w-full lg:pb-28 xl:pb-32">
+        <svg class="hidden lg:block absolute right-0 inset-y-0 h-full w-48 dark:text-gray-800 text-white transform translate-x-1/2" fill="currentColor" viewBox="0 0 100 100" preserveAspectRatio="none" aria-hidden="true">
+          <polygon points="50,0 100,0 50,100 0,100" />
+        </svg>
+
+        <main class="mt-10 mx-auto max-w-7xl px-4 sm:mt-12 sm:px-6 md:mt-16 lg:mt-20 lg:px-8 xl:mt-28">
+          <div class="sm:text-center lg:text-left">
+            <h1 class="text-4xl tracking-tight font-extrabold text-gray-900 sm:text-5xl md:text-6xl">
+              <span class="block xl:inline">Data to enrich your</span>
+              <span class="block text-indigo-600 xl:inline">online business</span>
+            </h1>
+            <p class="mt-3 text-base text-gray-500 sm:mt-5 sm:text-lg sm:max-w-xl sm:mx-auto md:mt-5 md:text-xl lg:mx-0">Anim aute id magna aliqua ad ad non deserunt sunt. Qui irure qui lorem cupidatat commodo. Elit sunt amet fugiat veniam occaecat fugiat aliqua.</p>
+            <div class="mt-5 sm:mt-8 sm:flex sm:justify-center lg:justify-start">
+              <div class="rounded-md shadow">
+                <a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-white bg-indigo-600 hover:bg-indigo-700 md:py-4 md:text-lg md:px-10"> Get started </a>
+              </div>
+              <div class="mt-3 sm:mt-0 sm:ml-3">
+                <a href="#" class="w-full flex items-center justify-center px-8 py-3 border border-transparent text-base font-medium rounded-md text-indigo-700 bg-indigo-100 hover:bg-indigo-200 md:py-4 md:text-lg md:px-10"> Live demo </a>
+              </div>
+            </div>
+          </div>
+        </main>
+      </div>
+    </div>
+    <div class="lg:absolute lg:inset-y-0 lg:right-0 lg:w-1/2">
+      <img class="h-56 w-full object-cover sm:h-72 md:h-96 lg:w-full lg:h-full" src="https://images.unsplash.com/photo-1551434678-e076c223a692?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=2850&q=80" alt="">
+    </div>
+  </div>
+
+  <!-- hero 32 end -->
+
+  <!-- hero 33 start -->
+  <section class="section_divider">
+    <div>Hero 33</div>
+  </section>
+
+    
+  <div class="dark:bg-gray-900">
+    <!--- more free and premium Tailwind CSS components at https://tailwinduikit.com/ --->
+    <div class="container mx-auto py-9 md:py-12 lg:py-24">
+      <div class="flex flex-col lg:flex-row justify-center items-strech mx-4">
+        <div class="lg:w-4/12 flex justify-center items-center">
+          <div>
+            <h1 class="dark:text-white text-4xl md:text-5xl xl:text-6xl font-semibold text-gray-900 w-7/12 text-left">Amoire</h1>
+            <p class="dark:text-gray-300 md:w-7/12 lg:w-11/12 xl:w-10/12 mt-4 lg:mt-5 text-base leading-normal text-gray-600 text-left">It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using.</p>
+          </div>
+        </div>
+        <div class="lg:w-8/12 mt-6 md:mt-8 lg:mt-0">
+          <div class="relative w-full h-full">
+            <img src="https://i.ibb.co/gmV2mLr/pexels-maksim-goncharenok-4352247-1-1-1.png" alt="A lounge sofa" role="img" class="w-full  relative hidden lg:block" />
+            <img src="https://i.ibb.co/Mhgkt2f/pexels-maksim-goncharenok-4352247-1-1-1.png" alt="A lounge sofa" role="img" class="w-full h-full lg:hidden" />
+            <div class="hidden lg:block absolute bottom-0 right-0 bg-red-200 w-1/2">
+              <button class="dark:hover:bg-gray-800 dark:bg-white dark:hover:text-gray-50 dark:text-gray-800 bg-gray-800 text-xl xl:text-2xl font-medium text-white flex justify-between w-full items-center p-5 xl:p-6 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-800 hover:bg-gray-700">
+                Discover More
+                <div>
+                  <svg class="fill-stroke dark:hover:text-gray-600" width="32" height="32" viewBox="0 0 32 32" fill="none" xmlns="http://www.w3.org/2000/svg">
+                    <path d="M6.66663 16H25.3333" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M20 21.3333L25.3333 16" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M20 10.667L25.3333 16.0003" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                  </svg>
+                </div>
+              </button>
+            </div>
+          </div>
+          <div class="mt-6 md:mt-8 lg:hidden">
+            <button class="dark:hover:bg-gray-800 dark:bg-white dark:hover:text-gray-50 dark:text-gray-800 bg-gray-800 text-base md:text-xl font-semibold leading-tight text-white flex justify-between items-center px-5 py-4 lg:py-7 lg:px-7 w-full md:w-5/12 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-gray-800 hover:bg-gray-700">
+              Discover More
+              <div>
+                <svg class="fill-stroke" width="22" height="24" viewBox="0 0 22 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+                  <g clip-path="url(#clip0)">
+                    <path d="M0.453735 12H14.4537" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M10.4539 16L14.4539 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                    <path d="M10.4539 8L14.4539 12" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" />
+                  </g>
+                  <defs>
+                    <clipPath id="clip0">
+                      <rect width="21.7269" height="24" fill="white" />
+                    </clipPath>
+                  </defs>
+                </svg>
+              </div>
+            </button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+  <!-- hero 33 end -->
+
+
+
+
+
 <!-- start of script section -->
 <script type="text/javascript">
   let toogler = document.getElementById("dark_mood_toogler");
@@ -576,7 +1579,7 @@
       }
   })
   doc_html_el.addEventListener('keyup',(e)=>{
-      // key 220 is the backward slash , need to press ctrl+ / to show or hide the darkmode button
+      // key 191 is the forward slash , need to press ctrl+ / to show or hide the darkmode button
       if(e.ctrlKey && e.keyCode =='191'){
         toogler.style.display =='block'? toogler.style.display = 'none':toogler.style.display ='block';