@font-face {
    font-family: "DIN Regular";
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/DINRegular.eot?") format("embedded-opentype"), url("../fonts/DINRegular.woff") format("woff"), url("../fonts/DINRegular.ttf") format("truetype");
}
@font-face {
    font-family: "DIN Bold";
    font-style: normal;
    font-weight: normal;
    src: url("../fonts/DINBold.eot?") format("embedded-opentype"), url("../fonts/DINBold.woff") format("woff"), url("../fonts/DINBold.ttf") format("truetype");
}
/*

Theme: Micro Product Site
Author: nu3.de
Author URI: http://nu3.de
*/
/* ==========================================================================
Reset CSS
========================================================================== */
html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
a,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
input,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
figure,
figcaption,
footer,
header,
hgroup,
nav,
section,
menu,
main,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 100%;
  vertical-align: baseline;
  background-color: transparent;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
}
article,
aside,
figure,
footer,
header,
hgroup,
nav,
section,
menu,
main {
  display: block;
}
nav ul,
ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: '';
  content: none;
}
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted #000;
  cursor: help;
}
input[type="radio"],
input[type="checkbox"],
label {
  vertical-align: top;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}
label,
input[type=button],
input[type=submit],
button {
  cursor: pointer;
}
::-moz-selection {
  background-color: #0d9fd5;
  color: #fff;
}
::selection {
  color: #fff;
  background: #0d9fd5;
}
:focus {
  outline: 0;
}
/*
* NU3 BASE STYLES - BULIT with LESSCSS
* http://www.nu3.de
* AUTHOR: Jodie Walker - jodie.walker@nu3.de - @jokercreative
* CREATED: 02.11.2012
* BASED ON: http://lesscss.org/
*/
/* Table of Contents
====================================================
      #LESSCSS Defaults
      #LESSCSS Presets
      #Shorthand Classes
      #Color Scheme
      #Navigation
      #Messages and errors
*/
/* #Shorthand Classes
================================================== */
.regular {
  font-weight: normal;
}
.bold {
  font-weight: bold;
}
.float-left {
  float: left;
}
.float-right {
  float: right;
}
.hide,
.hidden {
  display: none;
}
.show,
.block {
  display: block;
}
.in-block {
  display: inline-block;
}
.invisible {
  visibility: hidden;
}
.ov-h {
  overflow: hidden;
}
.relative {
  position: relative;
}
.absolute {
  position: absolute;
}
.hide-text {
  display: block;
  text-indent: -999em;
  letter-spacing: -999em;
  overflow: hidden;
}
.show-text {
  display: block;
  text-indent: 0;
  letter-spacing: normal;
  overflow: visible;
}
.unstyled-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.inline-list li {
  position: relative;
  float: left;
}
.text-right {
  text-align: right;
}
.text-center {
  text-align: center;
}
.text-left {
  text-align: left;
}
.last {
  margin: 0;
}
.cb {
  clear: both;
}
.scale-image img {
  width: 90%;
  height: auto;
}
.no-margin-top {
  margin-top: 0;
}
.no-margin-right {
  margin-right: 0;
}
.no-margin-bottom {
  margin-bottom: 0;
}
.no-margin-left {
  margin-left: 0;
}
.margin-top {
  margin-top: 10px;
}
.margin-right {
  margin-right: 10px;
}
.margin-bottom {
  margin-bottom: 10px;
}
.margin-left {
  margin-left: 10px;
}
.padding-top {
  padding-top: 10px;
}
.padding-right {
  padding-right: 10px;
}
.padding-bottom {
  padding-bottom: 10px;
}
.padding-left {
  padding-left: 10px;
}
.no-padding-top {
  padding-top: 0;
}
.no-padding-right {
  padding-right: 0;
}
.no-padding-bottom {
  padding-bottom: 0;
}
.no-padding-left {
  padding-left: 0;
}
.valign-top {
  vertical-align: top;
}
.valign-middle {
  vertical-align: middle;
}
.valign-bottom {
  vertical-align: bottom;
}
.inner-container {
  display: table-cell;
  vertical-align: middle;
  width: 100%;
  margin: 0 auto;
  text-align: left;
}
.no-border {
  border: 0;
}
.full-width {
  width: 100%;
}
.underline-link {
  text-decoration: underline;
}
.no-print {
  display: none;
}
/* BEAVITA STYLES - Table of Contents
====================================================
      #Main Settings
      #Icons
      #Primary Styles
      #Main Banner (Header)
      #Main Content
      #Main Navigation
      #Footer
      #Clearing
      #Others
*/
/* #Main Settings
================================================== */
/* #Icons
================================================== */
.icon.rtl {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -150px 0px;
  width: 123px;
  height: 27px;
  float: left;
  margin-right: 0;
  margin-top: 8px;
}
.icon.vox {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -150px -30px;
  width: 89px;
  height: 30px;
  float: left;
  margin-right: 0;
  margin: 13px 0 0 18px;
}
.icon.vox-rtl-footer {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -240px -30px;
  width: 133px;
  height: 12px;
  float: left;
  margin-right: 0;
  float: none;
  display: block;
  margin: 0 auto;
}
.icon.arrow {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -45px;
  width: 7px;
  height: 10px;
  float: left;
  margin-right: 0;
}
.icon.arrow-red {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -15px -45px;
  width: 5px;
  height: 8px;
  float: left;
  margin-right: 0;
}
.icon.arrow-red-up {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -30px -45px;
  width: 8px;
  height: 5px;
  float: left;
  margin-right: 0;
}
.icon.tick {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -285px 0px;
  width: 21px;
  height: 20px;
  float: left;
  margin-right: 9px;
}
.icon.glass {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -60px;
  width: 27px;
  height: 60px;
  float: left;
  margin-right: 0;
}
.icon.dish {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -30px -60px;
  width: 65px;
  height: 60px;
  float: left;
  margin-right: -5px;
}
.icon.plus {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -120px -90px;
  width: 15px;
  height: 15px;
  float: left;
  margin-right: 0;
  position: relative;
  top: 19px;
  margin: 0 21px 0 15px;
}
.icon.dish-sml {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -105px -60px;
  width: 31px;
  height: 29px;
  float: left;
  margin-right: 0;
}
.icon.glass-sml {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -105px -90px;
  width: 13px;
  height: 28px;
  float: left;
  margin-right: 0;
}
/* #Primary Styles
================================================== */
body {
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
  font-size: 16px;
  line-height: 1.125em;
  -webkit-font-smoothing: subpixel-antialiased;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  color: #b7183c;
  font-weight: normal;
}
h1 {
  font-size: 1.25em;
  line-height: .9em;
  margin-bottom: 28px;
}
h2 {
  margin-bottom: 23px;
}
h4,
h5 {
  font-size: .875em;
  margin-bottom: 14px;
  text-transform: uppercase;
}
h5 {
  color: #000000;
}
a {
  color: #b7183c;
}
p,
address {
  font-size: .875em;
  line-height: 1.5em;
  text-align: justify;
}
p,
address,
.address {
  padding-bottom: 20px;
  font-style: normal;
}
strong {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  color: #b7183c;
}
article p {
  color: #1d1d1c;
}
ul li,
ol li {
  font-size: .875em;
}
dt {
  float: left;
}
dt,
dd {
  font-size: .875em;
  line-height: 1.5em;
}
hr {
  border-color: #b7183c;
  margin-bottom: 0;
}
sup {
  vertical-align: top;
  font-size: .563em;
}
figure.float-right {
  margin: 7px 0 0 15px;
}
.well {
  padding: 10px;
}
.wrapper {
  padding: 21px;
}
/* #Tables
================================================== */
table {
  width: 100%;
  border-collapse: collapse;
}
table thead {
  background: #b7183c;
}
table thead th {
  padding: 10px 0;
  font-size: .75em;
  font-weight: normal;
  color: #ffffff;
}
table thead th span {
  font-size: .813rem;
}
table tbody {
  font-size: .875em;
}
table tbody td {
  padding: 5px 0;
  border-right: 1px dashed #b7183c;
}
table tbody td:last-child {
  border-right: 0;
}
table tbody td span {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
}
table.data td {
  text-align: center;
}
table.data-list {
  width: 333px;
}
table.data-list th,
table.data-list td {
  padding: 6px 10px;
  font-size: .875rem;
  border-right: 0;
}
table.data-list th {
  text-align: left;
}
table.data-list td {
  color: #b7183c;
  border-bottom: 1px solid #b7183c;
}
table.data-list thead th:last-child,
table.data-list tbody th:last-child,
table.data-list thead td:last-child,
table.data-list tbody td:last-child {
  text-align: center;
}
table.data-list tfoot td {
  font-style: italic;
  text-align: left;
}
/* #Main Banner (Header)
================================================== */
.logo {
  width: 143px;
  height: 39px;
  margin: 38px auto 18px;
  display: block;
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px 0px;
}
.logo.big {
  width: 171px;
  height: 47px;
  margin: 15px auto;
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -150px -60px;
}
/* #Main Content
================================================== */
.main-content {
  width: 755px;
  margin: 0 auto;
}
.main-content a {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
}
.main-content a .at {
  font-family: 'Arial', 'Helvetica', sans-serif;
  font-weight: bold;
}
.main-content p.reference {
  font-size: .688em;
  line-height: 1.273em;
  letter-spacing: 0;
}
.main-content p.reference a {
  text-decoration: underline;
}
.main-content p.reference a:hover {
  text-decoration: none;
}
.main-content .btn {
  display: inline-block;
  overflow: hidden;
  padding: 6px;
  width: 123px;
  vertical-align: middle;
  background: #b7183c;
  font-size: 1.125em;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  text-align: center;
  text-transform: uppercase;
  color: #ffffff;
  cursor: pointer;
}
.main-content .btn:before {
  content: '';
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -45px;
  width: 7px;
  height: 10px;
  float: left;
  margin-right: 0;
  margin: 5px 0 0 8px;
}
.main-content .enhanced-list {
  padding-bottom: 20px;
}
.main-content .enhanced-list.block {
  padding-top: 35px;
}
.main-content .enhanced-list > li,
.main-content .enhanced-list .accordion-title {
  padding-bottom: 15px;
  font-size: .875em;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  text-transform: uppercase;
  cursor: pointer;
  clear: right;
}
.main-content .enhanced-list > li:before,
.main-content .enhanced-list .accordion-title:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -45px;
  width: 7px;
  height: 10px;
  float: left;
  margin-right: 0;
  content: '';
  float: none;
  display: inline-block;
  margin-right: 12px;
}
.main-content .enhanced-list > li:before,
.main-content .enhanced-list .accordion-title:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -15px -45px;
  width: 5px;
  height: 8px;
  float: left;
  margin-right: 0;
  margin: 5px 12px 0 0;
}
.main-content .enhanced-list > li,
.main-content .enhanced-list .accordion-title,
.main-content .enhanced-list > li a,
.main-content .enhanced-list .accordion-title a {
  color: #1d1d1c;
}
.main-content .enhanced-list > li:hover,
.main-content .enhanced-list .accordion-title:hover,
.main-content .enhanced-list > li a:hover,
.main-content .enhanced-list .accordion-title a:hover,
.main-content .enhanced-list > li.active,
.main-content .enhanced-list .accordion-title.active,
.main-content .enhanced-list > li a.active,
.main-content .enhanced-list .accordion-title a.active {
  color: #b7183c;
}
.main-content .enhanced-list > li a,
.main-content .enhanced-list .accordion-title a {
  float: right;
  width: 97%;
}
.main-content .enhanced-list > li:after,
.main-content .enhanced-list .accordion-title:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.main-content .enhanced-list.accordion .accordion-title {
  padding-bottom: 0;
}
.main-content .enhanced-list.accordion .accordion-title.expanded:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -45px;
  width: 7px;
  height: 10px;
  float: left;
  margin-right: 0;
  content: '';
  float: none;
  display: inline-block;
  margin-right: 12px;
}
.main-content .enhanced-list.accordion .accordion-title.expanded:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -30px -45px;
  width: 8px;
  height: 5px;
  float: left;
  margin-right: 0;
  margin: 8px 12px 0 0;
}
.main-content .enhanced-list.accordion .accordion-title.expanded:before {
  -webkit-transform: rotate(180deg);
  margin-left: -3px;
}
.main-content .enhanced-list.accordion .accordion-subtitle {
  margin-top: -10px;
}
.main-content .enhanced-list.accordion > div {
  padding-top: 0;
  padding-bottom: 0;
  font-size: .875em;
  margin: 10px 0 15px 0;
}
.main-content .enhanced-list.accordion > div h4 {
  font-size: 1em;
  text-indent: 0;
}
.main-content .enhanced-list.accordion > div .ingredients {
  width: 310px;
  float: left;
}
.main-content .enhanced-list.accordion > div .ingredients dt,
.main-content .enhanced-list.accordion > div .ingredients dd {
  font-size: 1em;
}
.main-content .enhanced-list.accordion > div .ingredients dt {
  width: 40px;
  clear: right;
}
.main-content .enhanced-list.accordion > div .ingredients dd {
  float: right;
  width: 255px;
}
.main-content .enhanced-list.accordion > div figure {
  width: 330px;
}
.main-content .enhanced-list.accordion > div figure img {
  float: left;
}
.main-content .enhanced-list.accordion > div figure figcaption {
  float: left;
  width: 100%;
}
.main-content .enhanced-list.accordion > div figure figcaption table.data-list {
  width: 100%;
}
.main-content .enhanced-list.accordion > div figure figcaption table.data-list thead th:last-child {
  text-align: right;
}
.main-content .enhanced-list.accordion > div figure figcaption table.data-list tbody tr td {
  width: 33%;
  padding: 1px 10px;
  font-size: 1em;
  text-align: center;
}
.main-content .enhanced-list.accordion > div figure figcaption table.data-list tbody tr:last-child td {
  border-bottom: 0;
}
.main-content .enhanced-list.accordion > div .preparation {
  width: 622px;
  padding-left: 35px;
}
.main-content .enhanced-list.accordion > div .preparation li {
  font-size: 1em;
}
.main-content div.index {
  padding-top: 3px;
}
.main-content header.head {
  padding-top: 10px;
}
.main-content .head {
  margin-top: 16px;
}
.main-content .teaser {
  display: block;
  position: relative;
  width: 713px;
  height: 464px;
}
.main-content .teaser .content {
  position: absolute;
}
.main-content .teaser .content h2 {
  font-size: 1.563em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.main-content .teaser .content p.sub {
  text-transform: uppercase;
  color: #b7183c;
}
.main-content .teaser ul.links {
  position: absolute;
  top: 100%;
  width: 100%;
  height: 30px;
  background: #b7183c;
}
.main-content .teaser ul.links li {
  margin: 0 16px;
}
.main-content .teaser ul.links li:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -45px;
  width: 7px;
  height: 10px;
  float: left;
  margin-right: 0;
  content: '';
  float: none;
  display: inline-block;
  margin-right: 12px;
}
.main-content .teaser ul.links li.last {
  border-left: 5px solid #ffffff;
  padding-left: 15px;
  margin-left: 10px;
}
.main-content .teaser ul.links li a {
  color: #ffffff;
  font-size: 1.063rem;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  line-height: 30px;
}
.main-content .teaser.main {
  background: url('../img/index-main-teaser.jpg') 0 0 no-repeat;
  margin: auto;
}
.main-content .teaser.main .content {
  width: 175px;
  height: 99px;
  background: #ffffff;
  position: relative;
  position: absolute;
  bottom: 74px;
  right: 33px;
  text-align: center;
}
.main-content .teaser.main .content:before {
  content: "";
  position: absolute;
  top: -49px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 87.5px solid transparent;
  border-right: 87.5px solid transparent;
  border-bottom: 49px solid #ffffff;
}
.main-content .teaser.main .content:after {
  content: "";
  position: absolute;
  bottom: -49px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 87.5px solid transparent;
  border-right: 87.5px solid transparent;
  border-top: 49px solid #ffffff;
}
.main-content .teaser.main .content div {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  padding: 0 27px;
  position: relative;
  top: -8px;
  z-index: 1;
}
.main-content .teaser.abnehmen {
  background: url('../img/abnehmen-teaser.jpg') 0 0 no-repeat;
  margin: 5px 0 48px 0;
  height: 529px;
}
.main-content .teaser.abnehmen .content {
  right: 0;
  bottom: 96px;
  width: 334px;
}
.main-content .teaser.abnehmen .content ul {
  margin-left: -30px;
}
.main-content .teaser.abnehmen .content ul li {
  float: left;
  padding: 6px 0;
}
.main-content .posts {
  border-top: 3px solid #b7183c;
}
.main-content .posts article {
  padding: 10px;
  border-bottom: 1px solid #b7183c;
}
.main-content .posts article.last {
  border-bottom: 0;
}
.main-content .posts article header {
  margin: 24px 0;
}
.main-content .posts article header span {
  font-size: .875rem;
  padding-bottom: 4px;
  display: block;
}
.main-content .posts article header h2 {
  color: #9d9d9c;
  font-size: 1.125rem;
}
.main-content .posts article h4 {
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
  font-weight: normal;
}
.main-content .posts article h4.title {
  float: left;
}
.main-content .posts article .date {
  float: right;
  font-size: .875em;
  color: #9d9d9c;
}
.main-content .posts article .content {
  clear: both;
}
.main-content .posts.stories article p {
  width: 480px;
}
.main-content .banners div {
  float: left;
  margin: 10px 0 0 10px;
}
.main-content .banners div:first-child {
  margin-left: 0;
}
.main-content .banners div figcaption {
  position: absolute;
  left: 0;
  bottom: 0;
  background: #b7183c;
  color: #ffffff;
  width: 100%;
  padding: 6px 0;
  text-align: center;
  font-size: 1.125em;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
}
.main-content .banners div figcaption:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -45px;
  width: 7px;
  height: 10px;
  float: left;
  margin-right: 0;
  content: '';
  float: none;
  display: inline-block;
  margin-right: 12px;
}
.main-content .sub-content > section article {
  clear: left;
}
.main-content .sub-content > section article > div {
  padding: 18px;
}
.main-content .sub-content > section article > div.well {
  padding: 18px 28px;
}
.main-content .sub-content > section article > div .col-container {
  padding: 3px 39px 0;
}
.main-content .sub-content > section article > div .col-container .col {
  float: left;
  width: 285px;
  margin-right: 12px;
}
.main-content .sub-content > section article > div .col-container .col h5 {
  text-transform: uppercase;
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
  font-weight: normal;
  margin-top: 30px;
}
.main-content .sub-content > section article > div .col-container .col h5:first-child {
  margin-top: 10px;
}
.main-content .sub-content > section article > div .col-container .col h5 span {
  color: #b7183c;
}
.main-content .sub-content > section article .name {
  margin-top: 15px;
  text-transform: uppercase;
  text-indent: 13px;
  font-size: .875rem;
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
  font-weight: normal;
}
.main-content .sub-content > section article .name span {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  color: #000000;
}
.main-content .sub-content > section article h4 {
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
  font-weight: normal;
  text-transform: uppercase;
}
.main-content .sub-content > section.posts article {
  border-bottom: 0;
  margin-bottom: -40px;
}
.main-content .sub-content > section.posts .totop {
  margin: 0;
}
.main-content .totop {
  float: left;
  width: 100%;
  padding-bottom: 10px;
  margin-top: 20px;
  border-bottom: 1px solid #b7183c;
}
.main-content .totop.last {
  border-bottom: 0;
}
.main-content .totop span {
  float: right;
}
.main-content .totop span:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: 0px -45px;
  width: 7px;
  height: 10px;
  float: left;
  margin-right: 0;
  content: '';
  float: none;
  display: inline-block;
  margin-right: 12px;
}
.main-content .totop span:before {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -30px -45px;
  width: 8px;
  height: 5px;
  float: left;
  margin-right: 0;
  margin: 8px 12px 0 0;
}
.main-content .totop span a {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  font-size: .875rem;
}
.main-content .graphic-tabs {
  margin-top: 0;
}
.main-content .graphic-tabs ul.menu {
  border-top: 3px solid #b7183c;
  border-bottom: 3px solid #b7183c;
  padding: 10px 0;
}
.main-content .graphic-tabs ul.menu li {
  float: left;
  width: 176px;
}
.main-content .graphic-tabs ul.menu li:before {
  background: none;
}
.main-content .graphic-tabs ul.menu li a {
  display: block;
  text-align: center;
}
.main-content .graphic-tabs ul.menu li a img {
  float: left;
  padding-bottom: 10px;
  position: relative;
  top: 5px;
  margin: 0 17px;
}
.main-content .graphic-tabs ul.menu li a span {
  display: block;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  font-size: 1.25rem;
  text-transform: none;
  clear: left;
}
.main-content .graphic-tabs ul.menu li:first-child a img {
  left: -15px;
  top: 0;
  margin: 0;
}
.main-content .graphic-tabs ul.menu li.float-right {
  float: right;
  margin: 0;
}
.main-content .graphic-tabs > section {
  border-top: 0;
}
.main-content .graphic-tabs article h4 {
  text-indent: 31px;
}
.main-content .graphic-tabs .info {
  clear: left;
  padding-top: 33px;
}
.main-content .graphic-tabs .info div {
  border: 0;
}
.main-content .cubes {
  position: relative;
  width: 260px;
  height: 220px;
  padding: 55px 0 105px;
  margin: 100px 0 0 230px;
}
.main-content .cubes p {
  position: absolute;
}
.main-content .cubes p:after {
  content: '';
  display: block;
  width: 100%;
  height: 1px;
  margin-top: 5px;
  background: #fcfcfc;
  background: -moz-linear-gradient(left, #fcfcfc 0%, #cfcecd 99%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #fcfcfc), color-stop(99%, #cfcecd));
  background: -webkit-linear-gradient(left, #fcfcfc 0%, #cfcecd 99%);
  background: -o-linear-gradient(left, #fcfcfc 0%, #cfcecd 99%);
  background: -ms-linear-gradient(left, #fcfcfc 0%, #cfcecd 99%);
  background: linear-gradient(to right, #fcfcfc 0%, #cfcecd 99%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fcfcfc', endColorstr='#cfcecd', GradientType=1);
}
.main-content .cubes p.first {
  top: -54px;
  left: -178px;
  width: 200px;
}
.main-content .cubes p.first:after {
  background: -moz-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #cfcecd), color-stop(99%, #fcfcfc));
  background: -webkit-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: -o-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: -ms-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: linear-gradient(to right, #cfcecd 0%, #fcfcfc 99%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cfcecd', endColorstr='#fcfcfc', GradientType=1);
}
.main-content .cubes p.second {
  top: -54px;
  right: -142px;
  width: 196px;
}
.main-content .cubes p.third {
  top: 277px;
  right: -140px;
  width: 322px;
}
.main-content .cubes p.third:after {
  content: normal;
}
.main-content .cubes p.third:before {
  content: '';
  display: block;
  width: 185px;
  height: 1px;
  margin: 0 0 5px 135px;
  background: -moz-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%, #cfcecd), color-stop(99%, #fcfcfc));
  background: -webkit-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: -o-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: -ms-linear-gradient(left, #cfcecd 0%, #fcfcfc 99%);
  background: linear-gradient(to right, #cfcecd 0%, #fcfcfc 99%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cfcecd', endColorstr='#fcfcfc', GradientType=1);
}
.main-content .cubes .border {
  font-size: 1.25rem;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  text-align: center;
  line-height: 67px;
  float: left;
  width: 130px;
  height: 75px;
  background: #b7183c;
  position: relative;
  position: absolute;
}
.main-content .cubes .border:before {
  content: "";
  position: absolute;
  top: -34px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 65px solid transparent;
  border-right: 65px solid transparent;
  border-bottom: 34px solid #b7183c;
}
.main-content .cubes .border:after {
  content: "";
  position: absolute;
  bottom: -34px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 65px solid transparent;
  border-right: 65px solid transparent;
  border-top: 34px solid #b7183c;
}
.main-content .cubes .border div {
  width: 114px;
  height: 67px;
  background: #ffffff;
  position: relative;
  top: 4px;
  left: 8px;
  z-index: 1;
}
.main-content .cubes .border div:before {
  content: "";
  position: absolute;
  top: -30px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 57px solid transparent;
  border-right: 57px solid transparent;
  border-bottom: 30px solid #ffffff;
}
.main-content .cubes .border div:after {
  content: "";
  position: absolute;
  bottom: -30px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 57px solid transparent;
  border-right: 57px solid transparent;
  border-top: 30px solid #ffffff;
}
.main-content .cubes .border.first {
  left: 50%;
  margin-left: -65px;
}
.main-content .cubes .border.second {
  left: -1px;
  top: 166px;
}
.main-content .cubes .border.third {
  right: -1px;
  top: 166px;
}
.main-content .cubes.big {
  width: 578px;
  height: 366px;
  margin: 45px auto 35px 54px;
  background: url('../img/berry.png') bottom right no-repeat;
  padding: 35px 54px 115px 0;
}
.main-content .cubes.big .border {
  z-index: -1;
  line-height: 91px;
  width: 192px;
  height: 105px;
  background: #b7183c;
  position: relative;
}
.main-content .cubes.big .border:before {
  content: "";
  position: absolute;
  top: -50px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 96px solid transparent;
  border-right: 96px solid transparent;
  border-bottom: 50px solid #b7183c;
}
.main-content .cubes.big .border:after {
  content: "";
  position: absolute;
  bottom: -50px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 96px solid transparent;
  border-right: 96px solid transparent;
  border-top: 50px solid #b7183c;
}
.main-content .cubes.big .border div {
  width: 168px;
  height: 91px;
  background: #ffffff;
  position: relative;
  top: 6px;
  left: 12px;
}
.main-content .cubes.big .border div:before {
  content: "";
  position: absolute;
  top: -43px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 84px solid transparent;
  border-right: 84px solid transparent;
  border-bottom: 43px solid #ffffff;
}
.main-content .cubes.big .border div:after {
  content: "";
  position: absolute;
  bottom: -43px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 84px solid transparent;
  border-right: 84px solid transparent;
  border-top: 43px solid #ffffff;
}
.main-content .cubes.big .border.first {
  margin-left: -192px;
}
.main-content .cubes.big .border.second {
  top: 0;
  left: 50%;
  margin-left: 2px;
}
.main-content .cubes.big .border.third {
  top: 158px;
  right: 0;
  left: 0;
  margin-left: -192px;
}
.main-content .cubes.big .border.fourth {
  top: 158px;
  right: 0;
  left: 0;
  margin-left: 192px;
}
.main-content .cubes.big .border.fifth {
  top: 211px;
  right: 0;
  left: 0;
  margin-left: 97px;
}
.main-content .cubes.big .border.sixth {
  top: 211px;
  right: 0;
  left: 0;
  margin-left: 2px;
}
.main-content .cubes.big .border.logo {
  width: 192px;
  height: 105px;
  background: #ffffff;
  position: relative;
  position: absolute;
  left: 194px;
  top: 155px;
}
.main-content .cubes.big .border.logo:before {
  content: "";
  position: absolute;
  top: -50px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 96px solid transparent;
  border-right: 96px solid transparent;
  border-bottom: 50px solid #ffffff;
}
.main-content .cubes.big .border.logo:after {
  content: "";
  position: absolute;
  bottom: -50px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 96px solid transparent;
  border-right: 96px solid transparent;
  border-top: 50px solid #ffffff;
}
.main-content .cubes.small {
  width: auto;
  padding: 55px 0 0;
  margin: 15px auto 0;
}
.main-content .cubes.small p {
  line-height: 1.25em;
  color: #b7183c;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  text-align: left;
}
.main-content .cubes.small p:before,
.main-content .cubes.small p:after {
  background: none;
}
.main-content .cubes.small p.first {
  width: 96px;
  top: -10px;
  left: 0;
}
.main-content .cubes.small p.second {
  width: 108px;
  top: -10px;
  right: 0;
  text-align: right;
}
.main-content .cubes.small p.third {
  width: 58px;
  top: 246px;
  left: 53px;
  text-align: right;
}
.main-content .cubes.small .border {
  width: 101px;
  height: 60px;
  background: #b7183c;
  position: relative;
}
.main-content .cubes.small .border:before {
  content: "";
  position: absolute;
  top: -24px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 50.5px solid transparent;
  border-right: 50.5px solid transparent;
  border-bottom: 24px solid #b7183c;
}
.main-content .cubes.small .border:after {
  content: "";
  position: absolute;
  bottom: -24px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 50.5px solid transparent;
  border-right: 50.5px solid transparent;
  border-top: 24px solid #b7183c;
}
.main-content .cubes.small .border div {
  width: 89px;
  height: 52px;
  background: #ffffff;
  position: relative;
  top: 4px;
  left: 6px;
}
.main-content .cubes.small .border div:before {
  content: "";
  position: absolute;
  top: -21px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 44.5px solid transparent;
  border-right: 44.5px solid transparent;
  border-bottom: 21px solid #ffffff;
}
.main-content .cubes.small .border div:after {
  content: "";
  position: absolute;
  bottom: -21px;
  left: 0;
  width: 0;
  height: 0;
  border-left: 44.5px solid transparent;
  border-right: 44.5px solid transparent;
  border-top: 21px solid #ffffff;
}
.main-content .cubes.small .border div .pic {
  position: absolute;
  z-index: 1;
}
.main-content .cubes.small .border.first {
  margin-left: -108px;
}
.main-content .cubes.small .border.first .pic {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -450px -60px;
  width: 59px;
  height: 56px;
  float: left;
  margin-right: 0;
  left: 9px;
}
.main-content .cubes.small .border.second {
  top: 0;
  left: 50%;
  margin-left: 7px;
}
.main-content .cubes.small .border.second .pic {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -450px 0px;
  width: 84px;
  height: 45px;
  float: left;
  margin-right: 0;
  left: 1px;
  top: 3px;
}
.main-content .cubes.small .border.third {
  top: 120px;
  right: 17px;
}
.main-content .cubes.small .border.third .pic {
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -540px 0px;
  width: 35px;
  height: 80px;
  float: left;
  margin-right: 0;
  left: 27px;
  top: -14px;
}
.main-content .cubes.small .equal {
  display: block;
  position: absolute;
  left: 50%;
  top: 124px;
  margin-left: -11px;
  font-size: 2.313em;
  font-family: Arial, Helvetica, sans-serif;
  color: #b7183c;
}
.main-content .step {
  position: relative;
  background: url('../img/border-dashed.png') 0 0 repeat-x;
  width: 265px;
  text-align: center;
}
.main-content .step:before,
.main-content .step:after {
  position: absolute;
  top: 0;
  left: -1px;
  content: '';
  background-repeat: no-repeat;
  background-image: url('../img/sprite@1x-201309201300.png');
  background-position: -420px 0px;
  width: 31px;
  height: 114px;
  float: left;
  margin-right: 0;
  height: 100%;
  pointer-events: none;
}
.main-content .step:after {
  left: 100%;
}
.main-content .step .caption {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  font-size: .875rem;
  color: #b7183c;
  position: relative;
  top: 7px;
}
.main-content .step div {
  width: 200px;
  margin: 20px auto 30px;
  padding-left: 40px;
}
.main-content .step p {
  line-height: 1.125rem;
  -webkit-hyphens: none;
  hyphens: none;
}
.main-content .step.two .plus {
  margin: 0 12px;
}
.main-content .step.three .dish,
.main-content .step.four .dish {
  margin-left: -13px;
}
.main-content .step.three .plus,
.main-content .step.four .plus {
  margin-left: 9px;
}
.main-content .step.three .glass,
.main-content .step.four .glass {
  margin-left: -15px;
}
.main-content .step.four > div {
  margin-bottom: 18px;
}
.main-content .step.four .dish-sml {
  margin-left: 24px;
  position: relative;
  top: -26px;
}
.main-content .step.four .oder {
  position: relative;
  top: -29px;
  left: 2px;
  color: #9d9d9c;
  font-size: .75em;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
  letter-spacing: -1px;
}
.main-content .step.four .glass-sml {
  position: relative;
  top: -10px;
  left: 33px;
}
.main-content .ingredients {
  margin-bottom: 10px;
}
.main-content .ingredients dt {
  width: 58px;
  padding-right: 15px;
  text-align: right;
}
.main-content .preparation {
  width: 267px;
  padding-left: 70px;
}
.main-content .preparation li {
  padding: 0 0 3px 4px;
  letter-spacing: -1px;
}
/* #Rezepte
================================================== */
#erdbeer {
  background: url('../img/rezepte-erdbeer-shake.jpg') 363px center no-repeat;
}
#orange-grapefruit {
  background: url('../img/rezepte-orange-grapefruit-shake.jpg') 350px center no-repeat;
}
#grapefruit-nektarinen-shake {
  background: url('../img/rezepte-grapefruit-nektarinen-shake.jpg') 352px center no-repeat;
}
#kiwi-shake {
  background: url('../img/rezepte-kiwi-shake.jpg') 396px center no-repeat;
}
/* #Product List
================================================== */
.product-list article {
  width: 315px;
  height: 565px;
  float: left;
  margin-right: 24px;
  margin-top: 30px;
  border-bottom: 1px solid #b7183c;
}
.product-list article.col-last {
  float: right;
  margin-left: 0;
  margin-right: 0;
}
.product-list article header {
  float: right;
  width: 135px;
  text-align: center;
}
.product-list article header h2 {
  margin-bottom: 7px;
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
  font-size: .875em;
  font-weight: normal;
  text-transform: uppercase;
}
.product-list article header h2 span {
  display: block;
  padding-top: 3px;
  color: #000000;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
}
.product-list article header p {
  text-align: center;
}
.product-list article header p.weight {
  padding: 10px 0;
  margin-bottom: 10px;
  border-top: 1px dashed #b7183c;
  border-bottom: 1px dashed #b7183c;
  color: #b7183c;
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
}

.product-list article header p.price {
  padding: 10px 0;
  margin-bottom: 10px;
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
}

.product-list article img {
  margin-bottom: 20px;
}
/* #Main Navigation
================================================== */
#navigation {
  border-bottom: 30px solid #b7183c;
  font-size: .857em;
}
#navigation .wrap {
  width: 411px;
  height: 30px;
  margin: 0 auto;
  position: relative;
  top: 30px;
  border-left: 3px solid #ffffff;
  border-right: 3px solid #ffffff;
}
#navigation .wrap .main-navigation {
  position: relative;
  bottom: 100%;
  height: 30px;
  text-align: center;
}
#navigation .wrap .main-navigation li {
  display: inline-block;
  *display: inline;
  font-size: 1em;
}
#navigation .wrap .main-navigation > li {
  text-transform: uppercase;
  letter-spacing: .083em;
  line-height: 30px;
  width: 137px;
  height: 30px;
  float: left;
}
#navigation .wrap .main-navigation > li.active,
#navigation .wrap .main-navigation > li:hover {
  background: #b7183c;
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
}
#navigation .wrap .main-navigation > li.active a,
#navigation .wrap .main-navigation > li:hover a {
  color: #ffffff;
}
#navigation .wrap .main-navigation > li.active .sub-navigation,
#navigation .wrap .main-navigation > li:hover .sub-navigation {
  display: block;
}
#navigation .wrap .main-navigation > li a {
  font-size: .857em;
}
#navigation .wrap .sub-navigation {
  display: none;
  position: absolute;
  top: 100%;
  background: #b7183c;
  color: #ffffff;
}
#navigation .wrap .sub-navigation li {
  text-transform: none;
  margin-left: 19px;
  line-height: 20px;
  font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
}
#navigation .wrap .sub-navigation li.active,
#navigation .wrap .sub-navigation li:hover {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
}
#navigation .wrap .sub-navigation li a {
  color: #ffffff;
  font-size: .929em;
}
/* #Footer
================================================== */
.main-footer {
  width: 713px;
  margin: 29px auto 15px;
  border-top: 3px solid #b7183c;
}
.main-footer div {
  padding: 0 4px 4px 4px;
  text-align: center;
}
.main-footer div a {
  display: block;
  width: 137px;
  height: 30px;
  margin: 0 auto 5px;
  text-transform: uppercase;
  font-size: .75em;
  line-height: 28px;
}
.main-footer div a:hover,
.main-footer div a.active {
  background: #b7183c;
  color: #ffffff;
}
.main-footer div p {
  color: #9d9d9c;
  padding-bottom: 5px;
  text-align: center;
}
/* #Page Override
================================================== */
body.index footer p,
body.index footer .icon {
  display: none;
}
body.ueber-beavita .posts h1 {
  margin-bottom: -40px;
}
body.ueber-beavita .posts article {
  border-bottom: 0;
  margin: 60px 0 -20px;
  padding: 10px 30px;
}
body.ueber-beavita .posts article:first-child {
  margin-top: 0;
}
body.ueber-beavita .posts .totop {
  margin: 0;
}
body.ueber-beavita .posts .totop.last {
  margin-top: 20px;
}
/* #Clearing
================================================== */
/* Self Clearing Goodness */
.container:after {
  content: "\0020";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
/* Use clearfix class on parent to clear nested columns,
or wrap each row of columns in a <div class="row"> */
.clearfix:before,
.clearfix:after,
.row:before,
.row:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}
.row:after,
.clearfix:after {
  clear: both;
}
.row,
.clearfix {
	zoom: 1;
}
/* You can also use a <br class="clear" /> to clear columns */
.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}
.clear-left {
  clear: left;
  height: 100%;
}
.clear-right {
  clear: right;
  height: 100%;
}
/* #Others
================================================== */
.bold {
  font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
}
.border-top {
  border-top: 1px solid #b7183c;
}
.border-bottom {
  border-bottom: 1px solid #b7183c;
}
.border-top-thick {
  border-top: 3px solid #b7183c;
}
.border-bottom-thick {
  border-bottom: 3px solid #b7183c;
}
.padding-top-dbl {
  padding-top: 20px;
}
.no-margin {
  margin: 0;
}

