index.html

[tabacostudio]

<title>LADYS LA PAZ</title>

<meta name="theme-color" content="#2091F9">

<meta name="title" content="Servicio Profecional">
<meta name="description"
    content="Hola, soy una descripción que verás cuando busques algo de mi temática en Google.">


<meta property="og:type" content="website">
<meta property="og:url" content="https://alexcgdesign.github.io">
<meta property="og:title" content="Servicio Profecional">
<meta property="og:description"
    content="Hola, soy una descripción que verás cuando busques algo de mi temática en Google.">
<meta property="og:image" content="https://alexcgdesign.github.io/images/css.jpg">

<meta property="twitter:card" content="summary_large_image">
<meta property="twitter:url" content="https://www.jordanalex.com/">
<meta property="twitter:title" content="Aprende CSS desde cero">
<meta property="twitter:description"
    content="Hola, soy una descripción que verás cuando busques algo de mi temática en Google.">
<meta property="twitter:image" content="https://alexcgdesign.github.io/images/css.jpg">

<header class="hero">
    <nav class="nav container">
        <div class="nav__logo">
            <h2 class="nav__title">LADYS LA PAZ V.I.P.</h2>
        </div>

        <ul class="nav__link nav__link--menu">
            <li class="nav__items">
                <a href="#" class="nav__links">Inicio</a>
            </li>
            <li class="nav__items">
                <a href="#" class="nav__links">Acerca de</a>
            </li>
            <li class="nav__items">
                <a href="#" class="nav__links">Contacto</a>
            </li>
            <li class="nav__items">
                <a href="#" class="nav__links">Blog</a>
            </li>

            <img src="./images/close.svg" class="nav__close">
        </ul>

        <div class="nav__menu">
            <img src="./images/menu.svg" class="nav__img">
        </div>
    </nav>

    <section class="hero__container container">
        <h1 class="hero__title">LADYS LA PAZ.</h1>
        <p class="hero__paragraph">Elige una manera agradable en presencia de personal confiable y profecional
            que haran que tu instancia o visita en la paz sea de lo mas agradable
            .</p>
        <a href="#" class="cta">Contactanos ahora</a>
    </section>
</header>

<main>
    <section class="container about">
        <h2 class="subtitle">¿Qué formas tiene el sitio para mi?</h2>
        <p class="about__paragraph">Todo lo necesario y obligatorio del estado nacional y extranjero, (Colombia,
            Brazil, Venezuela,
            Cuba, Peru, y más)</p>

        <div class="about__main">
            <article class="about__icons">
                <img src="./images/shapes.svg" class="about__icon">
                <h3 class="about__title">Privado V.I.P</h3>
                <p class="about__paragrah"> "No hay nadie que ame el dolor mismo, que lo busque y lo quiera tener,
                    simplemente porque es el dolor...".</p>
            </article>

            <article class="about__icons">
                <img src="./images/paint.svg" class="about__icon">
                <h3 class="about__title">Seguridad</h3>
                <p class="about__paragrah"> "No hay nadie que ame el dolor mismo, que lo busque y lo quiera tener,
                    simplemente porque es el dolor...".</p>
            </article>

Profecional

