challenge-landing-page-gabr.../index.html

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <meta charset="UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="./style.css">
        <link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
        <title>Desafio-1</title>
    </head>
    <body>
        <header>
            <a href="./">
            <img src="./assets/Logo-M3Academy 1.png" alt="logo m3"
            />
            </a>
        </header>
        <section>
            <img class="top-banner-desktop" src="./assets/Rectangle 9.png" alt="laptop com codigos"
            />
            <img class="top-banner-mobile" src="./assets/Rectangle 9 mobile.png" alt="laptop com codigos"
            />
        </section>
        <section class="info-section">
            <div>
                <h2>
                    LOREM IPSUM
                </h2>
                <h1>
                    DOLOR SIT AMET
                </h1>
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui. 
                </p>
            </div>
            <img src="./assets/fxemoji_threenetworkedcomputers.svg" alt="desenho de tres computadores"
            />
        </section>
        <section class="top-cards">
            <div class="top-cards-box">
                <img src="./assets/shop 1.svg" alt="desenho de uma loja"
                />
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. 
                </p>
            </div>
            <div class="top-cards-box">
                <img src="./assets/shopping-bag (1) 1.svg" alt="desenho de uma sacola de compra"
                />
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
                </p>
            </div>
            <div class="top-cards-box">
                <img src="./assets/coin 1.svg" alt="desenho de uma mao com moeda"
                />
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. 
                </p>
            </div>
        </section>
        <section class="middle-banner">
            <div>
                <img src="./assets/Rectangle 13.png" alt="macbook fechando de frente">
                <img src="./assets/Rectangle 16.png" alt="macbook fechando de cima">
            </div>
            <img src="./assets/Rectangle 17.png" alt="macbook fechando de lado">
        </section>
        <section class="bottom-cards">
                <div class="bottom-cards-box">
                    <img src="./assets/money (1) 2.svg" alt="desenho de uma nota de dinheiro"
                    />
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. 
                    </p>
                </div>
                <div class="bottom-cards-box">
                    <img src="./assets/coin 2.svg" alt="desenho de uma mao com moeda"
                    />
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. 
                    </p>
                </div>
                <div class="bottom-cards-box">
                    <img src="./assets/laptop 1.svg" alt="desenho de um laptop"
                    />
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. 
                    </p>
                </div>
                <div class="bottom-cards-box">
                    <img src="./assets/Group.svg" alt="desenho de um celular"
                    />
                    <p>
                        Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. 
                    </p>
                </div>
        </section>
        <section class="bottom-banner">
            <img class="bottom-banner-mobile" src="./assets/Rectangle 15 mobile.png" alt="oculos na frente de codigos"
            />
            <div class="bottom-banner-text">
                <h2>
                    Lorem ipsum dolor sit amet
                </h2>
                <p>
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum. 
                    Quisque  a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis.
                    Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.
                </p>
            </div>
            <div>
                <img class="bottom-banner-desktop" src="./assets/Rectangle 15.png" alt="oculos na frente de codigos"
                />
            </div>
        </section>
        <footer>
            <div class="footer-logo">
                <a target="_blank" href="https://www.instagram.com/m3.ecommerce/#">
                    <img src="./assets/instagram-logo.svg" alt="logo do instagram"
                />
                </a>
                <a target="_blank" href="https://www.facebook.com/digitalm3/?ref=page_internal">
                    <img src="./assets/facebook-logo.svg" alt="logo do facebook"
                />
                </a>
                <a target="_blank" href="https://www.youtube.com/channel/UCW4o86gZG_ceA8CmHltXeXA">
                    <img src="./assets/youtube-logo.svg" alt="logo do youtube"
                />
                </a>
            </div>
            <p>
                Copyright © 2020 - Loja  Comércio Eletrônico CNPJ: 000.000.000/0001-00
            </p>
        </footer>
    </body>
</html>
feat: added header 2022-10-10 22:54:03 +00:00			`<!DOCTYPE html>`
			`<html lang="pt-br">`
feat added top-banner 2022-10-10 23:13:56 +00:00			`<head>`
feat: added info-section 2022-10-10 23:50:15 +00:00			`<link rel="preconnect" href="https://fonts.googleapis.com">`
			`<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>`
feat added top-banner 2022-10-10 23:13:56 +00:00			`<meta charset="UTF-8">`
			`<meta http-equiv="X-UA-Compatible" content="IE=edge">`
			`<meta name="viewport" content="width=device-width, initial-scale=1.0">`
			`<link rel="stylesheet" href="./style.css">`
feat: made mobile responsive 2022-10-13 17:36:42 +00:00			`<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">`
feat added top-banner 2022-10-10 23:13:56 +00:00			`<title>Desafio-1</title>`
			`</head>`
			`<body>`
			`<header>`
feat: added footer 2022-10-12 15:08:01 +00:00			`<a href="./">`
feat added top-banner 2022-10-10 23:13:56 +00:00			`<img src="./assets/Logo-M3Academy 1.png" alt="logo m3"`
			`/>`
feat: added footer 2022-10-12 15:08:01 +00:00			`</a>`
feat added top-banner 2022-10-10 23:13:56 +00:00			`</header>`
			`<section>`
			`<img class="top-banner-desktop" src="./assets/Rectangle 9.png" alt="laptop com codigos"`
			`/>`
			`<img class="top-banner-mobile" src="./assets/Rectangle 9 mobile.png" alt="laptop com codigos"`
			`/>`
			`</section>`
