Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Ya estoy inscrito ¿Todavía no tienes acceso? Nuestros Planes
Solucionado (ver solución)
Solucionado
(ver solución)
3
respuestas

Haga lo que hicimos

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidad

3 respuestas
solución!

excelente compañero !

Ingrese aquí la descripción de esta imagen para ayudar con la accesibilidadIngrese aquí la descripción de esta imagen para ayudar con la accesibilidadIngrese aquí la descripción de esta imagen para ayudar con la accesibilidad ``

@import url('https://fonts.googleapis.com/css2?family=Krona+One&family=Montserrat:ital,wght@0,100..900;1,100..900&display=swap');

:root {
    --color-primario: #000000;
    --color-secundario: #FFFFFF;
    --color-terciario: #22D4FD;
    --color-hover: #272727;

    --fuente-montserrat: 'Montserrat', sans-serif;
    --fuente-krona: 'Krona One', sans-serif;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

body {
    background-color: var(--color-primario);
    color: var(--color-secundario);
    font-family: var(--fuente-montserrat);
    height: 100vh;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.header {
    padding: 20px 15%;
}

.header-nav {
    display: flex;
    gap: 80px;
}

.header-nav-link {
    font-family: var(--fuente-montserrat);
    font-size: 1.5rem;
    font-weight: 600;
    color: var(--color-terciario);
    text-decoration: none;
}

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

.presentacion-texto {
    width: 60%;
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.presentacion-texto-titulo {
    font-size: 2.25rem;
    font-family: var(--fuente-krona);
    font-weight: 400;
    line-height: 1.5;
}

.parrafo-destaque {
    color: #22D4FD;
}

.presentacion-texto-parrafo {
    font-size: 1.5rem;
    font-family: var(--fuente-montserrat);
    line-height: 1.6;
}

.presentacion-texto-enlaces {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;

}

.presentacion-texto-subtitulo {
    font-size: 1.5rem;
    font-family: var(--fuente-krona);
    font-weight: 400;
}

.presentacion-texto-enlaces-link {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 1.5rem;
    font-family: var(--fuente-montserrat);
    text-decoration: none;
    color: var(--color-secundario);
    border: 2px solid var(--color-terciario);
    padding: 10px;
    border-radius: 8px;
    transition: 0.3s;
    width: 378px;
    align-items: center;
    justify-content: center;
}

.presentacion-texto-enlaces-link:hover {
    background-color: var(--color-hover);
    color: var(--color-terciario);
    transform: scale(1.05);
    cursor: pointer;
}

.presentacion-imagen {
    width: 300px;
    height: 400px;
    object-fit: cover;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.2);
}

.footer {
    background-color: var(--color-terciario);
    color: var(--color-primario);
    text-align: center;
    padding: 20px;
    font-size: 1.5rem;
    font-family: var(--fuente-montserrat);
}

Muy buena compañero