Add foundations section and images

css/main.css

@@ -29,6 +29,10 @@ body {
     text-align: center;
 }
 
+.eba-foundations .columns{
+    text-align: center;
+    padding: 0 1rem;
+}
 h2,
 h2.category-name {
     background: rgb(24,40,72);

images/care..svg

@@ -0,0 +1,80 @@
+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 23.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<svg version="1.1"
+	 id="Layer_1" xmlns:cc="http://creativecommons.org/ns#" xmlns:dc="http://purl.org/dc/elements/1.1/" xmlns:inkscape="http://www.inkscape.org/namespaces/inkscape" xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#" xmlns:sodipodi="http://sodipodi.sourceforge.net/DTD/sodipodi-0.dtd" xmlns:svg="http://www.w3.org/2000/svg"
+	 xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 300 300"
+	 style="enable-background:new 0 0 300 300;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_1_);}
+	.st1{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_2_);}
+	.st2{fill:url(#SVGID_3_);}
+	.st3{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_4_);}
+	.st4{fill-rule:evenodd;clip-rule:evenodd;fill:url(#SVGID_5_);}
+	.st5{fill:url(#SVGID_6_);}
+	.st6{fill:url(#SVGID_7_);}
+	.st7{fill:url(#SVGID_8_);}
+</style>
+<g>
+	<g>
+		<linearGradient id="SVGID_1_" gradientUnits="userSpaceOnUse" x1="163.3947" y1="185.2886" x2="271.609" y2="134.8274">
+			<stop  offset="0" style="stop-color:#182848"/>
+			<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+		</linearGradient>
+		<path class="st0" d="M247,101.6c-9.5-2.5-19.4,3.2-21.9,12.7l-7.7,28.9L197,163.7c-7.1,7.2-11.7,16.5-13.1,26.6l-4.2,30.1
+			l10.9,1.5l4.1-30.1c1.1-7.7,4.6-14.9,10-20.4l22.4-22.6l8.5-31.7c1-3.8,4.7-5.9,8.5-4.9h0l2.4,0.6c3.8,1,5.9,4.8,4.9,8.5
+			l-12.4,46.2l10.6,2.8l12.4-46.2c2.5-9.5-3.2-19.4-12.6-21.9L247,101.6L247,101.6z"/>
+		<linearGradient id="SVGID_2_" gradientUnits="userSpaceOnUse" x1="203.4983" y1="164.6444" x2="307.1431" y2="116.3141">
+			<stop  offset="0" style="stop-color:#182848"/>
+			<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+		</linearGradient>
+		<path class="st1" d="M258.9,43c-0.4,0-0.7,0.1-1,0.1L258.9,43z M257.9,43.1C257.9,43.1,257.8,43.1,257.9,43.1
+			c-9.1,1.8-15.3,10.4-14.2,19.6l0,0l5.6,47.2c0.4,3,3.1,5.1,6.1,4.8c3-0.4,5.1-3.1,4.8-6.1l0,0l-5.6-47.2c-0.4-3.6,1.9-6.9,5.5-7.6
+			c0,0,0,0,0.1,0c3.9-0.8,7.6,1.7,8.2,5.7l10.4,66.2c2.6,16.7-0.3,33.8-8.3,48.7l-32,59.7c-1.5,2.6-0.6,6,2,7.5c2.6,1.5,6,0.6,7.5-2
+			c0.1-0.1,0.1-0.2,0.2-0.3l32-59.7c9.1-17,12.4-36.5,9.4-55.5l-10.4-66.2C277.5,47.8,267.8,41,257.9,43.1L257.9,43.1z"/>
+		<linearGradient id="SVGID_3_" gradientUnits="userSpaceOnUse" x1="165.4419" y1="269.8239" x2="258.4" y2="226.4768">
+			<stop  offset="0" style="stop-color:#182848"/>
+			<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+		</linearGradient>
+		<path class="st2" d="M174.4,212.8c-2.4,0.1-4.4,1.7-5.1,4.1l-9.9,37c-0.8,2.9,1,5.9,3.9,6.7l84.5,22.7c2.9,0.8,5.9-1,6.7-3.9
+			l9.9-37c0.8-2.9-1-5.9-3.9-6.7L176,213C175.5,212.9,175,212.8,174.4,212.8L174.4,212.8z M178.5,225l73.9,19.9l-7.1,26.5
+			l-73.9-19.8L178.5,225L178.5,225z"/>
+		<linearGradient id="SVGID_4_" gradientUnits="userSpaceOnUse" x1="49.6735" y1="176.275" x2="97.9673" y2="153.7552">
+			<stop  offset="0" style="stop-color:#182848"/>
+			<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+		</linearGradient>
+		<path class="st3" d="M49.7,101.6l-2.5,0.7c-9.5,2.5-15.2,12.4-12.6,21.9l12.4,46.2l10.6-2.8l-12.4-46.2c-1-3.8,1.1-7.5,4.9-8.5
+			l2.4-0.6h0c3.8-1,7.5,1.1,8.5,4.9l8.5,31.7l22.4,22.6c5.5,5.5,9,12.7,10,20.4l4.1,30.1l10.9-1.5l-4.2-30.1
+			c-1.4-10-6-19.4-13.1-26.6l-20.3-20.5l-7.7-28.9C69,104.8,59.1,99.1,49.7,101.6L49.7,101.6z"/>
+		<linearGradient id="SVGID_5_" gradientUnits="userSpaceOnUse" x1="6.9251" y1="159.3453" x2="84.1907" y2="123.3158">
+			<stop  offset="0" style="stop-color:#182848"/>
+			<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+		</linearGradient>
+		<path class="st4" d="M37.7,43l1,0.1C38.4,43,38.1,43,37.7,43z M38.8,43.1c-9.9-2-19.7,4.7-21.2,14.7L7.1,124
+			c-3,19,0.3,38.6,9.4,55.5l32,59.7c1.3,2.7,4.6,3.8,7.3,2.5c2.7-1.3,3.8-4.6,2.5-7.3c0-0.1-0.1-0.2-0.2-0.3l-32-59.7
+			c-8-14.9-10.9-32-8.3-48.7l10.4-66.2c0.6-4,4.3-6.5,8.2-5.7c0,0,0,0,0.1,0l0,0c3.6,0.7,5.9,4,5.5,7.6l-5.6,47.2
+			c-0.4,3,1.8,5.7,4.8,6.1c3,0.4,5.7-1.8,6.1-4.8L53,62.7l0,0C54.1,53.5,47.9,44.9,38.8,43.1C38.8,43.1,38.8,43.1,38.8,43.1
+			L38.8,43.1z"/>
+		<linearGradient id="SVGID_6_" gradientUnits="userSpaceOnUse" x1="37.6927" y1="270.0851" x2="131.7354" y2="226.2322">
+			<stop  offset="0" style="stop-color:#182848"/>
+			<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+		</linearGradient>
+		<path class="st5" d="M122,212.8c-0.5,0-1,0.1-1.5,0.2l-84.5,22.7c-2.9,0.8-4.6,3.8-3.9,6.7l9.9,37c0.8,2.9,3.8,4.6,6.7,3.9
+			l84.5-22.7c2.9-0.8,4.6-3.8,3.9-6.7l-9.9-37C126.6,214.5,124.5,212.8,122,212.8L122,212.8z M118.1,225l7.1,26.5l-73.9,19.8
+			l-7.1-26.5L118.1,225L118.1,225z"/>
+	</g>
+	<linearGradient id="SVGID_7_" gradientUnits="userSpaceOnUse" x1="88.737" y1="100.5166" x2="216.955" y2="40.7276">
+		<stop  offset="0" style="stop-color:#182848"/>
+		<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+	</linearGradient>
+	<path class="st6" d="M225.1,58.3l-28.8-39.9c-0.8-1.1-2.2-1.8-3.6-1.8H104c-1.6-0.1-2.9,0.8-3.6,1.8v0L71.6,58.3
+		c-1.2,1.6-1,4,0.3,5.5l73.2,84.2c1.7,1.9,5,1.9,6.7,0l73.2-84.2C226.1,62.4,226.3,59.9,225.1,58.3z M186.3,25.5L176.6,52
+		l-19.5-26.5H186.3z M168.9,56.5h-41.2l20.6-27.9L168.9,56.5z M139.5,25.5L119.9,52l-9.7-26.5H139.5z M102.6,30.3l9.6,26.2H83.7
+		L102.6,30.3z M84.8,65.4h30.6l22,60.6L84.8,65.4z M148.3,130l-23.5-64.6h47L148.3,130z M159.2,125.9l22-60.6h30.6L159.2,125.9z
+		 M184.4,56.5l9.6-26.2l18.9,26.2H184.4z"/>
+</g>
+<linearGradient id="SVGID_8_" gradientUnits="userSpaceOnUse" x1="-102.9582" y1="-22.6799" x2="-91.6668" y2="-27.9451">
+	<stop  offset="0" style="stop-color:#182848"/>
+	<stop  offset="1" style="stop-color:#182848;stop-opacity:0.8"/>
+</linearGradient>
+<rect x="-102" y="-30" class="st7" width="9.4" height="9.4"/>
+</svg>

index.html

@@ -37,6 +37,28 @@
             El diagnóstico previo personalizado y seguimiento por una profesional formada en tratamientos ESPECIFICOS Buenos Aires es nuestra filosofía de excelencia, ética, seriedad y apoyo constante para un perfecto resultado.
         </p>
       </div>
+      <div class="container eba-foundations">
+        <div class="columns">
+          <div class="column col-6">
+            <image src="images/pure.png" width="124"/>
+            <p>Principios activos seleccionados de máximo grado de pureza.</p>
+          </div>
+          <div class="column col-6">
+            <image src="images/application.png" width="124" />
+            <p>Formulaciones únicas, concebidas en combinación con técnicas de aplicación sinérgica, que aportan resultados inmediatos y duraderos.</p>
+          </div>
+        </div>
+        <div class="columns">
+          <div class="column col-6">
+            <image src="images/science.png" width="124"/>
+            <p>Vehículos especializados para preservar la integridad de las fórmulas y evitar procesos de sensibilización.</p>
+          </div>
+          <div class="column col-6">
+            <image src="images/certification.png" width="124" />
+            <p>Estrictos controles bajo normas de calidad internacional GMP son garantía de los productos ESPECIFICOS Buenos Aires.</p>
+          </div>
+        </div>
+      </div>
     </section>
     <div id="vademecum"></div>
 

js/vademecum.js

@@ -1144,7 +1144,6 @@ const products = {
 
 const dom = React.createElement;
 
-
 const categories = [
   "Higiene",
   "Máscaras",