[Proyecto] Desarollo | HTML y CSS: header, footer y variables CSS | Alura Latam

<!DOCTYPE html>
<html lang="es">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Portafolio</title>
    <link rel="stylesheet" href="style.css">
</head>
<body>
  <header></header>
  <main class="presentacion" >
    <section class="presentacion_contenido">
  <h1 class="titulo_mayor" >Eleve tu negocio digital a otro nivel con un <strong class="Destaque">Front-end de calidad!</strong> </h1>
  <p class="parrafo_mayor"> <strong>¡Hola! Soy Ana García</strong>, desarrolladora Front-end con especialización en React, HTML y CSS. Ayudo a pequeños negocios y diseñadores a llevar a cabo buenas ideas. ¿Hablamos?
    </p>
    
    <div class="presentacion_botones">
        <h2 class="POST_REDES"> Accede a nuestras redes sociales</h2>
    <a class="presentacion_link" href="https://www.instagram.com/">
        <img src="./assets/instagram.png">
        Instagram</a>
    <a class="presentacion_link" href="https://github.com/">
        <img src="./assets/github.png">
        Githhub</a>
        <a class="presentacion_link" href="https://www.linkedin.com/">
            <img src="./assets/linkedin.png">
            Linkedin</a>
        <a class="presentacion_link" href="https://x.com/?lang=es">
            <img src="./assets/twitter.png">
            twitter</a>
    </div>
</section>
<img src="NEURO.jpg"alt ="imagen de neurologia">
  <footer></footer>    
</main>
</body>
</html>

CSS

*{
padding: 0;
margin: 0;

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

}
strong{
    color: #d2d200;
}
.Destaque{
    color: #C25000;
}
.presentacion{
    display: flex;
    align-items: center;
    margin: 8%;
    justify-content: space-between;
}
.presentacion_contenido{
    width:615px;
}
.titulo_mayor{
    font-size: 36px;
    font-family: "Krona one",sans-serif;
}
.titulo_mayor:hover{
    background-color:#22DF42;
}
.parrafo_mayor{
    font-size: 24px;
}
.presentacion_botones{
    display:flex;
    justify-content:space-between;
    flex-direction: column;
    align-items: center;
    gap: 10px;
   
}
.presentacion_link{
    width: 150px;
    text-align: center;
    justify-content:space-between;
    padding: 5.5px;
    border-radius:8px;
    font-size: 16px;
    font-weight: 150;
    text-decoration:none;
    color: #f6f6f6;
    border: 2px solid #22DF42;
    display: flex;
    justify-content: center;
    gap: 10px;

}
POST_REDES{
    font-family: "Krona one",sans-serif;
    font-size: 24x;
    font-weight: 400;
}
.presentacion_link:hover{
    background-color: #6d6363;
}