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

#content1 {
	background-color: #FFF;
	width: 737px;
	float: left;
	margin-left: 50px;
	padding-top: 60px;
}

#content2 {
	background-color: #FFF;
	width: 1104px;
	padding-top: 60px;
	float: left;
}

#content3 {
	background-color: #FFF;
	width: 1104px;
	padding-top: 20px;
	float: left;
}

#content4 {
	background-color: #FFF;
	width: 1104px;
	padding-top: 60px;
	float: left;
	padding-right: 0px;
	margin: 0px;
}
#content5 {
	background-color: #FFF;
	width: 1054px;
	padding-top: 60px;
	float: left;
	padding-right: 0px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 50px;
}

#content6 {
	background-color: #FFF;
	width: 737px;
	float: left;
	margin-left: 50px;
	padding-top: 60px;
}
#content7 {
	background-color: #FFF;
	width: 1056px;
	margin-top: 60px;
	margin-left: 48px;
	float: left;
}
#content7 .imagebox{
	background-color: #FFF;
	/*width: 1104px;*/
	padding-top: 20px;
	margin-left: -30px;

}

#content7 .imagebox img {
	width: 123px;
	height: 123px;
	margin-left: 30px;
	margin-bottom: 15px;
	border: 1px solid #000;
}

#sp0 {
	width: 90%; 
	background-color: #FFF;
	float: left;
}

#sp0 img{
	float:left;
}

#sp1a {
	width: 395px;
	background-color: #FFF;
	float: left;
}
#sp1b {
	width: 305px;
	background-color: #FFF;
	float: left;
	margin-left: 37px;
	padding: 0px;
}
#sp1b img {
	float: left;
	margin-bottom: 30px;
	width: 305px; /*100%*/
	padding: 0px;
}




.sp6a
{
  float: left;
  width: 398px;
  margin-right: 30px;
}

.sp6b{
	width: 306px;
	padding-bottom: 5px;
	float: right;
}

.sp6b img{
	/*border: 1px solid #CCC;*/
	width: 305px;
}

.sp6c{
	width: 100%;
	background-color: #FFF;
	padding-bottom: 10px;
	float: left;
}

.mehrdazu{
	color: #F3853D;}

.mehrInfo{
	color: #F3853D;
	vertical-align: bottom;
}



.newsbox{
	display: block;
	width: 737px;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #F3853D;
	padding-top: 5px;
}
.newsbox p
{
  /*float: left;*/
  padding-top: 6px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
	margin-bottom: 14px;	
}
.newsbox a
{
  /*float: left;*/
  display: block;
  padding-top: 6px;
  padding-right: 0px;
  padding-bottom: 0px;
  padding-left: 0px;
	margin-bottom: 14px;	
}


.bildbox2  {
	background-color: #FFF;
	margin-left: 50px;
	float: left;
	padding-bottom: 10px;
	padding-right: 0px;
	font-size: 18px;
	color: #808080;
	padding-top: 0px;
	text-decoration: none;
	
}


.bildbox2leg{
	margin-top: 5px;
	margin-bottom: 10px;
	/*
	background-color: #FFF;
	float: left;
	margin-top: 5px;
	margin-right: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	width: 100%;
	*/
}

.bildbox2 img {
	width: 316px;
	height: 169px;
}




.bildbox3  {
	position: relative;
	z-index:10;
	width: 226px;
	height: 286px;
	padding-left: 50px;
	float: left;
	padding-bottom: 20px;
	padding-right: 0px;
	font-size: 14px;
	color: #000;
	padding-top: 0px;
	/*height: 100%;*/
	margin-right: 0px;
}
.bildbox3 h1 {
	font-size: 14px;
	margin-top: 5px;
	margin-bottom: 0px;
}
.bildbox3 a {
		position: relative;
	z-index:200;

	display:block;
	width: 217px;
	height: 217px;
}

.bildbox3 img {
	width: 217px;
	height: 217px;
	margin-bottom: 10px;
	border: 1px solid #000;
}

#bildbox3 leg{
	margin-bottom: 30px;
	background-color: #0FC;
	float: left;
	margin-top: 0px;
	margin-right: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 50px;
}
a.auge, a.augegemerkt {
	padding-top: 0px;
	padding-left: 0px;
	background-repeat: no-repeat;
	
	margin-top: 7px;
	margin-left: 2px;
	padding-left: 12px;
	
	/*float:right;*/
	right: -24px;
	top: 191px;
	position: absolute;
	z-index:300;
	height: 20px;
	width: 40px;
	background-image: url(../Bilder/auge.png);
	color: #000;
	text-decoration: none;	
	/*background-color: #FFc;*/
}
a.auge {
	background-position: 0px -20px;
}
a.augegemerkt {
	background-position: 0px 0px;	
}




