* {
  font-family: sans-serif;
}
/*шрифты*/
@font-face {
    font-family: "Catorze27Style1-Black";
    src: url("2_font/Catorze27Style1-Black.otf");
}

@font-face {
    font-family: "Catorze27Style1-Bold";
    src: url("2_font/Catorze27Style1-Bold.otf");
}

@font-face {
    font-family: "Catorze27Style1-Light";
    src: url("2_font/Catorze27Style1-Light.otf");
}
html, body {
  height: 100%;
  margin: 1px;
}
body {
  background-image: url(/dist/8_style/pattern.jpg);
  background-size: cover;
  overflow: hidden;
}
.content {
  display: flex;
  justify-content: space-around;
}
[_nghost-xuw-c19] {
  height: 100%;
}
.shop-selector[_ngcontent-xuw-c19] {
  overflow: scroll;
  background-color: honeydew;
  width: 40%;
  height: 100%;
}
.shop-selector[_ngcontent-xuw-c19]   .shop-list[_ngcontent-xuw-c19] {
  display: flex;
  justify-content: space-around;
  align-items: baseline;
}
.shop-selector[_ngcontent-xuw-c19]   .shop-list[_ngcontent-xuw-c19]   p[_ngcontent-xuw-c19] {
  width: 50%;
}
.content[_ngcontent-xuw-c18] {
  height: 100%;
}
.banner[_ngcontent-xuw-c18] {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.banner[_ngcontent-xuw-c18]   img[_ngcontent-xuw-c18] {
  max-width: 90%;
  max-height: auto;
}
*[_ngcontent-xuw-c17] {
  font-family: sans-serif;
}
html[_ngcontent-xuw-c17], body[_ngcontent-xuw-c17] {
  height: 100%;
  margin: 1px;
}
body[_ngcontent-xuw-c17] {
  background-image: url(/dist/8_style/pattern.jpg);
  background-size: cover;
  overflow: hidden;
}
.content[_ngcontent-xuw-c17] {
  display: flex;
  justify-content: space-around;
}
[_nghost-xuw-c17] {
  width: 49%;
}
.content-column[_ngcontent-xuw-c17] {
  flex-direction: column;
  display: flex;
  justify-content: flex-start;
  height: 100%;
}
.content-column[_ngcontent-xuw-c17]   .category[_ngcontent-xuw-c17] {
  display: flex;
  flex-direction: column;
}
.content-column[_ngcontent-xuw-c17]   .header-row[_ngcontent-xuw-c17], .content-column[_ngcontent-xuw-c17]   .content-row[_ngcontent-xuw-c17] {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
}
.content-column[_ngcontent-xuw-c17]   .header-row[_ngcontent-xuw-c17] {
  margin-bottom: 5px;
}
.content-column[_ngcontent-xuw-c17]   .header-row[_ngcontent-xuw-c17]   .category-name[_ngcontent-xuw-c17], .content-column[_ngcontent-xuw-c17]   .header-row[_ngcontent-xuw-c17]   .volume[_ngcontent-xuw-c17] {
  display: flex;
  background-color: #EED696;
  border-radius: 10px;
  font-size: 1.6vw;
  text-transform: uppercase;
  font-weight: 600;
  flex-direction: row;
}
.content-column[_ngcontent-xuw-c17]   .header-row[_ngcontent-xuw-c17]   .category-name[_ngcontent-xuw-c17] {
  justify-content: left;
  padding-left: 9%;
  width: 80%;
}
.content-column[_ngcontent-xuw-c17]   .header-row[_ngcontent-xuw-c17]   .volume[_ngcontent-xuw-c17] {
  justify-content: center;
  min-width: 19%;
  margin-left: 1%;
}
.content-column[_ngcontent-xuw-c17]   .bottle-container[_ngcontent-xuw-c17] {
  display: flex;
  flex-direction: row;
  width: 100%;
  justify-content: space-between;
  color: #EED696;
  max-height: 5vh;
  padding-top: 3px;
}
.content-column[_ngcontent-xuw-c17]   .bottle-container[_ngcontent-xuw-c17]   div[_ngcontent-xuw-c17] {
  display: flex;
  flex-direction: row;
  background-color: #000000;
  border-radius: 10px;
  font-size: 1.5vw;
  text-transform: uppercase;
  width: 19%;
  justify-content: space-around;
}
.content-column[_ngcontent-xuw-c17]   .bottle-container[_ngcontent-xuw-c17]   .bottle-column[_ngcontent-xuw-c17] {
  justify-content: space-around;
  width: 40%;
}
.content-column[_ngcontent-xuw-c17]   .bottle-container[_ngcontent-xuw-c17]   .bottle-column[_ngcontent-xuw-c17]   img[_ngcontent-xuw-c17] {
  width: 30%;
}
.content-column[_ngcontent-xuw-c17]   .content-row[_ngcontent-xuw-c17]   .highlight_gradient[_ngcontent-xuw-c17] {
  --border-width: 3px;
  position: relative;
  border-radius: var(--border-width);
  animation: moveGradient 4s alternate infinite;
}
.content-column[_ngcontent-xuw-c17]   .content-row[_ngcontent-xuw-c17]   .highlight_gradient[_ngcontent-xuw-c17]::after {
  position: absolute;
  content: "";
  top: calc(-1 * var(--border-width));
  left: calc(-1 * var(--border-width));
  z-index: -1;
  width: calc(100% + var(--border-width) * 2);
  height: calc(100% + var(--border-width) * 2);
  background: linear-gradient(60deg, #5f86f2, #a65ff2, #f25fd0, #f25f61, #f2cb5f, #abf25f, #5ff281, #5ff2f0);
  background-size: 300% 300%;
  background-position: 0 50%;
  border-radius: calc(2 * var(--border-width));
  animation: moveGradient 4s alternate infinite;
}
@keyframes moveGradient {
  50% {
    background-position: 100% 50%;
  }
}
.content-column[_ngcontent-xuw-c17]   .content-row[_ngcontent-xuw-c17]   .highlight[_ngcontent-xuw-c17] {
  border: 3px solid transparent;
  background: linear-gradient(white, white) padding-box, repeating-linear-gradient(-45deg, red 0, #f5e944 25%, transparent 0, transparent 50%) 0/0.6em 0.6em;
  animation: ants 12s linear infinite;
}
@keyframes ants {
  to {
    background-position: 100% 100%;
  }
}
@charset "UTF-8";
*[_ngcontent-xuw-c16] {
  font-family: sans-serif;
}
html[_ngcontent-xuw-c16], body[_ngcontent-xuw-c16] {
  height: 100%;
  margin: 1px;
}
body[_ngcontent-xuw-c16] {
  background-image: url(/dist/8_style/pattern.jpg);
  background-size: cover;
  overflow: hidden;
}
.content[_ngcontent-xuw-c16] {
  display: flex;
  justify-content: space-around;
}
.icon-area[_ngcontent-xuw-c16], .alco-area[_ngcontent-xuw-c16] {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.icon-area[_ngcontent-xuw-c16] {
  width: 10%;
}
.icon-area[_ngcontent-xuw-c16]   .number[_ngcontent-xuw-c16] {
  font-weight: 600;
  font-size: 1.6vw;
  background-color: #EED696;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  min-width: 2vw;
  min-height: 1.5vh;
  margin: 3px;
}
.icon-area[_ngcontent-xuw-c16]   .icon[_ngcontent-xuw-c16] {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 3px;
}
.icon-area[_ngcontent-xuw-c16]   .icon[_ngcontent-xuw-c16]   img[_ngcontent-xuw-c16] {
  width: 30px;
  height: 30px;
}
@media (min-width: 1920px) {
  .title-area[_ngcontent-xuw-c16]   .title[_ngcontent-xuw-c16] {
    font-size: 1.5vw !important;
  }

  .price-area[_ngcontent-xuw-c16]   .new[_ngcontent-xuw-c16]::after {
    border-top: 1.95vh solid transparent !important;
    border-bottom: 1.95vh solid transparent !important;
  }
  .price-area[_ngcontent-xuw-c16]   .like[_ngcontent-xuw-c16]::after {
    border-top: 1.95vh solid transparent !important;
    border-bottom: 1.95vh solid transparent !important;
  }
  .price-area[_ngcontent-xuw-c16]   .exclusive[_ngcontent-xuw-c16]::after {
    border-top: 1.95vh solid transparent !important;
    border-bottom: 1.95vh solid transparent !important;
  }
  .price-area[_ngcontent-xuw-c16]   .on-the-way[_ngcontent-xuw-c16]::after {
    border-top: 1.95vh solid transparent !important;
    border-bottom: 1.95vh solid transparent !important;
  }
  .price-area[_ngcontent-xuw-c16]   .promo[_ngcontent-xuw-c16]::after {
    border-top: 1.95vh solid transparent !important;
    border-bottom: 1.95vh solid transparent !important;
  }
}
.title-area[_ngcontent-xuw-c16] {
  width: 80%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.title-area[_ngcontent-xuw-c16]   .title[_ngcontent-xuw-c16] {
  font-weight: 600;
  font-size: 2.2vw;
 /* font-family: Catorze27Style1-Black;*/
}
.title-area[_ngcontent-xuw-c16]   .manufacturer[_ngcontent-xuw-c16] {
  font-size: 1.3vw;
  font-weight: 600;
}
.alco-area[_ngcontent-xuw-c16] {
  width: 20%;
  margin-left:5%;
}
.alco-area[_ngcontent-xuw-c16]   .alco[_ngcontent-xuw-c16], .alco-area[_ngcontent-xuw-c16]   .pl[_ngcontent-xuw-c16] {
  text-transform: uppercase;
}
.alco-area[_ngcontent-xuw-c16]   .alco[_ngcontent-xuw-c16] {
  font-size: 1.3vw;
  font-weight: 600;
  background-color: #EED696;
}
.alco-area[_ngcontent-xuw-c16]   .pl[_ngcontent-xuw-c16] {
  font-size: 1.3vw;
  font-weight: 600;
}
.price-area[_ngcontent-xuw-c16] {
  width: 20%;
  display: flex;
  flex-direction: column;
  background-color: #000000;
  min-width: 19%;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  position:relative;
  bottom:0;
}
.price-area-no[_ngcontent-xuw-c16] {
  width: 20%;
  display: flex;
  flex-direction: column;
  background-color: #000000;
  min-width: 19%;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  position:relative;
  bottom:0;
}
.price-area-bro[_ngcontent-xuw-c16] {
  width: 20%;
  display: flex;
  flex-direction: column;
  background-color: #000000;
  min-width: 19%;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  position:relative;
  padding-bottom:0px;
}
.price-area-bro[_ngcontent-xuw-c16]   .price-bro[_ngcontent-xuw-c16] {
  color: #EED696;
  font-size: calc(24px + (16 + 16 * 0.7) * ((90vw - 320px) / 1280));
  font-weight: 600;
  text-align: center;
  position: absolute;
  margin-left: 53%;
  margin-top: 10%;
  font-weight: bold;
  z-index: 100;
}
.price-area-bro[_ngcontent-xuw-c16]   .price-nobro[_ngcontent-xuw-c16] {
  color: #EED696;
  font-size: calc(16px + (16 + 16 * 0.7) * ((80vw - 320px) / 1280));
  font-weight: 500;
  text-align: left;
  justify-content: end;
  margin-left: 12%;
  margin-top: 20%;
  z-index: 100;
  opacity: 1;
  font-weight: bold;
}
.price-area-bro[_ngcontent-xuw-c16]   .price-nobro100[_ngcontent-xuw-c16] {
  color: #EED696;
  font-size: calc(16px + (16 + 16 * 0.7) * ((80vw - 320px) / 1280));
  font-weight: 500;
  text-align: left;
  justify-content: end;
  margin-top: 20%;
  z-index: 100;
  opacity: 1;
  font-weight: bold;
}
.price-area-bro[_ngcontent-xuw-c16]   .badge[_ngcontent-xuw-c16] {
  display: flex;
  flex-flow: column;
  justify-content: flex-end;
  -webkit-justify-content: flex-end;
  font-size: 1.3vw;
  font-family: sans-serif;
  font-weight: 600;
  font-size: 1.2vw;
  color: #323332;
  height: 100%;
  width: 100%;
  text-align: left;
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
  position:absolute;
  bottom:0;
  opacity: .9;
  filter: alpha(opacity=90);
  clip-path: polygon(50% 0, 100% 0%, 100% 100%, 50% 100%);
  -webkit-clip-path: polygon(50% 0, 100% 0%, 100% 100%, 50% 100%);
  -moz-clip-path: polygon(50% 0, 100% 0%, 100% 100%, 50% 100%);
  -ms-clip-path: polygon(50% 0, 100% 0%, 100% 100%, 50% 100%);
}
.price-area-bro[_ngcontent-xuw-c16]   .bro[_ngcontent-xuw-c16] {
	background-color: #8f3060;
}
.price-area-bro[_ngcontent-xuw-c16]   .bro[_ngcontent-xuw-c16]::before {
  content: "C BRO";
  color: white;
  margin-left: 55%;
  font-weight: bold;
}
.price-area-bro[_ngcontent-xuw-c16]   .bro[_ngcontent-xuw-c16]::after {
  position: absolute;
  content: "";
  left: 100%;
  bottom: 0;
  width: 0;
  height: 0;
}
.price-area[_ngcontent-xuw-c16]   .price[_ngcontent-xuw-c16] {
  color: #EED696;
  font-size: 3.2vw;
  font-weight: 800;
  text-align: center;
  font-weight: bold;
  z-index: 100;
  margin-top:15%;
}
.price-area-no[_ngcontent-xuw-c16]   .price[_ngcontent-xuw-c16] {
  color: #EED696;
  font-size: 3.2vw;
  font-weight: 800;
  text-align: center;
  font-weight: bold;
  z-index: 100;
}
.price-area[_ngcontent-xuw-c16]   .price[_ngcontent-xuw-c16]   img[_ngcontent-xuw-c16] {
  display: inline-flex;
  height: 3.5vh;
}
.price-area[_ngcontent-xuw-c16]   .badge[_ngcontent-xuw-c16] {
  display: flex;
  flex-flow: column;
  justify-content: end;
  font-size: 1.3vw;
  font-family: sans-serif;
  font-weight: 600;
  font-size: 100%;
  color: #323332;
  height: 30%;
  width: 100%;
  border-bottom-right-radius: 10px;
  text-align: center;
  position:absolute;
  bottom:0;
}
.price-area[_ngcontent-xuw-c16]   .after[_ngcontent-xuw-c16] {
  content: "";
  left: 0;
  bottom: 0;
  width: 0;
  height: 5vh;
}
.price-area[_ngcontent-xuw-c16]   .on-the-way[_ngcontent-xuw-c16] {
  background-color: #EED696;
}
.price-area[_ngcontent-xuw-c16]   .on-the-way[_ngcontent-xuw-c16]::before {
  content: "В ПУТИ";
}
.price-area[_ngcontent-xuw-c16]   .on-the-way[_ngcontent-xuw-c16]::after {
  position: absolute;
  content: "";
  left: 100%;
  bottom: 0;
  width: 0;
  height: 30%;
}
.price-area[_ngcontent-xuw-c16]   .promo[_ngcontent-xuw-c16] {
  background-color: #D30000;
}
.price-area[_ngcontent-xuw-c16]   .promo[_ngcontent-xuw-c16]::before {
  content: "АКЦИЯ";
  color: #DDDDDD;
}
.price-area[_ngcontent-xuw-c16]   .promo[_ngcontent-xuw-c16]::after {
  position: absolute;
  content: "";
  left: 100%;
  bottom: 0;
  width: 0;
  height: 0;
}
.price-area[_ngcontent-xuw-c16]   .new[_ngcontent-xuw-c16] {
  background-color: #64D6FE;
}
.price-area[_ngcontent-xuw-c16]   .new[_ngcontent-xuw-c16]::before {
  content: "НОВИНКА";
}
.price-area[_ngcontent-xuw-c16]   .new[_ngcontent-xuw-c16]::after {
  position: absolute;
  content: "";
  left: 100%;
  bottom: 0;
  width: 0;
  height: 0;
}
.price-area[_ngcontent-xuw-c16]   .like[_ngcontent-xuw-c16] {
  background-color: #79B977;
}
.price-area[_ngcontent-xuw-c16]   .like[_ngcontent-xuw-c16]::before {
  content: "ЛЮБИМЧИК";
}
.price-area[_ngcontent-xuw-c16]   .like[_ngcontent-xuw-c16]::after {
  position: absolute;
  content: "";
  left: 100%;
  bottom: 0;
  width: 0;
  height: 0;
}
.price-area[_ngcontent-xuw-c16]   .exclusive[_ngcontent-xuw-c16] {
  background-color: #64D6FE;
}
.price-area[_ngcontent-xuw-c16]   .exclusive[_ngcontent-xuw-c16]::before {
  content: "ЭКСКЛЮЗИВ";
}
.price-area[_ngcontent-xuw-c16]   .exclusive[_ngcontent-xuw-c16]::after {
  position: absolute;
  content: "";
  left: 100%;
  bottom: 0;
  width: 0;
  height: 0;
}