Se avanza en la pagina de inicio, falta los indicadores

2020-05-12 11:07:58 -04:00
parent fbe1e4f7e5
commit 9084ea5edb
39 changed files with 1027 additions and 45 deletions
--- a/bootstrap/web/config.php
+++ b/bootstrap/web/config.php
@ -8,11 +8,11 @@ return [
    '{folders.base}',
    'cache'
  ])),
-  'urls.assets' => DI\string(implode(DIRECTORY_SEPARATOR, [
+  'urls.assets' => DI\string(implode('/', [
    '{urls.base}',
    'assets'
  ])),
-  'urls.styles' => DI\string(implode(DIRECTORY_SEPARATOR, [
+  'urls.styles' => DI\string(implode('/', [
    '{urls.assets}',
    'styles'
  ])),
@ -20,5 +20,6 @@ return [
    '{folders.data}',
    'visitas.json'
  ])),
-  'visits.time' => 12 * 60 * 60
+  'visits.time' => 12 * 60 * 60,
+  'urls.indicadores' => 'https://mindicador.cl/api'
 ];
--- a/bootstrap/web/middleware.php
+++ b/bootstrap/web/middleware.php
@ -1,2 +1,3 @@
 <?php
-$app->add(new ProVM\KI\Common\Middleware\Visits($app->getContainer()->get('file.visits'), $app->getContainer()->get('visits.time')));
+// Global visit counter
+//$app->add(new ProVM\KI\Common\Middleware\Visits($app->getContainer()->get('file.visits'), $app->getContainer()->get('visits.time')));
--- a/bootstrap/web/setup.php
+++ b/bootstrap/web/setup.php
@ -1,5 +1,6 @@
 <?php
 use Psr\Container\ContainerInterface as Container;
+use Carbon\Carbon;

 return [
  'urls' => function(Container $c) {
@ -8,7 +9,10 @@ return [
      'facebook' => '',
      'linkedin' => '',
      'twitter' => '',
-      'youtube' => ''
+      'youtube' => '',
+      'assets' => $c->get('urls.assets'),
+      'images' => implode('/', [$c->get('urls.assets'), 'images']),
+      'styles' => $c->get('urls.styles')
    ];
  },
  'assets' => function(Container $c) {
@ -22,7 +26,7 @@ return [
      ],
      'fonts' => [
        'text/css' => [
-          'https://fonts.googleapis.com/css2?family=Roboto:wght@300;900&display=swap',
+          'https://fonts.googleapis.com/css2?family=Roboto&display=swap',
          'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/brand-icons.woff',
          'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/brand-icons.woff2',
          'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/themes/default/assets/fonts/icons.woff',
@ -32,6 +36,7 @@ return [
        ]
      ],
      'scripts' => [
+        'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js',
        'https://cdnjs.cloudflare.com/ajax/libs/fomantic-ui/2.8.4/semantic.min.js'
      ]
    ];
@ -55,5 +60,8 @@ return [
        'assets' => $c->get('assets')
      ]
    );
+  },
+  ProVM\KI\Common\Service\Indicadores::class => function(Container $c) {
+    return new ProVM\KI\Common\Service\Indicadores($c->get('urls.indicadores'));
  }
 ];
--- a/common/Controller/Web/Base.php
+++ b/common/Controller/Web/Base.php
@ -1,10 +1,10 @@
 <?php
 namespace ProVM\KI\Common\Controller\Web;

+use Psr\Container\ContainerInterface as Container;
 use Psr\Http\Message\ServerRequestInterface as Request;
 use Psr\Http\Message\ResponseInterface as Response;
 use Slim\Views\Blade as View;
-use Psr\Container\ContainerInterface as Container;
 use Carbon\Carbon;

 class Base {
@ -13,6 +13,30 @@ class Base {
    $fecha = ucwords(Carbon::today()->locale('es')->isoFormat('D MMMM'));
    $hora = Carbon::now()->format('H:i a');
    $visitas = $container->get('visitas');
-    return $view->render($response, 'home', compact('valor_uf', 'fecha', 'hora', 'visitas'));
+    $aviso = true;
+    $filename = implode(DIRECTORY_SEPARATOR, [
+      $container->get('folders.data'),
+      'avisos.json'
+    ]);
+    $avisos = json_decode(trim(file_get_contents($filename)));
+    $filename = implode(DIRECTORY_SEPARATOR, [
+      $container->get('folders.data'),
+      'destacados.json'
+    ]);
+    $destacados = json_decode(trim(file_get_contents($filename)));
+    $filename = implode(DIRECTORY_SEPARATOR, [
+      $container->get('folders.data'),
+      'segmentos.json'
+    ]);
+    $segmentos = json_decode(trim(file_get_contents($filename)));
+    array_walk($segmentos, function(&$item) use ($container) {
+      if (!isset($item->imagen)) {
+        $item->imagen = '<div class="ui placeholder"><div class="square image"></div></div>';
+        return;
+      }
+      $item->imagen = '<img src="' . $container->get('urls')->images . '/' . $item->imagen . '" />';
+    });
+    $indicadores = ['uf' => 'UF', 'euro' => 'Euro', 'imacec' => 'IMACEC', 'dolar' => 'USD', 'ipc' => 'IPC', 'utm' => 'UTM', 'bitcoin' => 'BitCoin', 'libra_cobre' => 'Lb. Cu'];
+    return $view->render($response, 'home', compact('valor_uf', 'fecha', 'hora', 'visitas', 'aviso', 'avisos', 'destacados', 'segmentos', 'indicadores'));
  }
 }
--- a/common/Controller/Web/Indicadores.php
+++ b/common/Controller/Web/Indicadores.php
@ -0,0 +1,23 @@
+<?php
+namespace ProVM\KI\Common\Controller\Web;
+
+use Psr\Container\ContainerInterface as Container;
+use Psr\Http\Message\ServerRequestInterface as Request;
+use Psr\Http\Message\ResponseInterface as Response;
+use Carbon\Carbon;
+use ProVM\KI\Common\Service\Indicadores as Service;
+
+class Indicadores {
+  public function get(Request $request, Response $response, Container $container, Service $service, $indicador) {
+    $valor = $service->get($indicador, Carbon::today());
+
+    $output = [
+      'sim' => $indicador,
+      'valor' => $valor
+    ];
+    $response->getBody()->write(json_encode($output));
+    return $response
+      ->withHeader('Content-Type', 'application/json')
+      ->withStatus(201);
+  }
+}
--- a/common/Controller/Web/Proyectos.php
+++ b/common/Controller/Web/Proyectos.php
@ -0,0 +1,50 @@
+<?php
+namespace ProVM\KI\Common\Controller\Web;
+
+use Psr\Container\ContainerInterface as Container;
+use Psr\Http\Message\ServerRequestInterface as Request;
+use Psr\Http\Message\ResponseInterface as Response;
+use Slim\Views\Blade as View;
+
+class Proyectos {
+  public function destacados(Request $request, Response $response, Container $container, $page): Response {
+    $filename = implode(DIRECTORY_SEPARATOR, [
+      $container->get('folders.data'),
+      'destacados.json'
+    ]);
+    $destacados = json_decode(trim(file_get_contents($filename)));
+    $max = ceil(count($destacados) / 4);
+    $output = [
+      'information' => [
+        'page' => $page
+      ],
+      'destacados' => []
+    ];
+    for ($i = ($page - 1) * 4; $i < $page * 4; $i ++) {
+      $output['destacados'] []= $destacados[$i];
+    }
+    $response->getBody()->write(json_encode($output));
+    return $response
+      ->withHeader('Content-Type', 'application/json')
+      ->withStatus(201);
+  }
+  public function ficha(Request $request, Response $response, Container $container, View $view, $proyecto): Response {
+    $filename = implode(DIRECTORY_SEPARATOR, [
+      $container->get('folders.data'),
+      'proyectos.json'
+    ]);
+    $proyectos = json_decode(trim(file_get_contents($filename)));
+    $filename = implode(DIRECTORY_SEPARATOR, [
+      $container->get('folders.data'),
+      'destacados.json'
+    ]);
+    $destacados = json_decode(trim(file_get_contents($filename)));
+    $destacado = false;
+    if (array_search($proyecto, $destacados) !== false) {
+      $destacado = true;
+    }
+    $proyecto = $proyectos[$proyecto];
+    $proyecto->destacado = $destacado;
+    return $view->render($response, 'home.destacados.ficha', compact('proyecto'));
+  }
+}
--- a/common/Middleware/Visits.php
+++ b/common/Middleware/Visits.php
@ -34,7 +34,7 @@ class Visits {
      if ($ipd->ip == $ip and $ipd->fwd == $fwd) {
        $t = Carbon::parse($ipd->time);
        if ($t->diffInSeconds($login) > $this->time) {
-          $file->ips[$i]->time = $t->format('Y-m-d H:i:s');
+          $file->ips[$i]->time = $login->format('Y-m-d H:i:s');
          $file->visits ++;
        }
        $found = true;
--- a/common/Service/Indicadores.php
+++ b/common/Service/Indicadores.php
@ -0,0 +1,34 @@
+<?php
+namespace ProVM\KI\Common\Service;
+
+use GuzzleHttp\Client;
+
+class Indicadores {
+  //protected $cliente;
+  protected $base_uri;
+
+  public function __construct(string $indicadores_url) {
+    $this->base_uri = $indicadores_url;
+  }
+  public function get(string $indicador, \DateTime $fecha) {
+    $url = implode('/', [
+      $this->base_uri,
+      $indicador,
+      $fecha->format('d-m-Y')
+    ]);
+    if ( ini_get('allow_url_fopen') ) {
+      $json = file_get_contents($url);
+    } else {
+      $curl = curl_init($url);
+      curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
+      $json = curl_exec($curl);
+      curl_close($curl);
+    }
+    $data = json_decode($json);
+    $valor = 0;
+    if (isset($data->serie[0])) {
+      $valor = $data->serie[0]->valor;
+    }
+    return $valor;
+  }
+}
--- a/composer.json
+++ b/composer.json
@ -8,7 +8,8 @@
        "rubellum/slim-blade-view": "^0.1.1",
        "nyholm/psr7": "^1.2",
        "nyholm/psr7-server": "^0.4.1",
-        "nesbot/carbon": "^2.32"
+        "nesbot/carbon": "^2.32",
+        "guzzlehttp/guzzle": "^6.5"
    },
    "require-dev": {
        "phpunit/phpunit": "^8.5",
--- a/public/assets/images/banner.jpg
+++ b/public/assets/images/banner.jpg
--- a/public/assets/images/desarrollo
+++ b/public/assets/images/desarrollo
--- a/public/assets/images/indicadores.jpg
+++ b/public/assets/images/indicadores.jpg
--- a/public/assets/images/industrial.jpg
+++ b/public/assets/images/industrial.jpg
--- a/public/assets/images/logo.png
+++ b/public/assets/images/logo.png
--- a/public/assets/images/loteos
+++ b/public/assets/images/loteos
--- a/public/assets/images/oficinas.jpg
+++ b/public/assets/images/oficinas.jpg
--- a/public/assets/images/optimus.jpg
+++ b/public/assets/images/optimus.jpg
--- a/public/assets/images/retail.jpg
+++ b/public/assets/images/retail.jpg
--- a/public/assets/styles/home.css
+++ b/public/assets/styles/home.css
@ -0,0 +1,162 @@
+/* line 1, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+.header {
+  color: inherit !important;
+  font-family: inherit !important;
+}
+
+/* line 6, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#banner {
+  padding-top: 12rem;
+  padding-bottom: 12rem;
+  background-color: rgba(0, 0, 0, 0.6);
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: 1920px auto;
+  background-blend-mode: multiply;
+}
+
+/* line 15, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#banner #mensaje {
+  margin-bottom: 2rem;
+  color: white;
+  font-weight: 300;
+  font-size: 1.6rem;
+}
+
+/* line 21, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#banner #mensaje .header {
+  font-weight: 900 !important;
+  font-size: 1.9rem;
+}
+
+/* line 26, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#banner .button {
+  font-family: inherit;
+  font-weight: 900;
+}
+
+/* line 32, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#aviso {
+  color: white;
+  background-color: #429ab7;
+  padding-top: 5rem;
+  padding-bottom: 3rem;
+  font-size: 1.6rem;
+  font-weight: 300;
+}
+
+/* line 40, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#aviso .header {
+  font-weight: 900;
+}
+
+/* line 45, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados {
+  padding-top: 3rem;
+  padding-bottom: 5rem;
+  background-color: #a7a9ab;
+  min-height: 40rem;
+}
+
+/* line 51, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .header {
+  color: #0d103c !important;
+  font-weight: 600;
+}
+
+/* line 55, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .titulo {
+  font-size: 1.6rem;
+  font-weight: 900;
+  padding-bottom: 1rem;
+}
+
+/* line 60, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .ficha {
+  border-radius: 0;
+  border: 0;
+  box-shadow: none !important;
+}
+
+/* line 66, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .ficha .content .segment {
+  background-color: #e6e6e7 !important;
+  padding-top: 0 !important;
+  padding-bottom: 0 !important;
+  font-weight: 300;
+}
+
+/* line 72, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .ficha .content .button {
+  font-family: inherit !important;
+  font-weight: 900;
+  padding-top: 0.3rem !important;
+  padding-bottom: 0.3rem !important;
+  background-color: #0d103c !important;
+}
+
+/* line 80, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .ficha .image {
+  overflow: hidden;
+}
+
+/* line 83, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .ficha .overlay {
+  background-color: #0d103c;
+  color: white;
+  opacity: 0.8;
+  text-align: center;
+  position: absolute;
+  z-index: 999;
+  top: 1.9rem;
+  right: -2.2rem;
+  width: 10rem;
+  padding-top: .3rem;
+  padding-bottom: .3rem;
+  -webkit-transform: rotate(45deg);
+  -moz-transform: rotate(45deg);
+  -ms-transform: rotate(45deg);
+  -o-transform: rotate(45deg);
+  transform: rotate(45deg);
+}
+
+/* line 102, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#destacados .active {
+  font-weight: 900;
+}
+
+/* line 107, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#segmentos {
+  padding-top: 4rem;
+  padding-bottom: 4rem;
+}
+
+/* line 112, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#resumen {
+  background-position: center;
+  background-position-y: -60rem;
+  background-repeat: no-repeat;
+  background-size: 2600px auto;
+  min-height: 20rem;
+  padding-top: 3rem;
+}
+
+/* line 120, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#resumen .inverted.circular.segment {
+  background-color: rgba(0, 0, 0, 0.8);
+}
+
+/* line 125, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#indicadores {
+  background-color: #bbbdc0;
+}
+
+/* line 128, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/home.scss */
+#indicadores .column {
+  background-color: white;
+  padding: 0;
+  margin: 1rem;
+  width: 8rem !important;
+}
+
+/*# sourceMappingURL=home.css.map */
--- a/public/assets/styles/home.map
+++ b/public/assets/styles/home.map
@ -0,0 +1,12 @@
+{
+	"version": 3,
+	"file": "home.css",
+	"sources": [
+		"../../../resources/assets/sass/home.scss"
+	],
+	"sourcesContent": [
+		".header {\r\n  color: inherit !important;\r\n  font-family: inherit !important;\r\n}\r\n\r\n#banner {\r\n  padding-top: 12rem;\r\n  padding-bottom: 12rem;\r\n  background-color: rgba(0, 0, 0, 0.6);\r\n  background-position: center;\r\n  background-repeat: no-repeat;\r\n  background-size: 1920px auto;\r\n  background-blend-mode: multiply;\r\n\r\n  #mensaje {\r\n    margin-bottom: 2rem;\r\n    color: white;\r\n    font-weight: 300;\r\n    font-size: 1.6rem;\r\n\r\n    .header {\r\n      font-weight: 900 !important;\r\n      font-size: 1.9rem;\r\n    }\r\n  }\r\n  .button {\r\n    font-family: inherit;\r\n    font-weight: 900;\r\n  }\r\n}\r\n\r\n#aviso {\r\n  color: white;\r\n  background-color: #429ab7;\r\n  padding-top: 5rem;\r\n  padding-bottom: 3rem;\r\n  font-size: 1.6rem;\r\n  font-weight: 300;\r\n\r\n  .header {\r\n    font-weight: 900;\r\n  }\r\n}\r\n\r\n#destacados {\r\n  padding-top: 3rem;\r\n  padding-bottom: 5rem;\r\n  background-color: #a7a9ab;\r\n  min-height: 40rem;\r\n\r\n  .header {\r\n    color: #0d103c !important;\r\n    font-weight: 600;\r\n  }\r\n  .titulo {\r\n    font-size: 1.6rem;\r\n    font-weight: 900;\r\n    padding-bottom: 1rem;\r\n  }\r\n  .ficha {\r\n    border-radius: 0;\r\n    border: 0;\r\n    box-shadow: none !important;\r\n\r\n    .content {\r\n      .segment {\r\n        background-color: #e6e6e7 !important;\r\n        padding-top: 0 !important;\r\n        padding-bottom: 0 !important;\r\n        font-weight: 300;\r\n      }\r\n      .button {\r\n        font-family: inherit !important;\r\n        font-weight: 900;\r\n        padding-top: 0.3rem !important;\r\n        padding-bottom: 0.3rem !important;\r\n        background-color: #0d103c !important;\r\n      }\r\n    }\r\n    .image {\r\n      overflow: hidden;\r\n    }\r\n    .overlay {\r\n      background-color: #0d103c;\r\n      color: white;\r\n      opacity: 0.8;\r\n      text-align: center;\r\n      position: absolute;\r\n      z-index: 999;\r\n      top: 1.9rem;\r\n      right: -2.2rem;\r\n      width: 10rem;\r\n      padding-top: .3rem;\r\n      padding-bottom: .3rem;\r\n      -webkit-transform: rotate(45deg);\r\n      -moz-transform: rotate(45deg);\r\n      -ms-transform: rotate(45deg);\r\n      -o-transform: rotate(45deg);\r\n      transform: rotate(45deg);\r\n    }\r\n  }\r\n  .active {\r\n    font-weight: 900;\r\n  }\r\n}\r\n\r\n#segmentos {\r\n  padding-top: 4rem;\r\n  padding-bottom: 4rem;\r\n}\r\n\r\n#resumen {\r\n  background-position: center;\r\n  background-position-y: -60rem;\r\n  background-repeat: no-repeat;\r\n  background-size: 2600px auto;\r\n  min-height: 20rem;\r\n  padding-top: 3rem;\r\n\r\n  .inverted.circular.segment {\r\n    background-color: rgba(0, 0, 0, 0.8);\r\n  }\r\n}\r\n\r\n#indicadores {\r\n  background-color: #bbbdc0;\r\n\r\n  .column {\r\n    background-color: white;\r\n    padding: 0;\r\n    margin: 1rem;\r\n    width: 8rem !important;\r\n  }\r\n}\r\n"
+	],
+	"names": [],
+	"mappings": "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"
+}
--- a/public/assets/styles/main.css
+++ b/public/assets/styles/main.css
@ -1,47 +1,93 @@
-/*body {
+/* line 1, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
+body {
  font-family: Roboto, sans-serif !important;
-}*/
+}

+/* line 5, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 .brand {
  color: #000070 !important;
 }
+
+/* line 8, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 .inverted.brand {
  background-color: #000070 !important;
  color: white !important;
 }
+
+/* line 12, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 .button.brand {
  box-shadow: none !important;
 }

+/* line 16, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
+.title.image {
+  width: 15rem;
+}
+
+/* line 21, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 header #franja {
  background-color: #707070;
  color: white !important;
 }
+
+/* line 25, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 header #franja .menu {
  color: inherit !important;
 }
+
+/* line 28, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 header #franja .menu .spacer {
  width: 3rem;
 }
+
+/* line 31, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 header #franja .menu .input {
  height: 1.3rem !important;
 }
-header #franja a {
-  color: inherit;
-}
+
+/* line 36, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 header .menu {
  margin-top: 0 !important;
  margin-bottom: 0 !important;
 }
+
+/* line 40, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 header .menu .logo {
  font-size: 2rem;
  font-weight: 900;
 }

+/* line 47, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
+a {
+  color: inherit !important;
+}
+
+/* line 51, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 .menu {
  font-family: inherit !important;
 }
+
+/* line 54, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
 .item {
  font-family: inherit !important;
  color: inherit !important;
 }
+
+/* line 59, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
+footer {
+  background-color: #429ab7;
+  color: white;
+}
+
+/* line 63, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
+footer .menu {
+  margin: 0 !important;
+}
+
+/* line 66, ../../Workspace/git/provm/capitalinvestments/resources/assets/sass/main.scss */
+footer .menu .label {
+  background-color: white !important;
+  color: #429ab7 !important;
+}
+
+/*# sourceMappingURL=main.css.map */
--- a/public/assets/styles/main.map
+++ b/public/assets/styles/main.map
@ -0,0 +1,12 @@
+{
+	"version": 3,
+	"file": "main.css",
+	"sources": [
+		"../../../resources/assets/sass/main.scss"
+	],
+	"sourcesContent": [
+		"body {\r\n  font-family: Roboto, sans-serif !important;\r\n}\r\n\r\n.brand {\r\n  color: #000070 !important;\r\n}\r\n.inverted.brand {\r\n  background-color: #000070 !important;\r\n  color: white !important;\r\n}\r\n.button.brand {\r\n  box-shadow: none !important;\r\n}\r\n\r\n.title.image {\r\n  width: 15rem;\r\n}\r\n\r\nheader {\r\n  #franja {\r\n    background-color: #707070;\r\n    color: white !important;\r\n\r\n    .menu {\r\n      color: inherit !important;\r\n\r\n      .spacer {\r\n        width: 3rem;\r\n      }\r\n      .input {\r\n        height: 1.3rem !important;\r\n      }\r\n    }\r\n  }\r\n  .menu {\r\n    margin-top: 0 !important;\r\n    margin-bottom: 0 !important;\r\n\r\n    .logo {\r\n      font-size: 2rem;\r\n      font-weight: 900;\r\n    }\r\n  }\r\n}\r\n\r\na {\r\n  color: inherit !important;\r\n}\r\n\r\n.menu {\r\n  font-family: inherit !important;\r\n}\r\n.item {\r\n  font-family: inherit !important;\r\n  color: inherit !important;\r\n}\r\n\r\nfooter {\r\n  background-color: #429ab7;\r\n  color: white;\r\n\r\n  .menu {\r\n    margin: 0 !important;\r\n\r\n    .label {\r\n      background-color: white !important;\r\n      color: #429ab7 !important;\r\n    }\r\n  }\r\n}\r\n"
+	],
+	"names": [],
+	"mappings": ";AAAA,AAAA,IAAI,CAAC;EACH,WAAW,EAAE,6BAA6B;CAC3C;;;AAED,AAAA,MAAM,CAAC;EACL,KAAK,EAAE,kBAAkB;CAC1B;;;AACD,AAAA,SAAS,AAAA,MAAM,CAAC;EACd,gBAAgB,EAAE,kBAAkB;EACpC,KAAK,EAAE,gBAAgB;CACxB;;;AACD,AAAA,OAAO,AAAA,MAAM,CAAC;EACZ,UAAU,EAAE,eAAe;CAC5B;;;AAED,AAAA,MAAM,AAAA,MAAM,CAAC;EACX,KAAK,EAAE,KAAK;CACb;;;AAED,AACE,MADI,CACJ,OAAO,CAAC;EACN,gBAAgB,EAAE,OAAO;EACzB,KAAK,EAAE,gBAAgB;CAYxB;;;AAfH,AAKI,MALE,CACJ,OAAO,CAIL,KAAK,CAAC;EACJ,KAAK,EAAE,kBAAkB;CAQ1B;;;AAdL,AAQM,MARA,CACJ,OAAO,CAIL,KAAK,CAGH,OAAO,CAAC;EACN,KAAK,EAAE,IAAI;CACZ;;;AAVP,AAWM,MAXA,CACJ,OAAO,CAIL,KAAK,CAMH,MAAM,CAAC;EACL,MAAM,EAAE,iBAAiB;CAC1B;;;AAbP,AAgBE,MAhBI,CAgBJ,KAAK,CAAC;EACJ,UAAU,EAAE,YAAY;EACxB,aAAa,EAAE,YAAY;CAM5B;;;AAxBH,AAoBI,MApBE,CAgBJ,KAAK,CAIH,KAAK,CAAC;EACJ,SAAS,EAAE,IAAI;EACf,WAAW,EAAE,GAAG;CACjB;;;AAIL,AAAA,CAAC,CAAC;EACA,KAAK,EAAE,kBAAkB;CAC1B;;;AAED,AAAA,KAAK,CAAC;EACJ,WAAW,EAAE,kBAAkB;CAChC;;;AACD,AAAA,KAAK,CAAC;EACJ,WAAW,EAAE,kBAAkB;EAC/B,KAAK,EAAE,kBAAkB;CAC1B;;;AAED,AAAA,MAAM,CAAC;EACL,gBAAgB,EAAE,OAAO;EACzB,KAAK,EAAE,KAAK;CAUb;;;AAZD,AAIE,MAJI,CAIJ,KAAK,CAAC;EACJ,MAAM,EAAE,YAAY;CAMrB;;;AAXH,AAOI,MAPE,CAIJ,KAAK,CAGH,MAAM,CAAC;EACL,gBAAgB,EAAE,gBAAgB;EAClC,KAAK,EAAE,kBAAkB;CAC1B"
+}
--- a/resources/assets/sass/home.scss
+++ b/resources/assets/sass/home.scss
@ -0,0 +1,134 @@
+.header {
+  color: inherit !important;
+  font-family: inherit !important;
+}
+
+#banner {
+  padding-top: 12rem;
+  padding-bottom: 12rem;
+  background-color: rgba(0, 0, 0, 0.6);
+  background-position: center;
+  background-repeat: no-repeat;
+  background-size: 1920px auto;
+  background-blend-mode: multiply;
+
+  #mensaje {
+    margin-bottom: 2rem;
+    color: white;
+    font-weight: 300;
+    font-size: 1.6rem;
+
+    .header {
+      font-weight: 900 !important;
+      font-size: 1.9rem;
+    }
+  }
+  .button {
+    font-family: inherit;
+    font-weight: 900;
+  }
+}
+
+#aviso {
+  color: white;
+  background-color: #429ab7;
+  padding-top: 5rem;
+  padding-bottom: 3rem;
+  font-size: 1.6rem;
+  font-weight: 300;
+
+  .header {
+    font-weight: 900;
+  }
+}
+
+#destacados {
+  padding-top: 3rem;
+  padding-bottom: 5rem;
+  background-color: #a7a9ab;
+  min-height: 40rem;
+
+  .header {
+    color: #0d103c !important;
+    font-weight: 600;
+  }
+  .titulo {
+    font-size: 1.6rem;
+    font-weight: 900;
+    padding-bottom: 1rem;
+  }
+  .ficha {
+    border-radius: 0;
+    border: 0;
+    box-shadow: none !important;
+
+    .content {
+      .segment {
+        background-color: #e6e6e7 !important;
+        padding-top: 0 !important;
+        padding-bottom: 0 !important;
+        font-weight: 300;
+      }
+      .button {
+        font-family: inherit !important;
+        font-weight: 900;
+        padding-top: 0.3rem !important;
+        padding-bottom: 0.3rem !important;
+        background-color: #0d103c !important;
+      }
+    }
+    .image {
+      overflow: hidden;
+    }
+    .overlay {
+      background-color: #0d103c;
+      color: white;
+      opacity: 0.8;
+      text-align: center;
+      position: absolute;
+      z-index: 999;
+      top: 1.9rem;
+      right: -2.2rem;
+      width: 10rem;
+      padding-top: .3rem;
+      padding-bottom: .3rem;
+      -webkit-transform: rotate(45deg);
+      -moz-transform: rotate(45deg);
+      -ms-transform: rotate(45deg);
+      -o-transform: rotate(45deg);
+      transform: rotate(45deg);
+    }
+  }
+  .active {
+    font-weight: 900;
+  }
+}
+
+#segmentos {
+  padding-top: 4rem;
+  padding-bottom: 4rem;
+}
+
+#resumen {
+  background-position: center;
+  background-position-y: -60rem;
+  background-repeat: no-repeat;
+  background-size: 2600px auto;
+  min-height: 20rem;
+  padding-top: 3rem;
+
+  .inverted.circular.segment {
+    background-color: rgba(0, 0, 0, 0.8);
+  }
+}
+
+#indicadores {
+  background-color: #bbbdc0;
+
+  .column {
+    background-color: white;
+    padding: 0;
+    margin: 1rem;
+    width: 8rem !important;
+  }
+}
--- a/resources/assets/sass/main.scss
+++ b/resources/assets/sass/main.scss
@ -0,0 +1,71 @@
+body {
+  font-family: Roboto, sans-serif !important;
+}
+
+.brand {
+  color: #000070 !important;
+}
+.inverted.brand {
+  background-color: #000070 !important;
+  color: white !important;
+}
+.button.brand {
+  box-shadow: none !important;
+}
+
+.title.image {
+  width: 15rem;
+}
+
+header {
+  #franja {
+    background-color: #707070;
+    color: white !important;
+
+    .menu {
+      color: inherit !important;
+
+      .spacer {
+        width: 3rem;
+      }
+      .input {
+        height: 1.3rem !important;
+      }
+    }
+  }
+  .menu {
+    margin-top: 0 !important;
+    margin-bottom: 0 !important;
+
+    .logo {
+      font-size: 2rem;
+      font-weight: 900;
+    }
+  }
+}
+
+a {
+  color: inherit !important;
+}
+
+.menu {
+  font-family: inherit !important;
+}
+.item {
+  font-family: inherit !important;
+  color: inherit !important;
+}
+
+footer {
+  background-color: #429ab7;
+  color: white;
+
+  .menu {
+    margin: 0 !important;
+
+    .label {
+      background-color: white !important;
+      color: #429ab7 !important;
+    }
+  }
+}
--- a/resources/routes/web.php
+++ b/resources/routes/web.php
@ -15,4 +15,5 @@ if (file_exists($folder)) {
  }
 }

