/*==========================================================*
	Doc
	
	Site Width: 		990
	left/right Cols: 	160 == 150 plus 5 padding each side
	mainContent:		650 == 990 minus (2 margins of 170)
============================================================*/
body {
	margin:0px;
	padding:0px;
	background-color:#ffffff;
	font-family: Arial, Helvetica, Verdana, Tahoma, sans-serif;
	font-size:0.74em;
	line-height:1.4em;/* influences the vertical distance between menu items on left side (Spry Menus) level 0. */
	color:#666666;
	background: #f1f1f1 url(../../../resources/layout/images/bg_shadow.gif) repeat-y 50% 0%;
}
/*==========================================================*
	html tags
============================================================*/
table {
	position:relative;
	border: solid 0px Green;
	background-color: transparent;
	table-layout: fixed 
	}
td, th {
	font-size: 0.9em;
	text-align:left;
	vertical-align:top;
	}
	
table table td, table table th {
	font-size: 1.2em;
	text-align:left;
	vertical-align:top;
	}
	
#TProductGroups { line-height: 1.2em; letter-spacing:1px;}
#TProductGroups td { width:150px; border: 0px dotted Red; padding: 0px 0px 0px 0px;}

#TProductGroups img{ width: 150px; height: 54px; }	/* delete, does only work for IE7 but not IE8 or Moz */
.TableFitImg{ width: 150px; height: 54px; }		/* delete, does only work for IE7 but not IE8 or Moz */

.TColBox{
width:150px; border: 0px dotted Gray; padding: 0px 0px 0px 0px;
}

	
p {
	margin:10px 0;
	}

p.no-padding-no-margin {
	padding:0;
	margin:0;
	}
	
p.text-with-image-right {
margin: 0px 200px 0px 0px; padding: 0px 20px 0px 0px;
border: 0px solid #c1c1c1; 
}

p.flow-text-with-image-right {	/* not currently used but reserved for case where I want to flow the text block around the image */
margin: 0px 20px 0px 0px; padding: 0px 20px 0px 0px;
border: 0px solid #c1c1c1; 
}


p.text-with-image-left {
margin: 0px 20px 0px 200px; padding: 0px 20px;
border: 0px solid #c1c1c1; 
}
	
hr{
	color: #E5E5E5;
	background-color: #E5E5E5;
	height: 1px;
	border:0;
	margin:15px 0;
	_margin:10px 0;
	}
	
blockquote {
	padding:0 0 0 12px;
	margin:12px 0 0 0;
	background:url(../../../noresources/layout/images/bg-quote.png) no-repeat;
	}

blockquote p {
	margin:2px 0;
	}
	
cite {
	font-size:.85em;
	margin:0;
	padding:0 0 0 6px;
	}

fieldset {
	padding:15px;
	}
	
legend {
	color:#333333;
	padding:5px 3px 10px 3px;	
	}
code , textarea
{
    color: #000000;
    font-size: 11px;
    font-family: Courier New;
    /*white-space: normal;*/
    width:420px;
}

img{
	border: 0;
}

.textarea{
font-size: 12px;
}

em{
color:#586580;/*b6cded*/ font-size: 1.6em; font-weight: 700; letter-spacing: 1.2; font-style: normal;
}
strong{
color:#586580; font-weight: 700; letter-spacing: 1.2; font-style: normal;
}



/*======================*
	headings
========================*/
.headline-underlined {
display: block; color: #ed585a; font-size: 1.0em; font-weight:700; font-family: verdana, tahoma, sans-serif;
line-height: 1.4em; 
border-bottom: 1px solid #ccc;
}

h1, h2, h3, h4, h5, h6 {
color: #475573;
	font-size:1.4em;
	line-height:1.1em;
	margin:16px 0px 15px 0px;
}

h1 {

font-size:1.6em;
	margin-bottom:20px;
}



h1 span{
display:none;
}



#VMenu1 h1{ margin:0px; }

h2 {
	font-size:1.3em;
}

h3 {
	font-size:1.2em;
}
h3.headline-with-image-left {
margin: 6px 20px 6px 200px; padding: 0px 20px;
 border: 0px solid #c1c1c1;
}

h3.headline-with-image-right{
 margin: 6px 200px 6px 0px; padding: 0px 20px 0px 0px;
 border: 0px solid #c1c1c1;
}

h3.small {
	font-size:1.1em;
}

h4 {
	font-size:1.1em;
}

h5 {
	font-size:1.1em;
}

h6 {
	font-size:1em;
}

table h1{
margin: 0 0 0 0;
}
table strong {
color: #494f51;
}



a
{
	display: inline;
	cursor: pointer;
	background-color: transparent;	/* fs: #f1f1f1 matches background of left sidebar */
	color: #333;
	text-decoration: underline;
}
a:hover				/* prototyp 2.0 contains also: , a:focus*/
{
	background-color: #f1f1f1;
	color: #FFF;
}
a:active
{
	background-color: #f1f1f1;
	color: #FFF;
}






