/* Основной шрифт */

@font-face {
   font-family: 'Polomanfont';
   src: local('Montserrat Hairline'), local('Montserrat-Hairline'), url('/fonts/montserrat/Montserrat-ExtraLight.ttf') format('truetype');
   font-weight: 100;
   font-style: normal;
}

@font-face {
   font-family: 'Polomanfont';
   src: local('Montserrat Light'), local('Montserrat-Light'), url('/fonts/montserrat/Montserrat-Light.ttf') format('truetype');
   font-weight: 300;
   font-style: normal;
}

@font-face {
   font-family: 'Polomanfont';
   src: local('Montserrat Regular'), local('Montserrat-Regular'), url('/fonts/montserrat/Montserrat-Regular.ttf') format('truetype');
   font-weight: 400;
   font-style: normal;
}

@font-face {
   font-family: 'Polomanfont';
   src: local('Montserrat Medium'), local('Montserrat-Medium'), url('/fonts/montserrat/Montserrat-Medium.ttf') format('truetype');
   font-weight: 500;
   font-style: normal;
}

@font-face {
   font-family: 'Polomanfont';
   src: local('Montserrat SemiBold'), local('Montserrat-SemiBold'), url('/fonts/montserrat/Montserrat-SemiBold.ttf') format('truetype');
   font-weight: 600;
   font-style: normal;
}

@font-face {
   font-family: 'Polomanfont';
   src: local('Montserrat Bold'), local('Montserrat-Bold'), url('/fonts/montserrat/Montserrat-Bold.ttf') format('truetype');
   font-weight: 700;
   font-style: normal;
}

/* Основные цвета */

:root {
   --foot-btm: #151e28;
   --background: #fff;
   --red: #ff0000;
   --select: #fff2a8;
   --black: #000;
   --white: #fff;
   --yell: #ffd760;
   --blue: #006bff;
   --mblue: #2d7fef;
   --green: #00bb3c;
   --maxwidth: 1300px;
   --ff: 'Polomanfont', sans-serif;
   --input: #adcfe9;
   --inp: #f0f8ff;
   --selectr: #f3f7fa;
}

/* Основное  */

::selection {
   background: var(--select);
   color: var(--black);
}

a {
   color: var(--blue);
   text-decoration: none;
}

a:hover {
   color: var(--yell);
}

span,
div,
h1,
h2,
h3,
h4,
p,
p b,
p a,
p strong {
   word-wrap: break-word;
   word-break: break-word;
}

svg,
svg g,
img {
   margin: 0px;
   padding: 0px;
   line-height: 0px;
   max-width: 100%;
}

a,
img,
.plavn {
   transition: all 0.5s;
}

ul[id*="uStarRating"] a {
   transition: all 0s;
}

.no-scroll {
   overflow: hidden;
}

* {
   outline: none
}

textarea,
input {
   outline: none;
   resize: none;
   box-sizing: border-box
}

img,
a img {
   border: none;
   outline: none
}

select:focus {
   outline: none
}

h1,
h2,
h3,
h4,
h5,
h6 {
   font-family: var(--ff);
}


html,
body {
   margin: 0;
   padding: 0;
   min-height: 100%
}

body {
   font-size: 14px;
   line-height: 24px;
   background-color: var(--background);
   color: var(--black);
   font-weight: 400;
   font-family: var(--ff);
   -webkit-font-smoothing: antialiased;
   -moz-osx-font-smoothing: grayscale;
}

h1,
h2,
h3,
h4 {
   line-height: initial;
   margin-top: 0px;
}

body {
   top: 0px !important;
   overflow-x: hidden;
}

.noscroll {
   overflow: hidden !important;
}

table {
   border-collapse: collapse;
   border-spacing: 0;
   width: 100%;
}

table td,
table th {
   padding: 0;
   margin: 0;
   border: none;
}


@media only screen and (max-width: 1023px) {
   table {
      display: block;
      overflow: scroll;
      width: auto !important;
   }
}

/* Инпут и кнопки */


.form-fields {
   margin-top: 40px !important;
}

hr {
   margin: 10px 0px;
   padding: 0px;
   background: #efefef;
   height: 1px;
   width: 100%;
   display: block;
   border: none;
}

label {
   line-height: 20px;
   display: inline;
   justify-content: flex-start;
   align-items: center;
   gap: 10px;
}

input[type="checkbox"] {
   display: inline-block;
   width: 20px;
   height: 20px;
   padding: 0px;
   border: none;
   border-radius: 4px;
   cursor: pointer;
   vertical-align: middle;
   margin: 0px;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   outline: 0;
   position: relative;
   box-sizing: border-box !important;
   transition: all .5s ease;
   position: relative;
   top: 0px;
   left: 0px;
   float: left;
   overflow: hidden;
}

input[type="checkbox"]:hover {
   border: none;
}

input[type="checkbox"]::before {
   content: "";
   display: block;
   height: 100%;
   width: 100%;
   position: absolute;
   left: 0px;
   top: 0px;
   z-index: 2;
   background-image: url(/imgcss/tire.webp);
   background-repeat: no-repeat;
   background-size: 50%;
   background-position: center;
   transition: all 0.5s;
}

input[type="checkbox"]::after {
   content: "";
   display: block;
   height: 100%;
   width: 100%;
   position: absolute;
   left: 0%;
   top: 0px;
   background-color: var(--input);
   z-index: 1;
   transition: all 0.5s;
}

input[type="checkbox"i]:disabled::after {
   background-color: var(--background);
}

input[type="checkbox"i]:hover:disabled::before,
input[type="checkbox"i]:disabled::before {
   background-image: none;
}

input[type="checkbox"]:hover::before {
   background-image: url(/imgcss/okb.webp);
}

input[type="checkbox"i]:checked:disabled::before,
input[type="checkbox"]:checked::before {
   content: "";
   display: block;
   height: 100%;
   width: 100%;
   background-color: var(--green);
   position: absolute;
   left: 0px;
   top: 0px;
   background-image: url(/imgcss/ok.webp);
   background-repeat: no-repeat;
   background-size: 50%;
   background-position: center;
}

input[type="checkbox"]:checked::after {
   background-color: var(--green);
}

textarea,
input {
   outline: none;
   resize: none;
   box-sizing: border-box;
   color: var(--black);
   font-family: var(--ff);
   transition: all 0.5s;
   font-size: 13px;
}

button {
   outline: none;
   resize: none;
   box-sizing: border-box;
   font-family: var(--ff);
   transition: all 0.5s;
}

textarea {
   overflow: auto;
   border: 1px solid var(--input);
   background-color: var(--white);
   color: var(--black);
   line-height: 24px;
   min-height: 36px;
   padding: 15px 20px;
   box-sizing: border-box;
   border-radius: 8px;
}

