/** 
 * Stylesheet fÜr sympatex
 * Created: 23.12.2008 by TH
 * last change: 02.01.2009 by TH
 * 
 * Farben:
 * Text-color: #999
 * Link-Farbe / Text blau: #99ccff (#79c0e3)
 **/

@import url("reset.css");

/* Layout of containers */
html, body{ 
 margin:0; 
 padding:0; 
 text-align:center; 
} 

body{
 color:#FFF;
 padding:0px 0px 20px 0px;
 font-family:Arial, Helvetica, sans-serif;
 background:#101010 url(../images/pagebg.gif) repeat-x top left;
}
 
#pageWidth{ 
 width:955px; 
 text-align:left;  
 margin-left:auto; 
 margin-right:auto;  
} 

#topDrop{
 background:transparent url(../images/navi_bg.png) repeat-x bottom left;	
 height:9px;
 margin-top:55px;
 width:940px; 
 margin-left:auto; 
 margin-right:auto;
 font-size:1px;
}

#wrapper{
 background:transparent url(../images/sitebg.png) repeat-y 0px 0px;
}

#wholeContent{
 width:940px; 
 text-align:left;  
 margin-left:auto; 
 margin-right:auto; 
 background:transparent url(../images/content_bg.jpg) no-repeat top center; 
 padding-top:140px;
 padding-bottom:40px;
}

#wholeContentStart{
 text-align:left;  
 margin-left:auto; 
 margin-right:auto; 
 padding-left:10px;
 padding-bottom:0px;
}

#wholeContentStart object,
#wholeContentStart img {
	display:block;
	margin-left:-2px;
}

#header{
 position:relative; 
 height:180px; 
 width:100%;
} 

#pageHeader{
 position:absolute;
 top:20px;
 width:955px;
}

#navigation{
 margin-left:166px;
 padding-top:22px;
 position:relative;
 z-index:120;
}
 
#leftCol{
 width:165px; 
 float:left; 
 position:relative; 
  }
 
#twoCols{
 width:775px; 
 float:right; 
 position:relative; 
 font-weight:normal;
 }
 
#rightCol{
 width:310px; 
 float:right; 
 position:relative; 
}

#rightCol .insidewrap, #leftCol .insidewrap{
 padding:2px 0px 0px 5px;
}

#mainCol {
	float: left; 
	display:inline; 
	position: relative; 
	width:455px; 
	padding-right:3px;
	border-right:1px solid #283f45;
}
#mainCol.bride {
	width:615px;
}
 
#footer {
	padding-top:13px;
	clear:both;
	background:transparent url(../images/footer_bg.png) repeat-x top left;
	width:940px;
	margin-left:auto;
	margin-right:auto;
	text-align:left;
	line-height:18px;
}
#footer img {
	vertical-align:middle;
}
 
/* standard elements coloring and sizes */
a, a:visited, a:link{
 color:#99ccff;
 text-decoration:none;
 font-weight:normal;
}

a:hover, a:active, .active a , a.active{
 color: #ff0000;
}


/* Logo */
#logo{
 position:absolute;
 left:0px;
 z-index:100;
}

#logo a{
 text-indent:-3000em;
 display:block;
 width:163px;
 height:85px;
 margin-left:15px;
 background:transparent url(../images/logo_sympatex.png) no-repeat 0px 0px;
}

/* Searchform */
#search{
 position:absolute;
 right:0px;
 text-align:right;
 width:174px;
 z-index:9999;
 margin:21px 8px 0px 0px;
}

#search #keywordlabel{
 float:left;
 font-size:11px;
 font-weight:normal;
 margin-top:5px;
 cursor:pointer;
}

#search #keywordwrap{
 float:left;
 background:transparent url(../images/searchfield_bg.png) no-repeat top left;
 padding:4px 4px 2px 3px;
 margin-left:4px;
}
#search input {
 padding:0px;
 margin:0px;
 background:transparent;
 border:none;
}
#search #keywordwrap input {
 padding:0px;
 margin:0px;
 font-size:9px;
 color:#FFF;
 background:transparent;
 border:none;
 z-index:999;
 width:100px;
}

