diff --git a/sesame-vitejs/sesame/src/assets/styles/7-responsive.css b/sesame-vitejs/sesame/src/assets/styles/7-responsive.css
index 0a596f8..542a92b 100644
--- a/sesame-vitejs/sesame/src/assets/styles/7-responsive.css
+++ b/sesame-vitejs/sesame/src/assets/styles/7-responsive.css
@@ -100,6 +100,7 @@
 	.slider-screen {
 		min-height: 100vh;
 	}
+
 }
 
 @media screen and (max-width: 35em) {
diff --git a/sesame-vitejs/sesame/src/assets/styles/_11-carry.scss b/sesame-vitejs/sesame/src/assets/styles/_11-carry.scss
index 110b5d5..16bfd0b 100644
--- a/sesame-vitejs/sesame/src/assets/styles/_11-carry.scss
+++ b/sesame-vitejs/sesame/src/assets/styles/_11-carry.scss
@@ -117,23 +117,31 @@
 	}
 }
 
-@media screen and (max-width: 1600px) {
+@media all and (max-width: 1600px) {
 	section#carry {
 
-		min-height: 200vh;
+		min-height: 120rem;
 
 		.description {
 			margin-top: 3vh;
 			font-size: 8rem;
 		}
-		//
-		//.gradient-bg {
-		//	top: 0;
-		//	left: 15vw;
-		//}
+
+		.gradient-bg {
+			top: -40rem;
+		}
+
+		.gradient-bg-yellow {
+			top: 10rem;
+		}
 
 		.computer-block {
-			margin-top: -50vh;
+			width: 70%;
+			height: 1080px;
+			left: 0;
+			top: -110em;
+			background-size: contain;
+			margin: 0 auto;
 		}
 
 		.bubbles {
@@ -163,11 +171,11 @@
 	}
 }
 
-@media screen and (max-width: 1023px) {
+@media all and (max-width: 1100px) {
 	section#carry {
 		padding-left: 10vw;
 		padding-right: 10vw;
-		min-height: 200vh ;
+		min-height: 115rem;
 
 		.title {
 			font-size: 4rem;
@@ -182,12 +190,24 @@
 			background-size: contain;
 			position: relative;
 			height: 100vh;
-			margin-top: -73vh;
+			width: 100%;
+			margin-top: -15rem;
 		}
+
+		.gradient-bg {
+			margin-top: 0;
+		}
+
+		.gradient-bg-yellow {
+			margin-top: 0;
+		}
+
 		.bubbles{
-			position: relative;
-			left: -5vw;
+			position: static;
+
 			p {
+				margin-top: 2rem;
+				left: 0;
 				&:nth-of-type(1){
 					left: 10%;
 				}
@@ -197,18 +217,15 @@
 				}
 
 				&:nth-of-type(3){
-					left: 50%;
 
+					left: 4vw;
+					margin-left: -60%;
 				}
 				&:nth-of-type(4){
-					left: 10%;
+					left: -10%;
 				}
 			}
 		}
-		//.gradient-bg{
-		//	top: 19vh;
-		//	left:15vw;
-		//}
 	}
 
 }
diff --git a/sesame-vitejs/sesame/src/assets/styles/_12-kyc.scss b/sesame-vitejs/sesame/src/assets/styles/_12-kyc.scss
index 8703975..02c24a2 100644
--- a/sesame-vitejs/sesame/src/assets/styles/_12-kyc.scss
+++ b/sesame-vitejs/sesame/src/assets/styles/_12-kyc.scss
@@ -1,5 +1,4 @@
 #kyc{
-	position: absolute;
 
 	font-family: 'GT Walsheim Pro';
 	background: white;
@@ -173,7 +172,7 @@ margin-top: 250px;
 @media screen and (max-width: 1300px) {
 	#kyc{
 		.small-bubble:nth-of-type(1){
-			margin-top:4rem;
+			margin-top: 14rem;
 
 		}
 		.bubbles{
@@ -187,7 +186,7 @@ margin-top: 250px;
 					margin-left: 5rem;
 				}
 				&:nth-of-type(3){
-					margin-left: 10rem;
+					margin-left: 34%;
 					margin-top: 0;
 				}
 			}
diff --git a/sesame-vitejs/sesame/src/assets/styles/_13-china.scss b/sesame-vitejs/sesame/src/assets/styles/_13-china.scss
index 9c6b938..7449320 100644
--- a/sesame-vitejs/sesame/src/assets/styles/_13-china.scss
+++ b/sesame-vitejs/sesame/src/assets/styles/_13-china.scss
@@ -1,13 +1,10 @@
 #china {
