---
# System prepended metadata

title: Super Bônus | Web

---

# Super Bônus | Web
autor: Guilherme Oliveira Verissimo
turma: InfoC
número: 21

[toc]

# FAIXA 1
## Figma

> https://www.figma.com/
> https://fq9un.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>FIGMA</title>
  </head>
  <body>
    <div class="container-figma">
      <div class="imagens">
        <img src="figma-imagem.png.png">
      </div>

      <div class="textos">
        <div class="texto-1">
          Collaboration
        </div>
        <div class="texto-2">
          Team up to <br> move even <br> faster
        </div>
        <div class="texto-3">
          Share a link to your design files or prototypes, <br> and get feedback in context. Or, jump into the <br> same file with your teammates—no matter <br> where y’all are in the world—and co-edit live.
        </div>
        <div class="botao">
          <button> Work together </button>
        </div>
      </div>
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: a;
  src: url('1.woff2');
}

@font-face {
  font-family: b;
  src: url('2.woff2');
}

body {
  background-color: #ffc700;
}

.container-figma {
  justify-content: center;
  display: flex;
  flex-direction: row;
  margin-top: 96px;
}

img {
  width: 604px;
  height: 590px;
  padding-right: 37px;
}

.textos {
  padding-left: 37px;
}
.texto-1 {
  font-size: 22px;
  font-family: b;
}

.texto-2 {
  font-size: 64px;
  font-family: a;
  line-height: 64px;
  padding-top: 13px;
}

.texto-3 {
  font-size: 22px;
  font-family: b;
  padding-top: 55px;
  line-height: 30px;
}

button {
  font-size: 18px;
  padding: 10px 22px 10px 22px;
  background-color: #ffc700;
  border: 3px solid black;
  border-radius: 10px;
  font-family: a; 
  margin-top: 20px;
}
```

# FAIXA 2
## Figma Login

>https://www.figma.com/
>https://sy8ft.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>FIGMA LOGIN</title>
  </head>
  <body>
    <div class="container-figma">
      <div class="texto-1">
        Try Figma for free.
      </div>
      <button class="botao-sing">Sing up with Google</button>
      <div class="texto-2">
        or
      </div>
      <div class="input-email">
        <input placeholder="Email"/>  
      </div> 
      <div class="input-senha">
        <input placeholder="Password"/>
      </div> 
      <button class="botao-create">Create account</button>
      <div class="texto-3">
        Sign up with SAML SSO
      </div>
      <div class="texto-4">
        Already have an account? <span> Log in </span>
      </div>
      <div class="texto-5">
        This site is protected by reCAPTCHA and the Google <span> Privacy <br> Policy </span> and <span> Terms of Service </span> apply.
      </div>
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: a;
  src: url('3.woff2');
}

@font-face {
  font-family: b;
  src: url('4.woff2');
}

.container-figma {
  text-align: center;
}

.texto-1 {
  font-size: 36px;
  margin-bottom: 50px;
  margin-top: 60px;
  font-family: a;
  color: #282828
}

.texto-2 {
  margin-top: 20px;
  margin-bottom: 20px;
  font-family: b;
  color: #666666;
}

.botao-sing {
  font-family: a;
  color: black;
  font-size: 14px;
}

button {
  background-color: white;
  width: 358px;
  height: 48px;
  border: 3px solid black;
  border-radius: 8px;
}

.botao-create {
  margin-top: 45px;
  background-color: black;
  color: white;
  font-family: a;
  font-size: 18px;
}

.input-email {
  margin-bottom: 30px;
}

input {
  width: 335px;
  height: 45px;
  border: 3px solid black;
  background-color: white;
  border-radius: 6px;
  padding-left: 15px;
  font-family: b;
}

.texto-3 {
  margin-top: 34px;
  cursor: pointer;
  font-size: 12px;
  font-family: b;
  color: #5551ff;
}

.texto-4 {
  margin-top: 20px;
  font-size: 12px;
  font-family: b;
  color: #666666;
}

span {
  color: #5551ff;
}

.texto-5 {
  margin-top: 38px;
  font-size: 12px;
  font-family: b;
}
```

# FAIXA 3
## Udemy

