body.template-produkt-familie{
  background:url(../images/product-bg-body.png) repeat-x 50% 0;
}

.template-produkt-familie .header-inner .logo {
    float: right;
    margin: 0 auto;
    position: relative;
    top: -30px;
    width: 123px;
    height: 38px;
    background: transparent url('../images/logo-small.png') no-repeat;
}

.template-produkt-familie a.fb-follow {
    position: relative;
}

.footer-block-dairy ul li {
  font-size: 16px;
}

.template-produkt-familie #header {
  min-height: auto;
  padding-top: 44px;
}

.product-family .intro .product-logo {
    position: absolute;
    top: -30px;
}

.product-logo.brand {
    width: 960px;
    margin: 0 auto;
    position: relative;
    top: -25px;
}

.product-family .note-wrapper {
    background: transparent url('../images/notatblokk.png') no-repeat;
    width: 342px;
    height: 404px;
    position: relative;
    top: 50px;
    z-index: 10;
}

.product-family .note-wrapper .back {
    position: absolute;
    top: -45px;
    right: -75px;
    padding: 5px 0px 0px 30px;
    background: url(../images/arrow-09.png) top left no-repeat;
}

.product-family .note-text {
    position: relative;
    font:25px/20px 'Rodeogirlot', Arial, Helvetica, sans-serif;
    width: 200px;
    top: 140px;
    left: 55px;
    z-index: 102;
    -webkit-transform:rotate(-7deg);
    -moz-transform:rotate(-7deg);
    -ms-transform:rotate(-7deg);
    -o-transform:rotate(-7deg);
    transform:rotate(-7deg);
}

.product-family .note-text ul li {
    margin-bottom: 15px;
    background: url(../images/doodle-bullet.png) no-repeat 0 7px;
    padding-left: 20px;
    color: #311105;
}

.product-family .note-text ul li:hover {
    background-position: 0 -80px;
}

.product-family .intro .visual-block {
    position: absolute;
    left: 275px;
    top: 0px;
    z-index: 1;
}

.product-family .intro .intro-article {
    width: 680px;
    z-index: 20;
    position: relative;
    left: 250px;
    top: -160px;
}

.product-family .intro .intro-article .article {
    padding: 20px 15px 15px;
}

.product-family .intro .intro-article .article h2 {
    margin-bottom: 20px;
}

.product-family .products {
    margin: 0 -10px 0px;
    margin-top: -100px;
}

.product-family .products .aside {
  overflow: visible;
}

.product-family .products .block {
    display: relative;
}

.product-family .products .border {
    bottom: -20px;
}

.product-family #dark-section {
    margin-top: 70px;
}

.product-family .products ul.product-list {
    overflow: hidden;
    margin-bottom: -20px;
    position: relative;
    left: -2px;
}

.product-family .products ul.product-list li {
    border: 1px solid #e2e4d6;
    background: #fff;
    float: left;
    width: 198px;
    height: 197px;
    padding: 10px;
    overflow: hidden;
    margin-right: 20px;
    margin-top: 20px;
    position: relative;
}

.product-family .products ul.product-list li:hover img {
  opacity: 0.5;
} 

.product-family .products ul.product-list li.top {
    margin-top: 0px;
}

.product-family .products ul.product-list li.third {
    margin-right: 0px;
    margin-left: 1px;
}

.product-family .products .product-box {
    width: 678px;
    margin: 0;
}

.product-family .products .product-detail {
    height: 100%;
    padding: 10px;
    display: none;
}

.product-family .products ul.product-list li h4 {
    font: 16px 'Open Sans',Arial,Helvetica,sans-serif;
    font-weight: 600;
    width: 198px;
    position: absolute;
    bottom: 10px;
}

.product-family .products ul.product-list li img {
    position: relative;
    left: 15px;
    top: 10px;
}

.product-family .products .block .content-holder {
    position: relative;
}

.p-wrapper {
    position: absolute;
    z-index: 100;
    width: 701px;
    min-height: 100%;
    border: 1px solid #e2e4d6;
    background: #fff;
    xoverflow: hidden;
    display: none;
    left: 239px;
    box-sizing: border-box;

}

.p-wrapper .button-holder {
    padding: 10px;
}