/*==========================================================*
	Outer Container
============================================================*/

#OuterMainBox
{
    position: static;
	margin-top: 0px;
	margin-left: 0px;
    display: block;
    width: 100%;
    height: auto;
    border: solid 0px Blue;
}
/*==========================================================*
	Header
============================================================*/


.HeaderContainerMP2{
	position: static; width: 100%; height: 90px; background-color: #494f51 /*#586580*//*#5b85ad*//*#033979*/;
}

.HeaderInnerContainer
{
	width: 990px;
	margin: 0 auto;
}
#Logo {
	position: relative; float: left;
	width:500px;
	height: 90px;
	margin-left: 44px;
}

#HeaderBlockRight{
	position:relative; float:right;
	background-color: #4f85c2/*#5b85ad #b6cded*/;
	width:155px; height:80px;
	padding: 5px 5px 5px 15px;
	font-size: 10px;
	color: #fff;
}
#HeaderBlockRight a 
,#HeaderBlockRight a:hover 
,#HeaderBlockRight a:visited
{
	color: #fff;
	font-weight: 700;
	background-color: transparent;
	border: 0;
}



/* === Horizontal Navs === */
.HeaderSubContainerMP2{	/* full width black bar which contains the DD Menu 1 which is in HorzNavBox */
	position: static; margin: 2px 0 2px 0; width: 100%;  height: 22px; background-color: #4f85c2/*#475573 #2c3246#000*/;
}
#HorzNavBox
{
width: 990px; height:20px; margin: 0 auto; position: static; 
}

#HorzNavBox .AlignRight
{
width: 730px; margin-left:211px; position: static; margin-top:0px; /* fits ca. 6 menu items */  background-color: #000;
}


.menuInfo{
background-color: #f1f1f1;
color: #a1a1a1;
}
/* 
#HorzNavTop
{   
width: 990px; height:14px; margin: 0 auto; position: static;
}

#HorzNavTop ul { margin: 0px; padding: 0px; }

#HorzNavTop ul li { margin: 0px;   padding: 0px;     display: inline;     list-style-type: none;     float: right; }

#HorzNavTop ul li a
{

    width: 100px; 
    display: block;
    margin: 0;
    text-decoration: none;
    color: #ffffff;
    font-size: 11px;
    line-height: 14px;
    font-weight: 700;
    text-indent: 11px;
    text-align: right;
    padding-right: 4px;
}
*/
/*==========================================================*
	Site Container
============================================================*/
#SiteContainer
{
    background-color: transparent;
    /*background: #ffffff  url(../../noresources/layout/images/bg-900x680_gradient.png) no-repeat;*//*bg_gray_sidebars_990x10.png*/
    background: #ffffff url(zzzimages/layout/333333_sidebars_990x10.png) repeat-y;
    
    width: 990px;
    
    position: relative; height:auto;
	overflow: auto;	/* needed in order to embrace all float elements that are longer than this containing div container */
    top: 1px;
    left: 0px;
    margin-left: auto;
    margin-right: auto;
    border-left: dashed 0px Pink;
	height:100%;
}







#SiteContainer .mainContent{
/* 634px == 774px plus 10px margin, if 2 columns */
/* 654px == 624px plus 10px margin, plus 20 width padding, if 3 columns */
position: relative; float: left; width: 774px; height: auto; padding: 10px; background-color: #fff; margin-right: 10px;
    border-left: solid 0px #a1a1a1;
	   border-right: solid 0px #a1a1a1;

}
#SiteContainer .LeftColBox{
/* 170px == 160px plus 10px margin */
position: static; float: left; width: 150px; height: 100%; padding: 5px;  margin-right: 10px;
    border: dotted 0px #a1a1a1;

}
#SiteContainer .RightColBox{
/* 160px  */
position: relative; float: right; width: 150px; height: auto; padding: 5px; 
    border-left: dotted 0px #a1a1a1;
		
}
#RightColBoxTopMP2{
position: static; width: 100%; height: 250px; background-color: #ffffff;

}
#RightColBoxBottomMP2{
position: static; top: 10px; width: 100%; height: auto; 
border: Yellow 0px dotted;
	
}

#RightColBoxInner01{
}

#SiteContainer .TextSection{
margin-right:40px;
border: 0px dotted Red;
}

/* ========================================================================================================
	FOOTER
	=======================================================================================================
*/

#FooterBox
{
    position: static;
    margin-left: auto;
    margin-right: auto;
    top: 4px; /*border: dotted 1px Gray;*/
    width: 990px; 
	background-color: #ffffff;

}
#FooterText
{
    width: 990px; 
 		border: 0px solid #ccc; 
    font-size: 10px;
    color: Gray;
    
    padding: 0;
    text-align: center;
}




