.bg-light {
  --bs-bg-opacity: 0; }

/* menu hamburguesa */
.navbar-toggler {
  border: 1.5px solid black; }
  .navbar-toggler:focus {
    text-decoration: none;
    outline: 0;
    box-shadow: none; }

/* Boton buscar */
.btn-outline-dark {
  border: 0px;
  --bs-btn-focus-shadow-rgb: none; }

/* form de busqueda */
.form-control {
  border: 0px solid black;
  border-radius: 20px; }

.nav-link {
  color: #000000;
  font-weight: 600; }
  .nav-link:hover {
    text-shadow: 1px 1px 9px white; }

.footer {
  background-color: #FCCA46;
  color: #000000;
  padding: 2em;
  text-align: center;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  grid-template-rows: repeat(2, 1fr);
  grid-template-areas: "logo link1 link2"
 "redes link1 link2"; }
  .footer .footerLogo {
    display: inline-block;
    margin-bottom: 1em;
    grid-area: logo; }
    .footer .footerLogo img {
      width: 7em; }
  .footer .footerRedes {
    margin-bottom: 1em;
    grid-area: redes; }
    @media (max-width: 661px) {
      .footer .footerRedes {
        display: grid;
        grid-template-columns: repeat(2, 1fr); } }
    .footer .footerRedes a {
      display: inline-block; }
      .footer .footerRedes a:not(:last-child) {
        margin-right: 1em; }
    .footer .footerRedes img {
      width: 35px; }
  .footer .footerLinks {
    display: flex;
    flex-direction: column;
    align-items: flex-start; }
    @media (max-width: 768px) {
      .footer .footerLinks {
        align-items: center; } }
    .footer .footerLinks a {
      text-decoration: none;
      color: #000000;
      line-height: 2.25;
      font-weight: 600; }
      .footer .footerLinks a:hover {
        text-shadow: 1px 1px 9px white; }
    .footer .footerLinks.col1 {
      grid-area: link1;
      justify-self: center; }
    .footer .footerLinks.col2 {
      grid-area: link2; }
  .footer .footerCopyright {
    margin-top: 9em;
    grid-area: copyright; }

