/* external stylesheet for week 4 monday */
@-ms-viewport{
    width: device-width;
  }

* {
    margin: 0; padding: 0; border: 0; box-sizing: border-box 
}

/* CSS rule (or ruleset) */
/*
selector {
    declaration1;
    declaration2;
    proeprty: value;
    property: value value value value;
    property: value, value, value, value;
}
*/

body{
    background-color: #345;
    font-family: Verdana;
    color: #EEE;  
}
/* type selector */
header {
    background-color: yellowgreen;
    color: #345;
    text-align: right;
    padding: 24px;
}

/* descendent selector */

header h1 span {
    color: transparent;
    text-shadow: 0px 0px 5px #222, 3px 3px 1px orangered;
    font-size: 200%;
    letter-spacing: 8px;
}

main {
    border: 8px solid #445566;
    height: 250px; 
    width: 90%; /* 90% of the parent */
    margin: 20px auto; /* center a block element */

}

ul {
    list-style: none; /* gets rid of the bullets */
    margin: 16px;
    padding: 8px;
    border: 8px solid hsla(360, 43%, 30%, .6); /* add a to hsl for tansparency */
}

ul li {
    margin-bottom: 16px;;
}

ul li::first-line {
    font-weight: bold;
    color: hsl(200, 100%, 50%);
}

footer {
    background-color: hsl(200, 80%, 100%);
    position: fixed;
    bottom: 0px; left: 0px;
    width: 100%; min-height: 80px;
    color: hsl(200, 80%, 50%);
}