/* yanone-kaffeesatz-regular - latin */
@font-face {
  font-family: 'Yanone Kaffeesatz';
  font-style: normal;
  font-weight: 400;
  src: url('../files/fonts/yanone-kaffeesatz-v16-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../files/fonts/yanone-kaffeesatz-v16-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../files/fonts/yanone-kaffeesatz-v16-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../files/fonts/yanone-kaffeesatz-v16-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../files/fonts/yanone-kaffeesatz-v16-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../files/fonts/yanone-kaffeesatz-v16-latin-regular.svg#YanoneKaffeesatz') format('svg'); /* Legacy iOS */
}
/* lora-regular - latin */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 400;
  src: url('../files/fonts/lora-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../files/fonts/lora-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../files/fonts/lora-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../files/fonts/lora-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../files/fonts/lora-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../files/fonts/lora-v17-latin-regular.svg#Lora') format('svg'); /* Legacy iOS */
}
/* lora-700 - latin */
@font-face {
  font-family: 'Lora';
  font-style: normal;
  font-weight: 700;
  src: url('../files/fonts/lora-v17-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../files/fonts/lora-v17-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../files/fonts/lora-v17-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('../files/fonts/lora-v17-latin-700.woff') format('woff'), /* Modern Browsers */
       url('../files/fonts/lora-v17-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../files/fonts/lora-v17-latin-700.svg#Lora') format('svg'); /* Legacy iOS */
}
/* courgette-regular - latin-ext_latin */
@font-face {
  font-family: 'Courgette';
  font-style: normal;
  font-weight: 400;
  src: url('../files/fonts/courgette-v8-latin-ext_latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('../files/fonts/courgette-v8-latin-ext_latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('../files/fonts/courgette-v8-latin-ext_latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('../files/fonts/courgette-v8-latin-ext_latin-regular.woff') format('woff'), /* Modern Browsers */
       url('../files/fonts/courgette-v8-latin-ext_latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('../files/fonts/courgette-v8-latin-ext_latin-regular.svg#Courgette') format('svg'); /* Legacy iOS */
}
html{
	font-size:14px;
}

body {
	background-color: #eadece;
	font-family: 'open sans', 'helvetica', 'arial', sans-serif;
	font-size:1rem;
	margin:0;
	color: #444;


}

body.home{
	height: 100%;
	background-color: #eadece;
	background: url('../img/homebg.jpg');
    background-position: 50% 25%;
    background-size: cover;
    background-attachment: fixed;

}

body.Semmelb{
	height: 100%;
	background-color: #eadece;
	background: url('../img/homebg_Landshut.jpg');
    background-position: 50% 25%;
    background-size: cover;
    background-attachment: fixed;

}

/*popup-Info Startseite*/
.content{
  position: fixed;
  bottom: 60px;
  left: 50px;
  right:  50px;
  background:#e6e2c8;
  width: 80%;
  max-width: 800px;
  min-height: 3.750em; 
  margin-right: 50px;
  padding: 1.250em;
  border-radius: 0.613em;
  box-shadow: 0 2px 5px 0 rgba(0,0,0,0.5);
  -moz-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.5);
  -webkit-box-shadow: 0 2px 5px 0 rgba(0,0,0,0.5);
  line-height: 1.5em;
  color: #292929;
}

.ribbon{
  position:relative;
  padding: 0 0.5em;
  font-family: arial;
  font-size:2.000em;
  margin: 0 0 0 -0.625em;
  line-height: 1.875em;
  color: #e6e2c8;
  border-radius: 0 0.156em 0.156em 0;
  -moz-border-radius: 0 0.156em 0.156em 0;
  -webkit-border-radius: 0 0.156em 0.156em 0;
  background: rgb(123, 159, 199);
  box-shadow: -1px 2px 3px rgba(0,0,0,0.5);
  -moz-box-shadow: -1px 2px 3px rgba(0,0,0,0.5);
  -webkit-box-shadow: -1px 2px 3px rgba(0,0,0,0.5);
}

.ribbon:before, .ribbon:after{
  position:absolute;
  content: '';
  display: block;
}

.ribbon:before{
  width: 0.469em;
  height: 125%;
  padding: 0 0 0.438em;
  top: 0px;
  left: -0.469em;
  background:inherit;
  border-radius: 0.313em 0 0 0.313em;
  -moz-border-radius: 0.313em 0 0 0.313em;
  -webkit-border-radius: 0.313em 0 0 0.313em;
}

.ribbon:after{
  width: 0.313em;
  height: 0.313em;
  background: rgba(0,0,0,0.35);
  bottom: -0.313em;
  left: -0.313em;
  border-radius: 0.313em 0 0 0.313em;
  -moz-border-radius: 0.313em 0 0 0.313em;
  -webkit-border-radius: 0.313em 0 0 0.313em;
  box-shadow: inset -1px 2px 2px rgba(0,0,0,0.3);
}

@media (max-width: 600px) {
  
  body{
    font-size:0.875em;
  }
  
  .ribbon:before, .ribbon:after{
    font-size: 0.714em;
  }
  
}
/* Ende popup-Info Startseite*/

/*FAQS*/
.accordion-container {
	position: relative;
	margin-left: auto;
    margin-right: auto;
	width: 70%;
	/*border: 1px solid #0079c1;*/
	border-top: none;
	outline: 0;
	cursor: pointer
}

.accordion-container .article-title {
	display: block;
	position: relative;
	margin-top: 5px;
	padding: 0.625em 0.625em 0.625em 2em;
	/*border-top: 1px solid #0079c1;
	font-size: 1.25em;*/
	font-weight: normal;
	/*color: #0079c1;*/
    background-color: #D1BBAB;
    color: black;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
		cursor: pointer;
}

.accordion-container .article-title:hover,
.accordion-container .article-title:active,
.accordion-container .content-entry.open .article-title {
		background-color: #AC5313;
		color: white;
}

.accordion-container .article-title:hover i:before,
.accordion-container .article-title:hover i:active,
.accordion-container .content-entry.open i {
		color: white;
}

.accordion-container .content-entry i {
		position: absolute;
		top: 3px;
		left: 8px;
		font-style: normal;
		font-size: 1.625em;
		sans-serif;
		color: white;
}

.accordion-container .content-entry i:before {
		content: "+ ";
}

.accordion-container .content-entry.open i:before {
		content: "\2212";
}

.accordion-content {
	background-color: #eadece;
	margin-top: 5px;
    display: none;
	padding-left: 15px;
	padding-right: 15px;
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
}
/*FAQS ENDE*/

/*Achtung-Text z.B. bei Ein-Tages-Bestellung*/
.achtung {
    padding: 20px;
    height: 190px;
    width: 100%;
    background-color: #BFBFBF;
    font-size: 16px;
    font-weight: bold;
    color: #C00000;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 15px;
    /*-webkit-animation: glow 1s ease-in-out infinite alternate;
    -moz-animation: glow 1s ease-in-out infinite alternate;
    animation: glow 1s ease-in-out infinite alternate;*/
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
}
/*Achtung-Text z.B. bei Bestell-Matrix mit nicht-lieferbaren Wochentagen*/
.achtung2 {
    padding: 20px;
    height: 60px;
    width: 100%;
    background-color: #BFBFBF;
    font-size: 16px;
    font-weight: bold;
    color: #C00000;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 15px;
    /*-webkit-animation: glow 1s ease-in-out infinite alternate;
    -moz-animation: glow 1s ease-in-out infinite alternate;
    animation: glow 1s ease-in-out infinite alternate;*/
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
}

@-webkit-keyframes glow {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #e60073, 0 0 40px #e60073, 0 0 50px #e60073, 0 0 60px #e60073, 0 0 70px #e60073;
  }
  
  to {
    text-shadow: 0 0 20px #fff, 0 0 30px #ff4da6, 0 0 40px #ff4da6, 0 0 50px #ff4da6, 0 0 60px #ff4da6, 0 0 70px #ff4da6, 0 0 80px #ff4da6;
  }
}
/*Achtung ENDE*/

.clear{
	clear:both;
}
#gutschein{
	position: fixed;
	left:-5px;
	top: 30%;
	z-index: 19;
	transform-origin: 0% 90%;
	-webkit-transform-origin:0% 90%;
	-ms-transform-origin:0% 90%;
}


#gutschein:hover {
  -webkit-animation-name: wiggle;
  -ms-animation-name: wiggle;
  -ms-animation-duration: 1000ms;
  -webkit-animation-duration: 1000ms;
  -webkit-animation-iteration-count: 1;
  -ms-animation-iteration-count: 1;
  -webkit-animation-timing-function: ease-in-out;
  -ms-animation-timing-function: ease-in-out;
}

