/*
* SEELE
* stylesheet.css
* 
* Author: Holger M. Stangl
* Company: Limeflavour | http://www.limeflavour.com
* Date: Februar 2009
*/


/*
* General Pre Settings
*
*/
* {
   margin: 0;
   padding: 0;
   border: 0;
}

ul, ol, dl {
  list-style: none;
}

img, fieldset { border: 0; }

a { color: #353535; text-decoration: none; }
a:hover { color: #aaa; text-decoration: none; }


/*
* General Helpers
*
*/
.killfloat {
	overflow: hidden;
	clear: both;
	font-size: 0;
	height: 0;
	}

.hidden {
	display: none;
	visibility: hidden;
	}

.invisible {
	display: inline;
	overflow: hidden;
	position: absolute;
	top: -1000px;
	left: -1000px;
	width: 0;
	height: 0;
	}




/*
* STRUCTURE
*
*/
body {
	font-family: Arial, Verdana, Helvetica, sans-serif;
	font-size: 101%;
	color: #353535;
	background-color: #fff;
	text-align: center;
	}

html>body { 
	font-size: 16px; /* Set correct font-size for safari browsers */
	}


/*
* Structure Elements
*
*/
#container {
	width: 990px;
	margin: 40px auto;
	text-align: left;
	background-image: url(../../files/static/images/gif/htg_container.gif);
	background-position: left top;
	background-repeat: repeat-y;
	}

#containerHeader {
	height: 245px;
	position: relative;
	background-image: url(../../files/static/images/gif/htg_header.gif);
	background-position: left top;
	background-repeat: no-repeat;
	}
	
#containerMain {
	padding: 25px 10px 0 20px;
	margin-bottom: 40px;
	position: relative;
	min-height: 425px;
	}

#containerMainB {
	position: relative;
	min-height: 575px;
	padding: 25px 10px 20px 20px;
	margin-bottom: 40px;
	}

#containerMarginalA {
	width: 250px;
	position: absolute;
	left: 20px;
	top: 25px;
	}
	
#containerMarginalB {
	float: left;
	width: 218px;/**/
	}

#containerMarginalC {
	float: left;
	width: 218px;
	}
	
#containerMarginalC .textBox {
	padding-left: 5px;
	}
	
#containerCenter {
	float: right;
	width: 641px;
	}
	
#containerCenterB {
	float: right;
	width: 718px;
	}

#containerBottom {
	position: relative;
	background-image: url(../../files/static/images/gif/htg_bottom.gif);
	background-position: left top;
	background-repeat: no-repeat;
	background-color: #fff;
	height: 65px;
	}



/*
* Navigation Elements
*
*/
#navigationMain {
	position: absolute;
	bottom: 0px;
	height: 25px;
	width: 990px;
	}

/* Navigation A */
.navigationA {
	padding: 7px 0 0 25px;
	float: left;
	}

.navigationA li {
	float: left;
	padding-right: 35px;
	}
		
.navigationA li a {
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	display: block;
	}

.navigationA li.active a {
	color: #aaa;
	}
	
.navigationSubCity {
	padding: 0 0 50px 0;
	}
	
.navigationSubCity h1 {
	margin: 0!important;
	padding: 0 0 15px 5px!important;
	white-space:nowrap;
	color: #353535;
	}

.navigationB {
	padding: 0 0 0 5px;
	margin-top: 37px;
	}



.navigationSubCity .navigationB {
	margin: 0;
	}
		
.navigationB li a {
	font-size: 11px;
	line-height: 16px;
	font-weight: bold;
	display: block;
	padding-bottom: 3px;
	}
	
.navigationB li.active a {
	color: #aaa;
	}
	

#navigationMeta {
	position: relative;
	height: 55px;
	}

.navigationKey {
	position: absolute;
	left: 1px;
	bottom: -1px;
	}
	
.navigationKey li {
	float: left;
	padding: 0 24px 6px 24px;
	position: relative;
	z-index: 11;
	background-image: url(../../files/static/images/gif/transparent.gif);
	}

