
.container-grid{
    display: grid;
    grid-template-areas: "header header header" "content layout layout" "description description description" "footer footer footer";
    grid-template-columns: 2fr 1fr 1fr;
  	grid-template-rows:1fr;
    gap:20px;
    row-gap: 20px;
    padding:15px;
    background-color: beige;
    border: 1px solid black;
  	min-width:450px;
  	max-width:1200px;
    width: 60%;
    margin: 30px auto 0 auto;
  	
}
.head{
    grid-area: header;
    text-align: center;
    border: 1px solid black;
    padding: 2px;
    background-color: rgb(220, 245, 196);
    border-radius: 10px;
}
/*Font style for header texts as well as the footer and description info secions*/
h1, h2, h3, .foot, .description-info{
    font-family:'Lucida Sans', 'Lucida Sans Regular', 'Lucida Grande', 'Lucida Sans Unicode', Geneva, Verdana, sans-serif;
}
p{
    font-family:Verdana, Geneva, Tahoma, sans-serif;
}
/*Table regarding purpose, audience, experience*/
.drop-list{
    grid-area: content;
    border: 1px solid black;
    padding:10px;
    border-radius: 10px;
  	background-color: rgb(220, 245, 196);
   	min-width:250px;
 		max-width:800px;
}
.drop-list th, .drop-list td{
    border: 2px dotted black;
    text-align: left;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  	background-color: beige;
}
.drop-list table{
    border: 1px solid black;
    text-align: left;
    padding: 2px;
    font-family:'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
}
#layout-info{
    grid-area: layout;
  	min-width:150px;
  	max-width:500px;
}
ul {
    font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
  font-size:16px;
}
/*Info about colors section*/
.plan-layout1{
    padding: 10px;
    border: 1px solid black;
    border-radius: 10px;
  	background-color: rgb(220, 245, 196);
  	overflow-wrap: anywhere;
}
/*Info about SEO keywords*/
.plan-layout2{
    padding: 10px;
  	margin-top: 20px;
    border: 1px solid black;
    border-radius: 10px;
  	background-color: rgb(220, 245, 196);
  	overflow-wrap: anywhere;
}
.description-info{
    border: 1px solid black;
    padding: 25px;
    border-radius: 10px;
  	background-color: rgb(220, 245, 196);
  	grid-area:description;
}
.foot{
    grid-area: footer;
    border: 1px solid black;
    padding: 15px;
    border-radius: 10px;
  	background-color: rgb(220, 245, 196);
}