/*simple horizontal list*/

 #navlist li
 { display: inline;
 list-style-type: none;
 padding-right: 20px;
 background:#6B0C08;
 }
 
 #navlist li a:link 
 {color: #FFB31F;
 text-decoration:none}
 
 a:active 
 {color: #FFB31F;
 text-decoration: none;}
	

 #navlist li a:visited 
 {color: #99DC91;}
	

 #navlist li a:hover
 {color: #333;
 border-color: #090;
 background-color: #FFC;
 text-decoration: underline;}
 

/*This code dictates the background colour of the documents.*/
BODY {background-color: #FFFFFF;
margin-bottom:5%;
margin-left:5%;
margin-right:5%;
margin-top:5%; border:ridge;
border-with:thin;
border-bottom-color:#F2F2F2;
font-size:110%;}


.div {padding: 5%}


/*This is an example of a grouping of like elements, giving them all the same attributes - in this case, the Headings.*/
H1, H2 { font-family: "Arial", sans-serif;
	color: #003300;
	text-align: center;
	}
	
	/*makes the H3 not to touch the border line of the web page*/
H3 {padding-left: 2%;
}


/*This adds colour to the horizontal rule - only visible in Internet Explorer.*/
hr {color: #003300;}


/*Any formatting you want to use for every paragraph, is put into this code.*/
P {margin-left: 5%}


/*aligns text to the left margin*/
.align {text-align: left;}


/*creates a call out effect by indenting the text left and right, adding a border and background colour to the text*/
.code {
	border-style: double;
	border-width: medium;
	border-color: #003300;
	padding-top: 1%;
	padding-bottom: 1%;
	padding-left: 1%;
	padding-right: 1%;
	background-color: #6B0C08;
	color: #FFB31F;}

	
.div-nav {
	border-style: double;
	border-width: medium;
	border-color: #003300;
	padding-top: 1%;
	padding-bottom: 1%;
	padding-left: 1%;
	padding-right: 1%;
	background-color: #6B0C08;
	color: #CCC;
	text-align: center;
}

/*makes the small banners that divide the different sections, currently the white font color for the H2 is define whith a style on the html code*/
.div-sections {
	background-color:#f0f8ff;
	color:#FFF;
	font-size:100%;
	font-weight:bold;
	text-align:center;
}

/*makes the small banners for highliting the important sections; currently they are brown-redish background font color for the H2 is define whith a style on the html code*/
.highlights {
	background-color:#6B0C08;
	color:#FFF;
	font-size:95%;
	font-weight:bold;
	text-align:center;
}
	

/*indents text from the left % of the screen size*/
.indent {margin-left: 7%}


/*indents text 5% of the screen size from the left only*/
.indent2 {margin-left: 5%}


/*makes unordered lists lavander circles and applies the indentation to line up with the text on the page*/
.circle {list-style: circle;
	color: #003300;
	margin-left: 10%} 
	
	
/* makes unordered lists discs circles and applies the indentation to line up with the text on the page*/
.bullets {list-style: disc;
	color: #003300;
	margin-left: 10%}


/*If you want to take advantage of the ability to create your own emphasis style, you can do it here. In this case, we have turned the italic off and used bold or strong instead.*/
em {color: #003300;
	font-weight: bold;
	font-style: normal}

.footer {text-align:center}