select::-webkit-input-placeholder,
textarea::-webkit-input-placeholder,
input::-webkit-input-placeholder {
   color: var(--black) !important;
   font-weight: 400;
}

select::-ms-input-placeholder,
textarea::-ms-input-placeholder,
input:-ms-input-placeholder {
   color: var(--black) !important;
   font-weight: 400;
}

select::placeholder,
textarea::placeholder,
input::placeholder {
   color: var(--black) !important;
   font-weight: 400;
}

input[type="text"],
input[type="number"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="url"] {
   border: 1px solid var(--input);
   background-color: var(--white);
   color: var(--black);
   line-height: 20px;
   height: 40px;
   padding: 10px 20px;
   box-sizing: border-box;
   border-radius: 8px;
}

textarea,
input {
   max-width: 100%;
}

textarea:hover,
input:hover {
   border: 1px solid var(--blue);
}

input[type="button"],
input[type="submit"],
input[type="reset"],
button {
   border: none;
   color: var(--black);
   height: 40px;
   padding: 0px 20px;
   border-radius: 8px;
   cursor: pointer;
   box-sizing: border-box;
   background-color: var(--yell);
   transition: all 0.5s;
   font-weight: 500;
}

input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
button:hover {
   background-color: var(--green);
   color: var(--white);
}

textarea:focus,
input[type="number"]:focus,
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
textarea:focus {
   color: var(--black);
   border: 1px solid var(--green) !important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
   /* display: none; <- Crashes Chrome on hover */
   -webkit-appearance: none;
   margin: 0;
   /* <-- Apparently some margin are still there even though it's hidden */
}

select {
   color: var(--black);
   border: none;
   background-color: var(--selectr);
   cursor: pointer;
   line-height: 20px;
   height: 40px;
   padding: 0px 44px 0px 20px;
   background-size: auto 16px;
   background-image: url(/dop/select.png);
   background-repeat: no-repeat;
   background-position: right 20px center;
   font-family: var(--ff);
   -ms-appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   border-radius: 8px;
   white-space: nowrap;
   text-overflow: ellipsis;
   transition: all 0.5s;
   position: relative;
   max-width: 100%;
}

select::-ms-expand {
   display: none;
}

select:hover {
   outline: none;
   background-color: var(--yell);
}

select:focus {
   outline: none;
   background-color: var(--yell);
}

/* */

div#head {
   display: flex;
   flex-wrap: nowrap;
   justify-content: space-between;
   align-items: center;
   padding: 23px 80px;
   width: calc(100% - 160px);
   margin: 0px auto;
   margin-bottom: 40px;
   box-shadow: 0px 3px 5px rgba(194, 194, 194, 0.5);
}

a.logo {
   display: flex;
   gap: 20px;
   align-items: center;
   flex-wrap: wrap;
}

.logotext span {
   display: block;
}

#content {
   min-height: calc(100vh - 160px - 150px);
}

/* Header */

#fixedbl {
   top: 0;
   display: block;
   position: fixed;
   width: 100%;
   box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px;
   background-color: var(--white);
   z-index: 999;
}

.fixedbl {
   max-width: var(--maxwidth);
   margin: 10px auto;
   display: flex;
   justify-content: space-between;
   position: relative;
   align-items: center;
   flex-wrap: nowrap;
   gap: 5px 15px;
   padding: 0px 20px;
}

.fixedbl .tlogo {
   color: var(--black);
   display: flex;
   gap: 20px;
   align-items: center;
   line-height: 0;
}

.fixedbl .tlogo a img {
   display: block;
   height: 80px;
   line-height: 0;
}

.ltxt {
   font-size: 16px;
   color: var(--black);
   line-height: 20px;
}

.ltxt b {
   font-size: 19.68px;
   line-height: 24px;
}

.tmenu {
   display: flex;
   flex-wrap: wrap;
   gap: 5px 40px;
   justify-content: center;
   position: relative;
   align-items: center;
   font-size: 16px;
   margin-left: auto;
}

.tmenu a {
   color: var(--black);
   position: relative;
   overflow: hidden;
   display: block;
   line-height: 40px;
   padding-bottom: 2px;
   padding-top: 2px;
}

.tmenu a::before {
   top: inherit;
   bottom: 0;
}

.tmenu a.active:hover,
.tmenu a.active,
.tmenu a:hover {
   opacity: 1;
   color: var(--blue);
}

.tmenu a::before {
   content: '';
   position: absolute;
   bottom: 0px;
   left: 0px;
   width: 100%;
   height: 2px;
   background-color: var(--yell);
   transform: translateX(-100%);
   transition: transform 0.3s ease;
}

.tmenu:hover a.active::before,
.tmenu a.active::before,
.tmenu a:hover::before {
   transform: translateX(0);
}

.tmenu:hover a.active:hover::before,
.tmenu a.active::before,
.tmenu a:hover::before {
   animation: slideIn 0.3s forwards;
}

.tmenu:hover a.active::before,
.tmenu a::before {
   animation: slideOut 0.3s forwards;
}

@keyframes slideIn {
   from {
      transform: translateX(-100%);
   }

   to {
      transform: translateX(0);
   }
}

@keyframes slideOut {
   from {
      transform: translateX(0);
   }

   to {
      transform: translateX(100%);
   }
}

/* icon */
.h-menu .icon {
   display: block;
   margin-left: auto;
}

.icon-svg {
   display: flex;
   flex-wrap: nowrap;
   gap: 15px;
   align-items: center;
   color: var(--black);
}

.icon-svg a {
   color: #472825;
   display: block;
   position: relative;
   background-color: #fbebd0;
   padding: 10px;
   line-height: 0px;
   border-radius: 8px;
}

.icon-svg i {
   font-size: 34px;
}

.icon-svg > div {
   display: block;
   position: relative;
}

[data-title]:hover {
   position: relative;
}

[data-title]::before,
[data-title]:hover::before {
   all: initial;
   line-height: 20px;
   font-size: 14px;
   font-weight: 500;
   font-family: var(--ff);
   display: block;
   border-radius: 4px;
   padding: 0px;
   background-color: #fbebd0;
   content: attr(data-title);
   color: #472825;
   position: absolute;
   bottom: 0%;
   max-width: 140px;
   left: 50%;
   transform: translate(-50%, 0);
   margin-bottom: 0px;
   text-align: center;
   opacity: 0;
   transition: all .5s ease;
   height: 0px;
   overflow: hidden;
}