"No hay nadie que ame el dolor mismo, que lo busque y lo quiera tener, simplemente porque es el dolor...".

    <section class="knowledge">
        <div class="knowledge__container container">
            <div class="knowledege__texts">
                <h2 class="subtitle">Conoce nuestros principios. ¡La nueva forma de brindar consultoria en tu
                    domicilio!</h2>
                <p class="knowledge__paragraph">Lorem ipsum dolor sit, amet consectetur adipisicing elit. Excepturi,
                    aliquam nemo in facere suscipit at delectus unde labore ad officia iste accusantium eaque
                    aperiam laborum est voluptate totam? Modi, obcaecati?</p>
                <a href="#" class="cta">Proteccion De Datos</a>
            </div>

            <figure class="knowledge__picture">
                <img src="./images/macbook.png" class="knowledge__img">
            </figure>
        </div>
    </section>

    <section class="price container">
        <h2 class="subtitle">Obten La Consultoria De Nivel</h2>

        <div class="price__table">
            <div class="price__element">
                <p class="price__name">Local</p>
                <h3 class="price__price">2600</h3>

                <div class="price__items">
                    <p class="price__features">Estado</p>
                    <p class="price__features">Nacional</p>
                    <p class="price__features">Internacional</p>
                </div>

                <a href="#" class="price__cta">Decide ahora</a>
            </div>


            <div class="price__element price__element--best">
                <p class="price__name">Nacional</p>
                <h3 class="price__price">2700</h3>

                <div class="price__items">
                    <p class="price__features">Ladys N24</p>
                    <p class="price__features">Ladys N25</p>
                    <p class="price__features">Ladys N26</p>
                </div>

                <a href="#" class="price__cta">Decide ahora</a>
            </div>


            <div class="price__element">
                <p class="price__name">Internacional</p>
                <h3 class="price__price">2800</h3>

                <div class="price__items">
                    <p class="price__features">Ladys J24</p>
                    <p class="price__features">Ladys J25</p>
                    <p class="price__features">Ladys J26</p>
                </div>

                <a href="#" class="price__cta">Decide ahora</a>
            </div>


        </div>
    </section>

    <section class="testimony">
        <div class="testimony__container container">
            <img src="./images/leftarrow.svg" class="testimony__arrow" id="before">

            <section class="testimony__body testimony__body--show" data-id="1">
                <div class="testimony__texts">
                    <h2 class="subtitle">Mi nombre es Brenda Gonzalez, <span class="testimony__course">Consultora
                            Ladys La Paz.</span></h2>
                    <p class="testimony__review">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut est
                        esse, asperiores eaque totam nulla repudiandae quasi, deserunt culpa exercitationem
                        blanditiis laborum veniam laboriosam saepe reiciendis dolorem. Cum, ratione voluptatum!</p>
                </div>

            <section class="testimony__body" data-id="2">
                <div class="testimony__texts">
                    <h2 class="subtitle">Mi nombre es Alejandra Perez, <span class="testimony__course">Consultora
                            ladys la paz.</span></h2>
                    <p class="testimony__review">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut est
                        esse, asperiores eaque laborum veniam laboriosam saepe reiciendis dolorem. Cum, ratione
                        voluptatum!</p>
                </div>

                <figure class="testimony__picture">
                    <img src="./images/face2.jpg" class="testimony__img">
                </figure>
            </section>

            <section class="testimony__body" data-id="3">
                <div class="testimony__texts">
                    <h2 class="subtitle">Mi nombre es Karen Arteaga, <span class="testimony__course">Consultora
                            Ladys la paz.</span></h2>
                    <p class="testimony__review">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut est
                        esse, niam laboriosam saepe reiciendis dolorem. Cum, ratione voluptatum!</p>
                </div>

                <figure class="testimony__picture">
                    <img src="./images/face3.jpg" class="testimony__img">
                </figure>
            </section>

            <section class="testimony__body" data-id="4">
                <div class="testimony__texts">
                    <h2 class="subtitle">Mi nombre es Mary Ramirez, <span class="testimony__course">Consultora de
                            ladys la paz <span class="pf pf-amazon-pay"></span> </span></h2>
                    <p class="testimony__review">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Ut est
                        esse, niam laboriosam saepe reiciendis dolorem. Cum, ratione voluptatum!</p>
                </div>

                <figure class="testimony__picture">
                    <img src="./images/face4.jpg" class="testimony__img">
                </figure>
            </section>


            <img src="./images/rightarrow.svg" class="testimony__arrow" id="next">
        </div>
    </section>

    <section class="questions container">
        <h2 class="subtitle">Preguntas frecuentes</h2>
        <p class="questions__paragraph">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Ea, porro
            doloribus neque perspiciatis sapiente fuga.</p>

        <section class="questions__container">
            <article class="questions__padding">
                <div class="questions__answer">
                    <h3 class="questions__title">¿Que metodos de pago tienen?
                        <span class="questions__arrow">
                            <img src="./images/arrow.svg" class="questions__img">
                        </span>
                    </h3>

                    <p class="questions__show">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Quos
                        facere, quidem eum id excepturi assumenda explicabo nam accusamus veritatis voluptates
                        eveniet adipisci, dicta nihil nemo modi possimus officiis quam atque? Lorem ipsum, dolor sit
                        amet consectetur adipisicing elit. Quos facere, quidem eum id excepturi assumenda explicabo
                        nam accusamus veritatis voluptates eveniet adipisci, dicta nihil nemo modi possimus officiis
                        quam atque?</p>
                </div>
            </article>

