Landing Page Builder | Magvilldigital

GRID SYSTEM
HTML Editor

<div class="container-fluid">

  <div class="container hero">
    
	 <div class="overlay"></div>
    
    <div class="container rounded  mt-5 offset-lg-2 col-lg-8" style="background: rgba(255,255,255,0.5)">
	   
      <nav class="navbar navbar-expand-sm bg-transparent">

        <div class="container-fluid">

          <a class="navbar-brand bg-transparent px-3 shadow-none engagement-regular" style="font-size:45px" href="javascript:void(0)">Chef Julius</a>

          <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#mynavbar">

           
          </button>

          <div class="collapse navbar-collapse" id="mynavbar">

            <ul class="navbar-nav ms-auto">

              <li class="nav-item">

                <a class="nav-link" href="#quiensoy">Quien soy</a>

              </li>

              <li class="nav-item">

                <a class="nav-link" href="#testimonios">Testimonios</a>

              </li>

              <li class="nav-item">

                <a class="nav-link" href="#servicios">Servicios</a>

              </li>
              
              <li class="nav-item">

                <a class="nav-link" href="#contacto">Contacto</a>

              </li>

            </ul>

          </div>

        </div>

      </nav>

    </div>

    <div class="d-flex flex-wrap justify-content-center align-content-center" style="height:750px">

      <div class="m-0">

      </div>

      <div class="m-0 content">

        <div class="text-center">

          <p class="display-3 museomoderno-900 text-white pt-5 pt-lg-0">El Chef Internacional que Transforma tus Eventos</p>

        </div>

        <div class="text-center">

          <p class="text-black h4 p-5">Gastronomía de clase mundial para celebraciones inolvidables.</p>

        </div>

        <div class="text-center">

          <button type="button" class="btn btn-secondary btn-color border-0 btn-lg">Reserva una cita</button>

        </div>

      </div>

      <div class="m-0">

      </div>

    </div>

  </div>

  <div class="container" id="quiensoy"  style="background-image: url(https://cms.digitaliza.top/views/assets/files/67d89ea674d7458.png); background-position: center center; background-repeat: no-repeat; background-size: cover; padding:250px 50px !important">

    <div class="text-center">

      <p class="display-3 museomoderno-900 text-white pt-5 pt-lg-0">Cenas privadas</p>

    </div>

    <div class="text-center">

      <p class="text-white h4 p-5">Experiencias culinarias especializadas en la comodidad de tu hogar.</p>

    </div>

    <div class="row">

      <div class="col-12 col-lg-6">

        <div class="row">

          <div class="col-12 col-lg-12">

            <div class="text-start">

              <p class="h3"><i class="bi bi-stars"></i> 5 estrellas</p>

            </div>

            <div class="text-start">

              <p>Julius es un verdadero artista en la cocina. Cada plato es una obra maestra. ¡Totalmente recomendado!- Juan Perez, cliente satisfecho.</p>

            </div>

          </div>

        </div>

        <div class="row">

          <div class="col-12 col-lg-12">

            <div class="text-start">

              <p class="h3"><i class="bi bi-stars"></i> 5 estrellas</p>

            </div>

            <div class="text-start">

              <p>Julius es un verdadero artista en la cocina. Cada plato es una obra maestra. ¡Totalmente recomendado!- Juan Perez, cliente satisfecho.</p>

            </div>

          </div>

        </div>

        <div class="row">

          <div class="col-12 col-lg-12">

            <div class="text-start">

              <p class="h3"><i class="bi bi-stars"></i> 5 estrellas</p>

            </div>

            <div class="text-start">

              <p>Julius es un verdadero artista en la cocina. Cada plato es una obra maestra. ¡Totalmente recomendado!- Juan Perez, cliente satisfecho.</p>

            </div>

          </div>

        </div>

      </div>

      <div class="col-12 col-lg-6">

      </div>

    </div>

  </div>

  <div class="container" id="testimonios" >

    <div class="text-center pt-5">

      <p class="display-3 museomoderno-900 text-black pt-5 pt-lg-0">Descubre Nuestras Exquisitas Creaciones</p>

    </div>

    <div class="text-center">

      <p class="text-black h5 p-5">Experiencias culinarias personalizadas en la comodidad de tu hogar.</p>

    </div>

    <div class="container">

      <div class="row">

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea7091ce59.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea661ba458.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea6bbcf858.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea71feb659.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

      </div>

      <div class="row">

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea661ba458.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea6eb2ac58.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <p class="h3">Menú Personalizado</p>

          </div>

          <div class="text-start">

            <h6>

              <small>El chef Julius se adapta a tus necesidades y preferencias para crear un menú único que satisfaga todos tus deseos culinarios</small>

            </h6>

          </div>

          <div class="text-start">

            <h1>

              <i class="bi bi-dice-5"></i>

              </i>

            </h1>

          </div>

        </div>

        <div class="col-12 col-lg-3">

          <div class="text-start">

            <p class="h3">Combinación de Sabores</p>

          </div>

          <div class="text-start">

            <h6>

              <small>Experimenta con sabores y texturas de diferentes culturas, combinados con la maestría del chef Julius.</small>

            </h6>

          </div>

          <div class="text-start">

            <h1>

              <i class="fas fa-coffee">

              </i>

            </h1>

          </div>

        </div>

      </div>

    </div>

    <div class="text-center pt-5" id="servicios">

      <p class="display-3 museomoderno-900 text-black pt-5">Talleres culinarios</p>

    </div>

    <div class="text-center">

      <p class="text-black h5 p-5">Aprende técnicas exclusivas de la mano de un chef internacional.</p>

    </div>

    <div class="container">

      <div class="row">

        <div class="col-12 col-lg-4">

          <div class="text-center">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea6d27a258.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

        <div class="col-12 col-lg-4">

          <div class="text-center">

            <figure>

              <img src="https://cms.digitaliza.top/views/assets/files/67d89ea68d2af58.png" class="img-fluid w-100">

            </figure>

          </div>

        </div>

        <div class="col-12 col-lg-4">

          <div class="row">

            <div class="col-12 col-lg-12">

              <div class="text-start">

                <p>Deleita a tus invitados con un catering excepcional que se adapta a tus necesidades y preferencias. ¡El chef Julius se encargará de todo!</p>

              </div>

              <div class="text-start mb-4">

                <button type="button" class="btn btn-secondary btn-color border-0 btn-lg">Reserva una cita</button>

              </div>

            </div>

          </div>

          <div class="row">

            <div class="col-12 col-lg-12">

              <div class="text-center">

                <figure>

                  <img src="https://cms.digitaliza.top/views/assets/files/67d89ea4562e556.jpg" class="img-fluid w-100">

                </figure>

              </div>

            </div>

          </div>

        </div>

      </div>

    </div>

  </div>

 <div class="container bg-dark text-white">
 
  <!-- Contacto -->
    <section id="contacto" class="container py-5  col-lg-8 offset-lg-2">
        <h1 class="text-center pb-5">Contáctame</h1>
        <form>
            <div class="mb-3">
                <label for="nombre" class="form-label">Nombre Completo</label>
                <input type="text" class="form-control" id="nombre" required>
            </div>
            <div class="mb-3">
                <label for="email" class="form-label">Correo Electrónico</label>
                <input type="email" class="form-control" id="email" required>
            </div>
            <div class="mb-3">
                <label for="mensaje" class="form-label">Mensaje</label>
                <textarea class="form-control" id="mensaje" rows="3"></textarea>
            </div>
            <button type="submit" class="btn btn-primary btn-color border-0">Enviar Mensaje</button>
        </form>
    </section>
 
  </div>
 
  <footer class="container text-center py-4 bg-dark text-white">
      <p>&copy; 2025 Chef Julius | Todos los derechos reservados.</p>
  </footer>

</div>
HTML Editor

CSS Editor

JS Editor

HTML Editor

CSS Editor

JS Editor

Gestión de Landing