@-webkit-keyframes wiggle {
  0% {-webkit-transform: rotate(5deg);}
  25% {-webkit-transform: rotate(-5deg);}
  50% {-webkit-transform: rotate(5deg);}
  75% {-webkit-transform: rotate(-5deg);}
  100% {-webkit-transform: rotate(0deg);}
}

@-ms-keyframes wiggle {
  0% {-ms-transform: rotate(1deg);}
  25% {-ms-transform: rotate(-1deg);}
  50% {-ms-transform: rotate(1.5deg);}
  75% {-ms-transform: rotate(-5deg);}
  100% {-ms-transform: rotate(0deg);}
}

@keyframes wiggle {
  0% {transform: rotate(5deg);}
  25% {transform: rotate(-5deg);}
  50% {transform: rotate(5deg);}
  75% {transform: rotate(-5deg);}
  100% {transform: rotate(0deg);}
}

a{
    text-decoration: none;
	color: inherit;
}
a:visited{
	color: inherit;
	text-decoration: none;
}

hr {
	border: 1px solid #000000;
}

.row.table{
	border-bottom: 1px solid #000000;
	padding: 5px 0;
}

h1 {
	margin-bottom: 3rem;
	font-size: 2.5rem;
	font-family: 'Lora', 'open sans', sans-serif;
	font-weight: 400;
}

