@charset "utf-8";
/*
	New Perspectives on HTML5 and CSS3, 8th Edition
	Tutorial 3
	Tutorial Case

	Style Sheet for Grids used in the Pandaisia Chocolates website

	Assignment: Chapter 3 Work
	Author: Chris LaFleur
	Date: 9/30/23
*/




/* Grid Styles for Page Body */

body{
	display: grid;
	grid-template-columns: 2fr 1fr;
	grid-template-areas: "header   header"
						"intro    faq"
						"articles faq"
						"footer    footer";
	grid-column-gap: 15px;
}

body > header{
	grid-row: 1;
	grid-column: 1/-1;
}

body > article{grid-area: intro;}
body > aside{grid-area: faq;}
body > section{grid-area: articles;}
body > footer{grid-area: footer;}



/* Grid Styles for Nested Grid */

section{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}

section > h1{
	grid-area: 1/1/2/3;
}