/*
-----------------------
eecomputer CSS Design
(c) 2004-2014 EE Computer
----------------------- */

html {
	height: 100%;
	margin-bottom: 1px;
	font-size: 100%;
}
body {
	margin: 0;
	padding: 0;
	font-size: 75%; line-height: 1.3333333;	/* 16*0.75 = 12 line-height = 16  */
/*	font-size: 87.5%; line-height: 1.142857142857143;  16*0.875 = 14 line-height = 16  */
	font-family: Arial, Helvetica, sans-serif;
	background: #fe9;
}

table {
	font-size: 1em;
	font-family: Arial, Helvetica, sans-serif;
}

h2, h3 {
	font-family: Arial, Helvetica, sans-serif;
}
.pcenter {
	text-align: center;
}
.textcenter {
	text-align: center;
}
.textcentersmall {
	text-align: center;
	font-size: 0.8em;
}
.textsmall {
	font-size: 0.8em;
}

.clear {
	clear: both;
}

a {
	text-decoration: none;
	color: #f03;
	font-size: 1.0em;
	white-space : nowrap;
}
a:hover {
	text-decoration: underline
}
/* Header Logo */
#logo {
	position: absolute;
	right: 0px;
	width: 100px;
	margin: 0 0 0 0;
	padding: 5px 10px 0px 10px;
}
#logo img {
	display: block;
	margin: 0;
	padding: 0;
	border: none;
}

#logo h1 {
	display: none;
	margin: 0;
	padding: 0;
	font-size: 0.9em;
	text-align: center;
	color: #960;
}

/* Header */
#header {
	width: 100%;
	background: #FFCC33 url(layer2.jpg) no-repeat left top;
	background-position: left top;
	background-repeat: no-repeat;
	height: 90px;
	margin: 0px;
}
#pindex #header { background-image: url("../img/hindex2010.jpg"); }
#paktuelles #header { background-image: url("../img/haktuelles.jpg"); } 
#pshop #header { background-image: url("../img/hshop.jpg");} 
#ptinte #header { background-image: url("../img/htinte.jpg");} 
#pservice #header { background-image: url("../img/hservice.jpg");} 
#pnetzwerk #header { background-image: url("../img/hnetzwerk.jpg");} 
#ptreiber #header { background-image: url("../img/htreiber.jpg");} 
#phandel #header { background-image: url("../img/hhandel.jpg");} 
#pkontakt #header { background-image: url("../img/hkontakt.jpg"); }
#pdaten #header { background-image: url("../img/hdatenschutz.jpg"); }

/* Navigation uses Sliding Doors */
#navigation2 {
	float: left;
	width: 100%;
	
	margin: 0;
	padding: 0 0 0 0;
	border-bottom: 1px solid #da0;
	
	background: #FFCC33;
	background-repeat: no-repeat;
	background-position: 0 -90px;
}
#pindex #navigation2 { background-image: url("../img/hindex2010.jpg"); }
#paktuelles #navigation2 { background-image:  url("../img/haktuelles.jpg"); } 
#pshop #navigation2 { background-image: url("../img/hshop.jpg"); }
#ptinte #navigation2 { background-image: url("../img/htinte.jpg"); } 
#pservice #navigation2 { background-image: url("../img/hservice.jpg"); } 
#pnetzwerk #navigation2 { background-image: url("../img/hnetzwerk.jpg"); } 
#ptreiber #navigation2 { background-image: url("../img/htreiber.jpg"); } 
#phandel #navigation2 { background-image: url("../img/hhandel.jpg"); }
#pkontakt #navigation2 { background-image: url("../img/hkontakt.jpg");}
#pdaten #navigation2 { background-image: url("../img/hdatenschutz.jpg"); }

#navigation2 ul {
	margin: 0;
	padding: 2px 30px 0;
	list-style:none;
}

#navigation2 li {
	display: inline;
	margin: 0;
	padding: 0;
}

#navigation2 a {
	float: left;
	background: url("../img/nav_left.gif") no-repeat left top;
	width: .1em; /* Click region fix IE */
	margin: 0;
	padding: 0 0 0 9px;
	font-weight: bold;
	color: #960;
	text-decoration: none;
}