.navigationKey li a {
	font-size: 14px;
	font-weight: bold;
	text-transform: uppercase;
	}
	
.navigationKeyB {
	display: none;
	background-image: url(../../files/static/images/png/htg_navKeyB.png);
	padding: 20px 20px 20px 24px;
	height: 124px;
	position: absolute;
	left: 0;
	top: 25px;
	z-index:1001;
	/*background-color: green;*/
	}
	
.navigationKeyB li {
	float: none;
	background-color: transparent;
	padding: 0 0 2px 0;
	}
	
.navigationKeyB li a {
	font-size: 12px;
	font-weight: bold;
	}
	
.navigationLanguage {
	position: absolute;
	right: 30px;
	bottom: 5px;
	}

.navigationLanguage li {
	float: left;
	font-size: 10px;
	font-weight: bold;
	text-transform: uppercase;
	padding: 0 5px 0 6px;
	background-image: url(../../files/static/images/gif/navService_seperator.gif);
	background-position: left 2px;
	background-repeat: no-repeat;
	}

.navigationLanguage li a {
	
	}

.navigationLanguage li.first {
	background-image: none;
	}

/* Navigation City DE */
.navigationCityDE {
	position: absolute;
	top: 0;
	left: 25px;
	}

.navigationCityDE li {
	float: left;
	padding-right: 20px;
	}
		
.navigationCityDE li a {
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	display: block;
	}
	

/* Navigation City DE */
.navigationCityGLOB {
	position: absolute;
	top: 0;
	right: 30px;
	}

.navigationCityGLOB li {
	float: left;
	padding-left: 20px;
	}
		
.navigationCityGLOB li a {
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	display: block;
	}
	
/* Navigation Service */
.navigationService {
	position: absolute;
	bottom: 0;
	left: 15px;
	}

.navigationService li {
	float: left;
	}
		
.navigationService li a,
.navigationService li span {
	padding: 0 11px 0 10px;
	font-size: 10px;
	text-transform: uppercase;
	background-image: url(../../files/static/images/gif/navService_seperator.gif);
	background-position: right 2px;
	background-repeat: no-repeat;
	}

.navigationService li.last a {
	background-image: none;
	}



/*
* Other Elements
*
*/
/* Logo */
#logoBox {
	right: 10px;
	position: absolute;
	top: 55px;
	width: 324px;
	height: 163px;
	border-top: 1px solid #858585;
	border-bottom: 1px solid #858585;
	}

#logoBox img {
	right: 25px;
	position: absolute;
	bottom: 15px;
	}
	
#keyvisualBox {
	/*left: 1px;
	position: relative;
	top: 55px;*/
	margin-left: 1px;
	border-top: 1px solid #858585;
	border-bottom: 1px solid #858585;
	width:655px;
	height:163px;
	z-index: 1;
	overflow: visible;
	}

#keyvisualBox img {
	z-index: 1;
	}

#search {
	padding: 5px 0 0 0;
	}

#search a {
	font-size: 11px;
	line-height: 16px;
	font-weight: bold;
	text-transform: uppercase;
	padding-right: 10px;
	float: left;
	}

#search input#searchBtn {
	border: none;
	padding: 2px 5px 0 0;
	width: auto;
	float: left;
	}

#search input#searchKey {
	border: 1px inset #858585;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #353535;
	padding: 1px 3px;
	width: 96px;
	float: left;
	margin-right: 0px;
	}
	
#search input#searchArrow {
	padding: 5px 6px;
	background-color: #ddd;
	}
	
	
	
	
.containerCenterBottom {
	position: absolute;
	bottom: 4px;
	right: 0px;
	width: 651px;
	}	

.linkBox {
	float: left;
	padding: 14px 0 0 0;
	}	

#containerCenterB .linkBox {
	position:absolute;
	top:15px;
	right:30px;
	}