#HorzNavBottom
{
    padding: 0px;
    background: #a1a1a1;
    margin-left: 1px;
    margin-top: 40px;
    min-width: 800px;
    width: 100%;
    height: 14px;
}

#HorzNavBottom ul
{
    margin: 0px;
    padding: 0px;
    width: 100%;
}

#HorzNavBottom ul li
{
    margin: 0px;
    padding: 0px;
    display: inline;
    list-style-type: none;
    float: right;
}

#HorzNavBottom ul li a
{
    width: 105px; /*height: 14px;*/
    display: block;
    margin: 0;
    text-decoration: none;
    color: white;
    font-size: 11px;
    font-weight: 700;
    text-indent: 11px;
	background-color: transparent;	border-top: 0px dotted #ffffff;
}





/* ========================================================================================================
	TABS
	=======================================================================================================
*/
/* === TabsBlock Container === */
#TabsBlock { margin-top: 30px; }
#TabsBlock td, th {
	font-size: 1.0em;
	text-align:left;
	vertical-align:top;
	}


/* ========================================================================================================
	MENU and Side
	=======================================================================================================
*/

/* === Section navigation in the right column container; especially treatment of link design === */
#VMenu1 {margin-top: 8px;}
#SectionNav {margin-top: 70px;}
#SectionNav a
{
	display: block;
	cursor: pointer;
	background-color: #f1f1f1;	/* fs: #f1f1f1 matches background of left sidebar */	border-top: 1px solid #ffffff; font-weight: 700; font-size: 11px;
	padding: 0.2em 0.15em; /* padding: 0.5em 0.75em; */
	color: #333;
	text-decoration: none;
}
#SectionNav a:hover, #SectionNav a:focus 
{
	background-color: #a1a1a1;
	color: #FFF;
}



.SectionContact { 
	font-size: 0.9em;
}
#SectionNav .SectionContact a
{
	display: inline;
	cursor: pointer;
	background-color: #f1f1f1;	/* fs: #f1f1f1 matches background of left sidebar */	border-top: 0px dotted #ffffff; font-weight: 500; font-size: 11px;
	color: #333;

	text-decoration: none;
}

#SectionNav .SectionContact a:hover, #SectionNav .SectionContact a:focus 
{
	background-color: #a1a1a1;
	color: #fff;
}


.ZoomContainer{
border: 0px dotted #c1c1c1; width:180px; height: 90px;
}
.ovrlay{
position:absolute; margin-left:170px;margin-top:70px;
}
.ZoomableImg{
position: static;

}
.ZoomableImg a, .ZoomableImg a:visited
{
	display: inline;
	cursor: pointer;
	background-color: #ffffff;	/* fs: #f1f1f1 matches background of left sidebar */	border-top: 0px dotted #ffffff;
	color: #333;
	text-decoration: none;
}
.ZoomableImg a.thickbox:hover, .TProductGroups a.thickbox:hover
{
	color: #FFF;
	background-color: #fff;
}
.ImgCapture{
font-size: 11px;
text-align:left;
}
.Height140{ height:140px;}
.Height160{ height:160px;}
.Height180{ height:180px;}