h2 {
	margin-bottom: 2rem;
	font-size: 2rem;
	font-family: 'Lora', 'open sans', sans-serif;
	font-weight: 400;
}
h3 {
	margin-bottom: 1.5rem;
	font-size: 1.5rem;
	font-family: 'Lora', 'open sans', sans-serif;
	font-weight: 400;
}
.page-title{
	margin-top: 4rem;
}

.fixed {
	width: 100%;
	left: 0;
	position: fixed;
	top: 0;
	z-index: 99;
}
.top-nav {
	/*background: #eadece;
	padding-bottom: 1rem;*/
    background-color: #E0CDBA;
    color: #3F3232;
    text-shadow: 0 -1px 1px #D9D9D9, 0 1px 1px #666666;
	font-size: 14px;
    padding-bottom: 1rem;
    padding-right: 5%;
    white-space: nowrap;
}
.top-nav ul{
	width: 100%;
	padding-top: 1rem;
}
.top-nav ul>li{
	float: right;
	display: inline-block;
	list-style: none;
}

.top-nav ul>li.large-1:nth-of-type(4){
	min-width: 130px;
	/*width: auto;
	padding: 0 40px;
	display: block;
	box-sizing: content-box;*/
	/*min-width: 130px;*/
}
.top-nav li.active a{

	padding: 0 12px 2px 12px;
	border-bottom: 5px solid #444;
}
.top-nav li.active .sorti-dropdown {
	padding:20px 20px 20px 0px;
	box-sizing: content-box;
	margin-top:20px;
	background:#d6bca7;
	position: absolute;
	width: auto;
    /* Border Radius von 5px */
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
    /* Schatten */
    -moz-box-shadow: 0px 0px 1px 1px rgba(100,100,100,0.3);
    -webkit-box-shadow:  0px 0px 1px 1px rgba(100,100,100,0.3);
    box-shadow: 0px 0px 1px 1px rgba(100,100,100,0.3);
}
.top-nav li.active .sorti-dropdown a {
	line-height:2;
	text-decoration: none;
	border-bottom: none;
	position: relative;
	padding-left: 0;
}

.top-nav.hide-small{
	text-align: center;
}
.container {
    margin-top: 5rem;
}

.hidden{
	display	: none;
}
.center {
	text-align: center;
}
ul.profile {
	margin-left: 20px;
	list-style-type: disc;
}

.help{
	display: none;
	padding: 1.5rem;
	margin-bottom:3rem;
	background: #d6bca7;
}

.help_single_order{
	display: none;
    padding: 0.5rem;
    font-weight: bold;
    font-size: 11px;
    text-align: left;
	background: #d6bca7;
}

