html {
    font-family: "Roboto";
    font-size: 16px;
}

a {
    color:white;
}

a:hover {
    color: black;
}

h1 {
    letter-spacing: -0.045em;
    font-weight: 700;
    text-shadow: 2px 2px rgba(0,0,0,0.24);
}

h2,h3,h4 {
    letter-spacing: -0.045em;
}

.container {
    width: 80%;
}

.nav-home-link {
    &:hover {
        color: lightgray;
    }
}

.nav-github-link {
    &:hover {
        color: lightgray;
    }

    img {
        height: 1em;
        padding-right: 8px;
    }
}

/* MOBILE */
@media only screen and (min-width:10px) {
    .github-link {
        display:block;
        margin-left: auto;
        margin-right: auto;
    }

    .github-button-container {
        &:first-of-type {
            margin-left: 0;
        }
        display: inline-block;
        margin-left: 10px;
    }
    
    .accent-link {
        font-size: 20px;
        font-weight: 700;
    }
    
    .cloudflare-logo {
        width: 282px;
    }
    
    .small-text {
        font-size: 10px;
    }

    footer.page-footer {
        margin-top:0px;
    }

    .cf-logo-footer {
        margin-top:20px;
    }
}

/* TABLET */
@media only screen and (min-width:600px) {
    .cloudflare-logo {
        width: 282px;
    }
}

/* DESKTOP */
@media only screen and (min-width:1024px) {
    .cloudflare-logo {
        width: 494px;
    }

    .cf-logo-footer {
        margin-top:0px;
    }
}