/* -------------------------------------------------------------------- */
/* style sheets für www.huehnlein.de, 2010-2011							*/
/* realisation and author: michael schulze, www.jms-design.de			*/
/* -------------------------------------------------------------------- */

/* -------------------------------------------------------------------- */
/* globale Einstellungen */
	
	body, html {
		margin: 0px;
		padding: 0px;
	}
	

/* -------------------------------------------------------------------- */		
/* Schriftklassen */
	
	body {
		font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
		font-size: 11px; 
		font-style: normal; 
		font-weight: normal; 
		line-height: 14px;
		color: #808080;
		background: #000000 url(../hh_bilder/hh_main_back.gif) repeat-x;		
	}
		
	/* allgemeine Linkdarstellung */
		a 			{ text-decoration: none; color: #808080; }
		a:hover 	{ outline: none; color: #ffffff; }
		a:focus 	{ outline: none; }
	
	
/* -------------------------------------------------------------------- */
/* Seitenaufbau */
	
	.container {
		width: 700px;
		padding: 0px 50px 50px 50px;
		text-align: left;
	}
	
	
	
	/* Navigation ----------------------------------------------------- */
			
		/* Hauptnav */
		
			#hhlogo {
				margin: 34px 0px 13px 0px;
				border: 0px;
			}
			
			h1 {
				font-size: 11px;
				line-height: 11px;
				font-weight: normal;
				padding: 18px 0px 7px 0px;
				margin: 0px;
			}	
			
			h2 {
				font-size: 11px;
				line-height: 14px;
				font-weight: normal;
				margin: 0px;
				padding: 0px;
				color: #ffffff;
			}
			
			.kapnavSel 	{ color: #ffffff; }
			
			#telefon 	{ float: right; }
			
			
		/* Sprachwahl */
		
			#langsel {
				text-align: right;
				padding-top: 15px;
			}
			
			#langsel span {
				color: #ffffff;
			}
			
		/* Listennavigation */
		
			.listnav {
				list-style: none;
				margin: 0px;
				padding: 0px;				
			}
			
			
		
	/* Inhaltsbereich -------------------------------------------------- */
		
		.kapitel {
			border-bottom: 1px solid #808080;
			margin: 7px 0px 10px 0px;
		}
		
		.kapitelcontent { 
			padding: 7px 0px 35px 0px; 
		}
		
		.bildcontent	{ 
			position: relative; 
			padding-bottom: 0px; 
		}
		
		p { margin: 0px 0px 20px 0px; }
				
	
		/* Horizontale Leiste */
			.pagemask {
				position: relative;
				width: 700px;
				height: 385px;
				padding: 0px;
				overflow: hidden;
			}
			
			.pagecontainer {
				position: absolute;
			}
			
			.page {
				float: left;
				width: 700px;
				height: 385px;
				vertical-align: top;
				background-repeat: no-repeat;
			}
			
			.texttafel {
				background: #333333;				
			}
			
			.pagenext, .pageprev { 
				position: absolute;
				display: block;
				height: 385px;
				width: 0px;
				top: 0px;
				left: 630px;
				overflow: hidden;
				padding-left: 70px;
			}
			
			.pagenext 		{ background: url(../hh_bilder/hh_main_page-pfeil-rechts.png) no-repeat 48px 177px; }
			.pagenext:hover	{ background: url(../hh_bilder/hh_main_page-pfeil-rechts_a.png) no-repeat 48px 177px; }
			.pageprev 		{ background: url(../hh_bilder/hh_main_page-pfeil-links.png) no-repeat 7px 177px; left: 0px; display: none;}
			.pageprev:hover	{ background: url(../hh_bilder/hh_main_page-pfeil-links_a.png) no-repeat 7px 177px; }
			
			
		/* Vorschau-Leiste */
			
			.previewmask {
				position: relative;
				width: 700px;
				height: 69px;
				overflow: hidden;
				border-top: 1px solid #ffffff;
				z-index: 5;
				background: #404040;
			}
			
			.infofeld, .infofeldleer {
				display: none;
				position: absolute;
				height: 57px;
				width: 162px;
				padding: 12px 12px 0px 0px;
				background: #404040;
				border-right: 1px solid #ffffff;
				z-index: 10;
			}
			
			.infofeld { background: #404040 url(../hh_bilder/hh_main_pfeil_oben.gif) no-repeat 157px 6px; }
			
			.infoLayer {
				display: none;
				position: absolute;
				top: 7px;
				left: 0px;
				width: 157px;
				height: 374px;
				padding: 12px 17px 69px 0px;
				overflow: hidden;
				background: url(../hh_bilder/hh_album_infolayer-back.png) no-repeat;
				z-index: 50;
			}
			
			.infoLayer:hover { color: #808080;}
			
			
			#previewpagecontainer {
				margin-left: 175px;
				z-index: 5;
			}
			
			.thumb, .thumbSel {
				display: block;
				float: left;
				width: 105px;
				height: 69px;
				filter: alpha(opacity=60); 
				-moz-opacity: 0.6; 
				opacity: 0.6;
				background-repeat: no-repeat;
				background-position: center center;
			}
			
			.thumb:hover, .thumbSel {
				filter: alpha(opacity=100); 
				-moz-opacity: 1; 
				opacity: 1;
			}
			
			.previewnext, .previewprev { 
				position: absolute;
				display: block;
				height: 69px;
				width: 1px;
				top: 0px;
				left: 680px;
				overflow: hidden;
				padding-left: 19px;
				z-index: 20;
			}
			
			.previewnext 		{ background: url(../hh_bilder/hh_main_preview-pfeil-rechts.png) no-repeat; }
			.previewnext:hover	{ background: url(../hh_bilder/hh_main_preview-pfeil-rechts_a.gif) no-repeat; }
			.previewprev 		{ background: url(../hh_bilder/hh_main_preview-pfeil-links.png) no-repeat; left: 175px; display: none; }
			.previewprev:hover	{ background: url(../hh_bilder/hh_main_preview-pfeil-links_a.gif) no-repeat; }
		
		
		/* Spalten */
			
			.spalte1 		{ width: 325px; float: left; }
			.spalte2		{ width: 325px; float: right; }
			.clearer		{ clear: both; }
	
	
		
		
					
	/* seitenspezifische Objekte --------------------------------------- */
		
		/* Startseite */
			.imgpreloader { display: none; }
		
		/* News */
			.newshead {
				font-size: 40px;
				line-height: 48px;
				font-weight: bold;
				letter-spacing: -1px;
				padding: 0px;
				margin: 0px 0px 10px 0px;
				color: inherit;
			}
			
		/* H&H */
			
			#hhbild 	{ margin: 20px 0px 20px 0px; }
			
			/* Team-Übersicht */
				
				#teamHnavName { color: #ffffff; }
				
				.teamkat {
					border-bottom: 1px solid #4d4d4d;
					padding: 0px 0px 3px 0px;
					margin-bottom: 16px;
				}
				
				.teamHead, .teamHeadSel { 
					font-size: 11px;
					font-weight: normal;
					margin: 0px;
					padding: 0px;
					background: url(../hh_bilder/hh_main_pfeil_zu.gif) no-repeat left 2px;
				}
				
				.teamHead a, .teamHeadSel a {
					padding-left: 18px;
				}
				
				.teamHeadSel {
					background: url(../hh_bilder/hh_main_pfeil_offen.gif) no-repeat left 5px;
				}
				
				.teamcontent {
					display: none;
					padding-left: 36px;
					line-height: 17px;
				}
				
				.teamtitle 	{ clear: right; float: right; }
				
		/* Referenzen & Projekte */
		
			/* Referenzen-Übersicht */
			
				.refkat {
					border-bottom: 1px solid #4d4d4d;
					padding: 0px 0px 3px 0px;
					margin-bottom: 16px;
				}

				.aibild { float: right; }
				
				.refHead, .refHeadSel, .refHeadNoPrj, .hhHead, .hhHeadSel { 
					font-size: 11px;
					font-weight: normal;
					margin: 0px;
					padding: 0px;
					background: url(../hh_bilder/hh_main_pfeil_zu.gif) no-repeat left 2px;
					color: #808080;
				}
				
				.refHeadNoPrj {
					background: none;
					padding-left: 18px;
				}
				
				.refHead a, .refHeadSel a, .hhHead a, .hhHeadSel a {
					padding-left: 18px;
				}
				
				.refHeadSel, .hhHeadSel {
					background: url(../hh_bilder/hh_main_pfeil_offen.gif) no-repeat left 5px;
				}
				
				.refcontent {
					display: none;
					padding-left: 18px;
					line-height: 17px;
				}
				
				/* Kundentexte */
					.kundenintro {
						padding: 5px 0px 5px 0px;
						font-style: oblique;	
					}
					
					.kundenintro2 {
						display: none;
					}
				
				#reflegende {
					float: right;
					color: #789100;
					font-size: 8px;
				}
				
				/* Zitate */
				
				#zitatemask {
					width: 325px;
					height: 194px;
					margin: -5px 0px 15px 0px;
				}
				
				.zitatepage {
					float: left;
					width: 300px;
					padding-right: 25px;
					height: 194px;
					vertical-align: top;
					font-size: 13px;
					line-height: 16px;
					font-style: italic;
					color: #ffffff;
				}
				
				.zitatquelle {
					font-size: 9px;
					line-height: 12px;
					font-style: normal;
				}
				
				.zitatenext, .zitateprev { 
					position: absolute;
					display: block;
					height: 31px;
					width: 1px;
					top: 30px;
					left: 310px;
					overflow: hidden;
					padding-left: 14px;
				}
				
				.zitatenext			{ background: url(../hh_bilder/hh_main_page-pfeil-weiss-rechts.png) no-repeat; }
				.zitatenext:hover	{ background: url(../hh_bilder/hh_main_page-pfeil-weiss-rechts_a.png) no-repeat; }
				.zitateprev 		{ background: url(../hh_bilder/hh_main_page-pfeil-weiss-links.png) no-repeat; left: 307px; top: 65px; display: none;}
				.zitateprev:hover	{ background: url(../hh_bilder/hh_main_page-pfeil-weiss-links_a.png) no-repeat; }
			
			
			/* Projektseite */
			
				#prjHnavKat {
					color: #ffffff;
				}
				
				.prjweblink {
					display: block;
					width: 500px;
					height: 385px;
					margin-left: 100px;
				}
				
				.prjvideobu {
					text-align: center;
					padding: 20px;
				}
				
				.videopage {
					background: #262626 url(../hh_main/hh_main_pageback.gif) repeat-x;
				}
				
				.html5video {
					margin: 38px 0px 0px 105px;
				}
				
			/* Show-Reel und Designobjekte */
				
				#navPrj {
					color: #ffffff;
				}
				
				
		/* Jobs */
			
			.jobkat {
				border-bottom: 1px solid #4d4d4d;
				padding: 0px 0px 3px 0px;
				margin-bottom: 16px;
			}
			
			.lastjobkat {
				border: none;
			}
			
			.jobHead, .jobHeadSel { 
				font-size: 11px;
				font-weight: normal;
				margin: 0px;
				padding: 0px;
				background: url(../hh_bilder/hh_main_pfeil_zu.gif) no-repeat left 2px;
			}
			
			.jobHead a, .jobHeadSel a {
				padding-left: 18px;
			}
			
			.jobHeadSel {
				color: #ffffff;
				background: url(../hh_bilder/hh_main_pfeil_offen.gif) no-repeat left 5px;
			}
			
			.jobcontent {
				display: none;
				padding: 0px 0px 10px 36px;
				line-height: 17px;
			}
			
			
		/* allgemeine Klassen, die andere überschreiben --------------------------------------- */
		
		.noline { border: none; }