-	//background-color: green;
-	background: url('img/china-bg.png') no-repeat;
-	background-size: cover;
+	background-color: #141373;
 	height: 1060px;
-	width: 99vw;
-	position: relative;
-	top: 200vh;
+	width: 100vw;
 	padding-bottom: 20rem;
-	border-radius: 2rem;
+	border-radius: 5rem;
+	overflow: hidden;
 
 	.line {
 		background: url(img/line.png) no-repeat;
@@ -58,7 +55,8 @@
 		z-index: 10;
 	}
 
-	.block-items, block-item {
+
+	.block-item {
 		color: white;
 		font-family: 'GT Walsheim Pro';
 		font-style: normal;
@@ -69,62 +67,100 @@
 		background-size: contain;
 	}
 
-	.block-item {
+	.block-items {
 
+		.block-item {
+
+
+			.bottom {
+				margin-left: 2rem;
+			}
+
+			&:nth-of-type(1) {
+				background: url('img/block_pillar_1.png') no-repeat;
+				background-size: contain;
+
+				margin-top: 2rem;
+
+				.bottom {
+					margin-top: 21rem;
+				}
+			}
+
+			&:nth-of-type(2) {
+				background: url('img/block_pillar_2.png') no-repeat;
+				background-size: contain;
+				margin-top: 8rem;
+
+				.bottom {
+					margin-top: 22rem;
+				}
+			}
+
+			&:nth-of-type(3) {
+				background: url('img/block_pillar_3.png') no-repeat;
+				background-size: contain;
+				margin-top: 10rem;
+
+				.bottom {
+					margin-top: 25rem;
+				}
+			}
+
+			&:nth-of-type(4) {
+				background: url('img/block_pillar_4.png') no-repeat;
+				background-size: contain;
+				margin-top: 1rem;
+
+				.bottom {
+					margin-top: 24rem;
+				}
+			}
+		}
+	}
+
+	.show-on-medium {
+		display: block;
+	}
+
+	.hide-on-medium {
+		display: none;
+	}
+}
+
+@media screen and (max-width: 1300px) {
+	#china {
+		.show-on-medium {
+			display: none;
+		}
+
+		.hide-on-medium {
+			display: block;
+		}
+
+		.line {
+			width: 62vw;
+			top: 10vh;
+		}
+
+		.block-item {
+			margin-bottom: 2rem;
+			text-align:center;
+		}
+
+		.top {
+			font-size: 4rem;
+			margin-bottom: 2rem;
+		}
 
 		.bottom {
-			margin-left: 2rem;
+			font-size: 3rem;
 		}
 
-		&:nth-of-type(1) {
-			background: url('img/block_pillar_1.png') no-repeat;
-			background-size: contain;
-
-			margin-top: 2rem;
-
-			.bottom {
-				margin-top: 21rem;
-			}
-		}
-
-		&:nth-of-type(2) {
-			background: url('img/block_pillar_2.png') no-repeat;
-			background-size: contain;
-			margin-top: 8rem;
-
-			.bottom {
-				margin-top: 22rem;
-			}
-		}
-
-		&:nth-of-type(3) {
-			background: url('img/block_pillar_3.png') no-repeat;
-			background-size: contain;
-			margin-top: 10rem;
-
-			.bottom {
-				margin-top: 25rem;
-			}
-		}
-
-		&:nth-of-type(4) {
-			background: url('img/block_pillar_4.png') no-repeat;
-			background-size: contain;
-			margin-top: 1rem;
-
-			.bottom {
-				margin-top: 24rem;
-			}
-		}
-	}
-}
-
-@media screen and (max-width: 1023px) {
-	#china {
-		.block-item {
-			margin: 0;
-			.bottom {
-				margin: 0;
+		.cols {
+			.columns {
+				text-align: center;
+				display: block;
 			}
 		}
 	}
diff --git a/sesame-vitejs/sesame/src/assets/styles/_14-we-develop.scss b/sesame-vitejs/sesame/src/assets/styles/_14-we-develop.scss
index aac2b1b..f6d6793 100644
--- a/sesame-vitejs/sesame/src/assets/styles/_14-we-develop.scss
+++ b/sesame-vitejs/sesame/src/assets/styles/_14-we-develop.scss
@@ -1,5 +1,5 @@
 #we_develop {
-	height: 100vh;
+	height: 200vh;
 	width: 100vw;
 	display: block;
 	position: relative;
@@ -7,9 +7,10 @@
 	background-color: #fff;
 
 	text-align: center;
+	margin-top: -14rem;
 
 	.title {
-		padding-top: 4rem;
+		padding-top: 26rem;
 		padding-bottom: 2rem;
 		font-family: 'GT Walsheim Pro';
 		font-style: normal;
@@ -19,12 +20,9 @@
 		text-align: center;
 		letter-spacing: -0.04em;
 		max-width: 54rem;
-		margin: 0 auto;
+		margin: 2rem auto;
 	}
 
-	.description {
-
-	}
 
 	.quick, .long_term {
 		font-family: 'GT Walsheim';
@@ -38,7 +36,7 @@
 
 		position: absolute;
 		left: 104px;
-		top: 690px;
+		top: 70rem;
 	}
 
 	.long_term {
@@ -106,6 +104,7 @@
 
 		img {
 			margin-top: 1.25rem;
+			margin-left: 0;
 		}
 	}
 
@@ -115,19 +114,22 @@
 		height: 4rem;
 		width: 4rem;
 		position: absolute;
-		top: 50vh;
-		left: 28vw;
+		top: 67rem;
+		background: white;
+
+		&.circle-right {
+			right: 31vw;
+		}
+
+		&.circle-left {
+			right: 66vw;
+		}
 	}
 
-	.circle-right {
-		left: auto;
-		right: 28vw;
-	}
 
 	.arrow-right-2 {
 		position: absolute;
-		left: auto;
-		right: 28vw;
+
 	}
 
 	.rotated {
@@ -136,3 +138,48 @@
 	}
 
 }
