# SESSION ONE | LINGUAGEM DE PROGRAMÇÃO
Murillo Tadeu Oliveira | N° - 33
## RECOMEÇAR
# Faixa 1
### Script HTML
````html=
<!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="../comum/comum.css">
<link rel="stylesheet" href="index.css">
<title>Home | Moonchain Capital</title>
</head>
<body>
<div class="container-site">
<div class="faixa-1">
<div class="f1-cabecalho">
<div class="f1-logo">
<img src="../../assets/images/logo.webp">
<div>Moonchain Capital</div>
</div>
<div class="f1-menu">
<div class="f1-menu-item"> Home </div>
<div class="f1-menu-item"> Services </div>
<div class="f1-menu-item"> FAQ </div>
<div class="f1-menu-item"> Contacts </div>
<div class="f1-menu-item"> Subscribe </div>
<div class="f1-menu-item"> <img src="../../assets/images/Facebook.webp"> </div>
<div class="f1-menu-item"> <img src="../../assets/images/Twitter.webp"> </div>
<div class="f1-menu-item"> <img src="../../assets/images/LinkedIn.webp"> </div>
</div>
</div>
<div class="f1-conteudo">
<div class="f1-conteudo-textos">
<div class="f1-conteudo-titulo"> Cryptocurrency Consulting Services </div>
<div class="f1-conteudo-descricao"> I'm a paragraph. Click here to add your own text and edit me. Let your users get to know you. </div>
<div class="f1-conteudo-botao"> <a href="#"> See our Services </a> </div>
</div>
<div class="f1-conteudo-imagem">
<img src="../../assets/images/mineracaodados.webp">
</div>
</div>
</div>
</div>
</body>
</html>
````
### Script CSS
```html=
.container-site {
display: flex;
flex-direction: column;
font-family: Font3;
font-size: 14px;
}
.faixa-1 {
display: flex;
flex-direction: column;
padding: 30px 70px 150px 70px;
}
.f1-cabecalho {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
}
.f1-logo {
display: flex;
flex-direction: row;
align-items: center;
}
.f1-logo div {
font: 22px Font1;
}
.f1-logo img {
height: 80px;
width: 80px;
margin-right: 10px;
}
.f1-menu {
display: flex;
flex-direction: row;
align-items: center;
}
.f1-menu-item {
padding: 10px;
cursor: pointer;
}
.f1-menu-item img {
width: 20px;
height: 20px;
}
.f1-conteudo {
display: flex;
flex-direction: row;
justify-content: space-between;
align-items: center;
margin: 0px 40px 0px 100px;
}
.f1-conteudo-textos {
width: 500px;
}
.f1-conteudo-titulo {
font: 50px Font1;
color: #842AE3;
line-height: 70px;
}
.f1-conteudo-descricao {
font-size: 18px;
line-height: 30px;
margin: 40px 0px 60px 0px;
}
.f1-conteudo-botao a{
color:white;
padding: 15px 20px;
border-radius: 25px;
background-color: #842AE3;
cursor: pointer;
}
a:hover {
background-color: #b074ec;
transition: 0.3s;
}
.f1-conteudo-imagem img {
width: auto;
height: 740px;
}
````
### Comum CSS
```html=
@font-face {
font-family: Font1;
src: url(../../assets/font/Font1.woff2);
}
@font-face {
font-family: Font2;
src: url(../../assets/font/Font2.woff2);
}
@font-face {
font-family: Font3;
src: url(../../assets/font/Font3.woff);
}
@font-face {
font-family: Font4;
src: url(../../assets/font/font4.woff2);
}
````
# Faixa 2
### Script HTML
````html=
<div class="faixa-2">
<div class="bloco">
<div class="f2-titulo">Cryptocurrency Consulting Services</div>
<div class="f2-conteudo">I'm a paragraph. Click here to add your own text and edit <br>me. Let your users get to know you.</div>
<div class="f2-botao"><a head="a">See Our Services</div>
</div>
<div class="bloco-1"><img src = "https://static.wixstatic.com/media/82fcd3_7b36b3badf9f4baea4277340386e3de1~mv2.png/v1/fill/w_552,h_740,fp_0.50_0.50,q_90,usm_0.66_1.00_0.01/82fcd3_7b36b3badf9f4baea4277340386e3de1~mv2.webp"/></div>
</div>
</div>
````
### Script CSS
```html=
.faixa-2{
display: flex;
flex-direction: row;
padding: 20px;
}
.bloco{
padding-top: 150px;
padding-right: 80px;
padding-left: 10px;
}
.f2-titulo{
font-size: 50px;
font-family: Font1;
color: #842ae3;
padding: 20px;
font-weight: bold;
padding-top: 45px;
}
.f2-conteudo{
font-size: 18px;
padding: 60px 20px;
font-family: Font3;
}
.bloco-9{
padding-top: 30px;
}
.f2-botao{
font-size: 14px;
background: #842ae3;
padding-top: 10px;
padding-left: 10px;
padding-right: 10px;
text-align: center;
color: #ffff;
border-radius: 25px;
border-bottom: 10px;
width: 120px;
}
.f2-botao button{
background-color: #842ae3;
}
.bloco-1 img{
width: 500px;
height: 750px;
}
````
# Faixa 3
### Script HTML
````html=
<div class="container-3">
<div class="faixa-3">
<div class="f3-titulo">Our Services</div>
</div>
````
### Script CSS
```html=
.container-3{
background: #f2f2f2;
padding-top: 40px;
padding-left: 100px;
padding-right: 100px;
padding: 0px 0px 100px;
}
.faixa-3{
}
.f3-titulo{
text-align: center;
font-size: 28px;
font-family: Font2;
color: #842ae3;
padding: 100px;
}
````
# Faixa 4
### Script HTML
````html=
<div class="faixa-4">
<div class = "bloco-2">
<div class = "f4-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_d6357967f3b3482b839c55056e4af4e0~mv2.png/v1/fill/w_60,h_60,al_c,q_85,usm_0.66_1.00_0.01/82fcd3_d6357967f3b3482b839c55056e4af4e0~mv2.webp"/></div>
<div class = "f4-titulo">Coin Acquisition</div>
<div class = "f4-conteudo">I'm a paragraph. Click here to add your own text and edit me. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
<div class = "bloco-2">
<div class = "f4-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_cfc5ddcc780a4051b9030c86450120fd~mv2.png/v1/fill/w_60,h_60,al_c,q_85,usm_0.66_1.00_0.01/82fcd3_cfc5ddcc780a4051b9030c86450120fd~mv2.webp"/></div>
<div class = "f4-titulo">Currency Mining</div>
<div class = "f4-conteudo">I'm a paragraph. Click here to add your own text and edit me. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
<div class = "bloco-2">
<div class = "f4-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_71bbc54fbb994059afcc2ccc7c1fbef0~mv2.png/v1/fill/w_60,h_60,al_c,q_85,usm_0.66_1.00_0.01/82fcd3_71bbc54fbb994059afcc2ccc7c1fbef0~mv2.webp"/></div>
<div class = "f4-titulo">Initial Coin Offerings</div>
<div class = "f4-conteudo">I'm a paragraph. Click here to add your own text and edit me. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
</div>
<div class="faixa-9">
<div class = "bloco-2">
<div class = "f4-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_134c13e1731a47e7836d24827fbe4340~mv2.png/v1/fill/w_60,h_60,al_c,q_85,usm_0.66_1.00_0.01/82fcd3_134c13e1731a47e7836d24827fbe4340~mv2.webp"/></div>
<div class = "f4-titulo">Exchanges</div>
<div class = "f4-conteudo">I'm a paragraph. Click here to add your own text and edit me. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
<div class = "bloco-2">
<div class = "f4-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_e59963db04bc48f88e84ad8b20d6b25b~mv2.png/v1/fill/w_60,h_60,al_c,q_85,usm_0.66_1.00_0.01/82fcd3_e59963db04bc48f88e84ad8b20d6b25b~mv2.webp"/></div>
<div class = "f4-titulo">Blockchain Tech</div>
<div class = "f4-conteudo">I'm a paragraph. Click here to add your own text and edit me. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
<div class = "bloco-2">
<div class = "f4-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_328b0186428c457593d421e9cac07d23~mv2.png/v1/fill/w_40,h_40,al_c,q_85,usm_0.66_1.00_0.01/82fcd3_328b0186428c457593d421e9cac07d23~mv2.webp"/></div>
<div class = "f4-titulo">Storing Your Coins</div>
<div class = "f4-conteudo">I'm a paragraph. Click here to add your own text and edit me. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
</div>
<div class="bloco-9">
<div class = "botao-2">Contact us Today</div>
</div>
</div>
````
### Script CSS
```html=
.faixa-4{
display: flex;
flex-direction: row;
text-align: center;
text-justify: auto;
}
.bloco-2{
display: flex;
flex-direction: column;
padding-left: 30px;
padding-right: 30px;
}
.f4-imagem{
}
.f4-titulo{
font-family: Font3;
font-size: 20px;
color: #842ae3;
padding-top: 40px;
}
.f4-conteudo{
font-family: Font3;
font-size: 14px;
padding-top: 40px;
}
.faixa-9{
display: flex;
flex-direction: row;
text-align: center;
padding: 10px 20px 20px;
}
.bloco-9{
padding-left: 580px;
padding-right: 500px;
padding-top: 100px;
}
.botao-2{
text-align: center;
font-size: 14px;
font-family: Font3;
background: #842ae3;
color: #ffff;
border-radius: 25px;
width: 150px;
height: 30px;
text-align: center;
}
````
# Faixa 5
### Script HTML
````html=
div class="container-1">
<div class = "faixa-5">
<div class = "f5-titulo">About Moonchain</div>
<div class = "f5-subtitulo">Strategic Crypto Consultants Since 2015</div>
<div class = "f5-conteudo">I'm a paragraph. Click here to add your own text and edit me. It’s easy. Just click “Edit Text” or double click me to add your own content and make changes to the font. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
````
### Script CSS
```html=
.faixa-5{
}
.f5-titulo{
font-family: Font1;
font-size: 40px;
color: #842ae3;
text-align: center;
}
.f5-subtitulo{
font-family: Font3;
font-size: 18px;
text-align: center;
padding-top: 30px;
}
.f5-conteudo{
font-family: Font3;
font-size: 15px;
text-align: center;
padding-top: 30px;
}
````
# Faixa 6
### Script HTML
````html=
<div class = "faixa-6">
<div class = "bloco-3">
<div class = "f6-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_a724a50cbde14d1f9fa961ebf2724b77~mv2_d_1784_1920_s_2.jpg/v1/fill/w_341,h_540,fp_0.46_0.23,q_80,usm_0.66_1.00_0.01/82fcd3_a724a50cbde14d1f9fa961ebf2724b77~mv2_d_1784_1920_s_2.webp"/></div>
<div class = "f6-titulo">Jordan Foster</div>
<div class = "f6-conteudo">I'm a paragraph. Click here to add your own text and edit me. Let your users get to know you.</div>
</div>
<div class = "bloco-3">
<div class = "f6-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_cf7d46e5d21a43d0aeeb64ebb67d772e~mv2_d_1784_1920_s_2.jpg/v1/fill/w_341,h_540,fp_0.48_0.23,q_80,usm_0.66_1.00_0.01/82fcd3_cf7d46e5d21a43d0aeeb64ebb67d772e~mv2_d_1784_1920_s_2.webp"/></div>
<div class = "f6-titulo">Jesse Dunn</div>
<div class = "f6-conteudo">I'm a paragraph. Click here to add your own text and edit me. Let your users get to know you.</div>
</div>
<div class = "bloco-3">
<div class = "f6-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_92d2897de085402d902fbec9bdecf75a~mv2_d_1784_1920_s_2.jpg/v1/fill/w_341,h_540,fp_0.46_0.24,q_80,usm_0.66_1.00_0.01/82fcd3_92d2897de085402d902fbec9bdecf75a~mv2_d_1784_1920_s_2.webp"/></div>
<div class = "f6-titulo">Calvin Wang</div>
<div class = "f6-conteudo">I'm a paragraph. Click here to add your own text and edit me. Let your users get to know you.</div>
</div>
</div>
</div>
````
### Script CSS
```html=
.faixa-6{
display: flex;
flex-direction: row;
padding-top: 90px;
}
.bloco-3{
padding-left: 30px;
padding-right: 30px;
}
.f6-imagem{
}
.f6-titulo{
font-size: 18px;
font-family: Font2;
color: #842ae3;
text-align: center;
padding-top: 35px;
}
.f6-conteudo{
font-size: 14px;
font-family: Font3;
text-align: center;
padding-top: 35px;
padding: 0px 0px 90px;
}
.container-2{
background: #00ffcc;
}
````
# Faixa 7
### Script HTML
````html=
<div class = "container-2">
<div class="faixa-7">
<div class="f7-imagem"><img src = "https://static.wixstatic.com/media/82fcd3_508cb068659c4e2db53302d7f5317cd6~mv2.png/v1/fill/w_27,h_20,al_c,q_85,usm_0.66_1.00_0.01/82fcd3_508cb068659c4e2db53302d7f5317cd6~mv2.webp"/></div>
<div class="f7-descricao">“I'm a testimonial. Click to edit me and add text that says something nice about you and your services. Let your customers review you and tell their friends how great you are.”</div>
<div class="f7-autor">Rodger Horrell | CPT</div>
</div>
</div>
````
### Script CSS
```html=
.container-2{
background: #00ffcc;
}
.faixa-7{
text-align: center;
padding-top: 140px;
padding-left: 140px;
padding-right: 140px;
padding: 120px 0px 120px;
}
.f7-imagem{
}
.f7-descricao{
font-size: 14px;
font-family: Font3;
padding-top: 40px;
}
.f7-autor{
font-size: 15px;
font-family: Font3;
padding-top: 20px;
}
.conteiner-3{
}
````
# Faixa 8
### Script HTML
````html=
<div class="container-3">
<div class="faixa-8">
<div class="f8-titulo">FAQ</div>
<div class="f8-descricao">Below we’ve provided some info on how we work, blockchain technology, Bitcoin, and cryptocurrencies in general.</div>
<div class="f8-subtitulo">How do I buy cryptocurrency in my country?</div>
<div class="f8-descricao2">I'm a paragraph. Click here to add your own text and edit me. It’s easy. Just click “Edit Text” or double click me to add your own content and make changes to the font. I’m a great place for you to tell a story and let your users know a little more about you.</div>
<div class="f8-subtitulo">Do I have to pay taxes on any profits I make from Bitcoin?</div>
<div class="f8-descricao2">I'm a paragraph. Click here to add your own text and edit me. It’s easy. Just click “Edit Text” or double click me to add your own content and make changes to the font. I’m a great place for you to tell a story and let your users know a little more about you.</div>
<div class="f8-subtitulo">Is it possible to create my own cryptocurrency?</div>
<div class="f8-descricao2">I'm a paragraph. Click here to add your own text and edit me. It’s easy. Just click “Edit Text” or double click me to add your own content and make changes to the font. I’m a great place for you to tell a story and let your users know a little more about you.</div>
</div>
</div>
````
### Script CSS
```html=
.conteiner-3{
}
.faixa-8{
padding-left: 150px;
padding-right: 150px;
}
.f8-titulo{
padding-top: 30px;
font-size: 50px;
font-family: Font2;
color: #842ae3;
padding-top: 80px;
text-align: center;
padding-left: 200px;
padding-right: 200px;
}
.f8-descricao{
font-size: 18px;
font-family: Font3;
text-align: center;
padding-top: 60px;
}
.f8-subtitulo{
font-size: 22px;
font-family: Font2;
color: #842ae3;
padding-top: 180px;
}
.f8-descricao2{
font-size: 14px;
font-family: Font3;
padding-top: 50px;
}
````
{"metaMigratedAt":"2023-06-16T02:52:23.890Z","metaMigratedFrom":"Content","title":"SESSION ONE | LINGUAGEM DE PROGRAMÇÃO","breaks":true,"contributors":"[{\"id\":\"ddf4ea40-fb01-4dc1-b147-92a7051a20c0\",\"add\":15907,\"del\":16}]"}