Index: arms/index/assets/css/style.css
===================================================================
diff -u -rf5aaffc8a24235e6afe8059d928665889fd2b4d3 -r630b6cf3febddbc2002a3b451e3c2405cbad86d5
--- arms/index/assets/css/style.css	(.../style.css)	(revision f5aaffc8a24235e6afe8059d928665889fd2b4d3)
+++ arms/index/assets/css/style.css	(.../style.css)	(revision 630b6cf3febddbc2002a3b451e3c2405cbad86d5)
@@ -326,6 +326,22 @@
 	background-color: #0563bb;
 }
 
+.section-container .col-lg-4 {
+	display: flex;
+	justify-content: center;
+	border: 2px solid #fff;
+}
+
+.endpoint .row {
+	display: flex;
+	justify-content: center;
+	padding: 0 20px;
+}
+
+.endpoint .col-lg-4 {
+	min-width: 380px;
+}
+
 /*--------------------------------------------------------------
 # Sections General
 --------------------------------------------------------------*/
@@ -376,6 +392,7 @@
 	padding: 5px;
 }
 .content-section {
+	position: relative;
 	padding: 20px;
 	max-width: 325px;
 }
@@ -670,65 +687,87 @@
 }
 
 /*--------------------------------------------------------------
-# Footer
+# comment
 --------------------------------------------------------------*/
-#footer {
-	color: #fff;
-	font-size: 14px;
-	text-align: center;
-	padding: 30px 0;
+.content-section .comment {
+	display: flex;
+	align-items: center;
+	width: 29%;
+	aspect-ratio: 4 / 2.5;
+	position: absolute;
+	font-size: 12px;
+	word-break: break-all;
+	line-height: normal;
 }
 
-#footer h3 {
-	font-size: 36px;
-	font-weight: 700;
-	position: relative;
-	font-family: "Poppins", sans-serif;
-	padding: 0;
-	margin: 0 0 15px 0;
+.section1_1 .comment {
+	top: 13%;
+	left: 39%;
 }
 
-#footer p {
-	font-size: 15px;
-	font-style: italic;
-	padding: 0;
-	margin: 0 0 40px 0;
+.section1_2 .comment,
+.section2_1 .comment,
+.section3_1 .comment,
+.section4_1 .comment {
+	top: 13.5%;
+	left: 34%;
 }
 
-#footer .social-links {
-	margin: 0 0 40px 0;
+.section1_3 .comment,
+.section2_3 .comment,
+.section3_3 .comment {
+	width: 26%;
+	top: 39%;
+	left: 62%;
 }
 
-#footer .social-links a {
-	font-size: 18px;
-	display: inline-block;
-	background: #2477ff;
-	color: #fff;
-	line-height: 1;
-	padding: 8px 0;
-	margin-right: 4px;
-	border-radius: 50%;
-	text-align: center;
-	width: 36px;
-	height: 36px;
-	transition: 0.3s;
+.section2_2 .comment {
+	top: 13%;
+	left: 45%;
 }
 
-#footer .social-links a:hover {
-	background: #0678e3;
-	color: #fff;
-	text-decoration: none;
+.section3_2 .comment {
+	width: 28%;
+	top: 11.5%;
+	left: 49%;
 }
 
-#footer .copyright {
-	margin: 0 0 5px 0;
+.section4_2 .comment {
+	top: 12%;
+	left: 57.5%;
 }
 
-#footer .credits {
-	font-size: 13px;
+.section4_3 .comment {
+	top: 12%;
+	left: 49.5%;
 }
 
