@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
   Author: Matt Johnson	
   Date:   10/2/24
   
   Filename: pc_grids.css

*/


/* 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
}