+
+@media all and (max-width: 1500px) {
+	#we_develop {
+		.circle {
+			&.circle-right {
+				right: 10vw;
+			}
+
+
+			&.circle-left {
+				right: 90vw;
+			}
+		}
+
+		.quick {
+			left: 3rem;
+			top: 77rem;
+		}
+
+		.long_term {
+			margin-right: 5rem;
+		}
+
+		.data {
+			text-align: left;
+			padding-left: 6rem;
+			margin-top: 2rem;
+		}
+
+		.ar {
+			text-align: right;
+			padding-right: 6rem;
+			margin-top: 3rem;
+		}
+	}
+
+}
+
+@media all and (max-width: 1100px) {
+	#we_develop {
+		.ar {
+			margin-top: -3rem;
+		}
+	}
+}
diff --git a/sesame-vitejs/sesame/src/components/CoverSection.vue b/sesame-vitejs/sesame/src/components/CoverSection.vue
index a75b0b1..2306334 100644
--- a/sesame-vitejs/sesame/src/components/CoverSection.vue
+++ b/sesame-vitejs/sesame/src/components/CoverSection.vue
@@ -7,100 +7,150 @@
   <main class="has-text-centered">
     <!--		sprint 4 content-->
     <div id="sprint_4">
-      <section
-        id="transactionnal_webdesign"
-        class="has-text-centerd"
-      >
-        <h2 class="title">
-          Transactional
-        </h2>
-        <div class="description has-text-centered">
-          Webdesign
-        </div>
-        <div class="columns">
-          <div class="column first">
-            <h3 class="sub-title">
-              For all your
-              <br>
-              <span class="color-emphasis"> digital</span> uses.
-            </h3>
-          </div>
-          <div class="column second">
-            Our creative competitive edge <br>
-            <br>
-            We leverage our own studio in Paris equipped to produce all e-formats.
-            We power transactional content with our technology. Our content is
-            transactional and generate online sales. We produce multi-purpose
-            content at scale for all touchpoints to reduce costs.
-          </div>
-        </div>
-      </section>
-
-      <section id="carry">
-        <h2 class="title color-emphasis">
-          We carry out web design and development
-        </h2>
-        <p class="description">
-          in headless
-          <br>
-          commerce.
-        </p>
-        <div class="gradient-bg-yellow" />
-        <div class="gradient-bg" />
-        <div class="computer-block" />
-        <div class="bubbles secondary-color">
-          <p>Evolutive maintenance</p>
-          <p>Front end (ux/ui) development</p>
-          <p>Web App (pwa) development</p>
-          <p>Consulting</p>
-        </div>
-      </section>
-
       <!--			responsive managed until here -->
 
-      <section id="kyc">
-        <p class="description2 primary-color">
-          We craft e-commerce Ux template based on qualitative and quantitative
-          studies
+      <section id="china">
+        <h2 class="title primary-color">
+          Our China-inspired ui in 4 pillars
+        </h2>
+        <p class="description secondary-color">
+          a quick and smooth consumer journey and never
+          <br>
+          ending shopping experience at the same time
         </p>
