diff --git a/sass/home/main.scss b/sass/home/main.scss
index 0437340..92d5e3d 100644
--- a/sass/home/main.scss
+++ b/sass/home/main.scss
@@ -1,4 +1,5 @@
 @import "./card-main";
+@import "./service-card-main";
 @import "./vision";
 
 $heading-letter-spacing: 20px;
@@ -52,10 +53,47 @@ $heading-letter-spacing: 20px;
 	border: none;
 }
 
-.index-banner__main-action-link{
+.index-banner__main-action-link {
 	color: black !important;
 }
 
 .index-banner__main-action-btn:hover {
 	background-color: lightgray;
 }
+
+.home__features {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
+.home__features-title {
+	margin: auto;
+}
+
+$page-content-width: 80%;
+.index__group-content {
+	.page__container {
+		width: $page-content-width;
+	}
+}
+
+.action-call__container {
+	background: #1f5818;
+	width: 100%;
+	padding: 60px 0;
+}
+
+.action-call__margin-container {
+	display: flex;
+	width: $page-content-width;
+	margin: auto;
+	align-items: center;
+	justify-content: space-around;
+}
+
+.action-call__prompt {
+	color: white;
+	font-weight: 400;
+	font-size: 1.7rem;
+}
diff --git a/sass/home/mobile.scss b/sass/home/mobile.scss
index 7235205..9f15718 100644
--- a/sass/home/mobile.scss
+++ b/sass/home/mobile.scss
@@ -1,4 +1,5 @@
 @import "./card-mobile";
+@import "./vision-mobile";
 
 .home__container {
 	max-height: 100vh;
@@ -18,3 +19,10 @@
 	font-size: 2.5rem;
 	margin: auto;
 }
+
+
+.index__group-content {
+	.page__container {
+		width: 90%;
+	}
+  }
diff --git a/sass/home/service-card-main.scss b/sass/home/service-card-main.scss
new file mode 100644
index 0000000..a6e9d28
--- /dev/null
+++ b/sass/home/service-card-main.scss
@@ -0,0 +1,81 @@
+.service__features {
+	margin: 20px 0px;
+}
+
+.service-card__group {
+	display: flex;
+	flex-direction: column;
+	margin: 0px auto;
+}
+.service-card__conatiner {
+	//	background-color: #eee;
+	margin: 10px 0px;
+	// wpadding: 10px;
+	border-radius: 5px;
+	display: flex;
+	//	height: 250px;
+	height: 100vh;
+	border-top: 1px solid grey;
+}
+
+.service-card__conatiner:first-child {
+	border-top: none;
+}
+
+.service-card__icon {
+	width: 100px;
+	height: 100px;
+	margin: auto;
+	flex: 2;
+	border-radius: 100px;
+}
+
+.service-card__title {
+	margin: auto;
+	text-align: center;
+}
+
+.service-card__text {
+	//	font-size: 0.7rem;
+	text-align: center;
+	margin-bottom: 30px !important;
+}
+
+.service-card__text-container {
+	flex: 2;
+	margin: auto !important;
+}
+
+.service-card__aciton-btn {
+	margin: auto;
+	padding: 10px;
+	display: block;
+	font-weight: 400;
+	border: none;
+	background-color: #000;
+}
+
+.service__features {
+	display: flex;
+	flex-direction: column;
+	align-items: center;
+}
+
+.service__features-title {
+	margin: 10px auto !important;
+}
+
+.service-card__icon-container {
+	width: 30%;
+	margin: auto;
+}
+
+.service-card__aciton-btn--inactive {
+	margin: auto;
+	padding: 10px;
+	display: block;
+	font-weight: 400;
+	border: none;
+	background-color: lightgrey;
+	color: #000;
+}
diff --git a/sass/home/vision.scss b/sass/home/vision.scss
index 8a7c43c..9c8fb42 100644
--- a/sass/home/vision.scss
+++ b/sass/home/vision.scss
@@ -1,6 +1,7 @@
 .home__vision-container{
 	display: flex;
 	align-items: center;
+	height: 320px;
 }
 
 
diff --git a/templates/index.html b/templates/index.html
index edff6d3..2e81073 100644
--- a/templates/index.html
+++ b/templates/index.html
@@ -1,5 +1,6 @@
 {% import "macros.html" as macros %} 
 {% import "home/components/home-card.html" as card_macro %}
+{% import "home/components/home-card-new.html" as card_macro2 %}
 
 {% extends "base.html" %} {% block meta %}
 {% set description = "Hostea: Dedicated managed Gitea hosting, including CI/CD
@@ -7,15 +8,28 @@ and static pages with upgrades, backups and 24/7 monitoring" %} {% set title =
 "Home" %} {{ macros::get_meta_tags(title=title, description=description) }} {%
 endblock meta %} {% block content %}
 
-{% include "home/components/_banner.html" %}
+{% include "home/components/_banner-new.html" %}
 <div class="index__container">
   <div class="index__group-content">
-    <div class="page__container">
       <div class="page__group-content">
+    <div class="page__container">
         {% include "home/components/_vision.html" %}
+
+    </div>
+	  <div class="action-call__container">
+        <div class="action-call__margin-container">
+          <p class="action-call__prompt">Need an indepandent forge? Talk to an expert!</p>
+          <button class="action-call__button"><a href="/contact" class="action-call_link">Contact Us</a></button>
+        </div>
+      </div>
+
+    <div class="page__container">
+        {% include "home/components/_services-new.html" %}
+      </div>
+    <div class="page__container">
         {% include "home/components/_features.html" %}
       </div>
-    </div>
+      </div>
   </div>
 </div>