¿Que Calidad de servicio obtendre?

                    <p class="questions__show">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Quos
                        facere, quidem eum id excepturi assumenda explicabo nam accusamus veritatis voluptates
                        eveniet adipisci, dicta nihil nemo modi possimus officiis quam atque? Lorem ipsum, dolor sit
                        amet consectetur adipisicing elit. Quos facere, quidem eum id excepturi assumenda explicabo
                        nam accusamus veritatis voluptates eveniet adipisci, dicta nihil nemo modi possimus officiis
                        quam atque?</p>
                </div>
            </article>

            <article class="questions__padding">
                <div class="questions__answer">
                    <h3 class="questions__title">¿Qué es Ladys la paz?
                        <span class="questions__arrow">
                            <img src="./images/arrow.svg" class="questions__img">
                        </span>
                    </h3>

                    <p class="questions__show">Lorem ipsum, dolor sit amet consectetur adipisicing elit. Quos
                        facere, quidem eum id excepturi assumenda explicabo nam accusamus veritatis voluptates
                        eveniet adipisci, dicta nihil nemo modi possimus officiis quam atque? Lorem ipsum, dolor sit
                        amet consectetur adipisicing elit. Quos facere, quidem eum id excepturi assumenda explicabo
                        nam accusamus veritatis voluptates eveniet adipisci, dicta nihil nemo modi possimus officiis
                        quam atque?</p>
                </div>
            </article>
        </section>

        <section class="questions__offer">
            <h2 class="subtitle">¿Estas listo Empieza y Disfruta de la exelencia</h2>
            <p class="questions__copy">Lorem, ipsum dolor sit amet consectetur adipisicing elit. Amet ratione
                architecto magnam, officiis ex porro vero est voluptates quaerat quibusdam illo veniam reprehenderit
                eius atque tempora iure ab non autem.</p>
            <a href="#" class="cta">Decide Ahora Mismo</a>
        </section>
    </section>
</main>

<footer class="footer">
    <section class="footer__container container">
        <nav class="nav nav--footer">
            <h2 class="footer__title">Ladys La Paz.</h2>

            <ul class="nav__link nav__link--footer">
                <li class="nav__items">
                    <a href="#" class="nav__links">Inicio</a>
                </li>
                <li class="nav__items">
                    <a href="#" class="nav__links">Acerca de</a>
                </li>
                <li class="nav__items">
                    <a href="#" class="nav__links">Contacto</a>
                </li>
                <li class="nav__items">
                    <a href="#" class="nav__links">Blog</a>
                </li>
            </ul>
        </nav>

        <form class="footer__form" action="https://formspree.io/f/mknkkrkj" method="POST">
            <h2 class="footer__newsletter">Suscribete a la newsletter</h2>
            <div class="footer__inputs">
                <input type="email" placeholder="Email:" class="footer__input" name="_replyto">
                <input type="submit" value="Registrate" class="footer__submit">
            </div>
        </form>
    </section>

        <h3 class="footer__copyright">Derechos reservados &copy; Ladys La Paz</h3>
    </section>
</footer>

<script src="./js/slider.js"></script>
<script src="./js/questions.js"></script>
<script src="./js/menu.js"></script>