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

/*--- standard variables ---*/
/*--- product item ratio (thumb + content) ---*/
/* set ProductImageRatio in productOverview! */
/*--- media queries. When using responsive ---*/
/* Range breakpoints */
/*--- media queries. When using responsive: only mobile & desktop ---
@responsive:	false;
@largePhone:	~"only screen and (min-width: 480px)";
@tablet:		~"only screen and (min-width: 999999999px)";
@tabletLand:	~"only screen and (min-width: 768px)";
@desktop:		~"only screen and (min-width: 768px)";

@upToTablet:	~"only screen and (max-width: 767px)";
@upToDesktop:	~"only screen and (max-width: 767px)";*/
/*--- media queries. When not using responsive ---
@responsive:	false;
@largePhone:	~"only screen and (min-width: 1px)";
@tablet:		~"only screen and (min-width: 1px)";
@tabletLand:	~"only screen and (min-width: 1px)";
@desktop:		~"only screen and (min-width: 1px)";

@upToTablet:	~"only screen and (max-width: 1px)";
@upToDesktop:	~"only screen and (max-width: 1px)";*/
/*----- Default functions -----*/
/*----- Default Crossbrowser functions -----*/
/*----- CSS3 functions -----*/
/*----- CSS3 Animation functions -----*/
/*----- Buttons -----*/
/*----- Responsive functions -----*/
.homepage .mainBanner {
  margin-bottom: 15px;
}
@media only screen and (max-width: 767px) {
  .homepage .mainBanner {
    margin-left: -22px;
    margin-right: -22px;
  }
}
.homepage .subBanners {
  margin: 0 0 15px;
}
@media only screen and (max-width: 767px) {
  .homepage .subBanners {
    margin-top: -21px;
    margin-left: -22px;
    margin-right: -22px;
  }
}
.homepage .subBanners a {
  display: block;
}
@media only screen and (min-width: 768px) {
  .homepage .subBanners {
    overflow: hidden;
  }
  .homepage .subBanners > * {
    float: left;
    margin-right: 1.171875%;
    margin-bottom: 1.171875%;
    width: 32.552083333%;
  }
  .lt-ie9 .homepage .subBanners > * {
    /*IE 8*/
    width: 32.161458333%;
  }
  .homepage .subBanners > *:nth-of-type(n) {
    /*reset if function is called more then once*/
    margin-right: 1.171875%;
  }
  .homepage .subBanners > *:nth-of-type(3n) {
    margin-right: 0;
  }
  .homepage .subBanners > * {
    margin-bottom: 0;
  }
  .homepage .subBanners :last-child {
    margin-right: 0;
  }
}
@media only screen and (max-width: 767px) {
  .homepage .subBanners .banner {
    margin-top: -6px;
    border-top: solid 2px black;
  }
  .homepage .subBanners .banner:last-child img {
    border-bottom: solid 2px black;
  }
  .homepage .subBanners img {
    width: 100%;
  }
}
@media only screen and (max-width: 1023px) {
  
}
@media only screen and (max-width: 1023px) {
  .homepage div#pageContainer div.container {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .homepage div#pageContainer div.container .nowContent {
    padding-left: 15px;
    padding-right: 15px;
  }
  .homepage #footerCols {
    padding-left: 15px !important;
    padding-right: 15px !important;
  }
}
.homepage #usp {
  display: table;
  width: 100%;
  border-bottom: solid 2px black;
}
@media only screen and (min-width: 768px) {
  .homepage #usp {
    padding-left: 15px;
    padding-right: 15px;
  }
}
@media only screen and (min-width: 1024px) {
  .homepage #usp {
    padding-left: 0;
    padding-right: 0;
  }
}
.homepage #usp li {
  margin: 0;
  display: table-cell;
  width: 25%;
  text-align: center;
  font-size: 14px;
  height: 55px;
  line-height: 55px;
}
@media only screen and (max-width: 1023px) {
  .homepage #usp li {
    font-size: 12px;
  }
  .homepage #usp li:before {
    font-size: 14px !important;
  }
}
.homepage #usp li:first-child {
  text-align: left;
}
.homepage #usp li:last-child {
  text-align: right;
}
.homepage #usp li:before {
  color: #0eab57 !important;
  font-size: 20px;
}