.help ul {
	list-style-type: disc;
	padding-left:2rem;
}

.help ul li{
	padding-bottom: 1rem;
}

input[type="number"] {
   width:100px;
}

input[type="text"], input[type="password"],  input[type="date"],  input[type="number"],  input[type="email"]{
	font-family: 'Lora', 'open sans', sans-serif;
    height: 2.5rem;
    line-height: 2rem;
    text-align: left;
    padding: 10px;
    font-size: 1.4rem;
    border: none;
    border-radius: 5px;
}
input[type="text"]:focus, input[type="number"]:focus, input[type="password"]:focus, input[type="email"]:focus{
	outline: none;

}
input[type="submit"] {
	background: #E14D2A;
    color: #FFD384;
    border: 2px solid #000;
    border-radius: 5px;
    height: 2.5rem;
    line-height: 1.25rem;
    vertical-align: bottom;
    min-width: 62px;
    font-weight: bold;
    font-size: 1rem;
    display: inline-block;
}
input[type="button"],  a.button{
	background: none;
    border: 2px solid #000;
    border-radius: 5px;
    height: 2.5rem;
    line-height: 1.25rem;
    vertical-align: bottom;
    min-width: 62px;
    font-weight: bold;
    font-size: 1rem;
    display: inline-block;
}
.button {
   background-color: #C8B4A7;
   color: #567FB3;
   font-weight: bold;
   vertical-align: middle;
   font-size: 1.5rem;
   padding: 0 5px 0 5px;
   border: 2px solid #000; 
    -moz-border-radius:10px;
    -webkit-border-radius:10px;
    border-radius:10px;
}

input[readonly]{
	background:#c1bbb1;
	color: #444444;
}

.input-wrap input.form{
	width: 100%;
}
.input-wrap {
	float: left;
	width: 60%;
	position: relative;
}

.text-alert{
	border: solid 2px red;
}

a.cal {
	position: absolute;
	top: 4px;
	right: 4px;
}
.cal-icon{
	margin-top:4px;
	display: block;
}
a.button{
	padding: 0.5rem;
}
label{
	padding-right: 1rem;
	cursor: pointer;
}

input.radio-hidden{
	display:none;
}
label.radio-hidden{
	font-weight: 600;
}
label.radio-hidden:hover{
	cursor: pointer;
	text-decoration: underline;
}
footer ul>li{
	display: inline-block;
	list-style: none;
	text-align: center;
	padding-right: 80px;

}


footer.fixed{
	padding-top: 10px;
	bottom: 0;
	top: auto;
	top: initial;
	background-color: #E0CDBA;
	padding-bottom: 1rem;
}


#hfd-logo{
    position: fixed;
    top: 20%;
    left: 50%;
    z-index: 117;
    transform: translate(-50%, -40%);

}
#hfd-logo img{
	width: 200px;
}

#site-wrapper, .site-wrapper{
	padding-bottom: 5rem;
	max-width: 1440px;
	margin: 0 auto;
	position: relative;
}


.no-padding-left{
	padding-left: 0;
}

.plz p{
	padding-bottom: 3rem;
}


.col{
	margin-top: 3rem;
}

.col p{
	margin-bottom: 3rem;
}

.breadcrumbs{
	padding-left: 1.1rem;
    padding-top: 3rem;
    margin-bottom:4rem;
}

.error_box{
	background: #d24d3c;
	padding: 1rem;
	margin-bottom: 1rem;
	width: 100%;
    margin-top: 70px;
    /*position: absolute;*/
    text-align: center;
    color: white;
}
.error_box p span{
	font-weight: bold;
	padding-right: 2rem;
}
form p{
	padding-bottom: 3rem;
}


.sonstige-lieferablage{
	margin-top: 40px;
}
.login_box{
	background: #d6bca7;
	padding:2rem;
	text-align: center;
	margin-top: 5rem;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}
.login_box_2{
	background: #d6bca7;
	padding:5px;
	text-align: center;
	margin-top: 0;
    -moz-border-radius:5px;
    -webkit-border-radius:5px;
    border-radius:5px;
}
.login_box p{
	padding-bottom: 20px;
}
.login_box input[type="submit"]{
	margin: 0 auto;
}
.login_box span{
	font-size: 0.9rem;
}

