Black November

ATÉ 50% OFF

TÁ ACABANDO!

0 dias

0 horas

0 min

0 seg

Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

Projeto Portifolio My Wife

<!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>Portifolio Profissional</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
    <header></header>
    <main class="apresentacao">
        <section class="apresentacao_conteudo">
            <h1 class="apresentacao_conteudo_titulo"><strong class="titulo_destaque ">Ruth Freire Euzebio de Oliveira</strong></h1>
            <p class="apresentacao_conteudo_texto">A Enfermagem, para mim, não é apenas uma profissão, é uma vocação. É o ato de cuidar que vai 
                além dos procedimentos técnicos; é o toque que acalma, a palavra que conforta e a presença que 
                faz a diferença nos momentos mais delicados da vida. Acredito no cuidado humanizado, baseado em evidências científicas e na empatia, 
                para promover a saúde e o bem-estar integral dos meus 
                pacientes e suas famílias.</p>
                <div class="social_buttons">
                    <a class="button_icons" href="https://www.instagram.com/rutynha20">Instagram</a>
                    <a class="button_icons" href="http://lattes.cnpq.br/9780200504074015">Currículo Lattes</a>
                </div>
        </section>
        <img src="IMG_1112.jpg" alt="foto ruth na cachoeira">
    </main>
    <footer></footer>
    
</body>
</html>
@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:wght@400;600&display=swap');

*{
    margin: 0;
    padding: 0;
}

body{
    height: 100vh;
    box-sizing: border-box;
    background-color: #777C6D;
    color: #000000;
}

.titulo_destaque{
    color: #000000;
}

.apresentacao {
    margin: 10% 15%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 50px;
}

.apresentacao_conteudo {
    width: 615px;
    display: flex;
    flex-direction: column;
    gap: 40px;
}


.apresentacao_conteudo_titulo{
    font-size: 36px;
    font-family: 'Krona One', sans-serif;
    }

.apresentacao_conteudo_texto{
    font-size: 24px;
    font-family: 'Montserrat', sans-serif;
    line-height: 1.5;
}

.social_buttons{
    display: flex;
    justify-content: space-between;
    gap: 20px;
}

.button_icons{
    background-color: #CBCBCB;
    width: 280px;
    text-align: center;
    border-radius: 16px;
    font-size: 24px;
    font-weight: 600;
    padding: 21.5px 0;
    text-decoration: none;
    color: #000000;
    font-family: 'Montserrat', sans-serif;
    transition: 0.3s;
}

.button_icons:hover {
    background-color: #B7B89F;
    transform: scale(1.05);
}

.apresentacao img {
   width: 400px;
    height: auto;
    border-radius: 16px; /* Adiciona bordas arredondadas */

Portifolio Enfermeira

Matricule-se agora e aproveite até 50% OFF

O maior desconto do ano para você evoluir com a maior escola de tecnologia

QUERO APROVEITAR
1 resposta
solução!

Olá tudo bem.
Sua pagina está muito bem estruturada.
Agora pode evoluir para uma versão mobile.
Continue exercitando seu aprendizado.
E obrigado por compartilhar seu código com a gente.
Bons estudos.