@charset "UTF-8";
/* CSS Document */


    
    body {
    	font: 100% Verdana, Arial, Helvetica, sans-serif;
		font-size:10px;
    	background: #ffffff;
		background-color:#FFFFFF;
    	margin: 0; /* Es empfiehlt sich, margin (Rand) und padding (Auffüllung) des Body-Elements auf 0 einzustellen, um unterschiedlichen Browser-Standardeinstellungen Rechnung zu tragen. */
    	padding: 0;
    	text-align: center; /* Hierdurch wird der Container in IE 5*-Browsern zentriert. Dem Text wird dann im #container-Selektor die Standardausrichtung left (links) zugewiesen. */
    	color: #333333;
    }
	p{
		font: 100% Verdana, Arial, Helvetica, sans-serif;
		font-size:10px;
		color: #333333;
		margin:0px;
		padding:0px;
	}
	.para{
	font-size:11px;
	width:600px;
	text-align:justify;
	margin-bottom:10px;
	
	}
	.para_c{
	
	font-size:13px;
	width:600px;
	text-align:center;
	margin-bottom:10px;
	}
	._c{
		font-size:13px;
	}
	.leftColumn{
	border-right: 1px solid #cccccc;
	}
	.paraColumn{
	padding:5px;
	width:290px;
	vertical-align:top;
	
	}
	.para_mini{
	font-size:10px;
	width:150px;
	text-align:left;
	}
	.info{
	text-align:center;
	margin-left:10px;
	margin-top:0px;
	}
	#infoNav{
	margin-left:5px;
	width:135px;
	height:200px;
	float:left;
	
	
	}
	.inline{
	display:compact;
	}
	#infoNavHeader{
	height:40px;
	white-space:135px;
	background-color:#CCCCCC;
	background-image:url(graphics/info/infoNavHeader.png);
	background-repeat:no-repeat;
	line-height:40px;
	text-align:center;
	vertical-align:middle;
	color:#666666;
	font-size:1.2em;
	}
	.infoNavLine{
		height:40px;
	white-space:135px;
	background-color:#f3f3f3;
		border: 1px solid #dddddd;
		border-top: 1px solid #f9f9f9;
		border-left: 1px solid #fcfcfc;
		line-height:40px;
	text-align:center;
	vertical-align:middle;

	}
	#infoMain{
	width:600px;
	float:left;
	
	}
	#infoClose{
	clear:both;
	
	}
		a{
			color:#018528;
			font-size:10px;
			text-decoration:none;
			}
		a:hover{
		color:#333333;
			}
		a:active{
			color:#018528;
			font-size:10px;
			text-decoration:none;
		}
		h1{
		padding-bottom:2px;
	padding-top:2px;
	margin:0px;
	font-size:1.5em;
	}
	h2{
	
	font-size:1.3em;
	padding-bottom:5px;
	padding-top:2px;
	margin:0px;
	}
	h3{
	font-size:1.2em;
	color:#018528;
	}
	h4{
	font-size:1.1em;
	font-weight:normal;
	margin:0px;
	padding:5px;
	
	
	}
	img{
		border: 0px solid #cccccc;
	}
	table{
	padding:0px;
	margin:0px;
	}
	td{
	vertical-align:top;
	}
	
	.line{
	background-color:#CCCCCC;
	height:1px;
	width:100%;
	margin-top:5px;
	margin-bottom:5px;
	}
	.layout{
	background-image:url(graphics/layout.jpg);
	background-repeat:no-repeat;
	width:760px;
	height:160px;
	}
	.home{
	margin:0px;
	padding:0px;
	margin-top:5px;
	
	
	}
	#flash{
	margin-top:5px;	
	}
	
	#tech{
	width:439px;
	height:200px;
	border: 1px solid #cccccc;
	margin-left:1px;
	}
	#tec_header{
	background-image:url(graphics/layout.jpg);
	background-repeat:no-repeat;
	height:25px;
	width:446px;
	}
	.tecLine{
	background-color:#efefef;
	width:441px;
	height:50px;
	
	vertical-align:top;
	
	border: 1px solid #cccccc;
	border-top: 1px solid #fefefe;
	}

	
	.news{
	vertical-align:top;
	width:290px;
	
	margin-left:13px;
	}
	.news_header{
	background-image:url(graphics/news.jpg);
	background-repeat:no-repeat;
	width:290px;
	height:26px;
	text-align:right;
	line-height:26px;
	

	}
	.news_body{
	padding:5px;
	padding-top:0px;
	width:274px;

	margin-left:1px;
	border: 1px solid #cccccc;
	border-top-color:#FFFFFF;
	
	}
	.about_text{
	text-align:justify;
	padding:10px;
	
	
	}
	#about{
	
	font-size:11px;
	}
	.error{
	
	
	text-align:center;
	padding:100px;
	}
    .oneColFixCtrHdr #container {
    	width: 780px;  /* Mit einer Breite, die 20 Pixel unter der vollen Breite von 800 Pixel liegt, können Sie dem Browser-Chrome Rechnung tragen und gleichzeitig eine horizontale Bildlaufleiste vermeiden. */
    	background: #ffffff;
    	margin: 0 auto; /* Durch automatische Ränder (in Verbindung mit einer Breite) wird die Seite zentriert. */
    	border: 1px solid #fcfcfc;
    	text-align: left; /* Hierdurch wird die Einstellung text-align: center im Body-Element überschrieben. */
    }
    .oneColFixCtrHdr #header {
	background-color:#ffffff;
	height:60px;
	     /* Diese Auffüllung entspricht der linksbündigen Ausrichtung der Elemente in den divs, die darunter erscheinen. Wenn im #header anstelle von Text ein Bild eingesetzt wird, sollten Sie die Auffüllung entfernen. */
    }
	
    .oneColFixCtrHdr h1 {

    	margin: 0; /* Wenn Sie den Rand des letzten Elements im #header-div auf 0 einstellen, können Sie das Auftreten unerwarteter Abstände zwischen divs vermeiden. Wenn das div einen Rahmen hat, ist dies unnötig, weil dieser Rahmen die gleiche Wirkung hat. */
    	/* Durch die Verwendung der Auffüllung anstelle von Rändern lässt sich gewährleisten, dass das Element die Kanten des div nicht berührt. */
    }
    .oneColFixCtrHdr #mainContent {
		margin-left:10px;
		margin-right:10px;
		margin-top:0px;
		margin-bottom:0px;
    	padding: 0 20 px; /* padding (Auffüllung) bezeichnet den Innenabstand und margin (Rand) den Außenabstand der div -Box. */
    	    }
    .oneColFixCtrHdr #footer {
	
	padding-top:20px;
	background-image:url(graphics/footer.png);
	background-repeat:no-repeat;
	height:20px;
	
	text-align:center;

    	padding: 0 px; /* Diese Auffüllung entspricht der linksbündigen Ausrichtung der Elemente in den divs, die darunter erscheinen. */
 
    }
    .oneColFixCtrHdr #footer p {
    	/* Wenn Sie die Ränder des ersten Elements in der Fußzeile auf 0 einstellen, können Sie unerwartete Abstände zwischen divs vermeiden. */
    	font-size:0.9em;
		color:#666666;
		padding: 0px 0; /* Durch die Verwendung der Auffüllung bei diesem Element entsteht genau wie bei einem Rand ein Leerraum, aber ohne die potenziellen Abstandsprobleme. */
    } 
	ul#menu{
		margin:0px;
		padding:0px;
		width:800px;
	}
	#menu li{
		list-style:none;
		float:left;
		margin:0px;
		padding:0px;
	}
	#menu li h1{
		margin:0px;
		padding:0px;
		
	}
	#menu li a{
		outline:none;
		display:block;
		height:60px;
		width:140px;
	}
	#menu li a span{
		text-indent:-3333px;
		display:block;
		
	}
	#home_btn{
	width:200px;
	height:60px;
	background-image:url(graphics/nav/home.jpg);
	}
	.active{
	height:60px;
	}
	#shop_btn{
	width:140px;
	height:60px;
	background-image:url(graphics/nav/shop.jpg);
	background-repeat:no-repeat;
	}
	#products_btn{
	width:140px;
	height:60px;
	background-image:url(graphics/nav/products.jpg);
	background-repeat:no-repeat;
	}
	#info_btn{
	width:140px;
	height:60px;
	background-image:url(graphics/nav/info.jpg);
	background-repeat:no-repeat;
	}
	#about_btn{
	width:180px;
	height:60px;
	background-image:url(graphics/nav/about.jpg);
	background-repeat:no-repeat;
	}
	

   .product{
   height:120px;
  
   
   } 
   .grayBorder{
   border:1px solid #cccccc;
   
   }
   .grayBg{
   background-color:#999999; 
   }
   
   .facebook,.twitter{
	   display:inline-block;
	   height:16px;
	   width:16px;
	   margin:5px 6px 5px 0px;
	   overflow:hidden;
	   text-indent:3333px;
   }
   .facebook{
	   background:url(graphics/facebook.png) no-repeat;
   }
   .twitter{
	   background:url(graphics/twitter.png) no-repeat;
   }