.product-wrapper {
	width: 305px;
	margin:15px;
	padding:2px;
	float:left;	
	border-bottom: #B7183C 1px solid;
	text-align:center;
}

.product-wrapper h2{
 	margin-bottom: 5px;
	text-align:center;
	font-family: 'DIN Regular', Arial, Helvetica, sans-serif;
	font-size:14px;
	text-transform:Uppercase;
}

.product-wrapper span{
	font-style:normal;
	color:black;
	font-family: 'DIN Bold', Arial, Helvetica, sans-serif;
	font-size:16px;
}

.product-wrapper p{
	text-align:center;
	display:block;
}

.product-wrapper p.weight{
	width:80px;
	margin-left:105px;
	margin-right:105px;
	margin-bottom:2px;
	padding:2px;
	border-top:#B7183C 1px dashed;
	border-bottom:#B7183C 1px dashed;
	color: #B7183C;
}

.product-wrapper p.price{
	margin-bottom:2px;
	padding:2px;
}

.product-wrapper div.btn{
	margin-bottom:5px;	
	width:120px;
}

.product-wrapper p.textpart{
	font-family:'DIN Regular', Arial, Helvetica, sans-serif;
	font-style:normal;
	font-size:14px;
	text-align:justify;
	margin-top:7px;
	padding-top:14px;
	border-top:#B7183C 1px solid;
	height:192px;
	line-height:1.2em;
	}
	
.product-wrapper div.textwrap:after{
	float:right;
	margin-top:2px;
	margin-bottom:14px;
	color:#B7183C;
	font-family:'DIN Regular', Arial, Helvetica, sans-serif;
	font-style:normal;
	font-size:14px;
	outline:none;
}