               
/*@import "forms.css";
@import "container.css";*/ 


/**
 * Headlines {include file=layout/header.tpl.inc}
 */
#mainCol h1 {
	padding: 15px 0;
	color: #333333;
	font-size: 22px;
	font-weight: bold;          
	font-family: Arial, Helvetica, Verdana, sans-serif;
} 
#mainCol h1.headlines {
	padding-bottom: 0;
} 
#mainCol h2 {
	padding: 0;
	margin: 2px 0 5px 0;
	color: #666666;
	font-size: 18px;
	font-weight: normal;          
	font-family: Arial, Helvetica, Verdana, sans-serif;
} 
#mainCol h2.headlines {
	color: #171818;
}
h1 a.anchor, h2 a.anchor {
	text-decoration: none;
	cursor: default;
}
h1 a.anchor {
	color: #000000;
}
h2 a.anchor {
	color: #666666;
}
/*#mainCol h2.topline {
	padding: 0;
	color: #660033;
	font-size: 14px;
	font-weight: bold;
} */
#mainCol h3 {
	padding: 0px 0 0px 0;
	color: #171818;
	font-size: 14px;
	font-weight: bold;
	margin: 0px;
}
#mainCol h4 {
	padding: 6px 0 0px 0;
	color: #666666;
	font-size: 12px;
	font-weight: bold;
	margin-bottom:4px;
}

.htmlText {
	padding-bottom: 0px; 
	line-height: inherit;
}
.htmlText p {
	padding: 4px 0 8px 0;
	margin: 0;
}
.bigRed{
	font-size: 16px;
	color: #C61217;
	font-weight: bold;
}
/**
 * OBJECT: download link 
 */
#mainCol .downloadLink {
	margin: 5px 0 20px 0;
}
#mainCol .downloadLink .icon {
	float: left; 
	width: 50px; 
	margin-right: 10px;
	text-align: center;
	overflow: hidden;
}
#mainCol .downloadLink .descCont {
	float: left;              
	width: 430px;
}
#mainCol .downloadLink h4 {
	font-weight: bold;
	font-size: 12px;
	color: #454545;
}
#mainCol .downloadLink h4 a, #mainCol .downloadLink h4 a:visited {
	color: #454545;
}


/** ******************************************************** **
 *   IMAGES / IMAGES WITH TEXT 
 ** ******************************************************** **/
/**
 * img left/right aligned. 
 *  problem: not knowing the img width, the subtitle might stretch the whole div!  
 **/
.imgRightAlignedWithText {
	padding: 10px 0; 
}
.imgRightAlignedWithText .image {
	float: right;
	margin: 0 0 8px 15px;
}
.imgLeftAlignedWithText {
	padding: 10px 0; 
}
.imgLeftAlignedWithText .image {
	float: left; 
	margin: 0 15px 8px 0;
}
.imgRightAlignedWithText .image .subtitle, .imgLeftAlignedWithText .image .subtitle {
	padding-top: 3px;
	font-size: 11px;
	color: #666666;
	text-align: center;
}
  


.image1 {
	margin: 0 0 15px 0;
}
.image1 .subtitle {
 	padding-top: 5px;  
	font-size: 11px;
	color: #666666;
}
#rightCol .image1 .subtitle {
	text-align: center;
}  

/**
 * 2 images beside eo
 *  style1: as table (subtits same position)
 *	style2: as divs (subtit right below pic)  
 */
.image2 {
	margin: 5px 0 15px 0;
}
table.image2 {
	width: 100%;
	border: 0;
}
table.image2 tr td.left {
	padding: 0 5px 2px 0;
}
table.image2 tr td.right {
	padding: 0 0 2px 5px;
	text-align: right;
}
.image2 div.left, .image2 div.right {
	float: left;  
	width: 240px;
	text-align: center;
}
.image2 div.left {
	margin-right: 10px;
}
.image2 .subtitle {
	font-size: 11px;
	color: #666633;
}


