/* START Imports (via Google Fonts) */
@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');
/* END Imports (via Google Fonts) */ 

/* START Center Image */
/* Code courtesy of MDN */
.center-image {
	padding-bottom: 2vh;
	width: 10em;
}

.center-image-div {
	height: 8em;
	font: 1.2em sans-serif;

	display: flex;
	align-items: center;
	justify-content: center;
}
/* END Center Image */

/* START Page-Wide Settings */

body {
	font-family: "Roboto", sans-serif;
	font-size: 14pt;
	font-weight: 410;
	font-style: normal;
	font-variation-settings: "wdth" 100;
}

/* END Page-Wide Settings */

/* START Headings */
h1, h2 {
    text-align: center;
	font-family: "EB Garamond", serif;
	font-style: normal;
	font-weight: 450;
}

h1 {
	font-size: 2.25em;
}

h2 {
	font-size: 2em;
}

a {
	color: blue;
}

textarea {
	min-width: 100%;
	min-height: 10%;
}

/* START Sections */

.explainer-section,
.write-section,
.resource-section {
	/*Change between mobile and desktop*/
	padding: 2vh 20vw 4vh;
}


.explainer-section {
    background-color: rgb(94, 255, 1);
}

.resource-section {
	background-color: rgb(220,220,220);
}
.write-section {
	background-color: rgb(240, 153, 75);
}

/* END Sections */

table {
    font-family: Arial, Helvetica, sans-serif;
    border-collapse: collapse;
    width: 100%;
}

table td, th {
    border: 1px solid #ddd;
    padding: 8px;
}

table tr:nth-child(even){
    background-color: #f2f2f2;
}

table th {
    padding-top: 12px;
    padding-bottom: 12px;
    text-align: left;
    background-color: cornflowerblue;
    color: white;
}