/* CSS File */

/*
	All selectors beginning with '* html' are for IE and will be ignored by firefox.
	The defined styles in selectors described above, override styles for the IE in selectors are not begin with '* html'.
	This way of implementation offers the possibility to design the site without the use of JavaScript
	to describe different styles for different browsers.
*/


/*
	CONTENT STYLES
*/

* html #contentMainBlock {

	top: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	
	border-top: 168px solid rgb(32, 32, 32);
	border-right: 32px solid rgb(32, 32, 32);
	border-bottom: 48px solid rgb(32, 32, 32);
	border-left: 256px solid rgb(32, 32, 32);

}


#contentMainBlock {
	display: block;
	position: absolute;
	
	top: 152px;
	right: 32px;
	bottom: 48px;
	left: 256px;
	
	background-color: rgb(0, 0, 0);

}

#contentBorderTop,
#contentBorderRight,
#contentBorderBottom,
#contentBorderLeft,
#contentCornerTopLeft,
#contentCornerTopRight,
#contentCornerBottomLeft,
#contentCornerBottomRight {
	display: block;
	position: relative;
	
	width: 100%;
	height: 100%;

}

#contentBorderTop {
	background-image: url(../images/layout/border_top_01.gif);
	background-position: 0 0;
	background-repeat: repeat-x;

}

#contentBorderRight {
	background-image: url(../images/layout/border_right_01.gif);
	background-position: 100% 0;
	background-repeat: repeat-y;

}
#contentBorderBottom {
	background-image: url(../images/layout/border_bottom_01.gif);
	background-position: 0 100%;
	background-repeat: repeat-x;

}
#contentBorderLeft {
	background-image: url(../images/layout/border_left_01.gif);
	background-position: 0 0;
	background-repeat: repeat-y;

}
#contentCornerTopLeft {
	background-image: url(../images/layout/corner_top_left_01.gif);
	background-position: 0 0;
	background-repeat: no-repeat;

}
#contentCornerTopRight {
	background-image: url(../images/layout/corner_top_right_01.gif);
	background-position: 100% 0;
	background-repeat: no-repeat;

}
#contentCornerBottomLeft {
	background-image: url(../images/layout/corner_bottom_left_01.gif);
	background-position: 0 100%;
	background-repeat: no-repeat;

}

* html #contentCornerBottomRight {
	padding: 24px;

}

#contentCornerBottomRight {

	background-image: url(../images/layout/corner_bottom_right_01.gif);
	background-position: 100% 100%;
	background-repeat: no-repeat;

}


* html #contentBlock, * html #metaContentBlock {
	position: relative;
	
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	
	border-top: 8px solid rgb(0, 0, 0);

}

* html #metaContentBlock {
	border-top: 32px solid rgb(0, 0, 0);

}

#contentBlock, #metaContentBlock {
	display: block;
	position: absolute;
	
	top: 32px;
	right: 12px;
	bottom: 12px;
	left: 12px;
	
	background-color: rgb(224, 224, 224);
	background-image: url(../images/layout/content_background_02.gif);
	background-repeat: repeat-x;

}

#metaContentBlock {
	top: 56px;

}



* html #content {
	position: relative;
	
	top: 0;
	left: 0;
	
	width: 100%;
	height: 100%;

}

/*
projectsContent is detailed specified in projects.css
the projectsContent-id selector is here only used to connect content styles from the main web page with project pages.
*/

#content {
	display: block;
	position: absolute;
	overflow: auto;
	
	padding: 16px;
	
	top: -1px;
	left: -1px;
	right: 0;
	bottom: 0;
	
	border: 1px solid rgb(119, 119, 119);
	/*
	background-color: rgb(238, 238, 238);
	*/
	
	color: rgb(32, 32, 32);
	font-size: 12px;

}


/* styles for enlarged images (will be displayed via JavaScript */

* html #enlargedBackground, * html #enlargedBackground2 {
	
	width: 100%;
	height: 100%;

}

#enlargedBackground {
	z-index: 16;
	display: block;
	position: absolute;
	
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	
	padding: 64px;
	
	background-image: url(../images/layout/enlarged_background_02.gif);

}

#enlargedBackground2 {
	z-index: 16;
	display: block;
	position: absolute;
	
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	
	padding: 64px;

}

* html #enlargedContentBackground, * html #enlargedContentBackground2 {
	position: relative;
	
	top: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	
	overflow: auto;

}

#enlargedContentBackground, #enlargedContentBackground2 {
	z-index: 16;
	display: block;
	position: absolute;
	
	top: 64px;
	right: 64px;
	bottom: 64px;
	left: 64px;
	
	padding: 32px 24px 24px 24px;
	
	border: 2px solid rgb(223, 171, 13);
	
	background-color: rgb(0, 0, 0);

}

#enlargedContentBackground {
	background-image: url(../images/layout/border_top_01.gif);
	background-position: 0 -2px;
	background-repeat: repeat-x;

}

#enlargedContentBackground2 {
	padding: 0;
	border: 0;

}

* html #enlargedTitle {
	top: 0;
	left: 24px;

}

