Ya revise el codigo del video y el mio varias veces y tengo las class en su lugar y tambien hago referencia a llamada y head que es lo que se a usado hasta el momento. dejo imagen de como se ve el de la profesora y el mio.
Y asi se ve el mio...
Adjunto mi codigo hasta el momento.
<!DOCTYPE html>
<!DOCTYPE html>
<html lang="es">
<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>Home Apeperia</title>
<link href="https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,300;0,400;1,700&family=Open+Sans:ital,wght@0,400;1,300;1,700&display=swap" rel="stylesheet">
<link rel="stylesheet" href="Layouts responsivos/css/head.css">
<link rel="stylesheet" href="Layouts responsivos/css/llamada.css">
</head>
<body>
<header class="head">
<img class="head__logo" src="Layouts responsivos/img/logo-apeperia.svg" alt="Logo">
<nav class="head__navegacion">
<ul>
<li class="head__enlace"><a href="#">Sobre</a></li>
<li class="head__enlace"><a href="#">Planes</a></li>
<li class="head__enlace"><a href="#">Blog</a></li>
<li class="head__enlace"><a href="#">Destacados</a></li>
<li class="head__enlace"><a href="#">Institucional</a></li>
<li class="head__enlace"><a href="#">Contacto</a></li>
</ul>
</nav>
<main>
<section class="llamada">
<h1 class="llamada__titulo">Aplicaciones en la medida</h1>
<p class="llamada__texto">Apeperia es una empresa emergente con una manera inovadora de comprar y crear aplicaciones móviles y web.</p>
<a class="llamada__boton" href="#">Conozca los planes</a>
</section>
</main>
</header>
</body>
</html>ahora el css del head.
.head {
color: #FFFFFF;
width: 100%;
box-sizing: border-box;
display: flex;
flex-direction: column;
align-items: center;
padding-top: .75rem;
padding-bottom: .75rem;
border-bottom: 1px solid #103D4A;
position: absolute;
}
.head__logo {
margin-bottom: 1rem;
}
.head__navegacion {
text-align: center;
}
.head__enlace {
font-size: 1.1rem;
display: inline-block;
margin-right: .7rem;
margin-bottom: 1.25rem;
margin-left: .7rem;
}
y por ultimo el de llamada. Quiero aclarar que estos css no los eh modificado estan tal cual como se descargaron.
.llamada {
display: flex;
flex-direction: column;
align-items: center;
color: #FFFFFF;
text-align: center;
background-color: #00161C;
padding-top: 12.25rem;
padding-bottom: 2.5rem;
}
.llamada__titulo {
font-family: 'Montserrat', serif;
font-size: 2rem;
font-weight: 700;
text-transform: uppercase;
margin-bottom: 1.5rem;
}
.llamada__texto {
font-size: 1.25rem;
line-height: normal;
margin: 0 auto 2.5rem;
}
.llamada__boton {
width: 100%;
}