.linkBox a {
	font-size: 11px;
	line-height: 16px;
	font-weight: bold;
	}

.paginationBox {
	float: right;
	text-align: right;
	padding: 10px 35px 0 0;
	font-size: 11px;
	line-height: 16px;
}

.paginationBox span {
	font-size: 11px;
	line-height: 16px;
	float: left;
	padding: 2px;
	margin-left: 5px;
}

.paginationBox span.pages {
	padding: 0;
}
	
.paginationBox span a {
	font-weight: bold;
	border-top: 2px solid #fff;
}

.paginationBox span.active a,
.paginationBox a.active {
	border-top: 2px solid #aaaaaa;
	color: #aaaaaa;
}

.paginationBox span a:hover,
.paginationBox a:hover {
	color: #aaaaaa;
}





.navigationFunctions {
	padding: 40px 0 0 5px;
	}
	
.navigationFunctionsInline {
	position: absolute;
	/*bottom: 20px;*/
	bottom: 5px;
	left: 20px;
	}
	
#containerProjectDetail .navigationFunctions {
	left: 5px;
	}
	
.navigationFunctions li a {
	font-size: 11px;
	line-height: 18px;
	display: block;
	font-weight: bold;
	}

.navigationFunctions li a:hover {
	/*color: #7e9db2;*/
	color: #aaa;
	}

.navigationFunctions li.active a {
	/*color: #7e9db2;*/
	color: #aaa;
	}
	


.containerThumb .thumbBox {
	float: left;
	width: 104px;
	padding: 0 0 5px 5px;
	font-size: 11px;
	}

.containerThumb .overImg {
	display: none;
	position: absolute;
	left: -10px;
	top: -15px;
	background-color: #ffffff;
	padding: 5px;
	z-index: 1001;
	}


/*
* General Content Styles
*
*/
h1 {
	font-size: 18px;
	font-weight: normal;
	color: #353535;
	padding: 0 0 15px 5px;
	}
	
h2 {
	font-size: 11px;
	line-height: 16px;
	padding-bottom: 16px;
	}
	
a.download {
	background-image: url(../../files/static/images/gif/icon_download.gif);
	background-position: left 5px;
	background-repeat: no-repeat;
	padding: 0 0 0 10px;
	}
	
.textBox {
	font-size: 11px;
	line-height: 16px;
	}
	
#containerMarginalA .textBox {
	padding: 0 0 15px 5px;
	color: #353535!important;
	}
	
.textBox h3 {
	font-size: 11px;
	line-height: 16px;
	margin-bottom: 5px;
	}

.textBox p {
	font-size: 11px;
	line-height: 16px;
	padding-bottom: 16px;
	}
	
.textBox p.meta {
	margin-bottom: 8px;
	border-top: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
	padding-top: 2px;
	color: #353535;
	}
	
.textBox ul {
	padding-bottom: 16px;
	}
	
.textBox ul li {
	font-size: 11px;
	line-height: 16px;
	background-image: url(../../files/static/images/gif/icon_list_bullet.gif);
	background-position: left top;
	background-repeat: no-repeat;
	padding: 0 0 0 16px;
	display: block;
	}

.textBox p a {
	/*color: #7E9DB2;
	color: #2e61a4;*/
	color: #aaa;
	}
	
.textBox p a:hover {
	text-decoration: underline;
	}
	
.textBox table {
	font-size: 11px;
	line-height: 16px;
	margin-bottom: 16px;
	}
	
.textBox table caption {
	font-weight: bold;
	text-align: left;
	margin-bottom: 5px;
	}
	
	

.downloadBox {
	padding-bottom: 16px;
	}

.downloadBox h3 {
	font-size: 11px;
	line-height: 16px;
	margin-bottom: 5px;
	}
	
.downloadBox p {
	font-size: 11px;
	line-height: 16px;
	}

.downloadBox p a {
	color: #aaa;
	}
	
.downloadBox p a:hover {
	text-decoration: underline;
	}
	
	
	
	
	