#enlargedTitle {
	z-index: 4;
	display: block;
	position: absolute;
	
	top: -8px;
	left: 24px;
	
	width: 100%;
	height: 24px;
	
	padding-left: 4px;
	
	color: rgb(229, 188, 61);
	font-size: 13px;
	font-weight: bold;
	line-height: 32px;
	letter-spacing: 1px;

}

#enlargedImage {
	display: block;
	position: relative;
	margin-right: auto;
	margin-left: auto;
	/*
	width: 100%;
	height: 100%;
	*/
	
	border: 1px solid rgb(153, 153, 153);
	
	background-color: rgb(64, 64, 64);

}

* html #enlargedImageArea {
	position: relative;
	
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	
	width: 100%;
	height: 100%;
	
	overflow: auto;

}

#enlargedImageArea {
	display: block;
	position: absolute;
	overflow: auto;
	
	padding: 0;
	
	top: 32px;
	right: 24px;
	bottom: 24px;
	left: 24px;
	
	text-align: center;
	
	background-color: rgb(64, 64, 64);
}
/*
#image {
	display: none;
}
*/
a#closeButton {
	z-index: 5;
	display: block;
	position: absolute;
	
	top: 8px;
	right: 8px;
	
	width: 16px;
	height: 16px;
	
	background-image: url(../images/layout/close_button_01.gif);
	background-repeat: no-repeat;

}

a#closeButton:hover {
	background-image: url(../images/layout/close_button_over_01.gif);

}


/* formats for text and other media */
#content .topic,
#projectsContent .topic {
	display: block;
	/*
	min-height: 256px;
	*/
	margin-top: 0;
	padding-bottom: 18px;
	/*
	background-color: rgb(255, 0, 0);
	*/

}
#content table,
#projectsContent table {
	margin-left: 12px;
	border-spacing: 1px;
	
	color: rgb(32, 32, 32);
	font-size: 12px;
	
	border: 1px solid rgb(64, 64, 64);
	
	/*background-color: rgb(238, 238, 238);*/

}

#content table.frameless,
#projectsContent table.frameless {
	border-spacing: 12px;
	/*border: 1px solid rgb(128, 128, 128);*/
	border: 0;
	margin-bottom: 24px;

}

#content table.frameless th, #content table.frameless td,
#projectsContent table.frameless th, #projectsContent table.frameless td {
	padding: 12px;
	text-align: left;
	vertical-align: top;
	line-height: 14px;
	
	border: 1px solid rgb(128, 128, 128);

}

#content table.frameless td.empty,
#projectsContent table.frameless td.empty {
	border: 0;

}

#content table td, #content table th ,
#projectsContent table td, #projectsContent table th {
	padding: 12px;
	
	text-align: left;
	vertical-align: middle;
	line-height: 18px;
	
	border: 1px solid rgb(119, 119, 119);

}

#content table th ,
#projectsContent table th{
	padding: 6px;
	text-align: center;

}
#content table span ,
#projectsContent table span {
	display: block;
	line-height: 22px;

}

#content table a.pdf,
#content table a.osx,
#content table a.win,
#content table a.zip,
#projectsContent table a.pdf,
#projectsContent table a.osx,
#projectsContent table a.win,
#projectsContent table a.zip {
	display: block;
	line-height: 22px;
	padding-left: 22px;

}

#content table a.win,
#projectsContent table a.win {
	background-image: url(../images/layout/icon_windows_01.gif);
	background-position: 0 0;
	background-repeat: no-repeat;

}

#content table a.osx,
#projectsContent table a.osx {
	background-image: url(../images/layout/icon_mac_os_01.gif);
	background-position: 0 0;
	background-repeat: no-repeat;

}

#content table a.pdf,
#projectsContent table a.pdf {
	background-image: url(../images/layout/icon_pdf_01.gif);
	background-position: 0 0;
	background-repeat: no-repeat;

}
/*
.pdfLinkBoundingBox {
	display: block;
}
#content span.pdfLink {
	display: inline;
	height: 22px;
	
	padding-left: 0;
	padding-right: 22px;
	
	background-image: url(../images/layout/icon_pdf_01.gif);
	background-position: 100% 0;
	background-repeat: no-repeat;

}
*/
.fileLinkBox {
	display: block;
	
	padding-left: 12px;
	
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 12px;
	
	width: auto;
	height: 22px;
	
	background-image: url(../images/layout/link_arrow_01.gif);
	background-position: 0 5px;
	background-repeat: no-repeat;

}

#content a.pdfLink, #content a.zipLink,
#projectsContent a.pdfLink, #projectsContent a.zipLink {
	display: inline;
	padding-right: 22px;
	padding-top: 2px;
	padding-bottom: 2px;

}

#content a.pdfLink,
#projectsContent  a.pdfLink {
	background-image: url(../images/layout/icon_pdf_01.gif);
	background-position: 100% 0px;
	background-repeat: no-repeat;

}

#content a.zipLink,
#projectsContent a.zipLink {
	background-image: url(../images/layout/icon_zip_01.gif);
	background-position: 100% 0px;
	background-repeat: no-repeat;

}

