/*

colors used:
olive for text-color and backgroundcolor header
limegreen for the mouseover of the links and text-color h1-h6
white for the links in the footer

*/

* { margin: 0px;	padding: 0px; outline-style: none; }

html, body{
	height: 100%;
  
}

body {
  background-color: #fff100;
}

body.blue {
  background-color: #7ec4f5; 
}

#site {
	position: relative;
	padding: 0px;
	width: 990px;
	min-height: 100%;
	height: auto !important;
	height: 100%;
	font: 11px arial, verdana, sans-serif;
	line-height: 16px;
	color: #000;
	background: url(pics/site-bg.gif) left top repeat ;
}


body.blue #site {
  background: url(pics/site-bg-blue.gif) left top repeat ;
}

/* ------------------------------------------------------------------------- Header */

#print_header {
	display: none;
}

#header {
	width: 990px;
	height: 100px;
  background-color: #fff100;  
}

body.blue #header {
  background-color: #7ec4f5;
}

body.blue #spacer {
  background-color: #7ec4f5;
}

#spacer {
  width: 990px;
  height: 40px;
  background-color: #fff100;
}

body.blue #header .logo {
  border-right: 1px solid #68a3cb; 
}

#header .logo {
  float: left;
  margin: 12px 0px 0px 0px;
  width: 250px;
  height: 75px;
  border-right: 1px solid #b7b037;
}

#header .logo a:link img, #header .logo a:visited img {
  border: 0px solid #fff;
}

body.blue #header .heading {
  border-right: 1px solid #68a3cb; 
}

#header .heading {
  float: left;
  margin: 12px 0px 0px 0px;
  padding: 0px 20px;
  width: auto;
  height: 75px;
  font-weight: bold;
  font-size: 11px;
  border-right: 1px solid #b7b037;
}

#header .page-title {
  float: left;
  margin: 14px 0px 0px 20px;
  text-transform: uppercase;
  font-size: 18px;
}

#header .page-title a.region-btn:link, #header .page-title a.region-btn:visited {
  float: left;
  margin-left: 10px;
  width: 57px;
  height: 21px;
  display: block;
  background: url(pics/region.gif) top left no-repeat;
}

#header .page-title a.region-btn.activelink, #header .page-title a.region-btn.active:visited, #header .page-title a.region-btn:hover {
  background: url(pics/region-active.gif) top left no-repeat;
}

#header .page-title a.education-btn:link, #header .page-title a.education-btn:visited {
  float: left;
  width: 79px;
  height: 21px;
  display: block;
  background: url(pics/education.gif) top left no-repeat;
}

#header .page-title a.education-btn.activelink, #header .page-title a.education-btn.active:visited, #header .page-title a.education-btn:hover {
  background: url(pics/education-active.gif) top left no-repeat;
}

/* ------------------------------------------------------------------------- Navigation */ 

/* ------------------------------------------------------------------------- Content */ 

#content {
  position: relative;
	padding: 0px 0px 60px 0px;
	width: 990px;
}

#content #navigation {
  position: relative;
  float: left;
  width: 250px;
  z-index: 5;
}

#content #navigation ul {
  margin: 0px 0px 0px 19px;
}

#content #navigation ul li {
  list-style-type: none;
  margin: 0px 0px 5px 0px;
}

#content #navigation ul li a:link, #content #navigation ul li a:visited {
  padding: 0px 3px 2px 3px;
  color: #000;
  text-decoration: none;
  font-size: 24px;
  text-transform: uppercase;
  border: 0px solid #fff;
}

#content #navigation ul li a:hover, #content #navigation ul li.current a:link, #content #navigation ul li.current a:visited {
  background-color: #000;
  color: #fff;
}

#content .content {
  position: relative;
  float: left;
  padding: 0px 20px;
  width: 487px;
/*  min-height: 550px;
  height: 100% !important;
  height: 550px;    */
  border-left: 1px solid #b7b037; 
  border-right: 1px solid #b7b037; 
  z-index: 5; 
  overflow: hidden;
}

body.blue #content .content {
  border-left: 1px solid #68a3cb;
  border-right: 1px solid #68a3cb;
}

#content .bg-image {
  position: absolute;
  z-index: 1;
  top: 180px;
  left: 0px;
}

#content .content .line {
  float: left;
  margin: 3px 0px 10px 0px;
  width: 100%;
  height: 1px;
  line-height: 0px;
  font-size: 0px;
  clear: both;
  background: url(pics/line-bg.gif) top left repeat-x;
}

body.blue #content .content .line {
  background: url(pics/line-blue-bg.gif) top left repeat-x;
}

#content .content .item {
  font-weight: bold;
  font-size: 14px;
}

#content .content .item a:link, #content .content .item a:visited, #content .content a.back-btn:link, #content .content a.back-btn:visited {
  padding: 0px 3px;
  border: 0px solid #fff;
  font-weight: bold;
}

#content .content .item a:hover, #content .content a.back-btn:hover {
  background-color: #000;
  color: #fff;
}

#content .content .column {
  float: left;
  padding-right: 10px;
  width: 152px;
}

