gustavoguanabara · JefersonVM · Feb 10, 2023 · Feb 14, 2023 · Feb 20, 2023 · Feb 21, 2023
diff --git a/desafios/modulo-02/d012/estilo/style.css b/desafios/modulo-02/d012/estilo/style.css
@@ -0,0 +1,95 @@
+@charset "UTF-8";
+
+@import url('https://fonts.googleapis.com/css2?family=Passion+One&display=swap');
+@import url('https://fonts.googleapis.com/css2?family=Sriracha&display=swap');
+
+:root {
+    --font1: Verdana, Geneva, Tahoma, sans-serif;
+    --font2:'Passion One', cursive;
+    --font3:'Sriracha', cursive;
+}
+
+* {
+    margin: 0px;
+    padding: 0px;
+    font-size: 1em;
+}
+html, body {
+    min-height: 100vh;
+    background-color: darkgray;
+    font-family: var(--font1);
+}
+header {
+    background-color: black;
+    color: white;
+    text-align: center;
+}
+header > h1 {
+    padding-top: 50px;
+    /*text-transform: uppercase;*/
+    font-variant: small-caps;
+    font-family: var(--font2);
+    font-size: 10vw;
+}
+
+header > p {
+    padding-bottom: 50px;
+}
+header a, footer a {
+    color: white;
+    text-decoration: none;
+    font-weight: bolder;
+}
+header a:hover, footer a:hover {
+    text-decoration: underline;
+}
+
+section {
+    padding-top: 10vh;
+    padding-bottom: 10vh;
+    line-height: 2em;
+    padding-left: 30px;
+    font-family: var(--font3);
+    font-size: 3.5vw;
+}
+
+section > p {
+    padding-bottom: 1em;
+}
+
+section.imagem {
+    background-color: rgb(51, 51, 51);
+    color: white;
+    box-shadow: inset 6px 6px 13px 0px rgba(0, 0, 0, 0.473);
+    background-size: cover;
+    background-attachment: fixed;
+}
+section.imagem > p {
+    display: inline-block;
+    padding: 5px;
+    background-color: rgba(0, 0, 0, 0.514);
+    text-shadow: 1px 1px 0px black;
+}
+section#img01 {
+    background-image: url(/pacote-d012/imagens/background001.jpg);
+    background-position: right center;
+
+}
+
+section#img02 {
+    background-image: url(/pacote-d012/imagens/background002.jpg);
+
+}
+
+section.normal {
+    background-color: white;
+    color: black;
+}
+
+footer {
+    background-color: black;
+    color: white;
+    text-align: center;
+    padding: 10px;
+
+}
diff --git a/desafios/modulo-02/d012/index.html b/desafios/modulo-02/d012/index.html
@@ -0,0 +1,114 @@
+<!DOCTYPE html>
+<html lang="pt-br">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Cordel Moderno</title>
+    <link rel="stylesheet" href="estilo/style.css"> 
+</head>
+<body>
+
+        <header>
+            <h1>Cordel Moderno</h1>
+            <p>
+                Por <a href="https://www.recantodasletras.com.br/poesias/3186743" target="_blank">Milton Duarte</a>
+
+            </p>
+        </header>
+
+    <section class="normal">
+        <p>
+            Estou ficando cansado <br>
+            Da tal tecnologia <br>
+            Só se fala por e-mail <br>
+            Mensagem curta e fria <br>
+            Twitter e Facebook <br>
+            Antes que eu caduque <br>
+            Vou dizer tudo em poesia.
+        </p> 
+    </section>
+
+
+
+    <section class="imagem" id="img01">
+        <p>
+            Não é mais como era antes <br>
+            É tudo abreviado <br>
+            "Você" só tem duas letras <br>
+            O "O" e o "E" foi riscado <br>
+            Para declarar o amor <br>
+            Basta botar uma flor <br>
+            E um coração desenhado.
+        </p>
+    </section>
+
+
+
+    <section class="normal">
+
+            <p>
+                Arroba agora não pesa <br>
+                É parte de um endereço <br>
+                Ponto final nem se usa <br>
+                Ou vai até no começo <br>
+                Agora é .com <br>
+                Se o saite é muito bom <br>
+                Ele vale um alto preço. <br>
+            </p>
+            <p>
+                Pra piorar a liguagem <br>
+                O emoticom é um risco <br>
+                Tem símbolo para tudo <br>
+                Ponto e vírgula e um asterisco <br>
+                Um beijo significa <br>
+                Pra entender como fica <br>
+                Decifre esse rabisco.
+            </p>
+
+    </section>
+
+
+
+    <section class="imagem" id="img02">
+        <p>
+            Tenho saudade das cartas <br>
+            Escritas com a própria mão <br>
+            Mandava no mês de Junho <br>
+            Só chegava no Verão <br>
+            Mas matava a saudade <br>
+            Era texto de verdade <br>
+            Nas linhas do coração.
+        </p>
+    </section>
+
+
+
+    <section class="normal">
+
+            <p>
+                Agora, escrevo e envio <br>
+                Chegando na mesma hora <br>
+                Mas quando vou prosear <br>
+                A pessoa foi embora <br>
+                Abriu outro aplicativo <br>
+                O mundo ficou cativo <br>
+            </p>
+            <p>
+                Da tecnologia do agora. <br>
+                Felizmente, pra orar <br>
+                Não precisa de internet <br>
+                Deus escuta todo mundo <br>
+                Se quiser, faça esse teste <br>
+                Dois pontos são dois joelhos <br>
+                Seus lábios são aparelhos <br>
+                Deixe que Deus interprete.
+            </p>
+
+    </section>
+
+     <footer>
+        <p>Site criado por <a href="https://github.com/JefersonVM" target="_blank">Jeferson Vieira</a> para o <a href="https://www.cursoemvideo.com" target="_blank">Curso Em Vídeo.</a></p>
+     </footer>
+</body>
+</html>
diff --git a/desafios/modulo-02/d012/pacote-d012/__MACOSX/._cordel-moderno.txt b/desafios/modulo-02/d012/pacote-d012/__MACOSX/._cordel-moderno.txt
diff --git a/desafios/modulo-02/d012/pacote-d012/__MACOSX/imagens/._background001.jpg b/desafios/modulo-02/d012/pacote-d012/__MACOSX/imagens/._background001.jpg
diff --git a/desafios/modulo-02/d012/pacote-d012/__MACOSX/imagens/._background002.jpg b/desafios/modulo-02/d012/pacote-d012/__MACOSX/imagens/._background002.jpg
diff --git a/desafios/modulo-02/d012/pacote-d012/cordel-moderno.txt b/desafios/modulo-02/d012/pacote-d012/cordel-moderno.txt
@@ -0,0 +1,67 @@
+Cordel Moderno
+Por Milton Duarte
+[SITE: https://www.recantodasletras.com.br/poesias/3186743]
+
+Estou ficando cansado
+Da tal tecnologia
+Só se fala por e-mail
+Mensagem curta e fria
+Twitter e Facebook
+Antes que eu caduque
+Vou dizer tudo em poesia.
+
+//---
+
+Não é mais como era antes
+É tudo abreviado
+"Você" só tem duas letras
+O "O" e o "E" foi riscado
+Para declarar o amor
+Basta botar uma flor
+E um coração desenhado.
+
+//---
+
+Arroba agora não pesa
+É parte de um endereço
+Ponto final nem se usa
+Ou vai até no começo
+Agora é .com
+Se o saite é muito bom
+Ele vale um alto preço.
+
+Pra piorar a liguagem
+O emoticom é um risco
+Tem símbolo para tudo
+Ponto e vírgula e um asterisco
+Um beijo significa
+Pra entender como fica
+Decifre esse rabisco.
+
+//---
+
+Tenho saudade das cartas
+Escritas com a própria mão
+Mandava no mês de Junho
+Só chegava no Verão
+Mas matava a saudade
+Era texto de verdade
+Nas linhas do coração.
+
+//---
+
+Agora, escrevo e envio
+Chegando na mesma hora
+Mas quando vou prosear
+A pessoa foi embora
+Abriu outro aplicativo
+O mundo ficou cativo
+Da tecnologia do agora.
+
+Felizmente, pra orar
+Não precisa de internet
+Deus escuta todo mundo
+Se quiser, faça esse teste
+Dois pontos são dois joelhos
+Seus lábios são aparelhos
+Deixe que Deus interprete.
diff --git a/desafios/modulo-02/d012/pacote-d012/imagens/background001.jpg b/desafios/modulo-02/d012/pacote-d012/imagens/background001.jpg
diff --git a/desafios/modulo-02/d012/pacote-d012/imagens/background002.jpg b/desafios/modulo-02/d012/pacote-d012/imagens/background002.jpg
diff --git a/exercicios/modulo-03/ex022/fundo006.html b/exercicios/modulo-03/ex022/fundo006.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="pt-br">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Document</title>
+    <style>
+        body {
+            height: 100vh;
+        /*     
+            background-color: black;
+            background-image: url('imagens/wallpaper002.jpg');
+            background-position: center center;
+            background-repeat: no-repeat;
+            background-size: cover;
+            background-attachment: fixed; */
+
+            /* Shorthand - backgroung
+
+                color > image > position > repeat > [size] > attachment          
+
+            */
+            background: black url('imagens/wallpaper002.jpg') center center no-repeat cover fixed;
+        }
+        main {
+            background-color: white;
+            max-width: 400px;
+            padding: 10px;
+            margin: auto;
+            border: 1px solid darkblue;
+            border-radius: 15px;
+        }
+    </style>
+</head>
+<body>
+
+    <main>
+        <h1>Teste de imagem de fundo</h1>
+        <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. A, et quis? Modi quisquam, laudantium veritatis doloremque rerum adipisci ex perspiciatis itaque. Facere possimus necessitatibus corporis labore iusto cumque delectus. Incidunt. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Autem vero veniam sequi placeat, dolores dolore minus illo, dolorum, ad quisquam debitis cum recusandae porro nihil! Unde aut dignissimos hic ea. Lorem ipsum dolor sit amet consectetur adipisicing elit. Enim nulla, magnam repellendus, omnis blanditiis commodi voluptatum non ab sapiente inventore dolorem labore eveniet molestias ullam architecto dolor rem officiis unde. Lorem ipsum dolor sit amet consectetur adipisicing elit. Est, accusamus. Laboriosam quia voluptatem quam! Maiores dolorem aspernatur porro officiis dolor. Iure et labore, assumenda odio consectetur maiores odit debitis facere. Lorem, ipsum dolor sit amet consectetur adipisicing elit. Repellat ad ipsa iusto eaque autem modi, totam esse quas doloribus ab tempore ducimus quibusdam quo nisi ratione odio veritatis impedit eum? Lorem ipsum dolor sit amet consectetur adipisicing elit. Sunt, reiciendis fuga quasi libero molestiae quam at possimus maiores in quia ducimus natus ratione, doloribus esse nisi veniam est eius deleniti! Lorem ipsum dolor sit amet consectetur adipisicing elit. Cumque reiciendis ut itaque blanditiis tempora molestiae amet voluptate? Pariatur dolorem ex voluptatum tempora beatae rem dignissimos porro. Earum molestias aut soluta. Lorem ipsum dolor sit, amet consectetur adipisicing elit. Ex laboriosam non earum laborum excepturi iusto eius voluptatem ipsum doloremque quidem suscipit voluptatibus quos, consequuntur rerum odio libero, ipsa tempore placeat? Lorem ipsum dolor sit, amet consectetur adipisicing elit. Quaerat suscipit earum voluptatem autem tempora corrupti tenetur culpa a iure laborum officia atque voluptate fugit, quasi vitae ipsam laudantium? Veritatis, soluta. Lorem ipsum dolor sit amet consectetur, adipisicing elit. Exercitationem delectus nemo perferendis ex molestiae quae nobis modi necessitatibus eius sit magnam explicabo non voluptatibus facere, expedita quia? Culpa, atque consequatur. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Veritatis tempora accusantium quaerat error deleniti ducimus aliquam. Porro voluptas, consectetur placeat ratione iusto laboriosam, sit libero, nesciunt quis expedita magnam facere. Lorem ipsum dolor, sit amet consectetur adipisicing elit. Possimus, rem impedit ipsum assumenda magni quidem corporis! Illum dolore, debitis fuga doloribus reprehenderit temporibus nemo, vitae adipisci optio tenetur labore. Consequatur! Lorem ipsum dolor sit amet consectetur adipisicing elit. Repellendus molestias pariatur perspiciatis, maiores voluptas necessitatibus animi veniam magnam aut! Sequi consectetur quaerat necessitatibus obcaecati pariatur magni. Rerum dolorem quibusdam ad. Lorem ipsum, dolor sit amet consectetur adipisicing elit. Veritatis quis doloremque sint magnam minus nam nulla dolorem, velit natus consequuntur ea vero eaque! Ea culpa repellendus aut, id praesentium eum? Lorem ipsum dolor, sit amet consectetur adipisicing elit. Molestiae, voluptatibus? Excepturi maiores mollitia quae ipsa doloribus voluptas eos ipsam autem in! Similique deleniti illum doloremque at! Ad quos hic voluptatem!</p>
+    </main>
+
+</body>
+</html>
diff --git a/exercicios/modulo-03/ex022/fundo007.html b/exercicios/modulo-03/ex022/fundo007.html
@@ -0,0 +1,44 @@
+<!DOCTYPE html>
+<html lang="pt-br">
+<head>
+    <meta charset="UTF-8">
+    <meta http-equiv="X-UA-Compatible" content="IE=edge">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Alinhamento vertical</title>
+    <style>
+        #conteiner {
+            background-image: url(imagens-cap19/target001.png);
+            background-size: 100% 100%;
+            position: relative;
+            height: 500px;
+            background-color: purple;
+            padding: 10px;
+
+        }
+
+        #conteudo {
+            background-image: url(imagens-cap19/target001.png);
+            background-size: 100% 100%;
+            position: absolute;
+            height: 200px;
+            width: 400px;
+            background-color: yellow;
+
+            left: 50%;
+            top: 50%;
+
+            transform: translate(-50%, -50%);
+
+
+        }
+    </style>
+</head>
+<body>
+    <section id="conteiner">
+        <article id="conteudo">
+
+        </article>
+    </section>
+
+</body>
+</html>
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._pattern004.png b/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._pattern004.png
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper001.jpg b/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper001.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper002.jpg b/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper002.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper004.jpg b/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper004.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper005.jpg b/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper005.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper006.jpg b/exercicios/modulo-03/ex022/imagens-cap19/__MACOSX/._wallpaper006.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/pattern001.png b/exercicios/modulo-03/ex022/imagens-cap19/pattern001.png
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/pattern002.png b/exercicios/modulo-03/ex022/imagens-cap19/pattern002.png
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/pattern003.png b/exercicios/modulo-03/ex022/imagens-cap19/pattern003.png
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/pattern004.png b/exercicios/modulo-03/ex022/imagens-cap19/pattern004.png
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/target001.png b/exercicios/modulo-03/ex022/imagens-cap19/target001.png
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/wallpaper001.jpg b/exercicios/modulo-03/ex022/imagens-cap19/wallpaper001.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/wallpaper002.jpg b/exercicios/modulo-03/ex022/imagens-cap19/wallpaper002.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/wallpaper003.jpg b/exercicios/modulo-03/ex022/imagens-cap19/wallpaper003.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/wallpaper004.jpg b/exercicios/modulo-03/ex022/imagens-cap19/wallpaper004.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/wallpaper005.jpg b/exercicios/modulo-03/ex022/imagens-cap19/wallpaper005.jpg
diff --git a/exercicios/modulo-03/ex022/imagens-cap19/wallpaper006.jpg b/exercicios/modulo-03/ex022/imagens-cap19/wallpaper006.jpg