body {
	background: #666666;
}

html, body, p, div, span, table, td, th, ul, ol, li, a {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #CCCCCC;
	text-decoration: none;
}

#form-login fieldset { /* we don't want the big white worder drawn around the login form, do we? */
	border: none;
}

.button { /* and we want to make a nice button... */
	border: 1px solid #CCCCCC;
	background: url(../images/button.gif) repeat-x;
	color: #CCCCCC;
}

img { /* no border around img */
	border: 0px;
}

.readon { /* italic text for 'read on...' */
	font-style: italic;
}

/* article title */
.contentheading {
	border-bottom: 1px ridge #697c45;
	font-size: 120%;
	font-weight: bold;
}

/* module titel */
h3 {
	font-size: 100%;
	font-weight: bold;
	text-transform: capitalize;
	background: #444444;
	border-top: 2px ridge #697c45;
	border-bottom: 1px ridge #697c45;
	height: 16px;
}

/* header */
.header {
	border: 1px ridge #697c45;
	background: url(../images/header.gif) right no-repeat #2A2A2A;
	height: 144px;
	margin-bottom: 10px;
}

/* vertical menu - very basic, just for fun... */
.vertmenu {
	font-weight: bold;
	text-align: right;
	float: right;
	width: 200px;
	display: block;
}

.vertmenu ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}

.vertmenu ul li { /* main menu items styling */
	border-bottom: 1px ridge #697c45;
	border-left: 1px ridge #697c45;
	background: url(../images/menubg.png);
}

.vertmenu li ul { /* fix for IE applied in index.php (submenu's need to be a little higher) */
	float: left;
}

.vertmenu li ul li { /* submenu's styling */
	text-align: left;
	display: none;
	width: 75px;
	border-bottom: 1px ridge #697c45;
	border-right: 1px ridge #697c45;
	background: url(../images/menubg.png);
}

.vertmenu li:hover ul li { /* IE6 only accepts hover on <a>, so if you want this to work, you'll need to figure out a fix */
	display: block; /* hint: check menu, (markup based on <a>, edit it to look like this and it'll work) */
} /* end vertical menu */

/* horizontal menu */
.hormenu {
	text-indent: 5px;
	font-weight: bold;
	height: 80px;
}

.hormenu ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}

.hormenu li { /* styling the menu goes here - everything also applies for submenu, so override there if not wanted there... */
	float: left;
	z-index: 999; /* this on top */
	width: 100px;
	border-left: 1px solid #697c45;
	background: url(../images/hormenu.gif) bottom right no-repeat #2A2A2A;
	height: 20px;
}

.hormenu li:hover { /* styling the menu:hover goes here */
	height: 30px;
}

.hormenu li ul { /* submenu position */
	position: relative;
	top: 16px; /* default: 14, height menu item hover set so 30, so 30-14... */
	right: 1px;
}

.hormenu li ul li { /* styling the submenu goes here */
	display: none;
	background: url(../images/hormenusub.gif) bottom right no-repeat #2A2A2A;
}

.hormenu li ul li:hover { /* styling the submenu:hover goes here */
	height: 20px;
	background-color: #444444;
}

.hormenu li:hover ul li { /* submenu's show when main item hovered - IE6 only accepts hover on <a> */
	display: block; /* so if you want this to work, you'll need to figure out a fix (javascript) */
} /* end horizontal menu */

/* banner */
.banner {
	float: left;
}

/* title for in containers */
.titlecontainer {
	color: #2A2A2A;
	padding: 2px;
	font-size: 14px;
	font-weight: bold;
	height: 23px;
	background: url(../images/title.png) repeat-x bottom #697c45;
}

.pathway { /* breadcrumbs... */
	font-size: 14px;
	font-weight: bold;
	color: #2A2A2A;
}

/* left menu */
.containerleft {
	background-color: #2A2A2A;
	border: 1px ridge #697c45;
	position: absolute;
	left: 10px;
	width: 200px;
	z-index: 1;
}

/* right menu */
.containerright {
	background-color: #2A2A2A;
	border: 1px ridge #697c45;
	position: absolute;
	right: 10px;
	width: 200px;
	z-index: 1;
}

/* middle without left/right side */
.containermiddle__ {
	background-color: #2A2A2A;
	border: 1px ridge #697c45;
	position: absolute;
	left: 10px;
	right: 10px;
	z-index: 1;
}

/* middle without left side */
.containermiddle__1 {
	background-color: #2A2A2A;
	border: 1px ridge #697c45;
	position: absolute;
	left: 10px;
	right: 222px;
	z-index: 1;
}

/* middle without right side */
.containermiddle_1_ {
	background-color: #2A2A2A;
	border: 1px ridge #697c45;
	position: absolute;
	left: 222px;
	right: 10px;
	z-index: 1;
}

/* middle with both sides */
.containermiddle_1_1 {
	background-color: #2A2A2A;
	border: 1px ridge #697c45;
	position: absolute;
	left: 222px;
	right: 222px;
	z-index: 1;
}

/* latest articles + most popular articles */
.containerlatestpopular {
	height: 100px;
	list-style: url(../images/arrow.gif);
}

/* latest articles */
.latest {
	float: left;
}

/* most popular articles */
.popular {
	float: right;
}

/* latest+popular title */
.latest h3, .popular h3 { /* rest inherit from h3 */
	border-top: none;
	background: none;
}

/* newsflash */
.newsflash {
	font-weight: bold;
	margin-bottom: 10px;
}

/* footer */
.footer {
	margin-top: 10px;
	text-align: center;
	font-size: 10px;
	border-top: 1px ridge #697c45;
	background-color: #444444;
}

/* menu */
.stylemenu ul, .stylemenu li { /* main menu */
	list-style: none;
	margin: 0px;
	padding: 0px;
	display: block;
	width: auto;
}

.stylemenu ul li a, .stylemenu ul li a:link, .stylemenu ul li a:visited { /* main menu item (+ sub, so overwrite there...) */
	background: url(../images/link.gif) no-repeat;
	padding-left: 25px;
	padding-top: 3px;
	display: block;
	height: 16px;
}

.stylemenu ul li a:hover, .stylemenu ul li a:active, .stylemenu ul li a:focus { /* main menu hover */
	background: url(../images/hover.gif) no-repeat;
}

.stylemenu ul li.active a:link, .stylemenu ul li.active a:visited { /* main menu active */
	background: url(../images/active.gif) no-repeat;
}

.stylemenu ul li.active ul li { /* sub menu */
	margin-left: 10px;
}

.stylemenu ul li.active ul li a:link, .stylemenu ul li.active ul li a:visited { /* sub menu item */
	background: url(../images/link.gif) no-repeat;
}

.stylemenu ul li.active ul li a:hover { /* sub menu hover */
	background: url(../images/hover.gif) no-repeat;
}

.stylemenu ul li.active ul li.active a:link, .stylemenu ul li.active ul li.active a:visited { /* sub menu active */
	background: url(../images/active.gif) no-repeat;
} /* end menu */