*+html #search #keywordwrap {
	padding: 0px 4px 2px 1px;
	margin-top:-1px;
}
*+html #search #keywordwrap #keyword {
	margin-top:-15px;
}

/* navigation elements */

#navigation ul{
	position:relative;
}

#navigation li {
 float:left;
 background:url("../images/navileft.gif") no-repeat left top;
 margin:0px;
 padding:0px 0 0 5px;
}

#navigation a {
 display:block;
 background:url("../images/naviright.gif") no-repeat right top;
 padding:6px 15px 4px 11px;
 margin:0px;
 text-decoration:none;
 font-weight:normal;
 color:#99ccff;
 font-size:11px;
}

#navigation a:hover,
#navigation li a.active,
#navigation .sfHovera {
 color:#F00;
}

#navigation #current {
 background-image:url("../images/navileft_active.gif");
}

#navigation #current a {
 background-image:url("../images/naviright_active.gif");
 color:#F00;
 padding-bottom:5px;
}

#navigation ul.subnavi{
	background:transparent url(../images/secondnav_bg.gif) no-repeat top left;
	height:21px;
	/*width:599px;*/
	width:750px;
	position:relative;
	z-index:121;
}

#navigation .subnavi li,
#navigation .subnavi li a{
	/*background:transparent;*/
	background:transparent none repeat scroll 0 0;/* TH */
	padding-top:2px;
	padding-bottom:4px;/* TH */
	position:relative;
}

#navigation .subnavi ul {
	background:transparent url(../images/subnavi_bottom.gif) no-repeat bottom left;
	margin: 0;
	width: 109px;
	position: absolute;
	top: -999em;
	left: -1px;
	padding-bottom:8px;
	z-index:121;
}

#navigation .subnavi li:hover ul,
#navigation .subnavi li.sfHover ul {
	top:20px;
	margin-left:13px;
}

#navigation .subnavi ul li {
  border: 0;
  float: none;
  border-left:1px solid #283f45;
  border-right:1px solid #283f45;
  padding:0px;
  background:#000;
}

#navigation .subnavi ul li a{
	padding:3px 4px 2px 7px;
}

#navigation .subnavi .last ul { left:-30px; } /*fix overlap of last subnav elem - 10.03.09 */

#thirdLevelNav{
 position:absolute;
 /*left:-14px !important;*/
 left:-13px;
 background:transparent url(../images/thirdnavi.gif) no-repeat top left;
 width:130px;
 height:176px;
}

#thirdLevelNav ul{
 margin:10px 10px 0px 24px;
}

#thirdLevelNav ul li{
 border-bottom:1px solid #2a3f45;
 padding:8px 0px 7px 5px;
}

#thirdLevelNav ul li a{
 font-size:11px;
 font-weight:normal;
 display:block;
}


/* Breadcrumb navigation */
#breadcrumb{
 color:#999;
 font-size:11px;
 margin-left:165px;
 margin-bottom:5px;
}

#breadcrumb a, #breadcrumb a:visited{
 color: #999; 
 font-size:11px;
}

#breadcrumb a:hover ,
#breadcrumb span,
#breadcrumb a.active {
 color:#99ccff;
}

/* fonts and colors in twoCols*/
#twoCols h1{
 color:#f00;
 font-size:21px;
 margin:5px 0px 10px 0px;
 font-stretch:condensed;
 font-variant:normal;
 font-weight:normal;
 letter-spacing:0.8px;
 line-height:1.2em;
}

#twoCols h2,#twoCols h3, #twoCols h4{
 color:#99ccff;
 font-weight:normal;
 font-family:Arial, Helvetica, sans-serif;
}

#twoCols h2{
 font-size: 14px;
 margin:7px 10px 7px 0px;
 text-transform:uppercase;
 font-weight:normal;
 line-height:1.2em;
}

