cambios

src/components/Certifications.vue

@@ -1,16 +1,19 @@
 <template>
   <section class="certifications">
-    <header class="header">
-      <h2 class="title">{{ $t('certifications.title') }}</h2>
-    </header>
-    <div class="content">
-      
+    <div class="right">
+      <h2>{{ $t('certifications.title1') }}</h2>
+      <p class="centered"><img src="@images/image membresías.png" /></p>
+    </div>
+    <div class="left">
+      <h2>{{ $t('certifications.title2') }}</h2>
+      <p class="centered"><img src="@images/Nuestros aliados.png" /></p>
     </div>
   </section>
 </template>
 
 <script>
 export default {
+  
 
 }
 </script>
@@ -19,19 +22,19 @@ export default {
 .header {
   background-color: #000;
   color: #fff;
-  text-align: center;
-  padding: 72px 0 76px;
-}
-h2.title {
-  font-size: 54px;
-  font-weight: 400;
-  line-height: 63.28px;
+  text-align: center;  
+  
 }
 
-.content {
+.certifications {
   height: 600px;
-  background-image: url('@images/bg_1.png');
-  background-repeat: no-repeat;
+  background-color: #000;
+  background-position: top left;
   background-size: contain;
+  height: 600px;
+  display: grid;
+  grid-template-columns: 1fr 1fr;
+  align-items:center;
 }
+
 </style>

src/components/Different.vue

@@ -19,7 +19,7 @@ import DifferentBox from './DifferentBox.vue';
  .different {
     color: #fff;
     background-color: #000;
-    padding: 72px 64px;
+    padding: 72px 0;
   }
 
   h2 {

src/components/DifferentBox.vue

@@ -41,5 +41,6 @@ export default {
   font-size: 20px;
   line-height: 24px;
   color: #1E1E1E;
+  text-align: center;
 }
 </style>

src/components/LocaleSelector.vue

@@ -1,19 +1,22 @@
 <template>
     <div class="locale-selector">
       <a href="#" @click.prevent.stop="toggle">
-        <img class="globe-image" src="@images/global.svg" alt="">
+        <img class="globe-image" :src="getFlagImage($i18n.locale)" alt="">
         <span>{{ selectedLocale }}</span>
         <img src="@images/arrow-down.svg" alt="">
       </a>
       <div class="options" v-if="active">
-        <div class="item" v-for="(value, key) in locales" :key="key" @click.prevent.stop="changeLocale(key)">{{ value }}</div>
+        <div class="item" v-for="(value, key) in locales" :key="key" @click.prevent.stop="changeLocale(key)">
+          <img class="select-image" :src="getFlagImage(key)" alt="" srcset=""> 
+          <span>{{ value }}</span>
+        </div>
       </div>
     </div>
 </template>
 
 <script>
 const locales = {
-  de: 'Deutsche',
+  // de: 'Deutsche',
   en: 'English',
   es: 'Español'
 }
@@ -36,6 +39,9 @@ export default {
     changeLocale(locale) {
       this.$i18n.locale = locale;
       this.active = false;
+    },
+    getFlagImage(locale) {
+      return this.$helper.getImage(`flag-${locale}.png`)
     }
   }
 }
@@ -49,6 +55,11 @@ export default {
     .globe-image{
       height: 14px;
     }
+    
+    .select-image{
+      height: 18px;
+      margin-right: 8px;
+    }
 
     a {
       display: inline-flex;
@@ -68,7 +79,7 @@ export default {
     .options {
       padding: 8px 0 8px;
       display: inline-block;
-      width: 100px;
+      width: 120px;
       position: absolute;
       right: 0;
       top: 24px;
@@ -79,10 +90,12 @@ export default {
     .item {
       cursor: pointer;
       padding: 8px 0 8px 12px;
+      display: flex;
+      align-items: center;
 
       &:hover {
         color: #FECE16;
-      background: #111;
+        background: #111;
       }
     }
   }

src/components/Menu.vue

@@ -98,7 +98,7 @@ export default {
     }
     
     &.social {
-      background-image: url('@images/kids.png');
+      background-image: url('@images/proysoc.01.png');
     }
 
     &.contact {