:root {
    --highlight-color-high: rgb(102, 160, 109);
    --highlight-color-low: darkolivegreen;
    --primary-color: darkslategray;
    --primary-text-color: cornsilk;
    --negative-color: rgb(230, 59, 59);
    --negative-color-highlight: rgb(216, 94, 94);
    --blank-space-color: rgb(51, 51, 51);
    --linkedin-color: #0a66c2;
    --dark-space-color: black;

    /* Projects button */
    --projects-img1: url("exampleLightSwordArena.png");
    --projects-img2: url("exampleShowdown.png");
    --projects-img3: url("exampleSanityStand.png");
    --projects-img4: url("exampleTycoonTemplate.png");
    --projects-color1: rgb(161, 130, 101);
    --projects-color2: rgb(161, 187, 194);
    --projects-color3: rgb(137, 165, 84);
    --projects-color4: white;
}

html, body {
    font-family: Rubik, Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    background-color: var(--blank-space-color);
    margin: 0;
    padding: 0;
    display: flex; /* To support headers and footers */
    flex-direction: column;
    height: 100%;
}

p {
    color:var(--primary-text-color);
}

h1 {
    font-family: Rubik, Cambria, Cochin, Georgia, Times, 'Times New Roman', serif;
    color:var(--primary-text-color);

}

h3 {
    color:var(--primary-text-color);
}

/* To support headers and footers */
.page-content {
    flex: 1 0 auto;
    overflow: hidden;
}

a {
    color: var(--primary-text-color);
}