:root{
    --font-body: Arial, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
    --font-mono: "Fira Mono", monospace;
    --color-bg-0: rgb(202, 216, 228);
    --color-bg-1: hsl(209, 36%, 86%);
    --color-bg-2: hsl(224, 44%, 95%);
    --color-theme-1: #ff3e00;
    --color-theme-2: #4075a6;
    --color-text: rgba(0, 0, 0, .7);
    --column-width: 42rem;
    --column-margin-top: 4rem;
    font-family: var(--font-body);
    color: var(--color-text);
}

body{
    min-height: 100vh;
    margin: 0;
    background-attachment: fixed;
    background-color: var(--color-bg-1);
    background-size: 100vw 100vh;
    background-image: radial-gradient(50% 50% at 50% 50%,rgba(255,255,255,.75) 0%,rgba(255,255,255,0) 100%),linear-gradient(180deg,var(--color-bg-0) 0%,var(--color-bg-1) 15%,var(--color-bg-2) 50%);
}
body .pointer{
    position: relative;
}

body .pointer::after{
    content: "";
    position: absolute;
    /*generamos un triangulo boca abajo con css*/
    border-top: .8rem solid var(--color-theme-1);
    border-left: .8rem solid transparent;
    border-right: .8rem solid transparent;
    display: block;
    bottom: 25px;
    left: 5px;
    height: 0;
}