-        <div class="columns">
-          <div class="column left-column">
-            <h2 class="title primary-color text-content">
-              We help you to know your customer needs
-            </h2>
-            <p class="description secondary-color text-content">
-              With our method
-            </p>
-            <a
-              href="#kyc"
-              class="button text-content"
-            > Show Sesame method </a>
+        <div class="line" />
+        <div class="pillars show-on-medium">
+          <div class="block-items columns ">
+            <div class="block-item column">
+              <div class="top block-item-1">
+                <p>
+                  Content driven
+                </p>
+              </div>
+              <div class="bottom block-item-2">
+                - Rebound rate
+              </div>
+            </div>
+            <div class="block-item column">
+              <div class="top block-item-3">
+                <p>
+                  Experimental
+                </p>
+              </div>
+              <div class="bottom block-item-4">
+                - Return rate
+              </div>
+            </div>
+            <div class="block-item column">
+              <div class="top block-item-5">
+                <p>
+                  Interactive
+                </p>
+              </div>
+              <div class="bottom block-item-6">
+                +Conversion rate
+              </div>
+            </div>
+            <div class="block-item column">
+              <div class="top block-item-7">
+                <p>
+                  Agile
+                </p>
+              </div>
+              <div class="bottom block-item-8">
+                + Retention rate
+              </div>
+            </div>
           </div>
-          <div class="column" />
         </div>
-        <div class="bubbles secondary-color fat-text">
-          <div class="small-bubble" />
-          <div class="small-bubble" />
-          <div class="small-bubble" />
-          <div class="small-bubble" />
-          <div class="small-bubble" />
-          <p class="bubble">
-            <span>
+        <div class="cols hide-on-medium">
+          <div class="small-cols columns">
+            <div class="block-item column">
+              <div class="top block-item-1">
+                <p>
+                  Content driven
+                </p>
+              </div>
+              <div class="bottom block-item-2">
+                - Rebound rate
+              </div>
+            </div>
+            <div class="block-item column">
+              <div class="top block-item-3">
+                <p>
+                  Experimental
+                </p>
+              </div>
+              <div class="bottom block-item-4">
+                - Return rate
+              </div>
+            </div>
+            <div class="block-item column">
+              <div class="top block-item-5">
+                <p>
+                  Interactive
+                </p>
+              </div>
+              <div class="bottom block-item-6">
+                +Conversion rate
+              </div>
+            </div>
+            <div class="block-item column">
+              <div class="top block-item-7">
+                <p>
+                  Agile
+                </p>
+              </div>
+              <div class="bottom block-item-8">
+                + Retention rate
+              </div>
+            </div>
+          </div>
+        </div>
+      </section>
 
-              to Prioritize development effort
-            </span>
-          </p>
-          <p class="bubble">
-            <span>
+      <section id="we_develop">
+        <h2 class="title secondary-color">
+          We develop custom-made innovative e-commerce features based on your
+          brand stakes.
+        </h2>
+        <div class="phone-container-2">
+          <div class="top" />
+          <div class="picture" />
+          <div class="bottom" />
+        </div>
+        <div class="container-arrows">
+          <div class="circle circle-left">
+            <img
+              class="rotated"
+              src="img/arrow.svg"
+              alt=""
+            >
+          </div>
+          <div class="circle circle-right">
+            <img
 
-              to improve customer satisfaction
-            </span>
-          </p>
-          <p class="bubble">
-            <span>
-              to increase conversion rate
-            </span>
-          </p>
+              src="img/arrow.svg"
+              alt=""
+            >
+          </div>
+        </div>
+
+        <div class="columns light-text">
+          <div class="column data">
+            Data
+          </div>
+          <div class="column ar">
+            AR
+          </div>
+        </div>
+        <div class="quick secondary-color">
+          Quick wins
+        </div>
+        <div class="long_term secondary-color">
+          Long-Term
+          <br>
+          Project
         </div>
       </section>
     </div>
diff --git a/sesame-vitejs/sesame/src/components/DisabledSection.vue b/sesame-vitejs/sesame/src/components/DisabledSection.vue
index e6b9bc8..1e8090b 100644
--- a/sesame-vitejs/sesame/src/components/DisabledSection.vue
+++ b/sesame-vitejs/sesame/src/components/DisabledSection.vue
@@ -1,109 +1,101 @@
 <template>
 
-
-
-
-
-	<section id="china">
-		<h2 class="title primary-color">
-			Our China-inspired ui in 4 pillars
+	<section
+		id="transactionnal_webdesign"
+		class="has-text-centerd"
+	>
+		<h2 class="title">
+			Transactional
 		</h2>
