diff --git a/src/App/App.css b/src/App/App.css
index 2840b7c25425b4c87057790ebbcef0d8f91a392e..d8f6de7bec1224d063db20b06af2155dec44a5bb 100644
--- a/src/App/App.css
+++ b/src/App/App.css
@@ -53,6 +53,30 @@
   display: none;
 }
 
+.col-max{
+  flex: 0 0 0%;
+  width: max-content !important; 
+  min-width: 77% !important; 
+  max-width: 90% !important;
+}
+
+.col-2{
+  width:16.66666667% !important;
+}
+
+.col-1{
+  width: 8.33333333% !important;
+}
+
+.col-max-10{
+  flex: 0 0 auto;
+  max-width: 83.33333333% !important;
+}
+
+.col{
+  max-width: 100% !important;
+}
+
 
 /* * * * * * * */
 /* * * BODY* * */
@@ -460,6 +484,10 @@ svg {
   max-width: 100%;
   display: block;
 }
+
+.s-svg{
+  max-width: 80%;
+}
 img .middle{
   vertical-align:middle;
 }
diff --git a/src/components/testsvganimation.tsx b/src/components/testsvganimation.tsx
index 813b542b18ce73673d213fd2f3612d3a2f2b19d7..c16363599367dd71798187331c833d030bdc0afb 100644
--- a/src/components/testsvganimation.tsx
+++ b/src/components/testsvganimation.tsx
@@ -28,8 +28,8 @@ console.log("Started TestSVG")
       scrollTrigger: {
         trigger: "svg",
         scrub: true,
-        start:"top center",
-        end: "bottom center"
+        start:"top middle",
+        end: "bottom middle"
       }
     })
     
@@ -56,7 +56,7 @@ console.log("Started TestSVG")
 
  
   return (
-    <div className="Animation">
+    <div className="col-8">
       
       <svg id="svg" xmlns="" viewBox="0 0 1980 4400">
         
diff --git a/src/contents/example.tsx b/src/contents/example.tsx
index f6231ef322a7eb58246f5ec62d804e285c201b07..96916625a8b770d7d3747ed50fca77e777041c27 100644
--- a/src/contents/example.tsx
+++ b/src/contents/example.tsx
@@ -6,8 +6,9 @@ import TestSVG from "../components/testsvganimation";
 export function Example() {
     return (
       <>
-        <TestSVG></TestSVG>
+      <div className="col">
         <div className="col">
+        <TestSVG></TestSVG>
             <h3 className="example">Exercises</h3>
             <i><h6>By Your name</h6></i>
             <div className="example-exercise">
@@ -185,6 +186,7 @@ export function Example() {
 
         
 
+        </div>
       </>
     );
   }