.new_customer{
	margin-top: 2rem;
	text-align: center;
}
.new_customer a{
	display: block;
	font-weight: 600;
	text-align: left;
	padding-left: 2rem;
}
.new_customer a:hover{
	text-decoration: underline;
}
.new_customer input[type="radio"]{
	float:left;
}

.box {
	padding:2rem;
	text-align: center;
}
.green{
	background: #67a75e;
}

.red{
	background: #c76256;
    color: white;
}

.orange {
	background: #c78b39;
}

.yellow {
	background: #e8d06d;
}

.sortiment-overview p{
	text-align: center;
	font-size: 1.2rem;
	font-weight: 600;
}

.sortiment-overview img{
	margin: 0 auto;
	display: block;
	height: 250px;
	margin-bottom: 40px;
	cursor: pointer;
}

#product-detail-wrapper #product-detail-inner{
	display: none;

}

#product-detail-inner img, .product-detail .img img{
	width: 100%;
	display: block;
	/*max-height: 400px;*/
	transform: scale(1.2);
	-moz-transform: scale(1.2);
}

img.baecker{
	max-width:200px;
	height: auto;
	transform: none;
	display: inline;
	vertical-align: middle;
	padding: 10px;
}

#product-detail-inner img.baecker{
	max-width:200px;
	transform: none;
	display: inline;
	vertical-align: middle;
	padding: 10px;
}
#product-detail-inner .column:first-child{
	padding-left: 0;
}

#product-detail-wrapper {
	border-bottom: 3px solid #000000;
	padding-bottom: 2rem;
}

#product-carousel, #product-carousel-small{
	overflow: hidden;
	height: 210px;
}
#product-carousel-wrapper, #product-carousel-wrapper-small{
	position: absolute;
	height: 210px;
}
#loader{
	height: 100px; 
	width: 100px; 
	margin: 100px auto; 
	display:block;

}
#product-carousel-wrapper .product,  #product-carousel-wrapper-small .product{
	float:left;
	cursor: pointer;
	transform: scale(1.0);
	transition: border-width 0.4s ease-in-out;
	border-top: 0px solid #000;
	box-sizing: content-box;
}

#product-carousel-wrapper .product.active,  #product-carousel-wrapper-small .product.active{
	border-top: 23px solid #000;
	box-sizing: content-box;
}
#prev, #prev-small {
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 100;
	width: 200px;
	height: 187px;
	background: linear-gradient(0deg, #eadece , transparent);
	background: -webkit-linear-gradient(0deg, #eadece , transparent);
	background: -moz-linear-gradient(0deg, #eadece , transparent);
}
#prev::after, #prev-small::after{
	content: '';
	position: absolute;
	width: 0px;
	height: 0px;
	left: 20px;
	top: 90px;
	-webkit-transform:rotate(360deg);
	border-style: solid;
	border-width: 15px 15px 15px 0;
	border-color: transparent #543f23 transparent transparent;

}
#prev:hover, #next:hover, #prev-small:hover, #next-small:hover{
	cursor: pointer;
}
#prev:hover:after, #prev-small:hover:after {
	border-color: transparent #000 transparent transparent;
}
#next, #next-small {
	position: absolute;
	right: 0;
	z-index: 100;
	width: 100px;
	height: 187px;
	bottom: 0;
	background: linear-gradient(180deg, #eadece , transparent);
	background: -webkit-linear-gradient(180deg, #eadece , transparent);
	background: -moz-linear-gradient(180deg, #eadece , transparent);

}
#next::after, #next-small::after{
	content: '';
	position: absolute;
	width: 0px;
	height: 0px;
	right: 20px;
	top: 90px;
	-webkit-transform:rotate(360deg);
	border-style: solid;
	border-width: 15px 0 15px 15px;
	border-color: transparent transparent transparent #543f23;

}
#next:hover:after {
	border-color: transparent transparent transparent #000000;
}

select{
	height: 2.5rem;
    border-radius: 5px;
    border: 2px solid #000;
    width: 50%;
   	font-family: 'Lora', 'open sans', sans-serif;
    font-size: 19px;
    padding-left: 8px;
    -webkit-border-radius: 5px;
}
label.form{
	width: 40%;
	float: left;
	display: block;
	height: 2.5rem;
	margin-bottom: 10px;
	line-height:2;
}
input.form, select.form{
	width: 60%;
	float: left;
	display: block;
	margin-bottom: 10px;
    border-radius: 5px;
}