feat: added info-section 2022-10-10 23:50:15 +00:00			`<section class="info-section">`
			`<div>`
			`<h2>`
			`LOREM IPSUM`
			`</h2>`
			`<h1>`
			`DOLOR SIT AMET`
			`</h1>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Curabitur ut tortor sed lacus egestas vulputate vel sit amet velit. Nulla suscipit magna dui.`
			`</p>`
			`</div>`
			`<img src="./assets/fxemoji_threenetworkedcomputers.svg" alt="desenho de tres computadores"`
			`/>`
			`</section>`
feat added top-cards 2022-10-11 14:29:40 +00:00			`<section class="top-cards">`
			`<div class="top-cards-box">`
feat: added bottom-cards 2022-10-11 21:17:41 +00:00			`<img src="./assets/shop 1.svg" alt="desenho de uma loja"`
feat added top-cards 2022-10-11 14:29:40 +00:00			`/>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.`
			`</p>`
			`</div>`
			`<div class="top-cards-box">`
feat: added bottom-cards 2022-10-11 21:17:41 +00:00			`<img src="./assets/shopping-bag (1) 1.svg" alt="desenho de uma sacola de compra"`
feat added top-cards 2022-10-11 14:29:40 +00:00			`/>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.`
			`</p>`
			`</div>`
			`<div class="top-cards-box">`
feat: added bottom-cards 2022-10-11 21:17:41 +00:00			`<img src="./assets/coin 1.svg" alt="desenho de uma mao com moeda"`
feat added top-cards 2022-10-11 14:29:40 +00:00			`/>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.`
			`</p>`
			`</div>`
			`</section>`
feat: added middle-banner 2022-10-11 15:17:57 +00:00			`<section class="middle-banner">`
feat: made mobile responsive 2022-10-13 17:36:42 +00:00			`<div>`
			`<img src="./assets/Rectangle 13.png" alt="macbook fechando de frente">`
			`<img src="./assets/Rectangle 16.png" alt="macbook fechando de cima">`
			`</div>`
feat: added middle-banner 2022-10-11 15:17:57 +00:00			`<img src="./assets/Rectangle 17.png" alt="macbook fechando de lado">`
			`</section>`
feat: added bottom-cards 2022-10-11 21:17:41 +00:00			`<section class="bottom-cards">`
			`<div class="bottom-cards-box">`
			`<img src="./assets/money (1) 2.svg" alt="desenho de uma nota de dinheiro"`
			`/>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.`
			`</p>`
			`</div>`
			`<div class="bottom-cards-box">`
			`<img src="./assets/coin 2.svg" alt="desenho de uma mao com moeda"`
			`/>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.`
			`</p>`
			`</div>`
			`<div class="bottom-cards-box">`
			`<img src="./assets/laptop 1.svg" alt="desenho de um laptop"`
			`/>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.`
			`</p>`
			`</div>`
			`<div class="bottom-cards-box">`
			`<img src="./assets/Group.svg" alt="desenho de um celular"`
			`/>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.`
			`</p>`
			`</div>`
			`</section>`
feat: added bottom-banner 2022-10-11 21:53:52 +00:00			`<section class="bottom-banner">`
feat: made mobile responsive 2022-10-13 17:36:42 +00:00			`<img class="bottom-banner-mobile" src="./assets/Rectangle 15 mobile.png" alt="oculos na frente de codigos"`
			`/>`
			`<div class="bottom-banner-text">`
feat: added bottom-banner 2022-10-11 21:53:52 +00:00			`<h2>`
			`Lorem ipsum dolor sit amet`
			`</h2>`
			`<p>`
			`Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras vulputate sapien non libero faucibus interdum. In eget tincidunt ipsum.`
			`Quisque a tellus at lectus blandit tempor. Ut tristique auctor mi eget hendrerit. Curabitur venenatis felis vitae sagittis venenatis.`
			`Donec finibus turpis vitae lectus interdum rutrum vitae sed augue.`
			`</p>`
			`</div>`
			`<div>`
feat: made mobile responsive 2022-10-13 17:36:42 +00:00			`<img class="bottom-banner-desktop" src="./assets/Rectangle 15.png" alt="oculos na frente de codigos"`
			`/>`
feat: added bottom-banner 2022-10-11 21:53:52 +00:00			`</div>`
			`</section>`
feat: added footer 2022-10-12 15:08:01 +00:00			`<footer>`
			`<div class="footer-logo">`
			`<a target="_blank" href="https://www.instagram.com/m3.ecommerce/#">`
			`<img src="./assets/instagram-logo.svg" alt="logo do instagram"`
			`/>`
			`</a>`
			`<a target="_blank" href="https://www.facebook.com/digitalm3/?ref=page_internal">`
			`<img src="./assets/facebook-logo.svg" alt="logo do facebook"`
			`/>`
			`</a>`
			`<a target="_blank" href="https://www.youtube.com/channel/UCW4o86gZG_ceA8CmHltXeXA">`
			`<img src="./assets/youtube-logo.svg" alt="logo do youtube"`
			`/>`
			`</a>`
			`</div>`
			`<p>`
			`Copyright © 2020 - Loja Comércio Eletrônico CNPJ: 000.000.000/0001-00`
			`</p>`
			`</footer>`
feat added top-banner 2022-10-10 23:13:56 +00:00			`</body>`
feat: added header 2022-10-10 22:54:03 +00:00			`</html>`