/* Make non IE Browser happy again */
#navigation2>ul a {
	width: auto;
}

#navigation2 a span {
	float:left;
	display:block;
	background: url("../img/nav_right.gif") no-repeat right top;
	margin: 0;
	padding: 5px 15px 4px 6px;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#navigation2 a span { float:none; }
/* End IE5-Mac hack */

#paktuelles #nav-aktuelles a,
#pshop #nav-shop a,
#ptinte #nav-tinte a,
#pservice #nav-service a,
#pnetzwerk #nav-netzwerk a,
#ptreiber #nav-treiber a,
#phandel #nav-handel a,
#pkontakt #nav-kontakt a,
#pdaten #nav-daten a,
#pindex #nav-home a {
	background-position:0 -150px;
	border-width:0;
	margin-bottom: -1px;
	padding-bottom: 1px;
}

#paktuelles #nav-aktuelles a span,
#pshop #nav-shop a span,
#ptinte #nav-tinte a span,
#pservice #nav-service a span,
#pnetzwerk #nav-netzwerk a span,
#ptreiber #nav-treiber a span,
#phandel #nav-handel a span,
#pkontakt #nav-kontakt a span,
#pdaten #nav-daten a span,
#pindex #nav-home a span {
	background-position:100% -150px;
	color: #000;
	margin-bottom: -1px;
	padding-bottom: 5px;
}
/* Show hovering background */
#navigation2 a:hover {
	background-position:0% -150px;
	color: #D03;
}
#navigation2 a:hover span {
	background-position:100% -150px;
}
/* End Navigation */

/* The page */
#container {
	clear: both;
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 0;
	background: #fc0;
}

/* content colum */
#content {
	background: #fff url("../img/panel.gif") top repeat-x;
	margin-right: 210px;
	padding: 20px;
	padding-top: 4em;
	padding-left: 30px;
	border-right: 1px solid #eb0;
	min-height: 340px;
}

#content p {
	margin-top: 0.7em;
	margin-bottom: 0.7em;
}



/* right column */
#rightcol {
	position: absolute;
	top: 0px;
	right: 0px;
	width: 210px;
	margin: 0;
	padding: 0;
}
#righcol table {
	margin: 0;
	padding: 0;
}

#rightcol .infobox {
	margin: 10px 5px 0 10px;
}
#rightcol .infobox div {
	margin: 0 0 0 10px;
	padding: 2px;
	background: #fe9;
	border: 1px solid #eb0;
	border-top : none;
}
#rightcol .infobox div.infoheader {
	margin: 0;
	padding-left: 4px;
	border: 1px solid #eb0;
	background: #fd6;
	color: #960;
	font-weight: bold;
}

#rightcol .infobox div p {
	margin-top: 0;
}




#footer {
	margin: 0;
	clear: both;
	background: #fd6;
	border-top: 1px solid #eb0;
	border-bottom: 1px solid #eb0;
}
#footer p {
	margin: 0;
	padding: 0;
	text-align: center;
}
#footer #smallhost {
	font-size: 0.9em;
}
#footer #smallhost a {
	text-decoration: none;
	color: #f03;
}




.linkliste li {
	margin-top: 2px;
	margin-bottom: 2px;
	list-style-image: url("../img/linklisteicon.gif");
	padding-left: 10px;
}


.filelistzips ul {
	padding-left: 20px;
	margin-left: 20px;
}
.filelistzips li {
	margin-top: 2px;
	list-style-image: url("../img/filelistfile.gif");
	list-style-position: inside;
	padding: 2px;
}

.filelistzips .folder {
	margin-top: 10px;
	list-style-image: url("../img/filelistfolder.gif");
	list-style-position: inside;
}


.txblock {
	text-align: justify;
}
.eecomputer {
	white-space: nowrap;
	text-shadow: rgba(0, 0, 0, 0.2) 1px 1px 0;
}

.welcome-box {
	display: block;
	width: 350px;
	text-align: center;
	margin: 2em 0;
}

.startblock,
.simpleblock {
	position: relative;
	float: left;
	width: 500px;	
	margin: 0 10px 30px 0;
	background: #fff;
}
.startblock {
	height: 400px;
}

