@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: Makayela Carden
	Date:   3/1/26
   
   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;  
}