-$app->get('/', Base::class);
+$app->get('/', Base::class)
+  ->add(new ProVM\KI\Common\Middleware\Visits($app->getContainer()->get('file.visits'), $app->getContainer()->get('visits.time')));
--- a/resources/routes/web/indicadores.php
+++ b/resources/routes/web/indicadores.php
@ -0,0 +1,4 @@
+<?php
+use ProVM\KI\Common\Controller\Web\Indicadores;
+
+$app->get('/indicador/{indicador}', [Indicadores::class, 'get']);
--- a/resources/routes/web/proyectos.php
+++ b/resources/routes/web/proyectos.php
@ -0,0 +1,9 @@
+<?php
+use ProVM\KI\Common\Controller\Web\Proyectos;
+
+$app->group('/proyectos', function($app) {
+  $app->get('/destacados/{page}', [Proyectos::class, 'destacados']);
+});
+$app->group('/proyecto/{proyecto}', function($app) {
+  $app->get('/ficha', [Proyectos::class, 'ficha']);
+});
--- a/resources/views/home.blade.php
+++ b/resources/views/home.blade.php
@ -2,9 +2,14 @@

@section('page_content')
  @include('home.banner')
-  @include('home.segmentos')
+  @include('home.aviso')
  @include('home.destacados')
+  @include('home.segmentos')
  @include('home.resumen')
  @include('home.indicadores')
