@charset "utf-8";
/*===========================================
pcard.ch für Haws
www.pcard.ch

Daniel Fiechter
=============================================

Wrapper, Main Container
*/
div#wrapper {
	width:960px;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 20px;
	margin-left: auto;
}

/*=========================================

Navigation
*/
ul#mainnav {
	width:100%;
	
	margin-top:30px;
	margin-bottom:20px;
	
	font-size:14px;
	font-weight:bold;
	text-transform:uppercase;
	
	border-top:5px solid #000;
	padding-top:15px;
	z-index:1;
	
	font-family:"Century Gothic","Myriad Pro","Trebuchet MS",Arial,Helvetica,sans-serif;
}

	ul#mainnav li.navpoint {
		position:relative;
		display:inline;
		z-index:100;
		
		padding:15px 20px 12px 20px;
		margin:0px 15px 0px 1px;
	}
	
	ul#mainnav li, ul#mainnav li div.navcontainer {
		background-color:#FFF;
	}
	
		ul#mainnav li div.navcontainer {
			position:absolute;
			top:44px;
			left:-1px;
			width:760px;
			min-height:350px;
			z-index:99;
			
			text-transform:none;
			color:#000;
			/*background-color: #E7E7E7;  */
			/*
			opacity:0.9;
			-moz-opacity:0.9;
			filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90);
			*/
			padding:10px;
			
			border-top:1px solid #000000;
			border-bottom:5px solid #000000;
			border-left:1px solid #000000;
			border-right:1px solid #000000;
			border-radius-bottomleft: 10px; -o-border-radius-bottomleft: 10px; -icab-border-radius-bottomleft: 10px; -khtml-border-radius-bottomleft: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px; -o-border-bottom-left-radius: 10px; -icab-border-bottom-left-radius: 10px; -khtml-border-bottom-left-radius: 10px; -moz-border-bottom-left-radius: 10px; -webkit-border-bottom-left-radius: 10px;
			border-radius-bottomright: 10px; -o-border-radius-bottomright: 10px; -icab-border-radius-bottomright: 10px; -khtml-border-radius-bottomright: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-radius-bottomright: 10px; border-bottom-right-radius: 10px; -o-border-bottom-right-radius: 10px; -icab-border-bottom-right-radius: 10px; -khtml-border-bottom-right-radius: 10px; -moz-border-bottom-right-radius: 10px; -webkit-border-bottom-right-radius: 10px;
			border-radius-topright: 10px; -o-border-radius-topright: 10px; -icab-border-radius-topright: 10px; -khtml-border-radius-topright: 10px; -moz-border-radius-topright: 10px; -webkit-border-radius-topright: 10px; border-top-right-radius: 10px; -o-border-top-right-radius: 10px; -icab-border-top-right-radius: 10px; -khtml-border-top-right-radius: 10px; -moz-border-top-right-radius: 10px; -webkit-border-top-right-radius: 10px;
			
			display:none;
		}
		
		ul#mainnav li div.c1 {
			left:-100px;
		}
		ul#mainnav li div.c2 {
			left:-300px;
		}
		ul#mainnav li div.c3 {
			left:-500px;
		}
		
	ul#mainnav li:hover {
		color:#FFFFFF;/*#006DB8;*/
		background-color:#000000;
		
		margin:-1px 14px 0px 0px;
		
		border-left:1px solid #CCC;
		border-top:1px solid #CCC;
		border-right:1px solid #CCC;
		border-bottom:1px solid #FFF;
		border-radius-topleft: 10px; -o-border-radius-topleft: 10px; -icab-border-radius-topleft: 10px; -khtml-border-radius-topleft: 10px; -moz-border-radius-topleft: 10px; -webkit-border-radius-topleft: 10px; border-top-left-radius: 10px; -o-border-top-left-radius: 10px; -icab-border-top-left-radius: 10px; -khtml-border-top-left-radius: 10px; -moz-border-top-left-radius: 10px; -webkit-border-top-left-radius: 10px;
		border-radius-topright: 10px; -o-border-radius-topright: 10px; -icab-border-radius-topright: 10px; -khtml-border-radius-topright: 10px; -moz-border-radius-topright: 10px; -webkit-border-radius-topright: 10px; border-top-right-radius: 10px; -o-border-top-right-radius: 10px; -icab-border-top-right-radius: 10px; -khtml-border-top-right-radius: 10px; -moz-border-top-right-radius: 10px; -webkit-border-top-right-radius: 10px;
	}
		
		ul#mainnav li:hover div.navcontainer {
			display:block;
		}
		
		
			div.katcontainer {
				width:220px;
				height:100%;
				float:left;
				
				padding-right:10px;
				margin-right:10px;
				
				border-right:1px solid #CCC;
			}
				div.katcontainer ul, ul#mainnav li div.navcontainer div.subnavcontainer ul {
					width:100%;
				}
				
				ul#mainnav li div.navcontainer div.katcontainer ul li, div.katcontainer ul li {
					background:none;
					padding:2px;
					margin:0px;
					
					display:block;
					width:100%;
					
					background-color:#FFF;
				}
				
					div.katcontainer ul li a {
						font-size:12px;
						color:#888888;
						font-family:Arial,Helvetica,sans-serif;
						
						display:block;
						width:100%;
					}
				
					div.katcontainer ul li div {
						display:none;
						
						font-size:12px;
						color:#000;
						font-weight:normal;
						
						padding:3px;
						
						background:url('../data/images/katnav-bg.png') repeat-x;
						border-bottom:1px solid #E7F1F8;
					}
					
				ul#mainnav li div.navcontainer div.katcontainer ul li:hover, div.katcontainer ul li:hover {
					border:none;
				}
				
					div.katcontainer ul li:hover a,div.katcontainer ul li.active a {
						font-weight:bold;
						color:#006DB8;
						
					}
				
					div.katcontainer ul li:hover div, div.katcontainer ul li.active div {
						display:block;
					}

				ul#mainnav li div.navcontainer h1 {
					font-size:16px;
					font-weight:bold;
				}
			
			ul#mainnav li div.navcontainer div.prodcontainer {
				width:340px;
				height:100%;
				min-height:250px;
				float:left;
				
				margin-right:10px;
				
				font-size:12px;
				color:#000;
				font-weight:normal;
				
				position:relative;
			}
				ul#mainnav li div.navcontainer div.prodcontainer a {
					color:#000;
				}
				ul#mainnav li div.navcontainer div.prodcontainer a:hover, ul#mainnav li div.navcontainer div.prodcontainer a.active {
					font-weight:bold;
					color:#006DB8;
				}
				
					ul#mainnav li div.navcontainer div.prodcontainer div.box a {
						color:#006DB8;
					}
					ul#mainnav li div.navcontainer div.prodcontainer div.box a:hover {
						color:#000;
					}
				
				ul#mainnav li div.navcontainer div.prodcontainer div.image {
					position:absolute;
					bottom:0px;
					right:0px;
					width:200px;
					
				}
				
				ul#mainnav li div.navcontainer div.prodcontainer div.produktbox {
					height:300px;
					overflow:auto;
					width:120px;
					
					scrollbar-face-color:#FFF;
					scrollbar-highlight-color:#FFF;
					scrollbar-3dlight-color:#FFF;
					scrollbar-darkshadow-color:#FFF;
					scrollbar-shadow-color:#FFF;
					scrollbar-arrow-color:#CCC;
					scrollbar-track-color:#FFF;
				}

				ul#mainnav li div.navcontainer div.prodcontainer div.produktbox a {
						color:#888888;
				}

				ul#mainnav li div.navcontainer div.prodcontainer div.produktbox a:hover {
						color:#006DB8;
				}
			
			ul#mainnav li div.navcontainer div.subnavcontainer, div.subnavcontainer {
				width:160px;
				height:100%;
				float:left;
				
				font-size:12px;
				color:#000;
				font-weight:normal;

			}
			
				ul#mainnav li div.navcontainer div.subnavcontainer div.video {
					width:100%;
					height:160px;
					display:block;
				}
			
				ul#mainnav li div.navcontainer div.subnavcontainer ul li, div.subnavcontainer ul li {
					padding:0px;
					margin:0px;
					
					display:block;
					width:100%;
					height:30px;
					
					
					background:url('../data/images/subnav-bg.png') repeat-x;
				}
				
					ul#mainnav li div.navcontainer div.subnavcontainer ul li a, div.subnavcontainer ul li a {
						display:block;
						width:100%;
						height:100%;
						padding:5px;
						color:#000;
					}

					ul#mainnav li div.navcontainer div.subnavcontainer ul li a:hover {
						color:#006DB8;
					}
				
				ul#mainnav li div.navcontainer div.subnavcontainer ul li:hover, div.subnavcontainer ul li:hover {
					border:none;
					background:url('../data/images/subnav-bg-over.png') repeat-x;
					
					
					border-radius-topleft: 0px; -o-border-radius-topleft: 0px; -icab-border-radius-topleft: 0px; -khtml-border-radius-topleft: 0px; -moz-border-radius-topleft: 0px; -webkit-border-radius-topleft: 0px; border-top-left-radius: 0px; -o-border-top-left-radius: 0px; -icab-border-top-left-radius: 0px; -khtml-border-top-left-radius: 0px; -moz-border-top-left-radius: 0px; -webkit-border-top-left-radius: 0px;
					border-radius-topright: 0px; -o-border-radius-topright: 0px; -icab-border-radius-topright: 0px; -khtml-border-radius-topright: 0px; -moz-border-radius-topright: 0px; -webkit-border-radius-topright: 0px; border-top-right-radius: 0px; -o-border-top-right-radius: 0px; -icab-border-top-right-radius: 0px; -khtml-border-top-right-radius: 0px; -moz-border-top-right-radius: 0px; -webkit-border-top-right-radius: 0px;
				}

