?/* 
About this document
---------------------------------------------------
Project:		.steute
Filename:		"produktseite.css"
Date:			20. Februar 2006
Author:			Johan Prawiro


Last modified
---------------------------------------------------
Version:		1.8
Date:			28.08.2009
Modified by:	Hannes Gesmann


*/

/* --- Produktzeile --- */

	.produktZeile {
		clear:			both;
		display:		block;
		float:			left;
		height:			1%;
		position:		relative;
		width:			100%;
		z-index:		1;
	}

	.produktZeile:after {
		clear:			both;
		content:		".";
		display:		block;
		height:			0;
		visibility:		hidden;
	}

/* --- Produktzeile, Spalten --- */

	.produktZeile .spalteLinks {
		display:		inline;
		float:			left;
		margin-bottom:	32px;
		width:			488px;
	}

	.produktZeile .spalteRechts {
		display:		inline;
		float:			left;
		margin-bottom:	32px;
		margin-left:	16px;
		width:			472px;
	}
	

/* --- Produktzeile, Spalte Links --- */
		
	.spalteLinks .zeileOben, .spalteLinks .zeileUnten {
		clear:			both;
		margin-bottom:	32px;
	}

/* --- Produktzeile, Unterspalten --- */
	
	.unterspalteLinks,
	.unterspalteRechts {
		display:		inline;
		float:			left;
		margin:			0 0 16px 16px;
		width:			228px;
		overflow:		hidden;
	}

	.unterspalteLinks[class] {
		margin:			0 0 0 16px;
	}
	
	.unterspalteLinks a:link,
	.unterspalteLinks a:visited,
	.unterspalteLinks a:hover,
	.unterspalteLinks a:active,
	.unterspalteLinks a:focus {
		display:		block;
		font-weight:		600;
		margin-bottom: 3px;
	}

/* --- Produktzeile, Spalte Links, Zeile Oben --- */

	.spalteLinks .zeileOben:after {
		clear:			both;
		content:		".";
		display:		block;
		height:			0;
		visibility:		hidden;
	}

	.spalteLinks .zeileOben .unterspalteLinks h3 {
		font-size:		13px;
		font-weight:	600;
		padding:		5px 0;
	}

	.spalteLinks .zeileOben .unterspalteRechts {
		height:			320px;
		position:		relative;
	}

	.spalteLinks .zeileOben .unterspalteRechts h3 {
		font-size:		13px;
		font-weight:	600;
		padding:		5px;
		margin:			0 0 10px 0;
	}


	.produktZeile .boxFoto div,
	.produktZeile .boxZeichnung div,
	.produktZeile .boxFoto div a,
	.produktZeile .boxZeichnung div a	 {
		bottom:			50px;
		/* bottom: 0; */
		position:		absolute;
		width:			100%;
	}
	
	.spalteLinks .zeileOben .unterspalteRechts div {
		bottom: 0;
		position:		absolute;
		width:			100%;	
	}

	.spalteLinks .zeileOben .unterspalteRechts img {
		display:		block;
		margin:			0 auto;
	}

	.spalteLinks .zeileUnten .unterspalteRechts img {
		display:		block;
		margin:			26px auto 0 auto;
	}

/* --- Produktzeile, Spalte Links, Zeile Unten --- */

	.spalteLinks .zeileUnten .unterspalteLinks img {
		display:		block;
		margin:			0 auto;
	}

	.spalteLinks .zeileUnten .unterspalteLinks h3 {
		font-size:		13px;
		font-weight:	600;
		padding:		5px;
		margin:			0 0 10px 0;
	}
	
	/* +++ kekiel 12.01.09: Bestelldaten Alternativtext */
	.spalteLinks .zeileUnten .unterspalteLinks p {
		font-size:	13px;
		font-weight: 	600;
		margin-top: 	5px;
		padding: 	5px;
		color:		#000;
	}
	/* --- kekiel 12.01.09 */	

/* --- Produktzeile, Spalte Rechts --- */

	.spalteRechts h3 {
		color:			#000;
		font-size:		13px;
		font-weight:	600;
		padding:		5px 0;
	}
	
	.spalteRechts .technischeDatenTab table {
		color:			#000;
		margin-bottom:	16px;
		border-collapse:collapse;		
	}
	
	.spalteRechts .technischeDatenTab table tr {
		display:		block;
		margin-bottom:	2px;
	}
	
	.spalteRechts .technischeDatenTab table tr th {
		text-align:		left;
		vertical-align:		top;
		width:			244px;
	}
	
	.spalteRechts a:link, .spalteRechts a:visited, .spalteRechts a:hover, .spalteRechts a:active, .spalteRechts a:focus {
		color:			#000;
		display:		block;
		font-size:		12px;
		font-weight:	600;
		margin-left:	244px;
		margin-bottom:	3px;
	}