-  @include('home.confianza')
+  @include('home.contacto')
@endsection
+
+@push('styles')
+  <link rel="stylesheet" type="text/css" href="{{$urls->styles}}/home.css" />
+@endpush
--- a/resources/views/home/aviso.blade.php
+++ b/resources/views/home/aviso.blade.php
@ -0,0 +1,57 @@
+@if (isset($aviso) and $aviso)
+  <div id="aviso">
+    <div class="ui container">
+      <div class="ui center aligned grid">
+        <div class="ten wide column">
+          <div class="ui header">
+            BENEFICIOS COVID 19
+          </div>
+          Bono Pie 10%
+        </div>
+        <div class="row">
+          @foreach ($avisos as $i => $av)
+            <i class="circle outline tiny icon" data-id="{{$i + 1}}"></i>
+          @endforeach
+        </div>
+      </div>
+    </div>
+  </div>
+@endif
+
+@push('scripts')
+  <script type="text/javascript">
+    var avisos = {
+      avisos: [
+        @foreach ($avisos as $av)
+          {
+            titulo: '{{$av->titulo}}',
+            contenido: '{{$av->contenido}}'
+          },
+        @endforeach
+      ],
+      id: '#aviso',
+      curr_page: 1,
+      setup: () => {
+        avisos.movePage(avisos.curr_page)
+      },
+      movePage: (page) => {
+        var aviso = avisos.avisos[page - 1]
+        $(avisos.id).find('.grid .column').html('').append(
+          $('<div></div>').attr('class', 'ui header').html(aviso.titulo)
+        ).append(aviso.contenido)
+        $(avisos.id).find('.circle.icon').addClass('outline').css('cursor', 'pointer').click(function() {
+          var id = $(this).attr('data-id')
+          if (id == avisos.curr_page) {
+            return
+          }
+          avisos.movePage(id)
+        })
+        $(avisos.id).find('.circle.icon:nth-child(' + page + ')').removeClass('outline').css('cursor', 'default')
+        avisos.curr_page = page
+      }
+    }
+    $(document).ready(function() {
+      avisos.setup()
+    })
+  </script>
+@endpush
--- a/resources/views/home/banner.blade.php
+++ b/resources/views/home/banner.blade.php
@ -1,16 +1,25 @@
 <div id="banner">
  <div class="ui container">
    <div class="ui center aligned grid">