ul#cmsnav {
	float:right;
	margin-top:10px;
}
	
	ul#cmsnav li, ul#navlang li {
		display:inline;
		margin-left:10px;
	}
	
	ul#cmsnav li:hover a, ul#cmsnav li.active a {
		color:#000;
	}
	
	ul#cmsnav li:hover a, ul#cmsnav li.active a {
		color:#000;
	}
	
	ul#cmsnav li.lang {
		position:relative;
	}
	
	ul#cmsnav li.lang ul {
		position:absolute;
		top:15px;
		left:-8px;
		background-color:#FFF;
		width:55px;
		
		display:none;
	}
	
	ul#cmsnav li.lang:hover ul {
		display:block;
		float:right;
		z-index:600;
		
		border-left:1px solid #E7F1F8;
		border-right:1px solid #E7F1F8;
		border-bottom:1px solid #E7F1F8;
		
	}
		ul#cmsnav li.lang:hover ul li {
			display:block;
			margin:3px 5px 5px 5px;
		}
		
		ul#cmsnav li.lang:hover ul li a {
			padding:2px;
			display:block;
			width:40px;
		}
		ul#cmsnav li.lang:hover ul li a:hover {
			background-color:#E7F1F8;
		}

/*=========================================

Suche
*/
div#search {
	background-color:#E7F1F8;
	
	padding:10px;
	margin-top:10px;
	
	float:right;
	position:relative;
	z-index:300;
	
	border-radius-bottomleft: 10px; -o-border-radius-bottomleft: 10px; -icab-border-radius-bottomleft: 10px; -khtml-border-radius-bottomleft: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px; -o-border-bottom-left-radius: 10px; -icab-border-bottom-left-radius: 10px; -khtml-border-bottom-left-radius: 10px; -moz-border-bottom-left-radius: 10px; -webkit-border-bottom-left-radius: 10px;
	border-radius-bottomright: 10px; -o-border-radius-bottomright: 10px; -icab-border-radius-bottomright: 10px; -khtml-border-radius-bottomright: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-radius-bottomright: 10px; border-bottom-right-radius: 10px; -o-border-bottom-right-radius: 10px; -icab-border-bottom-right-radius: 10px; -khtml-border-bottom-right-radius: 10px; -moz-border-bottom-right-radius: 10px; -webkit-border-bottom-right-radius: 10px;
	border-radius-topright: 10px; -o-border-radius-topright: 10px; -icab-border-radius-topright: 10px; -khtml-border-radius-topright: 10px; -moz-border-radius-topright: 10px; -webkit-border-radius-topright: 10px; border-top-right-radius: 10px; -o-border-top-right-radius: 10px; -icab-border-top-right-radius: 10px; -khtml-border-top-right-radius: 10px; -moz-border-top-right-radius: 10px; -webkit-border-top-right-radius: 10px;
	border-radius-topleft: 10px; -o-border-radius-topleft: 10px; -icab-border-radius-topleft: 10px; -khtml-border-radius-topleft: 10px; -moz-border-radius-topleft: 10px; -webkit-border-radius-topleft: 10px; border-top-left-radius: 10px; -o-border-top-left-radius: 10px; -icab-border-top-left-radius: 10px; -khtml-border-top-left-radius: 10px; -moz-border-top-left-radius: 10px; -webkit-border-top-left-radius: 10px;

	color:#006DB8;
	font-weight:bold;
	font-size:14px;
	text-transform:uppercase;
	
	font-family:"Century Gothic","Myriad Pro","Trebuchet MS",Arial,Helvetica,sans-serif;
}
	div#search #searchinput {
		width:250px;
		padding:5px;
		
		border:none;
	}
	
	div#search div#searchoutput {
		position:absolute;
		right:9px;
		top:37px;
		
		width:250px;
		padding:5px;
		
		background-color:#FFF;
		color:#000;
		text-transform:none;
		font-size:12px;
		font-weight:normal;
		
		z-index:300;
		
		/*opacity:0.9;
		-moz-opacity:0.9;
		filter:progid:DXImageTransform.Microsoft.Alpha(opacity=90);*/
		border-left:1px solid #E7F1F8;
		border-right:1px solid #E7F1F8;
		border-bottom:1px solid #E7F1F8;
		
		border-radius-bottomleft: 10px; -o-border-radius-bottomleft: 10px; -icab-border-radius-bottomleft: 10px; -khtml-border-radius-bottomleft: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px; -o-border-bottom-left-radius: 10px; -icab-border-bottom-left-radius: 10px; -khtml-border-bottom-left-radius: 10px; -moz-border-bottom-left-radius: 10px; -webkit-border-bottom-left-radius: 10px;
		border-radius-bottomright: 10px; -o-border-radius-bottomright: 10px; -icab-border-radius-bottomright: 10px; -khtml-border-radius-bottomright: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-radius-bottomright: 10px; border-bottom-right-radius: 10px; -o-border-bottom-right-radius: 10px; -icab-border-bottom-right-radius: 10px; -khtml-border-bottom-right-radius: 10px; -moz-border-bottom-right-radius: 10px; -webkit-border-bottom-right-radius: 10px;
	}
	
		div#search div#searchoutput a {
			display:block;
			border-bottom:1px solid #E7F1F8;
			padding-top:5px;
			padding-bottom:5px;
		}
		div#search div#searchoutput a:hover {
			background-color:#FEFEFE;
		}
