@charset "utf-8";
body { margin:0; padding:0; width:100%;}
html { padding:0; margin:0;}

/* main */
.main {width:100%; padding:0; margin:0 auto; background:#f1f1f1;}
.resize { width:985px; margin:0 auto;}

/********** header **********/
.header { background:url(images/header_bg.gif) top repeat-x; padding:0; margin:0 auto; }

.block_header {
	margin:0 auto;
	width:982px;
	padding:0;
	border-bottom:1px solid #3b3b3b;
	color: #FFF;
}
/* logo */
.logo { float:left; padding:0; margin:0; width:440px;}
/* menu */	
.menu { float:right; padding:30px 0 0 0; margin:0; width:430px;}
.menu ul {  padding:0; margin:0; list-style:none; border:0;}
.menu ul li { float:left; margin:0; padding:1px 1px 0 0; border:0;}
.menu ul li a { float:left; margin:0; padding:15px 10px; color:#000; font:bold 12px Arial, Helvetica, sans-serif; text-decoration:none;}
.menu ul li a:hover { color:#bb0c1d;}
.menu ul li a.active {color:#bb0c1d;}
/*top_sup*/
.top_sup { padding:0; margin:0; background:#000;}
.top_sup_resize { width:982px; margin:0 auto; padding:0;}
.top_sup_resize p { font:normal 11px Arial, Helvetica, sans-serif; color:#4d4d4d; padding:5px; margin:0; line-height:1.8em;}
.top_sup_resize span { font: normal 12px Arial, Helvetica, sans-serif; color:#9f9f9f;}
.top_sup_resize2 { width:982px; margin:0 auto; padding:20px 0;}
.top_sup_resize2 h2 { font: normal 32px Arial, Helvetica, sans-serif; color:#fff; padding:0 0 0 20px; margin:0; width:200px; float:left;}
.top_sup_resize2 p { width:540px; float:right; text-align:left; font:normal 11px Arial, Helvetica, sans-serif; color:#4d4d4d; padding:5px; margin:0; line-height:1.8em;}
/* search */
.search { padding:10px 0 0 0; margin:0; float:right; width:180px;}
.search form { display:block; float:right; padding:5px 0;}
.search span { display:block; float:left; background: url(images/search_bg.gif) left top no-repeat; width:114px; padding:0 5px; height:34px;}
.search form .keywords { line-height:14px; float:left; border:0; width:114px; padding:5px 0; height:14px; background:none; margin:0; font:normal 14px Arial, Helvetica, sans-serif; color:#9c9c9c;}
.search form .button { float:left; margin:0; padding:0;}
/********** slider **********/
.slider_top {
	background:#f1f1f1;
	margin:0 auto;
	padding:15px 0 0 0;
	height:auto;
}
/********** slider ref **********/
.slider_top_ref {
	background:#e8e8e8;
	margin:0 auto;
	padding:0 0 0 0;
	height:auto;
	width:982px;
}
/*header_text*/
.header_text { margin:0 auto; padding:0; width:982px;}
/********** block index **********/
.body { background: #f1f1f1;}
.body_resize { width:982px; margin:0 auto; padding:0;}
.body h2 { font:normal 30px Arial, Helvetica, sans-serif; color:#2a2a2a; padding:15px 5px; margin:0; border-bottom:1px solid #e1e1e1;}
.body h3 { font:normal 20px Arial, Helvetica, sans-serif; color:#2a2a2a; padding:15px 5px; margin:0; border-bottom:1px solid #e1e1e1;}
.body h4 { font:normal 18px Arial, Helvetica, sans-serif; color:#2a2a2a; padding:15px 5px; margin:0; border-bottom:1px solid #e1e1e1;}
.body p { font:normal 12px Arial, Helvetica, sans-serif; color:#5f5f5f; padding:10px 5px; margin:0; line-height:1.8em; text-align:justify;}
.body p span { color:#a4a4a4; font: normal 11px Arial, Helvetica, sans-serif;}
.body p.bodrded { border:1px solid #ebebeb; margin:5px 0; padding:10px 0;}
.body ul { list-style:none; margin:10px auto; padding:0;}
.body li { padding:5px 20px; margin:0; background:url(images/ul_li.gif) left no-repeat; font: normal 12px Arial, Helvetica, sans-serif; color:#5c5c5c;}
.body a { color:#bb0c1d; text-decoration:underline;}
.body a.bold { color:#fff; font:bold 11px Arial, Helvetica, sans-serif; background:#000; margin:0; padding:3px 5px; float:left; text-decoration:none;}
.body img { float:left; margin:15px 15px 15px 0; padding:0;}
.body img.port { float:left; margin:10px 15px; padding:0;}
.full  { width:952px; float:left; margin:0; padding:10px 15px;} 
.left  { width:310px; float:left; margin:0; padding:10px 15px;} 
.right  { width:600px; float:right; margin:0; padding:10px 10px 10px 15px;} 
.blog { width:270px; margin:10px auto; padding:10px 10px; border:8px solid #eaeaea; background:#f7f7f7;} 

/********** contact form **********/
#contactform { margin:0; padding:5px 10px;}
#contactform * { color:#F00;}
#contactform ol { margin:0; padding:0; list-style:none;}
#contactform li { margin:0; padding:0; background:none; border:none; display:block;}
#contactform li.buttons { margin:5px 0 5px 0;}
#contactform label { margin:0; width:110px; display:block; padding:10px 0; color:#5f5f5f; font: bold 12px Arial, Helvetica, sans-serif; text-transform:capitalize; float:left;}
#contactform label span { color:#F00;}
#contactform input.text { width:440px; border:1px solid #dcdcdc; margin:10px 0; padding:5px 2px; height:25px; background:#fff; float:left;}
#contactform textarea { width:440px; border:1px solid #dcdcdc; margin:10px 0; padding:2px; background:#fff; float:left;}
#contactform li.buttons input {
	border : solid 0px #e6e6e6;
	border-radius : 3px;
	moz-border-radius : 3px;
	-webkit-box-shadow : 0px 0px 2px rgba(0,0,0,1.0);
	-moz-box-shadow : 0px 0px 2px rgba(0,0,0,1.0);
	box-shadow : 0px 0px 2px rgba(0,0,0,1.0);
	font-size : 16px;
	color : #696869;
	padding : 1px 17px;
	background : #ffffff;
	background : -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(49%,#f1f1f1), color-stop(51%,#e1e1e1), color-stop(100%,#f6f6f6));
	background : -moz-linear-gradient(top, #ffffff 0%, #f1f1f1 49%, #e1e1e1 51%, #f6f6f6 100%);
	background : -webkit-linear-gradient(top, #ffffff 0%, #f1f1f1 49%, #e1e1e1 51%, #f6f6f6 100%);
	background : -o-linear-gradient(top, #ffffff 0%, #f1f1f1 49%, #e1e1e1 51%, #f6f6f6 100%);
	background : -ms-linear-gradient(top, #ffffff 0%, #f1f1f1 49%, #e1e1e1 51%, #f6f6f6 100%);
	background : linear-gradient(top, #ffffff 0%, #f1f1f1 49%, #e1e1e1 51%, #f6f6f6 100%);
	filter : progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#f6f6f6',GradientType=0 );

}
p.response { text-align:center; color:#F00; font: normal 11px  Georgia, "Times New Roman", Times, serif; line-height:1.8em; width:auto;}
/********** footer **********/
.footer { margin:0; padding:10px 0 0 0; background:#e8e8e8; border-top:1px solid #d9d9d9; }
.footer_resize { margin:0 auto; padding:10px 0; width:980px;}
.footer ul { margin:0; padding:20px 10px 10px 10px; list-style:none; float:left;}
.footer img { display:inline; margin:5px 10px; padding:0;}
.footer ul li { margin:0; padding:0 10px; float:left;}
.footer p { margin:0; padding:20px 20px 10px 20px; float:right; color:#6d6d6d; font:normal 12px Arial, Helvetica, sans-serif; line-height:1.8em;}
.footer a { color:#6d6d6d; font:bold 12px  Arial, Helvetica, sans-serif; text-decoration:none; line-height:1.8em;}
.footer a:hover { text-decoration:underline;}

p.clr, .clr { clear:both; padding:0; margin:0; background:none;}
li.bg, .bg { clear:both; border-top:1px solid #e2e2e2; padding:0; margin:10px 0; background:none; line-height:0;}

.sum_head {margin-bottom:10px;padding:10px;border: 1px solid #ddd;font: normal 14px Arial, Helvetica, sans-serif; text-decoration:none;color:#4d4d4d;cursor: pointer;}
.sum_head:hover {background-color:#FFE1DD;}

/********* tooltip *********************/
	.tooltip {
			border-bottom: 1px dotted #000000; color: #000000; outline: none;
			cursor: help; text-decoration: none;
			position: relative;
		}
		.tooltip span {
			margin-left: -999em;
			position: absolute;
		}
		.tooltip:hover span {
			border-radius: 5px 5px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px; 
			box-shadow: 5px 5px 5px rgba(0, 0, 0, 0.1);
			-webkit-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
			-moz-box-shadow: 5px 5px rgba(0, 0, 0, 0.1);
			font-family: Calibri, Tahoma, Geneva, sans-serif;
			position: absolute; left: 1em; top: 2em; z-index: 99;
			margin-left: 0; width: 250px;
			color: #494949;
		}
		.tooltip:hover img {
			border: 0; margin: -10px 0 0 -55px;
			float: left; position: absolute;
		}
		.tooltip:hover em {
			font-family: Candara, Tahoma, Geneva, sans-serif; font-size: 1.2em; font-weight: bold; display: block; padding: 0.2em 0 0.6em 0; color: #494949;
		}
		.classic { padding: 0.8em 1em; }
		.custom { padding: 0.5em 0.8em 0.8em 2em; }
		* html a:hover { background: transparent; }
		.classic {background: #FFFFAA; border: 1px solid #FFAD33;}
		.critical { background: #FFCCAA; border: 1px solid #FF3334;	}
		.help { background: #9FDAEE; border: 1px solid #2BB0D7;	}
		.info { background: #9FDAEE; border: 1px solid #2BB0D7;	}
		.warning { background: #FFFFAA; border: 1px solid #FFAD33; }
/********* tooltip *********************/


 /********* tooltip erweitert *********************/
    a.tooltip {outline:none;text-decoration:none;border-bottom:dotted 1px blue;}
    a.tooltip strong {line-height:30px;}
    a.tooltip > span 
    {
	    width:200px;
	    padding: 10px 20px;
	    margin-top: 20px;
	    margin-left: -85px;
	    opacity: 0;
	    visibility: hidden;
	    z-index: 10;	   
	    position: absolute;

	    font-family: Arial;
	    font-size: 12px;
	    font-style: normal;  
        	    
	    -webkit-border-radius: 3px;
	    -moz-border-radius: 3px;
	    -o-border-radius: 3px;
	    border-radius: 3px;
	    
	    
        -webkit-box-shadow: 2px 2px 2px #999;
	    -moz-box-shadow: 2px 2px 2px #999;		
	    box-shadow: 2px 2px 2px #999;	    
	    
    }
    
    /*a.tooltip > span:hover,*/
	a.tooltip:hover > span
	{
		opacity: 1;
		text-decoration:none;
		visibility: visible;
		overflow: visible;
		margin-top:5px;
		display: inline;
		margin-left: -210px;		
	}

	a.tooltip span b {
    
		width: 15px;
		height: 15px;
		margin-left: 200px;
		margin-top: -19px;
			
		display: block;
		position: absolute;

		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		transform: rotate(-45deg);
			
		-webkit-box-shadow: inset -1px 1px 0 #fff;
		-moz-box-shadow: inset 0 1px 0 #fff;
		-o-box-shadow: inset 0 1px 0 #fff;
		box-shadow: inset 0 1px 0 #fff;
			
		display: none\0/;
		*display: none;
	}
    
a.tooltip > span {
	color: #444444; 

	background: #FFFFFF;
	background: -moz-linear-gradient(top, #FFFFFF 0%, #DDDDDD 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFFFFF), color-stop(100%,#DDDDDD));
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FFFFFF', endColorstr='#DDDDDD',GradientType=0 );
	    
	border: 1px solid #999999;	     
}    
	  
a.tooltip span b {
	background: #FFFFFF;
	border-top: 1px solid #999999;
	border-right: 1px solid #999999;
}   
/********* tooltip erweitert ende *********************/

.clear,.clearer {clear: both;}
.clearer {
	display: block;
	font-size: 0;
	line-height: 0;
	height: 0;
}

.txt { font:normal 12px Arial, Helvetica, sans-serif; color:#5f5f5f; padding:10px 5px; margin:0; line-height:1.8em;
}

div.imageHold {
  padding: 0px 0px; /* damit der container die höhe des großen bildes annimmt */
  /* andere formatierung, z.B. zentrieren/etc: */
  /* .... */
}

div.imageHold div {
  float: left;
  width: 80px;
  height: 110px;
  /* ab hier kann man die abstände
  und sonstiges der bilder eintragen */
  margin-left: 5px;
}

div.imageHold img {
  width: 80px;  /* wir skalieren das große bild auf die kleine größe */
  height: 110px; /* um verpixelung beim vergößern zu verhindern       */
}

div.imageHold img:hover {
  position: absolute;
  margin-left: -85px; /* die hälfte des größenunterschiedes der bilder */
  margin-top: -220px;  /* hier genau so */
  width: 300px;       /* die weite beim vergrößern */
  height: 412px;      /* die höhe beim vergrößern */
}