initial: template and responsive 3 blocks

main.css

@@ -0,0 +1,60 @@
+.blocks {
+  display: flex;
+  /*gap: 20px;*/
+  padding-top: 5.78vw;
+  
+  background-image: url("https://abanbytes.eu/upload/hero_bg_plain.svg");
+  background-repeat: no-repeat;
+  background-position: center top;
+  background-size: 100% auto;
+}
+
+/* Gap between block 1 and 2 */
+.block:nth-child(1) {
+  margin-right: 11.3vw;
+  /* margin-top */
+  margin-left: 12.85vw;
+}
+/* Gap between block 2 and 3 */
+.block:nth-child(2) {
+  margin-right: 6.01vw;
+  margin-top: 10.16vw;
+}
+.block:nth-child(3) {
+  /* margin-right */
+  margin-top: 5.26vw;
+  margin-right: 13.05vw;
+}
+
+.block h2 {
+  margin-top: 0px;
+}
+.block {
+  flex: 1;
+  height: 200px;
+  background: #e5e7eb;
+  border: 1px solid #ccc;
+  display: flex;
+  /*align-items: center;
+  justify-content: center;*/
+}
+
+/* Small screens */
+@media (max-width: 600px) {
+  .blocks {
+    flex-direction: column;
+    padding-top: 15.92vw;
+    margin: 2.25vw;
+  }
+
+  .block {
+    width: 100%;
+  }
+
+  .block:nth-child(1), .block:nth-child(2), .block:nth-child(3) {
+    margin-top: 0;
+    margin-right: 0;
+    margin-bottom: 2.25vw;
+    margin-left: 0;
+  }
+}