/*=========================================

Footer
*/
#footer {
	border-top:5px solid #000;
	padding-top:5px;
	margin-top:20px;
	
	display:block;
	width:100%;
	clear:both;
}

/*=========================================

AJAX Pop Ups
*/
div#blackcloud {
	position:fixed;
	top:0px;
	left:0px;
	width:100%;
	height:100%;
	
	background-color:#000;
	opacity:0.3;
	-moz-opacity:0.3;
	filter:progid:DXImageTransform.Microsoft.Alpha(opacity=30);
	
	z-index:301;
}

div#popUp {
	min-width:20%;
	position:absolute;
	top:20%;
	left:30%;
	
	padding:15px;

	border-radius-bottomleft: 10px; -o-border-radius-bottomleft: 10px; -icab-border-radius-bottomleft: 10px; -khtml-border-radius-bottomleft: 10px; -moz-border-radius-bottomleft: 10px; -webkit-border-radius-bottomleft: 10px; border-bottom-left-radius: 10px; -o-border-bottom-left-radius: 10px; -icab-border-bottom-left-radius: 10px; -khtml-border-bottom-left-radius: 10px; -moz-border-bottom-left-radius: 10px; -webkit-border-bottom-left-radius: 10px;
	border-radius-bottomright: 10px; -o-border-radius-bottomright: 10px; -icab-border-radius-bottomright: 10px; -khtml-border-radius-bottomright: 10px; -moz-border-radius-bottomright: 10px; -webkit-border-radius-bottomright: 10px; border-bottom-right-radius: 10px; -o-border-bottom-right-radius: 10px; -icab-border-bottom-right-radius: 10px; -khtml-border-bottom-right-radius: 10px; -moz-border-bottom-right-radius: 10px; -webkit-border-bottom-right-radius: 10px;
	border-radius-topright: 10px; -o-border-radius-topright: 10px; -icab-border-radius-topright: 10px; -khtml-border-radius-topright: 10px; -moz-border-radius-topright: 10px; -webkit-border-radius-topright: 10px; border-top-right-radius: 10px; -o-border-top-right-radius: 10px; -icab-border-top-right-radius: 10px; -khtml-border-top-right-radius: 10px; -moz-border-top-right-radius: 10px; -webkit-border-top-right-radius: 10px;
	border-radius-topleft: 10px; -o-border-radius-topleft: 10px; -icab-border-radius-topleft: 10px; -khtml-border-radius-topleft: 10px; -moz-border-radius-topleft: 10px; -webkit-border-radius-topleft: 10px; border-top-left-radius: 10px; -o-border-top-left-radius: 10px; -icab-border-top-left-radius: 10px; -khtml-border-top-left-radius: 10px; -moz-border-top-left-radius: 10px; -webkit-border-top-left-radius: 10px;
	border:10px solid #CCC;
	
	background-color:#FFF;
	
	z-index:600;
}

/* WELCOME Sprachseite, thomas */
div#sprachwahl {
	padding: 120px 0 0 0;
}

div#aw {
	padding: 0 0 15px 85px;
	background: url('../data/images/50transp.png') 0 0;
	}

div#aw h1 {
padding: 10px 0 15px 0;
margin: 0;
font-family:"Century Gothic","Myriad Pro","Trebuchet MS",Arial,Helvetica,sans-serif;
}
	
div#aw ul {
	padding: 0 0 25px 0;
	margin: 0px;	
}

div#aw li {
	padding: 10px 10px 10px 0;
	margin: 0px;	
	display: inline;
}