#twoCols h3, #twoCols h4{
 font-size: 12px;
 margin:7px 10px 7px 0px;
 text-transform:uppercase;
 font-weight:normal;
 line-height:1.2em;
}

#twoCols h4{
 font-size:11px;
}

#twoCols {
	color:#999;
/*	font-size:11px;*/
	font-size:12px;
	font-weight:normal;
	line-height:1.16em;
}
#twoCols p {
	margin:5px 10px 10px 0px;
	position:relative;
	clear:both;
	float:none;
}

#twoCols a.morelink{
 display:block;
 background:transparent url(../images/arrow_red.gif) no-repeat center left;
 padding-left:8px;
}

#twoCols .imgleft{
 float:left;
 display:block;
 margin:0px 10px 3px 0px;
}

/* tables and cells */
#twoCols table{
 margin:0;
 padding:0;
/* font-size:11px;*/
 font-size:12px;
 margin-right:10px;
}

#twoCols table h4 {
/*	font-size:11px;*/
	font-size:12px;
	margin:0;
	margin-bottom:4px;
	padding:0;
}

#twoCols table th {
 background-color:#292929;
 color:#78c1e4;
/* font-size:12px;*/
 font-size:13px;
 text-transform:uppercase;
 padding:6px 7px;
 white-space:nowrap;
 border-right:1px solid #000;
 border-left:1px solid #000;
}

#twoCols table td {
 color:#fff;
/* font-size:11px;*/
 font-size:12px;
 padding:4px 6px;
 border:1px solid #131d1f;
}

#twoCols table td.firstcol{
 background-color:#131d1f;
}

#twoCols table .fill td{
	font-size:1px;
	text-indent:-3000em;
	line-height:1px;
	border:none;
	padding:1px 0px;
}

#twoCols table .first td{
 border-top:1px solid #131d1f;
}

#twoCols #contactFormTable td{
 border-top:none;
}

#twoCols .greenbox {
	background-color:#131d1f;
	padding:10px;
	margin-right:10px;
	margin-bottom:10px;
}

#twoCols .greenbox p{
 color:#fff;
}

#twoCols p .white{
 color:#FFF;
}


/* big content box in mainCol*/
.mcontentbox, .mcontentboxfull{
 border:1px solid #2a3f45;
 background:#292929 url(../images/gradient_box_content.gif) repeat-x bottom left;
 margin-right:10px;
}

.mcontentboxfull{
 background:transparent;
}

.mcontentbox .textcontent{
 margin: 10px 10px 0px 160px;
}

.mcontentboxfull .textcontent{
 padding: 10px 10px 0px 10px;
 color:#999;
}

.mcontentbox .textcontent li,
.mcontentboxfull .textcontent li{
 background: transparent url(../images/arrow_blue.gif) no-repeat 0px 3px;
/* font-size:11px;*/
 font-size:12px;
 padding:0px 10px 5px 15px;
}

.mcontentbox .imgleft{
 float:left;
}

/* rightCol content elements like teaser and stuff*/
/*#rightCol .onecolcontent{
	width:130px;
}*/

#rightCol dd{
 color:#999;
 font-size:11px;
 line-height:1.12em;
 border-bottom:1px solid #2a3f45;
 padding:5px 5px 5px 13px;
 background:transparent url(../images/arrow_red.gif) no-repeat 0px 7px;
}

#rightCol dd.last{
 border:none;
}

#rightCol .teaser,
#mainCol .teaser {
 border:1px solid #2a3f45;
 position:relative;
 overflow:hidden;
}

#mainCol .teaser {
	width:143px;
	float:left;
	margin:0 8px 8px 0;
}

#rightCol .teaser img,
#mainCol .teaser img {
 border-bottom:1px solid #2a3f45;
}
*+html #rightCol .teaser img,
*+html #mainCol .teaser img {
 display:block;
}

