/* Created by Dizzy, info@dizzy.su */

/* Custom fonts */
@font-face {font-family: Roboto; font-weight: 300; src: url(../fonts/Roboto-Light.eot); src: url(../fonts/Roboto-Light.eot?#iefix) format('embedded-opentype'), url(../fonts/Roboto-Light.woff2) format('woff2')}
@font-face {font-family: Roboto; font-weight: 400; src: url(../fonts/Roboto-Regular.eot); src: url(../fonts/Roboto-Regular.eot?#iefix) format('embedded-opentype'), url(../fonts/Roboto-Regular.woff2) format('woff2')}
@font-face {font-family: Roboto; font-weight: 600; src: url(../fonts/Roboto-Medium.eot); src: url(../fonts/Roboto-Medium.eot?#iefix) format('embedded-opentype'), url(../fonts/Roboto-Medium.woff2) format('woff2')}
@font-face {font-family: Cent21; font-weight: 400; src: url(../fonts/21Cent-Regular.eot); src: url(../fonts/21Cent-Regular.eot?#iefix) format('embedded-opentype'), url(../fonts/21Cent-Regular.woff2) format('woff2')}
@font-face {font-family: Cent21; font-weight: 400; font-style: italic; src: url(../fonts/21Cent-Italic.eot); src: url(../fonts/21Cent-Italic.eot?#iefix) format('embedded-opentype'), url(../fonts/21Cent-Italic.woff2) format('woff2')}
@font-face {font-family: Cent21; font-weight: 700; src: url(../fonts/21Cent-Bold.eot); src: url(../fonts/21Cent-Bold.eot?#iefix) format('embedded-opentype'), url(../fonts/21Cent-Bold.woff2) format('woff2')}
@font-face {font-family: Rouble; font-weight: 400; src: url(../fonts/Rouble.eot); src: url(../fonts/Rouble.eot?#iefix) format('embedded-opentype'), url(../fonts/Rouble.woff2) format('woff2')}

/* Main defaults */
* {font-size: 100%; outline: none; list-style: none; margin: 0; padding: 0}
html, body {min-width: 1200px}
body, input, textarea {background: #f8f8f9; color: #000; font: 400 12px Roboto, Cent21, arial, helvetica, tahoma, verdana; cursor: default}
textarea {overflow: hidden; resize: vertical; display: block}
img {border: none; display: block}
h3 {color: #000b8c; font: 400 48px/50px Cent21, arial, helvetica, tahoma, verdana; margin-bottom: 20px}
p {margin-bottom: 15px}
a {color: #000b8c; text-decoration: underline}
a:hover {text-decoration: none}

/* Header & Footer */
header {height: 250px; position: relative; z-index: 7}
header .logo {position: absolute; top: 35px; left: 20px}
header .logo * {background-image: url(../images/logoHeader.png); background-size: 100% 100%; width: 218px; height: 141px; display: block}
header .menuIcon {background: #160b8b; width: 31px; height: 31px; border-radius: 50%; overflow: hidden; display: none; position: absolute; top: 27px; left: 20px; user-select: none}
header .menuIcon:before, header .menuIcon:after, header .menuIcon i {content: ''; background: #fff; width: 17px; height: 3px; display: block; margin: 2px auto 0}
header .menuIcon:before {margin-top: 9px}
header .menuIcon span {display: none}
header .menu {position: absolute; top: 76px; left: 370px}
header .menu li {float: left; margin-left: 38px}
header .menu li:first-child {margin: 0}
header .menu li * {font: 700 14px Cent21, arial, helvetica, tahoma, verdana; letter-spacing: 0.8px; text-decoration: none; cursor: pointer; padding-bottom: 2px; transition: all 0.2s ease}
header .menu li *:hover {color: #5886d9; border-bottom: 3px #a9c7e7 solid}
header .login {line-height: 29px; position: absolute; top: 135px; left: 370px}
header .login .userPic {background-image: url(../images/userPic.png); background-size: 100% 100%; width: 30px; height: 29px; cursor: pointer; float: left; margin-right: 17px; opacity: 0.7; transition: opacity 0.2s ease}
header .login .userPic:hover {opacity: 1}
header .login .list {float: left}
header .login br {display: none}
header .login li {color: #5887da; line-height: 32px; float: left; margin-left: 25px}
header .login li:first-child {margin: 0}
header .login span {text-decoration: none; border-bottom: 2px #bcd3ec solid; cursor: pointer; padding-bottom: 2px; transition: all 0.2s ease}
header .login span:hover {border-color: #84a4e3}
header.sticky .inner {background: #58646e; width: auto; height: 86px; position: fixed; top: 0; left: 0; right: 0; z-index: 5; margin: 0; padding: 0}
header.sticky .logo {top: 19px}
header.sticky .logo * {background-image: url(../images/logoHeaderSticky2.png); width: 30px; height: 45px}
header.sticky .menu {top: 36px; left: 100px}
header.sticky .menu li * {color: #fff}
header.sticky .menu li *:hover {color: #abc8e7; border-color: #abc8e7 !important}
header.sticky .menu li.active * {border-bottom: 3px #fff solid}
header.sticky .login {top: 28px; left: auto; right: 20px}
header.sticky .login .userPic {background-image: url(../images/userPicSticky.png); background-size: 200% 100%; opacity: 1}
header.sticky .login .userPic:hover {background-position: 100% 0}
header.sticky .login li {color: #fff}
header.sticky .login li * {color: #fff; border-color: #fff}
header.sticky .login li *:hover {color: #abc8e7; border-color: #abc8e7}
.footer {
    background: #80a8e8 url(../images/bg.jpg) 50% 0 no-repeat;
    background-size: cover;
}
.footer .center {
    color: #fff;
    padding-top: 70px;
    padding-bottom: 70px;
}
.footer__row {
    justify-content: space-between;
    display: flex;
}
.footer__row-bottom {
    padding-top: 20px;
}
.footer__custom {
    font-size: 15px;
    margin-bottom: 32px;
}
.footer__phone {
    font-weight: 300;
    font-size: 21px;
    line-height: 30px;
    margin-bottom: 24px;
}
.footer__phone-link {
    color: #fff;
    font-weight: 600;
    font-size: 27px;
    line-height: 30px;
    text-decoration: none;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    transition: all 0.2s ease;
}
.footer__phone-link:hover {
    border-color: transparent;
}
.footer__email {
    font-weight: 300;
    font-size: 21px;
    line-height: 30px;
    margin-bottom: 24px;
}
.footer__email-link {
    font-weight: 600;
    font-size: 27px;
    line-height: 30px;
    display: block;
}
.footer__callMe {
    margin-bottom: 30px;
}
.footer__callMe-link {
    color: #000b8c;
    font-weight: 600;
    font-size: 27px;
    text-decoration: none;
    border-bottom: 1px #000b8c dashed;
    cursor: pointer;
    padding-bottom: 2px;
    transition: all 0.2s ease;
}
.footer__callMe-link:hover {
    border-color: transparent;
}
.footer__companyName {
    font-size: 15px;
    margin-bottom: 32px;
}
.footer__soc {
    margin-bottom: 32px;
}
.footer__soc:after {
    content: '';
    clear: left;
    display: block;
}
.footer__soc-item {
    float: left;
    margin-left: 12px;
}
.footer__soc-item:first-child {
    margin: 0;
}
.footer__soc-item a {
    background-size: 100% 100%;
    cursor: pointer;
    display: block;
    transition: opacity 0.2s ease;
}
.footer__soc-item a:hover {
    opacity: 0.75;
}
.footer__soc-vk a {
    background-image: url(../images/socVk.png);
    width: 36px;
    height: 21px;
    margin-top: 2px;
}
.footer__soc-yt a {
    background-image: url(../images/socYt.png);
    width: 32px;
    height: 23px;
    margin-top: 1px;
}
.footer__soc-fb a {
    background-image: url(../images/socFb.png);
    width: 13px;
    height: 25px;
}
.footer__soc-ig a {
    background-image: url(../images/socIg.png);
    width: 26px;
    height: 25px;
}
.footer__soc-tg a {
    background-image: url(../images/socTg.png);
    width: 30px;
    height: 25px;
}
.footer__copyright {
    color: #abc8e7;
    font-size: 15px;
    text-shadow: 0 0 3px #446ca9;
}
.footer__offer {
    color: #fff;
    font-weight: 600;
    text-decoration: none;
    border-bottom-width: 1px;
    border-bottom-style: solid;
    cursor: pointer;
    padding-bottom: 2px;
    transition: all 0.2s ease;
}
.footer__offer:hover {
    border-color: transparent;
}
.footer__logo {
    margin-bottom: 24px;
}
.footer__logo * {
    background: url(../images/logoFooter.png);
    background-size: 100% 100%;
    width: 105px;
    height: 209px;
    display: block;
}
.footer__ageRating {
    font-weight: 600;
    font-size: 36px;
    line-height: 24px;
    letter-spacing: -2.5px;
}
.footer__charge {
    max-width: 50%;
    color: #abc8e7;
    font-size: 15px;
    text-shadow: 0 0 3px #446ca9;
    text-align: right;
    padding-left: 24px;
    box-sizing: border-box;
}

/* Forms */
input, textarea {width: 100%; color: #5887da; font-weight: 300; font-size: 26px; border: 2px #160b8b solid; border-radius: 0; display: block; padding: 0 15px; box-sizing: border-box}
input {height: 50px}
textarea {height: 170px; padding-top: 4px; padding-bottom: 4px}
.field {max-width: 500px; width: 300px; margin: 0 auto}
.field *::placeholder {color: #abc8e7; font: 400 28px Cent21, arial, helvetica, tahoma, verdana}
.field *::-webkit-input-placeholder {color: #abc8e7; font: 400 28px Cent21, arial, helvetica, tahoma, verdana}
.field *::-moz-placeholder {color: #abc8e7; font: 400 28px Cent21, arial, helvetica, tahoma, verdana}
.field *:-ms-input-placeholder {color: #abc8e7; font: 400 28px Cent21, arial, helvetica, tahoma, verdana}
.readonly * {background: #ccc; border-color: #aaa}
.readonly *::placeholder {color: #bbb; text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.7)}
.readonly *::-webkit-input-placeholder {color: #bbb; text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.7)}
.readonly *::-moz-placeholder {color: #bbb; text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.7)}
.readonly *:-ms-input-placeholder {color: #bbb; text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.7)}
.error {color: #f4436c; border-color: #f3426d}
.inputCustom {user-select: none}
.inputCustom input {display: none !important}
.inputCustom label {color: #5386d9; font-weight: 300; font-size: 21px; cursor: pointer; display: inline-block; position: relative; padding-left: 32px}
.inputCustom label:before {content: ''; background: #fff; width: 16px; height: 16px; border: 1px #5386d9 solid; position: absolute; top: 3px; left: 0; transition: all 0.2s ease}
.inputCustom label:hover:before {background: #e3e9f2}
.inputCustom input:checked + label:after {content: ''; width: 9px; height: 4px; border: 2px #5386d9 solid; border-top: none; border-right: none; position: absolute; top: 8px; left: 4px; transform: rotate(-45deg)}
.button {max-width: 500px; width: 300px; margin: 0 auto; user-select: none}
.button * {background: #0e1d61; width: 100%; height: 50px; color: #fff; font: 400 28px/50px Cent21, arial, helvetica, tahoma, verdana; letter-spacing: 1px; text-align: center; cursor: pointer; display: block; transition: all 0.2s ease; box-sizing: border-box}
.button *:hover {background: #5386d9}
.button *:active {box-shadow: 0 3px 10px 1px rgba(0, 0, 0, 0.3) inset}
.button.disabled * {background: #bbb; color: #999; text-shadow: 1px 1px 1px rgba(255, 255, 255, 0.7); cursor: default; box-shadow: none}

/* Content */
.center {width: 1160px; position: relative; margin: 0 auto; padding: 0 20px}
.infoBlock {background: url(../images/bg.jpg) 50% 0 no-repeat; background-size: cover; color: #fff}
.infoBlock .center {position: relative}
.infoBlock h3 {color: #fff; font-size: 42px}
.infoBlock .center:before {content: ''; background-size: cover; width: 1120px; position: absolute; bottom: -50px; left: 50%; margin-left: -560px}
.infoBlock .text {width: 630px; text-align: right; float: left; position: relative; padding-left: 80px}
.infoBlock .text p {color: #fff}
.infoBlock.type1 {margin-bottom: 220px}
.infoBlock.type1 .center {height: 340px; padding-top: 60px}
.infoBlock.type1 .center:before {background-image: url(../images/bgCircles.png); height: 300px}
.infoBlock.type1 h3 {font-size: 70px; line-height: 90px}
.glass {
    background-size: 100% 100%;
    width: 404px;
    height: 642px;
    position: absolute;
    top: -160px;
    right: 40px;
    transition: all 0.2s ease;
}
.glass1 {
    background-image: url(../images/glass_1.png?v=20260210);
}
.glass2 {
    background-image: url(../images/glass_2.png?v=20260210);
}
/*.infoBlock.type1 .glass3 {background-image: url(../images/glass3.png?v2); width: 338px; top: -126px}
.infoBlock.type1 .glass4 {background-image: url(../images/glass4.png?v2); width: 222px; top: -127px}*/
.infoBlock.type1 .link * {color: #000b8c; font: italic 400 30px/30px Cent21, arial, helvetica, tahoma, verdana; text-decoration: none; border-bottom: 1px #000b8c dashed; cursor: pointer; position: relative; z-index: 2}
.infoBlock.type1 .link *:hover {border: none}
.infoBlock.type2 .center {height: 290px; padding-top: 110px}
.infoBlock.type2 .center:before {background-image: url(../images/bgSquares.png); height: 305px}
.infoBlock.type2 .text p {
    font-size: 19px;
}
.infoBlock.type2 .text p:last-child {
    margin: 0;
}
.box {
    background-size: 100% 100%;
    height: 406px;
    position: absolute;
}
.box4 {
    background-image: url(../images/box4.png);
    width: 268px;
    height: 346px;
    bottom: -10px;
    right: 160px;
}
.infoBlock.type2 .box1 {background-image: url(../images/box1.png); width: 415px; bottom: -110px; right: 60px}
.infoBlock.type2 .box2 {background-image: url(../images/box2.png); width: 310px; bottom: -110px; right: 90px}
.infoBlock.type2 .box3 {background-image: url(../images/box3.png); width: 340px; bottom: -50px; right: 90px}
.bottleX6 {max-width: 380px; width: 380px; margin: 0 auto 60px; user-select: none}
.bottleX6 img {width: 100%; height: auto}
.text p {color: #5887da; font-weight: 300; font-size: 21px}
.order {margin-bottom: 170px}
.order .subscription {text-align: center}
.order .subscription .field, .order .subscription .button {vertical-align: top; display: inline-block; margin: 0 9px}
.numList {margin: 60px 0}
.numList li {width: 184px; color: #5887da; font-weight: 300; font-size: 21px; vertical-align: top; position: relative; display: inline-block; margin: 0 20px}
.numList li:before {color: #000b8c; font: 700 50px/90px Cent21, arial, helvetica, tahoma, verdana; width: 50px; height: 50px; display: block; position: relative; z-index: 2; margin: 0 auto 40px; padding-right: 46px}
.numList li:nth-child(1):before {content: '01'}
.numList li:nth-child(2):before {content: '02'}
.numList li:nth-child(3):before {content: '03'}
.numList li:nth-child(4):before {content: '04'}
.numList li:nth-child(5):before {content: '05'}
.numList li:after {content: ''; background: #a9c7e7; width: 50px; height: 50px; border-radius: 50%; display: block; position: absolute; top: 0; left: 50%; margin-left: -25px}
.about {text-align: center}
.about .numList {margin-bottom: 150px}
.order {text-align: center}
.reviews {
    text-align: center;
    position: relative;
}
.review {
    width: 100%;
    min-height: 490px;
    overflow: hidden;
    position: relative;
    margin: 90px 0 150px;
}
.review__item {
/*    min-height: 490px;*/
    position: relative;
}
.review__authorImg {
    width: 300px;
    height: 300px;
    border-radius: 50%;
    position: absolute;
    left: 0;
}
.review__month {
    margin-bottom: 40px;
}
.review__month span {
    font-size: 70%;
}
.review__available {
    color: rgba(0, 11, 140, 0.6);
    font-size: 16px;
    line-height: 16px;
    white-space: nowrap;
    position: absolute;
    top: 52px;
    left: 50%;
    transform: translateX(-50%);
}
.review__authorCite,
.review__authorName,
.review__authorJob {
    color: #5887da;
    font: 400 40px/40px Cent21, arial, helvetica, tahoma, verdana;
    text-align: left;
    margin-left: 335px;
    padding-left: 83px;
}
.review__authorCite {
    position: relative;
    margin-bottom: 25px;
}
.review__authorCite:before {
    content: '';
    background-image: url(../images/quotes.png);
    background-size: 100% 100%;
    width: 63px;
    height: 50px;
    position: absolute;
    top: 3px;
    left: 0;
}
.review__authorCite-largeText {
    font-size: 32px;
    line-height: 32px;
}
.review__authorCite span {
    display: block;
}
.review__authorCite span:not(:last-child) {
    margin-bottom: 16px;
}
.review__authorName {
    font-style: italic;
    font-size: 30px;
    line-height: 30px;
    opacity: 0.7;
}
.review__authorJob {
    font-style: italic;
    font-size: 20px;
    line-height: 20px;
    display: block;
    margin-bottom: 10px;
    opacity: 0.7;
}
.review__why {
    font: 400 30px/36px Cent21, arial, helvetica, tahoma, verdana;
    text-align: left;
    margin: 0 0 20px 418px;
}
.review__whyLink {
    color: #5887da;
    text-decoration: none;
    border-bottom-width: 2px;
    border-bottom-style: solid;
    transition: all 0.2s ease;
}
.review__whyLink:hover {
    border-color: transparent;
}
.review__cost,
.review__outOfStock {
    color: #5887da;
    font: 600 50px Cent21, arial, helvetica, tahoma, verdana;
    text-align: left;
    margin: 32px 0 0 418px;
}
.review__rur {
    font-weight: 400;
    font-size: 34px;
}
.review__costOld {
    font-size: 60%;
    text-decoration: none;
    position: relative;
    margin-left: 20px;
    opacity: 0.6;
}
.review__costOld:before {
    content: '';
    background: #5887da;
    height: 2px;
    position: absolute;
    bottom: 14px;
    left: 0;
    right: 0;
}
.review__costOld .review__rur {
    font-size: 70%;
}
.review__outOfStock {
    font-weight: 400;
    font-size: 30px;
}
.compilation {
    text-align: left;
    display: flex;
    flex-wrap: wrap;
    margin: 30px 0 20px 418px;
}
.compilation__item {
    width: 90px;
    margin: 0 20px 8px 0;
}
.compilation__item:last-child {
    margin-right: 0;
}
.compilation__img {
    width: 84px;
    height: 84px;
    border: 2px rgba(83, 134, 217, 0.4) solid;
    padding: 1px;
    transition: all 0.2s ease;
}
.compilation__img:hover {
    border-color: rgb(83, 134, 217);
}
.reviews__controls {
    position: absolute;
    top: -5px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 2;
    user-select: none;
}
.reviews__arrows {
    width: 540px;
    display: flex;
    justify-content: space-between;
}
.reviews__arrow {
    background-size: 100% 100%;
    width: 56px;
    height: 56px;
    cursor: pointer;
    position: relative;
    display: block;
    transition: all 0.2s ease;
}
.reviews__arrow:hover {
    transform: scale(1.1);
}
.reviews__arrow-prev {
    background-image: url(/images/arrow_prev.svg);
}
.reviews__arrow-next {
    background-image: url(/images/arrow_next.svg);
}
#feedback {background: #fff}
#feedback .center {max-width: 800px; padding-top: 180px; padding-bottom: 100px}
#feedback h3 {text-align: center}
.popup {background: rgba(0, 0, 0, 0.8); width: 100%; height: 100%; display: none; position: fixed; top: 0; left: 0; z-index: 100}
.popup .closeArea {position: absolute; top: 0; bottom: 0; left: 0; right: 0}
.popup .closeIcon {width: 50px; height: 50px; cursor: pointer; position: absolute; top: 5px; right: 5px; transition: all 0.3s ease}
.popup .closeIcon:hover {opacity: 0.6}
.popup .closeIcon:before, .popup .closeIcon:after {content: ''; background: #000b8c; width: 2px; position: absolute; top: 0; bottom: 0}
.popup .closeIcon:before {left: 25px; transform: rotate(-45deg)}
.popup .closeIcon:after {right: 22px; transform: rotate(45deg)}
.popup .block {background: #fff; width: 700px; text-align: center; position: absolute; top: 50%; left: 50%; padding: 60px; transform: translate(-50%, -50%)}
.popup .visible {display: block}
.popup .hidden {display: none}
.popup .block .error {display: none}
.popup .result .visible {display: none}
.popup .result .hidden {display: block}
.popup .block.error .error {display: block}
.popup .block.error .visible {display: none}
.popup .block.error .hidden {display: none}
.popup h3 {margin-bottom: 40px}
.popup p {color: #5887da; font-weight: 300; font-size: 21px}
.popup input {text-align: center}
.popup .field {width: 350px; margin-bottom: 10px}
.popup .button {width: 350px}
.popup .crown {background: url(../images/crown.png); background-size: 100% 100%; width: 38px; height: 31px; margin: 0 auto}
.popupLogin .field {width: 45%; display: inline-block; margin: 0 9px 20px}
.popupLogin .links, .popupLogin .inputCustom {width: 45%; text-align: left; vertical-align: top; display: inline-block; margin: 10px 9px 50px}
.popupLogin .links li {margin-bottom: 7px}
.popupLogin .links li * {color: #5386d9; font-weight: 300; font-size: 21px; text-decoration: underline; cursor: pointer}
.popupLogin .links li *:hover {text-decoration: none}
.popupLogin .inputCustom li {margin-bottom: 7px}
.popupLoginConfirm {display: block}
.popupLoginConfirm .ageRating {background: #0e1d61; width: 90px; height: 90px; color: #fff; font: 700 36px/94px Cent21, arial, helvetica, tahoma, verdana; border-radius: 50%; margin: 0 auto 40px}
.popupLoginConfirm p {margin-bottom: 25px}
.popupLoginConfirm p:first-of-type {color: #0e1d61}
.popupLoginConfirm .button, .popupCallback .button {margin-top: 30px}
.popupOrder h3 {margin-bottom: 20px}
.popupOrder h3 + p {margin-bottom: 40px}
.popupOrder .block {height: 660px; overflow-y: scroll}
.popupOrder .subscription p {margin-top: 20px}
.popupOrder .field:nth-child(6) input::placeholder {font-size: 22px}
.popupPassForgot p {margin: -20px 0 45px}
.popupPassForgot .error p {margin: 0}
.passwordResetOk h3 {margin: 0}
.popupWindow .pic {width: 100px; height: 100px; overflow: hidden; margin: 0 auto 30px}
.popupWindow .pic img {width: 100px; height: 100px; border-radius: 50%; margin: 0 auto}
.popupWindow .arrow + .pic img {border-radius: 0}
.popupWindow .arrow {position: absolute; top: 110px}
.popupWindow .arrow.prev {left: 100px}
.popupWindow .arrow.next {right: 100px}
.popupWindow h3 {margin-bottom: 20px}
.popupWindow p {margin-bottom: 25px}
.popupWindow p:last-of-type {margin: 0}
.popupWindow p span {color: #000b8c; display: block}
.popupWindow .values {width: 230px; margin: 50px auto 0}
.popupWindow .values .col {width: 115px; color: #000b8c; font-weight: 300; font-size: 21px; float: left}
.popupWindow .values .col:nth-child(1), .popup.popupWindow .values .col:nth-child(2) {font-weight: 600}
.preheader {
/*    background: #7da6e6;*/
    background: #000b8c;
    color: #fff;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    padding: 20px 0 21px;
}
.preheader p {
    margin-bottom: 0;
}
.preheader .center {
    display: flex;
    flex-direction: column;
    align-items: center;
}
.preheader__h5 {
    font-size: 18px;
    line-height: 24px;
    margin-bottom: 20px;
}
.preheader__h6 {
    margin-bottom: 10px;
}
.preheader__blocks {
    display: flex;
    margin: 0 -20px;
    transition: all 0.2s ease;
}
.preheader__block {
/*    width: calc(33.33% - 40px);*/
    text-align: left;
    margin: 0 20px;
    transition: all 0.2s ease;
}
.preheader__block p {
    margin-bottom: 0;
}
.preheader2 {
    font-size: 16px;
    line-height: 20px;
}
.preheader2 .center {
    display: block;
    flex-direction: inherit;
    align-items: inherit;
}
.preheader__phone {
    white-space: nowrap;
}

/* Animation */
.sticky {
    opacity: 0;
    animation: sticky 0.2s ease forwards;
}
@keyframes sticky {
    0% {
        opacity: 0;
    }
    100% {
        opacity: 1;
    }
}
/*.reviews__arrow {
    animation: arrow 0.8s ease infinite;
}
@keyframes arrow {
    0%, 100% {
        margin: 0 9px;
    }
    50% {
        margin: 0 15px;
    }
}
.reviews__controls:hover .reviews__arrow {
    animation: none;
}*/

/* Adaptation */
@media screen and (max-width: 812px) {
    html, body {min-width: inherit}
    input, textarea {text-align: center; padding-left: 10px; padding-right: 10px}
    header {height: 130px}
    header .logo {top: 21px; left: 50%; margin-left: -80px}
    header .logo * {background-image: url(../images/logoHeaderMob.png); width: 160px; height: 32px}
    header .menuIcon {display: block}
    header .menu {display: none}
    header .login {top: 27px; left: auto; right: 20px}
    header .login .list {display: none}
    header .login .userPic {float: none; margin: 0}
    header.active {background: #a9c7e7; height: auto; position: fixed; top: 0; bottom: 0; left: 0; right: 0}
    header.active .center {position: fixed; top: 0; bottom: 0; left: 0; right: 0}
    header.active .menuIcon {background: none}
    header.active .menuIcon:before, header.active .menuIcon:after, header.active .menuIcon i {display: none}
    header.active .menuIcon span {color: #fff; font-size: 41px; line-height: 41px; text-align: center; display: block; position: absolute; top: -6px; bottom: 0; left: 0; right: 0}
    header.active .logo * {background-image: url(../images/logoHeaderMobActive.png)}
    header.active .menu {display: block; top: 120px; left: 0; right: 0}
    header.active .menu li {text-align: center; float: none; margin: 0 0 25px}
    header.active .menu li * {font-size: 20px; line-height: 20px}
    header.active .login .userPic {background-image: url(../images/userPicSticky.png); background-size: 200% 100%; margin: 0 auto 5px; opacity: 1}
    header.active .login .list {float: none; display: block}
    header.active .login br {display: block}
    header.active .login li {color: #fff; line-height: 16px; text-align: center; float: none; margin: 0 0 15px}
    header.active .login li:last-child {margin: 0}
    header.active .login li * {color: #fff; border-color: #fff; border-width: 1px}
    .footer .center {
        padding-top: 44px;
        padding-bottom: 0;
    }
    .footer__phone {
        margin-bottom: 20px;
    }
    .footer__email {
        margin-bottom: 20px;
    }
    .footer__logo {
        display: none;
    }
    .footer__soc {
        position: static;
        bottom: auto;
        left: auto;
    }
    .footer__ageRating {
        bottom: 25px;
    }
    .footer__row-bottom {
        display: block;
    }
    .footer__charge {
        max-width: inherit;
        text-align: left;
        padding: 17px 0 20px 0;
    }
    .footer__charge br {
        display: none;
    }
    .inputCustom label:hover:before {background: #fff}
    .center {width: auto}
    .field {width: auto}
    .button {width: auto}
    .text p {font-size: 14px}
    .infoBlock .center {height: 315px; padding-top: 0}
    .infoBlock .center:before {width: auto; height: auto; position: absolute; top: auto; bottom: -25px; left: 0; right: 0}
    .infoBlock .center:after {display: block; left: 50%; right: auto}
    .infoBlock h3 {max-width: inherit; margin-bottom: 10px}
    .infoBlock .text {width: auto; text-align: center; float: none}
    .infoBlock.type1 {margin-bottom: 112px}
    .infoBlock.type1 .center:before {margin-left: -100px}
    .glass {
        width: 164px;
        height: 260px;
        top: -64px;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }
/*    .infoBlock.type1 .glass3 {width: 131px; top: -48px}
    .infoBlock.type1 .glass4 {width: 86px; top: -53px}*/
    .infoBlock.type1 .text {padding: 142px 0 0}
    .infoBlock.type1 h3 {font-size: 48px; line-height: 58px}
    .infoBlock.type1 .link * {font-size: 15px; line-height: 15px}
    .infoBlock.type2 .center {
        height: auto;
    }
    .infoBlock.type2 .center:before {margin-left: -66px}
    .infoBlock.type2 .center:after {width: 130px; height: 127px; top: -39px; margin-left: -65px}
    .infoBlock.type2 .text {padding: 100px 0 0}
    .infoBlock.type2 .text p {font-size: 18px; line-height: 24px}
    .infoBlock.type2 .text br {display: none}
    .box {
        top: -83px;
        bottom: auto;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
    }
    .box4 {
        width: 222px;
        height: 286px;
    }
    .infoBlock.type2 .box1 {width: 256px; height: 250px}
    .infoBlock.type2 .box2 {width: 191px; height: 250px}
    .infoBlock.type2 .box3 {width: 280px; height: 338px; top: -160px}
    .order .subscription .field, .order .subscription .button {display: block; margin: 0 auto}
    .order .subscription .field {margin-bottom: 10px}
    .bottleX6 {width: 100%}
    .numList li {width: auto; font-size: 18px; display: block; margin: 0 0 40px}
    .numList li:before {margin-bottom: 30px}
    .review {
        min-height: inherit;
        margin-top: 50px;
        padding: 0;
    }
    .review__authorImg {
        width: 156px;
        height: 156px;
        position: static;
        top: auto;
        left: auto;
        margin: 0 auto 25px;
    }
    .review__month {
        font-size: 38px;
        line-height: 46px;
    }
    .review__available {
        font-size: 12px;
        top: 42px;
    }
    .review__authorCite,
    .review__authorName,
    .review__authorJob {
        font-size: 30px;
        line-height: 30px;
        margin: 0;
        padding: 0;
    }
    .review__authorCite {
        font-size: 26px;
        line-height: 26px;
        margin-bottom: 10px;
    }
    .review__authorCite:before {
        width: 38px;
        height: 30px;
        float: right;
        display: block;
        position: static;
        top: auto;
        left: auto;
        margin: -30px auto 5px;
    }
    .review__authorCite span:not(:last-child) {
        margin-bottom: 8px;
    }
    .review__authorName {
        font-size: 21px;
        line-height: 21px;
        margin-bottom: 5px;
    }
    .review__authorJob {
        font-size: 16px;
        line-height: 16px;
        margin-bottom: 30px;
    }
    .review__why {
        font-size: 18px;
        line-height: 18px;
        margin-left: 0;
    }
    .review__cost,
    .review__outOfStock {
        font-size: 40px;
        line-height: 40px;
        margin: 0;
    }
    .review__rur,
    .review__outOfStock {
        font-size: 24px;
    }
    .compilation {
        margin: 30px 0;
    }
    .compilation__item {
        margin-right: 0 !important;
    }
    .compilation__img {
        width: 60px;
        height: 60px;
    }
    .reviews__controls {
        top: 6px;
    }
    .reviews__arrows {
        width: 440px;
    }
    .reviews__arrow {
        width: 40px;
        height: 40px;
    }
	#feedback .center {padding-top: 120px; padding-bottom: 50px}
	#feedback h3 {margin: 0}
    .popup {background: rgba(0, 0, 0, 0.6); width: auto; height: auto; top: 0; bottom: 0; left: 0; right: 0; padding: 20px}
    .popup .closeIcon {width: 30px; height: 30px}
    .popup .closeIcon:before {left: 15px}
    .popup .closeIcon:after {right: 13px}
    .popup .block {background: rgba(255, 255, 255, 0.95); width: auto; height: auto; position: absolute; top: 10px; bottom: 10px; left: 10px; right: 10px; transform: none}
    .popup .inner {overflow: scroll; position: absolute; top: 40px; bottom: 10px; left: 0; right: 0; padding: 0 15px 20px}
    .popup .field {width: auto}
    .popup .button {width: auto}
    .popup .button * {font-size: 28px}
    .popup h3 {font-size: 38px; line-height: 40px}
    .popupLoginConfirm .inner {top: 10px}
    .preheader {font-size: 11px; line-height: 15px}
    .preheader2 {font-size: 13px; line-height: 17px}
    .preheader__blocks {flex-wrap: wrap}
/*    .preheader__block {width: calc(50% - 40px)}*/
    .preheader__block:nth-child(1),
    .preheader__block:nth-child(2) {margin-bottom: 20px}
}
@media screen and (max-width: 812px) and (orientation: portrait) {
    header.active .login {top: auto; bottom: 20px; left: 50%; right: auto; transform: translateX(-50%)}
    .popupLogin .field {width: auto; display: block; margin: 0 0 10px}
    .popupLogin .links, .popupLogin .inputCustom {width: auto; display: block}
    .popupLogin .links {text-align: center; margin-bottom: 40px}
    .popupLogin .inputCustom {margin: 20px 0}
    .popupLogin .links li, .popupLogin .inputCustom li {margin-bottom: 20px}
}

@media screen and (max-width: 812px) and (max-height: 375px) {
    header.active .menu {top: 110px}
    header.active .menu li {margin-bottom: 20px}
}
@media screen and (max-width: 812px) and (max-height: 360px) {
    header.active .menu {top: 100px}
}
@media screen and (max-width: 812px) and (max-height: 320px) {
    header.active .menu {top: 90px}
    header.active .menu li {margin-bottom: 15px}
}
@media screen and (max-width: 320px) and (max-height: 480px), screen and (max-width: 320px) and (max-height: 568px), screen and (max-width: 480px) and (max-height: 320px), screen and (max-width: 568px) and (max-height: 320px) {
    .inputCustom label:before {top: 1px}
    .inputCustom input:checked + label:after {top: 6px}
    .popupLogin .links li *, .popupLogin .inputCustom label {font-size: 18px}
}
@media screen and (max-width: 320px) and (max-height: 480px) {
    header.active .login {bottom: 10px}
    header.active .login li {margin-bottom: 10px}
}
@media screen and (max-width: 650px) {
    .infoBlock.type2 .text {
        text-align: left;
        padding: 16px 0 0;
    }
    .infoBlock.type2 .text p {font-size: 20px}
    .box {height: 200px; top: -66px}
    .box4 {
        width: 186px !important;
        height: 240px !important;
        top: -120px !important;
    }
    .infoBlock.type2 .box1 {width: 205px}
    .infoBlock.type2 .box2 {width: 153px}
    .infoBlock.type2 .box3 {width: 220px; height: 265px; top: -116px}
}
@media screen and (max-width: 600px) {
    .preheader__block {
        width: calc(50% - 40px);
    }
    .preheader__block:last-child {
        width: 100%;
        text-align: center;
    }
    .preheader__block:last-child br {
        display: none;
    }
}
@media screen and (max-width: 570px) {
    .infoBlock.type2 .text p {font-size: 18px}
}
@media screen and (max-width: 530px) {
    .infoBlock.type2 .text p {font-size: 16px}
}
@media screen and (max-width: 480px) {
    .reviews__controls {
        width: calc(100% - 40px);
    }
    .reviews__arrows {
        width: 100%;
    }
}
@media screen and (max-width: 470px) {
    .infoBlock.type2 .text p {line-height: 20px}
}
@media screen and (max-width: 440px) {
    .reviews__controls {
        top: 146px;
    }
}
@media screen and (max-width: 390px) {
    h3 {font-size: 38px; line-height: 46px}
/*    .reviews__controls {top: 55px}*/
}
@media screen and (max-width: 376px) {
    .popup .button * {font-size: 26px}
    .popupOrder .field:nth-child(6) input::placeholder {font-size: 20px}
}
@media screen and (max-width: 374px) {
    .infoBlock.type2 .box {height: 180px; top: -59px}
    .infoBlock.type2 .box1 {width: 184px}
    .infoBlock.type2 .box2 {width: 138px}
    .infoBlock.type2 .box3 {width: 200px; height: 241px; top: -90px}
}
@media screen and (max-width: 360px) {
    .popup .button * {font-size: 24px}
    .popupLoginConfirm p {font-size: 20px}
    .popupPassForgot h3 {font-size: 34px; line-height: 36px}
    .preheader__h5 {font-size: 16px; line-height: 22px}
    .reviews__controls {
        top: 136px;
    }
    .review__available {
        top: 36px;
    }
    .review__month {
        font-size: 30px;
        line-height: 36px;
    }
}
@media screen and (max-width: 355px) {
    .popupOrder input::placeholder, .popupOrder textarea::placeholder {font-size: 17px !important}
}
@media screen and (max-width: 335px) {
    .center {
        padding: 0 10px;
    }
    .popup .button * {font-size: 21px}
    .popupLoginConfirm .ageRating {margin-bottom: 25px}
    .popupLoginConfirm p {font-size: 17px}
    .popupPassForgot h3 {font-size: 28px; line-height: 30px}
}