.p-wrapper .container{height:1%;}
.p-wrapper .container:after{
  display:block;
  clear:both;
  content:'';
}
.p-wrapper .container{
  padding:0 0 18px;
  margin:0 0 19px;
}
.p-wrapper .col-01{
  float:left;
  line-height:20px;
  width:360px;
  padding:0px 43px 0 0;
}
.p-wrapper h2 {
  margin:0 0 -6px;
  font:25px/28px 'Open Sans', Arial, Helvetica, sans-serif;
  font-weight: 600;
}
.p-wrapper h3{
  margin:0 0 8px;
  font:18px/26px 'Open Sans', Arial, Helvetica, sans-serif;
  font-weight: 600;
}

.p-wrapper .product-detail .header h2 {
  margin-bottom: 15px;
}

.p-wrapper figure{
  float:right;
  position:relative;
  margin:0 -36px 0 0;
}
.p-wrapper .col-02{
  float:left;
  line-height:20px;
  width:260px;
}
.p-wrapper .col-02 li strong{
    font-family:'Open Sans', Arial, Helvetica, sans-serif;
    font-weight: 600;
}

.list-intro-images {
    border: 1px solid #e2e4d6;
    border-bottom: 0px;
    position: relative;
}

.list-intro-images img {
    width: 100%;
}

.list-intro-images li {
    display: none;
}

.list-intro-images li.active {
    display: block;
}

.list-intro-images .btn-prev,
.list-intro-images .btn-next {
  position:absolute;
  top:40%;
  left:-40px;
  width: 80px;
  cursor:pointer;
  text-indent:-9999px;
  overflow:hidden;
  height:80px;
  background:url(../images/arrow-left-bright.png) no-repeat 50% 50%;
  z-index:70;
}

.list-intro-images .btn-prev:hover,
.list-intro-images .btn-next:hover {
    opacity: 0.9;
}

.list-intro-images .btn-prev:hover{
  background-image:url(../images/arrow-left-dark.png);
}

.list-intro-images .btn-next:hover{
  background-image:url(../images/arrow-right-dark.png);
}

.list-intro-images .btn-next {
  left:auto;
  right:-40px;
  background-image:url(../images/arrow-right-bright.png);
}

.product-family li.article-list-item {
    display: none;
}

.product-family li.article-list-item.active {
    display: block;
}

#ask-us .content-holder .blocks .visual {
  height: 212px;
  width: 212px;
}

#ask-us .content-holder .blocks .visual img {
  margin: 0 auto;
}

.product-children ul {
  width: 960px;
  margin: 0 auto;
}

.product-children ul li {
  width: 291px;
  float: left;
  margin-left: 20px;
  text-align: center;
}

.product-children ul li:first-child {
  margin-left: 0;
}

.product-children ul li .box {
  background:#fff;
  position:relative;
  display: block;
  padding: 4px 4px 1px 4px;
  border: 1px solid #e2e4d6;
}

.product-children ul li:hover img {
  opacity: 0.5;
}

.product-children ul li .box img {
  display: inline-block;
}

.product-children ul li span {
  font-size: 18px;
  font-weight: bold;
  margin-top: 12px;
  display: block;
}

.product-children ul li .box:before,
.product-children ul li .box:after{
  content:"";
  position:absolute;
  z-index:-2;
  bottom:15px;
  left:10px;
  width:50%;
  height:20%;
  max-width:300px;
  -webkit-box-shadow:0 15px 10px rgba(0, 0, 0, 0.3);
  -moz-box-shadow:0 15px 10px rgba(0, 0, 0, 0.3);
  box-shadow:0 15px 10px rgba(0, 0, 0, 0.3);
  -webkit-transform:rotate(-3deg);
  -moz-transform:rotate(-3deg);
  -ms-transform:rotate(-3deg);
  -o-transform:rotate(-3deg);
  transform:rotate(-3deg);
}

.product-children ul li .box:after {
  right:10px;
  left:auto;
  -webkit-transform:rotate(3deg);
  -moz-transform:rotate(3deg);
  -ms-transform:rotate(3deg);
  -o-transform:rotate(3deg);
  transform:rotate(3deg);
}