.RefImg{ float:left; width:200px; height:140px; margin:0px 30px 20px 0px; border: 1px #ccc solid; }







.mainContent a {  /* , #TProductGroups a (is included anyway) */
	display: inline;
	cursor: pointer;
	border-top: 0px dotted #ffffff;
	color: #5b85ad;
	text-decoration: none;
}


.mainContent a:hover, #TProductGroups a:hover
{
	background-color: #ffffff; /* prototyp 2.0 version: #a1a1a1;*/
	/*color: #FFF;*/	/* prototyp 2.0 version: uncomment this attribute */
}



.NavLinksWithinSection {
display: block;
width: 100%;
margin: 0px 0px 20px 0px;
}





.arrowRed {
	padding-left: 6px;
	background: transparent url(images/layout/sym_fullarrow_red.gif) no-repeat left center;
}



.RightColInfoBox a, .RightColInfoBox a:visited {
font-size: 11px;
	display: inline;
	cursor: pointer;
	background-color: #f1f1f1;	/* fs: #f1f1f1 matches background of left sidebar */	border-top: 0px solid #ffffff;
	color: #333;
	text-decoration: none;

}

.RightColInfoBox a:hover
{
	background-color: #a1a1a1;
	color: #FFF;
}

/* ========================================================================================================
	CONTENT design features
	=======================================================================================================
*/
.ImgText {
position:absolute; top: 0px; left:620px; z-index:100; font-size:20px; font-weight: 700; color: #a1a1a1; 
background: transparent url(images/layout/bg_white.png) no-repeat; 
width: 150px; height:250px; border: 0px dotted yellow;
padding: 0;
text-align:left;
}
.ImgText img {
width: 150px; height:250px;
}


.TitlePic {
position:absolute; top: 0px; left:170px; z-index:100; font-size:20px; font-weight: 700; color: #a1a1a1; 
background: transparent url(images/layout/bg_white.png) no-repeat; 
width: 450px; height:60px; border: 0px dotted Red;
padding: 15px 30px 10px 20px;
text-align:left;
}

#poster a, #poster a:visited, #poster a:hover 		/* no undelines for links */
{
	text-decoration: none;
}




.mainContent
{
		letter-spacing: normal;
		text-align: justify;
		word-spacing: normal;
}







/* ========================================================================================================
	ALTERNATIVE CONTAINER
	=======================================================================================================
*/
/* =================================================== 
	

*/
#SiteContainerB
{
    background-color: transparent;
    /*background: #ffffff  url(../../noresources/layout/images/bg-900x680_gradient.png) no-repeat;*/
    background: #ffffff url(images/layout/bg_gray_sidebars_990x10.png) repeat-y;
    
    width: 990px;
    
    position: relative; height:auto;
    top: 1px;
    left: 0px;
    margin-left: auto;
    margin-right: auto;
    border-left: dashed 1px Pink;
}
#SiteContainerB .LeftColBox  {
	position: absolute;
	top: 0px;
	left: 0;
	width: 150px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background: #EBEBEB; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 5px; /* padding keeps the content of the div away from the edges */
	height: auto;
}
#SiteContainerB .RightColBox  {
	position: absolute;
	top: 0px;
	right: 0;
	width: 150px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	background: #EBEBEB; /* the background color will be displayed for the length of the content in the column, but no further */
	padding: 5px; /* padding keeps the content of the div away from the edges */
}
#SiteContainerB .mainContent { 
	margin: 0 170px; /* the right and left margins on this div element creates the two outer columns on the sides of the page. No matter how much content the sidebar divs contain, the column space will remain. */
	padding: 0 10px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	border: 1px dotted Green;
	
	position: static;


}
#footer { 
	padding: 0 10px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
	background:#DDDDDD;
} 
#footer p {
	margin: 0; /* zeroing the margins of the first element in the footer will avoid the possibility of margin collapse - a space between divs */
	padding: 10px 0; /* padding on this element will create space, just as the the margin would have, without the margin collapse issue */
}







.fltrt { /* this class can be used to float an element right in your page. The floated element must precede the element it should be next to on the page. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* this class can be used to float an element left in your page */
	float: left;
	margin-right: 8px;
}







.clear {
	clear:both;
	height:20px;
	}
.Height40{
height: 40px;
}

.none {
    display:none;
}

.error {  
	color: #FF0000}



/* =========================================================================================
Special formatting
Note: can be outsourced into external stylesheet
*/


.gh-table{
width: 380px; float:left; margin-left: 20px;
}


/* =========================================
TABLE formatting Microsoft Contemporary style
 ==========================================
*/
.ms-contemp-main {
	border-style: none;
}
.ms-contemp-tl {
	font-weight: bold;
	color: black;
	border-left-style: none;
	border-right: 2.25pt solid white;
	border-top: 2.25pt solid white;
	border-bottom-style: none;
	
		text-align:center;
}
.ms-contemp-left {
	font-weight: normal;
	color: black;
	border-left-style: none;
	border-right: 2.25pt solid white;
	border-top: 2.25pt solid white;
	border-bottom-style: none;
		
	text-align:center;
	background-color: #CCCCCC;
}
.ms-contemp-top {
	font-weight: bold;
	color: black;
	border-left-style: none;
	border-right: 2.25pt solid white;
	border-top: 2.25pt solid white;
	border-bottom-style: none;
		
	text-align:center;
}
.ms-contemp-even {
	font-weight: normal;
	color: black;
	border-left-style: none;
	border-right: 2.25pt solid white;
	border-top: 2.25pt solid white;
	border-bottom-style: none;
	background-color: #CCCCCC;
	
	text-align:center;
}
.ms-contemp-odd {
	font-weight: normal;
	color: black;
	border-left-style: none;
	border-right: 2.25pt solid white;
	border-top: 2.25pt solid white;
	border-bottom-style: none;
	background-color: #F2F2F2;
		
	text-align:center;
}





.bggray
{
  	FONT-WEIGHT: 700;
    FONT-SIZE: 11px;
    COLOR: #444d6f;
    FONT-FAMILY: Arial, Verdana;
    BACKGROUND-COLOR: #d8d8d8;
}




.bgsteelblue
{
    FONT-WEIGHT: 700;
    FONT-SIZE: 12px;
    COLOR: #FFFFFF;
    BACKGROUND-COLOR: #5979AE;
    FONT-FAMILY: Arial, Verdana
}