#bildbox4  {
	width: 228px;
	float: left;
	font-size: 14px;
	color: #000;
	height: 500px;
	margin-right: 0px;
	background-color: #fff;
	padding: 0px;
	margin-bottom: 20px;
	margin-left: 50px;
}
#bildbox4 img {
	height: 217px;
	width: 217px;
	margin-bottom: 10px;
}
#bildbox4 div {
	margin-right: 10px;
	margin-bottom: 0px;
	float: left;
}
#bildbox4 img, #bildbox4unten img {
	float: left;
	border: 1px solid #000;
}

#bildbox4 div img, #bildbox4unten div img {
	width: 64px;
	height: 64px;
}
#bildbox4unten {
	background-color: #fff;
	float: left;
	margin-top: 10px;
	width: 710px;/**/
	margin-left: 26px;
}

div #bildbox4unten div {
	background-color: #FFF;
	float: left;
	border: 5px solid #FFF;
	margin-right: 19px;
	margin-bottom: 10px;
}
#bildbox4unten .pfeil, #bildbox4unten .pfeil2{
	float: left;
	margin-right: 10px;
	margin-left: 0px;
	margin-top: 18px;
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
}
#bildbox4unten .pfeil2{
	margin-right: 10px;
	margin-left: -10px;
}

#bildbox4unten div:hover , #bildbox4unten .current{
	border-top-color: #CDE96E;
	border-right-color: #CDE96E;
	border-bottom-color: #CDE96E;
	border-left-color: #CDE96E;
}



#bildbox6leg{
	margin-bottom: 30px;
	float: left;
	margin-top: 5px;
	margin-right: 0px;
	margin-left: 0px;
	padding-right: 0px;
	padding-bottom: 0px;
	width: 100%;
}

.bildbox6 img {
	width: 306px;
	height: 169px;
}





#sp4a {
	background-color: #fff;
	width: 368px;
	float: left;
	padding: 0px;
	margin-top: 0px;
	margin-left: 40px;
}
#farben {
	background-color: #FFF;
	margin-top: 25px;
	margin-bottom: 20px;
}
#farben img {
		height: 29px;
		width: 29px;
		border: 1px solid #000;
}
#farben div {
	height: 31px;
	width: 31px;
	border: 2px solid #fff;
	margin-top: 10px;
	margin-right: 3px;
	margin-left: -2px;
	float: left;
	margin-bottom: 0px;
}
#farben div:hover, #farben .current {
	border: 2px solid #cde96e;
}

#table {
	width: 100%;
	background-color: #FFF;
	margin-top: 25px;
	border-spacing: 0px;
	clear: both;
}
#detail {
	width: 100%;
}
#detail tr td  {
	border-bottom-width: 1px;
	border-bottom-style: solid;
	border-bottom-color: #000;
	vertical-align: top;
}
#detail tr th  {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-top: 15px;
}
.button1 {
	font-size: 13px;
	font-weight: bold;
	color: #FFF;
	background-color: #1DA1C9;
	display: block;
	width: 220px;
	text-decoration: none;
	font-style: italic;
	margin-bottom: 8px;
	padding: 3px;
	line-height: 13px;
}
.gemerkt {
	background-color: #1e7cc4;
	background-image: url(../Bilder/gemerkt.png);
		background-repeat: no-repeat;
	background-position: right 0px;
}
.gemerkt:hover {
	background-image: url(../Bilder/gemerkt.png);
		background-repeat: no-repeat;
	background-position: right -0px;
}
.anzupassen {
	background-color: #1e7cc4;
	background-image: url(../Bilder/gemerkt.png);
		background-repeat: no-repeat;
	background-position: right -20px;
}
.anzupassen:hover {
	background-image: url(../Bilder/gemerkt.png);
		background-repeat: no-repeat;
	background-position: right -20px;
}

#anfordern {
	margin-top: 20px;
	margin-bottom: 20px;
	clear: left;
	background-color: #FFF;
	width: 100%;
	float: left;
}
#anfordern .button1 {
	float: right;
}




