/* Creating css variable at root */
:root {
    --site-color-01: #000;
    --site-color-02: #1e1e1e;
    --site-color-01-hover: skyblue;
    --border-color-01: #5981cc;
}

/* Import downloaded fonts */
@font-face {
    font-family: Lato;
    src: url(/fonts/Lato/Lato-Regular.ttf);
}

body {
    background-color: var(--site-color-02);
}

/* to preload inmages to prevent flicker on :hover */
body::after {
    position: absolute;
    width: 0;
    height: 0;
    overflow: hidden;
    z-index: -1;
    content: url();
} 

.navbar-brand img {
    width: 60px;
}

.navbar-nav a {
    text-transform: uppercase;
}

h1 {
    font-size: 32px;
    line-height: 32px;
    color: #fff;
    font-family: Lato;
    font-weight: 600;
    text-transform: uppercase;
}

h2 {
    font-size: 26px;
    line-height: 32px;
    color: #fff;
    font-family: Lato;
    font-weight: 600;
    text-transform: uppercase;
}

h3 {
    font-size: 22px;
    line-height: 32px;
    color: #fff;
    font-family: Lato;
    font-weight: 600;
    text-transform: uppercase;
}

p {
    font-size: 14px;
    line-height: 18px;
    color: #fff;
    font-family: Lato;
}

a {
    font-size: 14px;
    line-height: 18px;
    color: #fff;
    font-family: Lato;
    cursor: pointer;
    text-decoration: none;
}