#content .content .column a:link, #content .content .column a:visited {
  padding: 0px 3px;
  margin-bottom: 5px;
  line-height: 12px;
  border: 0px solid #fff;
  font-weight: bold;
  display: block;
  float: left;
  clear: both;
}

#content .content .column a:hover {
  background-color: #000;
  color: #fff;
}

#content .content .project {
  float: left;
  margin-right: 10px;
  width: 89px;
  height: 122px;
  overflow: hidden;
}

#content .content .project.last {
  margin-right: 0px;
}

#content .content .project .image {
  width: 89px;
  height: 100px;
  overflow: hidden;
}

#content .content .project .image.large {
  height: 110px;
}

#content .content .project .image.large img {
  margin-top: 0px;
}

#content .content .project .image a:link img, #content .content .project .image a:visited img {
  border: 0px solid #fff;
}

#content .content .project .link {
  margin-top: 5px;
  width: 89px;
}

#content .content .project .link a:link, #content .content .project .link a:visited {
  border: 0px solid #fff;
  width: 89px;
  height: 17px;
  display: block;
  float: left;
}

#content .content .project .link a:hover, #content .content .project .link a.active:link, #content .content .project .link a.active:visited {
  background-color: #000;
  color: #fff;
}

#content .content .project .link a.project_1:link, #content .content .project .link a.project_1:visited { background:url(pics/project1.gif) top left no-repeat; }
#content .content .project .link a.project_2:link, #content .content .project .link a.project_2:visited { background:url(pics/project2.gif) top left no-repeat; }
#content .content .project .link a.project_3:link, #content .content .project .link a.project_3:visited { background:url(pics/project3.gif) top left no-repeat; }
#content .content .project .link a.project_4:link, #content .content .project .link a.project_4:visited { background:url(pics/project4.gif) top left no-repeat; }
#content .content .project .link a.project_5:link, #content .content .project .link a.project_5:visited { background:url(pics/project5.gif) top left no-repeat; }

#content .content .project .link a.project_1.active:link, #content .content .project .link a.project_1.active:visited, #content .content .project .link a.project_1:hover { background:url(pics/project1-active.gif) top left no-repeat; }
#content .content .project .link a.project_2.active:link, #content .content .project .link a.project_2.active:visited, #content .content .project .link a.project_2:hover { background:url(pics/project2-active.gif) top left no-repeat; }
#content .content .project .link a.project_3.active:link, #content .content .project .link a.project_3.active:visited, #content .content .project .link a.project_3:hover { background:url(pics/project3-active.gif) top left no-repeat; }
#content .content .project .link a.project_4.active:link, #content .content .project .link a.project_4.active:visited, #content .content .project .link a.project_4:hover { background:url(pics/project4-active.gif) top left no-repeat; }
#content .content .project .link a.project_5.active:link, #content .content .project .link a.project_5.active:visited, #content .content .project .link a.project_5:hover { background:url(pics/project5-active.gif) top left no-repeat; }

h1, td h1 {font: 30px arial, verdana, sans-serif; font-weight: bold; color: #000; margin-bottom: 7px; line-height: 30px;}
h2, td h2 {font: 17px arial, verdana, sans-serif; font-weight: bold; color: #000; margin-bottom: 7px;}
h3, td h3 {font: 15px arial, verdana, sans-serif; font-weight: bold; color: #000; margin-bottom: 7px;}
h4, td h4 {font: 14px arial, verdana, sans-serif; font-weight: bold; color: #000; margin-bottom: 7px;}
h5, td h5 {font: 13px arial, verdana, sans-serif; font-weight: bold; color: #000; margin-bottom: 7px;}
h6, td h6 {font: 12px arial, verdana, sans-serif; font-weight: bold; color: #000; margin-bottom: 7px;}

#content a:link, #content a:visited {text-decoration: none; color: #000;  border-bottom: 1px solid #000;}
#content a:hover { border-bottom: 1px solid #000; }

table {margin: 5px 0px;}
td {
	font: 12px arial, verdana, sans-serif;
	line-height: 16px;
	color: #000;
}

#content img { margin: 10px 0px; }
#content img.left {	margin: 0px 10px 10px 0px; float: left; }
#content img.right { margin: 0px 0px 10px 10px; float: right; }

p { margin-bottom: 9px; clear: both;}

#content ul { margin: 10px 0px 10px 15px; list-style-type: disc;}
#content li { margin: 0px 0px 0px 15px;}
#content ol { margin: 10px 0px 10px 20px;}

/* ------------------------------------------------------------------------- Footer */ 

* html #footer {
	position: absolute;
	bottom: -1;
}

body.blue #footer {
  /*background-color: #7ec4f5;*/
}

#footer {
	position: absolute;
	bottom: 0;
	padding: 0px 0px;
	width: 990px;
	height: 55px;
  text-align: right;
	font: 10px arial, verdana, sans-serif;
  /*background-color: #fff100;*/
  z-index: 100;
}

#footer .right {
  width: 235px;
  float: left;
}

#footer a:link, #footer a:visited {
	text-decoration: none;
}

#footer a:link img, #footer a:visited img {
  border: 0px solid #fff;
}

#footer a:hover { color: limegreen; }

br.clear { height: 0px; font: 0px arial, verdana, sans-serif; line-height: 0px; clear: both; }