>https://www.udemy.com/
>https://ne3ff.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>UDEMY</title>
  </head>
  <body>
    <div class="container-udemy">
      <div class="conteudo-top">
        <div class="imagem">
          <img src="u.jpg"/>
        </div>
          <div class="textos">
            <div class="texto-1">
              Torne-se um instrutor
            </div>
            <div class="texto-2">
              Os melhores instrutores do mundo lecionam a <br> milhões de alunos na Udemy. Oferecemos as <br>  ferramentas e habilidades para ensinar o que <br> você ama.
            </div>
            <button class="botao"> Comece a ensinar hoje mesmo </button> 
          </div>
      </div>

      <hr>

      <div class="conteudo-bottom">
        <div class="titulo">
          Ganhou a confiança de empresas de todos os tamanhos
        </div>
        <div class="imagens">
          <img src="https://s.udemycdn.com/partner-logos/booking-logo.svg"/>
          <img src="https://s.udemycdn.com/partner-logos/volkswagen-logo.svg"/>
          <div class="mercedes">
            <img src="https://s.udemycdn.com/partner-logos/mercedes-logo-v2.svg"/>
          </div>
          <img src="https://s.udemycdn.com/partner-logos/adidas-logo.svg"/>
          <img src="https://s.udemycdn.com/partner-logos/eventbrite-logo.svg"/>
        </div>
      </div>
      <hr>
    </div>
    </div>
  </body>
</html>
```

>index.css
```css=
.mercedes img {
  width: 148px;
  height: 28px;
  margin: 40px 5px 0px 20px;
}

.conteudo-top {
  justify-content: center;
  display: flex;
  flex-direction: row;
}

.imagem {
  margin-top: 35px;
}

.textos {
  margin-top: 125px;
  margin-left: 100px;
}

.texto-1 {
  font-size: 32px;
  color: #3c3b37;
  font-family: arial;
  font-weight: 600;
}

.texto-2 {
  font-size: 19px;
  color: #3c3b37;
  line-height: 27px;
  font-family: arial;
}

button {
  background-color: #0f7c90;
  border-radius: 4px;
  border: none;
  cursor: pointer;
  padding: 15px 12px;
  color: white;
  margin-top: 13px;
  font-family: arial black;
}

hr {
  margin-top: 40px;
  border-color: white;
}
.conteudo-bottom {
  align-items: center;
  display: flex;
  flex-direction: column;
}

.titulo {
  margin-top: 26px;
  color: #3c3b37;
  font-size: 24px;
  font-family: arial;
  font-weight: 600;
}

.imagens {
  display: flex;
  flex-direction: row;
}

.imagens > img {
  margin: 40px 20px 0px 20px;
}
```

# FAIXA 4
## TypingClub

>https://www.typingclub.com/
>https://h31ef.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>TypingClub</title>
  </head>
  <body>
    <div class="container-typing">
      <div class="imagem">
         <img src="https://static.typingclub.com/m/tpmedia/img/district.svg"/>
      </div>
      <div class="textos">
        <div class="texto-1">
          THE AMAZING 
        </div>
        <div class="texto-2">
          TypingClub School Edition
        </div>
        <div class="texto-3">
          TypingClub School Edition is the most powerful and popular software used <br> by teachers, schools and districts.
        </div>
        <button class="botao">Learn more</button>
      </div>
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: a;
  src: url('font (1).woff');
}

@font-face {
  font-family: b;
  src: url('font (1).woff2');

}

@font-face {
  font-family: c;
  src: url('font (2).woff2');
}

body {
  background-color: white;
}

.container-typing {
  display: flex;
  justify-content: center;
  flex-direction: row;
  margin-top: 150px;
  background-color: #262f36;
  padding: 100px 0;
}

.imagem {
  width: 240px;
  margin-right: 42px;
}

.textos {
  margin-left: 42px;
  color: rgba(255, 255, 255, 0.7);
}

.texto-1 {
  font-size: 13px;
  margin-bottom: 5px;
  margin-top: 10.5px;
  font-family: b;
  letter-spacing: 2px;
}

.texto-2 {
  font-size: 28px;
  margin-bottom: 10.5px;
  color: #ffffff;
  font-family: c;
  font-weight: 100;
}

.texto-3 {
  font-size: 19px;
  margin-bottom: 30px;
  font-family: c;
}

button {
  padding: 12px 50px;
  border: none;
  border-radius: 6px;
  font-size: 18px;
  font-family: c;
}
```

# FAIXA 5
## TypingClub 2

>https://www.typingclub.com/
>https://mocjl.csb.app/


