/*
 * BASIC STYLES
 */

body {
	background-color:maroon; 
	font-family:Papyrus, Arial, sans-serif; font-weight:bold; 
	color: #CC9900; 
}

/* put a frame around pictures */
img {border-color:#FFCC33; border-width:4; border-style: ridge}

h1,h2,h3,h4,h5,h6 {font-family: Perpetua, Century Gothic, sans-serif; color: #FF6633}

em {text-decoration: none; color: #FF6633}

/* highlight links when cursor is over them */
a {font-weight: bold; color: #FF6633}
a:hover {font-weight: bold; color: yellow}
a:active {font-weight: bold; color: white}

/* FIX: tables look a bit messy by default. Let's make it easier to distinguish 
rows and columns in a table. */
td{
	padding: 10px;
}
th{
	color: #FF6633;
	padding: 10px;
	font-family: Perpetua, Century Gothic, Verdana, sans-serif;
	font-size: larger;
	text-align: left;
}

dt {
	color: #FF6633;
}

/* 
 * CUSTOM STYLES 
 */

/* buttons */
.button{
	background-color:black;
	border: medium outset #FFCC33;
}

/* tabs */
.tab{
	background-color:black;
	border: thin outset #FC3;
	border-bottom: none;
	padding: 5px 10px;
	margin: 0 5px;
}

/* images used for special purposes */
img.banner{
	border:none;
}
img.counter {border:none}
.contact img{
	border:none;
}

/* tables used as grids, i.e. with visible cells */
table.data{
	border:medium solid #FFCC33;
}
table.data td{
	border:medium solid #FFCC33;
}
table.data th{
	border:medium solid #FFCC33;
}

/*
 * SCREEN AREAS 
 */

#banner
{
	border: 4px outset #CC9900;
	background-color: black;
}
#footer{
	background-color: black;
	border: 4px outset #CC9900;
	padding: 0 10px;
}
#center{
	background-color: black;
	border: 4px outset #CC9900;
}
#left{
	background-color: #330000;
	border: 4px outset #CC9900;
}

/* NAVIGATION BARS */
.navbar{
	padding: 0;
	margin: 0;
}

.navbar a{
	text-decoration: none;
	font-family:Papyrus, Arial, sans-serif; font-weight:bold; 
	color: #F63;
	background-color:black;
	margin: 0;
	padding: 0 10px;
}
.navbar a:hover
{
	color: yellow;
	background-color:#666666;	
}
.navbar a:active{
	color: white;
}
/* mark the currently active page */
body#page1 .nav1,
body#page2 .nav2,
body#page3 .nav3,
body#page4 .nav4,
body#page5 .nav5,
body#page6 .nav6,
body#page7 .nav7,
body#page8 .nav8,
body#page9 .nav9
{
	color: yellow;
}


.navbar ul{
	list-style-type:none;
	padding: 0;
	margin: 0;
}

#left .navbar ul{	
	display: block;
	text-align: center;
	margin: 0 auto;
}

#left .navbar ul li{
	margin: 0 auto;
}

#left .navbar a{
	width: 110px;
	margin: 8px auto;
	padding: 3px 5px;
	border: 3px outset #CC9900;	
	text-align: center;
	display: block;
}


