@charset "utf-8";
/* CSS Document */

body {
	background-color: #eeeeff;
}
#stage {
	margin: 51px auto 0 auto;
	padding: 51px 40px;
	width: 878px;
	border: 1px solid #ccc;
	background-color: #fff;
}
.logo-slab {
	background-image: url(../images/logo_slab.jpg);
	background-repeat: no-repeat;
	background-position: 580px 210px;
}
#header {
	height: 153px;
	width: 880px;
	clear: both;
}
#logo-ocad {
	width: 160px;
	clear: none;
	float: left;
}
#logo-ocad a img {
	border: none;
	text-align: left;
}
#site-title {
	width: 720px;
	clear: none;
	float: left;
}
#site-title a img {
	border: none;
	text-align: left;
	margin-top: 73px;
	float: right;
}
#main-panel {
	width: 880px;
	clear: both;
}
#content {
	color: #666;
	width: 720px;
	clear: none;
	float: left;
}
.column-left {
	width: 350px;
	clear: none;
	float: left;
	margin-right: 8px;
}
.column-right {
	height: 531px;
	width: 350px;
	clear: none;
	float: left;
	margin-left: 8px;
}
#content p {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: .8em;
	line-height: 1.75em;
	margin: 0 0 24px 0;
}
#content h2 {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: 0.8em;
	font-weight: bold;
	line-height: 1.75em;
	text-transform: uppercase;
	margin: 0 0 8px 0;
}
#content ul {
	margin: 24px;
}
#content li {
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size: .8em;
	line-height: 1.75em;
	margin: 8px;
	list-style-type: disc;
}
#content a {
	color: #333;
	text-decoration: underline;
}
#content a:hover {
	color: #999;
	text-decoration: none;
}
#content img {
	border: 1px solid #ccc;
	padding: 1px;
}
#footer {
	background-image: url(../images/bg_footer.jpg);
	background-repeat: repeat-x;
	height: 51px;
	clear: both;
	margin: 0 auto 51px auto;
	width: 960px;
}
#footer span {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .7em;
	color: #fff;
	line-height: 51px;
	margin: 0 0 0 40px;
}
ul#menu li {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: .7em;
	color: #333;
	line-height: 1.5em;
	list-style-type: none;
	padding: 0 8px;
}
ul#menu li a {
	color: #666;
	text-decoration: none;
	padding: 0 8px;
}
ul#menu li a:hover, a.menu-on {
	color: #999;
	text-decoration: none;
	padding: 0 8px;
	background-image: url(../images/icon_arrow.gif);
	background-repeat: no-repeat;
	background-position: left center;
}

/* OCAD Zen Navigation */
div#zen-navigation {
	/*
	background-image: url(../images/bg_side.jpg);
	background-repeat: no-repeat;
	background-position: left bottom;
	*/
	height: 443px;
	width: 160px;
	clear: none;
	float: left;
	margin: 5px 0;
	padding: 0;
}
div#zen-navigation ul#zen-ul {
	width: 160px; /* max width of the navigation */
	height: 160px; /* max height of the navigation */
	margin: 0 0 8px 0;
	padding: 0;
	position: relative;
	background-color: transparent;
	background-image: url(../images/sprite_zen_navigation.jpg); /* the entire navigation graphic */
	background-repeat: no-repeat;
}
div#zen-navigation ul#zen-ul li {
	margin: 0;
	padding: 0;
	list-style: none;
	position: absolute;
}
ul#zen-ul li,
ul#zen-ul a {
	height: 10px; /* max height of an individual navigation item image */
	display: block;
}
div#zen-navigation ul#zen-ul li a {
	text-indent: -9999px; /* throw text off-screen */
	text-decoration: none;
	overflow: hidden; /* required for Netscape */
}

/* individual navigation item specifics */
/* top: space down from the top. change as needed. */
/* width: max width of the individual item. change as needed. */
/* on: change as needed the vertical 'background-position' value with the cooresponding navigation item's a:hover vertical value i.e., nav5: -80px; */
ul#zen-ul #nav1 { top: 0px; width: 160px; }
ul#zen-ul #nav2 { top: 20px; width: 160px; }
ul#zen-ul #nav3 { top: 40px; width: 160px; } 
ul#zen-ul #nav4 { top: 60px; width: 160px; }
ul#zen-ul #nav5 { top: 80px; width: 160px; }
ul#zen-ul #nav6 { top: 100px; width: 160px; }
ul#zen-ul #nav7 { top: 120px; width: 160px; }
ul#zen-ul #nav8 { top: 140px; width: 160px; }

ul#zen-ul #nav1 a:hover, a.nav1-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px 0; /* horozontal, vertical positions. change vertical property as needed. */ }
ul#zen-ul #nav2 a:hover, a.nav2-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px -20px; }
ul#zen-ul #nav3 a:hover, a.nav3-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px -40px; }
ul#zen-ul #nav4 a:hover, a.nav4-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px -60px; }
ul#zen-ul #nav5 a:hover, a.nav5-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px -80px; }
ul#zen-ul #nav6 a:hover, a.nav6-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px -100px; }
ul#zen-ul #nav7 a:hover, a.nav7-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px -120px; }
ul#zen-ul #nav8 a:hover, a.nav8-on { background-color: transparent; background-image: url(../images/sprite_zen_navigation.jpg); background-repeat: no-repeat; background-position: -160px -140px; }