>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>TypingClub</title>
  </head>
  <body>
    <div class="container-typing">
      <div class="imagem">
        <img src="typing.png"/>
      </div>
      <div class="textos">
        <div class="texto-1">
          WHAT IS TYPINGCLUB?
        </div>
        <div class="texto-2">
          TypingClub is the most effective <br> way to learn how to type.
        </div>
        <div class="texto-3">
          It is web based and highly effective. TypingClub is (and will <br> always be) free for both individuals and schools. There is an <br> optional paid school edition.
        </div>
        <div class="botao">
          <button> Get Started Now </button>
        </div>
      </div>
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: t;
  src: url('tfonte.woff2');
}

@font-face {
  font-family: tp;
  src: url('tpfonte.woff2');
}

.container-typing {
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 150px;
}

.imagem img {
  width: 500px;
  margin-right: 21px;
}

.textos {
  margin-top: 12px;
  margin-left: 21px;
}

.texto-1 {
  font-size: 13px;
  font-family: t;
  color: #bec8ce;
  font-weight: 600;
}

.texto-2 {
  font-size: 28px;
  line-height: 34px;
  margin-top: 5px;
  font-family: t;
  color: #2d3238;
  font-weight: 600;
}

.texto-3 {
  font-size: 18px;
  line-height: 29px;
  margin-top: 9px;
  font-family: t;
  color: #6c6f73;
}

button {
  font-size: 16px;
  padding: 6px 12px;
  background-color: #007cf1;
  border: 1px solid #0069cd;
  border-radius: 4px;
  margin-top: 21px;
  font-family: t;
  color: white;
}
```

# FAIXA 6
## AboutTwitter
### Meu site da prova!!!

>https://about.twitter.com/
>https://okf7d.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>About Twitter</title>
  </head>
  <body>
    <div class="container-twitter">
      
      <div class="cabeçalho">
        <div class="logo">
          <img src="logo.PNG">
        </div>
        <div class="links">
          <div class="menu-links">
            Who we are &#709;
          </div>
          <div class="menu-links">
            Our priorities &#709;
          </div>
          <div class="menu-links">
            Resources &#709;
          </div>
          <div class="menu-button">
            <button>Go to Twitter.com</button>
          </div>
        </div>
      </div>

      <div class="conteudo">
        <div class="texto">
            Twitter is what’s <p> happening and what <p> people are talking about <p> right now.
        </div>
        <div class="conteudo-button">
          <button><b>Go to Twitter.com</b></button>
        </div>
      </div>
    </div>
    
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: a;
  src: url('chirp-extended-heavy-web.woff2');
}

body {
  background-image: url("fundo.PNG")
}

.container-twitter {
  display: flex;
  flex-direction: column;
}

.cabeçalho {
  justify-content: space-between;
  display: flex;
  flex-direction: row;
}

.links {
  display: flex;
  flex-direction: row;
  margin-right: 20px;
}

.logo {
  margin: 30px 20px 20px 34px;
}

.menu-links {
  margin: 40px 20px 20px 20px;
  font-size: 13.92px;
  color: #314351;
  font-family: arial;
}

.menu-button button {
  font-size: 14px;
  border-radius: 30px;
  background-color: white;
  color: #14171A;
  padding: 16px 18px;
  margin: 24px 20px 20px 20px;
  border: 2px solid #E8EFF3;
}


/*parte do "conteudo"*/

.texto {
  font-size: 64px;
  line-height: 10px;
  margin: 190px 20px 20px 190px;
  font-family: a;
}

.conteudo-button button {
  font-size: 18px;
  margin-left: 190px;
  border-radius: 30px;
  background-color: #14171A;
  color: white;
  padding: 16px 24px;
  border: none;
}
```

# FAIXA 7
## Angular

>https://angular.io/
>https://fhcsj.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>Angular</title>
  </head>
  <body>
    <div class="container-angular">
      <div class="top">
        <div class="textos">
          <div class="texto-1">
            LOVED BY MILLIONS
          </div>
          <div class="texto-2">
            From prototype through global deployment, Angular <br> delivers the productivity and scalable infrastructure <br> that supports Google's largest applications.
          </div>
        </div>
          <div class="imagem-1">
            <img src="https://angular.io/generated/images/marketing/home/loved-by-millions.svg"/>
          </div>
      </div>

      <div class="bottom">
        <div class="imagem-2">
          <img src="https://angular.io/generated/images/marketing/home/code-icon.svg"/>
        </div>
        <div class="textos-1">
          <div class="texto-3">
            TRY IT NOW
          </div>
          <div class="texto-4">
            Explore Angular's capabilities with a ready-made <br> sample app. No setup required.
          </div>
        </div>
      </div>
        
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: a;
  src: url('angular (1).woff2');
}

