Thamiris Morais Ferreira Rocha

Engenharia de Software |

Programação | Desenvolvimento Front-end | Back-End

Banco de dados Sql

            <h2 class="apresentacao__links__subtitulo">Acesse minhas redes: </h2>
                <a class="apresentacao__links__link" href="https://github.com/thamyFerreira0101">
                    <img src="assests/github.png" alt="icone do github"/>
                    GitHub</a>
                <a class="apresentacao__links__link" href="https://www.linkedin.com/in/thamirisferreira">
                    <img src="assests/linkedin.png" alt="icone do linkedin"/>
                    LinkedIn</a>
            </div>
        </div>
    </section>

    <div class="imagem">
        <img src="assests/imagen.jpg" alt="minha selfie">
    </div>
</main>

<footer class="rodape">
    <p>Desenvolvido em parceria com Alura</p>
</footer>


@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:wght@400;600&display=swap');

*{
    margin: 0;
    padding: 0;
}

body{
    box-sizing: border-box;
    background-color: #000000;
    color:white
}

.cabecalho{
    padding: 1% 0% 0% 15%;
}

.cabecalho__menu{
    display: flex;
    gap: 80px;
}

.cabecalho__menu__link{
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 600;
    color: #22D4FD;
    text-decoration: none;
}

.apresentacao{
    padding: 5% 15%;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.apresentacao__conteudo__superior__texto{
    font-size: 24px;
    font-family: "Montserrat", serif; 
    margin-bottom: 20px;
}

.apresentacao__conteudo__texto{
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 550px;
    width: 615px ;
    display: flex;
    flex-direction: column;
    gap: 40px;
}

.apresentacao__conteudo__nome{
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 600px;
    color: aquamarine;
    margin-bottom: 20px;
}

.apresentaxao__links__subtitulo{
    font-family: 'Krona One', 'sans-serif';
    font-weight: 400;
    font-size: 24px;
    margin-top: 10px;

}
.apresentacao__links__subtitulo{
    margin-top: 10px;
}

.apresentacao__links__link {
    display: inline-block;  /* posicionando elementos */
    justify-content: center; /* posicionando elementos */
    gap: 16px; /* posicionando elementos */
    border: 2px solid #22D4FD;
    width: 280px;
    text-align: center;
    border-radius: 8px;
    font-size: 24px;
    font-weight: 600;
    padding: 21.5px 0;
    text-decoration: none;
    color: #f6f6f6;
    font-family: 'Montserrat', sans-serif;
    margin: 20px 15px 15px 20px; /* topo, direita, fundo, esquerda */

}

.apresentacao__links__link:hover{
    display: inline-block; /* Para garantir que o padding e o background funcionem corretamente */
    padding: 10px 20px; /* Adicione algum espaço interno */
    background-color: #272727; /* Muda a cor de fundo do elemento */
    color: yellow;     
    border: 4px solid;
}

.imagem{
    flex:1;
    text-align: center;
}

.imagem img{
    border-radius: 50%; /* Imagem circular */
    box-shadow: 0 0 10px rgba(0,0,0,0.5); /* Adiciona uma sombra */
}

.rodape{
    padding: 24px;
    color: #000000;
    background-color:#333;
    text-align: center;
    font-family: 'Montserrat', sans-serif;
    font-size: 24px;
    font-weight: 400;
}

/* Sobre mim */
.conteudo__sobre__mim {
    display: flex;
    gap: 40px;
    flex-direction: column;
    padding: 5% 0% 0% 10%;
    width: 615;
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
}

.texto-imagem{
    display: flex;
}

.texto{
    flex: 1;
}

.conteudo__sobre__mim__titulo{
    display: flex;
}

.p{
    font-size: 24px;
    font-family: 'Montserrat', sans-serif;
    font-weight: 400;
    margin-bottom: 20px;
}

.imagem__img{
    flex:1;
    text-align: center;
    width: 250px;
    height: auto;
    margin: 0;
    padding: 0;
    align-items: center;
    
}

.imagem__img img{
    border-top-left-radius: 20px; /* Arredonda o canto superior esquerdo */
    border-top-right-radius: 10px; /*Arredonda o canto superior direito */
    border-bottom-left-radius: 15px; /*Arredonda o canto inferior esquerdo */
    border-bottom-right-radius: 5px;
    box-shadow: 1px 1px 10px 5px #22D4FD; /* Adiciona uma sombra */
    height: auto;
    margin-right: 15px;
    padding-right: 10px;
    display: flex;
    text-align: center;
    width: auto;
}

/* Curriculo */

.apresentacao__conteudo__titulo{
    display: flex;
    font-family: 'Montserrat', sans-serif;
    font-size: 20px;
    font-weight: 550px;
    width: 615px ;
    flex-direction: column;
    gap: 40px;
    color: aqua;
    margin-bottom: 20px;
    margin-top: 20px;

}
.apresentacao__conteudo__titulo__curriculo{
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    font-weight: 550px;
    width: 615px ;
    color: cyan;
}
.apresentacao__conteudo__texto{
    font-family: 'Montserrat', sans-serif;
    font-size: 15px;
    font-weight: 550px;
}
.apresentacao__conteudo__texto a{
    text-decoration: none;
    color: #22D4FD;
}

#selfie img{
    border-top-left-radius: 20px; /* Arredonda o canto superior esquerdo */
    border-top-right-radius: 10px; /*Arredonda o canto superior direito */
    border-bottom-left-radius: 15px; /*Arredonda o canto inferior esquerdo */
    border-bottom-right-radius: 5px;
    box-shadow: 1px 1px 10px 5px #22D4FD; /* Adiciona uma sombra */
    box-shadow: 1px 1px 10px 5px #22D4FD; /* Adiciona uma sombra */
}