.containerImage {
	/*padding: 0 0 40px 0;*/
	text-align: right;
	}
	
.containerImage .imageBox {
	background-color: #fff;
	text-align: right;
	}





.containerFlash {
	width: 979px;
	height: 390px;
	/*margin: 55px 0 80px 0;*/
	margin: 25px 0 0 0;
	left:-19px;
	position: relative;
	}


.containerDetail {
	float: right;
	width: 636px;
	/*padding: 0 5px 30px 0;*/
	padding: 0 5px 20px 0;
	}

.containerDetail .textBox a {
	color: #aaa;
	text-decoration: underline;
	}
	
.containerDetail .textBox a:hover {
	text-decoration: none;
	}

.containerDetail .containerText {
	float: left;
	width: 298px;
	padding: 0 20px 0 0;/*24px*/
	}

.containerDetail .containerImage {
	text-align: left;
	width: 616px;
	padding: 0 20px 0 0;
	}
	
.containerDetail .containerText .imageBox {
	background-color: #ddd;
	margin-bottom: 11px;
	}

.containerDetail .containerImage .imageBox {
	background-color: #ddd;
	}
	
.containerDetail .imageBox p {
	background-color: #ddd;
	padding: 5px;
	font-size: 11px;
	line-height: 16px;
	position: relative;
	}
	
.containerDetail .imageBox p a.zoom {
	position: absolute;
	right: 5px;
	top: 5px;
	}
	
.containerDetail .imageBox p a.zoom:hover {
	text-decoration: underline;
	color: #353535;
	}





.containerPortal {
	padding-top: 75px;
	padding-left: 5px;
	overflow:hidden;
	}

.containerPortal .teaserBox {
	float: left;
	width: 298px;
	padding: 0 20px 20px 0;
	}
	
.containerPortal .teaserBox h2 {
	background-color: #aaa;
	color: #ffffff!important;
	padding: 2px 7px;
	text-transform: uppercase;
	}

.containerPortal .teaserBox h2 a {
	color: #ffffff!important;
	}

.containerPortal .teaserBox .textBox {
	padding: 7px 6px;
	border: 1px solid #aaa;
	height: 65px;
	}

.containerPortal .teaserBox .textBox p {
	padding-bottom: 0;
	}
	
.containerPortal .teaserBox .imageBox {
	background-color: #efefef;
	height: 125px;
	}
	
	