@font-face {
  font-family: b;
  src: url('angular (2).woff2');
}

@font-face {
  font-family: c;
  src: url('angular.woff2');
}

.container-angular {
  display: flex;
  flex-direction: column;
  align-items: center;
  margin-top: 130px;
}

.top{
  display: flex;
  flex-direction: row;
}

.textos {
  display: flex;
  flex-direction: column;
  margin-top: 30px;
  margin-right: 45px;
}

.texto-1 {
  font-size: 20px;
  color: #1976d2;
  font-family: b;
}

.texto-2 {
  margin-top: 28px;
  line-height: 32px;
  font-size: 16px;
  font-family: b;
  color: #444444;
}

.imagem-1 img {
  width: 409px;
  margin-left: 45px;
}

.bottom {
  display: flex;
  flex-direction: row;
  margin-top: 35px;
  box-shadow: 2px 2px 8px grey;
  width: 520px;
  height: 165px;
}

.imagem-2 img {
 width: 70px;
 margin-right: 19px;
 margin-left: 45px;
 margin-top: 49px;
}

.textos-1 {
  margin-left: 19px;
  margin-top: 35px;
}

.texto-3 {
  font-size: 20px;
  color: #1976d2;
  font-family: b;
}

.texto-4 {
  font-size: 16px;
  line-height: 32px;
  margin-top: 13px;
  font-family: b;
  color: #444444;
}
```

# FAIXA 8
## Mysql

>https://www.mysql.com/
>https://xmukw.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>MYSQL</title>
  </head>
  <body>
    <div class="container-mysql">
      <div class="esquerda">
        <div class="box">
          <div class="imagem">
            <img src="nuvem.PNG"/>
          </div>
          <div class="textos">
            <div class="texto-1">
              MySQL Database Service with HeatWave
            </div>
            <div class="texto-2">
              MySQL Database Service is a fully managed database service to deploy cloud-native <br> applications. HeatWave, an integrated, high-performance analytics engine accelerates <br> MySQL performance by 400x.
            </div>
            <div class="texto-3">
              Learn More
            </div>
          </div>

        </div>
        <div class="box">
          <div class="imagem">
            <img src="quadrado.PNG"/>
          </div>
          <div class="textos">
            <div class="texto-1">
              MySQL for OEM/ISV
            </div>
            <div class="texto-2">
              Over 2000 ISVs, OEMs, and VARs rely on MySQL as their products' embedded database to <br> make their applications, hardware and appliances more competitive, bring them to <br> market faster, and lower their cost of goods sold.
            </div>
            <div class="texto-3">
              Learn More
            </div>
          </div>
    
        </div>
      </div>

      <div class="direita">
        <div class="box">
          <div class="imagem-enterprise">
            <img src="cilindro.PNG"/>
          </div>
          <div class="textos">
            <div class="texto-1">
              MySQL Enterprise Edition
            </div>
            <div class="texto-2">
              The most comprehensive set of advanced features, management tools and technical <br> support to achieve the highest levels of MySQL scalability, security, reliability, and uptime.
            </div>
            <div class="texto-3">
              Learn More
            </div>
          </div>
      
        </div>
        <div class="box">
          <div class="imagem">
            <img src="circulo.PNG"/>
          </div>
          <div class="textos">
            <div class="texto-1">
              MySQL Cluster CGE
            </div>
            <div class="texto-2">
              MySQL Cluster enables users to meet the database challenges of next generation web, <br> cloud, and communications services with uncompromising scalability, uptime and agility.
            </div>
            <div class="texto-3">
              Learn More
            </div>
          </div>
    
        </div>
      </div>
    
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: a;
  src: url('mysql1.woff');
}

@font-face {
  font-family: b;
  src: url('mysql2.woff');
}

@font-face {
  font-family: c;
  src: url('mysql3.woff');
}

.container-mysql {
  display: flex;
  flex-direction: row;
  margin-top: 230px;
  justify-content: center;
}

img {
  width: 75px;
  margin-top: 20px;
}

.imagem-enterprise img {
  width: 60px;
  margin-right: 7px;
  margin-left: 8px;
}

.esquerda {
  margin-right: 20px;
}

.direita {
  margin-left: 20px;
}

.box {
  display: flex;
  flex-direction: row;
  margin-bottom: 50px;
}

.textos {
  margin-left: 35px;
}

.texto-1 {
  font-size: 19px;
  cursor: pointer;
  margin-bottom: 16px;
  color: #e97b00;
  font-family: b;
}

.texto-2 {
  font-size: 14px;
  margin-bottom: 7px;
  color: #555555;
  line-height: 23px;
  font-family: b;
}

.texto-3 {
  font-size: 14px;
  color: #0074a3;
  cursor: pointer;
  font-family: b;
}
```

