/* Designed by Hawkins -- http://hawknam.net */
/*  Here we define the body of the page, what font it will use, what size of the font should be, what color will the text be, how it is aligned and if there's any margins */
body  {
	font: 84% Tahoma, Verdana, Arial, Helvetica, sans-serif;
	background: #2c2a2a;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #d4d8dc;
}
/*This is the definition of the second largest headline, size and it's color*/
h2 {

	color: #d4d8dc;

	font-size: 180%;

	margin: 0;

}
/*This is the definition of the third largest headline, size and it's color*/
h3 {

	color: #d4d8dc;

	font-size: 120%;

}
/*This is the definition of the fourth largest headline, size and it's color*/
h4 {

	color: #d4d8dc;

	font-size: 110%;

}
/*These next three definitions below define the way links are showed on the pages. First is the "regular" link which has not been visited or does not have a cursor over it.
in all occasions we define the color and if there's any decoration, like underlining. On the third a definition we give the link some new color and underline it so users 
know when they have moved the mouse over it and that it can be clicked.*/
a {

	color: #cb9224;
	text-decoration: none;

}

a:visited {

	color: #cb9224;
	text-decoration: none;

}

a:hover {

	color: #d4d8dc;
	text-decoration: underline;

}
/*Here we define the div which is used by the news page. We define  the background, color, border of the div, its position, text alignment and font color. We also give it
some padding, so that the text does not extend right to the edges of the div, making it easier to read.*/
div.news {

	background-color: #343f2e;
	border: 0px;
	top: 15px;
	text-align: left;
	color: #d4d8dc;
	height: 651px;
	width: 518px;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;

}

/*Same as the above, but this is the "container", which holds every other div. It has a different background (bamboo edges with green center). We also have different
text alignment here, shape and size  and the position of the div, which is relative to the whole webpage.*/

div.container {
	background: #2c2a2a url(img/bg.png) repeat-y 50% 0;
	top: 0px;
	left: 150px;
	height: 800px;
	width: 780px;
	margin: 0;
	padding: 0;
	text-align: center;
	color: #d4d8dc;
	position: absolute;
}

/*This is the top div which holds the banner and the links. The background is the banner itself, making the links easy to position correctly. The div has a small boder at the 
bottom and thus seperates the banner from the rest of the site, making it easier for the eye. Position of the top div is relative to the div in which it has been placed, 
and in this case it is the "container" div. And of course, we also define the shape and size of the div here.*/

div.top {
	color: #98947a;
	position: absolute;
	top: 10px;
	left: 15px;
	height: 98px;
	width: 750px;
	margin: 0px;
	padding: 0px;
	border-bottom: solid 1px #d4d8dc;
	background-color: #5f5348;
	background-image: url(img/topban.png);
}

/*This is the main div, or in other words, the info area. This div holds the main text of the site which changes according to the pressed links. Not all parts of the site 
open into this div though. As always, we define the position, margins, background, shape and size  and font color here. The position of the div is relative to the container div, like before.*/

div.main {
	position: absolute;
	top: 112px;
	left: 15px;
	height: 651px;
	width: 540px;
	background: #343f2e;
	margin: 0px;
	border: 0px;
	text-align: left;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}

/*This is the right side bar. It's not a navigation bar in its true sense, as it holds a small welcome message and a small linkable banner, which people can use to link
to the site. Position, background, shape and size and margins are also defined here, like before.*/

div.right {
	position: absolute;
	top: 112px;
	left: 564px;
	height: 651px;
	width: 195px;
	background: #5f5348;
	margin: 0px;
	border: 0px;
	text-align: left;
	padding-right: 3px;
	padding-top: 3px;
	padding-bottom: 3px;
	padding-left: 3px;
}

/*This is the footer, which holds the copyright information of the site. Again shape and size, position, background, font color and margins are defined. No text alignment
is defined and thus it uses the default from the body, which is center.*/

div.footer{
	position: absolute;
	top: 773px;
	left: 15px;
	height: 20px;
	width: 748px;
	background: #343f2e;
	margin: 0px;
	padding: 0px;
	border-bottom: solid 1px #d4d8dc;
	border-top: solid 1px #d4d8dc;
}