/* 
 * Set up general fonts, sizes and colors 
 */
body {
	font-family : Arial;
}

h1 {
	font-size : 13pt;
	color : #656A72;
}

h2 {
	font-size : 13pt;
	font-weight : normal;
	color : #7B8694;
}

p #page-title {
	font-size : 12pt;
	font-weight : bold;
	color : #8C96A2;
}

p #page-description { 
	font-size : 10pt;
}


H4 .div-label {
	font-size : 10pt;
	font-weight : bold;
}

a .link-label {
	font-size : 10pt;
	font-weight : normal;
}

a .text {
	font-size : 8pt;
	font-weight : normal;
}

p #group-description {
	font-size : 10pt;
	font-weight : normal;
}

a {
	font-weight : bold;
	text-decoration : none;
	color : #4D4D4D;
}

#navigation-links a .link-label {
	font-size : 8pt;
	font-weight : normal;
}

/* 
 * Set up other general properties like padding/margins
 */
html, body, div, h1, h4, p, a { margin : 0px; padding : 0px; }

body {
	overflow : auto;
	background-repeat : no-repeat;
	background-position : bottom right;
}

h1 { padding-top : 5px; }

H4 .div-label {
	padding : 10px;
	margin-bottom : 5px;
}

a img {
	border-width : 0;
	background-repeat : no-repeat;
}

h1 #presentation-title { margin-left : 10px; }

div { overflow : visible; }
.page-content { overflow : visible; }

/*
 * Set up the body and decorative background for the content pages.
 * Note: the root page must override these settings for its own
 * background and navigation
 */
body {
	min-width : 850px;
	/* since IE doesn't support min-width, try expression */
	width:expression(document.body.clientWidth < 850? "850px": "auto" );	
}

#presentation-header {
	background-color : #BCCEE4;
	min-width : 850px;
	/* since IE doesn't support min-width, try expression */
	width:expression(document.body.clientWidth < 850? "850px": "auto" );
}

.page-content {
	min-width : 850px;
	/* since IE doesn't support min-width, try expression */
	width:expression(document.body.clientWidth < 850? "850px": "auto" );
}

#background-image {
	position : relative;
	height : 120px;
	width : 100%;
	background-image : url(graphics/background/content_background.jpg);
	background-repeat : repeat-x;
	text-align : left;
}

#curve-image {
	height : 120px;
	width : 600px;
	background-image : url(graphics/background/content_curve.gif);
	background-repeat : no-repeat;
	position : relative;
	left : 50%;
	margin-left : -300px;
}

/* 
 * Lay out the navigation links 
 * (Root page overrides many of these settings)
 */
#navigation-links {
	position : relative;
	top : -110px;
	left : 10px;
	height : 60;
	width : 98%;
}

#navigation-links a {
	width : 70px;
	height : 60px;
	position : absolute;
	top : 0;
	text-align : center;
}

#navigation-links a img, a#workbench a img {
	height : 40px;
	width : 40px;
	vertical-align : middle;
}

#navigation-links a .link-label { display : block; }

#navigation-links a .text { display : none; }

#navigation-links a#workbench .link-label {display : inline; }

#navigation-links a:hover { border-right : 5px; }

/* properties for each of the navigation-links  */
a#overview img { background-image : url(graphics/obj_32/overview_obj.gif); }
a#overview:hover img { background-image : url(graphics/obj_32/hovoverview_obj.gif); }

a#tutorials { left : 55px; }  
a#tutorials img { background-image : url(graphics/obj_32/tutorials_obj.gif); }
a#tutorials:hover img { background-image : url(graphics/obj_32/hovtutorials_obj.gif); }

a#samples { left : 110px; }
a#samples img { background-image : url(graphics/obj_32/examples_obj.gif); }
a#samples:hover img { background-image : url(graphics/obj_32/hovexamples_obj.gif); }

a#news { left : 170px; }
a#news img { background-image : url(graphics/obj_32/whatsnew_obj.gif); }
a#news:hover img { background-image : url(graphics/obj_32/hovwhatsnew_obj.gif); }

a#workbench { width : 200px; right : 0px; text-align : left;}
a#workbench span { display : inline; }
a#workbench img { background-image : url(graphics/obj_32/workbench_obj.gif); }
a#workbench:hover img { background-image : url(graphics/obj_32/hovworkbench_obj.gif); }

/* 
 * Lay out the page title and description 
 */
p { margin-left : 10px; } /* required in mozilla so the page description is properly indented */

/* don't display the page header, it is generated
 * into the wrong position.  use page-title instead */
#page-header { display : none; }

p #page-title {
	position : relative;
	top : -95px;
	margin-right : 10px;
}

p #page-description { 
	margin-right : 10px;
	position : relative;
	top : -80px;
	width : 100%;
}