#rechts1 {
	background-color: #F3853D;
	width: 247px;
	float: left;
	margin-left: 50px;
	margin-top: 60px;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;
}
#rechts1 a {
	color: #FFF;
}
#rechts1 img {
	width: 247px;
	height: auto;
	padding-top: 10px;
	padding-bottom: 35px;
}
.rechts1 h2 {
	font-size: 18px;
	font-style: italic;
	font-weight: bold;
	color: #FFF;
	margin: 0px;
	padding: 0px;
}
.rechts1 h1 {
	font-size: 14px;
	font-weight: bold;
}

.rechts1 h1 p strong {
	color: #FFF;

}


#rechts4 {
	background-color: #C2EA53;
	width: 363px;
	float: left;
	margin-top: 0px;
	margin-left: 50px;
	padding-top: 10px;
	padding-left:5px;
}
.hg2 #rechts4 {
	 background-color: #BBE3F3;}
#rechts4 div {
	margin-left: 10px;
	margin-right: 10px;
}
#rechts4 div h1 {
	margin-bottom: 10px;
}
#offerte {
	margin-left: 0px;
	width: 96%;
	margin-bottom: 10px;
}
#rechts4 div h1 {
	margin-bottom: 10px;
}
#offerte table tr td {
	vertical-align: top;
	padding: 0px;
}
#offerte table tr th {
	border-top-style: none;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 0px;
	padding-top: 15px;
}
#offerte .farbselect{
	margin-left: 0px;
	width: 226px;
}
.td1 {
	/*font-size: 12px;*/
	border-top-style:solid; 
	border-top-color: #000; 
	border-top-width: 1px;
}
.td4 {
	padding-top: 3px;
	padding-bottom: 6px;
	border-top-style:solid; 
	border-top-color: #000; 
	border-top-width: 1px;
	border-bottom-style: double; 
	border-bottom-color: #000; 
	border-bottom-width: 3px;
}
.doppel {
	border-bottom-style: double; 
	border-bottom-color: #000; 
	border-bottom-width: 3px;	
}
/**/
.imp2 {width: 80px;margin-top: 8px;}

	.quickbox {  float:left;}
.offertbox {width: 310px; float: right;}	


/* Tablet Landscape */
@media only screen and (min-width: 1024px) and (max-width: 1324px) {
	#content1 { width: 544px; margin-left: 15px; padding-top: 40px;  background-color: #ffF;}	
	#rechts1 {  width: 200px; margin-left: 15px;  margin-top: 40px;}	
	#rechts1 img { width: 200px; }
	.rechts1 h1 { font-size: 13px; }
	.rechts1 h2 { font-size: 16px; }

	#sp1a { width: 324px; background-color: #ffF;}
	#sp1b { width: 200px; background-color: #ffF; margin-left: 15px;}
	#sp1b img { width: 100%; height:auto;}	
	.sp6a { width: 324px; margin-right: 10px; }	
	#sp1a img { width: 544px; }
	.sp6b { width: 210px;}
	.sp6b img {  width: 210px; }
	.newsbox { width: 544px;}
	#content2 { width: 784px; padding-top: 40px; }	
	.bildbox2 {margin-left: 20px; font-size: 16px;}
	.bildbox2 img {  width: 241px; height: auto; }
	#content3 { width: 784px; }
	.bildbox3 { padding-left: 30px;}
	
	#content4 { width: 544px; padding-top: 40px; }
	#bildbox4 { width: 204px; height: 500px; margin-left: 10px; }
	#bildbox4 img {  height: 200px; width: 200px;}
	#bildbox4 div { margin-right: 7px;}
	#bildbox4 div img, #bildbox4unten div img { width: 59px; height: 59px; }
	
	#sp4a { width: 320px;  margin-left: 10px; }	
	#bildbox4unten { margin-top: 10px; width: 538px;  margin-left: 6px; }
	div #bildbox4unten div {  border-width: 2px;  margin-right: 5px; }	
	#bildbox4unten .pfeil2 { margin-right: 0px; margin-left: 0px; }	
	
	#rechts4 { width: 235px; margin-top: 0px; margin-left: 10px;}	
	#rechts4 div {  margin-left: 6px; margin-right: 8px; }
	
	#content5 { width: 784px; padding-top: 40px; margin-left: 10px; }
	#content7 { width: 784px; margin-left: 10px; margin-top: 40px;}
}

