body {font-family:Arial, Helvetica; font-size:12px; color:#333;}
a {text-decoration:none;}
.clear {clear:both;}
.last {margin-right:0px!important;}
header, footer, nav, article, section {display:block;}
#header-wrapper {margin:0 auto; max-width:1110px; }
header {height:200px; background:#fff url(images/bghead.jpg) no-repeat top center; }
.logo { color: #683C11;    display: block;    font-size: 29px;    font-weight: 800;    padding-left: 80px;    padding-top: 40px;    text-transform: lowercase;}

nav {height:30px; background:transparent url(images/bgnavi.png) repeat-x top left; margin-top:-30px; }
nav ul {position:absolute; right:0; top:6px;}
nav ul li {display:inline; }
nav ul li a {   color: #FFFFFF;    display: block;    float: left;    font-size: 16px;    letter-spacing: 0.04em;    padding-left: 15px;}
.nav-wrapper {  height: 30px;    margin: 0 auto;   max-width: 1110px;position:relative;}

.container {margin:0 auto; max-width: 1135px; padding: 25px;}
.container a {color: #683C11; text-decoration:underline;}

.top h1 {padding-bottom:15px; font-size:24px;}
.top .introtext p {line-height:16px; margin-bottom:15px;}
.top .introtext h2 {padding-bottom:15px; font-size:20px;}
.top .introtext {float:left; max-width:610px; height:200px;  margin-right:50px;}
.top .hero {background-color:  #f1f1f1;   border: 1px solid #E0DFDF;    box-shadow: 1px 3px 12px 4px #CCCCCC;    float: left;  top:-35px;  height: 200px;    position: relative;    width: 448px;}
#button {position:absolute; right:10px; top:-30px;}
#produkte {padding:30px 0;}
.infobox p {margin-bottom:15px;line-height:16px;}
.heroinfo {   bottom: 15px;   left: 205px;   position: absolute;   width: 245px;}
.heroinfo strong {display:block; margin-bottom:5px;}
.heroinfo p {line-height:15px;}
.price { font-size: 28px;   font-weight: 800;   left: 205px;   position: absolute;   top: 35px;}

.Artikel {background-color: #FFFFFF;    border: 1px solid #E0DFDF;    box-shadow: 1px 3px 12px 4px #CCCCCC;    float: left;    height: 215px;    margin-bottom: 30px;    margin-right: 25px;    position: relative;    width: 255px; }
.Artikel a {bottom: 10px;    display: block;  font-size: 14px;   font-weight: 800;   left: 10px;   position: absolute;   text-decoration: none;}
.Artikel a:hover {text-decoration:underline;}
.Artikel h3 {  background-color: #CFCFCF;    font-size: 13px;  height: 25px;    line-height: 25px;   padding-left: 10px;}
.Artikel .produktbild {display:block; position:absolute; left:25px; top:35px;}

footer {margin:0 auto; max-width: 1135px;}
footer a { color: #683C11;  }
.footer-inner {padding-bottom:50px; padding-left: 25px; padding-right: 25px;}
.footer-inner p {margin-bottom:15px; line-height:15px;}

@media screen and (max-width: 1176px){
	.top .hero {
		top: 8px;
	}
}
@media screen and (max-width: 705px){
	nav {
		height: 75px;
		background: transparent url(images/bgnavi.png) top left;
		margin-top: -75px;
	}
	
	nav ul {
		top: 1px;
		right: auto;
		left: -10px;
	}
	
	nav ul li  {
		display: block;
	}
	
	nav ul li a {
		padding: 4px 35px;
	}
	
	.top .hero {
		background-color: transparent;
		border: 0;
		box-shadow: none;
	}
	.top .hero #heroshot, .top .hero .price,
	.top .hero .heroinfo,
	.top .hero #button {
		display:none;
	}
	
	.Artikel {
		width: 100%;
	}
	
	.Artikel .produktbild {
	    display: block;
		position: relative;
		top: 0;
		left: 0;
		margin: auto;
	}
}