# FAIXA 9
## Azure

>https://azure.microsoft.com/pt-br/
>https://18udj.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>Azure</title>
  </head>
  <body>
    <div class="container-azure">
      <div class="box">
        <div class="textos">
          <div class="texto-1">
              A Sociedade Americana contra o Câncer manteve o fluxo de <br> recursos para pacientes e pesquisadores durante a pandemia <br> global fazendo a transição da infraestrutura dela para o Azure.
          </div>
          <div class="texto-2">
            <span> Estudo de caso <span> ﹥ 
          </div>
      
        </div>
      </div>
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: a;
  src: url('latest.woff2');
}

body {
  background-image: url("azure.jpg");
  background-repeat: no-repeat;
  background-size: 1600px 585px;
  background-position: 5px 90px;
}

.box {
  color: white;
  margin-left: 150px;
  margin-top: 450px;
  background-color: rgba(26,26,31,.94);
  width: 600px;
  padding: 25px 10px 22px 22px;
  border-radius: 7px;
}

.texto-1 {
  font-size: 20px;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}

.texto-2 {
  font-size: 14px;
  margin-top: 25px;
  text-decoration: underline;
  font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida Grande', 'Lucida Sans', Arial, sans-serif;
}
```

# FAIXA 10
## Amazon

>https://aws.amazon.com/pt/
>https://ylkdq.csb.app/

>index.html
```htmlmixed=
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <link rel="stylesheet" href="index.css">
    <title>AMAZON</title>
  </head>
  <body>
    <div class="container-amazon">
      <div class="textos-top">
        <div class="texto-1">
          Soluções de nuvem híbrida da AWS
        </div>
        <div class="texto-2">
          Experiência consistente em toda a AWS e nos ambientes on-premises
        </div>
      </div>
      <div class="textos-bottom">
        <div class="textos-esquerda">
          <div class="imagem-esquerda">
            <img src="1.png">
          </div>
          <div class="texto-3">
            WMware Cloud on AWS
          </div>
          <div class="texto-4">
            Migre e amplie ambientes WMware para a Nuvem AWS
          </div>
          <div class="texto-5">
            Saiba mais
          </div>
        </div>

        <div class="textos-direita">
            <div class="imagem-direita">
              <img src="2.png">
            </div>
            <div class="texto-3">
              AWS Outposts
            </div>
            <div class="texto-4">
              Execute a infraestrutura da AWS on-premises para ter uma <br> experiência híbrida verdadeiramente consistente 
            </div>
            <div class="texto-5">
              Saiba mais
            </div>
        </div>
      </div>
    </div>
  </body>
</html>
```

>index.css
```css=
@font-face {
  font-family: lt;
  src: url('Lt.woff2');
}

@font-face {
  font-family: bd;
  src: url('Bd.woff2');
}

@font-face {
  font-family: rg;
  src: url('Rg.woff2');
}

body {
  background-image: url("fundo.png.png");
  background-repeat: no-repeat;
  background-size: 1595px 380px;
  background-position: 5px 170px;
}

.container-amazon {
  text-align: center;
  margin-top: 220px;
  color: white;
}


.texto-1 {
  font-size: 36px;
  font-family: rg;
  cursor: pointer;
}

.texto-2 {
  font-size: 20px;
  margin-top: 17px;
  font-family: lt;
}

.textos-bottom {
  cursor: pointer;
  display: flex;
  flex-direction: row;
  justify-content: center;
  margin-top: 35px;
}

.texto-3 {
  font-size: 20px;
  font-family: bd;
}

.texto-4 {
  font-size: 16px;
  padding-left: 70px;
  padding-right: 70px;
  margin-top: 20px;
  font-family: lt;
}

.texto-5 {
  font-size: 15px;
  margin-top: 13px;
  font-family: rg;
}
```