/* Tablet Portrait */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
	/**/
	#content1 { width: width: 737px; margin-left: 0px; padding-top: 40px;  background-color: #ffF;}	
	#rechts1 {  width: 100%;  margin-top: 10px;margin-left: 0px; padding-left: 0px; padding-right: 0px;}
	.quickbox { margin-left: 1.5%; width: 31.5%;/*3*/ float:left;}
	.legende {min-height:120px;}
	#rechts1 img { width: 100%; }
	.rechts1 h1 { font-size: 13px; }
	.rechts1 h2 { font-size: 16px; }

	#content2 {padding-top: 10px; margin-left:-10px;}	
	.bildbox2 {margin-left: 10px; font-size: 16px;}
	.bildbox2 img {  width: 241px; height: auto; }

	
	
	#content4 { width: 544px; padding-top: 40px; }
	#bildbox4 { width: 204px; height: 500px; margin-left: 10px; }
	#bildbox4 img {  height: 200px; width: 200px;}
	
	#bildbox4 div { margin-right: 7px;}
	#bildbox4 div img, #bildbox4unten div img { width: 59px; height: 59px; }
	
	#sp4a { width: 284px;  margin-left: 10px; }	
	#bildbox4unten { margin-top: 10px; width: 538px;  margin-left: 6px; }
	div #bildbox4unten div {  border-width: 2px;  margin-right: 5px; }	
	#bildbox4unten .pfeil2 { margin-right: 0px; margin-left: 0px; }	
	
	#rechts4 { width: 235px; margin-top: 0px; margin-left: 10px; }	
	#rechts4 div {  margin-left: 6px; margin-right: 8px; }
	#content7 { width: 784px; margin-left: 10px; margin-top: 40px;}

	.merklistebox { width: 100%; overflow-x:auto;}
	#content5 {margin-left: 0px;   width: 100%;  }		
	
	
}
/* Smartphone Portrait und Landscape */
@media only screen and (min-width: 320px) and (max-width: 767px) {
	#logobox { position: fixed; width: 96%; margin-left:auto; margin-right:auto;top:0px;}
	#rechts1 {  width: 100%;  margin-top: 10px;margin-left: 0px; padding-left: 0px; padding-right: 0px;}
	#rechts1 img {  width: 100%; }
	.rechts1 h1 {  font-size: 12px;  font-weight: bold; }
	.rechts1 h2 { font-size: 14px;}

	#content1 {  width: 100%;  margin-left: 0px;  padding-top: 60px; }
	#sp1a {  width: 100%; }
	#sp1a img {  width: 98%; height:auto;}
	#sp1b img {  width: 98%; }
	#sp1b { width: 100%; margin-left: 0px; }
	
	#content7 { width: 100%; margin-left: 00px; margin-top: 0px;}
	.newsbox {   width: 100%; }
	.sp6a { width: 100%;  margin-right: 0px; }
		.bildboxen {margin-left: -2%; }	
	.bildbox2 img { width: 100%;  height:auto;}	

	#content3 {margin-left: -6%;   width: 100%;  }
	.bildbox3 a {  width: 100%;  height: 100%;	}	
	.bildbox3 img {  width: 100%;  height: auto;	}
	.bildbox3 .leg { position:relative;  height: 50px;}
	a.auge, a.augegemerkt {  right:-33px; top: -43px; width: 40px;  height: 20px;	}
	
	.merklistebox { width: 100%; overflow-x:auto;}
	#content5 {margin-left: 0px;   width: 100%;  }	
	#merkliste tr td div img {		margin-right: 3px; 	}
	
	
}

/* Smartphone Portrait und Landscape */
@media only screen and (min-width: 512px) and (max-width: 767px) {
		.quickbox { margin-left: 1.5%; width: 31.5%; float:left;}
		.legende {min-height:140px;}
		.bildbox2 {width: 48%;   margin-left: 2%;}
		.bildbox3 {  width: 40%;   margin-left: 6%;  height: 60%;  padding-left: 0px;}
		
}


/* Smartphone Portrait */
@media only screen and (min-width: 320px)  and (max-width: 511px) {	
		.quickbox { margin-left: 1.5%; width: 47.5%; float:left;}
		.legende {min-height:180px;}
		#content7 .imagebox {  padding-top: 0px;  margin-left: -20px; }

		.bildbox2 { width: 98%;   margin-left: 2%; }
		.bildbox3 {  width: 86%;   margin-left: 6%;  height: 100%;  padding-left: 0px;}
		
		#bildbox4 img {  height: 216px; width: 216px;  margin-bottom: 10px; }
		#bildbox4 div img {}

}