.mobmenu [data-title]::before,
[data-title]:hover::before {
   opacity: 1;
   transition: all .5s ease;
   bottom: calc(0px - 40px);
   height: auto;
   padding: 5px 10px;
   cursor: help;
   line-height: 20px;
   z-index: 10;
   white-space: nowrap;
}

[data-title]::after,
[data-title]:hover::after {
   all: initial;
   display: block;
   width: 0;
   height: 0;
   position: absolute;
   bottom: 0%;
   content: attr(data-title);
   left: 50%;
   transform: translate(-50%, 0);
   margin-bottom: 0px;
   opacity: 0;
   transition: all .5s ease;
   height: 0px;
   overflow: hidden;
   color: transparent;
   max-width: 140px;
}

.mobmenu [data-title]::after,
[data-title]:hover::after {
   opacity: 1;
   transition: all .5s ease;
   bottom: calc(0px - 14px);
   cursor: help;
   padding: 0px;
   line-height: 12px;
   width: auto;
   z-index: 10;
   content: '▲';
   font-size: 12px;
   color: #fbebd0;
   height: auto;
}

/* end */

.tmenu:hover a.active:hover,
.tmenu a.active {
   opacity: 1;
}

.header::before {
   display: block;
   content: '';
   position: absolute;
   z-index: -1;
   right: 0;
   background-image: url(/imgcss/yellright.svg);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: right;
   height: 634px;
   width: 423px;
   top: 0;
}

.header {
   margin: 0px auto;
   padding: 80px 0 40px 0;
   max-width: var(--maxwidth);
   z-index: 2;
   position: relative;
}

.header h1 {
   font-size: 50px;
   line-height: 50px;
   margin-bottom: 20px;
}

.header p {
   font-size: 18px;
   line-height: 28px;
   margin: 0px;
}

.header button {
   font-size: 18px;
   padding: 20px 40px;
   height: auto;
   border-radius: 60px;
}

button.scroll-button {
   position: relative;
   background-color: var(--yell);
   color: var(--black);
   z-index: 2;
}

img.pchel {
   position: absolute;
   z-index: 1;
   right: 30px;
   top: 10px;
   width: 400px;
}

img.light {
   position: absolute;
   top: -20px;
   left: 600px;
   opacity: 0.3;
   z-index: -1;
}

img.lightb {
   position: absolute;
   opacity: 0.1;
   z-index: -1;
}

.crug1 {
   width: 20px;
   height: 20px;
   position: absolute;
   background-color: var(--yell);
   border-radius: 50%;
   left: -60px;
   top: 60px;
}

.crug2 {
   width: 10px;
   height: 10px;
   position: absolute;
   background-color: var(--yell);
   border-radius: 50%;
   left: 600px;
   top: 50px;
}


.crug3 {
   width: 10px;
   height: 10px;
   position: absolute;
   background-color: var(--yell);
   border-radius: 50%;
   left: 300px;
   bottom: 50px;
}

.tophead {
   width: 100%;
   height: 100px;
}

.moder-block {
   display: none;
}

#bonuszak {
   background-color: #fff7ee;
   padding: 40px 20px;
}

.bonuszak {
   max-width: var(--maxwidth);
   margin: 0px auto;
}

.bonuszak ul {
   display: flex;
   flex-wrap: wrap;
   justify-content: flex-start;
   font-size: 16px;
   line-height: 20px;
   list-style: none;
   margin: 0px;
   padding: 0px;
   gap: 10px 30px;
   max-width: 1050px;
}

.bonuszak ul li {}

.bonuszak ul li:before {
   content: '';
   display: inline-block;
   margin-right: 10px;
   background-image: url(/imgcss/yes.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   width: 20px;
   height: 20px;
   line-height: 0;
   float: left;
}

#blvideo {
   padding: 40px 20px;
}

.blvideo {
   max-width: var(--maxwidth);
   margin: 0px auto;
}

.blvid {
   display: flex;
   flex-wrap: wrap;
   gap: 20px 40px;
   justify-content: flex-start;
   position: relative;
   align-items: center;
   font-size: 16px;
}

.blvid iframe {
   height: 400px;
   width: 710px;
   border-radius: 16px;
}

.blvidtxt {
   width: calc(100% - 750px);
}

.blvid button {
   font-size: 18px;
   padding: 20px 40px;
   height: auto;
   border-radius: 60px;
}

.blvid .inpulse {
   margin-top: 10px;
}

/* Footer */

footer {
   display: block;
   margin: 60px auto 0px auto;
   max-width: var(--maxwidth);
   padding: 0px 20px;
}

.fbottom {
   display: flex;
   justify-content: space-between;
   align-items: center;
   gap: 20px;
   flex-wrap: wrap;
}

.poloman {
   border: 2px solid var(--yell);
   display: block;
   padding: 20px 30px;
   border-radius: 16px 16px 0px 0px;
   border-bottom: none;
   text-align: center;
}

.poloman a {
   color: var(--black);
}

.poloman a:last-child {
   font-weight: 700;
   text-transform: uppercase;
   color: var(--black);
   font-size: 16px;
}

#hotzyv {
   padding: 0 20px;
}

.hotzyv {
   margin: 0px auto;
   max-width: var(--maxwidth);
   background-color: #d2e4ff;
   padding: 40px;
   border-radius: 60px;
   text-align: center;
}

.hotzyv h2 {
   font-size: 34px;
   line-height: 44px;
}

.sotrud {
   display: inline-block;
   content: '';
   width: 50px;
   height: 50px;
   background-image: url(/imgcss/handshake.svg);
   background-repeat: no-repeat;
   background-position: center;
   background-size: cover;
   margin-bottom: -14px;
}

.blotzyv img {
   margin: 0 15px;
   display: block;
   border-radius: 16px;
   max-width: calc(100% - 30px);
   box-shadow: 20px 0px 20px -20px rgb(204 224 255), -20px 0px 20px -20px rgb(204 224 255), 0px 20px 20px -20px rgb(204 224 255);
}

.otzyvcar {
   margin: 0px -15px;
}

.catstyle {
   background-image: url("/dop/catf.svg");
   padding-top: 60px;
   background-size: 100% auto;
   background-repeat: no-repeat;
   background-position: top center;
   position: relative;
}

.catimg {
   position: absolute;
   top: 0;
   right: 0;
   width: 360px;
   margin-top: -7.5%;
   margin-right: 0%;
}

.catimg img {
   position: relative;
   z-index: 2;
}

.catimg:before {
   content: '';
   display: inline-block;
   background: var(--yell);
   border-radius: 50%;
   width: 300px;
   height: 300px;
   position: absolute;
   top: calc(50% - 150px);
   right: calc(50% - 150px);
   z-index: 1;
}

