h1, h2, h3, h4, h5, h6 {
    /* font choice for titles and subtitles */
    font-family: 'Fascinate', system-ui;
    font-weight: 400;
    font-style: normal;
    color: rgb(70, 12 ,2);

    margin-top: 1em ; /*usually more space on topthan bottom*/
    margin-bottom: 0.25em;

}

/* 16 pixels = 1 rem= height of letter m of root element */
/* root element (ex: html tag) never changes */
/* EM vs REM = em is in the size of the current tag */
/* REM is proportional to your tag's text size */

body {
    /* font choice for body text */
    font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif;
    font-size: 1rem;
    color: rgb(70, 12 ,2);
}

header
{
    display: flex;
    height: 2rem;
    line-height: 2rem; 
}

header img {margin-right: 0.5rem;}

h1 { font-size: 2.25em; }
h2 { font-size: 1.9656em; }
h3 { font-size: 1.7171em; }
h4 { font-size: 1.5em; }
h5 { font-size: 1.3104em; }
h6 { font-size: 1.1447em; }
p { font-size: 1em; }
small { font-size: .8736em; }

main {padding: 1em;}

aside {
    background-color: rgb(167, 249, 255);
    margin: 1em;
    padding: 1em; ;
}
aside a:link {color: white}

/* LoVeHa RULE */
aside a:link {
    color: white;
    text-decoration: none;   /* removes underline */
}

aside a:visited {
        color: rgb(0, 70, 183); /* looks faded, more boring  */
    }
aside a:hover {
        text-decoration: underline; /* adds underline on mouse hover */
    }

aside a:active {
        color: rgb(249, 161, 240); /* red color when clicked */
    }

footer a:link {
    color: white;
    text-decoration: none;   /* removes underline */
}

footer a:visited {
        color: rgb(0, 70, 183); /* looks faded, more boring  */
    }

footer a:hover {
        text-decoration: underline; /* adds underline on mouse hover */
    }

footer a:active {
        color: rgb(249, 161, 240); /* red color when clicked */
    }

footer h4, footer h5 {
    color: rgb(255, 255, 255);
}



ul {
    /* unordered list */
    list-style-type: disc;
    color: snow;
    margin-left: 2em;
}

ul li {
    /* list ite within the list */
    margin-bottom: 0.5em;
}


footer {
    background-color: antiquewhite;

    background-image:url(bgimg/sun-svgrepo-com.svg),
    url(bgimg/ocean-svgrepo-com.svg), 
    url(bgimg/sailboat-svgrepo-com.svg),
    url(bgimg/bird.svg),
    url(bgimg/bird.svg);

    background-size: 60px,100px, 60px, 40px, 20px; 
    background-repeat: no-repeat, no-repeat, no-repeat, no-repeat, no-repeat; 
    background-position: center, center bottom, center 84%, center left 65%,center top 25%;

    padding: 1rem 2rem 4rem 2rem; /* clockwise, starts at noon */

}