#rightCol .teaser p,
#mainCol .teaser p {
 padding:7px 6px;
 background:#162d33 url(../images/teaser_paragraph_bg.gif) repeat-x bottom left;
 font-size:11px;
 color:#999;
 margin:0px;
}

#rightCol .teaser p.blue{
 background:#121e2e url(../images/teaser_paragraph_bg_blue.gif) repeat-x bottom left;
}

#rightCol .teaser p.grey{
 background:#242529 url(../images/teaser_paragraph_bg_grey.gif) repeat-x bottom left;
}

#rightCol .teaser a.morelink,
#mainCol .teaser a.morelink {
 /*position:absolute;
 bottom:0px;*/
 text-align:right;
 margin-left:99px;
 margin-bottom:0px;
 margin-top:-12px;
 position:relative;
}

#rightCol .twocolcontent .teaser a.morelink{
 margin-left:249px;
}

#rightCol .onecolcontent .teaser{
 margin-bottom:10px;
 position:relative;
}

#rightCol .onecolcontent{
 float:left;
 width:145px;
 margin-right:6px;
 overflow:hidden;
}

#rightCol .twocolcontent{
 width:293px;
}

#rightCol .second{
 margin-right:0px;
}

#rightCol .twocolcontent img{
 width:291px;
}

/*#rightCol .line {*/
.line {
	font-size:1px;
	height:3px;
	border-bottom:1px solid #2a3f45;
	margin:6px 0px 10px 0px;
	clear:both;
}

#rightCol p strong{
 color:#99ccff;
}

#rightCol .teaser p strong,
#mainCol .teaser p strong {
 text-transform:uppercase;
 display:block;
 margin: 0 0 4px 0;
 font-weight:normal;
}

/* form elements contact form*/
#contactForm label{
/* font-size:11px;*/
 font-size:12px;
 color:#999;
}

#contactForm .textinput,
#contactForm  textarea{
 border:1px solid #2a3f45;
 background:transparent;
 color:#999;
 width:200px;
 margin-bottom:15px;
 display:block;
}	

#contactForm .submit{
  background-color:#2a3f45;
  border:none;
  color:#78c1e2;
  padding:3px 10px;
  cursor:pointer;
}

#contactForm select{
	background-color:#FFF;
	color:#2a3f45;
	border:1px solid #2a3f45;
	width:220px;
}

#contactForm .selectionbox {
	width:46%;
	float:left;
	margin-bottom:10px;
}


/* Footer elements*/
#footer{
 color:#ff0000;
 font-size:11px;
}

#footer a{
 font-size:11px;
}

#footer span{
 color:#99ccff;
}

/* miscellanous */
.noborderleft, 
#twoCols table .noborderleft{
	border-left:none;
}

.noborderright,
#twoCols table .noborderright{
	border-right:none;
}

.alignright{
 text-align:right;
}
 
 /* *** Float containers fix *** */ 
.clearfix:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
 
.clearfix{display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
.clearfix{display: block;}
/* End hide from IE-mac */  

/* sitemap */
ul#sitemap li {
	padding:0px 10px 5px 15px;
	background: transparent url(../images/arrow_blue.gif) no-repeat 0px 4px;
}
ul#sitemap li ul li {
	border:none;
	background:none;
}
ul#sitemap ul {
	margin-top:4px;
}

/* downloadoverview */
#downloadoverview a.morelink {
	float:right;
	text-align:left;
	margin-top:-12px;
}

/* raw bordered table */
table.rawTableBorder,
table.rawTableBorder tbody,
table.rawTableBorder tfoot,
table.rawTableBorder thead,
table.rawTableBorder tr,
table.rawTableBorder th,
table.rawTableBorder td
{
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	outline: 0;
	vertical-align:middle;
	text-align:left;
	border-spacing: 2px;
}

/*printer styles*/ 
@media print{ 
	/*hide the left column when printing*/ 
	#leftCol{display:none;} 
	/*hide the right column when printing*/ 
	#rightCol{display:none;} 
	#twoCols, #mainCol{width:100%; float:none;}
}