/* #####################################################################################################
   HOMEPAGE
   ##################################################################################################### */

/*--- standard variables ---*/
/*--- Switch Themes ---*/
/*.importTheme(@season) when (@season = 'lente') {
    @import "../themes/lente/css/variables_theme.less";
}*/

/*.importTheme(@season) when (@season = 'zomer') {
    @import "../themes/zomer/css/variables_theme.less";
}

.importTheme(@season) when (@season = 'herst') {
    @import "../themes/herfst/css/variables_theme.less";
}

.importTheme(@season) when (@season = 'winter') {
    @import "../themes/winter/css/variables_theme.less";
}*/

/*--- product item ratio (thumb + content) ---*/
/* set ProductImageRatio in productOverview! */
/*--- media queries. When using responsive ---*/
/* Range breakpoints */
/*----- Default functions -----*/
/*----- Default Crossbrowser functions -----*/
/*----- CSS3 functions -----*/
/*----- CSS3 Animation functions -----*/
/*----- Buttons -----*/
/*----- Responsive functions -----*/
@media only screen and (min-width: 1024px) {
  .owl-carousel li.hasTextBlock {
    margin-bottom: 150px;
  }
}
.owl-carousel:not(.owl-loaded) .owl-item img {
  display: none !important;
}
..owl-stage-outer {
  overflow: visible !important;
}
.owl-prev,
.owl-next {
  position: absolute;
  top: -48%;
  bottom: 0;
  display: block;
  width: 10%;
  z-index: 99;
  text-indent: -999999em;
  -webkit-transition: all 0.2s ease-out;
  -moz-transition: all 0.2s ease-out;
  -o-transition: all 0.2s ease-out;
  transition: all 0.2s ease-out;
  /*-moz-backface-visibility: hidden;*/

}
@media only screen and (min-width: 1024px) {
  .owl-prev,
  .owl-next {
    top: 0;
    bottom: 0;
  }
}
.owl-prev.owl-prev,
.owl-next.owl-prev {
  left: 0;
}
.owl-prev.owl-prev:after,
.owl-next.owl-prev:after {
  content: "\f053";
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: 40px;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 30px;
  height: 40px;
  line-height: 40px;
  left: 15px;
}
@media only screen and (max-width: 1023px) {
  .owl-prev.owl-prev:after,
  .owl-next.owl-prev:after {
    font-size: 20px;
  }
}
.owl-prev.owl-next,
.owl-next.owl-next {
  right: 0;
}
.owl-prev.owl-next:after,
.owl-next.owl-next:after {
  content: "\f054";
  display: inline-block;
  font: normal normal normal 14px/1 FontAwesome;
  font-size: 40px;
  text-rendering: auto;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  width: 30px;
  height: 40px;
  line-height: 40px;
  right: 15px;
}
@media only screen and (max-width: 1023px) {
  .owl-prev.owl-next:after,
  .owl-next.owl-next:after {
    font-size: 20px;
  }
}
.owl-prev:after,
.owl-next:after {
  color: white;
  display: block;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  text-align: center;
  text-indent: 0;
}
@media only screen and (max-width: 1023px) {
  body.homepage #pageContainer {
    margin-top: 70px !important;
  }
  body.homepage .mobileSearch {
    position: fixed;
    top: 60px;
    right: 0;
    left: 0;
    z-index: 100;
    background: #e0e1e5;
  }
  body.homepage .mobileSearch .container {
    padding-top: 15px;
    padding-bottom: 15px;
    position: relative;
  }
  body.homepage .mobileSearch .searchWrapper {
    position: relative;
  }
  body.homepage .mobileSearch .searchWrapper input[type="search"] {
    padding: 0 35px;
    box-sizing: border-box;
  }
  body.homepage .mobileSearch .searchWrapper:before {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 10px;
    margin: auto;
    color: #5e5e5e;
    content: "\f002";
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 15px;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    width: 15px;
    height: 17.5px;
    line-height: 17.5px;
  }
  @media only screen and (min-width: 768px) {
    body.homepage .mobileSearch .searchWrapper:before {
      content: "\f002";
      display: inline-block;
      font: normal normal normal 14px/1 FontAwesome;
      font-size: 15px;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      width: 15px;
      height: 15px;
      line-height: 15px;
    }
  }
  body.homepage .mobileSearch .searchWrapper:after {
    position: absolute;
    top: 0;
    bottom: 0;
    right: 7.5px;
    margin: auto;
    color: #5e5e5e;
    content: "\f054";
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: 15px;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    width: 15px;
    height: 15px;
    line-height: 15px;
  }
  @media only screen and (min-width: 768px) {
    body.homepage .mobileSearch .searchWrapper:after {
      content: "\f054";
      display: inline-block;
      font: normal normal normal 14px/1 FontAwesome;
      font-size: 15px;
      text-rendering: auto;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      width: 15px;
      height: 15px;
      line-height: 15px;
    }
  }
  body.homepage .mobileSearch input[type="search"] {
    width: 100%;
    height: 40px;
    line-height: 40px;
    box-sizing: border-box;
  }
  body.homepage .mobileSearch button {
    width: 40px;
    height: 30px;
    line-height: 30px;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    padding: 0;
    background: none;
  }
}
.homepage #breadcrumbs {
  display: none;
}
.homepage .textBlock--highlight .bttn {
  min-width: 200px;
}
@media only screen and (max-width: 1023px) {
  .homepage .textBlock.textBlock--highlight {
    margin-bottom: 15px;
  }
}
.homepage .ctaBannerBlock .bttn {
  min-width: 200px;
}
@media only screen and (max-width: 1023px) {
  .homepage .ctaBannerBlock .banner:not(:last-child) {
    margin-bottom: 50px;
  }
}
@media only screen and (min-width: 1024px) {
  .homepage .ctaBannerBlock .banner {
    width: 48%;
    margin-bottom: 4%;
  }
}
.homepage .ctaBannerBlock .banner h2 {
  margin-top: 15px;
}
@media only screen and (min-width: 1024px) {
  .homepage .ctaBannerBlock .banner__link {
    display: block;
    display: flex;
    flex-flow: column nowrap;
    height: 100%;
  }
  .homepage .ctaBannerBlock .banner_text-wrapper {
    margin-top: auto;
  }
}
@media only screen and (min-width: 1024px) {
  .homepage .mainBanner.top.hasHighlightedText {
    margin-bottom: 200px;
  }
  .homepage .textBlock--highlight {
    width: 700px;
    max-width: 700px;
    left: 0;
    right: 0;
    bottom: -150px;
    margin: 0 auto;
  }
}
.homepage .bannerBlock {
  padding-bottom: 50px;
}
@media only screen and (min-width: 768px) {
  .homepage .bannerBlock {
    padding-bottom: 25px;
  }
}
.homepage .highlightBlock {
  padding-top: 0;
}
.homepage .highlightBlock .textBlock {
  margin-bottom: 20px;
}
@media only screen and (min-width: 768px) {
  .homepage .socialBlock .banner {
    margin-bottom: 0;
  }
}
.homepage .contentBlock {
  padding: 50px 0 5px 0;
}
.homepage .homeContent {
  padding: 0 20px;
}
@media only screen and (min-width: 768px) {
  .homepage .productList {
    overflow: hidden;
  }
  .homepage .productList > .item {
    float: left;
    margin-right: 1.171875%;
    margin-bottom: 1.171875%;
    width: 24.12109375%;
  }
  .lt-ie9 .homepage .productList > .item {
    /*IE 8*/
    width: 23.828125%;
  }
  .homepage .productList > .item:nth-of-type(n) {
    /*reset if function is called more then once*/
    margin-right: 1.171875%;
  }
  .homepage .productList > .item:nth-of-type(4n) {
    margin-right: 0;
  }
}
@media only screen and (max-width: 1000px) {
  .bannersSocial {
    padding-left: 20px;
    padding-right: 20px;
  }
}
@media only screen and (max-width: 767px) {
  .bannersSocial.itemList.mobileTwo li,
  .bannersSocial.itemList.mobileTwo > * {
    flex: 0 49.5%;
    margin: 0 0 1% 0;
  }
}