/* --- Produktzeile, Spalte Rechts, Kontaktvarianten --- */


	.produktZeile .spalteRechts #Kontaktvarianten h3 {
		font-size:		13px;
		font-weight:	600;
		padding:		5px;
		margin:			0 0 10px 0;
	}

	.produktZeile .spalteRechts #Kontaktvarianten table {
		color:			#000;
		margin:			0 0 20px 0;
		width:			472px;
		empty-cells:		show;
	}

	.produktZeile .spalteRechts #Kontaktvarianten table tr th,
	.produktZeile .spalteRechts #Kontaktvarianten table tr td {
		padding:		5px;

		text-align:		left;
	}

	.produktZeile .spalteRechts #Kontaktvarianten table thead tr th {
		width:			auto;
	}

	.produktZeile .spalteRechts #Kontaktvarianten table thead td,
	.produktZeile .spalteRechts #Kontaktvarianten table thead th {
		border-bottom:		1px solid #000;
	}

	.produktZeile .spalteRechts #Kontaktvarianten table tbody tr td,
	.produktZeile .spalteRechts #Kontaktvarianten table thead tr th {
		border-left:	1px solid #D9D9D9;
	}

	.produktZeile .spalteRechts #Kontaktvarianten table tbody tr td img {
		margin-top:	5px;
	}

/* --- Produktzeile, Listen --- */

	.produktZeile ul {
		margin:			0 0 20px 0;
		padding:		0 0 0 16px;
	}
	
	.produktZeile ul li {
		margin:			0 0 1px 0;
	}

/* --- Produktzeile, Box mit Text --- */

	.produktZeile .boxText,
	.Einspalter .boxText {
		display:		inline;
		float:			left;
		height:			320px;
		overflow:		hidden;
		margin:			0 0 32px 16px;
		width:			228px;
	}

	.produktZeile .boxText h3,
	.Einspalter .boxText h3 {
		font-size:		13px;
		font-weight:	600;
		padding:		5px 0;
	}

	.produktZeile .boxText a:link, .produktZeile .boxText a:visited, .produktZeile .boxText a:hover, .produktZeile .boxText a:active, .produktZeile .boxText a:focus {
		background:		#FFF;
		color:			#000;
		font-size:		12px;
		font-weight:	600;
	}

/* --- Produktzeile, Box mit Foto --- */

	.produktZeile .boxFoto {
		display:		inline;
		float:			left;
		height:			320px;
		margin:			0 0 32px 16px;
		overflow:		hidden;
		position:		relative;
		width:			228px;
	}

	.produktZeile .boxFoto h3 {
		font-size:		13px;
		font-weight:	600;
		line-height:	15px;
		padding:		5px;
		margin:			0 0 10px 0;
	}

	.produktZeile .boxFoto img {
		display:		block;
		margin:			0 auto;
	}

/* --- Produktzeile, Box mit technischer Zeichnung --- */

	.produktZeile .boxZeichnung,
	.Einspalter .boxZeichnung {
		display:		inline;
		float:			left;
		height:			320px;
		margin:			0 0 32px 16px;
		overflow:		hidden;
		position:		relative;
		width:			228px;
	}

	.produktZeile .boxZeichnung h3,
	.Einspalter .boxZeichnung h3,
	.Einspalter .boxText h3 {
		font-size:		13px;
		font-weight:	600;
		height:			36px;
		line-height:	15px;
		overflow:		hidden;
		padding:		5px 5px 0 5px;
		margin:			0 0 0 0;
		
		bottom:			1px;
		display:		block;
		position:		absolute;
		width:			228px;
	}

	.produktZeile .boxZeichnung span,
	.Einspalter .boxZeichnung span {
		display:		block;
		height:			269px;
		overflow:		hidden;
	}
/*
	.produktZeile .boxZeichnung a:link, .produktZeile .boxZeichnung a:visited, .produktZeile .boxZeichnung a:hover, .produktZeile .boxZeichnung a:active, .produktZeile .boxZeichnung a:focus {
		background:		#FFF;
		color:			#000;
		display:		block;
		font-size:		12px;
		font-weight:	600;
		position:		relative;
		text-align:		right;
		top:			-14px;
	}
*/
	.produktZeile .boxZeichnung a:link, .produktZeile .boxZeichnung a:visited, .produktZeile .boxZeichnung a:hover, .produktZeile .boxZeichnung a:active, .produktZeile .boxZeichnung a:focus {
		background:		#FFF;
		bottom:			0;
		color:			#000;
		display:		block;
		font-size:		12px;
		font-weight:	600;
		position:		absolute;
		right:			0;
		text-align:		right;
	}
	
	.produktZeile .boxZeichnung a:link.pdfLink, .produktZeile .boxZeichnung a:visited.pdfLink, .produktZeile .boxZeichnung a:hover.pdfLink, .produktZeile .boxZeichnung a:active.pdfLink, .produktZeile .boxZeichnung a:focus.pdfLink {
		top:			42px;
		height:			20px;
	}	
	.produktZeile .boxZeichnung h3 a:link,
	.produktZeile .boxZeichnung h3 a:visited,
	.produktZeile .boxZeichnung h3 a:hover,
	.produktZeile .boxZeichnung h3 a:active,
	.produktZeile .boxZeichnung h3 a:focus {
		background:none;
		color:			#000;
		display:		block;
		font-size:		11px;
		font-weight:	600;
		position:		relative;
		text-align:		left;
		top:			0;
	}

	.produktZeile .boxZeichnung img,
	.Einspalter .boxZeichnung img {
		display:		block;
		margin:			10px auto 0 auto;
/*		padding-top:	10px; */
		position:		relative;
	}

	.produktZeile .boxZeichnung p,
	.produktZeile .boxZeichnung ul li {
		font-size:	11px;
		
	}

	.produktZeile .boxZeichnung p {
		margin:		0;
		padding:	0;
		height:		22px;

	}

	.produktZeile .boxZeichnung p strong {
		display:		block;
		margin-top:	4px;
	}
	
        .produktZeile .boxZeichnung .boxZeichnungText,
        .Einspalter .boxZeichnung .boxZeichnungText {
		top: 20px;
	}	
	
        .Einspalter .boxZeichnung .boxZeichnungText p,
        .Einspalter .boxText p {	
           margin: 0 0 3px 0;
           padding: 0;
        }
        
	.Einspalter .boxZeichnung .boxZeichnungText ul,
        .Einspalter .boxText ul {
          margin: 0;
          padding: 0 0 3px 16px;
         }