-      <div class="eight wide column">
+      <div class="ten wide column">
        <div id="mensaje">
          <div class="ui header">
            DISEÑA EL FUTURO, ACT&Uacute;A EN EL PRESENTE
          </div>
-          <button class="ui inverted brand button">
+          "Comienza a Invertir Hoy"
+        </div>
+        <button class="ui inverted brand big button">
          PROYECTOS
        </button>
      </div>
    </div>
  </div>
 </div>
-</div>
+
+@push('styles')
+  <style type="text/css">
+    #banner {
+      background-image: url('{{$urls->images}}/banner.jpg');
+    }
+  </style>
+@endpush
--- a/resources/views/home/confianza.blade.php
+++ b/resources/views/home/confianza.blade.php
--- a/resources/views/home/destacados.blade.php
+++ b/resources/views/home/destacados.blade.php
@ -0,0 +1,137 @@
+<div id="destacados">
+  <div class="ui container">
+    <div class="ui header titulo">
+      PROYECTOS DESTACADOS
+    </div>
+    <div class="ui four columns stackable grid" id="proyectos">
+      @for ($i = 0; $i < min(4, count($destacados)); $i ++)
+        <div class="column">
+          <div class="ui card ficha">
+            <div class="content">
+              <div class="header titulo">
+                Proyecto
+              </div>
+              <div class="meta">
+                <div class="right floated">
+                  Segmento
+                </div>
+                Comuna
+              </div>
+            </div>
+            <div class="image">
+              <div class="ui placeholder">
+                <div class="square image"></div>
+              </div>
+            </div>
+            <div class="content">
+              Detalles
+            </div>
+          </div>
+        </div>
+      @endfor
+    </div>
+    @if (count($destacados) > 4)
+      <div class="ui grid" id="paging">
+      </div>
+    @endif
+  </div>
+</div>
+
+@push('scripts')
+  <script type="text/javascript">
+    var destacados = {
+      curr_page: 1,
+      max_page: {{ceil(count($destacados) / 4)}},
+      id: '#destacados',
+      buildCard: (div, id) => {
+        $.ajax({
+          url: '{{$urls->base}}/proyecto/' + id + '/ficha',
+          success: function(data) {
+            div.append(data)
+          }
+        })
+      },
+      fillCards: (data) => {
+        var proyectos = $(destacados.id).find('#proyectos')
+        proyectos.html('')
+        $.each(data, function(i, el) {
+          var div = $('<div></div>').attr('class', 'column')
+          proyectos.append(
+            div
+          )
+          destacados.buildCard(div, el)
+        })
+      },
+      movePage: (page) => {
+        if (page == 'prev') {
+          page = Math.max(1, parseInt(destacados.curr_page) - 1)
+        }
+        if (page == 'next') {
+          page = Math.min(destacados.max_page, parseInt(destacados.curr_page) + 1)
+        }
+        destacados.findPage(page)
+      },
+      buildPaging: () => {
+        var paging = $(destacados.id).find('#paging')
+        paging.html('')
+        paging.append(
+          $('<div></div>').attr('class', 'column')
+        )
+        var ini = destacados.curr_page - 1
+        if (destacados.curr_page == 1) {
+          ini = 1
+        }
+        if (destacados.curr_page == destacados.max_page) {
+          ini = destacados.curr_page - 2
+        }
+        if (destacados.curr_page > 1) {
+          paging.append(
+            $('<div></div>').attr('class', 'column').append(
+              $('<span></span>').attr('class', 'pagina').attr('data-page', 'prev').append(
+                $('<i></i>').attr('class', 'angle left icon')
+              )
+            )
+          )
+        }
+        var max = Math.min(destacados.max_page, ini + 2)
+        for (var i = ini; i <= max; i ++) {
+          var span = $('<span></span>').attr('class', 'pagina').attr('data-page', i).html(i)
+          if (i == destacados.curr_page) {
+            span.addClass('active')
+          }
+          paging.append(
+            $('<div></div>').attr('class', 'column').append(span)
+          )
+        }
+        if (destacados.curr_page < destacados.max_page) {
+          paging.append(
+            $('<div></div>').attr('class', 'column').append(
+              $('<span></span>').attr('class', 'pagina').attr('data-page', 'next').append(
+                $('<i></i>').attr('class', 'angle right icon')
+              )
+            )
+          )
+        }
+        $(destacados.id).find('.pagina:not(.active)').css('cursor', 'pointer').click(function() {
+          var page = $(this).attr('data-page')
+          destacados.movePage(page)
+        })
+      },
+      findPage: (page) => {
+        $.getJSON('{{$urls->base}}/proyectos/destacados/' + page, function(data) {
+          $('#destacados').find('.pagina.active').removeClass('.active')
+          destacados.curr_page = data.information.page
+          destacados.buildPaging()
+          destacados.fillCards(data.destacados)
+        })
+      },
+      setup: () => {
+        destacados.buildPaging()
+        destacados.findPage(destacados.curr_page)
+      }
+    }
+    $(document).ready(function() {
+      destacados.setup()
+    })
+  </script>
+@endpush
--- a/resources/views/home/destacados/ficha.blade.php
+++ b/resources/views/home/destacados/ficha.blade.php
@ -0,0 +1,56 @@
+<div class="ui card ficha">
+  <div class="content">
+    <div class="header">
+      {{$proyecto->edificio}}
+    </div>
+    <div class="right floated meta">
+      {{$proyecto->segmento}}
+    </div>
+    <div class="descripcion">
+      {{$proyecto->comuna}}
+    </div>
+  </div>
+  <div class="medium image">
+    @if ($proyecto->destacado)
+      <div class="overlay">Destacado</div>
+    @endif
+    <img src="{{$urls->images}}/{{$proyecto->imagen}}" />
+  </div>
+  <div class="content">
+    <div class="ui basic segment">
+      <span class="right floated">
+        {{$proyecto->valor}} UF
+      </span>
+      Valor depto
+    </div>
+    <div class="ui basic segment">
+      <span class="right floated">
+        {{$proyecto->bono}} UF
+      </span>
+      Bono Pie
+    </div>
+    <div class="ui basic segment">
+      <span class="right floated">
+        {{$proyecto->rentabilidad}}%
+      </span>
+      Rentabilidad
+    </div>
+    <div class="ui basic segment">
+      <span class="right floated">
+        {{$proyecto->cuota}} UF
+      </span>
+      Valor cuota
+    </div>
+    <div class="ui basic segment">
+      <span class="right floated">
+        {{$proyecto->entrega}}
+      </span>
+      Entrega Estimada
+    </div>
+    <span class="right floated">
+      <button class="ui inverted brand button">
+        Ver
+      </button>
+    </span>
+  </div>
+</div>
--- a/resources/views/home/indicadores.blade.php
+++ b/resources/views/home/indicadores.blade.php
@ -0,0 +1,63 @@
+<div id="indicadores">
+  <div class="ui container">
+    <div class="ui grid">
+    </div>
+  </div>
+</div>
+
+@push('scripts')
+  <script type="text/javascript">
+    var indicadores = {
+      indicadores: [
+        @foreach ($indicadores as $indicador => $titulo)
+        {
+          sim: '{{$indicador}}',
+          titulo: '{{$titulo}}'
+        },
+        @endforeach
+      ],
+      id: '#indicadores',
+      current: {{count($indicadores)}},
+      findIndicador: (i) => {
+        var indicador = indicadores.indicadores[i]
+        return $.ajax({
+          url: '{{$urls->base}}/indicador/' + indicador.sim,
+          success: (data) => {
+            var div = $('<div></div>').attr('class', 'two wide center aligned column').append(
+              $('<div></div>').attr('class', 'ui header').append(indicador.titulo).append(
+                $('<div></div>').attr('class', 'sub header').html(data.valor)
+              )
+            )
+            $(indicadores.id).find('.grid').append(
+              div
+            )
+          }
+        })
+      },
+      findNext: () => {
+        console.log('Next call')
+        next = indicadores.current + 1
+        if (next > indicadores.indicadores.length) {
+          next = 0
+        }
+        indicadores.findIndicador(next).done(() => {
+          $(indicadores.id).find('.grid').find('.column:first-child').remove()
+          indicadores.current = next
+          setTimeout(indicadores.findNext(), 30000)
+        })
+      },
+      setup: () => {
+        var promises = []
+        $.each(indicadores.indicadores, (i, el) => {
+          promises.push(indicadores.findIndicador(i))
+        })
+        Promise.all(promises).then(() => {
+          setTimeout(indicadores.findNext(), 30000)
+        })
+      }
+    }
+    $(document).ready(() => {
+      indicadores.setup()
+    })
+  </script>
+@endpush
--- a/resources/views/home/resumen.blade.php
+++ b/resources/views/home/resumen.blade.php
@ -0,0 +1,63 @@
+<div id="resumen">
+  <div class="ui container">
+    <div class="ui center aligned grid">
+      <div class="three wide column">
+        <div class="ui inverted circular segment">
+          <div class="ui big header">
+            123
+            <div class="sub header">
+              Negocios Cerrados
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="column"></div>
+      <div class="three wide column">
+        <div class="ui inverted circular segment">
+          <div class="ui big header">
+            12
+            <div class="sub header">
+              Proyectos Publicados
+            </div>
+          </div>
+        </div>
+      </div>
+      <div class="column"></div>
+      <div class="three wide column">
+        <div class="ui inverted circular segment">
+          <div class="ui big header">
+            10
+            <div class="sub header">
+              Texto Relleno
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</div>
+
+@push('styles')
+  <style type="text/css">
+    #resumen {
+      background-image: url('{{$urls->images}}/indicadores.jpg');
+    }
+  </style>
+@endpush
+
+@push('scripts')
+  <script type="text/javascript">
+    var max_width = 0
+    $(document).ready(function() {
+      $('#resumen .circular.segment').each(function(i, el) {
+        var width = $(this).css('width')
+        var w = parseInt(width)
+        if (w > max_width) {
+          max_width = w
+        }
+        $(this).css('width', max_width + 'px')
+        $(this).css('height', max_width + 'px')
+      })
+    })
+  </script>
+@endpush
--- a/resources/views/home/segmentos.blade.php
+++ b/resources/views/home/segmentos.blade.php
@ -2,20 +2,11 @@
  <div class="ui header">
    SEGMENTOS DE NEGOCIO
  </div>