.catinfo {
   max-width: var(--maxwidth);
   margin: 0px auto;
   padding: 0px 20px;
   position: relative;
}

ul.spisok {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   font-size: 16px;
   line-height: 20px;
   list-style: none;
   margin: 20px 0 40px 0;
   padding: 0px;
   gap: 20px;
   max-width: calc(100% - 370px);
   font-size: 16px;
   line-height: 24px;
}

ul.spisok li {
   width: calc(33.333% - 34px - (40px / 2));
   border: 2px solid #e8d1af;
   padding: 15px;
   border-radius: 8px;
}

ul.spisok li:before {
   content: '';
   display: inline-block;
   margin-right: 15px;
   background-image: url(/dop/icon/map.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   width: 48px;
   height: 48px;
   line-height: 0;
   float: left;
}

ul.spisok li:nth-child(1):before {
   background-image: url(/dop/icon/maps.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
}

ul.spisok li:nth-child(2):before {
   background-image: url(/dop/icon/honey.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
}

ul.spisok li:nth-child(3):before {
   background-image: url(/dop/icon/zima.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
}

ul.spisok li:nth-child(4):before {
   background-image: url(/dop/icon/sprint.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
}

ul.spisok li:nth-child(5):before {
   background-image: url(/dop/icon/egg.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
}

ul.spisok li:nth-child(6):before {
   background-image: url(/dop/icon/imun.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
}

ul.spisok li span {
   display: block;
   font-weight: 700;
   font-size: 18px;
}

.catinfo h1 {
   font-size: 36px;
   margin: 0px;
}

.catinfo > p {
   font-size: 18px;
   line-height: 28px;
   max-width: calc(100% - 340px);
   margin: 20px 0;
}

@media only screen and (max-width: 1339px) {
   ul.spisok {
      max-width: calc(100% - 0px);
   }

   .catimg {
      width: 200px;
      margin-right: 20px;
   }

   .catinfo > p {
      max-width: calc(100% - 230px);
   }

   .catimg:before {
      width: 180px;
      height: 180px;
      top: calc(50% - 90px);
      right: calc(50% - 90px);
   }

}

@media only screen and (max-width: 1023px) {
   .catstyle {
      background-size: auto 800px;
   }

   ul.spisok li {
      width: calc(50% - 34px - (20px / 2));
   }
}

@media only screen and (max-width: 699px) {
   .catimg {
      position: relative;
      margin: 0 auto;
      margin-top: -80px;
      margin-bottom: -40px;
   }

   .catinfo h1 {
      text-align: center;
   }

   .catinfo > p {
      max-width: calc(100% - 0px);
      text-align: center;
   }

   ul.spisok {
      gap: 10px;
   }

   ul.spisok li {
      width: calc(50% - 14px - (10px / 2));
      text-align: center;
      padding: 15px 5px;
      font-size: 14px;
   }

   ul.spisok li:before {
      display: table;
      float: none;
      margin: 0px auto;
      margin-bottom: 10px;
   }

   ul.spisok li span {
      font-size: 16px;
   }
}

#hshop {
   padding: 0px 20px;
   margin-bottom: 80px;
}

.blogpage #hshop {
   padding: 0px 0px;
}

.hshop {
   max-width: var(--maxwidth);
   margin: 0px auto;
   text-align: center;
}

.hshop h2 {
   font-size: 34px;
   line-height: 44px;
   margin-bottom: 40px;
}

.blshopall {
   display: flex;
   flex-wrap: nowrap;
   gap: 20px 30px;
   justify-content: space-between;
   position: relative;
   font-size: 16px;
}

.blshop {
   width: 100%;
   box-shadow: 0px 10px 30px 0px rgba(117, 139, 179, 0.2);
   border-radius: 16px;
   padding: 30px;
}

.blshop img {
   border-radius: 16px;
   line-height: 0px;
   display: block;
   margin-bottom: 20px;
}

.blshop a {
   color: var(--black);
   font-size: 20px;
   font-weight: 700;
}

.blshop a:hover {
   color: var(--yell);
}

.blshop p {
   margin: 10px 0 20px 0;
}

/* Отзывы */

.otzyvpage {
   max-width: var(--maxwidth);
   margin: 60px auto 0px auto;
   padding: 0 20px;
}

.otzyvpage h1 {
   font-size: 34px;
   line-height: 44px;
   text-align: center;
   margin-bottom: 20px;
}

.otzyvpage p {
   font-size: 16px;
   text-align: center;
   margin-bottom: 40px;
}

.otzyvy {
   display: flex;
   flex-wrap: wrap;
   gap: 30px 30px;
   justify-content: center;
   position: relative;
   align-items: center;
}

.otzyvy a {
   width: calc((100% / 5) - (120px / 5));
   display: flex;
   align-items: center;
   overflow: hidden;
   box-shadow: rgba(117, 139, 179, 0.2) 0px 10px 30px 0px;
   border-radius: 16px;
}

.otzyvy a img {
   display: block;
   line-height: 0;
}

/* Обо мне */

.obomne1,
.obomne2,
.obomne3,
.obomne4 {
   max-width: var(--maxwidth);
   margin: 0 auto;
   padding: 0 20px;
}

.obomne1 {
   margin-top: 60px;
   margin-bottom: 40px;
}

.ob_1 {
   display: flex;
   flex-wrap: nowrap;
   gap: 30px 30px;
   justify-content: center;
   position: relative;
   align-items: center;
}

.om_txt1 {
   font-size: 16px;
}

.om_txt1 p {
   margin: 0;
   margin-top: 5px;
   margin-bottom: 15px;
   text-align: justify;
}

.om_txt1 p:last-child {
   margin-bottom: 0px;
}

.ob_1 a.ulightbox {
   width: 600px;
   display: flex;
   align-items: center;
   height: 385px;
   overflow: hidden;
   box-shadow: rgba(117, 139, 179, 0.2) 0px 10px 30px 0px;
   border-radius: 16px;
   float: left;
   margin-right: 30px;
   margin-bottom: 20px;
}

.obomne1 h1 {
   font-size: 34px;
   line-height: 44px;
   text-align: center;
   margin-bottom: 40px;
}

.obomne3 {
   text-align: center;
   padding: 40px;
   border: 2px solid var(--yell);
   border-radius: 16px;
   max-width: calc(var(--maxwidth) - 84px);
   margin-bottom: 40px;
}

.obomne3 h2 {
   margin-bottom: 20px;
}

.obomne3 p {
   margin: 0px;
   font-size: 16px;
}

.obomne3 button {
   font-size: 18px;
   padding: 20px 40px;
   height: auto;
   border-radius: 60px;
}

.obomne4 h2 {
   font-size: 34px;
   line-height: 44px;
   text-align: center;
   margin-bottom: 40px;
}

.paseka {
   display: flex;
   flex-wrap: wrap;
   gap: 30px 30px;
   justify-content: center;
   position: relative;
   align-items: center;
}

.paseka a {
   width: calc(33.333% - 20px);
   display: flex;
   align-items: center;
   height: 200px;
   overflow: hidden;
   box-shadow: rgba(117, 139, 179, 0.2) 0px 10px 30px 0px;
   border-radius: 16px;
}

.paseka a img {
   display: block;
   line-height: 0;
}

/* */

span.colbasket {
   position: absolute;
   min-width: 16px;
   height: 24px;
   padding: 0px 4px;
   border-radius: 30px;
   line-height: 24px;
   background: var(--yell);
   text-align: center;
   top: -14px;
   border: 2px solid #fff;
   right: -12px;
   font-size: 12px;
   font-weight: 700;
}

.colichestvo_style {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   margin-top: 0px;
}

.cs_number {
   display: flex;
   flex-wrap: nowrap;
   justify-content: space-between;
   gap: 10px;
   width: 100%;
}

.cs_number button {
   width: 40px;
   padding: 0px;
   text-align: center;
   font-size: 20px;
   font-weight: 700;
   background-color: var(--selectr);
}

.cs_number button:hover {
   background-color: var(--green);
}

.cs_number input {
   width: calc(100% - 100px);
   text-align: center;
   padding: 0px;
   font-size: 16px;
   font-weight: 700;
}

.colichestvo_style input[type="button"] {
   width: 100%;
   font-weight: 500;
   padding: 0px;
   background-color: var(--yell);
}

.colichestvo_style input[type="button"]:hover {
   width: 100%;
   font-weight: 500;
   padding: 0px;
   background-color: var(--green);
}

.mobmenu {
   overflow-y: scroll;
   display: none;
   height: calc(100% - 114px);
   position: fixed;
   top: 74px;
   background-color: var(--white);
   left: 100%;
   padding: 20px;
   width: calc(100% - 40px);
   transition: all 0.5s;
   z-index: 999;
}

.mobmenu .tmenu {
   text-align: center;
   gap: 10px;
   margin-top: 70px;
}

.mobmenu .tmenu a {
   width: calc(100% - 0px);
   background-color: var(--selectr);
   border-radius: 8px;
   padding-bottom: 0;
}

.mobmenu .tmenu a::before {
   display: none;
}

.mobmenu.open {
   left: 0px;
}

.mobmenu .icon-svg {
   gap: 50px;
   justify-content: center;
   margin-left: 0px;
   width: 100%;
}

#toggleButton {
   display: none;
   border-radius: 8px;
   background: var(--yell);
   color: var(--black);
   position: relative;
   padding-left: 54px;
   font-weight: 500;
   font-size: 16px;
   line-height: 0px;
   height: 44px;
   padding-right: 30px;
}

#toggleButton.active {
   background-color: var(--black);
   color: var(--white);
}

#toggleButton span {
   display: block;
   position: absolute;
   top: calc(50% - 1px);
   width: 14px;
   left: 30px;
   height: 2px;
   border-radius: 4px;
   transition: all 0.5s;
}

#toggleButton b {
   font-weight: 500;
}

#toggleButton span::before,
#toggleButton span::after {
   position: absolute;
   display: block;
   left: 0;
   width: 80%;
   height: 2px;
   content: "";
   border-radius: 4px;
}

