2022-10-11 14:05:41 +00:00
<!DOCTYPE html>
< html lang = "pt-BR" >
< head >
2022-10-11 16:40:02 +00:00
< link rel = "preconnect" href = "https://fonts.googleapis.com" / >
< link rel = "preconnect" href = "https://fonts.gstatic.com" crossorigin / >
2022-10-11 18:27:45 +00:00
2022-10-11 14:05:41 +00:00
< meta charset = "UTF-8" / >
< meta http-equiv = "X-UA-Compatible" content = "IE=edge" / >
< meta charset = "author" content = "Saulo Klein Nery" / >
< meta name = "viewport" content = "width=device-width, initial-scale=1.0" / >
< title > Desafio 1 Landing Page< / title >
2022-10-11 16:40:02 +00:00
< link href = "https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel = "stylesheet" / >
< link rel = "stylesheet" href = "./styles/main.css" / >
2022-10-11 14:05:41 +00:00
< / head >
2022-10-11 18:27:45 +00:00
2022-10-11 14:05:41 +00:00
< body >
< header class = "page-header" >
< a href = "#" >
< img src = "./assets/svgs/m3-logo.svg" alt = "Logo da M3" >
< / a >
< / header >
2022-10-11 14:34:09 +00:00
< div >
2022-10-11 14:37:18 +00:00
< figure >
2022-10-11 16:40:02 +00:00
< img class = "main-banner main-banner-desktop" src = "./assets/imgs/main-banner-desktop.png" alt = "Banner Principal Desktop" >
2022-10-11 14:37:18 +00:00
< / figure >
2022-10-11 16:40:02 +00:00
2022-10-11 14:37:18 +00:00
< figure >
2022-10-11 16:40:02 +00:00
< img class = "main-banner main-banner-mobile" src = "./assets/imgs/main-banner-mobile.png" alt = "Banner Principal Mobile" >
2022-10-11 14:37:18 +00:00
< / figure >
2022-10-11 14:34:09 +00:00
< / div >
2022-10-11 14:37:18 +00:00
2022-10-11 16:40:02 +00:00
< section class = "top-infocard" >
< div class = "top-infocard-text" >
< h2 class = "top-infocard-subtitle" >
Lorem ipsum
< / h2 >
< h1 class = "top-infocard-title" >
dolor sit amet
< / h1 >
< p class = "top-infocard-description" >
2022-10-11 18:27:45 +00:00
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.
2022-10-11 16:40:02 +00:00
< / p >
< / div >
< figure class = "top-infocard-figure" >
< img class = "top-infocard-image" src = "./assets/svgs/top-infocard-image.svg" alt = "Imagem do Infocard Superior" >
< / figure >
< / section >
2022-10-11 18:27:45 +00:00
< div class = "top-cards" >
< div class = "top-card" >
< figure class = "top-card-figure" >
< img class = "top-card-image" src = "./assets/svgs/top-card01.svg" alt = "Imagem do Primeiro Card Superior" >
< figcaption class = "top-card-text" >
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
< / figcaption >
< / figure >
< / div >
< div class = "top-card" >
< figure class = "top-card-figure" >
< img class = "top-card-image" src = "./assets/svgs/top-card02.svg" alt = "Imagem do Segundo Card Superior" >
< figcaption class = "top-card-text" >
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
< / figcaption >
< / figure >
< / div >
< div class = "top-card" >
< figure class = "top-card-figure" >
< img class = "top-card-image" src = "./assets/svgs/top-card03.svg" alt = "Imagem do Terceiro Card Superior" >
< figcaption class = "top-card-text" >
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Cras euismod enim non dui fringilla interdum.
< / figcaption >
< / figure >
< / div >
< / div >
2022-10-11 19:25:11 +00:00
< div class = "middle-card-images" >
< div class = "middle-card-images-wrapper" >
< figure >
< img class = "middle-card-image" src = "./assets/svgs/middle-card-image01.svg" alt = "Imagem do Primeiro Card Central" >
< / figure >
2022-10-11 19:46:13 +00:00
< figure id = "middle-card02" >
2022-10-11 19:25:11 +00:00
< img class = "middle-card-image" src = "./assets/svgs/middle-card-image02.svg" alt = "Imagem do Segundo Card Central" >
< / figure >
2022-10-11 19:46:13 +00:00
< figure id = "middle-card03" >
2022-10-11 19:25:11 +00:00
< img class = "middle-card-image" src = "./assets/svgs/middle-card-image03.svg" alt = "Imagem do Terceiro Card Central" >
< / figure >
< / div >
< / div >
2022-10-11 14:05:41 +00:00
< / body >
< / html >
