diff --git a/src/components/carrusel.vue b/src/components/carrusel.vue
index 9faf0ba..ce1f0d6 100644
--- a/src/components/carrusel.vue
+++ b/src/components/carrusel.vue
@@ -2,7 +2,7 @@
   <div class="divMaster row my-5">
     <div
       id="carouselExampleControls"
-      class="carousel slide col-10 offset-1"
+      class="carousel slide col-md-10 col-lg-10 col-xl-10  col-12 mx-auto"
       data-ride="carousel"
     >
       <div class="carousel-inner">
diff --git a/src/esteticas/nav.vue b/src/esteticas/nav.vue
index 38b047a..5d6f1ca 100644
--- a/src/esteticas/nav.vue
+++ b/src/esteticas/nav.vue
@@ -1,9 +1,10 @@
 <template>
   <div class="divMaster doradoUnam row d-flex justify-content-center">
     <div class="col-10 offset-1">
-      <nav class="navbar navbar-expand-sm navbar-light  ">
+      <nav class="navbar navbar-expand-sm navbar-dark  ">
         <button
-          class="navbar-toggler"
+          @click="method()"
+          class="navbar-toggler col-5"
           type="button"
           data-toggle="collapse"
           data-target="#navbarTogglerDemo02"
@@ -15,94 +16,122 @@
           <span class="mx-2">Menu</span>
         </button>
 
-        <div class="collapse navbar-collapse" id="navbarTogglerDemo02">
-          <ul class="navbar-nav mr-auto  mt-0 mt-lg-0">
+        <div class="collapse navbar-collapse " id="navbarTogglerDemo02">
+          <ul
+            class="navbar-nav mr-auto w-100 d-flex align-items-center justify-content-around  mt-0 mt-lg-0"
+          >
             <li class="nav-item">
               <a class="nav-link text-white" href="#">Inicio</a>
             </li>
             <li class="nav-item">
               <a class="nav-link text-white" href="#">Presentacion</a>
             </li>
-            <li class="nav-item ">
-              <a
-                class="nav-link dropdown-toggle text-white "
-                id="navbarDropdown"
-                role="button"
-                data-toggle="dropdown"
-                aria-haspopup="true"
-                aria-expanded="false"
-                href="#"
-                >Libros</a
-              >
-              <div
-                class="dropdown-menu azulUnam"
-                aria-labelledby="navbarDropdown"
-              >
-                <a class="dropdown-item text-white" href="#"
-                  >Ciencias Socioeconomicas</a
+
+            <li class="nav-item">
+              <div class="dropdown">
+                <a
+                  class="btn nav-link  dropdown-toggle text-white"
+                  href="#"
+                  role="button"
+                  id="dropdownMenuLink"
+                  data-toggle="dropdown"
+                  aria-haspopup="true"
+                  aria-expanded="false"
                 >
-                <div class="dropdown-divider"></div>
-                <a class="dropdown-item text-white" href="#"
-                  >Diseño y Edificacion</a
-                >
-                <div class="dropdown-divider"></div>
-                <a class="dropdown-item text-white" href="#"
-                  >Enseñanza de Idiomas</a
-                >
-                <div class="dropdown-divider"></div>
-                <a class="dropdown-item text-white" href="#"
-                  >Estudios de Posgrado</a
-                >
-                <div class="dropdown-divider "></div>
-                <a class="dropdown-item text-white " href="#">Humanidades</a>
-                <div class="dropdown-divider"></div>
-                <a class="dropdown-item text-white" href="#"
-                  >Matematicas e Ingenieria</a
+                  Libros
+                </a>
+
+                <div
+                  class="dropdown-menu azulUnam"
+                  aria-labelledby="navbarDropdown"
                 >
+                  <a class="dropdown-item text-white" href="#"
+                    >Ciencias Socioeconomicas</a
+                  >
+                  <div class="dropdown-divider"></div>
+                  <a class="dropdown-item text-white" href="#"
+                    >Diseño y Edificacion</a
+                  >
+                  <div class="dropdown-divider"></div>
+                  <a class="dropdown-item text-white" href="#"
+                    >Enseñanza de Idiomas</a
+                  >
+                  <div class="dropdown-divider"></div>
+                  <a class="dropdown-item text-white" href="#"
+                    >Estudios de Posgrado</a
+                  >
+                  <div class="dropdown-divider "></div>
+                  <a class="dropdown-item text-white " href="#">Humanidades</a>
+                  <div class="dropdown-divider"></div>
+                  <a class="dropdown-item text-white" href="#"
+                    >Matematicas e Ingenieria</a
+                  >
+                </div>
               </div>
             </li>
