body {
	color:#000;
	margin:auto;
	padding:50px;
	font-family:roboto;
}

/*-----start of grid styling----*/
.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 grid styling-----*/

/*start ----- area styling-----*/
.box {

	padding: 20px;
	background-color: #dddddd;
	font-family: roboto;
	border-radius:10px;
	}

/*start-----Area COLORING-----*/

/*logo, banner, footer are the same colour*/
.logo, .banner, .footer {
	background-color: #FBCB9B /* Light Orange */
	}

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

.banner {
	grid-area:banner;
	}

.nav {
	grid-area:nav;
	background-color: #FFE6CC;
	font-size:30px;
	text-align: center;
	}

.main {
	grid-area:main;
	background-color: #FFE6CC;
	border:solid 1px #ddbb99;
	}

.side {
	grid-area:side;
	background-color: #FFCC99
	}

.footer {
	grid-area:footer;
	text-align:right;
	color: white
	}

.main h2 {color:black;}

.main h3 {color:#885566;}
/*----- end of area styling-----*/

h1, h2{
	font-family: 'Roboto', sans-serif;
	color:white;
	margin-top:0;
	}

/*navigation links*/
.nav a {
	font-weight: bold;
	text-decoration: none
	}

.nav a:link, .nav a:visited {
	color: #885566
	}

.nav a:hover {
	color: #604830; 
}

/*links to sites*/
a {font-weight: bold}
a:link{color:#885566}
a:visited{color:black}
a:hover{color:#DDBB99}
a{text-decoration: none}


li { list-style-type: none;}

/*styling restaurant list on the index page*/
li:before {
    content: "\f02d";
    font-family: FontAwesome;
    color:#FEDDB3; /* or whatever color you prefer */
    margin-right: 4px;
    margin-left: -30px
	}

#books {
	width:85%;
	height:auto;
	border-radius:50%;
	box-shadow: 0 6px 20px 0 rgba(0, 0, 0, 0.8)
	}

#imagecenter{
	text-align: center
	}

/*styling Conact Form iframe*/
#contact {
	width:100%;
	}


/*sub_heading styling*/
.sub_heading {
    font-family: 'robotot';
	color:#593849;
	font-weight:bold;
	}