-		<p class="description secondary-color">
-			a quick and smooth consumer journey and never
+		<div class="description has-text-centered">
+			Webdesign
+		</div>
+		<div class="columns">
+			<div class="column first">
+				<h3 class="sub-title">
+					For all your
+					<br>
+					<span class="color-emphasis"> digital</span> uses.
+				</h3>
+			</div>
+			<div class="column second">
+				Our creative competitive edge <br>
+				<br>
+				We leverage our own studio in Paris equipped to produce all e-formats.
+				We power transactional content with our technology. Our content is
+				transactional and generate online sales. We produce multi-purpose
+				content at scale for all touchpoints to reduce costs.
+			</div>
+		</div>
+	</section>
+	<section id="carry">
+		<h2 class="title color-emphasis">
+			We carry out web design and development
+		</h2>
+		<p class="description">
+			in headless
 			<br>
-			ending shopping experience at the same time
+			commerce.
 		</p>
-		<div class="line" />
-		<div class="block-items columns">
-			<div class="block-item column">
-				<div class="top block-item-1">
-					<p>
-						Content driven
-					</p>
-				</div>
-				<div class="bottom block-item-2">
-					- Rebound rate
-				</div>
-			</div>
-			<div class="block-item column">
-				<div class="top block-item-3">
-					<p>
-						Experimental
-					</p>
-				</div>
-				<div class="bottom block-item-4">
-					- Return rate
-				</div>
-			</div>
-			<div class="block-item column">
-				<div class="top block-item-5">
-					<p>
-						Interactive
-					</p>
-				</div>
-				<div class="bottom block-item-6">
-					+Conversion rate
-				</div>
-			</div>
-			<div class="block-item column">
-				<div class="top block-item-7">
-					<p>
-						Agile
-					</p>
-				</div>
-				<div class="bottom block-item-8">
-					+ Retention rate
-				</div>
+		<div class="gradient-bg-yellow" />
+		<div class="gradient-bg" />
+		<div class="computer-block" />
+		<div class="bubbles secondary-color">
+			<p>Evolutive maintenance</p>
+			<p>Front end (ux/ui) development</p>
+			<p>Web App (pwa) development</p>
+			<p>Consulting</p>
+		</div>
+	</section>
+	<section id="kyc">
+		<p class="description2 primary-color">
+			We craft e-commerce Ux template based on qualitative and quantitative
+			studies
+		</p>
+		<div class="columns">
+			<div class="column left-column">
+				<h2 class="title primary-color text-content">
+					We help you to know your customer needs
+				</h2>
+				<p class="description secondary-color text-content">
+					With our method
+				</p>
+				<a
+					href="#kyc"
+					class="button text-content"
+				> Show Sesame method </a>
 			</div>
+			<div class="column" />
+		</div>
+		<div class="bubbles secondary-color fat-text">
+			<div class="small-bubble" />
+			<div class="small-bubble" />
+			<div class="small-bubble" />
+			<div class="small-bubble" />
+			<div class="small-bubble" />
+			<p class="bubble">
+            <span>
+
+              to Prioritize development effort
+            </span>
+			</p>
+			<p class="bubble">
+            <span>
+
+              to improve customer satisfaction
+            </span>
+			</p>
+			<p class="bubble">
+            <span>
+              to increase conversion rate
+            </span>
+			</p>
 		</div>
 	</section>
 
 
 
-	<section id="we_develop">
-		<h2 class="title secondary-color">
-			We develop custom-made innovative e-commerce features based on your
-			brand stakes.
-		</h2>
-		<div class="phone-container-2">
-			<div class="top" />
-			<div class="picture" />
-			<div class="bottom" />
-		</div>
-		<div class="container-arrows">
-			<div class="circle">
-				<img
-					class="rotated"
-					src="img/arrow.svg"
-					alt=""
-				>
-			</div>
-			<div class="circle circle-right">
-				<img
 
-					src="img/arrow.svg"
-					alt=""
-				>
-			</div>
-		</div>
-
-		<div class="columns light-text">
-			<div class="column data">
-				Data
-			</div>
-			<div class="column ar">
-				AR
-			</div>
-		</div>
-		<div class="quick secondary-color">
-			Quick wins
-		</div>
-		<div class="long_term secondary-color">
-			Long-Term
-			<br>
-			Project
-		</div>
-	</section>
 
 	<section id="full_creative">
 		<h2 class="title secondary-color">
@@ -147,7 +139,6 @@
 			</div>
 		</div>
 	</section>
-
 	<section id="our_team">
 		<h2 class="title primary-color">
 			Our team.