+
             <li class="nav-item">
               <a class="nav-link text-white" href="#">Difusion Editorial</a>
             </li>
           </ul>
-          <form class="form-inline  my-0 my-lg-0">
-            <div class="input-group input-group-sm mb-0">
-              <input
-                type="text"
-                class="form-control reIzq "
-                placeholder="Buscar"
-                aria-label="Recipient's username"
-                aria-describedby="basic-addon2"
-              />
-              <div class="input-group-append reDer bg-white">
-                <button class="btn  my-0" type="submit">
-                  <svg
-                    width="1em"
-                    height="1em"
-                    viewBox="0 0 16 16"
-                    class="bi bi-search"
-                    fill="currentColor"
-                    xmlns="http://www.w3.org/2000/svg"
-                  >
-                    <path
-                      fill-rule="evenodd"
-                      d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
-                    />
-                    <path
-                      fill-rule="evenodd"
-                      d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
-                    />
-                  </svg>
-                </button>
-              </div>
-            </div>
-          </form>
         </div>
+
+        <form
+          id="buscador"
+          v-if="isExist"
+          class="form-inline  my-0 my-lg-0 buscador col-4 d-flex justify-content-end"
+        >
+          <div class="input-group input-group-sm mb-0">
+            <input
+              type="text"
+              class="form-control reIzq "
+              placeholder="Buscar"
+              aria-label="Recipient's username"
+              aria-describedby="basic-addon2"
+            />
+            <div class="input-group-append reDer bg-white">
+              <button class="btn  my-0" type="submit">
+                <svg
+                  width="1em"
+                  height="1em"
+                  viewBox="0 0 16 16"
+                  class="bi bi-search blanco"
+                  fill="currentColor"
+                  xmlns="http://www.w3.org/2000/svg"
+                >
+                  <path
+                    fill-rule="evenodd"
+                    d="M10.442 10.442a1 1 0 0 1 1.415 0l3.85 3.85a1 1 0 0 1-1.414 1.415l-3.85-3.85a1 1 0 0 1 0-1.415z"
+                  />
+                  <path
+                    fill-rule="evenodd"
+                    d="M6.5 12a5.5 5.5 0 1 0 0-11 5.5 5.5 0 0 0 0 11zM13 6.5a6.5 6.5 0 1 1-13 0 6.5 6.5 0 0 1 13 0z"
+                  />
+                </svg>
+              </button>
+            </div>
+          </div>
+        </form>
       </nav>
     </div>
   </div>
 </template>
 
+<script>
+export default {
+  data() {
+    return {
+      isExist: true
+    };
+  },
+  methods: {
+    method() {
+      this.isExist = !this.isExist;
+    }
+  }
+};
+</script>
+
 <style scoped>
 * {
   margin: 0;
@@ -124,24 +153,27 @@ nav {
 .doradoUnam {
   background-color: #bb8800;
 }
-.blanco {
-  color: white !important;
-}
 
 .dropdown-item:hover {
   background-color: #bb8800;
 }
 .nav-link:focus {
   background-color: #1e3c70;
-  border-radius: 2rem;
+  border-radius: 1rem;
+}
+
+.nav-link:hover {
+  background-color: #1e3c70;
+  color: white;
 }
 
 .nav-link {
   transition: 0.3s;
+  font-size: 20px;
 }
 
 .dropdown-item {
-  padding: 1rem;
+  padding: 0.3rem 1rem;
 }
 
 .menuText {
@@ -159,8 +191,9 @@ nav {
 }
 
 @media (max-width: 450px) {
-  .menuText {
-    display: block;
+  .menuText,
+  .buscador {
+    display: block !important;
   }
 }
 </style>
diff --git a/src/view/home.vue b/src/view/home.vue
index fc31da4..b5dfcea 100644
--- a/src/view/home.vue
+++ b/src/view/home.vue
@@ -12,13 +12,14 @@
 <script>
 import Header from "./../components/header.vue";
 import Nav from "./../esteticas/nav.vue";
+//import Nav from "./../components/navPrincipal.vue";
 import Footer from "./../components/footer.vue";
 import Carr from "../components/carrusel.vue";
 import Cart from "../components/cartLibro.vue";
 import Title from "../components/titulo.vue";
 
 export default {
-  name: "App",
+  name: "home",
   components: {
     Header,
     Nav,