* { box-sizing: border-box;
    margin: 1;
    padding: 5;
    color: rgb(247, 248, 253);
    font-family: Arial;
}

body {background-color: rgb(42, 43, 47);}
h1 {
    background-color:rgb(54,57,64);
    text-align: center;}
p {font-size: 16px;}

img.rounded {border-radius: 95px;}
ol > li {list-style-type: upper-roman;}

/*---links---*/
a:link {color:rgb(88, 101, 242);}
a:visited {color:rgb(118, 119, 124);}
a:hover {color:rgb(64, 78, 237);}
a:active {color:blue;}

/*---tables---*/
table {
    margin: 10px; 
    padding: 10px;
    border: 5px solid rgb(33, 34, 38);
    border-collapse: collapse;
}
tr, td, th {
    border: 2px solid rgb(33, 34, 38);
    text-align: left;
}
tr:nth-child(even) {background-color: rgb(48, 49, 54);}

/*---Flex Boxes---*/
nav {
    background-color:rgb(48, 49, 54);
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    padding: 8px;
    flex-wrap: wrap;
}
main {
    background-color:rgb(54,57,64);
    display: flex;
}
aside {
    order: 2;
    flex: 2 1 auto;
}


/* Add CSS selectors for the semantic elements:  
 * header, nav, main, article, aside, footer */