/*********************** 12 column responsive grid  ***********************/
/*
*
*		.grid12-3:		12 column grid, 3x4 column wide panels
*		.grid12-4:		12 column grid, 4x3 column wide panels
*		.grid12-6:		12 column grid, 6x2 column wide panels
*
*		.grid12-4.innerGrid: 	inner content, leftCol 4comumn wide mainContent 8 column wide 
* 
*
*
/**************************************************************************/
/*********************** grid gaps ***********************/
.homeTitle {
  grid-area: homeTitle;
}
.homeText {
  grid-area: homeText;
}
.homeBottom {
  grid-area: homeBottom;
}
.homeSubTitle1 {
  grid-area: homeSubTitle1;
}
.homeSubTitle2 {
  grid-area: homeSubTitle2;
}
.homeSubTitle3 {
  grid-area: homeSubTitle3;
}
.homeSubTitle4 {
  grid-area: homeSubTitle4;
}
.homeSubTitle5 {
  grid-area: homeSubTitle5;
}
.homeSubTitle6 {
  grid-area: homeSubTitle6;
}
#footer-menu {
  grid-area: footer-menu;
}
.ctaRegister {
  grid-area: ctaRegister;
}
.footerText {
  grid-area: footerText;
}
.footerLine {
  grid-area: footerLine;
}
.menuGrid .parentTitle {
  grid-area: 1/2/1/14;
}
.menuGrid .i1 {
  grid-area: 2/2/2/6;
}
.menuGrid .i2 {
  grid-area: 2/6/2/10;
}
.menuGrid .i3 {
  grid-area: 2/10/2/14;
}
.grid12-1,
.grid12-2,
.grid12-3,
.grid12-4,
.grid12-6 {
  display: grid;
  gap: 36px;
  grid-template-columns: 200px repeat(12, 1fr) 200px;
}
.messages,
.messageContainer {
  grid-area: 1/5/1/11;
}
.grid12-6.contentGrid {
  grid-template-areas: ". . . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . . ." ". . . . homeText homeText homeText homeText homeText homeText . . . ." ". homeSubTitle1 homeSubTitle1 homeSubTitle2 homeSubTitle2 homeSubTitle3 homeSubTitle3 homeSubTitle4 homeSubTitle4 homeSubTitle5 homeSubTitle5 homeSubTitle6 homeSubTitle6 ." ". item1 item1 item2 item2 item3 item3 item4  item4  item5  item5 item6 item6 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
}
.grid12-6.contentGrid .homeBottom {
  justify-self: center;
}
.grid12-4.contentGrid {
  grid-template-areas: ". . . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . . ." ". . . . homeText homeText homeText homeText homeText homeText . . . ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle4 homeSubTitle4 homeSubTitle4 ." ". item1 item1 item1 item2 item2 item2 item3  item3  item3  item4 item4 item4 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
}
.grid12-4.contentGrid .homeBottom {
  justify-self: center;
}
.grid12-4.contentGrid.compact {
  grid-template-areas: ". . . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . . ." ". . . . homeText homeText homeText homeText homeText homeText . . . ." ". item1 item1 item1 item2 item2 item2 item3  item3  item3  item4 item4 item4 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
}
.grid12-4.innerGrid .leftCol {
  grid-area: 1/2/1/5;
}
.grid12-4.innerGrid .mainContent {
  grid-area: 1/5/1/14;
}
.grid12-4.innerGrid3 .leftCol {
  grid-area: 1/2/2/5;
}
.grid12-4.innerGrid3 .mainContent {
  grid-area: 1/5/2/11;
}
.grid12-4.innerGrid3 .rightCol {
  grid-area: 1/11/2/14;
}
.grid12-3.contentGrid {
  grid-template-areas: ". . . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . . ." ". . . . homeText homeText homeText homeText homeText homeText . . . ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 ." ". item1 item1 item1 item1 item2 item2 item2  item2  item3  item3 item3 item3 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
}
.grid12-3.contentGrid .homeBottom {
  justify-self: center;
}
.grid12-2.contentGrid {
  grid-template-areas: ". . . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . . ." ". . . . homeText homeText homeText homeText homeText homeText . . . ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item1 item1 item1 item1 item1 item1 item2  item2  item2  item2 item2 item2 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
}
.grid12-2.contentGrid .homeBottom {
  justify-self: center;
}
.grid12-1.contentGrid {
  grid-template-areas: ". . . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . . ." ". . . . homeText homeText homeText homeText homeText homeText . . . ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 item1  item1  item1  item1 item1 item1 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
}
.grid12-1.contentGrid .homeBottom {
  justify-self: center;
}
@media (max-width: 1980px) {
  .grid12-1,
  .grid12-2,
  .grid12-3,
  .grid12-4,
  .grid12-6 {
    grid-template-columns: 50px repeat(12, 1fr) 50px;
  }
}
@media (max-width: 1600px) {
  .grid12-1,
  .grid12-2,
  .grid12-3,
  .grid12-4,
  .grid12-6 {
    gap: 24px;
    grid-template-columns: 0px repeat(12, 1fr) 0px;
  }
}
@media (max-width: 1024px) {
  .grid12-1,
  .grid12-2,
  .grid12-3,
  .grid12-4,
  .grid12-6 {
    gap: 16px;
  }
  .messages,
  .messageContainer {
    grid-area: 1/2/1/14;
  }
  .grid12-6.contentGrid {
    grid-template-areas: ". . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . ." ". . . homeText homeText homeText homeText homeText homeText homeText homeText . . ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item1 item1 item1 item1 item1 item1 item2  item2  item2  item2 item2 item2 ." ". homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 ." ". item3 item3 item3 item3 item3 item3 item4  item4  item4  item4 item4 item4 ." ". homeSubTitle5 homeSubTitle5 homeSubTitle5 homeSubTitle5 homeSubTitle5 homeSubTitle5 homeSubTitle6 homeSubTitle6 homeSubTitle6 homeSubTitle6 homeSubTitle6 homeSubTitle6 ." ". item5 item5 item5 item5 item5 item5 item6  item6  item6  item6 item6 item6 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
  }
  .grid12-4.contentGrid {
    grid-template-areas: ". . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . ." ". . . homeText homeText homeText homeText homeText homeText homeText homeText . . ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item1 item1 item1 item1 item1 item1 item2  item2  item2  item2 item2 item2 ." ". homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 ." ". item3 item3 item3 item3 item3 item3 item4  item4  item4  item4 item4 item4 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
  }
  .grid12-4.contentGrid.compact {
    grid-template-areas: ". . . homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle . . ." ". . . homeText homeText homeText homeText homeText homeText homeText homeText . . ." ". item1 item1 item1 item1 item1 item1 item2  item2  item2  item2 item2 item2 ." ". item3 item3 item3 item3 item3 item3 item4  item4  item4  item4 item4 item4 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom homeBottom homeBottom .";
  }
  .grid12-4.innerGrid .leftCol {
    grid-area: 1/2/1/14;
  }
  .grid12-4.innerGrid .mainContent {
    grid-area: 2/2/3/14;
  }
  .grid12-3.contentGrid {
    grid-template-columns: 0 repeat(6, 1fr) 0;
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText  homeText  homeText  homeText  homeText  homeText  ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item2 item2 item2 item2 item2 item2 ." ". homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 ." ". item3 item3 item3 item3 item3 item3 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-2.contentGrid {
    grid-template-columns: 0 repeat(6, 1fr) 0;
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText  homeText  homeText  homeText  homeText  homeText  ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item2 item2 item2 item2 item2 item2 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-1.contentGrid {
    grid-template-columns: 0 repeat(6, 1fr) 0;
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText  homeText  homeText  homeText  homeText  homeText  ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-4.innerGrid3 .leftCol {
    grid-area: 1/2/3/5;
  }
  .grid12-4.innerGrid3 .mainContent {
    grid-area: 1/5/2/14;
  }
  .grid12-4.innerGrid3 .rightCol {
    grid-area: 2/5/3/14;
  }
}
@media (max-width: 576px) {
  .grid12-1,
  .grid12-2,
  .grid12-3,
  .grid12-4,
  .grid12-6 {
    gap: 12px;
    grid-template-columns: 0 repeat(6, 1fr) 0;
  }
  .messages,
  .messageContainer {
    grid-area: 1/2/1/8;
  }
  .grid12-6.contentGrid {
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText homeText homeText homeText homeText homeText ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item2 item2 item2 item2 item2 item2 ." ". homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 ." ". item3 item3 item3 item3 item3 item3 ." ". homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 ." ". item4 item4 item4 item4 item4 item4 ." ". homeSubTitle5 homeSubTitle5 homeSubTitle5 homeSubTitle5 homeSubTitle5 homeSubTitle5 ." ". item5 item5 item5 item5 item5 item5 ." ". homeSubTitle6 homeSubTitle6 homeSubTitle6 homeSubTitle6 homeSubTitle6 homeSubTitle6 ." ". item6 item6 item6 item6 item6 item6 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-4.contentGrid {
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText homeText homeText homeText homeText homeText ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item2 item2 item2 item2 item2 item2 ." ". homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 ." ". item3 item3 item3 item3 item3 item3 ." ". homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 homeSubTitle4 ." ". item4 item4 item4 item4 item4 item4 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-4.contentGrid.compact {
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle." ". homeText homeText homeText homeText homeText homeText ." ". item1 item1 item1 item1 item1 item1 ." ". item2 item2 item2 item2 item2 item2 ." ". item3 item3 item3 item3 item3 item3 ." ". item4 item4 item4 item4 item4 item4 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-3.contentGrid {
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText homeText homeText homeText homeText homeText ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item2 item2 item2 item2 item2 item2 ." ". homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 homeSubTitle3 ." ". item3 item3 item3 item3 item3 item3 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-2.contentGrid {
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText homeText homeText homeText homeText homeText ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 homeSubTitle2 ." ". item2 item2 item2 item2 item2 item2 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-1.contentGrid {
    grid-template-areas: ". homeTitle homeTitle homeTitle homeTitle homeTitle homeTitle ." ". homeText homeText homeText homeText homeText homeText ." ". homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 homeSubTitle1 ." ". item1 item1 item1 item1 item1 item1 ." ". homeBottom homeBottom homeBottom homeBottom  homeBottom homeBottom .";
  }
  .grid12-3.menuGrid .parentTitle {
    grid-area: 1/2/1/8;
  }
  .grid12-3.menuGrid .i1 {
    grid-area: 2/2/4/8;
  }
  .grid12-3.menuGrid .i2 {
    grid-area: 4/2/6/8;
  }
  .grid12-3.menuGrid .i3 {
    grid-area: 6/2/8/8;
  }
  .grid12-4.innerGrid .leftCol {
    grid-area: 1/2/1/8;
  }
  .grid12-4.innerGrid .mainContent {
    grid-area: 2/2/3/8;
  }
  .grid12-4.innerGrid3 .leftCol {
    grid-area: 1/2/1/8;
  }
  .grid12-4.innerGrid3 .mainContent {
    grid-area: 2/2/3/8;
  }
  .grid12-4.innerGrid3 .rightCol {
    grid-area: 3/2/4/8;
  }
}
.topGrid {
  align-items: center;
  grid-template-areas: ". logoContainer logoContainer . . . . . .																			     contact loginMenu loginMenu cartMenu ." ". logoContainer logoContainer productSearch productSearch productSearch logoDistributor logoDistributor logoDistributor contact loginMenu loginMenu cartMenu ." ". logoContainer logoContainer . . . . . .																			     contact loginMenu loginMenu cartMenu .";
  row-gap: 0;
  padding: 16px 0;
}
.topGrid .logoContainer {
  grid-area: logoContainer;
}
.topGrid .productSearch {
  grid-area: productSearch;
}
.topGrid .logoDistributor {
  grid-area: logoDistributor;
}
.topGrid .contact {
  grid-area: contact;
}
.topGrid .loginMenu {
  grid-area: loginMenu;
}
.topGrid .cartMenu {
  grid-area: cartMenu;
}
.header .headerMenu {
  grid-area: 1/2/2/14;
}
.hamburgerMenu {
  grid-area: hamburger;
}
.centerMenu .lpMenu {
  grid-area: 1/2/2/14;
}
.wideArticle {
  grid-template-areas: ". item1 item1 item1 item1 item1 item1 item1 item1 item1 item1 item1 item1 .";
}
.logoMenu .lpMenu {
  grid-area: 1/2/2/14;
}
.mCat .mobileMenu {
  grid-area: 1/2/3/8;
}
.centerMenu {
  grid-template-areas: ". centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu .";
}
.centerMenu .lpMenu {
  grid-area: centerMenu;
}
.teaserHead {
  grid-template-areas: "item1 item1 item1 item1 item1 item1 item1 item1 item1 item1 item1 item1 item1 item1";
}
.homeSection4 {
  grid-template-areas: ". . . homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content . .";
}
.homeSection4 article {
  grid-area: homeSection4Content;
}
.messageGrid {
  grid-template-areas: ". message message message message message message message message message message .";
}
.messageGrid #lpMessages {
  grid-area: message;
}
.ctaArea {
  grid-template-areas: ". . . content content content content content content content content . . .";
}
.footer {
  grid-template-areas: ". item1 item1 . item2 item2 item3 item3 item4 item4 footerMenuRight footerMenuRight footerMenuRight ." ". footerLeft footerLeft footerLeft footerArticle footerArticle footerArticle footerArticle footerArticle footerArticle footerMenuRight footerMenuRight footerMenuRight ." ". footerMenuLeft footerMenuLeft footerMenuLeft footerArticle footerArticle footerArticle footerArticle footerArticle footerArticle footerMenuRight footerMenuRight footerMenuRight ." ". copyright copyright copyright copyright copyright copyright poweredBy poweredBy poweredBy poweredBy poweredBy poweredBy .";
}
.footer .logoContainer {
  align-self: center;
}
.footer .footerLeft {
  grid-area: footerLeft;
}
.footer .footerMenuLeft {
  grid-area: footerMenuLeft;
}
.footer .footerArticle {
  grid-area: footerArticle;
}
.footer .footerMenuRight {
  grid-area: footerMenuRight;
}
.footer .poweredBy {
  grid-area: poweredBy;
}
.footer .copyRight {
  grid-area: copyright;
}
@media all and (min-width: 1600px) {
  .grid12-4.innerGrid .mainContent {
    grid-area: 1/5/1/13;
  }
}
@media all and (max-width: 1024px) {
  .topGrid {
    padding: 0;
    margin: 0;
    gap: 16px;
    grid-template-areas: ". logoContainer logoContainer logoContainer logoContainer logoContainer logoContainer logoDistributor logoDistributor logoDistributor logoDistributor logoDistributor logoDistributor" ". productSearch productSearch productSearch productSearch productSearch productSearch productSearch productSearch productSearch productSearch productSearch productSearch" ". loginMenu loginMenu loginMenu loginMenu loginMenu loginMenu cartMenu cartMenu cartMenu cartMenu cartMenu cartMenu" ". hamburger hamburger hamburger hamburger hamburger hamburger contact contact contact contact contact contact";
  }
  .homeSection4 {
    grid-template-areas: ". homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content homeSection4Content  .";
  }
  .centerMenu {
    grid-template-areas: ". centerMenu centerMenu centerMenu centerMenu centerMenu centerMenu .";
  }
  .ctaArea {
    grid-template-areas: ". content content content content content content content content content content content content .";
  }
}
@media all and (max-width: 576px) {
  /*.topGrid{
		grid-template-areas:
			". logoContainer logoContainer logoContainer logoContainer logoDistributor logoDistributor ."
			". productSearch productSearch productSearch productSearch productSearch productSearch ."
			". loginMenu loginMenu favsContainer favsContainer cartMenu cartMenu ."
			". hamburger hamburger hamburger contact contact contact .";
	}*/
  .topGrid {
    grid-template-areas: ". logoContainer logoContainer logoContainer logoContainer logoDistributor logoDistributor ." ". productSearch productSearch productSearch productSearch productSearch productSearch ." ". loginMenu loginMenu loginMenu loginMenu cartMenu cartMenu ." ". hamburger hamburger . . contact contact .";
  }
  .procamper .topGrid {
    grid-template-areas: ". logoContainer logoContainer logoContainer logoDistributor logoDistributor logoDistributor ." ". productSearch productSearch productSearch productSearch productSearch productSearch ." ". loginMenu loginMenu loginMenu loginMenu cartMenu cartMenu ." ". hamburger hamburger . . contact contact .";
  }
  /*
	.procamper .topGrid{
		grid-template-areas:
			". logoContainer logoContainer logoContainer logoDistributor logoDistributor logoDistributor ."
			". productSearch productSearch productSearch productSearch productSearch productSearch ."
			". loginMenu loginMenu loginMenu  loginMenu loginMenu loginMenu  ."
			". hamburger hamburger contact contact cartMenu cartMenu .";
	}*/
  .logoMenu .lpMenu {
    grid-area: 1/2/2/8;
  }
  .ctaArea {
    grid-template-areas: ". content content content content content content .";
  }
  .footer {
    grid-template-areas: ". . item1 item1 item1 item1 . ." ". item2 item2 item3 item3 item4 item4 ." ". footerLeft footerLeft footerLeft footerLeft footerLeft footerLeft . " ". footerMenuRight footerMenuRight footerMenuRight footerMenuRight footerMenuRight footerMenuRight ." ". footerMenuLeft footerMenuLeft footerMenuLeft footerMenuLeft footerMenuLeft footerMenuLeft ." ". footerArticle footerArticle footerArticle footerArticle footerArticle footerArticle  . " ". copyright copyright copyright copyright copyright copyright ." ". poweredBy poweredBy poweredBy poweredBy poweredBy poweredBy  .";
    grid-template-columns: 1fr;
    grid-template-rows: auto;
  }
}
body {
  font-family: 'barlow';
  font-size: 18px;
  box-sizing: border-box;
}
h1 {
  margin-top: 7px;
  margin-bottom: 7px;
}
/*
.inputError {
	border-width: 1px;
}*/
/*****************  menu *****************/
.gridPanel,
.sysPanel .lpMenu li::before,
.menuItemText,
.menuItemText:before,
.menuItemText:after,
.iconContainer,
.linkToCart,
.details a,
.sysPanel,
.imgContainer::after,
a:not(.lpChk0):not(.lpChk1),
a::before {
  transition: all 0.3s ease-in-out 0s;
  -webkit-transition: 0.3s ease all;
}
.scrollMenu a,
.gridPanel,
.sysPanel {
  line-height: 45px;
  padding: 0 20px;
  border-radius: 8px;
}
.scrollMenu a:hover .iRight,
.gridPanel:hover .iRight {
  transform: translateX(5px);
}
.gridPanel .iconText {
  font-weight: bold;
}
.content {
  transition: all 0.7s ease-in-out 0s;
  -webkit-transition: 0.7s ease all;
}
.lpMenu .menuItemImg {
  max-width: 100%;
}
.logoLink {
  display: inline-block;
  text-align: center;
  width: 100%;
}
.logo {
  max-width: 100%;
}
/***********  Top part   *************/
.topGrid .productSearch {
  grid-area: productSearch;
  display: grid;
  grid-template-areas: "searchInput searchBtn";
  grid-gap: 16px;
  width: 100%;
}
.topGrid .productSearch .lpAutoComplete {
  grid-area: searchInput;
  height: 60px;
  font-size: 20px;
  line-height: 60px;
  padding: 0 4px;
  border-radius: 8px;
  width: 100%;
}
.topGrid .productSearch a {
  position: relative;
  right: initial;
  font-size: 20px;
  padding: 0 8px;
  text-align: center;
  width: auto;
}
.topGrid .productSearch #product_filterSearchButton {
  grid-area: searchBtn;
  border-radius: 8px;
  text-transform: uppercase;
  height: 60px;
  line-height: 60px;
  align-self: center;
  text-align: center;
  width: auto;
}
.topGrid .productSearch #product_filterResetButton {
  grid-area: searchBtn;
  text-align: left;
  width: auto;
}
.topGrid .productSearch #product_filterResetButton .iconContainer {
  font-size: 40px;
  line-height: 60px;
}
.topGrid .logo {
  max-width: 100%;
}
.topGrid .logoDistributor img {
  max-width: 150px;
}
.topGrid .logoDistributor .menuItemText {
  padding: 0;
  text-align: left;
  font-size: 20px;
  font-weight: bold;
}
.topGrid .li_level_0,
.topGrid .m_level_0 {
  height: 100%;
  align-content: center;
  text-align: center;
  border-radius: 8px;
  line-height: 0;
  width: 100%;
  /*>.menuItemText {
			//font-size: 20px;
			//line-height:;
		}*/
}
.topGrid .li_level_0 .iconContainer,
.topGrid .m_level_0 .iconContainer {
  padding-top: 20px;
  display: inline-block;
  font-size: 40px;
}
.topGrid .ul_level_1 {
  margin-top: -5px;
  z-index: 50;
  padding: 16px 0;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}
.topGrid .loginMenu {
  padding: 0px;
  position: relative;
  border-radius: 8px;
  display: flex;
  justify-content: space-around;
}
.topGrid .loginMenu .login .li_level_0 {
  position: static;
}
.topGrid .loginMenu .lpMenu .menuItemText {
  padding: 0px 4px;
}
.topGrid .loginMenu .ul_level_1 {
  min-width: 100%;
  right: 0;
  z-index: 10;
}
.topGrid .favsContainer {
  position: relative;
}
.topGrid .cartCounter,
.topGrid .favsContainer {
  position: relative;
}
.topGrid .cartCounter .li_level_0,
.topGrid .favsContainer .li_level_0 {
  z-index: 20;
  border-radius: 8px;
}
.topGrid .cartCounter .li_level_0::before,
.topGrid .favsContainer .li_level_0::before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform-origin: right;
  transition: 0.1s;
  z-index: -1;
  border-radius: 8px;
}
.topGrid .cartCounter .li_level_0:hover::before,
.topGrid .favsContainer .li_level_0:hover::before {
  transform: scaleX(2);
}
.topGrid .cartCounter .li_level_0:hover .ul_level_1,
.topGrid .favsContainer .li_level_0:hover .ul_level_1 {
  width: 200%;
}
.topGrid .cartCounter .ul_level_1,
.topGrid .favsContainer .ul_level_1 {
  right: 0;
}
.topGrid .favsContainer .lpMenu {
  position: relative;
  z-index: 0;
}
.topGrid .wsCartCounter,
.topGrid .wsFavsCounter {
  position: absolute;
  right: 25%;
  top: 10px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  border-width: 2px;
  line-height: 20px;
  text-align: center;
  font-size: 12px;
  font-weight: bold;
}
.topGrid .wsCartCounter {
  z-index: 30;
}
.hamburgerMenu {
  position: relative;
  padding: 1rem;
  width: 100%;
}
.hamburgerMenu .li_level_0 .iconContainer {
  padding-top: 0px;
}
.hamburgerMenu .li_level_0 {
  text-align: center;
}
.hamburgerMenu .ul_level_1 {
  z-index: 100;
  position: absolute;
  top: 115%;
  width: 100vw;
  left: -16px;
  text-align: left;
}
.hamburgerMenu .fa-bars {
  font-size: 36px;
}
.hamburgerMenu img {
  display: none;
}
.hamburgerMenu .menuItemText {
  font-size: 20px;
  line-height: 45px;
}
.accordionMenu .menuItemText {
  text-align: left;
}
.accordionMenu .lpMenu .ul_level_0 .li_level_0 {
  width: 100%;
}
.accordionMenu .li_level_1 {
  font-weight: normal;
}
.accordionMenu .iRight {
  display: none;
}
.accordionMenu .li_level_0 > .menuItemText {
  line-height: 45px;
}
.accordionMenu .menuItemText {
  /*line-height:32px;*/
  white-space: initial;
  padding: 0;
}
.safariWrap {
  width: 100%;
}
.header {
  padding: 0.25rem 0;
}
.header .lpMenu {
  float: left;
}
.header .headerMenu {
  margin: auto;
  text-align: center;
}
.header .headerMenu .lpMenu img {
  display: none;
}
.header .headerMenu .lpMenu .li_level_0 .menuItemText {
  font-size: 16px;
  font-weight: bold;
}
.header .headerMenu .menuItemText {
  line-height: 30px;
  white-space: nowrap;
  text-align: left;
}
.header .headerMenu .ul_level_0 .iconContainer {
  display: none;
}
.header .headerMenu .ul_level_1 {
  padding: 1rem 0;
  border-radius: 8px;
}
.header .headerMenu .ul_level_1 .menuItemText {
  line-height: 45px;
}
.header .headerMenu .ul_level_1 ul {
  margin-left: 1rem;
}
.header .headerMenu .ul_level_1 ul .menuItemText {
  line-height: 24px;
}
/*********** End  Top part   *************/
/***********  Banner part   *************/
.bannerContainer {
  position: relative;
}
.bannerContainer .bannerTextContainer {
  grid-template-rows: 50px 1fr 1fr 50px;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  /*&::after{
			  content:"";
			  grid-area:~' 2/2/4/4;';
			  background-size: contain;
			  background-repeat: no-repeat;
			  width: 100%;
			  height: 100%;
			  align-self: center;
			  background-position: center;
		}*/
  /*&::before{
			content:"";
			border-radius: 8px;
			grid-area:~' 2/1/4/14;';
		}*/
}
.bannerContainer .textContainer {
  grid-area: 2/2/4/10;
  align-self: center;
  text-align: left;
  position: relative;
  z-index: 2;
}
.bannerContainer .textContainer h2 {
  text-align: left;
  font-size: 36px;
  line-height: 1.1;
  font-weight: bold;
}
.bannerContainer .textContainer h4 {
  text-align: left;
  font-size: 24px;
  line-height: 1.1;
  font-weight: bold;
  margin-bottom: 1rem;
}
.bannerContainer .textContainer .bannerText {
  margin-bottom: 24px;
}
.bannerContainer .textContainer .gridPanel {
  font-size: 18px;
}
.bannerContainer .quickMenuContainer li {
  border-radius: 50%;
  margin: 0 4px;
}
/******** end Banner part  **********/
.homeContent {
  margin-top: 36px;
}
.home .contentGrid {
  row-gap: 0;
}
.homeTitle {
  text-align: center;
  padding: 24px 0;
}
.home .contentGrid .homeBottom .gridPanel {
  margin-bottom: 36px;
}
.homeSection .homeBottom {
  margin-bottom: 36px;
}
.homeSection h1,
.homeSection h3 {
  font-size: 42px;
  margin: 0;
  text-align: left;
}
.homeSection1 h3 {
  font-size: 32px;
  margin: 0;
  text-align: left;
}
.homeSection1 .homeIntro {
  margin-bottom: 36px;
  z-index: 1;
}
.homeSection .homeTitle,
.homeSection1 .homeTitle {
  display: none;
}
.homeSection .homeIntro,
.homeSection1 .homeIntro {
  position: relative;
  height: 100%;
  max-height: 450px;
  min-height: 150px;
  /*&::after {
			content: "";
			width: 100%;
			height: 100%;
			position: absolute;
			top:0;
			left:0;
			border-radius: 8px;
			transition:0.3s;
		}*/
}
.homeSection .homeIntro img,
.homeSection1 .homeIntro img {
  border-radius: 8px;
  width: 100%;
  height: 450px;
  object-fit: cover;
}
.homeSection .homeIntro .subTitle,
.homeSection1 .homeIntro .subTitle {
  position: absolute;
  bottom: 9rem;
  left: 0;
  z-index: 2;
  width: 100%;
  padding: 20px;
}
.homeSection .homeIntro .introText,
.homeSection1 .homeIntro .introText {
  position: absolute;
  bottom: 3.5rem;
  left: 0;
  z-index: 10;
  line-height: 1.2;
  font-weight: bold;
  padding: 20px;
  width: 100%;
}
.homeSection .homeIntro .gridPanel,
.homeSection1 .homeIntro .gridPanel {
  position: absolute;
  bottom: 20px;
  right: 20px;
  margin: 0;
  z-index: 10;
  white-space: nowrap;
}
.homeSection2 .homeText,
.homeSection3 .homeText,
.homeSection5 .homeText {
  font-size: 1.5em;
}
.homeSection2 .homeIntro,
.homeSection3 .homeIntro,
.homeSection5 .homeIntro {
  display: grid;
  gap: 16px;
  grid-template-rows: min-content auto 1fr min-content;
  margin-bottom: 36px;
  border-radius: 8px;
  overflow: hidden;
}
.homeSection2 .homeIntro .introImgWrap,
.homeSection3 .homeIntro .introImgWrap,
.homeSection5 .homeIntro .introImgWrap {
  grid-area: introImgWrap;
}
.homeSection2 .homeIntro .subTitle,
.homeSection3 .homeIntro .subTitle,
.homeSection5 .homeIntro .subTitle {
  grid-area: subTitle;
  font-weight: bold;
  line-height: 1.1;
  padding: 0 1rem;
}
.homeSection2 .homeIntro .subTitle h3,
.homeSection3 .homeIntro .subTitle h3,
.homeSection5 .homeIntro .subTitle h3 {
  font-size: 26px;
  margin: 0;
}
.homeSection2 .homeIntro .introText,
.homeSection3 .homeIntro .introText,
.homeSection5 .homeIntro .introText {
  grid-area: introText;
  font-size: 16px;
  line-height: 1.5;
  text-align: justify;
  padding: 0 1rem;
}
.homeSection2 .homeIntro .gridPanel,
.homeSection3 .homeIntro .gridPanel,
.homeSection5 .homeIntro .gridPanel {
  grid-area: gridPanel;
  margin: 0 1rem 1rem 0;
  justify-content: center;
  justify-self: end;
}
.homeSection2 .homeIntro,
.homeSection3 .homeIntro {
  grid-template-areas: "introImgWrap" "subTitle" "introText" "gridPanel";
}
.homeSection2 .homeIntro .introImg,
.homeSection3 .homeIntro .introImg {
  width: 100%;
  border-radius: 8px 8px 0 0;
}
.homeSection5 .homeIntro {
  min-height: 200px;
  grid-template-areas: "subTitle" "introText" "introImgWrap" "gridPanel";
}
.homeSection5 .homeIntro .introImgWrap {
  align-self: end;
}
.homeSection5 .homeIntro .introImg {
  display: block;
  margin: 0 auto;
}
.homeSection4 h2 {
  text-align: center;
  padding-bottom: 0.25rem;
}
.homeSection4 h2 span {
  position: relative;
}
.homeSection4 h2 span::after {
  content: "";
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: 0;
  width: 100%;
  border-radius: 8px;
  height: 5px;
}
.articleGroupIntro {
  border-radius: 8px;
  overflow: hidden;
}
.articleGroupIntro .gridPanel {
  justify-self: end;
  align-self: end;
  line-height: 40px;
  margin-bottom: 1rem;
}
/***********  Carousel part   *************/
.carouselGridContainer {
  padding: 16px 0;
}
.carouselGridContainer .productName,
.carouselGridContainer .priceNormal {
  font-weight: bold;
}
.carouselGridContainer .carouselItem .carouselContent {
  border-radius: 8px;
  transition: box-shadow 0.2s, transform 0.5s;
}
.progarden .carouselItem .productBrand,
.prouser .carouselItem .productBrand,
.robotfunyirocentrum .carouselItem .productBrand,
.progarden .carouselItem .productName,
.prouser .carouselItem .productName,
.robotfunyirocentrum .carouselItem .productName,
.progarden .carouselItem .teaserPrice,
.prouser .carouselItem .teaserPrice,
.robotfunyirocentrum .carouselItem .teaserPrice {
  opacity: 0;
  visibility: hidden;
  transition: 0.2s;
}
.progarden .carouselItem:hover .productBrand,
.prouser .carouselItem:hover .productBrand,
.robotfunyirocentrum .carouselItem:hover .productBrand,
.progarden .carouselItem:hover .productName,
.prouser .carouselItem:hover .productName,
.robotfunyirocentrum .carouselItem:hover .productName,
.progarden .carouselItem:hover .teaserPrice,
.prouser .carouselItem:hover .teaserPrice,
.robotfunyirocentrum .carouselItem:hover .teaserPrice {
  opacity: 1;
  visibility: visible;
}
/*********** End  new home part   *************/
/******** logo Menu  **********/
.logoMenu {
  padding: 24px 0;
}
.logoMenu .ul_level_0 {
  display: flex;
  gap: 16px;
  padding: 0;
  margin: 0;
  width: 100%;
  flex-direction: row;
  justify-content: space-between;
}
.logoMenu .li_level_0 .menuItemText {
  width: 100%;
  font-size: 16px;
  font-weight: bold;
  line-height: 1.1;
  padding: 0;
  text-align: center;
}
.logoMenu .li_level_0 .menuItemImg {
  display: block;
  height: 75px;
  margin: 0 auto 1rem auto;
}
.logoMenu .li_level_0 .iconContainer {
  width: 100%;
  min-height: 90px;
  text-align: center;
  font-size: 48px;
}
/******** end logo Menu  **********/
/********  home content blocks *********/
.groupHead {
  font-size: 1.8em;
  font-weight: bold;
}
.groupHead h2 {
  text-align: center;
  font-size: 1.4em;
}
.groupHead p {
  margin: 0;
  text-align: center;
}
.homeSection4 .content .imageContainer {
  border-radius: 8px;
  overflow: hidden;
  align-self: stretch;
}
.homeSection4 .content .imageContainer img {
  width: 130%;
}
.homeSection4 .content .contentText {
  line-height: 1.5;
  align-self: stretch;
  padding: 20px;
  border-radius: 12px;
}
.homeSection4 .content .contentText .introTitle {
  font-size: 28px;
  text-transform: uppercase;
  margin-bottom: 8px;
  font-weight: bold;
}
.homeSection4 .content .contentText .introText {
  padding-bottom: 45px;
}
.homeSection4 .content .contentText p {
  font-size: 1.2em;
}
.homeSection4 .content .linkBtn {
  margin: 20px;
}
/***********  main content ************/
.mainContent,
.leftCol,
.rightCol {
  line-height: 1.5;
}
/************* articles ****************/
.articleHead {
  border-top-left-radius: 12px;
  border-top-right-radius: 12px;
  overflow: hidden;
}
.articleHead .articleIntro .introText {
  padding: 0 16px 16px 0;
}
.groupHead {
  margin-bottom: 16px;
}
.articleGroupIntro {
  border-top-radius: 12px;
  overflow: hidden;
}
.articleGroupIntro .more {
  padding: 0 8px 8px 0;
}
/*Center Menu*/
.centerMenu {
  text-align: center;
}
.centerMenu .lpMenu {
  margin: auto;
  width: 100%;
}
.centerMenu .lpMenu li {
  align-self: center;
  ms-flex-align-self: center;
  -webkit-align-self: center;
  max-width: 200px;
  line-height: 0;
  padding: 8px 0;
  cursor: initial;
}
.centerMenu .lpMenu li .iconContainer {
  font-size: 24px;
}
.centerMenu .lpMenu li .menuItemText {
  font-weight: bold;
  font-size: 1.1em;
  width: auto;
  padding: 0;
}
.centerMenu .lpMenu li img {
  max-width: 100%;
}
/************** Contact form bottom *******************/
.homeCta {
  text-align: center;
  grid-area: content;
  margin-bottom: 16px;
}
.homeCta h2 {
  padding: 8px 20px;
  margin-bottom: 16px;
}
.homeCta .ctaText {
  font-size: 1.4em;
  font-weight: bold;
}
.homeCta .ctaMessage {
  text-align: left;
}
.homeCta .ctaGrid {
  max-width: 100%;
  margin: 0 auto;
  /*** cta result ****/
}
.homeCta .ctaGrid label {
  display: none;
}
.homeCta .ctaGrid label.terms {
  display: inline-block;
  width: auto;
  line-height: 32px;
  margin-right: auto;
}
.homeCta .ctaGrid textarea {
  width: 100%;
  height: 100%;
  max-width: 100%;
  max-height: 100%;
  padding: 2rem;
  border-radius: 8px;
  font-size: 110%;
}
.homeCta .ctaGrid input {
  width: 100%;
  height: 28px;
  padding: 2rem;
  border-radius: 8px;
  font-size: 110%;
}
.homeCta .ctaGrid .formErrMsg {
  margin: 0;
  line-height: 1;
  min-height: 6px;
}
.homeCta .ctaGrid .ctaBlockRemark .formErrMsg {
  float: left;
  text-align: left;
}
.homeCta .ctaGrid .ctaBlockTel .formErrMsg {
  min-height: 0px;
}
.homeCta .ctaGrid .readTerms {
  font-weight: bold;
}
.homeCta .ctaGrid .formRow {
  margin-top: 8px;
}
.homeCta .ctaGrid .registerWebsite {
  grid-row: 1/1;
  grid-column: 3/7;
  margin: 30px 0;
  font-size: 1.3em;
  line-height: 2;
}
.homeCta .ctaGrid .registerWebsite h3 {
  font-size: 1.5em;
  line-height: 2;
}
.homeCta .ctaGrid .lpChkContainer {
  margin-right: auto;
}
.homeCta .ctaBlockTerms .ctaBlockInner .formRow {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  white-space: nowrap;
  gap: 1rem;
}
.homeCta .linkBtn {
  margin-right: 0;
  margin-top: 8px;
  text-align: center;
}
.ctaGrid {
  display: grid;
  grid-gap: 0 16px;
  grid-template-areas: "ctaMessage ctaMessage  ctaMessage ctaMessage ctaMessage ctaMessage ctaMessage ctaMessage" "ctaBlockName1 ctaBlockName1 ctaBlockName1 ctaBlockName1 ctaBlockRemark ctaBlockRemark ctaBlockRemark  ctaBlockRemark" "ctaBlockName2 ctaBlockName2  ctaBlockName2 ctaBlockName2 ctaBlockRemark ctaBlockRemark ctaBlockRemark  ctaBlockRemark" "ctaBlockEmail ctaBlockEmail  ctaBlockEmail ctaBlockEmail ctaBlockRemark ctaBlockRemark ctaBlockRemark  ctaBlockRemark" "ctaBlockTel ctaBlockTel   ctaBlockTel ctaBlockTel ctaBlockRemark ctaBlockRemark ctaBlockRemark  ctaBlockRemark" "ctaBlockTerms ctaBlockTerms   ctaBlockTerms ctaBlockTerms  registerBtn registerBtn registerBtn registerBtn";
}
.ctaGrid .ctaMessage {
  grid-area: ctaMessage;
}
.ctaGrid .ctaBlockName1 {
  grid-area: ctaBlockName1;
}
.ctaGrid .ctaBlockName2 {
  grid-area: ctaBlockName2;
}
.ctaGrid .ctaBlockEmail {
  grid-area: ctaBlockEmail;
}
.ctaGrid .ctaBlockTel {
  grid-area: ctaBlockTel;
}
.ctaGrid .ctaBlockTerms {
  grid-area: ctaBlockTerms;
}
.ctaGrid .ctaBlockRemark {
  grid-area: ctaBlockRemark;
}
.ctaGrid .ctaBlockRemark .formErrMsg {
  width: 50%;
}
.ctaGrid .registerBtn {
  grid-area: registerBtn;
  justify-self: end;
}
/************** Footer ******************/
.footer {
  padding: 36px 0;
}
.footer .logo {
  max-height: 60px;
}
.footer .footerBlock {
  margin-bottom: 16px;
}
.footer .textGrid {
  gap: 16px;
  font-size: 20px;
  margin-bottom: 16px;
}
.footer .textGrid .iconContainer {
  font-size: 24px;
}
.footer .footerMenuLeft .menuItemText {
  padding: 0;
  line-height: 1.1;
  font-size: 16px;
}
.footer .footerMenuLeft img {
  margin: 8px 0;
}
.footer .footerMenuRight .li_level_0 {
  width: 100%;
}
.footer .footerMenuRight .menuItemText {
  font-weight: bold;
  text-align: left;
}
.footer .copyRight {
  line-height: initial;
}
.srollTopButton {
  border-radius: 10%;
}
.modPriv.notAccepted {
  animation-duration: 3s;
  animation-delay: 0.5s;
}
.innerGrid {
  margin-top: 36px;
}
.lpPagination li,
.lpPagination li a {
  border-radius: 4px;
}
#lpContent .articleBody .scrollMenu ul {
  padding: 0;
  margin: 0;
}
#lpContent .articleBody .scrollMenu ul li {
  margin: 0;
}
#lpContent .articleBody .scrollMenu ul li a {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
}
#lpContent .articleBody .scrollMenu ul li .menuItemText {
  padding: 0;
}
.articleSection {
  padding: 16px;
  margin: 24px 0;
  border-radius: 12px;
}
/************** Webshop ******************/
.wsProductTable .wsProductData {
  border-radius: 8px;
}
.wsProductTable .wsProductData .buttonRow {
  grid-template-columns: 1fr 1fr;
  column-gap: 24px;
}
.wsProductTable .wsProductData .buttonRow .addToCartFonticon {
  justify-self: end;
}
.wsProductTable .wsProductData .buttonRow .details {
  justify-self: start;
}
.wsProductTable .wsProductData .details {
  border-radius: 8px;
}
.addToCartFonticon {
  border-radius: 8px;
  font-weight: bold;
  padding: 0 12px;
  text-align: center;
  line-height: 45px;
}
/****  active menu, left ****/
.wsActiveMenu .menuItemText {
  font-weight: bold;
  line-height: 1.8;
  padding: 0 4px;
  width: auto;
  white-space: break-spaces;
}
.wsActiveMenu li {
  width: 100%;
}
.wsActiveMenu .iconContainer {
  font-size: 12px;
  line-height: 18px;
}
.wsActiveMenu ul {
  margin: 0 0 0 12px;
}
.productDescription.lpArticle table {
  margin: 0 0 20px 0;
}
.productDescription.lpArticle th {
  text-align: left;
}
.productDescription.lpArticle th p {
  font-size: 1.2em;
  margin: 20px 0 0 0;
  padding: 0;
}
.wsNumRows {
  padding: 1rem;
}
.multipleFilterContainer .filterHead {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.multipleFilterContainer .resetBtn {
  border-radius: 4px;
}
/********** cart checkout **********/
.wsAddressGrid input,
select {
  height: 40px;
}
.costMessage a {
  font-weight: bold;
}
.productDetails h1 {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
}
.productDetails .priceLabel {
  font-size: 16px;
}
.productDetails .vatText {
  font-size: 14px;
}
.productDetails .lpSlider .mainImgContainer img {
  max-height: 350px;
}
.productDetails .productData {
  margin: 40px 0;
}
.productDetails .propertyItem {
  padding: 0 6px;
  border-radius: 4px;
}
.productDetails .propertyValue {
  font-weight: bold;
}
.pagination {
  margin: 16px 0;
}
/**********  site variations ***************/
/************* Prouser *****************/
.prouser .gridLayout div.propertyBlock .propertyName {
  width: 55%;
}
.prouser .gridLayout div.propertyBlock .propertyValue {
  width: 45%;
}
/************* Progarden *****************/
.progarden .bannerContainer .quickMenuContainer {
  bottom: 0px;
  padding: 1rem;
}
@media all and (min-width: 576px) {
  .progarden .bannerContainer {
    padding-bottom: 3rem;
  }
}
/************* Procamper *****************/
.procamper .topGrid .logo {
  max-width: 120px;
}
.procamper .articleBody h2 {
  text-align: center;
}
.procamper .carouselGridContainer {
  padding-bottom: 36px;
}
.procamper .footer .item1 {
  justify-self: start;
}
.procamper .footer .item1 .logo {
  max-height: 150px;
}
.procamper .accordionMenu .li_level_0 > .menuItemText {
  font-weight: bold;
  padding-left: 24px;
}
/************* Prouser *****************/
.prouser .relatedItem {
  font-weight: bold;
}
/*******  END site variations ************/
@media all and (min-width: 1024px) {
  .safariWrap {
    top: -40px;
    width: 100%;
    transition: 0.5s;
  }
  .safariWrap.topZero {
    position: sticky;
    position: -webkit-sticky;
    left: 0px;
    top: -1px;
    z-index: 55;
  }
}
@media all and (min-width: 1980px) {
  .bannerContainer .textContainer h2 {
    font-size: 50px;
  }
  .bannerContainer .textContainer h4 {
    font-size: 30px;
  }
}
@media all and (max-width: 1200px) {
  .topGrid .li_level_0 > a > .menuItemText,
  .topGrid .li_level_0 > a > span > .menuItemText,
  .topGrid .li_level_0 > .menuItemText {
    font-size: 15px;
  }
  .bannerContainer .textContainer {
    grid-area: 2/2/4/12;
  }
  .bannerContainer .textContainer h2 {
    font-size: 24px;
  }
  .bannerContainer .textContainer h4 {
    font-size: 20px;
  }
  .logoMenu .ul_level_0 {
    flex-flow: wrap;
  }
  .logoMenu .li_level_0 {
    width: 16%;
  }
  .articleHead .articleIntro .introText {
    padding: 16px;
  }
}
@media all and (max-width: 1024px) {
  .topGrid .cartCounter .li_level_0:hover .li_level_0 > a > .menuItemText,
  .topGrid .cartCounter .li_level_0:hover .li_level_0 > a > span > .menuItemText,
  .topGrid .cartCounter .li_level_0:hover .li_level_0 > .menuItemText {
    font-size: 16px;
  }
  .topGrid .cartCounter .li_level_0:hover::before {
    transform: scaleX(1);
  }
  .topGrid .cartCounter .li_level_0:hover .ul_level_1 {
    width: 100%;
  }
  .bannerContainer .textContainer {
    grid-area: 2/2/4/14;
  }
  .bannerContainer .textContainer h2 {
    font-size: 24px;
  }
  .bannerContainer .textContainer h4 {
    font-size: 20px;
  }
  .bannerContainer .quickMenuContainer {
    padding: 1rem;
  }
  .bannerContainer .quickMenuContainer ul li {
    width: 20px;
    height: 20px;
    margin: 0.3rem;
  }
  .logoMenu .ul_level_0 li {
    width: 30%;
  }
  .seachBlockInner {
    margin-top: 12px;
  }
  .content {
    margin-bottom: 16px;
  }
  .centerMenu .lpMenu li {
    width: 33%;
  }
  .centerMenu .lpMenu li .menuItemText {
    font-size: 0.9em;
    line-height: 1.2;
  }
  .homeSection .homeIntro,
  .homeSection1 .homeIntro {
    /*.introText {
				bottom: 3.5rem;
			}*/
  }
  .homeSection .homeIntro .subTitle,
  .homeSection1 .homeIntro .subTitle {
    bottom: initial;
    top: 20%;
  }
  .ctaGrid {
    padding-bottom: 16px;
    grid-template-columns: 1fr;
    grid-template-areas: "ctaMessage" "   ctaBlockName1" "   ctaBlockName2" "   ctaBlockEmail" "    ctaBlockTel" "    ctaBlockRemark " "    ctaBlockTerms " "    registerBtn ";
  }
  .ctaGrid .registerBtn {
    justify-self: end;
  }
  .homeSection4 .content .imageContainer {
    margin-bottom: 16px;
  }
  .article .grid2 {
    grid-template-columns: 1fr;
    grid-template-areas: "item1" "item2";
  }
  .accordionMenu {
    width: 100%;
  }
  .ctaBlockTerms .ctaBlockInner .formRow {
    margin-top: 3rem;
  }
  .footer .logoContainer,
  .logContainer {
    margin-bottom: 1rem;
  }
}
@media all and (max-width: 576px) {
  .topGrid {
    padding-top: 12px;
    margin-bottom: 16px;
  }
  .topGrid .productSearch {
    grid-template-columns: 1fr 1fr;
  }
  .topGrid .logoDistributor img {
    max-width: 100%;
  }
  .topGrid .logoDistributor .menuItemText {
    line-height: 24px;
  }
  .topGrid .contact .iconContainer {
    padding: 0;
  }
  .topGrid .menuItemText {
    white-space: break-spaces;
  }
  .topGrid .li_level_0 > a > .menuItemText {
    padding: 0;
  }
  .topGrid .cartCounter .ul_level_1 {
    right: 0;
    width: 200%;
  }
  .topGrid .cartCounter .li_level_0:hover .ul_level_1 {
    width: 200%;
  }
  .bannerContainer {
    width: 100%;
  }
  .bannerContainer .bannerTextContainer {
    grid-template-rows: auto;
    position: relative;
  }
  .bannerContainer .bannerTextContainer .textContainer {
    grid-area: 2/2/4/8;
    text-align: center;
    margin-top: -80px;
  }
  .bannerContainer .bannerTextContainer .textContainer h2 {
    font-size: 22px;
  }
  .bannerContainer .bannerTextContainer .textContainer h4 {
    font-size: 16px;
  }
  .bannerContainer .quickMenuContainer {
    position: relative;
  }
  .bannerContainer .quickMenuContainer ul li {
    width: 20px;
    height: 20px;
    margin: 0.3rem;
  }
  .logoMenu .item1 .ul_level_0 li {
    width: 42%;
  }
  .logoMenu .ul_level_0 {
    justify-content: space-around;
  }
  .homeSection .homeIntro .subTitle,
  .homeSection1 .homeIntro .subTitle {
    bottom: initial;
    top: 10%;
  }
  .homeCta .ctaGrid .lpChkContainer {
    margin-right: 0;
  }
}