.startblock p,
.simpleblock p,
.startblock table,
.simpleblock table {
	padding: 0 20px;
}
.startblock h3,
.simpleblock h3 {
	margin: 0;
	background: #fc3;
	border: 1px solid #fe9;
	border-color: #fe9 #eb0 #eb0 #fe9;
	text-align: center;
	font-size: 1.1em;
}

.sb-computer {
	background: url(../img/start/computerbgbigb.png) bottom left no-repeat;
}
.sb-service {
	background: url(../img/start/servicebgbig2.png) bottom right no-repeat;
}

.sb-computer p, .sb-service p {
	text-align: justify;
}

.impbox {
	padding: 0 20px;
	display: block;
	height: 30px;
	font-weight: bold;
	text-align: right;
}
.impbox .big {
	font-size: 1.5em;
	color: #c62f1b;
}


.kartenuebersicht {
	text-align: center;
}
.kartenuebersicht img {
	border: 1px solid #ccc;
}

a.xlink:hover {
	text-decoration: none;
	background: #fe9;
}


/* */
@media only screen and (max-width: 750px) {
/* */
	#content {
		margin: 0;
		padding: 10px;
		border: none;
	}
	#rightcol {
		position: static;
		margin: 0;
		padding: 0;
		width: auto;
		overflow: hidden;
	}
	#rightcol .infobox {
		float: left;
		width: 200px;
		min-height: 120px;
	}
	
}
/* */

/* */
@media only screen and (max-width: 550px) {
	#header, #navigation2 {
		width: 100%;
		background-image: none !important;
		height: auto;
	}
	#logo {
		position: static;
		width: auto;
		margin: 0 auto;
	}
	#logo img {
		display: none;
	}

	#logo h1 {
		display: block;
		width: auto;
		margin: 0;
		padding: 0;
		font-size: 32px;
		font-weight: bold;
		text-align: center;
		text-transform: uppercase;
	}
	#logo h1:after {
		font-size: 12px;
		content: " mobil";
	}
	
	#container {
		clear: both;
		position: static;
		width: 100%;
	}
	
	#rightcol .infobox {
		float: none;
		width: auto;
		font-size: 1.4em;
		line-height: 1.6;
	}

	.welcome-box {
		overflow: hidden;
		width: auto;
	}
	.welcome-box img {
		width: 100%;
		max-width: 342px;
	}


	#navigation2 ul {
		padding: 2px 0;
	}
	.startblock,
	.simpleblock {
		margin: 0;
		position: static;
		float: none;
		width: auto;
		height: auto;
		background: none !important;
	}
	.startblock p,
	.simpleblock p,
	.simpleblock table {
		padding: 0;
	}
	.product {
		border: 2px solid red;
		float: none !important;
		width: auto !important;
	}

	.product div.beschreibung {
		height: auto !important;
		width: auto !important;
		overflow: auto;
		padding: 2px !important;
	}
}
/* */


@media print {
	body, html {
		margin: 0;
		padding: 0;
	}
	#header, #navigation2 {
		width: 100%;
		height: auto;
	}
	body, html, #header, #navigation2, #container, #content, #footer {
		background-color: transparent !important;
		background-image: none  !important;
	}
	
	
	#logo {
		position: static;
		width: auto;
		margin: 0 auto;
	}
	#logo img {
		display: none;
	}

	#logo h1 {
		color: #000;
		display: block;
		width: auto;
		margin: 0;
		padding: 0;
		font-size: 32px;
		font-weight: bold;
		text-align: center;
		text-transform: uppercase;
	}
	#navigation2 {
		display: none;
	}
	
	
	#content {
		margin: 0;
		padding: 10px;
		border: none;
	}
	#rightcol {
		position: static;
		margin: 0;
		padding: 0;
		width: 100%;
	}
	#rightcol:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
	}
	
	#rightcol .infobox {
		float: left;
		width: 200px;
		min-height: 120px;
	}
	#rightcol .infobox div {
		background-color: transparent !important;
		border: none;
		color: #000 !important;
	}
	#smallhost {
		
		display: none;
	}
	
	.sb-computer, .sb-service {
		background: none;
	}
}