input.form-full, select.form-full{
	width: 100%;
	margin-bottom: 1rem;
}
span.semibold{
	font-weight:600;
}
.check-data {
	line-height: 1.5;
}

input.order-amount{
	border: 1px solid #9e8d83;
	font-size: 1rem;
	
}
input.order-amount:focus{
	border: 1px solid #444444;
}
div.order-amount{
	padding-left: 2px;
	padding-right: 2px;
}

div.order-amount.display{
	text-align: center;
}
.readonly .order-amount{
	background: none;
	text-align: center;
}
.xbox{
	width: 100%;
	height: 2.5rem;
	background: grey;
	border: 1px solid #9e8d83;
    border-radius: 5px;
}

.home-link {
	position: fixed;
	top: 1rem:
	left: 1rem;
	width: 50px;
	height: 50px;

}
.home-link img{
	width: 100%;
	height: 100%;
}
.home .home-link{
	display: none;
}

.hide-large	{
	display: none;
}
.hide-small{
	display: block;
}
.product-detail{
	display: none;
	overflow: hidden;
	margin-top: 50px;
	background: #d6bca7;
	padding: 1rem;
}
.product-overview.active{
	background: #d6bca7;
	padding-bottom: 10px;
	margin-bottom: 1rem;
}
.product-overview{
	 white-space: nowrap;
}
.sort-desc{
	line-height: 50px;
    vertical-align: middle;
    display: inline-block;
    padding-right: 15px;
}
.sort-desc-pa{
    line-height: 100px;
    vertical-align: top;
    display: inline-block;
}
.invers{
    font-style: italic;
}

form[name='page5'] p {
	padding-bottom:1rem;
}


@media screen and (max-device-width: 55em), screen and (max-width: 60em) {
	ol{
		padding-left: 1rem;
	}
/*	body.AGBs .mobile-nav ul{
		margin-top: 0;
	}*/
	#menu-toggle {
	  	position: fixed;
	    right: 4rem;
	    top: 2em;
	    z-index: 421;
	    margin-top: 0;
	}
	#menu-toggle span {
	    cursor: pointer;
	    border-radius: 1px;
	    height: 4px;
	    width: 35px;
	    background: #000;
	    position: absolute;
	    display: block;
	    content: '';
	}



	#menu-toggle span::before{
		 cursor: pointer;
	    border-radius: 1px;
	    height: 4px;
	    width: 35px;
	    background: #000;
	    position: absolute;
	    display: block;
	    content: '';
		top: -10px;
	}
	#menu-toggle span::after{
		 cursor: pointer;
	    border-radius: 1px;
	    height: 4px;
	    width: 35px;
	    background: #000;
	    position: absolute;
	    display: block;
	    content: '';
		bottom: -10px;
	}
	.mobile-nav{
		position: relative;
		margin-bottom: 2rem;
		padding: 0;
		z-index: 400;
		height: 0;
		overflow: hidden;
		top: 0;
		background: #eadece;

		transition-property: height;
		transition-duration: 0.3s;
		transition-timing-function: linear;
		-webkit-transition-property: height;
		-webkit-transition-duration: 0.3s;
		-webkit-transition-timing-function: linear;
		-moz-transition-property: height;
		-moz-transition-duration: 0.3s;
		-moz-transition-timing-function: linear;	
	}

	#prev, #next{
		width: 100px;
	}
	#prev-small, #next-small{
		width: 50px;
	}

	.mobile-nav ul{
		margin-top: 3rem;
	}
	.mobile-nav ul li{
		display: block;
	    width: 100%;
	    height: 3.3rem;
	    text-align: right;
	    padding-right: 2rem;
	    font-size: 1.3rem;
	    max-width: none;
	    border-bottom: 2px solid #000000;
	    line-height: 3.6rem;
	}

	.mobile-nav.top-nav li.active a{

		padding: 0;
		border-bottom: none;
	}
	.mobile-nav hr{
		margin:0;
	}
	.mobile-nav.top-nav li.active{
		background: #D6BCA7;
	}
	.mobile-nav.top-nav li.active a{
		font-weight: 700;
	}
	#menu-toggle.active + .mobile-nav {
		height:  618px;
	}
	.small-margin-bottom{
		margin-bottom :20px;
	}
	.breadcrumbs.mobile-menu{
		padding-bottom:0;
		margin-bottom:0;
	}

	.footer-nav{
		display: none;
	}

	input[type="text"].mobile-full, input[type="password"].mobile-full,  input[type="date"].mobile-full,  input[type="email"].mobile-full, p.mobile-full{
		width: 100%;
	}
	p.mobile-full{
		padding-bottom: 0;
	}
	.sonstige-lieferablage{
		margin-top: 0px;
	}	
	
	label.form{
		line-height: 1.1;
	}
	.small-center{
		margin: 0 auto;
	}
	input.order-amount{
		padding: 0;
	}
	.small-no-padding{
		padding-left:0;
		padding-right:0;
	}

	.sort-desc{
		line-height: 50px;
	    vertical-align: middle;
	    display: inline-block;
	}
	#gutschein{
		top: 50%;
	}
	#hfd-logo{
		top: 25%;	
	}
	#hfd-logo img {
		width: 200px;
	}
	.small-margin-bottom{
		margin-bottom: 100px;
	}
	.hide-small{
		display: none;
	}
	.hide-large{
		display: block;
	}
	#product-detail-inner img, .product-detail .img img{

		transform: none;
		-moz-transform: none;
	}
	#product-detail-wrapper{
		border-bottom: 0;
	}
	.product-overview{
		 white-space: normal;
	}

	#gutschein{
		position: fixed;
		left:-2px;
		top: 40%;
		width: 186px;
		height: 126px;
		z-index: 19;
		transform-origin: 0% 90%;
		-webkit-transform-origin:0% 90%;
		-ms-transform-origin:0% 90%;
	}

	#hfd-logo{
	    position: fixed;
	    top: 15%;
	    left: 50%;
	    z-index: 117;
	    transform: translate(-50%, -40%);

	}
	#hfd-logo img{
		width: 200px;
	}

	body.Sortiment .container{
		margin-top: 0rem;
	}
	body.Sortiment h1{
		margin-bottom:0 !important;
	}

	html.probe .mobile-nav ul{
		margin-top: 0;
	}

}