#toggleButton span,
#toggleButton span::before,
#toggleButton span::after {
   background-color: var(--black);
}

#toggleButton.active span,
#toggleButton.active span::before,
#toggleButton.active span::after {
   background-color: var(--black);
}

#toggleButton span::before {
   top: -6px;
}

#toggleButton span::after {
   bottom: -6px;
}

#toggleButton span {
   transition: background 0s 0.0s;
}

#toggleButton span::before,
#toggleButton span::after {
   transition-duration: 0.3s, 0.3s;
   transition-delay: 0.3s, 0s;
}

#toggleButton span::before {
   transition-property: top, transform;
}

#toggleButton span::after {
   transition-property: bottom, transform;
}

#toggleButton.active span {
   background: none;
}

#toggleButton.active span::before {
   top: 0;
   transform: rotate(45deg);
   width: 100%;
}

#toggleButton.active span::after {
   bottom: 0;
   transform: rotate(-45deg);
   width: 100%;
}

#toggleButton.active span::before,
#toggleButton.active span::after {
   transition-delay: 0s, 0.3s;
   background-color: var(--white);
}

/* Телефон */

.text-icon {
   font-size: inherit;
   vertical-align: middle;
   align-items: center;
}

@keyframes flash {

   0%,
   50%,
   to {
      opacity: 1;
   }

   25%,
   75% {
      opacity: 0px;
   }
}

.flash {
   animation-name: flash;
}

.autoflash {
   position: relative;
   overflow: hidden;
}

.flash {
   content: "";
   background-color: rgba(255, 255, 255, 0.31);
   height: 100%;
   width: 3em;
   display: block;
   position: absolute;
   top: 0px;
   left: -4.5em;
   -webkit-transform: skewX(-45deg) translateX(0);
   transform: skewX(-45deg) translateX(0);
   -webkit-transition: none;
   transition: none;
}

.lighting {
   webkit-animation: moving 5s ease-in-out infinite;
   -moz-animation: moving 5s ease-in-out infinite;
   -ms-animation: moving 5s ease-in-out infinite;
   -o-animation: moving 5s ease-in-out infinite;
   animation: moving 5s ease-in-out infinite;

}

@keyframes moving {
   30% {
      webkit-transform: skewX(-45deg) translateX(53.5em);
      transform: skewX(-45deg) translateX(53.5em);

   }

   100% {
      webkit-transform: skewX(-45deg) translateX(53.5em);
      transform: skewX(-45deg) translateX(53.5em);

   }
}

.contact-button {
   display: flex;
   align-items: center;
   justify-content: center;
   text-align: center;
   background: #fbebd0;
   color: #472825;
   border: none;
   border-radius: 8px;
   font-size: 18px;
   font-weight: 700;
   padding: 15px;
   height: 100%;
   cursor: pointer;
   line-height: 24px;
   gap: 10px;
   margin-left: 25px;
}

.contact-button i {
   font-size: 24px;
}

/* Страница товара */

#pagetov {
   max-width: var(--maxwidth);
   margin: 0px auto;
   margin-top: 60px;
   display: flex;
   justify-content: space-between;
   gap: 30px;
   padding: 0 20px;
}

