body {
    background-color: #543136;
    color: #D8C6B8;
    text-align: center;       
}
/*body dictactes the color of the background and text along with alignment.*/

.row {
  display: flex;
  align-items: center;
}
/* .row dictates the placement and alignment of the rows */
.first-column {
    width: 66%;
    padding: 5px 5px 5px 5px ;
    justify-content: flex-start
}
.second-column {
    width: 33%;
    padding:5px 5px 5px 5px;
    justify-content: flex-end;
    background-color: #543136;
    color: #D8C6B8;
    align-content: center    
}
.column-one {
    width: 100%;
    height:auto;
    align-items: center
}
/*The above column CSS elements dictate responsive sizing, padding, alignment and border/background elements */

h1 {
    color: #0B9446;
    font-family: "goudy old style";
    font-style: italic;
    font-size: 300%;
	text-shadow: 4px 4px 4px #3B2226;
}
h2 {
    color: #CF1C44;
    font-family: "goudy old style";
}
/* the above heading CSS dictates color, type, size and shadow elements*/
p {
    font-family: "klinic slab";
}
/* paragraph CSS element dictates typeface */
.topnav {
    background-color: #D8C6B8;
    height: 40px;
    display: flex row;
    justify-content: flex-end;
    align-items: center;
    flex-grow: auto;
     }
/*.topnav dictates the color, size and alignment of the navigtion bar*/
.topnav a {
    color: #0B9446;
    padding: 14px 15px;
    font-size: 16px;
    font-family: "klinic slab";    
}
/*.topnav a dictates the color, size, typeface and padding of each navigation button*/
.topnav a:hover {
    background-color: #0B9446;
    color: #D8C6B8;
}
/*.topnav a:hover dictates the background and type color when the cursor hovers over*/
.header {
    width: 100%;
    height: auto;
}
.body {
    width: 60%;
    height: auto;
}
/*the .header and .body CSS creats responsive sizing*/
.nonna {
    width:50%;
    height:auto;
	padding: 10px 2px 2px 2px;
	box-shadow: 10px 13px 5px #A19389
}
/*.nonna classifies responsive size, padding and drop shadow*/ 
.column {
    width: 50%;
	height: auto;
}
.footer {
    background-color: #D8C6B8;
    color: #543136;
 	bottom: 0;
 	width: 100%;
	
}
/* .footer indicates the background color, type color and responsive width*/
.sitemap {
    display: flex;
    align-content: flex-start
}
/*.sitemap aligns the sitemap hyperlinks to the left side of the page*/
.textbox {
    width: 80%;
    height:auto;
    color: #543136
}
/* .textbox specifies responsive width and type color*/
.ourstory {
	width: 66%;
	height: auto;
	background-color: #D8C6B8;
	border: 13px groove #0B9446;
	box-shadow: 5px 5px 5px #3B2226;
}
/*.ourstory indicates responsive sizing, background color, groove border and drop shadow*/
.about {
	color: #543136;
	padding: 5px 5px 5px 5px
}
/*.about assigns type color and padding to elements with this class attribute*/ 
.hours {
	width: 33%;
	height: auto;
	background-color: #D8C6B8;
	border: 13px groove #0B9446;
	box-shadow: 5px 5px 5px #3B2226;
	box-shadow: 5px 5px 5px #3B2226;
}
/*.hours sets responsive width, background color, grooved border and drop shadow. */
.founder {
	color: #543136;
	padding: 2px 5px 5px 5px
}
/*.founder sets type color and padding*/
.menu {
	width: 95%;	
	box-shadow: 13px 13px 5px #3B2226;
}
/*.menu indicates responsive width and drop shadow*/
.greenhead {
	color: #0B9446;
}
/*.greenhead sets green heading color*/
.vision {
	width: 100%;
	height: auto;
	padding:5px 5px 5px 5px;
	background-color: #D8C6B8;
	border: 13px groove #0B9446;
	justify-content: flex-end
}
/*.vision indicates responsive width, padding, background color and grooved border*/
.hourh1 {
	color:#0B9446;
	text-shadow: 2px 2px 4px #A19389;
}
/*.hourh1 sets type color and drop shadow*/
.menuleft {
	width:50%;
	height: auto;
}
/*.menuleft sets responsive width*/
.menuright {
	width: 50%;
	height: auto;
}
/*.menuright sets responsive width*/