header {
  background-color: #FCCA46;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 200; }

h1, .parrafos, * {
  font-family: 'Mochiy Pop P One', sans-serif;
  font-family: 'Overpass', sans-serif; }

.form-contacto input, .form-contacto textarea {
  width: 100%;
  margin-bottom: 20px;
  padding: 7px;
  font-size: 1.1em;
  border: none;
  border-radius: 7px; }

h1 {
  text-align: center;
  text-transform: uppercase;
  font-size: 2.5em;
  font-weight: 600; }

.titulo-index {
  margin-top: 1em; }

.titulo-marcas {
  margin-top: 1em; }

.titulo-contactanos {
  margin-top: 0.5em; }

.titulo-nosotros {
  margin-top: 1em; }

.parrafos {
  font-weight: 300;
  font-style: italic;
  font-size: 1.3em;
  letter-spacing: 0.1em;
  word-spacing: 0.3em;
  line-height: 1.8em;
  text-align: center;
  padding: 0.5em 1em; }

.parrafo-index {
  margin: 0 7em;
  padding: 0 0;
  text-align: justify; }

.mainIndex {
  margin: 1em 0; }
  .mainIndex .container .row h1 {
    margin-top: 0.3em;
    margin-bottom: 1em; }
  .mainIndex .container .row h2 {
    font-size: 1.3em;
    margin-top: 1em; }
  .mainIndex .container .row .col a {
    text-decoration: none; }
    .mainIndex .container .row .col a:hover {
      text-shadow: 1px 1px 3px darkgray;
      transition: 0.5s ease-in-out; }
    .mainIndex .container .row .col a h5 {
      margin: 0.5em 0 0.8em 0;
      display: flex;
      justify-content: center;
      color: #000000; }
      @media (max-width: 767px) {
        .mainIndex .container .row .col a h5 {
          font-size: 1em; } }

@media (max-width: 767px) {
  .colMarcas1,
  .colMarcas2 {
    width: 50%;
    padding: 0.5em 1em; } }

.metodo-compra_container {
  display: flex;
  justify-content: space-around;
  margin: 2em 1em;
  padding: 0.5em; }
  @media (max-width: 920px) {
    .metodo-compra_container {
      display: flex;
      flex-direction: column;
      flex-wrap: wrap; } }
  .metodo-compra_container .paso-uno, .metodo-compra_container .paso-dos, .metodo-compra_container .paso-tres {
    flex-wrap: wrap;
    text-align: center;
    display: flex;
    justify-content: center; }
    @media (max-width: 920px) {
      .metodo-compra_container .paso-uno, .metodo-compra_container .paso-dos, .metodo-compra_container .paso-tres {
        margin: 1em 12em;
        display: flex;
        align-items: center; } }
    @media (max-width: 744px) {
      .metodo-compra_container .paso-uno, .metodo-compra_container .paso-dos, .metodo-compra_container .paso-tres {
        margin: 1em 5em;
        display: flex;
        align-items: center;
        font-size: 0.5em; } }
    .metodo-compra_container .paso-uno img, .metodo-compra_container .paso-dos img, .metodo-compra_container .paso-tres img {
      width: 200px; }
    .metodo-compra_container .paso-uno h5, .metodo-compra_container .paso-dos h5, .metodo-compra_container .paso-tres h5 {
      margin: 0.5em 0; }

.marcas-container {
  flex-wrap: wrap;
  margin: 0 auto; }
  .marcas-container .cardMarca {
    position: relative;
    width: 20.5em;
    height: 19em;
    border-bottom: 1px solid lightgrey;
    margin: 3em 1em 3em 1em; }
    .marcas-container .cardMarca .marca-imgContainer {
      position: absolute;
      width: 100%;
      left: 50%;
      transform: translateX(-50%);
      height: 10em; }
      .marcas-container .cardMarca .marca-imgContainer img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%; }
    .marcas-container .cardMarca .marca-contenido {
      position: absolute;
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center; }
      .marcas-container .cardMarca .marca-contenido .marca-detalles {
        text-align: center;
        width: 100%;
        margin-top: 170px;
        height: 40px; }
        .marcas-container .cardMarca .marca-contenido .marca-detalles p {
          margin-bottom: 0; }
        .marcas-container .cardMarca .marca-contenido .marca-detalles .marca-button {
          margin-bottom: 5px;
          margin-top: -0.6em; }
          .marcas-container .cardMarca .marca-contenido .marca-detalles .marca-button button {
            background-color: #fff;
            padding: 3px 15px;
            border: none;
            box-shadow: 0 0 3px black;
            border-radius: 5px;
            margin-top: 2em; }
            .marcas-container .cardMarca .marca-contenido .marca-detalles .marca-button button:hover {
              background-color: #FCCA46; }
            .marcas-container .cardMarca .marca-contenido .marca-detalles .marca-button button a {
              text-decoration: none;
              color: #000000;
              font-weight: 600; }

.nosotros-container {
  display: flex;
  align-items: center;
  margin: 5em 0; }

.accordion-button {
  background-color: #FCCA46; }

.accordion-header {
  margin-bottom: 0.2em; }

.containerProd {
  flex-wrap: wrap;
  margin: 0 auto; }
  .containerProd .card {
    position: relative;
    width: 18em;
    height: 19em;
    background: #fff;
    border-radius: 5px;
    margin: 3em 1em 3em 1em;
    transition: 0.5s ease-in-out; }
    .containerProd .card:hover {
      height: 24em;
      box-shadow: 0 5px 15px darkgray; }
    .containerProd .card .imgBx {
      position: absolute;
      width: 90%;
      left: 50%;
      transform: translateX(-50%);
      height: 14em;
      border-radius: 20px;
      overflow: hidden; }
      .containerProd .card .imgBx img {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: contain; }
    .containerProd .card .content {
      position: absolute;
      width: 100%;
      height: 100%;
      display: flex;
      justify-content: center;
      overflow: hidden; }
      .containerProd .card .content .detalles {
        text-align: center;
        width: 100%;
        margin-top: 236px;
        height: 40px;
        transition: 0.5s; }
        .containerProd .card .content .detalles:hover {
          transform: translateY(0px); }
        .containerProd .card .content .detalles h3 {
          font-size: 1em;
          font-weight: 600;
          color: #000; }
        .containerProd .card .content .detalles h5 {
          font-size: 1.5em;
          font-weight: 800;
          color: #3fb83f; }
        .containerProd .card .content .detalles .carritoBtn {
          margin-bottom: 5px;
          margin-top: -0.6em; }
          .containerProd .card .content .detalles .carritoBtn p {
            margin-top: 1em;
            margin-bottom: 0.26em; }
          .containerProd .card .content .detalles .carritoBtn button {
            padding: 3px 15px;
            border: none;
            border-radius: 5px;
            outline: none;
            background-color: #FCCA46;
            font-weight: 400;
            font-size: 0.90em; }

h1, .parrafos, * {
  font-family: 'Mochiy Pop P One', sans-serif;
  font-family: 'Overpass', sans-serif; }

.form-contacto input, .form-contacto textarea {
  width: 100%;
  margin-bottom: 20px;
  padding: 7px;
  font-size: 1.1em;
  border: none;
  border-radius: 7px; }

.form-contacto {
  width: 450px;
  margin: auto;
  background: rgba(0, 0, 0, 0.1);
  padding: 10px 20px;
  margin-top: 20px;
  border-radius: 7px; }
  @media (max-width: 480px) {
    .form-contacto {
      width: 90%; } }
  .form-contacto h2 {
    text-align: center;
    margin: 0;
    font-size: 1.8em;
    font-weight: 600;
    margin-bottom: 15px; }
  .form-contacto textarea {
    max-width: 100%;
    max-height: 200px;
    min-height: 200px; }
  .form-contacto .buttonsForm {
    background: #fff;
    padding: 10px;
    transition: 0.5s ease-in-out; }
    .form-contacto .buttonsForm:hover {
      cursor: pointer;
      background: #FCCA46; }

h1, .parrafos, * {
  font-family: 'Mochiy Pop P One', sans-serif;
  font-family: 'Overpass', sans-serif; }

.form-contacto input, .form-contacto textarea {
  width: 100%;
  margin-bottom: 20px;
  padding: 7px;
  font-size: 1.1em;
  border: none;
  border-radius: 7px; }

* {
  padding: 0;
  margin: 0;
  box-sizing: border-box; }

body {
  padding-top: 85px;
  width: 100%; }

.disclaimer {
  display: none !important; }