.pagetovl {
   width: 226px;
   position: sticky;
   top: 104px;
   align-self: flex-start;
   color: #000;
   line-height: 0;
   border-radius: 8px;
   border: 2px solid var(--selectr);
   padding: 20px;
   border-radius: 8px;
}

.pa-img .bl {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   position: relative;
}

.pa-img .slider {
   border-radius: 8px;
   display: block;
   line-height: 0px;
   overflow: hidden;
}

.pagetovr {
   width: calc(100% - 300px);
}

.pagetovr p:last-child {
   margin-bottom: 0;
}

.pagetovl .basket-container {
   display: block;
   width: 100%;
}

.av-tovprice {
   display: flex;
   flex-wrap: nowrap;
   gap: 10px;
   justify-content: center;
   width: 100%;
   margin: 0px auto;
   border-radius: 8px;
   line-height: 56px;
   border: 2px solid var(--yell);
}

.av-price {
   font-weight: 700;
   font-size: 18px;
}

.av-oldprice {
   font-size: 14px;
   font-weight: 400;
   position: relative;
}

.av-oldprice span:before {
   content: '';
   display: block;
   width: 110%;
   background: #e13d3d;
   height: 3px;
   position: absolute;
   top: calc(50% - 1.5px);
   left: -5%;
   transform: rotate(4deg);
   opacity: 1;
}

.av-oldprice span {
   position: relative;
}

.product-tail {
   width: 100%;
}

.pagetovinfoul ul.spisok {
   max-width: 100%;
   margin: 20px 0;
}

@media only screen and (max-width: 1023px) {

   .contact-button {
      display: none;
   }

   #pagetov {
      flex-wrap: wrap;
   }

   .pagetovl,
   .pagetovr {
      width: 100%;
      position: relative;
      top: 0;
   }
}

/* Доставка */

#dostavka {
   margin: 60px auto 0 auto;
   padding: 0 20px;
}

#dostavka h1 {
   font-size: 34px;
   line-height: 44px;
   text-align: center;
   margin-bottom: 40px;
}

.dost_media,
.samovivoz,
.dost_punkt {
   margin: 40px auto;
   max-width: var(--maxwidth);
}

.dost_punkt {
   display: flex;
   flex-wrap: nowrap;
   gap: 20px 30px;
   justify-content: space-between;
   position: relative;
   font-size: 16px;
}

.dostp_bl {
   width: 100%;
   box-shadow: 0px 10px 30px 0px rgba(117, 139, 179, 0.2);
   border-radius: 16px;
   padding: 30px;
   text-align: center;
}

.dostp_bl img {
   border-radius: 16px;
   line-height: 0px;
   display: block;
   margin-bottom: 20px;
}

.dostp_bl b {
   color: var(--black);
   font-size: 20px;
   font-weight: 700;
}

.dostp_bl p {
   margin: 10px 0 0px 0;
}

.samovivoz {
   text-align: center;
   padding: 30px;
   border: 2px solid var(--yell);
   border-radius: 16px;
   max-width: calc(var(--maxwidth) - 84px);
   margin-bottom: 40px;
   font-size: 16px;
}

.dost_media {
   display: flex;
   flex-wrap: wrap;
   gap: 20px 30px;
   justify-content: space-between;
   position: relative;
   font-size: 16px;
}

.dost_media > div {
   width: calc(50% - 15px);
   line-height: 0;
   border-radius: 16px;
   overflow: hidden;
   height: 300px;
   display: flex;
   align-items: center;
}

.dost_media > div iframe {
   width: 100%;
   height: 300px;
}

.dost_media > div a,
.dost_media > div img {
   min-height: 100%;
}

/* adapt */

@media only screen and (max-width: 1339px) {

   .dost_media > div {
      height: 240px;
   }

   .ob_1 {
      flex-wrap: wrap;
   }

   :root {
      --maxwidth: 1024px;
   }

   .fixedbl .tlogo a img {
      height: 54px;
   }

   .tophead {
      height: 74px;
   }

   .ltxt b {
      font-size: 17.28px;
   }

   .ltxt {
      font-size: 14px;
   }

   .header {
      padding: 60px 20px 40px 20px;
   }

   .header p {
      font-size: 16px;
   }

   .header h1 {
      font-size: 40px;
   }

   img.pchel {
      position: absolute;
      z-index: 1;
      right: 30px;
      top: 30px;
      width: 240px;
   }

   .header::before {
      height: 434px;
      width: 323px;
   }


   .blshopall {
      flex-wrap: wrap;
   }

   .blshop {
      width: calc(50% - 75px);
   }

}

@media only screen and (max-width: 1023px) {

   .ob_1 a.ulightbox {
      height: auto;
      max-width: max-content;
      margin: 0px auto 20px auto;
      float: none;
      width: 100%;
   }

   .dost_punkt {
      gap: 20px;
   }

   .dost_media > div {
      height: 140px;
   }

   .otzyvy {
      gap: 20px;
   }

   .otzyvy a {
      width: calc((100% / 4) - (60px / 4));
   }

   .mobmenu {
      display: block;
   }

   #toggleButton {
      display: block;
   }

   .obomne3 p br,
   .obomne3 h2 br {
      display: none;
   }

   .obomne3 {
      margin: 40px 20px;
      padding: 20px;
   }

   .paseka a {
      height: 130px;
   }

   #fixedbl .icon-svg,
   .header p br,
   img.light,
   #fixedbl .tmenu {
      display: none;
   }

   img.pchel {
      top: 0;
      right: 0;
      z-index: -1;
      opacity: 0.3;
   }

   .header::before {
      height: 384px;
      width: 243px;
      opacity: 0.5;
   }

   .blvid iframe {
      width: 100%;
   }

   .blvidtxt {
      width: 100%;
      text-align: center;
   }

   .hotzyv h2 {
      font-size: 24px;
      line-height: 30px;
   }

   .sotrud {
      width: 40px;
      height: 40px;
      margin-bottom: -13px;
   }

   #hotzyv {
      padding: 0px;
   }

}

@media only screen and (max-width: 699px) {

   .dost_media,
   .dost_punkt {
      flex-wrap: wrap;
   }

   .samovivoz {
      padding: 20px;
   }

   .dost_media > div {
      width: 100%;
   }

   .otzyvy a {
      width: calc((100% / 2) - (20px / 2));
   }

   .paseka {
      gap: 20px 20px;
   }

   .paseka a {
      width: calc(50% - 10px);
      height: 85px;
   }

   .hotzyv h2 br,
   .hotzyv h2 span,
   .crug2 {
      display: none;
   }

   .blvid iframe {
      height: 240px;
   }

   .blshop {
      width: 100%;
   }

   .header h1 {
      font-size: 36px;
   }

   .hotzyv h2 {
      font-size: 20px;
      line-height: 30px;
   }

   .fbottom {
      justify-content: center;
      align-items: center;
      text-align: center;
   }

   .hotzyv {
      padding: 40px 20px;
      border-radius: 30px;
   }
}