@media screen and (max-device-width: 55em), screen and (max-width: 60em){
	body.home{
	    background-size: 230% !important;
		background-position: 50% 0% !important;
		background-repeat-y: no-repeat !important;
		background-attachment: initial !important;

	}
}

@media only screen and ((min-device-width : 768px) and (max-device-width : 1024px) and (orientation : landscape)), screen and (min-width : 768px) and (max-width : 1024px) {
	
    .sorti-thumb {
		width: 33%;
	}
	
	#product-detail-inner .hide-small{
		display: none;
	}

	#product-detail-inner .hide-large{
		display: none;
	}

	#product-detail-inner .show-medium{
		display:block;
	}

	#product-detail-inner .product-text{
		width: 50%;
	}
	#product-detail-inner .img{
		width: 50%;
	}
	#product-detail-inner h2{
		margin-top: 2rem;
	}
	#gutschein{
		position: fixed;
		left:-2px;
		top: 40%;
		width: 186px;
		height: 126px;
		z-index: 19;
		transform-origin: 0% 90%;
		-webkit-transform-origin:0% 90%;
		-ms-transform-origin:0% 90%;
	}
	body.home{
	    background-position: 50% 0%;
	    background-size: cover;
	    background-attachment: fixed;

	}
	#hfd-logo{
	    position: fixed;
	    top: 15%;
	    left: 50%;
	    z-index: 117;
	    transform: translate(-50%, -40%);

	}
	#hfd-logo img{
		width: 200px;
	}


	.top-nav.mobile-nav{
		position: fixed;
		right: 0;
	    top: 0;
	    width: 250px;
	    left: auto;
	    border-left: 2px solid #000000 ;
	    padding: 0;

	}
	p.mobile-full{
		width: auto;
	}
}


@media screen and (max-device-width: 55em) and (orientation : landscape) , screen and (max-width: 60em) and (orientation : landscape) {
	body.home{
	    background-size: 100% !important;
		background-position: 50% 5% !important;
		background-repeat-y: no-repeat !important;
		background-attachment: initial !important;

	}
}