.unterspalteLinks .boxZeichnung {
  margin-left: 0;
}

/******************************
 * Bestelldaten Menu
 ******************************/
.ajaxMenu {
	clear:both;
	display:inline-block;
	margin:0 0 20px 16px;
	position: relative;
	width: 976px;
	z-index: 100;
}
.produktZeile .ajaxMenu {
	z-index: 50;
}

.ajaxMenu h3 {
	font-size:13px;
	font-weight:600;
	margin:0 0 10px;
	padding:5px;
	background:#CCCCCC none repeat scroll 0 0;
	color:#575757;
}
.ajaxMenu div,
.ajaxMenu span {
	display:inline-block;
	float:left;
}
.ajaxMenu p {
	font-size:11px;
}

.ajaxMenu .blocks {
	font-size:11px;
	width:100%;
}
.ajaxMenu .variantenblock {
	border-bottom:1px dotted black;
	clear:left;
	margin:0 0 10px 0;
	padding:0 0 10px 0;
	width:704px;
}
.ajaxMenu .kontaktvariante {
	width:175px;
}
.ajaxMenu .kontaktvariante div {
	padding:1px 0;
	width:175px;
}
.ajaxMenu .kontaktvariante img {
	margin:5px 0 5px 5px;
}
.ajaxMenu .table {
	width:529px;
	padding:0px;
}
.ajaxMenu .moreVersions {
	margin: 10px 0 0 0;
	padding:0 0 20px 0;
	text-align:center;
	width:100%;
}
.ajaxMenu .downloadsList {
	float:right;
	width:266px;
}

/* Tabellenformatierung */
.ajaxMenu .table .row {
	padding:0;
	width:100%;
}
.ajaxMenu .table .hasShoplink {
	background-image:url(../images/white.png);
	background-repeat:repeat-y;
	background-position:right top;
}
.ajaxMenu .table .rowHeader {
	padding:1px 0;
	width:100%;
}
.ajaxMenu .table .titlecol {
	width:51%;
	padding-left:2px;
}
.ajaxMenu .table .row span {
	margin:1px 0;
}
.ajaxMenu .table .row span span {
	margin:0;
}
.ajaxMenu .table .row .title {
	font-weight:bold;
}
.ajaxMenu .table .row .orderid {
	width:16%;
}
.ajaxMenu .table .row .shoplink {
	background-color:white;
	float:right;
	text-align:right;
	padding:2px 0;
	cursor:default;
	margin:0;
	width:13%;
}
.ajaxMenu .table .row .shoplink a {
	font-weight:bold;
/*	display:inline-block; */
	padding:2px;
	margin-left:5px;
}
.ajaxMenu .table .row .shoplink a:hover {
	background-color:#CCCCCC;
}
.ajaxMenu .table .row .downloads {
	float:right;
	width:19%;
}

/* Hover-Effekte (Zeile und Bild)*/
.ajaxMenu .table .row {
	position:relative;
	cursor:pointer; /*EVTL cursor:hand für IE <= 5.5 einfügen*/
}
.ajaxMenu .table .row_hover {
	background-color:#CCCCCC;
	color:#575757;
}
.ajaxMenu .table .row_active,
.ajaxMenu .table .row_active .shoplink a {
	font-weight:bold;
}

.ajaxMenu .table .row span.image {
	display:none;
	float:none;
	position:absolute;
/*	left:-200px; /* linksbündig */
	right:535px; /* rechtbündig */
	margin:-1px 0 0 -1px;
	border:1px solid black;
	background-color:#CCCCCC;
	padding:10px;
}
* html .ajaxMenu .table .row_hover span.image {
	display:none;
	left:-2000px;
}

.ajaxMenu .downloadsList p {
	margin:5px;
	padding-bottom:5px;
}
.ajaxMenu .downloadsList a {
	font-weight:bold;
}