-  <div class="ui center aligned stacked four columns grid">
-    <div class="column">
-      <div class="ui basic card">
-        <div class="ui placeholder">
-          <div class="image">
-            <!-- <img src="#" /> -->
-          </div>
-        </div>
-        Oficinas
-      </div>
-      <div class="ui basic card">
-        <div class="image">
-        </div>
-      </div>
-    </div>
+  <div class="ui center aligned stackable grid">
+    @foreach ($segmentos as $segmento)
+      <div class="three wide column">
+        @include('home.segmentos.ficha')
+      </div>
+    @endforeach
  </div>
 </div>
--- a/resources/views/home/segmentos/ficha.blade.php
+++ b/resources/views/home/segmentos/ficha.blade.php
@ -0,0 +1,8 @@
+<div class="ui basic segment">
+  <div class="ui medium image">
+    {!!$segmento->imagen!!}
+  </div>
+  <div class="ui small header">
+    {{$segmento->titulo}}
+  </div>
+</div>
--- a/resources/views/layout/footer.blade.php
+++ b/resources/views/layout/footer.blade.php
@ -1,4 +1,4 @@
-<footer class="inverted brand">
+<footer>
  <div class="ui container">
    <div class="ui tiny text menu">
      <div class="item">
@ -8,7 +8,7 @@
      <div class="right menu">
        <div class="item">
          N° Visitas
-          <div class="ui brand label">
+          <div class="ui label" >
            <i class="users icon"></i>
            {{$visitas}}
          </div>
--- a/resources/views/layout/header/menu.blade.php
+++ b/resources/views/layout/header/menu.blade.php
@ -1,22 +1,22 @@
 <div class="ui container">
  <nav class="ui massive text menu">
    <a class="item logo" href="{{$urls->base}}">
-      <strong>
-        Capital<span class="brand">Investments</span>
-      </strong>
+      <div class="ui title image">
+        <img src="{{$urls->images}}/logo.png" alt="Capital Investments" title="Capital Investments" />
+      </div>
    </a>
    <div class="right menu">
      <a class="item">
-        Nosotros
+        NOSOTROS
      </a>
      <a class="item">
-        Productos
+        PRODUCTOS
      </a>
      <a class="item">
-        PPFF
+        FAQs
      </a>
      <a class="item">
-        Contacto
+        CONTACTO
      </a>
    </div>
  </nav>