body {
	color: black;
	font-family: 'Ubuntu', sans-serif;
}




 /* ---- Set up site grid ---- */
 
 .wrapper {
	 display: grid;
	 grid-template-columns: 300px 2fr 1fr;
	 grid-template-rows: auto;
	 grid-template-areas:
		"logo banner banner"
		"nav nav nav"
		"main main side"
		"footer footer footer";
	grid-gap: 4px; 	
 }
 /* ---- End of grid setup ---- */
 
 
 
 /* -000- Area styling -000- */
 
 .box {
	padding: 10px;
	border-radius: 10px;
	background-color: #ddd;
 }	

 /* Area colouring... */
 
 /* logo, banner and footer background are the same*/
 .logo, .banner, .footer {
	 background-color: #261A52; /* russian violet */
 }
 
 /* Set font on dark areas to white */
 .logo, .banner, .side, .footer {
	 color: #fff;
}
 
 /* Area specifics */

 
 .logo {
	 grid-area: logo;
	 padding: 0;
	 height: 199px;
	 width: 300px;
	
 }	 
 
 .banner {
	 grid-area: banner;
 }

 .nav {
	 grid-area: nav;
	 background-color: #7D76A8; /* pomp and power */
	 font-size: 150%;
	 text-align: center;
 } 
 
 .main {
	 grid-area: main;
	 background-color: #E5E4E6; /* platinum */
	 border: solid 1px #ddbb99;
 }

 .side {
     grid-area: side;
	 background-color: #585178; /* ultra violet */
 }

 .footer {
     grid-area: footer;
	 text-align: right;
 }	 
	
 /* -000- End of area styling -000- */
 
 h1, h2, h3, h4 {
	 font-family: 'Ubuntu', sans-serif;
 }
 
 /* Navigation Links*/
 .nav a {font-weight: bold;}
 .nav a:link, .nav a:visited {color: #9691B8;}
 .nav a:hover {color: #604830; text-decoration: none;}
 
 /* links in page */
 a {font-weight: bold;}
 a:link 
 a:visited {color: #7D76A8;} /* pomp and power */
 a:hover {color: #5C4033; text-decoration: none;} /* dark brown */
 
 /* links in side bar */
 .side a:link{color: #261A52;} /* russian violet */
 .side a:visited{color: #261A52;} /* russian violet */
 .side a:hover{color: #261A52;} /* russian violet */
 
 /* Contact Form Styling */
 .contact {
	width: 100%;
 }