.image3 {
	margin: 0;
}
.image3 div.imgFrame  {
	display: inline;
	padding: 0;
	margin: 0;
}
.image3 div.imgFrame img  {
	padding: 0;
	margin: 0;
	border: 0;
}
.image3 div.subtitle {
	padding: 5px;
	font-size: 11px;
	color: #666633;
}

/**
 * Distance 
 */
.distance {
  	height: 15px;
  	overflow: hidden;
	clear: both;
}

/**
 * OBJECT: separator
 * horizontal separator with 3 different styles ! 
 * 1 = 1px solid grey line 
 * 2 = 1px dotted grey line
 * 3 = ?
 */
.separator { height: 15px; }
.separator .style1 {
	height:  6px;
	border-bottom: 1px solid #cccccc; 
} 
.separator .style2 {
	height: 6px;
	border-bottom: 1px dotted #cccccc; 
} 
.separator .style3 {
	height: 6px;
	border-bottom: 1px solid #000000; 
} 


/* ***************************************************************** *
 *   IMAGE GALLERY (THUMBS LIST)
 * ***************************************************************** */ 
/**
 * div containing images opened in lightbox 
 */
.lightboxCont {
	display: inline;
	padding: 0;
	margin: 0;
}
#mainCol .imgGallery {
  	margin: 10px 0;
	padding: 10px 0;
}
#mainCol .imgGallery table.thumbs {
  	width: 100%;
	border: 0;
}
#mainCol .imgGallery table.thumbs tr td.pic {
  	width: 25%;
	padding: 1px;
	margin: 0;
	text-align: center;
}
#mainCol .imgGallery table.thumbs tr td .imgContainer {
	width: 180px;
	height: 140px;
	margin: 5px auto;
	padding: 5px;
	overflow: hidden;
	background: #F9F9F9;
	text-align: center;
	voice-family: "\"}\""; 
	voice-family: inherit;                                       
	width: 170px;
	height: 130px;
}
html>body #mainCol .imgGallery table.thumbs tr td .imgContainer {
	width: 170px;
	height: 130px;
}
#mainCol .imgGallery table.thumbs tr td div.desc {
	height: 25px;  
	overflow: hidden;
	font-size: 11px;
	color: #666666;
}
   
#mainCol .imgGallerySingleLine {
	width: 644px;
	overflow: auto;	
	overflow-x: auto;
  	overflow-y: hidden; 
}
#mainCol .imgGallerySingleLine .sep {
	margin: 10px 0;
	height: 2px;
	overflow: hidden;
	background: url(/images/objects/imgGallery/sep.png) center center no-repeat;
}
#mainCol .imgGallerySingleLine table.thumbs {
	width: 100%;
	border: 0;	
}
#mainCol .imgGallerySingleLine table.thumbs tr {
	text-align: center;
}



/*  ***************************************************************************  *
 *   CUSTOM (NON GENERIC) OBJECTS 
 *  ***************************************************************************  */


/* ***************************************************************** *
 *  LEFT COLUMN OBJECTS    
 * ***************************************************************** */ 
 
/**
 *   Left Col 
 */
#leftCol .distance {
	height: 15px;
}
/**
 *   Left Col Box mit Inhalten 
 */
#leftCol .greyBox {
	font-weight: normal;
	color: #000000;
	background-color: #E5E5E5;
	padding: 10px;
}
#leftCol .greyBox h4 {
	padding: 0;
	margin: 0 0 5px 0;
	color: #666666;
} 
#leftCol .greyBox h5 {
	padding: 0;
	font-weight: bold;
	color: #666666;
} 
#leftCol .greyBox  a {
	text-decoration: none;
	color: #C61217;
	font-size: 12px;
} 
#leftCol .greyBox  a:hover {
	text-decoration: underline;
	color: #C61217;
} 
#leftCol .greyBox .impText {
	padding: 0;
	color: #C61217;
	font-weight: bold;
}
#leftCol .greyBox .black a {
	text-decoration: underline;
	color: #000000;
	font-weight: bold;
}  
#leftCol .greyBox .black  a:hover {
	text-decoration: underline;
} 
#leftCol .greyBox .desc {
	font-size: 11px;
	color: #000000;
} 