-@media (max-width: 760px) {
+.section5_1 .comment {
+	top: 13.5%;
+	left: 34%;
+}
+
+.section5_2 .comment {
+	top: 14%;
+	left: 34%;
+}
+
+.section5_3 .comment {
+	width: 33%;
+	top: 15%;
+	left: 52%;
+}
+
+.section5_4 .comment {
+	width: 45%;
+	top: 16%;
+	left: 35.5%;
+}
+
+/*--------------------------------------------------------------
+# responsive
+--------------------------------------------------------------*/
+@media (max-width: 992px) {
 	.landing-container {
 		height: auto;
 	}
@@ -745,11 +784,13 @@
 	}
 
 	.landing-container > section {
-		padding: 0;
+		padding: 0 25px;
 		height: auto;
 	}
 
-	.home.section-container,
+	.home.section-container {
+		padding: 100px 25px 60px;
+	}
 	.services.section-container,
 	.contact {
 		padding: 60px 0;
@@ -769,4 +810,12 @@
 	.preview-btn a {
 		margin-left: 20px;
 	}
+
+	.endpoint .row {
+		padding: 0;
+	}
+
+	.endpoint .col-lg-4 {
+		min-width: auto;
+	}
 }
Index: arms/landing.html
===================================================================
diff -u -rf5aaffc8a24235e6afe8059d928665889fd2b4d3 -r630b6cf3febddbc2002a3b451e3c2405cbad86d5
--- arms/landing.html	(.../landing.html)	(revision f5aaffc8a24235e6afe8059d928665889fd2b4d3)
+++ arms/landing.html	(.../landing.html)	(revision 630b6cf3febddbc2002a3b451e3c2405cbad86d5)
@@ -154,36 +154,36 @@
 					class="container"
 					data-aos="fade-up">
 					<div class="row">
-						<div
-							class="col-lg-4"
-							data-aos="fade-up">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section1_1"
+								data-aos="fade-up">
 								<img
-									class="section1_1"
 									src="./img/landing/section1_1.png"
 									alt="project charter" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="500">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section1_2"
+								data-aos="fade-up"
+								data-aos-delay="500">
 								<img
-									class="section1_2"
 									src="./img/landing/section1_2.png"
 									alt="project charter" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="1000">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section1_3"
+								data-aos="fade-up"
+								data-aos-delay="1000">
 								<img
-									class="section1_3"
 									src="./img/landing/section1_3.png"
 									alt="project charter" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
 					</div>
@@ -205,33 +205,36 @@
 					class="container"
 					data-aos="fade-up">
 					<div class="row">
-						<div
-							class="col-lg-4"
-							data-aos="fade-up">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section2_1"
+								data-aos="fade-up">
 								<img
 									src="./img/landing/section2_1.png"
 									alt="SRS" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="500">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section2_2"
+								data-aos="fade-up"
+								data-aos-delay="500">
 								<img
 									src="./img/landing/section2_2.png"
 									alt="SRS" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="1000">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section2_3"
+								data-aos="fade-up"
+								data-aos-delay="1000">
 								<img
 									src="./img/landing/section2_3.png"
 									alt="SRS" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
 					</div>
@@ -247,33 +250,36 @@
 					class="container"
 					data-aos="fade-up">
 					<div class="row">
-						<div
-							class="col-lg-4"
-							data-aos="fade-up">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section3_1"
+								data-aos="fade-up">
 								<img
 									src="./img/landing/section3_1.png"
 									alt="SDS" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="500">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section3_2"
+								data-aos="fade-up"
+								data-aos-delay="500">
 								<img
 									src="./img/landing/section3_2.png"
 									alt="SDS" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="1000">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section3_3"
+								data-aos="fade-up"
+								data-aos-delay="1000">
 								<img
 									src="./img/landing/section3_3.png"
 									alt="SDS" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
 					</div>
@@ -289,33 +295,36 @@
 					class="container"
 					data-aos="fade-up">
 					<div class="row">
-						<div
-							class="col-lg-4"
-							data-aos="fade-up">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section4_1"
+								data-aos="fade-up">
 								<img
 									src="./img/landing/section4_1.png"
 									alt="QA Checklist" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="500">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section4_2"
+								data-aos="fade-up"
+								data-aos-delay="500">
 								<img
 									src="./img/landing/section4_2.png"
 									alt="QA Checklist" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-4"
-							data-aos="fade-up"
-							data-aos-delay="1000">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section4_3"
+								data-aos="fade-up"
+								data-aos-delay="1000">
 								<img
 									src="./img/landing/section4_3.png"
 									alt="QA Checklist" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
 					</div>
@@ -331,43 +340,47 @@
 					class="container"
 					data-aos="fade-up">
 					<div class="row">
-						<div
-							class="col-lg-6 flex justify-content-center"
-							data-aos="fade-up">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section5_1"
+								data-aos="fade-up">
 								<img
 									src="./img/landing/section5_1.png"
 									alt="Endpoint" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-6 flex justify-content-center"
-							data-aos="fade-up"
-							data-aos-delay="500">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section5_2"
+								data-aos="fade-up"
+								data-aos-delay="500">
 								<img
 									src="./img/landing/section5_2.png"
 									alt="Endpoint" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-6 flex justify-content-center"
-							data-aos="fade-up"
-							data-aos-delay="1000">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section5_3"
+								data-aos="fade-up"
+								data-aos-delay="1000">
 								<img
 									src="./img/landing/section5_3.png"
 									alt="Endpoint" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
-						<div
-							class="col-lg-6 flex justify-content-center"
-							data-aos="fade-up"
-							data-aos-delay="1500">
-							<div class="content-section">
+						<div class="col-lg-4">
+							<div
+								class="content-section section5_4"
+								data-aos="fade-up"
+								data-aos-delay="1500">
 								<img
 									src="./img/landing/section5_4.png"
 									alt="Endpoint" />
+								<span class="comment">bla blaa bla bla bla bla blaaaa bla bla bala bla blaa bla bla bla bla</span>
 							</div>
 						</div>
 					</div>