@import url(reset.css);

:root {
    font-size: 16px;
}

body {
    min-height: 100vh;
    background-image: linear-gradient(45deg,darkseagreen,mediumpurple);
    font-family: verdana;
    font-size: 1.5rem;
}

h1 {
    text-align: right;
    text-transform: lowercase;
    margin: 1em;
}

.table1 {
    border: 5px solid burlywood;
    border-collapse: collapse;
    margin: 2em auto;

}

.table1 th, .table1 td {
    border: 3px solid #EEE;
}

.table1 th {
    height: 90px;
    background-color: #222;
    color: #EEE;
}

.table1 td {
    width: 200px;
    height: 50px;
    vertical-align: top;
    text-align: center;
}

.table1 tr:nth-child(odd) {
    background-color: darksalmon;
}

.table1 tr td:first-child {
    background-color: #FFC;
    color: #900;
}

.table2 {
    border-collapse: 5px solid #900;
    margin: 2em auto;
    width: 80%;
    border-collapse: collapse;
}

.table2 td {
    border: 5px solid #F00;
    width: 100px;
    height: 100px;
}

.table2 .bigCell {
    width: 220px; height: 220px;
}