main {
    background-color: white;
    margin: var(--margins);
    padding: var(--padding);
    border: 0.1em solid var(--kiloRed);
}

main.grid-layout {
    display: grid;
    grid-template-columns: 50% 50%;
    grid-template-areas: 
    "back back"
    "previous-workouts next-workouts"
    "workout-view workout-view";
}

.back {
    grid-area: back;
    position: relative;
}

.previous-workouts {
    grid-area: previous-workouts;
    position: relative;
    word-wrap: anywhere;
    text-align: center;
}

.previous-workouts a {
    border: .1em solid black;
    margin: var(--quarterMargins);
}

.next-workouts {
    grid-area: next-workouts;
    position: relative;
    word-wrap: anywhere;
    text-align: center;
}

.next-workouts a {
    border: .1em solid black;
    margin: var(--quarterMargins);
}

.workout-view {
    grid-area: workout-view;
    position: relative;
}

fieldset {
    margin: 3% 0% 3% 0%;
}

h2 {
    color: black;
}

table {
    word-wrap: anywhere;
}

table.tab {
    color: white;
    padding: var(--halfPadding);
    margin: auto;
    text-align: center;
    min-width: 85%;
}

table.tab th {
    background-color: maroon;
    padding: var(--quarterPadding);
    
}

table.tab td {
    background-color: var(--blackish);
    padding: var(--quarterPadding);
}

table.performedSets {
    text-align: center;
    margin: auto;
    min-width: 66%;
}

table.performedSets th {
    height: 4em;
    color: white;
    background-color: maroon;
    border: .1em solid black;
    word-wrap: break-word;
}

table.performedSets input, table.performedSets textarea{
    width: 75%;
    height: 2em;
}

table.performedSets label {
    color: white;
    
}

table.performedSets td:nth-child(even) {
    background-color: var(--mediumGrey);
}

table.performedSets td:nth-child(odd) {
    background-color: var(--darkGrey);
}