#content h1,
#projectsContent h1 {
	padding-top: 0;
	padding-bottom: 8px;

	font-weight: bold;
	font-size: 16px;
}

#content h2,
#projectsContent h2 {
	padding-top: 20px;
	padding-bottom: 4px;
	padding-left: 12px;
	
	margin-bottom: 8px;
	
	font-weight: bold;
	font-size: 14px;

}

h2 span.superH2 {
	padding-left: 3px;
	vertical-align: super;
	font-size: 9px;
	color: rgb(172, 132, 11);

}

#content h3,
#projectsContent h3 {
	padding-top: 0;
	padding-left: 12px;
	margin-bottom: 0;
	
	font-weight: bold;
	font-style: italic;
	font-size: 12px;

}

#content p,
#projectsContent p {
	padding-top: 0;
	padding-bottom: 8px;
	padding-left: 12px;
	margin-top: 0;
	
	text-align: justify;
	/*
	background-color: rgb(102, 102, 102);
	*/

}
#content p.last,
#projectsContent p.last {
	margin-bottom: 16px;

}

.fixSizedBlock {
	display: block;
	height: 188px;

}

.fixSizedBlock2 {
	display: block;
	height: 320px;

}

.leftImage,
.rightImage,
.rightBlockImage {
	z-index: 5;
	display: block;
	position: relative;
	
	margin-bottom: 4px;
	padding: 3px;
	
	border: 1px solid rgb(153, 153, 153);

}

* html .leftImage {
	margin-left: 6px;

}

.leftImage {
	margin-right: 12px;
	margin-left: 12px;
	float: left;

}

.rightImage {
	margin-left: 12px;
	float: right;

}

.rightBlockImage {
	display: block;
	
	border: 0;

}

.rightBlockImage > img {
	display: inline;
	border: 1px solid rgb(153, 153, 153);

}

img,
img.middleImage,
img.largeImage {
	z-index: 5;
	border: 0;

}

img.middleImage {
	width: 240px;
	height: 160px;

}

img.largeImage {
	width: 480px;
	height: 320px;

}

* html #content ul,
* html #projectsContent ul {
	

}
* html #content ul.contentFollows,
* html #projectsContent ul.contentFollows {
	margin-bottom: -16px;

}

#content ul,
#projectsContent ul {
	z-index: 4;
	display: block;
	position: relative;
	
	margin-left: 12px;
	margin-top: 0;
	margin-bottom: 12px;
	
	padding-top: 0;
	padding-right: 16px;
	padding-bottom: 0;
	padding-left: 16px;
	
	list-style: none;
	list-style-position: inside;
	/*
	border: 1px solid rgb(179, 166, 126);
	
	background-image: url(../images/layout/background_dots_02.gif);
	*/

}

* html #content li, * html #content li.bold,
* html #projectsContent li, * html #projectsContent li.bild {
	padding-left: 0;

}


li span.superH2 {
	padding-left: 3px;
	vertical-align: super;
	font-size: 9px;
	color: rgb(172, 132, 11);

}

#content li, #content li.bold,
#projectsContent li, #projectsContent li.bold {
	display: block;
	list-style: none;
	
	
	padding-left: 16px;
	padding-bottom: 2px;

	background-image: url(../images/layout/list_bullet_01.gif);
	background-position: 0 4px;
	background-repeat: no-repeat;

}

#content li.bold,
#projectsContent li.bold {
	font-weight: bold;
	padding-bottom: 5px;

}

* html #content li.indent1,
* html #projectsContent li.indent1 {
	padding-left: 16px;

}

#content li.indent1,
#projectsContent li.indent1 {
	list-style: none;

	padding-left: 32px;
	padding-bottom: 2px;

	background-image: url(../images/layout/list_bullet_01.gif);
	background-position: 16px 4px;
	background-repeat: no-repeat;

}

#content a.arrowLink,
#projectsContent a.arrowLink {
	display: block;
	
	margin-top: 8px;
	margin-bottom: 8px;
	margin-left: 12px;
	
	width: auto;

}

#content a, #content a.arrowLink,
#projectsContent a, #projectsContent a.arrowLink {
	color: rgb(32, 32, 32);
	font-weight: bold;
	text-decoration: underline;

}

#content a:hover, #content a.arrowLink:hover,
#projectsContent a:hover, #projectsContent a.arrowLink:hover {

	color: rgb(172, 132, 11);
	text-decoration: none;

}

#content a.arrowLink,
#projectsContent a.arrowLink {
	
	padding-left: 12px;
	
	background-image: url(../images/layout/link_arrow_01.gif);
	background-position: 0 5px;
	background-repeat: no-repeat;

}

/* image swap for over state disabled for consistent design
#content a.arrowLink:hover {
	background-image: url(../images/layout/link_arrow_hover_01.gif);

}
*/

.boldText1 {
	font-weight: bold;
}

.italicText1 {
	font-style: italic;

}

.boldItalicText1 {
	padding-top: 2px;
	padding-left: 12px;
	font-weight: bold;
	font-style: italic;

}

.note1 {
	margin-left: 12px;
	font-style: italic;
}