@media only screen and (max-width: 499px) {
   #toggleButton b {
      display: none;
   }

   #toggleButton {
      padding: 0px;
      width: 54px;
   }

   #toggleButton span {
      left: 20px;
   }
}

@media only screen and (max-width: 449px) {
   .fixedbl .tlogo {
      gap: 12px;
   }

   .fixedbl {
      gap: 0;
   }
}


/* Блог */

.blogpage {
   max-width: var(--maxwidth);
   margin: 0 auto;
   margin-top: 60px;
   padding: 0 20px;
}

.allpage {
   max-width: var(--maxwidth);
   margin: 0 auto;
   margin-top: 60px;
   padding: 0 20px;
}

.allpage h1 {
   font-size: 34px;
   line-height: 44px;
   margin-bottom: 40px;
   text-align: center;
}

.blogpage h1:before {
   content: '';
   display: inline-block;
   margin-right: 10px;
   background-image: url(/img/rutube.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   width: 34px;
   height: 34px;
   border-radius: 8px;
   line-height: 0;
   float: left;
}

.blogpage #allEntries {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   position: relative;
   align-items: center;
   gap: 30px;
   margin-top: 40px;
   padding-top: 40px;
   border-top: 1px solid #efefef;
}

.blogpage #allEntries > div[id*="entryID"] {
   width: calc((100% - 30px) / 2);
   line-height: 0;
}

.blogpage #allEntries > div[id*="entryID"] iframe {
   width: 100%;
   max-width: 100%;
   overflow: hidden;
   border-radius: 16px;
   line-height: 0;
}

.blvid iframe,
.blogpage #allEntries > div[id*="entryID"] iframe {
   background-image: url(/img/rutub.png);
   background-repeat: no-repeat;
   background-position: center;
   background-color: #14151d;
   background-size: 50%;
}

.bltitbp {
   font-size: 18px;
   margin-bottom: 10px;
   font-weight: 800;
   line-height: 24px;
}

.bltitbp a {
   color: var(--black);
}

.bltitbp:before {
   content: '';
   display: inline-block;
   margin-right: 10px;
   background-image: url(/img/play.png);
   background-repeat: no-repeat;
   background-size: contain;
   background-position: center;
   width: 24px;
   height: 24px;
   border-radius: 8px;
   line-height: 0;
   float: left;
}

.bltitbp a:hover {
   color: var(--yell);
}

.blogpage #pagesBlock1 {
   display: flex;
   flex-wrap: wrap;
   justify-content: center;
   position: relative;
   align-items: center;
   gap: 20px;
}

.blogpage #pagesBlock1 a,
.blogpage #pagesBlock1 > span,
.blogpage #pagesBlock1 b {
   width: 40px;
   line-height: 40px;
   border-radius: 8px;
   background: #ec153b;
   color: #fff;
   text-align: center;
   display: inline-block;
}

.blogpage #pagesBlock1 > span,
.blogpage #pagesBlock1 a {
   background: #100942;
}

.blogpage #pagesBlock1 a:hover {
   background: #ec153b;
}

@media only screen and (max-width: 1023px) {
   .blogpage #allEntries > div[id*="entryID"] {
      width: calc((100% - 0px) / 1);
      line-height: 0;
   }

   .blogpage #allEntries > div[id*="entryID"] iframe {
      height: 320px;
   }
}

@media only screen and (max-width: 499px) {
   .blogpage #allEntries > div[id*="entryID"] iframe {
      height: 220px;
   }

   #content {
      min-height: calc(100vh - 200px - 158px);
   }
}

.wysibb-body {
   padding: 0px 8px !important;
}

/* Select */

.selectric-wrapper {
   position: relative;
   cursor: pointer;
   display: inline-block;
   max-width: 100%;
}

.selectric .label {
   background: transparent;
   cursor: pointer;
   height: 40px;
   line-height: 40px;
   -ms-appearance: none;
   -webkit-appearance: none;
   -moz-appearance: none;
   appearance: none;
   position: relative;
   cursor: pointer;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   overflow: hidden;
   white-space: nowrap;
   transition: all 0.5s;
}

.selectric-open .selectric .label,
.selectric:hover .label {
   color: var(--black);
}

.selectric .label::-ms-expand {
   display: none;
}

.selectric-responsive {
   width: 100%;
}

.selectric {
   position: relative;
   padding: 0px 44px 0px 20px;
   display: block;
   overflow: hidden;
   border-radius: 8px;
   background-color: var(--selectr);
   transition: all 0.5s;
   white-space: nowrap;
   overflow: hidden;
   text-overflow: ellipsis;
}

.selectric:hover {
   background-color: var(--yell);
}

.selectric:after {
   content: '';
   display: block;
   background-size: auto 16px;
   background-image: url(/dop/select.png);
   background-repeat: no-repeat;
   background-position: center;
   height: calc(100% - 0px);
   position: absolute;
   right: 20px;
   top: 0px;
   width: 14px;
}

.selectric .button {
   display: none;
}

.selectric .button:after {
   display: none;
}

.selectric-focus .selectric {
   border-color: #aaaaaa;
}

.selectric-hover .selectric {
   border-color: #c4c4c4;
}

.selectric-hover .selectric .button {
   color: #a2a2a2;
}

.selectric-hover .selectric .button:after {
   border-top-color: #a2a2a2;
}

.selectric-wrapper.selectric-open {
   z-index: 9999;
   outline: none;
}

.selectric-open .selectric {
   background-color: var(--yell);
}

