diff --git a/index.html b/index.html
index e72440031..193204f7e 100644
--- a/index.html
+++ b/index.html
@@ -114,6 +114,15 @@
       <br/>
       <br/>
       If you're here just to build stuff faster, open and bookmark the official demos and use them when you need it.
+
+      <div class="what-images">
+        <div class="what-image-cont what-image-cont1">
+          <img class="what-image what-image1" src="img/grapesjs-front-page-m.jpg">
+        </div>
+        <div class="what-image-cont what-image-cont2">
+          <img class="what-image what-image2" src="img/sc-grapesjs-newsletter-demo.jpg">
+        </div>
+      </div>
     </div>
   </div>
 </section>
diff --git a/stylesheets/stylesheet.css b/stylesheets/stylesheet.css
index 22a0321e7..d275b6173 100644
--- a/stylesheets/stylesheet.css
+++ b/stylesheets/stylesheet.css
@@ -90,7 +90,7 @@ a {
 }
 
 .section-container {
-  padding: 5rem 6rem 7rem;
+  padding: 5rem 3% 7rem;
 }
 
 .section-title {
@@ -119,6 +119,41 @@ a {
   width: 90%;
 }
 
+.what-images {
+  height: 500px;
+  margin: 5rem auto 0;
+  position: relative;
+  width: 80%;
+}
+
+.what-image-cont {
+  border: 2px solid #444;
+  border-radius: 3px;
+  box-shadow: 0 0 5px rgba(0, 0, 0, 0.35), 0 0 15px rgba(0, 0, 0, 0.1);
+  box-sizing: border-box;
+  overflow: hidden;
+  position: absolute;
+  min-width: 259px;
+}
+
+.what-image-cont1 {
+  right: 0;
+  top: 0;
+  width: 75%;
+}
+
+.what-image-cont2 {
+  left: 0;
+  top: 100px;
+  width: 75%;
+  border-color: #373d49;
+}
+
+.what-image {
+  display: block;
+  width: 100%;
+}
+
 @media screen and (min-width: 64em) {
   .btn {
     padding: 0.75rem 1rem; }