.containerPortal .colorCode1 h2 { background-color: #508F9F; }
.containerPortal .colorCode1 .textBox { border: 1px solid #508F9F; }
.containerPortal .colorCode1 .textBox p a { color: #508F9F; }

.containerPortal .colorCode2 h2 { background-color: #A6AC96; }
.containerPortal .colorCode2 .textBox { border: 1px solid #A6AC96; }
.containerPortal .colorCode2 .textBox p a { color: #A6AC96; }

.containerPortal .colorCode3 h2 { background-color: #CDC050; }
.containerPortal .colorCode3 .textBox { border: 1px solid #CDC050; }
.containerPortal .colorCode3 .textBox p a { color: #CDC050; }

.containerPortal .colorCode4 h2 { background-color: #23D7D2; }
.containerPortal .colorCode4 .textBox { border: 1px solid #23D7D2; }
.containerPortal .colorCode4 .textBox p a { color: #23D7D2; }




.containerList {
	padding: 0 0 20px 0;
	min-height: 372px;
	}

.containerList .teaserBox {
	padding: 0 20px 20px 0;
	}
	
.containerList .teaserBox .imageBox {
	padding: 0;
	float: right;
	width: 303px;
	}
	
.containerList .teaserBox .imageBox img {
	border: 1px solid #aaa;
	}
	
.containerList .teaserBox .textBox {
	padding: 0 20px 0 0;
	width: 298px;
	float:left;
	}

.containerList .teaserBox .textBox p,
.containerList .teaserBox .textBox h2 {
	padding: 0;
	}
	
.containerListC .teaserBox .textBox {
	padding: 0 20px 0 0;
	width: 601px;
	float: none;
	}




/* Project List */
.containerListB .teaserBox {
	min-height: 72px;
	display: none;/**/
	}
	
.containerListB .teaserBox .imageBox .thumbBox {
	padding-right: 5px;
	width: 96px;
	float: left;
	}

.containerListB .teaserBox .imageBox img {
	border: 0;
	z-index:1;
	background-color: transparent;
	}

.containerListB .teaserBox .imageBox .overImg {
	display: none;
	position: absolute;
	left: -25px;
	top: -25px;
	background-color: #ffffff;
	padding: 5px;
	z-index: 1001;
	overflow: visible;
	}




.containerListA {
	padding: 0 192px 24px 0;
	}

.containerListA .teaserBox {
	padding: 12px 0;
	border-top: 1px solid #aaa;
	}
	
.containerListA .firstChild {
	padding: 0 96px 12px 0;
	border-top: 0;
	}

.containerListA .teaserBox .textBox {
	padding: 0;
	}

.containerListA .teaserBox .textBox p {
	padding: 0 0 11px 0;
	}

.containerListA .teaserBox .textBox p.date,
.containerListA .teaserBox .textBox p.link {
	padding: 0;
	}




.formBox fieldset {
	margin: 0 0 20px 0;
	}
	
.formBox .formItem {
	margin: 0 0 2px 0;
	}

.formBox .formSubmit {
	padding-left: 140px;
	}	
	
.formBox .formLabel {
	float: left;
	width: 140px;
	padding-top:4px;
	font-size: 11px;
	}

.formBox .formLabel label {
	cursor: pointer;
	}
	
.formBox .formField {
	font-size: 11px;
	line-height: 16px;
	}
	
.formBox .formField input {
	border: 1px solid #C8C8C8;
	/*color: #666666;
	border:1px inset #858585;*/
	color:#353535;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 11px;
	padding: 2px 4px;
	width: 250px;
	margin-right: 2px;
	}

.formBox .formField .inputMini {
	width: 44px;
	margin-right: 2px;
	float: left;
	}

.formBox .formField .inputMidi {
	width: 194px;
	margin-right: 2px;
	float: left;
	}
	
.formBox .formField input.submit {
	background-image: url(../../files/static/images/gif/htg_form_submit.gif);
	background-position: right top;
	background-repeat: repeat-x;
	background-color: #333333;
	border: 0;
	color: #fff;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 11px;
	font-weight: bold;
	padding: 3px 20px;
	width: auto;
	margin-right: 14px;
	float: right;
	}

.formBox .formField textarea {
	border: 1px solid #C8C8C8;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 11px;
	padding: 2px 4px;
	width: 392px;
	height: 80px;
	overflow:auto;
	}

.formBox .formField select {
	border: 1px solid #C8C8C8;
	/*color: #666666;
	border:1px inset #858585;*/
	color:#353535;
	font-family: Arial,Helvetica,sans-serif;
	font-size: 11px;
	padding: 1px 1px 1px 2px;
	width: 260px;
	margin-right: 2px;
	}
	

.formBox .selectBox  {
	float: right;
	width:258px;
	margin-right: 17px;
}
	
.formBox .selectBox .selected {
	background-image: url(../../files/static/images/gif/htg_form_select.gif);
	background-position: right top;
	background-repeat: repeat-x;
	border: 1px solid #c8c8c8;
	color: #666666;
	cursor: pointer;
	font-size: 11px;
	padding: 3px 4px;
	width: 250px;
	z-index: 11;
}

.formBox .selectBox .optionBox {
	background-color: #ffffff;
	border: 1px solid #c8c8c8;
	display: none;
	margin-top: -1px;
	position: absolute;
	width: 258px;
	z-index: 111;
}

.formBox .selectBox .optionBox .option {
	color: #666666;
	cursor: pointer;
	display: block;
	font-size: 11px;
	padding: 3px 4px;
	width: 250px;
}

.formBox .selectBox .optionBox .optionSelected {
	background-color: #666666;
	color: #ffffff;
}

.formBox .selectBox .optionBox .optionHover {
	background-color: #666666;
	color: #ffffff;
}


.error { color: red; }
.errorBox { color: red; }
.mandatoryBox { color: #aaa; }
.readonly { background-color:#E9E9E9; }




.navigationGlosar {
	height: 20px;
	background-color: #b0b0b0;
	background-image: url(../../files/static/images/gif/htg_navGlosar.gif);
	background-position: left top;
	background-repeat: repeat-x;
	margin: 0 20px 0 5px;
	padding-left: 10px;
	}

.navigationGlosar li {
	float: left;
	font-size: 12px;
	font-weight: bold;
}

.navigationGlosar li a {
	color: #fff;
	padding: 3px 10px;
	display: block;
}

.navigationGlosar li a.active {
	color: #690F51;
	}
.navigationGlosar li a:hover {
	color: #353535;
	}




#containerMarginalD {
	width: 250px;
	padding:30px 0 0 5px;
	float: left;
	}

#containerMarginalD .textBox a {
	color: #353535;
	}

#containerMarginalD .textBox a:hover {
	color: #aaa;
	text-decoration: none;
	}

#glossarySearch {
	padding: 0 0 25px 0;
	width: 170px;
	}

#glossarySearch .formLabel {
	padding: 0 0 5px 0;
	font-size: 11px;
	font-weight: bold;
	}

#glossarySearch input#glossarySearchKey {
	border: 1px inset #858585;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #353535;
	padding: 1px 3px;
	width: 146px;
	float: left;
	margin-right: 0px;
	}
	
#glossarySearch input#glossarySearchArrow {
	padding: 5px 6px;
	float: right;
	background-color: #ddd;
	}


.containerGlossary {
	padding: 30px 25px 20px 0;
	}
	
.containerGlossary h1 {
	padding-left: 0;
	}
	
.containerGlossary .toogleBox {
	padding: 0 0 20px 0;
	}
	
.containerGlossary .toogleBoxDouble {
	padding: 0 0 20px 20px;
	margin-top: -10px;
	}
	
.containerGlossary .toogleBox h2 {
	padding: 0;
	}
	
.containerGlossary .toogleBox h2 a {
	background-image: url(../../files/static/images/gif/icon_plus.gif);
	background-position: left 1px;
	background-repeat: no-repeat;
	padding-left: 20px;
	font-size: 12px;
	color: #690F51;
	}
.containerGlossary .toogleBoxOpen h2 a {
	background-image: url(../../files/static/images/gif/icon_minus.gif);
	}
.containerGlossary .toogleBoxDouble h2 a {
	font-size: 11px;
	font-weight: normal;
	}
	
.containerGlossary .toogleBox h2 span {
	font-weight:normal;
	text-transform: lowercase;
	}
/*.containerGlossary h2 span.on { color: green; }
.containerGlossary h2 span.off { color: red; }*/

.containerGlossary .toogleBox .textBox {
	display: none;
	}

/*.containerGlossary .firstChild .textBox,*/
.containerGlossary .toogleBoxOpen .textBox {
	display: block;
	padding: 3px 60px 0 20px;
	}

.containerGlossary .toogleBox .textBox p {
	padding: 0;
	}

.containerGlossary .toogleBox .textBox p span {
	color: #aaa;
	/*display: block;
	padding-top: 3px;*/
	}
	
	
.containerRanking .pos { width:20px; float:left; padding-right:10px; text-align:right; }


.meta span {
	font-weight: bold;
	font-size: 13px;
	}
	
.meta span.structure {
	color: #508f9f;
	}
.meta span.faces {
	color: #a6ac96;
	}
.meta span.cover {
	color: #cdc050;
	}
.meta span.crystal {
	color: #23d7d2;
	}