.selectric-disabled {
   filter: alpha(opacity=50);
   opacity: 0.5;
   cursor: default;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

.selectric-hide-select {
   position: relative;
   overflow: hidden;
   width: 0;
   height: 0;
}

.selectric-hide-select select {
   position: absolute;
   left: -100%;
}

.selectric-hide-select.selectric-is-native {
   position: absolute;
   width: 100%;
   height: 100%;
   z-index: 10;
}

.selectric-hide-select.selectric-is-native select {
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   height: 100%;
   width: 100%;
   border: none;
   z-index: 1;
   box-sizing: border-box;
   opacity: 0;
}

.selectric-input {
   position: absolute !important;
   top: 0 !important;
   left: 0 !important;
   overflow: hidden !important;
   clip: rect(0, 0, 0, 0) !important;
   margin: 0 !important;
   padding: 0 !important;
   width: 1px !important;
   height: 1px !important;
   outline: none !important;
   border: none !important;
   *font: 0/0 a !important;
   background: none !important;
}

.selectric-temp-show {
   position: absolute !important;
   visibility: hidden !important;
   display: block !important;
}

/* Items box */
.selectric-items {
   display: none;
   position: absolute;
   top: 45px;
   left: 0;
   background: transparent;
   padding: 0px;
   border-radius: 8px;
   z-index: -1;
   transition: all .5s ease;
}

.selectric-items::after {
   content: '';
   position: absolute;
   left: 16px;
   top: -12px;
   border: 6px solid transparent;
   border-bottom: 6px solid var(--foot-btm);
   opacity: 0;
   transition: all .5s ease;
}

.selectric-open .selectric-items {
   display: block;
   opacity: 1;
   width: auto !important;
   height: auto !important;
   min-width: calc(100% - 40px);
   transition: all .5s ease;
   top: 55px;
   background-color: var(--foot-btm);
   cursor: default;
}


/* полоса прокрутки (скроллбар) */

.selectric-scroll::-webkit-scrollbar {
   width: 3px;
   /* ширина для вертикального скролла */
   height: 3px;
   /* высота для горизонтального скролла */
   background-color: var(--foot-btm);
   border-radius: 4px;
   display: block;
}

.selectric-scroll::-webkit-scrollbar-track {}

/* ползунок скроллбара */

.selectric-scroll::-webkit-scrollbar-thumb {
   background-color: var(--green);
   width: 4px;
   border-radius: 4px;
}

.selectric-scroll::-webkit-scrollbar-thumb:hover {
   background-color: var(--green);
}



.selectric-open .selectric-items::after {
   opacity: 1;
   transition: all .5s ease;
}

.selectric-items {
   padding: 20px;
}

.selectric-items .selectric-scroll {
   height: 100%;
   overflow: auto;
   opacity: 0;
   transition: all .5s ease;
   max-height: 110px;
}

.selectric-open .selectric-items .selectric-scroll {
   opacity: 1;
   transition: all .5s ease;
}

.selectric-items ul,
.selectric-items li {
   list-style: none;
   padding: 0;
   margin: 0;
   line-height: 20px;
   min-height: 20px;
   position: initial;
   text-align: left;
}

.selectric-items ul {
   display: block;
   margin: 0px auto;
}

.selectric-items li {
   display: block;
   padding: 0px;
   margin-bottom: 10px;
   padding-right: 10px;
   color: var(--white);
   cursor: pointer;
   white-space: nowrap;
   transition: all 0.5s;
   overflow: hidden;
   position: initial;
}

.selectric-items li:last-child {
   margin-bottom: 0px;
}

.selectric-items li.selected {
   color: var(--yell);
}

.selectric-items li:hover {
   color: var(--green);
}

.selectric-items .disabled {
   filter: alpha(opacity=50);
   opacity: 0.5;
   cursor: default !important;
   background: none !important;
   color: #000 !important;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
}

.selectric-items .selectric-group .selectric-group-label {
   font-weight: 900;
   padding-left: 10px;
   cursor: default;
   -webkit-user-select: none;
   -moz-user-select: none;
   -ms-user-select: none;
   user-select: none;
   background: none;
   color: #444;
}

.selectric-items .selectric-group.disabled li {
   filter: alpha(opacity=100);
   opacity: 1;
}

.selectric-items .selectric-group li {
   padding-left: 25px;
}

/* Регистрация  */

#pagelogin {
   max-width: var(--maxwidth);
   margin: 0 auto;
   padding: 0 20px;
   margin-top: 60px;
   margin-bottom: 40px;
}

#pagelogin h1 {
   font-size: 34px;
   line-height: 34px;
   margin-bottom: 40px;
   text-align: center;
}

.pagelogin {
   border: 2px solid var(--yell);
   padding: 30px;
   border-radius: 8px;
   width: calc(100% - 64px);
   max-width: 320px;
   margin: 0 auto;
   overflow: hidden;
}

.pagelogin :where(.auth-social-list, .auth-block) {
   gap: 0px;
   justify-content: space-evenly;
}

.pagelogin :where(.login-with) {
   border-radius: 8px;
   width: 40px;
   height: 40px;
}

.pagelogin #uf-register .register-social-list,
#plogin {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   justify-content: space-between;
}

a.login-with.facebook,
.social-label {
   display: none;
}

.uf-soc-icons {
   width: 100%;
}

.pagelogin #uf-register .register-social-list,
.auth-social-list {
   padding: 30px;
   background-color: var(--selectr);
   margin: 30px -30px -30px -30px;
}

.pagelogin #uf-register .register-social-list {
   margin-top: -30px;
   margin-bottom: 0px;
}

input[type="submit"]#uf-submit,
input[type="text"].pl_log,
input[type="password"].pl_pas,
input[type="submit"].pl_in {
   width: 100%;
   line-height: 24px;
   padding: 13px 20px 13px 44px;
   background-repeat: no-repeat;
   background-position: left 20px center;
   background-size: 14px auto;
   height: 50px;
   margin-bottom: 0px;
   font-size: 14px;
}

#plogin input[type="text"],
#plogin input[type="password"] {
   width: 100%;
   line-height: 24px;
   padding: 13px 20px 13px 44px;
   background-repeat: no-repeat;
   background-position: left 20px center;
   background-size: 14px auto;
   height: 50px;
   margin: 0px;
   font-size: 14px;
}

input[type="submit"]#uf-submit,
input[type="submit"].pl_in {
   padding: 0px;
   font-weight: 500;
   margin: 0px;
}


.pl_log {
   background-image: url(/imgcss/log.webp);
}

.pl_pas {
   background-image: url(/imgcss/pas.webp);
}

#uf-email {
   background-image: url(/imgcss/mail.webp);
}

.uf-fields-wrap p,
.uf-soc-icons p,
.uf-reg-wrap h2 {
   display: none !important;
}

.pagelogin #uf-register {
   flex-wrap: wrap;
   display: flex;
   gap: 20px 0;
}

.uf-fields-wrap {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
   justify-content: space-between;
}

.pagelogin #uf-register .uf-field {
   position: relative;
   width: 100%;
   margin: 0;
   padding: 0;
}

.shoptehpage {
   max-width: var(--maxwidth);
   margin: 0 auto;
   padding: 0 20px;
   margin-top: 60px;
   margin-bottom: 40px;
}

#pagelogin h1 {
   font-size: 34px;
   line-height: 34px;
   margin-bottom: 40px;
}