body{
	/* 
	children tend to inherit properties of parents/ancestor 
	eg: all tags will inherit this font family choice from the body tag
	*/
	font-family:"verdana";
	/*
	get rid of gaps at the edges of the viewport
	by reducing the body margin to zero
	*/
	margin:0px;
}
/*
--------------------------------
Change the bullets of a list	
OLs	
	list-style-type:upper-alpha;
	list-style-type:upper-roman;
	list-style-type:lower-alpha;
	list-style-type:lower-roman;	
ULs	
	list-style-type:circle;	
	list-style-type:square;
ULs and OLs
remove the bullets entirely...
	list-style-type:none;
use an image for bullets	
	list-style-image:url();
*/
ul{
	list-style-image:url("../images/bullet.png");			
}
ol{
	list-style-type:lower-roman;	
}


/*
----------------------------------
use width and height properties to 
alter the size of block elements
	width:300px;
	height:100px;
*/
.navigation_list_item{
	background-color:#6D748C;
	color:#FFFFFF;
	min-width:100px;
	padding:0px 10px;
	border-right: solid 1px white;
	line-height:50px;
	font-weight:bold;
	/* center the textual contents of a tag */
	text-align:center;
}
.navigation_list_item:first-of-type{
	border-left: solid 1px white;
}
.navigation_list_item:hover{
	background-color:#BB7365;
	
}
.navigation_link{
	color:inherit;
	text-decoration:none;
	display:block;
	min-width:inherit;
	height:50px;	
}
.navigation_link:hover{
	background-color:#BB7365;
}
/*
highlight the current page in navigation
with some distinctive styles
*/
#current_page{
	background-color:#DEADA1;
	color:#3C4663;
}
#nav_ul{
	/*
	remove bullet points
	*/
	list-style-type:none;
	/* 
	instead of inheriting the checkmark 
	of all ul tags (as defined above)
	we can over-ride the list-style-image: 
	*/
	list-style-image:none;	
	background-color:#3C4663;
	
	/*
	convert the vertical stack 
	of children block tag LIs into a horizontal
	flex display!
	*/
	display:flex;
}