body {
	background: #EEE;
	font-size: 18px;
	font-family: optima, helvetica, arial, sans-serif;
}

h1{
	padding: 5px;
	color: black;
}

h2{
	padding: 5px;
	color: black;
	
}

h3{
	padding: 5px;
}

h4{
	
}

.parent {
    display: grid;
    grid-template-columns: repeat(auto, 1fr);
    grid-template-rows: repeat(auto, 1fr);
    gap: 5px;
}
    
.div1 {
	align-self: center;
	flex-grow: 1;
	text-align:center;
	width: auto;
	border: 5px solid #000000;
	border-radius: 10px;
    grid-column: span 5 / span 5;
}

.div2 {
	width: flex;
	border: 5px solid #000000;
	border-radius: 10px;
    grid-column: span 3 / span 3;
    grid-row: span 2 / span 2;
    grid-row-start: 2;
}

.div3 {
	width: flex;
	border: 5px solid #000000;
	border-radius: 10px;
    grid-column: span 2 / span 2;
    grid-column-start: 4;
    grid-row-start: 2;
}

.div4 {
	border: 5px solid #000000;
	border-radius: 10px;
	grid-column: span 2 / span 2;
    grid-column-start: 4;
    grid-row-start: 3;
}

.div5 {
	width: flex;
	border: 5px solid #000000;
	border-radius: 10px;
    grid-column-start: 5;
    grid-row-start: 3;
}

.div6 {
	width: flex;
	border: 5px solid #000000;
	border-radius: 10px;
    grid-column: span 5 / span 5;
    grid-row-start: 4;
}

table {
	width: 100%;
}

td, th {
	padding: 5px 20px;
	border: 1px solid black;
}

th {
	background: #000000;
	color: white;
	
}