@charset "UTF-8";
/* CSS Document */
body {
background: #f5f5f5;
background-image: url(img/bg.jpg);
background-repeat: repeat-x;
margin: 0;
}

p {
font-size: 85%;
font-family: Helvetica, Arial, sans-serif;
line-height: 1.5em;
text-align: left;
}

#container {
width: 800px;
margin: 0 auto;
border: #CCCCCC;
}

div#container {
margin-left: auto;
margin-right: auto;
}

#header {
display: block;
width: 495px;
height: 182px;
}

#navigation {
width: 800px;
height: 24px;
}

#text {
background: transparent;
margin-right: 40px;
margin-left: 40px;
margin-bottom: 10px;
padding: 5px;
}

.about a {
display: block;
width: 127px;
height: 24px;
background: url(img/nav/about.jpg) no-repeat;
float: left;
}

.events a {
display: block;
width: 88px;
height: 24px;
background: url(img/nav/events.jpg) no-repeat;
float: left;
}

.projects a {
display: block;
width: 90px;
height: 24px;
background: url(img/nav/projects.jpg) no-repeat;
float: left;
}

.reports a {
display: block;
width: 88px;
height: 24px;
background: url(img/nav/reports.jpg) no-repeat;
float: left;
}

.research a {
display: block;
width: 88px;
height: 24px;
background: url(img/nav/research.jpg) no-repeat;
float: left;
}

.final a {
display: block;
width: 310px;
height: 24px;
background: url(img/nav/final.jpg) no-repeat;
float: left;
}

#content {
background-image: url(img/content.jpg);
background-repeat: repeat-y;
width: 800px;
float: inherit;
}

#footer {
background-color: #183a43;
width: 800px;
height: 24px;
text-align: center;
}

#footer p {
text-align: center;
font-size: 65%;
color: white;
}

#space {
background: #FFFFFF;
width: 800px;
height: 40px;
float: inherit;
}

#title {
background-image: url(img/titles/who.png);
width: 188px;
height: 55px;
float: inherit; 
}

#footer a, #footer a:hover, #footer a:visited{
color: #FFFFFF;
text-decoration: underline;
}


a {
color: #163e44;
text-decoration: underline;
}

a:hover {
color: #6c8987;
text-decoration: none;
}

a:visited {
text-decoration: underline;
color: #6c8987;
}

.about a:hover {
background-position: -127px 0;
}

.events a:hover {
background-position: -88px 0;
}

.projects a:hover {
background-position: -90px 0;
}

.reports a:hover {
background-position: -88px 0;
}

.research a:hover {
background-position: -88px 0;
}

.twoColside #sidebar1 {
	float: left; 
	width: 24%;
	background: #EBEBEB;
	padding: 15px 0;
}

.twoColmain #mainContent { 
	margin: 0 20px 0 26%; /* the right margin can be given in percentages or pixels. It creates the space down the right side of the page. */
}