h1,h2,h3,h4,h5,h6 {
    /* set choices for titles and subtitles*/
    font-family: "Eagle Lake", system-ui;
    font-weight: 400;
    font-style: normal;
    color: rgb(132, 29, 1);
    /* 16 pixels = 1rem = height of the letter m of root element*/
    /* root element never changes*/
    /* EM vs REM = em is in the size of the current tag*/
    /* REM is root element m size + never changes*/
    /* Em is your tag's text size*/

    margin-top: 1em; /*usually more space on top than bottom*/
    margin-bottom: 0.50em;
}
h1 { font-size: 2.5em; }
h2 { font-size: 2.1459em; }
h3 { font-size: 1.842em; }
h4 { font-size: 1.5811em; }
h5 { font-size: 1.3572em; }
h6 { font-size: 1.165em; }
p { font-size: 1em; }
small { font-size: .8584em; }

header {
    display: flex; /*put things side by side*/
    background-color: rgb(242, 193, 16);; /*fill*/
    height: 2.3rem;
    line-height: 2rem; /*line-height = height of box => vertically centered text */
    color: brown;
    border-bottom: 4px solid brown; /* required: width + type + color */ 
}

header p {
    font-family: "Eagle Lake", system-ui;
    font-weight: 400;
    font-style: normal;
    font-size: 1.2rem;
    margin-left: 1rem; /* push away from the logo */
}

main {
    margin: 1rem; /* move the main content box away from everything, on all sides */
    color: brown;
}
main a:link {
    color: rgb(138, 2, 104);
    text-decoration: none; /*removes underline */
}

main a:visited {
    color: rgb(159, 103, 55); /* link to pages you have visited already */
}

main a:hover {
    text-decoration: underline; /* link underneath the mouse cursor but not clicking yet */
}

main a:active{
    color: rgb(255, 20, 126); /* link is vivid color while being clicked */
}

 aside { 
        color: brown;
        background-color: rgb(255, 206, 10);
        margin: 1rem; /* 3rem at top: values are clockwise, starting at noon */
        padding: 1rem;
    }

aside a:link {
    color:rgb(138, 2, 104);
    text-decoration: none; /*removes underline */
}

aside a:visited {
    color: rgb(207, 136, 74); /* link to pages you have visited already */
}

aside a:hover {
    text-decoration: underline; /* link underneath the mouse cursor but not clicking yet */
}

aside a:active{
    color: rgb(255, 20, 126); /* link is vivid color while being clicked */
}
footer a:link {
    color:rgb(138, 2, 104);
    text-decoration: none; /*removes underline */
}

footer a:visited {
    color: rgb(172, 104, 44); /* link to pages you have visited already */
}

footer a:hover {
    text-decoration: underline; /* link underneath the mouse cursor but not clicking yet */
}

footer a:active{
    color: rgb(255, 20, 126); /* link is vivid color while being clicked */
}

ul {
        list-style: disc;
        margin-left: 1.5rem;
    }

    li {margin-bottom: 0.25rem}

body {
    /*font choice for all other parts of the page*/
    font-family: Arial, Helvetica, sans-serif;
    font-size: 1rem;
    color: black;
    background-color: orange ;
}

footer {
    background-color: rgba(240, 197, 129, 0.895);
    color: brown;
    padding: 1rem 2rem 4rem 2rem;



    background-image: 
    url(bgimg/snow-mountain-svgrepo-com.svg),
    url(bgimg/suv-svgrepo-com.svg),
    url(bgimg/indicator-svgrepo-com.svg),
    url(bgimg/sun-svgrepo-com.svg),
    url(bgimg/hot-air-balloon-svgrepo-com.svg),
    linear-gradient(to top, yellow, orange);

    background-size: 
    200px,
    85px,
    22%,
    22%,
    15%,
    100%;

    background-repeat: 
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat,
    no-repeat;

    background-position: 
    170px 180px,
    10px 285px, 
    115px 296px,
    220px 25px,
    125px 135px,
    center;
}