:root {
    --backgroundc: antiquewhite;
    --textc: black;
}

html {
    display: flex;
    background-color: var(--backgroundc);
    justify-content: center;
    transition: background-color 0.5s ease;
}

body {
    color: var(--textc);
    transition: color 0.5s ease;
}

/* fuck off
.header {
    font-size: 1em;
}
*/

.app {
    /* border: 3px solid gray; */
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
    width: 80vw;
    margin: 5vw;
}

.buttons {
    display: inline-block;
    max-width: 20vw;
    margin-left: auto;
    margin-right: auto;
    gap: 20px 20px;
    max-width: 70vw;
}

.list table {
    border-collapse: collapse;
    border: 2px solid black;
    display: inline-block;
}

.list table th,
.list table td {
    padding: 5px 20px;
    border: 1px solid gray;
    text-align: center;
}

.graybtn {
    background: #797979;
    color: var(--textc);

}

.flex-center {
	display: flex;
	align-items: center;
	align-self: center;
	align-content: center;
}

.btnbase {
	transition: background 0.25s ease-in-out, transform 0.15s ease;
	/* font-size: 1rem; */
    text-align: center;
    border-radius: 7px;
	display: inline-block;
    border: none;
    padding: 1rem 2rem;
    margin: 0.25em;
}

.btn {
    background: #0069ed;
    color: white;
}

.btn:hover,
.btn:focus {
    background: #0053ba;
}
.btn:active {
    transform: scale(0.95)
}