/* Start:/local/templates/rozbl22/assets/css/bundle.css?1751622479296580*/ @font-face { font-family: swiper-icons; src: url("data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA") format("woff"); font-weight: 400; font-style: normal; font-display: swap; } :root { --swiper-theme-color: #007aff } .swiper-container { margin-left: auto; margin-right: auto; position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1 } .swiper-container-vertical>.swiper-wrapper { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .swiper-wrapper { position: relative; width: 100%; height: 100%; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform; -webkit-box-sizing: content-box; box-sizing: content-box } .swiper-container-android .swiper-slide, .swiper-wrapper { -webkit-transform: translateZ(0); transform: translateZ(0) } .swiper-container-multirow>.swiper-wrapper { -ms-flex-wrap: wrap; flex-wrap: wrap } .swiper-container-multirow-column>.swiper-wrapper { -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .swiper-container-free-mode>.swiper-wrapper { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out; margin: 0 auto } .swiper-container-pointer-events { -ms-touch-action: pan-y; touch-action: pan-y } .swiper-container-pointer-events.swiper-container-vertical { -ms-touch-action: pan-x; touch-action: pan-x } .swiper-slide { -ms-flex-negative: 0; flex-shrink: 0; width: 100%; height: 100%; position: relative; -webkit-transition-property: -webkit-transform; transition-property: -webkit-transform; transition-property: transform; transition-property: transform, -webkit-transform } .swiper-slide-invisible-blank { visibility: hidden } .swiper-container-autoheight, .swiper-container-autoheight .swiper-slide { height: auto } .swiper-container-autoheight .swiper-wrapper { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-transition-property: height, -webkit-transform; transition-property: height, -webkit-transform; transition-property: transform, height; transition-property: transform, height, -webkit-transform } .swiper-container-3d { -webkit-perspective: 1200px; perspective: 1200px } .swiper-container-3d .swiper-cube-shadow, .swiper-container-3d .swiper-slide, .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top, .swiper-container-3d .swiper-wrapper { -webkit-transform-style: preserve-3d; transform-style: preserve-3d } .swiper-container-3d .swiper-slide-shadow-bottom, .swiper-container-3d .swiper-slide-shadow-left, .swiper-container-3d .swiper-slide-shadow-right, .swiper-container-3d .swiper-slide-shadow-top { position: absolute; left: 0; top: 0; width: 100%; height: 100%; pointer-events: none; z-index: 10 } .swiper-container-3d .swiper-slide-shadow-left { background-image: -webkit-gradient(linear, right top, left top, from(rgba(0, 0, 0, .5)), to(transparent)); background-image: linear-gradient(270deg, rgba(0, 0, 0, .5), transparent) } .swiper-container-3d .swiper-slide-shadow-right { background-image: -webkit-gradient(linear, left top, right top, from(rgba(0, 0, 0, .5)), to(transparent)); background-image: linear-gradient(90deg, rgba(0, 0, 0, .5), transparent) } .swiper-container-3d .swiper-slide-shadow-top { background-image: -webkit-gradient(linear, left bottom, left top, from(rgba(0, 0, 0, .5)), to(transparent)); background-image: linear-gradient(0deg, rgba(0, 0, 0, .5), transparent) } .swiper-container-3d .swiper-slide-shadow-bottom { background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, .5)), to(transparent)); background-image: linear-gradient(180deg, rgba(0, 0, 0, .5), transparent) } .swiper-container-css-mode>.swiper-wrapper { overflow: auto; scrollbar-width: none; -ms-overflow-style: none } .swiper-container-css-mode>.swiper-wrapper::-webkit-scrollbar { display: none } .swiper-container-css-mode>.swiper-wrapper>.swiper-slide { scroll-snap-align: start start } .swiper-container-horizontal.swiper-container-css-mode>.swiper-wrapper { -ms-scroll-snap-type: x mandatory; scroll-snap-type: x mandatory } .swiper-container-vertical.swiper-container-css-mode>.swiper-wrapper { -ms-scroll-snap-type: y mandatory; scroll-snap-type: y mandatory } :root { --swiper-navigation-size: 44px } .swiper-button-next, .swiper-button-prev { position: absolute; top: 50%; width: calc(var(--swiper-navigation-size)/44*27); height: var(--swiper-navigation-size); margin-top: calc(0px - var(--swiper-navigation-size)/2); z-index: 10; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; color: var(--swiper-navigation-color, var(--swiper-theme-color)) } .swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled { opacity: .35; cursor: auto; pointer-events: none } .swiper-button-next:after, .swiper-button-prev:after { font-family: swiper-icons; font-size: var(--swiper-navigation-size); text-transform: none !important; letter-spacing: 0; text-transform: none; font-variant: normal; line-height: 1 } .swiper-button-prev, .swiper-container-rtl .swiper-button-next { left: 10px; right: auto } .swiper-button-prev:after, .swiper-container-rtl .swiper-button-next:after { content: "prev" } .swiper-button-next, .swiper-container-rtl .swiper-button-prev { right: 10px; left: auto } .swiper-button-next:after, .swiper-container-rtl .swiper-button-prev:after { content: "next" } .swiper-button-next.swiper-button-white, .swiper-button-prev.swiper-button-white { --swiper-navigation-color: #fff } .swiper-button-next.swiper-button-black, .swiper-button-prev.swiper-button-black { --swiper-navigation-color: #000 } .swiper-button-lock { display: none } .swiper-pagination { position: absolute; text-align: center; -webkit-transition: opacity .3s; transition: opacity .3s; -webkit-transform: translateZ(0); transform: translateZ(0); z-index: 10 } .swiper-pagination.swiper-pagination-hidden { opacity: 0 } .swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction { bottom: 10px; left: 0; width: 100% } .swiper-pagination-bullets-dynamic { overflow: hidden; font-size: 0 } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transform: scale(.33); transform: scale(.33); position: relative } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active, .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main { -webkit-transform: scale(1); transform: scale(1) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev { -webkit-transform: scale(.66); transform: scale(.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev { -webkit-transform: scale(.33); transform: scale(.33) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next { -webkit-transform: scale(.66); transform: scale(.66) } .swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next { -webkit-transform: scale(.33); transform: scale(.33) } .swiper-pagination-bullet { width: 8px; height: 8px; display: inline-block; border-radius: 50%; background: #000; opacity: .2 } button.swiper-pagination-bullet { border: none; margin: 0; padding: 0; -webkit-box-shadow: none; box-shadow: none; -webkit-appearance: none; -moz-appearance: none; appearance: none } .swiper-pagination-clickable .swiper-pagination-bullet { cursor: pointer } .swiper-pagination-bullet-active { opacity: 1; background: var(--swiper-pagination-color, var(--swiper-theme-color)) } .swiper-container-vertical>.swiper-pagination-bullets { right: 10px; top: 50%; -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0) } .swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 6px 0; display: block } .swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { top: 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%); width: 8px } .swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { display: inline-block; -webkit-transition: top .2s, -webkit-transform .2s; transition: top .2s, -webkit-transform .2s; transition: transform .2s, top .2s; transition: transform .2s, top .2s, -webkit-transform .2s } .swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 4px } .swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic { left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); white-space: nowrap } .swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: left .2s, -webkit-transform .2s; transition: left .2s, -webkit-transform .2s; transition: transform .2s, left .2s; transition: transform .2s, left .2s, -webkit-transform .2s } .swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet { -webkit-transition: right .2s, -webkit-transform .2s; transition: right .2s, -webkit-transform .2s; transition: transform .2s, right .2s; transition: transform .2s, right .2s, -webkit-transform .2s } .swiper-pagination-progressbar { background: rgba(0, 0, 0, .25); position: absolute } .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { background: var(--swiper-pagination-color, var(--swiper-theme-color)); position: absolute; left: 0; top: 0; width: 100%; height: 100%; -webkit-transform: scale(0); transform: scale(0); -webkit-transform-origin: left top; transform-origin: left top } .swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill { -webkit-transform-origin: right top; transform-origin: right top } .swiper-container-horizontal>.swiper-pagination-progressbar, .swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite { width: 100%; height: 4px; left: 0; top: 0 } .swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite, .swiper-container-vertical>.swiper-pagination-progressbar { width: 4px; height: 100%; left: 0; top: 0 } .swiper-pagination-white { --swiper-pagination-color: #fff } .swiper-pagination-black { --swiper-pagination-color: #000 } .swiper-pagination-lock { display: none } .swiper-scrollbar { border-radius: 10px; position: relative; -ms-touch-action: none; background: rgba(0, 0, 0, .1) } .swiper-container-horizontal>.swiper-scrollbar { position: absolute; left: 1%; bottom: 3px; z-index: 50; height: 5px; width: 98% } .swiper-container-vertical>.swiper-scrollbar { position: absolute; right: 3px; top: 1%; z-index: 50; width: 5px; height: 98% } .swiper-scrollbar-drag { height: 100%; width: 100%; position: relative; background: rgba(0, 0, 0, .5); border-radius: 10px; left: 0; top: 0 } .swiper-scrollbar-cursor-drag { cursor: move } .swiper-scrollbar-lock { display: none } .swiper-zoom-container { width: 100%; height: 100%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; text-align: center } .swiper-zoom-container>canvas, .swiper-zoom-container>img, .swiper-zoom-container>svg { max-width: 100%; max-height: 100%; -o-object-fit: contain; object-fit: contain } .swiper-slide-zoomed { cursor: move } .swiper-lazy-preloader { width: 42px; height: 42px; position: absolute; left: 50%; top: 50%; margin-left: -21px; margin-top: -21px; z-index: 10; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-animation: swiper-preloader-spin 1s linear infinite; animation: swiper-preloader-spin 1s linear infinite; -webkit-box-sizing: border-box; box-sizing: border-box; border-radius: 50%; border: 4px solid var(--swiper-preloader-color, var(--swiper-theme-color)); border-top: 4px solid transparent } .swiper-lazy-preloader-white { --swiper-preloader-color: #fff } .swiper-lazy-preloader-black { --swiper-preloader-color: #000 } @-webkit-keyframes swiper-preloader-spin { to { -webkit-transform: rotate(1turn); transform: rotate(1turn) } } @keyframes swiper-preloader-spin { to { -webkit-transform: rotate(1turn); transform: rotate(1turn) } } .swiper-container .swiper-notification { position: absolute; left: 0; top: 0; pointer-events: none; opacity: 0; z-index: -1000 } .swiper-container-fade.swiper-container-free-mode .swiper-slide { -webkit-transition-timing-function: ease-out; transition-timing-function: ease-out } .swiper-container-fade .swiper-slide { pointer-events: none; -webkit-transition-property: opacity; transition-property: opacity } .swiper-container-fade .swiper-slide .swiper-slide { pointer-events: none } .swiper-container-fade .swiper-slide-active, .swiper-container-fade .swiper-slide-active .swiper-slide-active { pointer-events: auto } .swiper-container-cube { overflow: visible } .swiper-container-cube .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1; visibility: hidden; -webkit-transform-origin: 0 0; transform-origin: 0 0; width: 100%; height: 100% } .swiper-container-cube .swiper-slide .swiper-slide { pointer-events: none } .swiper-container-cube.swiper-container-rtl .swiper-slide { -webkit-transform-origin: 100% 0; transform-origin: 100% 0 } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-active .swiper-slide-active { pointer-events: auto } .swiper-container-cube .swiper-slide-active, .swiper-container-cube .swiper-slide-next, .swiper-container-cube .swiper-slide-next+.swiper-slide, .swiper-container-cube .swiper-slide-prev { pointer-events: auto; visibility: visible } .swiper-container-cube .swiper-slide-shadow-bottom, .swiper-container-cube .swiper-slide-shadow-left, .swiper-container-cube .swiper-slide-shadow-right, .swiper-container-cube .swiper-slide-shadow-top { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden } .swiper-container-cube .swiper-cube-shadow { position: absolute; left: 0; bottom: 0; width: 100%; height: 100%; opacity: .6; z-index: 0 } .swiper-container-cube .swiper-cube-shadow:before { content: ""; background: #000; position: absolute; left: 0; top: 0; bottom: 0; right: 0; -webkit-filter: blur(50px); filter: blur(50px) } .swiper-container-flip { overflow: visible } .swiper-container-flip .swiper-slide { pointer-events: none; -webkit-backface-visibility: hidden; backface-visibility: hidden; z-index: 1 } .swiper-container-flip .swiper-slide .swiper-slide { pointer-events: none } .swiper-container-flip .swiper-slide-active, .swiper-container-flip .swiper-slide-active .swiper-slide-active { pointer-events: auto } .swiper-container-flip .swiper-slide-shadow-bottom, .swiper-container-flip .swiper-slide-shadow-left, .swiper-container-flip .swiper-slide-shadow-right, .swiper-container-flip .swiper-slide-shadow-top { z-index: 0; -webkit-backface-visibility: hidden; backface-visibility: hidden } .datepicker { display: inline-block; -webkit-tap-highlight-color: rgba(0, 0, 0, 0) } .datepicker table { width: 100%; border-collapse: collapse; border-spacing: 0; border: 0 } .datepicker table td, .datepicker table th { width: 14.28571%; padding: 0 } .datepicker table th { color: #90caf9; text-transform: uppercase; font-size: .5rem; line-height: 4; font-weight: 700; text-align: center } .datepicker__wrapper { color: #333; border-radius: .125rem; font-family: Helvetica Neue, Helvetica, Arial, sans-serif; padding: .5rem; position: relative; z-index: 1; background: #fff; border: 1px solid #2196f3; width: 16rem } .datepicker__wrapper:after { content: ""; display: table; clear: both } .datepicker:not(.is-inline) .datepicker__wrapper { -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .2); box-shadow: 0 1px 3px rgba(0, 0, 0, .1), 0 1px 2px rgba(0, 0, 0, .2); margin: .25rem 0 } .datepicker__header { position: relative; text-align: center; background: #2196f3; padding: .25rem; margin: -.5rem -.5rem 0 } .datepicker__title { display: inline-block; padding: .25rem; font-size: .875rem; line-height: 1.5rem; font-weight: 700; color: #fff } .datepicker__next, .datepicker__prev { display: block; cursor: pointer; position: relative; outline: none; width: 2rem; height: 2rem; border-radius: 50%; background: no-repeat 50%/60%; font-size: 0 } .datepicker__next:hover, .datepicker__prev:hover { background-color: #1e88e5 } .datepicker__prev { float: left; background-image: url('data:image/svg+xml;charset=utf-8,') } .datepicker__next { float: right; background-image: url('data:image/svg+xml;charset=utf-8,') } .datepicker__next.is-disabled, .datepicker__prev.is-disabled { pointer-events: none; cursor: default; opacity: .4 } .datepicker__time { padding: .5rem 1rem; margin: 0 -.5rem; font-size: .75rem; text-align: right; background: #e3f2fd; border-bottom: 1px solid #bbdefb } .datepicker__label { margin-right: 1rem; color: rgba(0, 0, 0, .4); float: left } .datepicker__field { display: inline-block; margin: 0 .125rem; color: #333; width: 2ch } .datepicker__field span { display: block; width: 100% } .datepicker__day { color: #333 } .datepicker__day div { cursor: pointer; display: block; -webkit-box-sizing: border-box; box-sizing: border-box; border: 0; margin: 0; background: transparent; position: relative; border-radius: 50% } .datepicker__day div:after { content: ""; display: block; border-radius: 50%; padding-top: 100%; position: relative; background: inherit; z-index: 1 } .datepicker__day.is-highlighted div, .datepicker__day div:hover { background: #e3f2fd } .datepicker__day.is-today { color: #2196f3 } .datepicker__day.is-today div:after { -webkit-box-shadow: inset 0 0 0 1px currentColor; box-shadow: inset 0 0 0 1px currentColor } .datepicker__day.is-today.is-disabled.is-selected div:after, .datepicker__day.is-today.is-otherMonth.is-selected div:after { -webkit-box-shadow: none; box-shadow: none } .datepicker__day.is-selected div { background: #2196f3 } .datepicker__day.is-selected:hover div:after { background: #1e88e5 } .datepicker__day.is-selected .datepicker__daynum { font-weight: 700; color: #fff } .datepicker__day.is-highlighted+.is-highlighted div:before, .datepicker__day.is-selected+.is-selected div:before { content: ""; position: absolute; top: 0; left: -50%; width: 100%; height: 100%; background: inherit; z-index: 0 } .datepicker__day.is-disabled, .datepicker__day.is-otherMonth { cursor: default; pointer-events: none; color: #bbdefb } .datepicker__day.is-disabled.is-selected .datepicker__daynum, .datepicker__day.is-otherMonth.is-selected .datepicker__daynum { color: rgba(0, 0, 0, .2) } .datepicker__day.is-disabled.is-selected+.is-selected div:before, .datepicker__day.is-disabled.is-selected div, .datepicker__day.is-otherMonth.is-selected+.is-selected div:before, .datepicker__day.is-otherMonth.is-selected div { background: #e3f2fd } .datepicker__daynum { position: absolute; top: 50%; left: 0; width: 100%; font-size: .75rem; line-height: 1rem; margin-top: -.5rem; text-align: center; z-index: 2 } a, abbr, acronym, address, applet, article, aside, audio, b, big, blockquote, body, canvas, caption, center, cite, code, dd, del, details, dfn, div, dl, dt, em, embed, fieldset, figcaption, figure, footer, form, h1, h2, h3, h4, h5, h6, header, hgroup, html, i, iframe, img, ins, kbd, label, legend, li, mark, menu, nav, object, ol, output, p, pre, q, ruby, s, samp, section, small, span, strike, strong, sub, summary, sup, table, tbody, td, tfoot, th, thead, time, tr, tt, u, ul, var, video { padding: 0; margin: 0; font: inherit; font-size: 100%; vertical-align: baseline; border: 0 } article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block } body { line-height: 1 } ol, ul { list-style: none } blockquote, q { quotes: none } blockquote:after, blockquote:before, q:after, q:before { content: ""; content: none } table { border-spacing: 0; border-collapse: collapse } @font-face { font-family: NunitoSans; font-style: normal; font-weight: 200; src: local("NunitoSans-ExtraLight"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-ExtraLight.woff2) format("woff2"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-ExtraLight.woff) format("woff"); font-display: swap } @font-face { font-family: NunitoSans; font-style: normal; font-weight: 300; src: local("NunitoSans-Light"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Light.woff2) format("woff2"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Light.woff) format("woff"); font-display: swap } @font-face { font-family: NunitoSans; font-style: normal; font-weight: 400; src: local("NunitoSans-Regular"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Regular.woff2) format("woff2"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Regular.woff) format("woff"); font-display: swap } @font-face { font-family: NunitoSans; font-style: normal; font-weight: 600; src: local("NunitoSans-SemiBold"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-SemiBold.woff2) format("woff2"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-SemiBold.woff) format("woff"); font-display: swap } @font-face { font-family: NunitoSans; font-style: normal; font-weight: 700; src: local("NunitoSans-Bold"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Bold.woff2) format("woff2"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Bold.woff) format("woff"); font-display: swap } @font-face { font-family: NunitoSans; font-style: normal; font-weight: 800; src: local("NunitoSans-ExtraBold"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-ExtraBold.woff2) format("woff2"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-ExtraBold.woff) format("woff"); font-display: swap } @font-face { font-family: NunitoSans; font-style: normal; font-weight: 900; src: local("NunitoSans-Black"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Black.woff2) format("woff2"), url(/local/templates/rozbl22/assets/css/../fonts/NunitoSans-Black.woff) format("woff"); font-display: swap } html { color: var(--color-main); background-color: var(--bg-color-main) } picture { display: block } picture img { width: 100% } img { max-width: 100%; height: auto } img, svg { display: block } svg { width: 1em; height: 1em; fill: currentColor } [data-tab-content]:not(.active) { display: none } html { font-family: NunitoSans, Arial; font-size: 16px; line-height: 1.3 } @media(max-width:1200px) { html { font-size: 15px } } @media(max-width:1100px) { html { font-size: 14px } } .h1, h1 { margin: 0 0 1.75rem; font-family: NunitoSans, Arial; font-size: 1.875rem; font-weight: 700; line-height: 1.3; color: currentColor } @media(max-width:900px) { .h1, h1 { font-size: 1.875rem } } .h2, h2 { margin: 0 0 1.5rem; font-family: NunitoSans, Arial; font-size: 2.5rem; font-weight: 700; line-height: 1.5; color: currentColor } @media(max-width:900px) { .h2, h2 { font-size: 24px } } .h3, h3 { margin: 0 0 1.25rem; font-family: NunitoSans, Arial; font-size: 1.5rem; font-weight: 800; line-height: 1.5; color: currentColor } @media(max-width:900px) { .h3, h3 { font-size: 1.5rem } } .h4, h4 { margin: 0 0 1rem; font-family: NunitoSans, Arial; font-size: 1.25rem; font-weight: 700; line-height: 1.3; color: currentColor } @media(max-width:900px) { .h4, h4 { font-size: 1.25rem } } .h5, h5 { margin: 0 0 .75rem; font-family: NunitoSans, Arial; font-size: 1.125rem; font-weight: 700; line-height: 1.3; color: currentColor } @media(max-width:900px) { .h5, h5 { font-size: 1.125rem } } .h6, h6 { margin: 0 0 .5rem; font-family: NunitoSans, Arial; font-size: 1rem; font-weight: 700; line-height: 1.3; color: currentColor } @media(max-width:900px) { .h6, h6 { font-size: 1rem } } .a, a { --color: var(--primary-default); --color-hover: var(--primary-hover); color: var(--color, inherit); text-decoration: none; cursor: pointer } .a:hover, a:hover { color: var(--color-hover) } .mark, mark { background-color: var(--primary-disable) } .b, b { font-weight: 700 } :root { --white: #fff; --white-rgb: 255, 255, 255; --black: #000; --black-rgb: 0, 0, 0; --primary-default: #9f62ba; --primary-default-rgb: 159, 98, 186; --primary-hover: #7f4f95; --primary-hover-rgb: 127, 79, 149; --primary-active: #7f4f95; --primary-active-rgb: 127, 79, 149; --primary-disable: #f5eff8; --primary-disable-rgb: 245, 239, 248; --primary-disable-text: #cfb1dc; --primary-disable-text-rgb: 207, 177, 220; --gray-1: #333; --gray-1-rgb: 51, 51, 51; --gray-2: #4f4f4f; --gray-2-rgb: 79, 79, 79; --gray-3: #828282; --gray-3-rgb: 130, 130, 130; --gray-4: #bdbdbd; --gray-4-rgb: 189, 189, 189; --gray-5: #e0e0e0; --gray-5-rgb: 224, 224, 224; --gray-6: #f2f2f2; --gray-6-rgb: 242, 242, 242; --gray-7: #f5f5f5; --gray-7-rgb: 245, 245, 245; --gray-8: #f8f8f8; --gray-8-rgb: 248, 248, 248; --gray-9: #fff; --gray-9-rgb: 255, 255, 255; --success: #219653; --success-rgb: 33, 150, 83; --error: #eb5757; --error-rgb: 235, 87, 87; --progress: #ffbc36; --progress-rgb: 255, 188, 54; --secondary-1: #a972c1; --secondary-1-rgb: 169, 114, 193; --secondary-2: #b282c8; --secondary-2-rgb: 178, 130, 200; --secondary-3: #bc91cf; --secondary-3-rgb: 188, 145, 207; --secondary-4: #c5a1d5; --secondary-4-rgb: 197, 161, 213; --secondary-5: #d9c0e3; --secondary-5-rgb: 217, 192, 227; --secondary-6: #e2d0ea; --secondary-6-rgb: 226, 208, 234; --secondary-7: #ece0f1; --secondary-7-rgb: 236, 224, 241; --accent-rose: #f1518b; --accent-rose-rgb: 241, 81, 139; --color-main: #333; --color-main-rgb: 51, 51, 51; --bg-color-main: #fff; --bg-color-main-rgb: 255, 255, 255 } .button, button { cursor: pointer } .button { --color: var(--white); --color-hover: var(--white); --color-disable: var(--primary-disable-text); --color-focus: var(--white); --bg-color: var(--primary-default); --bg-color-hover: var(--primary-hover); --bg-color-disable: var(--primary-disable); --bg-color-focus: var(--primary-active); --border-color: var(--primary-default); --border-color-hover: var(--primary-hover); --border-color-disable: var(--primary-disable); --border-width: 2px; --font-size: 16px; --padding: 10px 26px; --min-width: auto; --ripple-color: var(--ripple-default); --line-height: 1.5; position: relative; z-index: 1; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-width: var(--min-width); padding: var(--padding); margin: 5px; font-family: NunitoSans, Arial; font-size: var(--font-size); font-weight: 700; line-height: var(--line-height); color: var(--color); text-align: center; text-decoration: none; background-color: var(--bg-color); border: var(--border-width) solid var(--border-color); border-radius: 4px; outline: transparent; -webkit-box-shadow: none; box-shadow: none; -webkit-transition: color .3s, background-color .3s, border .3s, -webkit-box-shadow .3s; transition: color .3s, background-color .3s, border .3s, -webkit-box-shadow .3s; transition: color .3s, background-color .3s, border .3s, box-shadow .3s; transition: color .3s, background-color .3s, border .3s, box-shadow .3s, -webkit-box-shadow .3s; -webkit-transition-timing-function: ease; transition-timing-function: ease; -webkit-appearance: none; -moz-appearance: none; appearance: none } @media(max-width:900px) { .button { --font-size: 14px; --padding: 8px 22px; --line-height: 20px } } @media(hover) { .button:hover { color: var(--color-hover); background-color: var(--bg-color-hover); border-color: var(--border-color-hover) } } .button:focus { color: var(--color-focus); background-color: var(--bg-color-focus); -webkit-box-shadow: 0 0 0 2px var(--primary-disable); box-shadow: 0 0 0 2px var(--primary-disable) } .button.disabled, .button:disabled { color: var(--color-disable); pointer-events: none; cursor: default; background-color: var(--bg-color-disable); border-color: var(--border-color-disable) } .button svg { display: block; width: 1em; min-width: 1em; height: 1em; min-height: 1em; font-size: 20px; fill: currentColor; -webkit-transition: fill .3s, -webkit-transform .3s; transition: fill .3s, -webkit-transform .3s; transition: fill .3s, transform .3s; transition: fill .3s, transform .3s, -webkit-transform .3s } .button svg:first-child:not(:last-child) { margin-right: 8px } .button svg:not(:first-child) { margin-left: 8px } .button svg:only-child { margin: 0 } .button .waves-ripple { z-index: 0; background: var(--ripple-color) } .button span, .button svg { position: relative; z-index: 1 } .button.button--success { --color: var(--white); --color-hover: var(--white); --bg-color: var(--success); --bg-color-hover: var(--success); --border-color: var(--success); --border-color-hover: var(--success); --color-focus: var(--color); --bg-color-focus: var(--bg-color); min-width: 130px } .button.button--success:focus { -webkit-box-shadow: none; box-shadow: none } .button.button--error { --color: var(--white); --color-hover: var(--white); --bg-color: var(--error); --bg-color-hover: var(--error); --border-color: var(--error); --border-color-hover: var(--error); --ripple-color: transparent; --color-focus: var(--color); --bg-color-focus: var(--bg-color); min-width: 130px } .button.button--error:focus { -webkit-box-shadow: none; box-shadow: none } .button--little { --font-size: 10px; --padding: 6px 18px; --min-width: initial; --line-height: 16px } .button--little.button-icon { --size: 32px } .button--small { --font-size: 14px; --padding: 8px 22px; --min-width: initial; --line-height: 20px } .button--small.button-icon { --size: 40px } .button--big { --font-size: 16px; --padding: 14px 30px; --min-width: 212px; --line-height: 1.5 } .button--big.button-icon { --size: 56px } .button--large { --font-size: 18px; --padding: 16px 38px; --min-width: 212px; --line-height: 28px } .button--large.button-icon { --size: 64px } .button--secondary { --color: var(--primary-default); --color-hover: var(--primary-active); --color-disable: var(--primary-disable); --bg-color: transparent; --bg-color-hover: var(--primary-disable); --bg-color-disable: transparent; --border-color-disable: var(--primary-disable); --ripple-color: var(--ripple-secondary); --color-focus: var(--color); --bg-color-focus: var(--bg-color) } .button--secondary.button--success { --color: var(--success); --color-hover: var(--success); --bg-color: var(--white); --bg-color-hover: var(--white); --border-color: var(--success); --border-color-hover: var(--success); --ripple-color: transparent } .button--secondary.button--success:focus { -webkit-box-shadow: none; box-shadow: none } .button--secondary.button--error { --color: var(--error); --color-hover: var(--error); --bg-color: var(--white); --bg-color-hover: var(--white); --border-color: var(--error); --border-color-hover: var(--error); --ripple-color: transparent; --color-focus: var(--color); --bg-color-focus: var(--bg-color) } .button--secondary.button--error:focus { -webkit-box-shadow: none; box-shadow: none } .button--secondary.button--gray { --border-color: var(--gray-5) } .button--secondary.button--textblack { --color: var(--gray-1); --bg-color-hover: var(--primary-disable); --bg-color-focus: var(--primary-disable) } .button--secondary.button--textblack:hover span { color: var(--color-hover) } .button--secondary.button--textblack:hover svg { color: var(--black) } .button--secondary.button--textblack span, .button--secondary.button--textblack svg { -webkit-transition: color .2s ease; transition: color .2s ease } .button--white { --color: var(--color-main); --color-hover: var(--color-main); --color-focus: var(--color-main); --color-disable: var(--gray-3); --bg-color: var(--white); --bg-color-hover: var(--primary-disable); --bg-color-focus: var(--primary-disable); --bg-color-disable: var(--white); --border-color: var(--white); --border-color-hover: var(--primary-disable); --border-color-focus: var(--primary-disable); --border-color-disable: var(--white) } .button--white.button--secondary { --color: var(--black); --color-hover: var(--black); --color-focus: var(--black); --bg-color: var(--white); --bg-color-hover: rgba(var(--white-rgb), 0.2); --bg-color-focus: rgba(var(--white-rgb), 0.2); --border-color: var(--white); --border-color-hover: var(--white); --border-color-focus: var(--white) } .button--flat { --color: var(--primary-default); --color-hover: var(--primary-hover); --color-disable: var(--primary-disable); --bg-color: transparent; --bg-color-hover: transparent; --bg-color-disable: transparent; --border-color: transparent; --border-color-hover: transparent; --border-color-disable: transparent; --ripple-color: transparent; --color-focus: var(--primary-active); --bg-color-focus: var(--bg-color); min-width: auto; padding: 0; border: none } .button--flat:focus { -webkit-box-shadow: none; box-shadow: none } .button--flat.button--success { --color: var(--success); --color-hover: var(--success); --bg-color: transparent; --bg-color-hover: transparent; --border-color: transparent; --border-color-hover: transparent; --color-focus: var(--color); --bg-color-focus: transparent; min-width: auto } .button--flat.button--success:focus { -webkit-box-shadow: none; box-shadow: none } .button--flat.button--success svg { margin-right: 8px; background-color: rgba(var(--success-rgb), .1); border-radius: 50% } .button--flat.button--error { --color: var(--error); --color-hover: var(--error); --bg-color: transparent; --bg-color-hover: transparent; --border-color: transparent; --border-color-hover: transparent; --color-focus: var(--color); --bg-color-focus: transparent; min-width: auto } .button--flat.button--error:focus { -webkit-box-shadow: none; box-shadow: none } .button--flat.button--error svg { margin-right: 8px; background-color: rgba(var(--error-rgb), .1); border-radius: 50% } .button--flat.button--gray { --color: var(--gray-3) } .button-icon { --size: 40px; --padding: 10px; width: var(--size); min-width: var(--size); height: var(--size); min-height: var(--size); border-radius: 50% } .button-icon--prev svg { -webkit-transform: rotate(-180deg); transform: rotate(-180deg) } .button-icon svg { position: relative; margin: 0 } .button-icon svg:before { top: 50%; left: 50%; width: 10px; height: 10px; content: ""; background-color: #000; border-radius: 50%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .button-icon.button--flat { --size: auto } .button-icon.button--white { -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } .button-close { --size: 24px; --padding: 0; --color: var(--black); --color-hover: var(--primary-hover); --color-active: var(--primary-active); --color-focus: var(--primary-focus); --bg-color: var(--gray-7); --bg-color-hover: var(--gray-6); --bg-color-active: var(--gray-6); --bg-color-focus: var(--gray-6); --border-color: var(--gray-7); --border-color-hover: var(--gray-6); --border-color-active: var(--gray-6); --border-color-focus: var(--gray-6); width: var(--size); min-width: var(--size); height: var(--size); min-height: var(--size); border-radius: 2px } .button-close svg { margin: 0; font-size: 20px } .button-select { --color: var(--gray-1); --color-hover: var(--gray-1); --color-focus: var(--gray-1); --color-disable: var(--gray-3); --bg-color: var(--white); --bg-color-hover: var(--primary-disable); --bg-color-focus: var(--white); --bg-color-disable: var(--gray-6); --border-color: transparent; --border-color-hover: var(--primary-default); --border-color-focus: var(--primary-active); --border-color-disable: var(--gray-6); --padding: 17px 23px; --font-size: 18px; --line-height: 28px; --color-focus: var(--color); --bg-color-focus: transparent; margin: 0; font-weight: 600; text-align: left; border-width: 1px; border-radius: 8px } @media(max-width:900px) { .button-select { --font-size: 13px; --line-height: 18px; --padding: 10px 7px } } .button-select:focus { border-color: var(--primary-hover); -webkit-box-shadow: 0 0 0 2px rgba(var(--primary-disable-rgb), .5); box-shadow: 0 0 0 2px rgba(var(--primary-disable-rgb), .5) } .button-select.button-select--flat { --border-color: transparent; --border-color-hover: transparent; --padding: 0.625em 0; min-width: auto; border: none; border-radius: 0 } .button-select--border { --border-color: var(--gray-5); --padding: 9px 11px; --font-size: 14px; --line-height: 20px; font-weight: 300; border-radius: 4px } .button-pagination { --size: 32px; --color: var(--gray-8); --color-hover: var(--gray-8); --bg-color: transparent; --bg-color-hover: transparent; --border-color: transparent; --border-color-hover: var(--gray-8); --color-focus: var(--color); --bg-color-focus: var(--bg-color); width: var(--size); min-width: var(--size); height: var(--size); min-height: var(--size); margin: 4px; font-size: 14px; font-weight: 700; border-radius: 8px } .button-pagination.selected { --color: var(--white); --bg-color: var(--gray-8) } .button-tab { --color: var(--gray-1); --color-hover: var(--primary-default); --color-focus: var(--gray-1); --bg-color: transparent; --bg-color-hover: transparent; --bg-color-focus: transparent; --border-color: transparent; --border-color-hover: transparent; --border-color-focus: transparent; --padding: 0 0 16px 0; --font-size: 24px; --line-height: 1.5; margin: 0; font-weight: 400; border: none; border-bottom: 2px solid transparent; border-radius: 0 } .button-tab:focus { -webkit-box-shadow: none; box-shadow: none } @media(max-width:900px) { .button-tab { --font-size: 14px; --line-height: 20px; --padding: 0 0 4px } } .button-tab:not(:last-child) { margin-right: 50px } @media(max-width:900px) { .button-tab:not(:last-child) { margin-right: 24px } } .button-tab.active { border-color: var(--black) } .button-tab .button__count { top: 0; left: 100%; font-size: 14px; font-weight: 600; line-height: 20px; color: var(--primary-default); background-color: transparent; -webkit-transform: none; transform: none } @media(max-width:900px) { .button-tab .button__count { top: -5px; font-size: 10px; line-height: 16px } } .button--back { --color: var(--gray-8); margin: 0 0 1.5rem; font-size: 1.125rem } .button--back .svg { font-size: 1.5rem; -webkit-transform: rotateY(180deg); transform: rotateY(180deg) } .button.button--loading span, .button.button--loading svg { color: transparent } .button.button--loading .svg-loading { position: absolute; top: 50%; left: 50%; z-index: 1; width: 1em; height: 1em; font-size: 1.25rem; color: currentColor; opacity: 1; fill: currentColor; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .button__count { position: absolute; top: 0; right: 0; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-width: 14px; min-height: 14px; padding: 2px 3px; font-size: 10px; font-weight: 700; line-height: .5; color: var(--white); text-align: center; background-color: var(--primary-default); border-radius: 20px; -webkit-transition: background-color .2s ease, color .2s ease; transition: background-color .2s ease, color .2s ease; -webkit-transform: translate(2px, -2px); transform: translate(2px, -2px) } .tabs { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; overflow-y: hidden } @media(max-width:900px) { .tabs { width: calc(100% + 32px); padding: 0 16px; margin-left: -16px } } .tabs::-webkit-scrollbar { display: none } .tabs__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; border-bottom: 1px solid var(--gray-4) } .tabs__wrap .button-tab { white-space: nowrap } .counter { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: 100%; max-width: 118px; padding: 2px; color: var(--main-color); background-color: var(--gray-7); border-radius: 4px } .counter .button-icon { --size: 28px; --padding: 5px; margin: 0; border-radius: 2px; -webkit-box-shadow: none; box-shadow: none } .counter .button-icon:focus { -webkit-box-shadow: none; box-shadow: none } .counter .button-icon .svg { font-size: 14px } .counter__value { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 0 1rem } .counter__input, .counter__value { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; font-size: 14px; font-weight: 400; text-align: center } .counter__input { padding: 4px 6px; line-height: 1; background-color: transparent; border: none; border-radius: 2px; outline-color: var(--primary-default); outline-offset: -1px; -webkit-appearance: none; -moz-appearance: none; appearance: none } .input, .textarea { --color: #333; --color-placeholder: #bdbdbd; --border-color: #e0e0e0; --border-color-hover: #9f62ba; --border-color-focus: #9f62ba; --background-color: #fff; --padding: 10px 16px; --line-height: 1.3; padding: var(--padding); margin: 5px; overflow: hidden; font-family: NunitoSans, Arial; font-size: 16px; font-weight: 400; line-height: var(--line-height); color: var(--color); background-color: var(--background-color); border: 1px solid var(--border-color); border-radius: 4px; outline: transparent; -webkit-appearance: none; -moz-appearance: none; appearance: none } @media(max-width:1200px) { .input, .textarea { font-size: 14px } .input::-webkit-input-placeholder, .textarea::-webkit-input-placeholder { font-size: 14px } .input:-moz-placeholder, .input::-moz-placeholder, .textarea:-moz-placeholder, .textarea::-moz-placeholder { font-size: 14px } .input:-ms-input-placeholder, .textarea:-ms-input-placeholder { font-size: 14px } } .input::-webkit-input-placeholder, .textarea::-webkit-input-placeholder { font-family: NunitoSans, Arial; font-size: 16px; font-weight: 400; line-height: 1.3; color: var(--color-placeholder); opacity: 1; -webkit-transition: opacity .3s, -webkit-transform .3s; transition: opacity .3s, -webkit-transform .3s; transition: transform .3s, opacity .3s; transition: transform .3s, opacity .3s, -webkit-transform .3s } @media(max-width:1200px) { .input::-webkit-input-placeholder, .textarea::-webkit-input-placeholder { font-size: 14px } } .input:-moz-placeholder, .textarea:-moz-placeholder { font-family: NunitoSans, Arial; font-size: 16px; font-weight: 400; line-height: 1.3; color: var(--color-placeholder); opacity: 1; -moz-transition: transform .3s, opacity .3s; transition: transform .3s, opacity .3s } @media(max-width:1200px) { .input:-moz-placeholder, .textarea:-moz-placeholder { font-size: 14px } } .input::-moz-placeholder, .textarea::-moz-placeholder { font-family: NunitoSans, Arial; font-size: 16px; font-weight: 400; line-height: 1.3; color: var(--color-placeholder); opacity: 1; -moz-transition: transform .3s, opacity .3s; transition: transform .3s, opacity .3s } @media(max-width:1200px) { .input::-moz-placeholder, .textarea::-moz-placeholder { font-size: 14px } } .input:-ms-input-placeholder, .textarea:-ms-input-placeholder { font-family: NunitoSans, Arial; font-size: 16px; font-weight: 400; line-height: 1.3; color: var(--color-placeholder); opacity: 1; -ms-transition: transform .3s, opacity .3s; transition: transform .3s, opacity .3s } @media(max-width:1200px) { .input:-ms-input-placeholder, .textarea:-ms-input-placeholder { font-size: 14px } } @media(hover) { .input:hover, .textarea:hover { border-color: var(--border-color-hover) } } .input:focus, .textarea:focus { border-color: var(--border-color-focus); -webkit-box-shadow: 0 0 0 2px rgba(var(--primary-disable-rgb), .5); box-shadow: 0 0 0 2px rgba(var(--primary-disable-rgb), .5) } .input:-moz-read-only, .textarea:-moz-read-only { cursor: default; box-shadow: none; opacity: .7 } .input:read-only, .textarea:read-only { cursor: default; -webkit-box-shadow: none; box-shadow: none; opacity: .7 } @media(hover) { .input:-moz-read-only:focus, .input:-moz-read-only:hover, .textarea:-moz-read-only:focus, .textarea:-moz-read-only:hover { border-color: var(--border-color) } .input:read-only:focus, .input:read-only:hover, .textarea:read-only:focus, .textarea:read-only:hover { border-color: var(--border-color) } .input:read-only:focus::-webkit-input-placeholder, .textarea:read-only:focus::-webkit-input-placeholder { opacity: 1; -webkit-transform: unset; transform: unset } .input:-moz-read-only:focus:-moz-placeholder, .input:-moz-read-only:focus::-moz-placeholder, .textarea:-moz-read-only:focus:-moz-placeholder, .textarea:-moz-read-only:focus::-moz-placeholder { opacity: 1; transform: unset } .input:read-only:focus:-moz-placeholder, .input:read-only:focus::-moz-placeholder, .textarea:read-only:focus:-moz-placeholder, .textarea:read-only:focus::-moz-placeholder { opacity: 1; transform: unset } .input:read-only:focus:-ms-input-placeholder, .textarea:read-only:focus:-ms-input-placeholder { opacity: 1; transform: unset } } .input:not(:-moz-placeholder-shown), .textarea:not(:-moz-placeholder-shown) { --border-color: var(--gray-5) } .input:not(:-ms-input-placeholder), .textarea:not(:-ms-input-placeholder) { --border-color: var(--gray-5) } .input:not(:placeholder-shown), .textarea:not(:placeholder-shown) { --border-color: var(--gray-5) } .input--square, .textarea--square { --size: 42px; width: var(--size); min-width: var(--size); height: var(--size); min-height: var(--size); padding: .625em; text-align: center } .textarea { height: 100px; padding: 1em 1.25em; margin: 5px; resize: none } @media(max-width:900px) { .textarea { padding: .75em 1em } } .input-wrapper, .label { position: relative; display: inline-block; margin: 5px } .input-wrapper .input__arrow, .input-wrapper .input__icon, .label .input__arrow, .label .input__icon { position: absolute; top: 50%; left: 16px; z-index: 2; display: block; width: 1em; height: 1em; font-size: 1.5rem; color: var(--black); -webkit-transform: translateY(-50%); transform: translateY(-50%) } .input-wrapper .input__arrow+.input, .input-wrapper .input__icon+.input, .label .input__arrow+.input, .label .input__icon+.input { padding-left: 3rem } .input-wrapper .input__arrow, .label .input__arrow { right: 1em; left: auto } .input-wrapper .input, .label .input { width: 100%; height: 100%; padding-right: calc(12px + 1.25rem); padding-left: 1em; margin: 0 } .input-wrapper .input+.input__icon, .label .input+.input__icon { right: 1.25em; left: auto } .input-wrapper .input+.input__clear, .label .input+.input__clear { position: absolute; top: 50%; right: .5rem; visibility: hidden; opacity: 0; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .input-wrapper .input:not(:-moz-placeholder-shown)+.input__clear, .label .input:not(:-moz-placeholder-shown)+.input__clear { visibility: visible; opacity: 1 } .input-wrapper .input:not(:-ms-input-placeholder)+.input__clear, .label .input:not(:-ms-input-placeholder)+.input__clear { visibility: visible; opacity: 1 } .input-wrapper .input:not(:placeholder-shown)+.input__clear, .label .input:not(:placeholder-shown)+.input__clear { visibility: visible; opacity: 1 } .input--small { --padding: 8px 16px; --line-height: 1px } .input__clear { --size: 20px; --bg-color: transparent; --bg-color-hover: transparent; --bg-color-focus: transparent; --border-color: transparent; --border-color-hover: transparent; --color: var(--gray-3); --color-hover: var(--primary-hover); --color-focus: var(--primary-active); padding: 2px; margin: 0 } .input__clear:focus { -webkit-box-shadow: none; box-shadow: none } .input__clear .svg { width: 1em; height: 1em; font-size: 16px } .btn-pass { position: absolute; top: 34px; right: 12px; width: 20px; height: 20px; padding: 0; cursor: pointer; background: transparent; border: 0 } @media(max-width:900px) { .btn-pass { top: 36px; width: 16px; height: 16px } } .btn-pass svg { font-size: 20px } @media(max-width:900px) { .btn-pass svg { font-size: 16px } } .btn-pass .is-open { display: block } .btn-pass.active .is-open, .btn-pass .is-close { display: none } .btn-pass.active .is-close { display: block } .checkbox, .radio { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin: 5px 0; cursor: pointer } .checkbox:hover .checkbox__custom, .checkbox:hover .radio__custom, .radio:hover .checkbox__custom, .radio:hover .radio__custom { border-color: var(--primary-default) } .checkbox__input, .radio__input { position: absolute; top: 50%; left: 50%; z-index: -2; width: 1px; height: 1px; margin: 0; opacity: 0; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-appearance: none; -moz-appearance: none; appearance: none } .checkbox__input:checked+.checkbox__custom, .checkbox__input:checked+.radio__custom, .radio__input:checked+.checkbox__custom, .radio__input:checked+.radio__custom { background-color: var(--primary-default); border-color: var(--primary-default) } .checkbox__input:checked+.checkbox__custom .checkbox__icon, .checkbox__input:checked+.checkbox__custom .radio__icon, .checkbox__input:checked+.radio__custom .checkbox__icon, .checkbox__input:checked+.radio__custom .radio__icon, .radio__input:checked+.checkbox__custom .checkbox__icon, .radio__input:checked+.checkbox__custom .radio__icon, .radio__input:checked+.radio__custom .checkbox__icon, .radio__input:checked+.radio__custom .radio__icon { opacity: 1 } .checkbox__input:disabled+.checkbox__custom:after, .checkbox__input:disabled+.radio__custom:after, .radio__input:disabled+.checkbox__custom:after, .radio__input:disabled+.radio__custom:after { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; cursor: default; content: "" } .checkbox__input:disabled+.checkbox__custom+.checkbox__text, .checkbox__input:disabled+.checkbox__custom+.radio__text, .checkbox__input:disabled+.radio__custom+.checkbox__text, .checkbox__input:disabled+.radio__custom+.radio__text, .radio__input:disabled+.checkbox__custom+.checkbox__text, .radio__input:disabled+.checkbox__custom+.radio__text, .radio__input:disabled+.radio__custom+.checkbox__text, .radio__input:disabled+.radio__custom+.radio__text { opacity: .3 } .checkbox__input:disabled:checked+.checkbox__custom, .checkbox__input:disabled:checked+.radio__custom, .radio__input:disabled:checked+.checkbox__custom, .radio__input:disabled:checked+.radio__custom { background-color: var(--primary-disable) } .checkbox__custom, .radio__custom { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin: 0 6px 0 0; font-size: 20px; background-color: transparent; border: 1px solid var(--gray-4); border-radius: 2px; -webkit-transition: .2s ease; transition: .2s ease } .checkbox__text, .radio__text { display: block; padding-top: 3px; font-family: NunitoSans, Arial; font-size: 16px; font-weight: 400; line-height: 1.2; color: currentColor } @media(max-width:1200px) { .checkbox__text, .radio__text { font-size: 14px } } @media(max-width:900px) { .checkbox__text, .radio__text { font-size: 14px; line-height: 17px } } .checkbox__text b, .radio__text b { font-weight: 700; color: var(--gray-8) } .checkbox__link, .radio__link { color: var(--primary-default); text-decoration: none; -webkit-transition: color .3s; transition: color .3s } .checkbox__link:hover, .radio__link:hover { color: var(--primary-hover); text-decoration: none } .checkbox__icon, .radio__icon { width: 1em; height: 1em; font-size: 16px; color: var(--white); opacity: 0; -webkit-transition: .3s; transition: .3s } .radio { --bg-icon: #fff; --bg-icon-hover: #fff; --bg-icon-active: #fff; --bg-color: #fff; --bg-color-hover: #fff; --bg-color-active: #9f62ba; --border-color: #bdbdbd; --border-color-hover: #9f62ba; --border-color-active: #9f62ba; margin: 5px 0 } .radio__input:checked+.radio__custom { background-color: var(--bg-color-active) } .radio__input:checked+.radio__custom:before { opacity: 1 } .radio__input:disabled+.radio__custom { -webkit-box-shadow: inset 0 0 0 2px var(--gray-2); box-shadow: inset 0 0 0 2px var(--gray-2) } .radio__input:disabled+.radio__custom:before { background-color: var(--primary-disable) } .radio__input:disabled+.radio__custom:after { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; cursor: default; content: "" } .radio__input:disabled+.radio__custom+.radio__text { opacity: .3 } .radio__input:disabled+.radio__custom+.radio__text:after { position: absolute; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; cursor: default; content: "" } .radio__input:disabled:checked+.radio__custom { background-color: var(--primary-disable); -webkit-box-shadow: inset 0 0 0 2px transparent, 0 0 0 2px rgba(var(--primary-disable-rgb), .5); box-shadow: inset 0 0 0 2px transparent, 0 0 0 2px rgba(var(--primary-disable-rgb), .5) } .radio__custom { position: relative; width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin: 0 12px 0 0; font-size: 24px; background-color: var(--bg-color); border-radius: 50% } @media(max-width:900px) { .radio__custom { margin: 0 8px 0 0; font-size: 20px } } .radio__custom:before { position: absolute; top: 50%; left: 50%; width: 1em; height: 1em; font-size: 10px; content: ""; background-color: var(--bg-icon); border-radius: 50%; opacity: 0; -webkit-transition: opacity .3s; transition: opacity .3s; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .checkbox-switch { --size: 20px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } .checkbox-switch .checkbox__input:checked+.checkbox-switch__custom-wrapper { background-color: var(--primary-default) } .checkbox-switch .checkbox__input:checked+.checkbox-switch__custom-wrapper:hover { background-color: var(--primary-hover) } .checkbox-switch .checkbox__input:checked+.checkbox-switch__custom-wrapper .checkbox-switch__custom { background-color: var(--white); -webkit-transform: translateX(100%); transform: translateX(100%) } .checkbox-switch__custom-wrapper { width: calc(var(--size)*2 + 2px); min-width: calc(var(--size)*2 + 2px); height: calc(var(--size) + 2px); min-height: calc(var(--size) + 2px); padding: 1px; margin: 0 12px 0 0; background-color: var(--gray-5); border-radius: 20px; -webkit-transition: background-color .2s ease; transition: background-color .2s ease } .checkbox-switch__custom-wrapper:hover { background-color: var(--gray-4) } .checkbox-switch__custom { position: relative; width: var(--size); min-width: var(--size); height: var(--size); min-height: var(--size); background-color: var(--white); border-radius: 50%; -webkit-transition: background-color .2s ease, -webkit-transform .2s ease; transition: background-color .2s ease, -webkit-transform .2s ease; transition: transform .2s ease, background-color .2s ease; transition: transform .2s ease, background-color .2s ease, -webkit-transform .2s ease } .dropdown { --size-icon: 16px; position: relative; z-index: 2; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: 100%; margin: 5px } .dropdown[data-dropdown-filter-modal] .dropdown__button { padding: 9px 11px; border-color: var(--gray-5); border-radius: 4px } .dropdown[data-dropdown-filter-modal] .dropdown__button:hover { border-color: var(--primary-default) } .dropdown[data-dropdown-filter-modal] .dropdown__placeholder { font-size: 14px; font-weight: 300; line-height: 20px; color: var(--gray-1) } .dropdown[data-dropdown-filter-modal] .dropdown__arrow { font-size: 16px } .dropdown[data-dropdown-filter-modal].active .dropdown__button { border-color: var(--primary-default) } .dropdown[data-dropdown-filter-modal].active .dropdown__arrow { color: var(--primary-default) } .dropdown[data-dropdown-filter-modal].selected .dropdown__button { padding: 3px 12px 3px 3px; border-color: var(--primary-default); --bg-color: transparent } .dropdown[data-dropdown-filter-modal].selected .dropdown__placeholder { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -2px } .dropdown[data-dropdown-filter-modal].selected .dropdown__placeholder .dropdown-tag { padding: 5px 7px; margin: 2px; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-1); background-color: var(--gray-7); border: 1px solid var(--primary-disable-text); border-radius: 3px } .dropdown[data-dropdown-filter-modal].selected .dropdown__placeholder .dropdown-tag .button-icon { --size: 16px } .dropdown[data-dropdown-filter-modal].selected .dropdown__placeholder .svg { font-size: 16px } .dropdown[data-dropdown-filter-modal] .dropdown-link { padding: 0 } .dropdown[data-dropdown-filter-modal] .dropdown-link .checkbox, .dropdown[data-dropdown-filter-modal] .dropdown-link .radio { padding: 8px 16px } .dropdown.selected, .dropdown:hover { z-index: 3 } .dropdown.selected .dropdown__button { --color: var(--gray-1); --bg-color: var(--primary-disable); --border-color: var(--primary-default) } .dropdown.selected.count .dropdown__button .button__count { display: -webkit-box; display: -ms-flexbox; display: flex } .dropdown.active { z-index: 3 } .dropdown.active .dropdown__button { color: var(--gray-1); border-color: var(--primary-hover) } .dropdown.active .dropdown__content { visibility: visible; opacity: 1; -webkit-transform: translateY(0); transform: translateY(0) } .dropdown.active .dropdown__arrow { fill: #000; -webkit-transform: rotateX(-180deg); transform: rotateX(-180deg) } .dropdown select { display: none } .dropdown__button-wrapper { width: 100% } .dropdown__button { position: relative; z-index: 2; width: 100% } @media(max-width:1200px) { .dropdown__button { font-size: 14px } } .dropdown__button .button__count { position: static; display: none; min-width: 20px; min-height: 20px; margin: 0 0 0 4px; font-size: 14px; line-height: .5; -webkit-transform: none; transform: none } @media(max-width:900px) { .dropdown__button .button__count { min-width: 16px; min-height: 16px; font-size: 12px } } .dropdown__placeholder { display: block; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .dropdown__placeholder b { font-weight: 700 } .dropdown__arrow-wrapper { width: var(--size-icon); min-width: var(--size-icon); height: var(--size-icon); min-height: var(--size-icon); margin-left: 1em } .dropdown .dropdown__arrow { display: block; width: 100%; height: 100%; font-size: inherit; fill: inherit; -webkit-transition: fill .2s ease, -webkit-transform .2s ease; transition: fill .2s ease, -webkit-transform .2s ease; transition: fill .2s ease, transform .2s ease; transition: fill .2s ease, transform .2s ease, -webkit-transform .2s ease } .dropdown__content { --position: calc(100% + 10px); position: absolute; top: var(--position); left: 0; z-index: 1; width: 100%; min-width: 200px; padding: 0; visibility: hidden; background-color: var(--white); border-radius: 4px; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15); opacity: 0; -webkit-transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease, -webkit-box-shadow .2s ease; transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease, -webkit-box-shadow .2s ease; transition: opacity .2s ease, visibility .2s ease, transform .2s ease, box-shadow .2s ease; transition: opacity .2s ease, visibility .2s ease, transform .2s ease, box-shadow .2s ease, -webkit-transform .2s ease, -webkit-box-shadow .2s ease; -webkit-transform: translateY(30px); transform: translateY(30px) } .dropdown__content--arrow:before { position: absolute; right: 26px; bottom: 100%; display: block; width: 0; height: 0; content: ""; border-left: 7px solid transparent; border-bottom: 7px solid var(--white); border-right: 7px solid transparent; border-top: 0 solid transparent } .dropdown__content--right { right: 0; left: auto } .dropdown__content--bottom { top: auto; bottom: var(--position) } .dropdown__content .checkbox, .dropdown__content .radio { width: 100%; padding: 6px 16px; margin: 0 } .dropdown__content .checkbox:hover, .dropdown__content .radio:hover { background-color: var(--gray-7) } .dropdown__content .checkbox:hover .checkbox__text, .dropdown__content .checkbox:hover .radio__text, .dropdown__content .radio:hover .checkbox__text, .dropdown__content .radio:hover .radio__text { color: var(--primary-hover) } .dropdown__content .checkbox__text, .dropdown__content .radio__text { font-size: 14px; line-height: 20px } .dropdown__content .checkbox__input[type=radio]~.checkbox__custom, .dropdown__content .checkbox__input[type=radio]~.radio__custom, .dropdown__content .radio__input[type=radio]~.checkbox__custom, .dropdown__content .radio__input[type=radio]~.radio__custom { display: none } .dropdown__content .checkbox__input:checked~.checkbox__text, .dropdown__content .radio__input:checked~.checkbox__text { color: var(--primary-active) } .dropdown__container { overflow: hidden; border-radius: inherit } .dropdown__search { margin-bottom: 4px } .dropdown__search .input-wrapper { width: 100%; margin: 0 } .dropdown__list { max-height: 315px; padding: 10px 0; overflow-x: hidden; scrollbar-color: var(--primary-active) var(--gray-6); scrollbar-width: thin } .dropdown__list::-webkit-scrollbar { width: 3px } .dropdown__list::-webkit-scrollbar-thumb { background: var(--primary-active); border-radius: 4px } .dropdown__list::-webkit-scrollbar-track { background: var(--gray-6); border-radius: 4px } .dropdown__subtitle { display: block; padding: 0 8px; font-size: 14px; font-weight: 700; line-height: 1.7; text-transform: uppercase } @media(max-width:1200px) { .dropdown__subtitle { font-size: 13px } } .dropdown__item { overflow: hidden } .dropdown__item.hidden { display: none } .dropdown__item--reset .checkbox:before, .dropdown__item--reset .radio:before { display: block; width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin: 0 6px 0 0; font-size: 20px; color: var(--gray-3); content: ""; background-color: currentColor; -webkit-mask: url(/local/templates/rozbl22/assets/css/../images/hamburger-close.svg) no-repeat 50% 50%; mask: url(/local/templates/rozbl22/assets/css/../images/hamburger-close.svg) no-repeat 50% 50%; -webkit-mask-size: contain; mask-size: contain } .dropdown__item--reset .checkbox:hover:before, .dropdown__item--reset .radio:hover:before { color: var(--primary-default) } .dropdown__item--without-cross .checkbox:before, .dropdown__item--without-cross .radio:before { content: none } .dropdown__footer { padding: 1rem 2rem; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } .dropdown__footer .button { width: 100%; padding-right: 10px; padding-left: 10px; margin: 0 } .dropdown-tag { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .dropdown-tag .button-icon { margin: 0 0 0 8px } .dropdown__link { display: block; padding: .5rem 1rem; font-size: 1rem; line-height: 1.25; color: inherit; background-color: transparent; border-radius: 4px } .dropdown__link:hover { color: var(--primary-default); background-color: var(--gray-7) } .dropdown__link .b, .dropdown__link b { font-weight: 800 } .modal-wrapper { position: fixed; top: 0; left: 0; z-index: 10; display: block; width: 100vw; height: var(--vh, 100vh); padding: 1rem; overflow: auto; overflow-x: hidden; overflow-y: auto; font-size: 0; text-align: center; white-space: nowrap; visibility: hidden; background-color: rgba(var(--black-rgb), .1); opacity: 0; -webkit-transition: opacity .3s ease, visibility .3s ease; transition: opacity .3s ease, visibility .3s ease } .modal-wrapper:before { display: inline-block; height: 100%; vertical-align: middle; content: "" } .modal-wrapper.active { visibility: visible; opacity: 1 } .modal-wrapper.active .modal { opacity: 1; -webkit-transform: scale(1); transform: scale(1) } .modal-wrapper>.button-close { position: absolute; top: 8px; right: 8px; margin: 0 } .modal { position: relative; z-index: 11; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; max-width: 480px; padding: 3.5rem 4rem; font-size: 1rem; text-align: center; white-space: normal; vertical-align: middle; background-color: var(--white); border-radius: 6px; opacity: 0; -webkit-transition: opacity .3s ease, -webkit-transform .3s ease; transition: opacity .3s ease, -webkit-transform .3s ease; transition: opacity .3s ease, transform .3s ease; transition: opacity .3s ease, transform .3s ease, -webkit-transform .3s ease; -webkit-transform: scale(.6); transform: scale(.6) } @media(max-width:900px) { .modal { min-height: 504px; border-radius: 4px } } .modal--small { max-width: 444px } @media(max-width:900px) { .modal--small { padding: 24px } } .modal--medium { max-width: 700px } @media(max-width:900px) { .modal--medium { padding: 20px 28px } } .modal--large { max-width: 900px } .modal--no-padding { padding-right: 0; padding-left: 0 } .modal__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } .modal__header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .modal__header .button-close { position: absolute; top: 8px; right: 8px; margin: 0 0 0 auto } .modal__title { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0 0 16px; font-size: 24px; font-weight: 800; line-height: 1.5; text-align: left } .modal__title .tag { margin-left: 12px } .modal__subtitle { display: block; margin: 12px 0 0; font-weight: 500 } .modal__subtitle, .modal__text { font-size: 14px; text-align: left } .modal__text { line-height: 1.4; color: var(--gray-1) } .modal__text--small { font-size: 13px } .modal__text--big { font-size: 16px; line-height: 1.5; color: var(--main-color) } .modal__text strong { font-weight: 600; color: var(--error) } .modal__icon-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: .5rem } .modal__icon { width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin: auto; font-size: 5rem } .modal__body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; text-align: left } .modal__body .tabs { margin: 0 0 2rem } .modal__footer { padding-top: 1.5rem; margin-top: 1.5rem; text-align: left; border-top: 1px solid var(--secondary-4) } .modal__footer .text-info { margin: 0; font-size: 12px } @media(max-width:600px) { .modal__footer .text-info { font-size: 10px } } .modal__actions { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .modal__actions .button { margin: 0 } .modal__actions .button:not(:last-of-type) { margin-right: 1.5rem } .modal__actions .button--secondary { --color: var(--secondary-7); --border-color: var(--secondary-7) } .modal__items { margin-top: 2.5rem } @media(max-width:900px) { .modal__items { margin-top: 16px } } .modal__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 14px; font-weight: 300; line-height: 1.4; text-align: left } @media(max-width:600px) { .modal__item { font-size: 12px } } .modal__item:not(:last-of-type) { margin-bottom: 12px } .modal__item dt { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1 1 50%; flex: 1 1 50%; margin-right: 2px; color: var(--secondary-6) } .modal__item dt:after { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin-left: 4px; content: ""; border-bottom: 1px dashed var(--secondary-4); -webkit-transform: translateY(-5px); transform: translateY(-5px) } .modal__item dd { -webkit-box-flex: 0; -ms-flex: 0 0 50%; flex: 0 0 50% } .modal__item dd.success { color: var(--success) } .modal__item dd.error { color: var(--error) } .modal__item dd b { font-weight: 500 } .modal__item .dropdown-wallet { padding: 0 } .modal-row:not(:last-child) { margin-bottom: 1rem } .modal-row__header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 4px } .modal-row__header .modal-row__label { margin-bottom: 0 } .modal-row__header .modal-row__label:not(:last-child) { margin-right: 1rem } .modal-row__label { display: block; margin-bottom: 4px; font-size: 14px; line-height: 1.2 } @media(max-width:900px) { .modal-row__label { margin-bottom: 5px; font-size: 12px } } .modal-row__label em { font-size: 20px; font-weight: 500 } .modal-row__link { font-size: 14px } @media(max-width:900px) { .modal-row__link { font-size: 12px } } .modal-row .input-wrapper, .modal-row .textarea { width: 100%; margin: 0 } .modal-row__tariff { font-size: 14px; font-weight: 300; color: var(--secondary-6) } .modal-row__tariff em { margin-left: 6px; font-weight: 500; color: var(--primary-default) } .modal-rows { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap } .modal-rows .modal-row { width: calc(50% - .625rem); margin-bottom: 0 } @media(max-width:600px) { .modal-rows .modal-row { width: 100% } } .modal-rows .modal-row:nth-child(odd) { margin-right: 1.25rem } @media(max-width:600px) { .modal-rows .modal-row:nth-child(odd) { margin-right: 0; margin-bottom: 1.25rem } } .modal-rows:not(:last-child) { margin-bottom: 1.25rem } .captcha { display: -webkit-box; display: -ms-flexbox; display: flex } .modal__form:not(:last-child) { margin-bottom: 1rem } .modal__form .checkbox:not(:last-child), .modal__form .modal__text, .modal__form .radio:not(:last-child) { margin-bottom: 1.25rem } .modal__form .checkbox .checkbox__text, .modal__form .checkbox .radio__text, .modal__form .radio .checkbox__text, .modal__form .radio .radio__text { font-size: 12px; line-height: 16px; color: var(--gray-3) } .modal__form .dropdown .checkbox, .modal__form .dropdown .radio { margin: 0 } .modal__form .captcha { margin-bottom: 1.25rem } @media(min-width:601px) { .modal__form--wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -10px -12px } .modal__form--wrap>* { width: calc(50% - 24px); margin: 10px 12px } } @media(max-width:600px) { .modal__form--wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .modal__buttons { display: -webkit-box; display: -ms-flexbox; display: flex; margin: -5px } .modal__buttons .button { width: calc(50% - 10px); min-width: auto } .modal__buttons .button:first-of-type:last-of-type { margin-left: auto } .modal__button { display: -webkit-box; display: -ms-flexbox; display: flex } .modal__button:not(:last-child) { margin-bottom: 1rem } .modal__button .button { width: 100%; margin: 0 } .modal__btns { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 24px 0 } @media(max-width:900px) { .modal__btns { margin: 24px 0 0 } } .modal__btns:last-child { margin-bottom: 0 } .modal__btns .button { width: auto; min-width: auto; margin: 0 } .modal__btns .button:not(:last-of-type) { margin-right: 16px } .modal__btns .button:first-of-type:last-of-type { margin: 0 auto } @media(max-width:900px) { .modal__btns .button:first-of-type:last-of-type { width: 100%; margin: 0 } } .codes { margin: 16px 0; overflow: hidden } .codes__list { --rows: 5; --margin: 6px; --fz: 14px; --lh: 1.4; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column wrap; flex-flow: column wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; max-height: calc(var(--rows)*(var(--fz)*var(--lh) + var(--margin))); margin: -3px -6px; counter-reset: code } @media(max-width:900px) { .codes__list { --fz: 12px } } .codes__item { height: calc(100%/var(--rows) - var(--margin)); margin: calc(var(--margin)/2) var(--margin); font-size: var(--fz); font-weight: 500; line-height: var(--lh); counter-increment: code } .codes__item:before { margin-right: 4px; font-size: inherit; font-weight: 400; color: var(--secondary-5); content: counter(code) "." } .modal-ol__list { margin-bottom: 12px; counter-reset: item } .modal-ol__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; line-height: 1.4; counter-increment: item } .modal-ol__item:not(:last-of-type) { margin-bottom: 4px } @media(max-width:900px) { .modal-ol__item:not(:last-of-type) { margin-bottom: 8px } } .modal-ol__item:before { margin-right: 7px; font-size: inherit; font-weight: 700; color: var(--secondary-7); content: counter(item) "." } @media(max-width:900px) { .modal-ol__item:before { margin-right: 4px } } .modal-qr__title { margin: 0; font-weight: 600 } @media(max-width:900px) { .modal-qr__title { font-size: 14px } } .modal-qr__img { width: 100%; max-width: 104px; margin: 12px 0 24px } @media(max-width:900px) { .modal-qr__img { margin: 8px 0 } } .modal-key { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 12px 0 20px } .modal-key__num { font-size: 1.125rem; color: var(--primary-default) } .modal-key .button { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; min-width: auto; padding-right: 10px; padding-left: 10px; margin: 0 0 0 8px } .modal-block__label { display: block; margin-bottom: 4px; font-size: 14px; font-weight: 600; line-height: 1.2 } .modal-block .modal__text { word-break: break-all } .modal-wrapper--power .modal__item dt { -webkit-box-flex: 1; -ms-flex: 1 1 55%; flex: 1 1 55% } .modal-wrapper--power .modal__item dd { -webkit-box-flex: 0; -ms-flex: 0 0 45%; flex: 0 0 45% } .modal-power-lists { overflow: hidden } .modal-power-lists__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -1rem } @media(max-width:900px) { .modal-power-lists__wrap { margin: 0 -1rem } } .modal-power-lists .modal__list { width: calc(50% - 2rem); margin: 1rem } @media(max-width:900px) { .modal-power-lists .modal__list { width: calc(100% - 2rem); margin: 0 1rem } } .modal-power-lists .modal__list:first-child:last-child { width: calc(100% - 2rem) } .modal-wrapper--courses-settings .modal { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; max-height: calc(100% - 80px); padding: 0; overflow: hidden } .modal-wrapper--courses-settings .modal__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100% } .modal-wrapper--courses-settings .modal__header { padding: 24px 28px 0; margin-bottom: 16px } .modal-wrapper--courses-settings .modal__body { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 0 28px; overflow: hidden } .modal-wrapper--courses-settings .modal__form { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: calc(100% + 24px); height: 100%; padding: 0 12px; margin-left: -12px; overflow: hidden } .modal-wrapper--courses-settings .modal__form .dropdown-wrapper { margin-bottom: 12px } .modal-wrapper--courses-settings .modal__form .dropdown__list-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; overflow: hidden } .modal-wrapper--courses-settings .modal__form .dropdown__list { max-height: 50vh } .modal-wrapper--courses-settings .modal__form .dropdown__item:hover { background-color: transparent } .modal-wrapper--courses-settings .modal__form .dropdown__item .checkbox, .modal-wrapper--courses-settings .modal__form .dropdown__item .radio { padding: 0; margin: 8px 0 } .modal-wrapper--courses-settings .modal__footer { padding: 10px 28px; margin-top: 0; border-top: none } .modal-wrapper--courses-settings .modal__footer.shadow-scroll { -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .15); box-shadow: 0 0 20px rgba(0, 0, 0, .15) } .modal-wrapper--success .modal { min-height: auto } .modal-success { text-align: center } .modal-success__img { width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin: 0 auto 16px; font-size: 48px } .modal-success .modal__title { margin-bottom: 8px; text-align: center } .modal-success .modal__text { text-align: center } .modal-success__link { font-size: 12px; font-weight: 300 } .modal-success__footer { margin-top: 2rem } @media(max-width:900px) { .modal-success__footer { margin-top: 24px } } .modal__pay:not(:last-child) { margin-bottom: 10px } .modal__pay .modal-row__label { margin-bottom: 0 } .modal__link-wrapper { margin-top: 16px; text-align: center } .modal__link { margin: 0 auto; font-size: 14px; font-weight: 300 } .modal-wrapper--autopay .modal__button { margin-top: 24px } .modal-wrapper--filters .dropdown__list { max-height: 210px } .radio-rating { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .radio-rating__title { margin-right: 4px; line-height: 1.3 } .radio-rating__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-direction: row-reverse; flex-direction: row-reverse; -webkit-transform: translateY(-2px); transform: translateY(-2px) } .radio-rating__input { position: absolute; top: 50%; left: 50%; z-index: -2; width: 1px; height: 1px; margin: 0; opacity: 0; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .radio-rating__input:checked~.radio-rating__label>svg, .radio-rating__input:not(:disabled)+.radio-rating__label:hover>svg { fill: var(--primary-default) } .radio-rating__label { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; cursor: pointer } .radio-rating__label:not(:first-child) { padding: 0 6px 0 0 } .radio-rating__label:hover~.radio-rating__input:not(:disabled)~.radio-rating__label>svg { fill: var(--primary-default) } .radio-rating__label svg { display: block; width: 1.5rem; min-width: 1.5rem; height: 1.5rem; min-height: 1.5rem; color: var(--primary-default); opacity: 1; fill: transparent } .modal-wrapper--comment .modal { max-width: 500px; padding: 3.5rem 4rem } @media(max-width:900px) { .modal-wrapper--comment .modal { padding: 32px 20px } } .modal-comment .modal__title { margin: 0 0 8px } .modal-comment__form { margin-top: 16px } .modal-comment__form .textarea { width: 100%; height: 78px; margin: 16px 0 0 } .modal-comment__footer { margin-top: 16px } .modal-wrapper--reserve .modal__header { margin: 0 0 8px } @media(max-width:900px) { .modal-wrapper--reserve .modal__text { font-size: 12px } } .modal-wrapper--reserve .modal__text--big { margin-bottom: 12px } @media(max-width:900px) { .modal-wrapper--reserve .modal__text--big { font-size: 14px } } .modal-wrapper--signup .modal { max-width: 756px } @media(min-width:901px) { .modal-wrapper--signup .modal { padding-bottom: 2.5rem } } @media(max-width:600px) { .modal-wrapper--signup .modal__form .modal-row:first-child { -webkit-box-ordinal-group: 2; -ms-flex-order: 1; order: 1 } .modal-wrapper--signup .modal__form .modal-row:nth-child(2) { -webkit-box-ordinal-group: 4; -ms-flex-order: 3; order: 3 } .modal-wrapper--signup .modal__form .modal-row:nth-child(3) { -webkit-box-ordinal-group: 3; -ms-flex-order: 2; order: 2 } .modal-wrapper--signup .modal__form .modal-row:nth-child(4) { -webkit-box-ordinal-group: 5; -ms-flex-order: 4; order: 4 } } @media(max-width:600px) { .modal-wrapper--signup .modal__form .captcha { -webkit-box-ordinal-group: 6; -ms-flex-order: 5; order: 5 } } @media(max-width:600px) { .modal-wrapper--signup .modal__form .checkbox { -webkit-box-ordinal-group: 7; -ms-flex-order: 6; order: 6 } } @media(max-width:600px) { .modal-wrapper--signup .modal__form .modal__button { -webkit-box-ordinal-group: 8; -ms-flex-order: 7; order: 7 } } @media(min-width:601px) { .modal-wrapper--signup .modal__form .modal__link-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } } @media(max-width:600px) { .modal-wrapper--signup .modal__form .modal__link-wrapper { -webkit-box-ordinal-group: 11; -ms-flex-order: 10; order: 10 } } @media(max-width:900px) { .modal-wrapper--faq .modal { padding: 24px 20px } } .modal-wrapper--faq .modal__header { width: 100%; max-width: 544px; margin: 0 auto 16px } @media(min-width:901px) { .modal-wrapper--faq .modal__header { margin-bottom: 2rem } } .modal-wrapper--faq .modal__form { width: 100%; max-width: 544px; margin: 0 auto } .modal-wrapper--faq .modal-row .textarea { height: 80px } @media(min-width:601px) { .modal-wrapper--faq .modal__buttons { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end } } @media(min-width:601px) { .modal-wrapper--faq .modal__buttons .button { width: auto } } @media(min-width:901px) { .modal-wrapper--gallery { padding: calc(40px + 2rem) } } @media(max-width:900px) { .modal-wrapper--gallery { padding-top: calc(40px + 1rem) } } .modal-wrapper--gallery .modal { padding: 0 } .gallery-slider-wrap { position: relative; width: 100%; padding-bottom: 54% } @media(max-width:600px) { .gallery-slider-wrap { padding-bottom: 100% } } .gallery-slider-inner { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .gallery-slider-inner .gallery-slider { height: 100% } .gallery-slider { height: 490px } @media(max-width:600px) { .gallery-slider { height: 400px } } .gallery-item { height: 100%; overflow: hidden; background-color: var(--bg-card); border-radius: 8px 8px 0 0 } .gallery-item__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; height: 100% } .gallery-item__img { height: 100%; -o-object-fit: contain; object-fit: contain } .gallery-item .how__video { max-width: none; height: 100%; margin: 0; border-radius: 0 } .gallery-item .how__img { border-radius: 0 } .gallery-item .how__play { top: 50%; left: 50% } .gallery-slider-navigation { pointer-events: none } @media(max-width:900px) { .gallery-slider-navigation { display: none } } .gallery-slider-navigation__button { position: fixed; top: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: calc(50vw - 450px); min-width: calc(40px + 2rem); height: 100% } .gallery-slider-navigation__button--prev { right: auto; left: 0 } .gallery-slider-navigation__button--next { right: 0; left: auto } .gallery-slider-navigation__button .button-icon { --size: 40px; margin: 0; pointer-events: all } .gallery-slider-navigation__button .button-icon .svg { font-size: 24px } .gallery-thumbs-slider-wrapper { padding: 1.25rem 1.5rem; overflow: hidden; border-radius: 0 0 8px 8px } @media(max-width:900px) { .gallery-thumbs-slider-wrapper { padding: 16px } } .gallery-thumbs-slider { overflow: visible } @media(max-width:900px) { .gallery-thumbs-slide { width: 100%; max-width: 48px } } .gallery-thumbs-slide:hover .chat-sender-imgs__img { border-color: var(--primary-hover) } .gallery-thumbs-slide.swiper-slide-thumb-active .chat-sender-imgs__img { border-color: var(--primary-default); -webkit-box-shadow: 0 0 0 1px var(--primary-default); box-shadow: 0 0 0 1px var(--primary-default) } .gallery-thumbs-slide .chat-sender-imgs__item { width: 100%; max-width: none; height: 100%; margin: 0 } .gallery-thumbs-slide .chat-sender-imgs__img { cursor: pointer; -webkit-transition: border .2s ease, -webkit-box-shadow .2s ease; transition: border .2s ease, -webkit-box-shadow .2s ease; transition: border .2s ease, box-shadow .2s ease; transition: border .2s ease, box-shadow .2s ease, -webkit-box-shadow .2s ease } .modal-wrapper--comment-photo .modal { max-width: 600px } @media(max-width:900px) { .modal-wrapper--comment-photo .modal { padding: 32px 20px } } .modal-wrapper--comment-photo .modal__header { margin-bottom: 0 } .modal-wrapper--comment-photo .textarea { height: 180px } .modal-wrapper--comment-photo .chat-sender-imgs { margin: 16px 0 28px } @media(max-width:900px) { .modal-wrapper--comment-photo .chat-sender-imgs { margin: 16px 0 20px } } @media(max-width:900px) { .modal-wrapper--comment-photo .chat-sender-imgs__wrap { margin: -6px } } .modal-wrapper--comment-photo .chat-sender-imgs__item { cursor: pointer } @media(max-width:900px) { .modal-wrapper--comment-photo .chat-sender-imgs__item { max-width: 3.428rem; margin: 6px } } @media(min-width:601px) { .modal-wrapper--comment-photo .modal__buttons { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end } .modal-wrapper--comment-photo .modal__buttons .button { width: auto } } .add-photo { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 16px 0 28px } @media(max-width:900px) { .add-photo { margin: 16px 0 20px } } .add-photo .chat-sender-imgs__item { margin: 0 } .add-photo__wrap { margin-left: 1.5rem } .add-photo__title { margin: 0 0 7px; font-weight: 600 } .add-photo__subtitle { font-size: 14px; color: var(--secondary-6) } @media(max-width:900px) { .modal-gallery { padding: 0 } } .modal-gallery .modal { max-width: 1200px; height: 100%; min-height: auto; padding: 20px; pointer-events: none; background-color: transparent; -webkit-transform: none; transform: none } @media(max-width:900px) { .modal-gallery .modal { padding: 0 } } .modal-gallery .modal__body, .modal-gallery .modal__wrap { display: block; height: 100% } .modal-slider-buttons { position: absolute; top: 50%; left: 50%; z-index: 2; width: 100%; pointer-events: none; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } .modal-slider-buttons__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100% } .modal-slider-buttons__wrap .button-icon { margin: 0; pointer-events: all } @media(max-width:600px) { .modal-slider-buttons__wrap .button-icon--prev { left: -10px } } @media(max-width:600px) { .modal-slider-buttons__wrap .button-icon--next { right: -10px } } .modal-slider-wrapper { position: relative; height: 100%; padding: 0 2rem } @media(max-width:900px) { .modal-slider-wrapper { padding: 0 } } .modal-slider-wrapper .modal-slider-buttons .button-icon--prev { left: 16px; margin-left: 0 } .modal-slider-wrapper .modal-slider-buttons .button-icon--next { right: 16px; margin-right: 0 } .modal-slider { height: 100% } .modal-slide { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; pointer-events: none !important } .modal-slide__img { display: block; width: auto; max-width: 100%; height: auto; max-height: 100%; pointer-events: all; background-color: var(--white) } @media(max-width:600px) { .modal-wrapper--program { padding: 0 } } .modal-wrapper--program sup { color: var(--error) } .modal-wrapper--program .modal { max-width: 885px; padding: 64px 56px } @media(max-width:1200px) { .modal-wrapper--program .modal { padding: 54px 42px } } @media(max-width:900px) { .modal-wrapper--program .modal { padding: 42px 28px } } @media(max-width:768px) { .modal-wrapper--program .modal { padding: 40px 16px } } @media(max-width:600px) { .modal-wrapper--program .modal { max-width: 100%; height: 100%; max-height: 100%; padding-right: 8px; padding-bottom: 0; border-radius: 0 } } .modal-wrapper--program .modal__wrap { scrollbar-color: var(--primary-active) var(--gray-6); scrollbar-width: thin } @media(max-width:600px) { .modal-wrapper--program .modal__wrap { overflow-x: hidden } } .modal-wrapper--program .modal__wrap::-webkit-scrollbar { width: 3px } .modal-wrapper--program .modal__wrap::-webkit-scrollbar-thumb { background: var(--primary-active); border-radius: 4px } .modal-wrapper--program .modal__wrap::-webkit-scrollbar-track { background: var(--gray-6); border-radius: 4px; -webkit-margin-after: 40px; margin-block-end: 40px } @media(max-width:600px) { .modal-wrapper--program .modal__body { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; padding-bottom: 40px } } .modal-wrapper--program .modal__title { font-size: 28px; font-weight: 700; line-height: 42px } @media(max-width:1200px) { .modal-wrapper--program .modal__title { font-size: 24px; font-weight: 800; line-height: 36px } } @media(max-width:900px) { .modal-wrapper--program .modal__title { margin-bottom: 12px } } .modal-wrapper--program .modal__text { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .modal-wrapper--program .modal__text { font-size: 14px; line-height: 20px } } @media(max-width:600px) { .modal-wrapper--program .modal-program { padding-right: 8px } } .modal-wrapper--program .modal-program__header { margin-bottom: 20px } @media(max-width:1200px) { .modal-wrapper--program .modal-program__header { margin-bottom: 16px } } .modal-wrapper--program .modal-program__subtitle { margin-bottom: 12px; font-size: 20px; font-weight: 600; line-height: 32px; color: var(--gray-1) } @media(max-width:1200px) { .modal-wrapper--program .modal-program__subtitle { font-size: 18px; line-height: 28px } } @media(max-width:900px) { .modal-wrapper--program .modal-program__subtitle { font-size: 16px; line-height: 20px } } .modal-wrapper--program .modal-program__items { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -8px -8px 20px } @media(max-width:1200px) { .modal-wrapper--program .modal-program__items { margin: -6px -6px 20px } } .modal-wrapper--program .modal-program__hint { font-size: 13px; font-weight: 400; line-height: 18px; color: var(--gray-3) } @media(max-width:1200px) { .modal-wrapper--program .modal-program__hint { font-size: 12px; line-height: 16px } } .modal-wrapper--program .item { width: calc(50% - 16px); margin: 8px } @media(max-width:1200px) { .modal-wrapper--program .item { width: calc(50% - 12px); margin: 6px } } @media(max-width:600px) { .modal-wrapper--program .item { width: calc(100% - 12px) } } .modal-wrapper--program .item__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .modal-wrapper--program .item__left { margin-right: 12px } .modal-wrapper--program .item__sale { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 48px; height: 48px; font-size: 16px; font-weight: 700; line-height: 24px; color: var(--primary-default); background-color: var(--primary-disable); border-radius: 100% } @media(max-width:1200px) { .modal-wrapper--program .item__sale { width: 44px; height: 44px; font-size: 14px; line-height: 20px } } @media(max-width:900px) { .modal-wrapper--program .item__sale { width: 40px; height: 40px } } .modal-wrapper--program .item__text { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .modal-wrapper--program .item__text { font-size: 14px; line-height: 20px } } .modal-wrapper--program ul { margin-bottom: 32px } @media(max-width:1200px) { .modal-wrapper--program ul { margin-bottom: 28px } } @media(max-width:900px) { .modal-wrapper--program ul { margin-bottom: 24px } } .modal-wrapper--program li { position: relative; padding-left: 12px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .modal-wrapper--program li { font-size: 14px; line-height: 20px } } .modal-wrapper--program li:before { position: absolute; top: 10px; left: 0; width: 4px; height: 4px; content: ""; background-color: var(--primary-default); border-radius: 100% } @media(max-width:1200px) { .modal-wrapper--program li:before { top: 8px } } .modal-wrapper--program li:not(:last-child) { margin-bottom: 8px } .modal-wrapper--payment { padding: 16px } .modal-wrapper--payment .modal { min-height: auto } @media(max-width:900px) { .modal-wrapper--payment .modal { padding: 48px 32px } } .modal-wrapper--payment .modal__title { margin-bottom: 20px } .modal-wrapper--payment .modal__body { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start } .modal-wrapper--payment .radio__custom { margin: 0 8px 0 0; font-size: 20px } .modal-wrapper--payment .order-radio:not(:last-child) { margin-bottom: 12px } .modal-wrapper--payment .modal__form .radio .radio__text { padding: 0; font-size: 16px; font-weight: 300; line-height: 24px } @media(max-width:900px) { .modal-wrapper--payment .modal__form .radio .radio__text { font-size: 14px; font-weight: 300; line-height: 20px } } .modal-wrapper--payment .modal__button { margin-top: 24px } @media(max-width:600px) { .modal-wrapper--order { padding: 0 } } .modal-wrapper--order .modal { max-width: 652px; padding: 64px 56px } @media(max-width:1200px) { .modal-wrapper--order .modal { padding: 54px 42px } } @media(max-width:900px) { .modal-wrapper--order .modal { padding: 42px 28px } } @media(max-width:768px) { .modal-wrapper--order .modal { padding: 40px 16px } } @media(max-width:600px) { .modal-wrapper--order .modal { max-width: 100%; height: 100%; max-height: 100%; padding-right: 8px; padding-bottom: 0; border-radius: 0 } } .modal-wrapper--order .modal__wrap { scrollbar-color: var(--primary-active) var(--gray-6); scrollbar-width: thin } @media(max-width:600px) { .modal-wrapper--order .modal__wrap { padding-right: 8px; overflow-x: hidden } } .modal-wrapper--order .modal__wrap::-webkit-scrollbar { width: 3px } .modal-wrapper--order .modal__wrap::-webkit-scrollbar-thumb { background: var(--primary-active); border-radius: 4px } .modal-wrapper--order .modal__wrap::-webkit-scrollbar-track { background: var(--gray-6); border-radius: 4px; -webkit-margin-after: 40px; margin-block-end: 40px } @media(max-width:600px) { .modal-wrapper--order .modal__body { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; padding-bottom: 44px } } .modal-wrapper--order .personal__order .item { padding: 0; background-color: transparent; border-radius: 0; -webkit-box-shadow: none; box-shadow: none } .modal-wrapper--order .personal__order .item__header { margin-bottom: 16px } .modal-wrapper--order .personal__order .item__order-number { color: var(--gray-1); cursor: default; border: 0 } .modal-wrapper--order .personal__order .item__order-number:hover { color: var(--gray-1) } .modal-wrapper--order .personal__order .item__order-text span:not(:last-child) { padding-right: 6px } .modal-wrapper--order .personal__order .item__order-text span:not(:last-child):after { right: 4px } .modal-wrapper--order .row { padding: 16px 0 } .modal-wrapper--order .row:first-child { border-top: 1px solid var(--gray-5) } .modal-wrapper--order .row:not(:last-child) { border-bottom: 1px solid var(--gray-5) } .modal-wrapper--order .row:last-child { padding-bottom: 0 } .modal-wrapper--order .row__header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 6px } .modal-wrapper--order .row__title { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0; font-size: 16px; font-weight: 700; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .modal-wrapper--order .row__title { font-size: 14px; line-height: 20px } } .modal-wrapper--order .row__title .svg { margin-right: 8px; font-size: 24px } @media(max-width:1200px) { .modal-wrapper--order .row__title .svg { font-size: 20px } } .modal-wrapper--order .row__body { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding-left: 32px } @media(max-width:1200px) { .modal-wrapper--order .row__body { padding-left: 28px } } .modal-wrapper--order .row__body-left { width: 100% } .modal-wrapper--order .row__text { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .modal-wrapper--order .row__text { font-size: 14px; line-height: 20px } } @media(max-width:600px) { .modal-wrapper--order .row__text { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } } .modal-wrapper--order .row__text:not(:last-child) { margin-bottom: 5px } @media(max-width:1200px) { .modal-wrapper--order .row__text:not(:last-child) { margin-bottom: 4px } } .modal-wrapper--order .row__text span { font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-3) } @media(max-width:1200px) { .modal-wrapper--order .row__text span { font-size: 13px; line-height: 18px } } @media(max-width:600px) { .modal-wrapper--order .row__text-wrap { display: -webkit-box; display: -ms-flexbox; display: flex } } @media(max-width:600px) { .modal-wrapper--order .row__text-wrap span { -ms-flex-negative: 0; flex-shrink: 0; width: auto; margin-right: 5px } } .modal-wrapper--order .row__price { font-size: 18px; font-weight: 800; line-height: 28px; color: var(--gray-1) } .modal-wrapper--order .row__edit { font-size: 16px; font-weight: 400; line-height: 24px; border-bottom: 1px dashed var(--primary-default); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .modal-wrapper--order .row__edit { font-size: 14px; line-height: 20px } } @media(max-width:600px) { .modal-wrapper--order .row__edit { display: none } } .modal-wrapper--order .row__edit:hover { color: var(--primary-hover); border-color: var(--primary-hover) } .modal-wrapper--order .row__edit--mobile { display: none } @media(max-width:600px) { .modal-wrapper--order .row__edit--mobile { display: inline-block } } .modal-wrapper--order .row__button { padding-left: 32px; margin-top: 16px } @media(max-width:1200px) { .modal-wrapper--order .row__button { padding-left: 28px; margin-top: 20px } } @media(max-width:600px) { .modal-wrapper--order .row__button { width: 100%; max-width: 100% } } .modal-wrapper--order .row__button .button { margin: 0 } @media(max-width:600px) { .modal-wrapper--order .row__button .button { width: 100% } } .modal-wrapper--order .row__link { font-size: 16px; font-weight: 400; line-height: 24px } @media(max-width:1200px) { .modal-wrapper--order .row__link { font-size: 14px; line-height: 20px } } .modal-wrapper--order .row__images { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -5px } .modal-wrapper--order .row__img { position: relative; max-width: 112px; margin: 5px } @media(max-width:1200px) { .modal-wrapper--order .row__img { max-width: 90px } } @media(max-width:900px) { .modal-wrapper--order .row__img { max-width: 72px } } .modal-wrapper--order .row__img img { width: 100%; height: 100%; border-radius: 8px; -o-object-fit: cover; object-fit: cover } .modal-wrapper--reminder { padding: 0 } .modal-wrapper--reminder .modal { padding: 56px 64px } @media(max-width:1200px) { .modal-wrapper--reminder .modal { padding: 54px 42px } } @media(max-width:900px) { .modal-wrapper--reminder .modal { padding: 42px 28px } } @media(max-width:768px) { .modal-wrapper--reminder .modal { padding: 40px 16px } } @media(max-width:600px) { .modal-wrapper--reminder .modal { max-width: 100%; height: 100%; max-height: 100%; padding-right: 8px; padding-bottom: 0; border-radius: 0 } } .modal-wrapper--reminder .modal__wrap { scrollbar-color: var(--primary-active) var(--gray-6); scrollbar-width: thin } @media(max-width:600px) { .modal-wrapper--reminder .modal__wrap { padding-right: 8px; overflow-x: hidden } } .modal-wrapper--reminder .modal__wrap::-webkit-scrollbar { width: 3px } .modal-wrapper--reminder .modal__wrap::-webkit-scrollbar-thumb { background: var(--primary-active); border-radius: 4px } .modal-wrapper--reminder .modal__wrap::-webkit-scrollbar-track { background: var(--gray-6); border-radius: 4px; -webkit-margin-after: 40px; margin-block-end: 40px } @media(max-width:600px) { .modal-wrapper--reminder .modal__body { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding-bottom: 44px } } .modal-wrapper--reminder .modal__title { margin-bottom: 20px } .modal-wrapper--reminder .modal__form .checkbox { margin: 0 } .modal-wrapper--reminder .modal__form .checkbox:not(:last-child) { margin-bottom: 8px } .modal-wrapper--reminder .modal__form .checkbox__text { padding-top: 0; font-size: 14px; line-height: 20px; color: var(--gray-1) } .modal-wrapper--reminder .modal__checkboxes { margin-top: 16px; margin-bottom: 20px } .modal-wrapper--reminder .modal__checkboxes-title { margin-top: 0; margin-bottom: 12px; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-1) } .modal-wrapper--reminder .modal__checkboxes-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .modal-wrapper--reminder .modal-row:not(:last-child) { margin-bottom: 12px } .modal-wrapper--reminder .modal-row__label { font-size: 14px; font-weight: 400; line-height: 20px } .modal-wrapper--reminder .modal-row__label sup { color: var(--error) } .modal-wrapper--reminder .modal-row__wrap .input { padding: 8px 11px } .modal-wrapper--reminder .dropdown { margin: 0 } .modal-wrapper--reminder .my-datepicker { width: 100% } .modal-wrapper--reminder .my-datepicker .my-datepicker-button__wrap { padding: 6px 11px } .modal-wrapper--reminder .my-datepicker .my-datepicker-button, .modal-wrapper--reminder .my-datepicker .my-datepicker-button__icon-wrapper { border-color: var(--gray-5) } .modal-wrapper--reminder .my-datepicker.active .my-datepicker-button, .modal-wrapper--reminder .my-datepicker.active .my-datepicker-button__icon-wrapper, .modal-wrapper--reminder .my-datepicker:hover .my-datepicker-button, .modal-wrapper--reminder .my-datepicker:hover .my-datepicker-button__icon-wrapper { border-color: var(--primary-default) } .modal-wrapper--reminder .my-datepicker__wrap { width: 100% } .modal-wrapper--reminder .my-datepicker__date { display: none } .modal-wrapper--reminder .my-datepicker__wrap--simple .my-datepicker__footer { display: block; padding: 0; border-top: 0 } .modal-wrapper--reminder .my-datepicker__wrap--simple .my-datepicker__footer .my-datepicker__buttons { padding: 12px 38px; background-color: var(--primary-disable); border-radius: 0 0 4px 4px } .modal-wrapper--reminder .my-datepicker__wrap--simple .my-datepicker__footer .my-datepicker__buttons .button { padding: 6px; font-size: 10px; font-weight: 600; line-height: 16px; text-transform: uppercase; letter-spacing: .02em } .modal-wrapper--reminder .my-datepicker__wrap .datepicker__header { padding: 0 8px 10px } .modal-wrapper--reminder .my-datepicker__wrap .datepicker__title { font-size: 16px; font-weight: 700; line-height: 24px } .modal-wrapper--reminder .my-datepicker__wrap .datepicker__cal thead th { font-size: 13px; font-weight: 600; line-height: 18px; color: var(--primary-default) } .modal-wrapper--reminder .menu-courses__settings .dropdown__content .my-datepicker__right, .modal-wrapper--reminder .modal--small .my-datepicker__right { padding: 14px 30px 0 } .modal-wrapper--sum { padding: 28px } .modal-wrapper--sum .modal { min-height: auto; padding: 40px 32px } .modal-sum .item:not(:last-child) { margin-bottom: 12px } .modal-sum .item__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: baseline; -ms-flex-align: baseline; align-items: baseline; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .modal-sum .item__key { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex: 1 1 46%; flex: 1 1 46%; -ms-flex-item-align: start; align-self: flex-start; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-3) } .modal-sum .item__key:after { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin: 0 6px; content: ""; border-bottom: 1px dashed var(--gray-4); -webkit-transform: translateY(-6px); transform: translateY(-6px) } .modal-sum .item__key--black { color: var(--gray-1) } .modal-sum .item__value { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-1) } .tooltip-postcard { z-index: 9; width: 180px; padding: 14px; visibility: hidden; background-color: var(--white); -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15); opacity: 0; -webkit-transition: opacity .2s ease, visibility .2s ease; transition: opacity .2s ease, visibility .2s ease } @media(max-width:900px) { .tooltip-postcard { display: none } } .tooltip-postcard[data-show] { visibility: visible; opacity: 1 } .tooltip-postcard__img-wrapper { position: relative; width: 100% } .tooltip-postcard__img-wrapper:before { display: block; width: 100%; padding-bottom: 100%; content: "" } .tooltip-postcard__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: cover; object-fit: cover } [data-tooltip-content].with-arrow:before { position: absolute; top: 100%; left: 50%; display: block; width: 0; height: 0; content: ""; border-left: 8px solid transparent; border-bottom: 0 solid transparent; border-right: 8px solid transparent; border-top: 8px solid var(--white); -webkit-transform: translateX(-50%); transform: translateX(-50%) } .tippy-box { left: 108px; min-width: 295px; background-color: var(--white); border-radius: 0; -webkit-box-shadow: 0 0 12px rgba(0, 0, 0, .15); box-shadow: 0 0 12px rgba(0, 0, 0, .15) } .tippy-arrow { left: -115px !important; color: var(--white) } .tippy-content { position: relative; z-index: 1; padding: 20px 16px } [data-accordion].active [data-accordion-button] .svg { -webkit-transform: rotate(180deg); transform: rotate(180deg) } [data-accordion-button] { --font-size: 16px; --line-height: 1.5; margin: 0; font-weight: 300 } [data-accordion-button] .svg { margin-left: 4px; font-size: 1rem; color: var(--black) } [data-accordion-content] { height: 100%; max-height: 0; overflow: hidden; -webkit-transition: max-height .5s ease; transition: max-height .5s ease } .accordion__inner { padding-bottom: .5rem } .my-datepicker { position: relative; margin: 0 } .my-datepicker.active { z-index: 4 } .my-datepicker.active .my-datepicker__wrap { display: block } .my-datepicker .datepicker-input { display: none } .my-datepicker .dropdown__content { bottom: auto; min-width: auto } .my-datepicker-button { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: 100%; font-size: 13px; cursor: pointer; background-color: var(--white); border: 1px solid var(--secondary-5); border-radius: 4px; -webkit-transition: border .2s ease; transition: border .2s ease } .my-datepicker-button__icon-wrapper { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 9px; margin: -1px; border: 1px solid var(--primary-default); border-radius: 0 4px 4px 0; -webkit-transition: background-color .2s ease, border .2s ease; transition: background-color .2s ease, border .2s ease } .my-datepicker-button__icon-wrapper:hover { color: var(--primary-hover); background-color: var(--primary-disable) } .my-datepicker-button__icon { margin: auto; font-size: 1.25rem } .my-datepicker-button__wrap { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 9px 12px; font-size: 14px; line-height: 20px } .menu-courses__settings .dropdown__content .my-datepicker-button__wrap, .modal--small .my-datepicker-button__wrap { padding: 6px } .my-datepicker-button__text { margin: auto 0; white-space: nowrap } .dropdown__button .my-datepicker-button__text { text-align: left } .my-datepicker__wrap { top: calc(100% + 10px); display: none; width: 628px; max-width: calc(100vw - 32px); padding: 0 } @media(max-width:600px) { .my-datepicker__wrap { max-width: 328px } } .menu-courses__settings .dropdown__content .my-datepicker__wrap, .modal--small .my-datepicker__wrap { max-width: 328px } .history-filter .my-datepicker__wrap.dropdown__content { min-width: auto } .modal-row .my-datepicker__wrap { max-width: 100% } .my-datepicker__wrap .datepicker { width: 100%; height: 100%; color: var(--main-color) } .my-datepicker__wrap .datepicker.custom .datepicker__wrapper { z-index: 4 !important; width: 100%; height: 100%; padding: 0; color: currentColor; background-color: var(--white); border: none; border-radius: 4px } .my-datepicker__wrap .datepicker.custom .datepicker__pane { float: left; width: 50%; padding: .5rem } .my-datepicker__wrap .datepicker.custom .datepicker__pane:not(:last-child) { border-right: 1px solid var(--secondary-6) } .my-datepicker__wrap .datepicker.custom .datepicker__pane:only-child { width: 100% } @media(max-width:600px) { .my-datepicker__wrap .datepicker.custom .datepicker__pane { width: 100%; border-right: none } } .menu-courses__settings .dropdown__content .my-datepicker__wrap .datepicker.custom .datepicker__pane, .modal--small .my-datepicker__wrap .datepicker.custom .datepicker__pane { width: 100% } .my-datepicker__wrap .datepicker.custom .datepicker__pane:not(:first-child) .datepicker__prev, .my-datepicker__wrap .datepicker.custom .datepicker__pane:not(:last-child) .datepicker__next { display: none } .my-datepicker__wrap .datepicker__wrapper { font-family: NunitoSans, Arial } .my-datepicker__wrap .datepicker__wrapper.disabled { pointer-events: none; opacity: .5 } .my-datepicker__wrap .datepicker__container { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100% } @media(max-width:600px) { .my-datepicker__wrap .datepicker__container { display: block } } .my-datepicker__wrap .datepicker__header { z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 2px 10px; margin: 0; background-color: transparent } .my-datepicker__wrap .datepicker__next, .my-datepicker__wrap .datepicker__prev { margin: 0; background-image: none } .my-datepicker__wrap .datepicker__next svg, .my-datepicker__wrap .datepicker__prev svg { font-size: 16px } .my-datepicker__wrap .datepicker__prev svg { -webkit-transform: rotate(90deg); transform: rotate(90deg) } .my-datepicker__wrap .datepicker__next svg { -webkit-transform: rotate(-90deg); transform: rotate(-90deg) } .my-datepicker__wrap .datepicker__titles { margin: auto } .my-datepicker__wrap .datepicker__titles select { display: none } .my-datepicker__wrap .datepicker__title { padding: 0; font-size: 12px; font-weight: 400; color: var(--main-color) } .my-datepicker__wrap .datepicker__cal tr { display: -webkit-box; display: -ms-flexbox; display: flex } .my-datepicker__wrap .datepicker__cal thead { display: block; margin: 0 } .my-datepicker__wrap .datepicker__cal thead th { font-size: 12px; font-weight: 600; line-height: 2; color: currentColor; text-transform: none } .my-datepicker__wrap .datepicker__cal tbody td { margin: 1px; font-size: 12px; font-weight: 400; color: currentColor } @media(max-width:600px) { .my-datepicker__wrap .datepicker__cal tbody td { margin: 3px; font-size: 14px } } .menu-courses__settings .dropdown__content .my-datepicker__wrap .datepicker__cal tbody td, .modal--small .my-datepicker__wrap .datepicker__cal tbody td { margin: 3px; font-size: 14px } .my-datepicker__wrap .datepicker__cal tbody td div { border-radius: 2px } .my-datepicker__wrap .datepicker__cal tbody td div:hover { background-color: var(--primary-disable) } .my-datepicker__wrap .datepicker__cal tbody td div:after { border-radius: 2px } .my-datepicker__wrap .datepicker__cal tbody td.pseudo-hover.is-otherMonth div { color: var(--secondary-5) } .my-datepicker__wrap .datepicker__cal tbody td.pseudo-hover div { background-color: var(--secondary-9) } .my-datepicker__wrap .datepicker__cal tbody td.is-today div { color: var(--primary-default) } .my-datepicker__wrap .datepicker__cal tbody td.is-selected div { background-color: var(--primary-default) } .my-datepicker__wrap .datepicker__cal tbody td.is-selected .datepicker__daynum { font-weight: 400 } .my-datepicker__wrap .datepicker__cal tbody td.is-selected:hover div:after { background-color: var(--primary-hover) } .my-datepicker__wrap .datepicker__cal tbody td.is-selected:not(.is-edge):hover .datepicker__daynum { color: var(--white) } .my-datepicker__wrap .datepicker__cal tbody td.is-selected:not(.is-edge) div { background-color: var(--secondary-9) } .my-datepicker__wrap .datepicker__cal tbody td.is-selected:not(.is-edge) .datepicker__daynum { color: var(--main-color) } .my-datepicker__wrap .datepicker__cal tbody td.is-otherMonth { color: rgba(var(--secondary-1-rgb), .4) } .my-datepicker__wrap .datepicker__cal tbody td.is-otherMonth.is-selected .datepicker__daynum { color: var(--main-color) } .my-datepicker__wrap .datepicker__cal tbody td.is-otherMonth.is-selected+.is-selected div:before, .my-datepicker__wrap .datepicker__cal tbody td.is-otherMonth.is-selected div { background-color: var(--primary-disable) } .my-datepicker__wrap--simple { right: 0; left: auto; width: 238px } .my-datepicker__wrap--simple .my-datepicker__left { display: none } .my-datepicker__wrap--simple .my-datepicker__right { display: block } .my-datepicker__wrap--simple .my-datepicker__footer { display: none } .my-datepicker__body { display: -webkit-box; display: -ms-flexbox; display: flex } @media(max-width:600px) { .my-datepicker__body { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .menu-courses__settings .dropdown__content .my-datepicker__body, .modal--small .my-datepicker__body { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .my-datepicker__left { width: 100%; max-width: 150px } @media(max-width:600px) { .my-datepicker__left { max-width: none } } .menu-courses__settings .dropdown__content .my-datepicker__left, .modal--small .my-datepicker__left { max-width: none; border-right: none } .my-datepicker__list { height: 100%; padding: 10px 0 } .my-datepicker__button { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; padding: 6px 12px; font-size: 12px; font-weight: 400; line-height: 1.5; cursor: pointer } @media(max-width:600px) { .my-datepicker__button { padding: 6px 32px } } .menu-courses__settings .dropdown__content .my-datepicker__button, .modal--small .my-datepicker__button { padding: 6px 32px } .my-datepicker__button.selected, .my-datepicker__button:hover { background-color: var(--secondary-9) } .my-datepicker__button.selected { color: var(--primary-default) } .my-datepicker__right { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } @media(max-width:600px) { .my-datepicker__right { padding: 5px 0 } } .menu-courses__settings .dropdown__content .my-datepicker__right, .modal--small .my-datepicker__right { padding: 10px 20px } .my-datepicker__footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; padding: 8px 16px; border-top: 1px solid var(--secondary-6) } @media(max-width:600px) { .my-datepicker__footer { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset; padding: 12px 20px 20px } } .menu-courses__settings .dropdown__content .my-datepicker__footer, .modal--small .my-datepicker__footer { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset; padding: 12px 20px 20px } .my-datepicker__time { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 0 38px 16px } .my-datepicker__time-text { font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-2); opacity: .7 } .my-datepicker .input-wrapper { max-width: 120px } .my-datepicker .input-wrapper .input { padding: 6px 11px } .my-datepicker__date { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-right: 12px; font-size: 12px; line-height: 1.4 } @media(max-width:600px) { .my-datepicker__date { margin-right: 0; margin-bottom: 12px; font-size: 14px; line-height: 1.7 } } .menu-courses__settings .dropdown__content .my-datepicker__date, .modal--small .my-datepicker__date { margin-right: 0; margin-bottom: 12px; font-size: 14px; line-height: 1.7 } .my-datepicker__buttons { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex } @media(max-width:600px) { .my-datepicker__buttons { width: 100% } } .menu-courses__settings .dropdown__content .my-datepicker__buttons, .modal--small .my-datepicker__buttons { width: 100% } .my-datepicker__buttons .button { padding-right: 12px; padding-left: 12px; margin: 0 } @media(max-width:600px) { .my-datepicker__buttons .button { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding-top: 10px; padding-bottom: 10px } } .benefits-line__block { margin: 30px 0 20px 0; } .benefits-line__block h2 { /*text-align: center;*/ } .benefits-line__wrap { display: grid; grid-template-columns: repeat(4, 1fr); gap: 30px; } .benefits-line__item { display: flex; flex-direction: column; align-items: center; } .benefits-line__icon { margin: 0 0 20px; } .benefits-line__image {} .benefits-line__title { text-align: center; font-size: 18px; font-weight: 900; line-height: 1.2; } @media(max-width: 768px) { .benefits-line__title { font-size: 15px; } } @media(max-width: 600px) { .benefits-line__wrap { grid-template-columns: repeat(2, 1fr); } } .menu-courses__settings .dropdown__content .my-datepicker__buttons .button, .modal--small .my-datepicker__buttons .button { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding-top: 10px; padding-bottom: 10px } .menu-courses__settings .dropdown__content .my-datepicker__buttons .button:not(:last-child), .modal--small .my-datepicker__buttons .button:not(:last-child), .my-datepicker__buttons .button:not(:last-child) { margin-right: 8px } .product { position: relative; z-index: 1; background-color: var(--white); -webkit-transition: z-index .2s ease, -webkit-box-shadow .2s ease; transition: z-index .2s ease, -webkit-box-shadow .2s ease; transition: box-shadow .2s ease, z-index .2s ease; transition: box-shadow .2s ease, z-index .2s ease, -webkit-box-shadow .2s ease } .product:hover { z-index: 2; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } .product__wrap .product__content .product-card__item { width: 100%; } .product__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; padding: 8px; -webkit-box-shadow: 0 0 0 1px var(--gray-6); box-shadow: 0 0 0 1px var(--gray-6) } @media(max-width:900px) { .product__wrap { padding: 12px } } .product__img-wrapper { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; border-radius: 8px } @media(max-width:900px) { .product__img-wrapper { border-radius: 4px } } .product__img-wrapper:before { display: block; width: 100%; padding-bottom: 100%; content: "" } .product__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: inherit; -o-object-fit: cover; object-fit: cover } .product__hint { position: absolute; top: 16px; left: 0; z-index: 1; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 4px 10px; font-size: 12px; font-weight: 700; line-height: 16px; color: #fff; text-transform: uppercase; background-color: var(--primary-default); border-radius: 0 2px 2px 0 } .product__hint--rose { background-color: var(--accent-rose) } @media(max-width:900px) { .product__hint { top: 6px; padding: 2px 4px; font-size: 8px; line-height: 12px } } .product__sizes { position: absolute; bottom: 0; left: 0; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; padding: 6px 11px; background-color: rgba(var(--white-rgb), .7); border-radius: 0 4px 0 8px } @media(max-width:900px) { .product__sizes { padding: 4px; border-radius: 0 4px 0 4px } } .product__size { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 12px; line-height: 19px; color: var(--gray-2) } @media(max-width:900px) { .product__size { font-size: 8px; font-weight: 600; line-height: 12px } } .product__size:not(:last-child) { margin-right: 10px } @media(max-width:900px) { .product__size:not(:last-child) { margin-right: 6px } } .product__size:before { position: absolute; bottom: -2px; left: 0; z-index: 1; display: block; width: 24px; height: 4px; color: currentColor; content: ""; background-color: currentColor; -webkit-mask: url(/local/templates/rozbl22/assets/css/../images/size_h.svg) no-repeat 50% 50%; mask: url(/local/templates/rozbl22/assets/css/../images/size_h.svg) no-repeat 50% 50%; -webkit-mask-size: contain; mask-size: contain } @media(max-width:900px) { .product__size:before { width: 14px } } .product__size--vertical { padding-left: 7px } @media(max-width:900px) { .product__size--vertical { padding-left: 6px } } .product__size--vertical:before { top: 50%; bottom: auto; left: -2px; width: 4px; height: 24px; -webkit-mask: url(/local/templates/rozbl22/assets/css/../images/size_w.svg) no-repeat 50% 50%; mask: url(/local/templates/rozbl22/assets/css/../images/size_w.svg) no-repeat 50% 50%; -webkit-transform: translateY(-50%); transform: translateY(-50%) } @media(max-width:900px) { .product__size--vertical:before { height: 14px } } .product__like { --font-size: 36px; position: absolute; top: 8px; right: 8px; margin: 0; color: var(--primary-default); border: none } @media(max-width:900px) { .product__like { --font-size: 20px; top: 4px; right: 4px } } .product__like:hover svg { fill: var(--secondary-5) } .product__like.active { color: var(--secondary-7) } .product__like.active svg { fill: var(--primary-default) } .product__like svg { font-size: inherit; fill: rgba(var(--white-rgb), .7) } .product__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 2rem 1.5rem 1.5rem } @media(max-width:900px) { .product__content { padding: 16px 0 0 } } .product__desc { margin: 0 0 28px } @media(max-width:900px) { .product__desc { margin: 0 0 12px } } .product__title { margin: 0; font-size: 1rem; font-weight: 600; line-height: 1.25; color: inherit } .product__footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: auto } @media(max-width:1400px) { .product__footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } } .product-price { margin-right: .5rem } @media(max-width:1400px) { .product-price { margin-right: 0; margin-bottom: 8px } } .product-price__old { display: block; font-size: 1rem; line-height: 1.5; color: var(--gray-4); text-decoration: line-through } @media(max-width:900px) { .product-price__old { font-size: 10px; line-height: 14px } } .product-price__current { display: block; margin-top: -9px; margin-bottom: -7px; font-size: 1.5rem; font-weight: 800; line-height: 1.5 } @media(max-width:900px) { .product-price__current { margin-top: -4px; margin-bottom: -2px; font-size: 14px; line-height: 20px } } .product__quantity { display: block; font-size: 12px; line-height: 20px; color: var(--primary-default) } @media(max-width:900px) { .product__quantity { font-size: 10px; font-weight: 600; line-height: 16px } } .product__button { --padding: 6px 14px; min-width: auto; margin: 0 0 0 auto } @media(max-width:1400px) { .product__button { width: 100%; margin: 0 } } @media(max-width:900px) { .product__button { --font-size: 12px; --padding: 4px 14px; width: auto; font-weight: 600 } } .product__button svg { font-size: 2rem } @media(max-width:900px) { .product__button svg { font-size: 20px } .product__button svg:not(:first-child) { margin-left: 4px } } .product--in-basket .product__button { --color: var(--primary-default); --bg-color: var(--primary-disable); --border-color: var(--primary-active) } .product--in-basket .product__button span { color: var(--color-hover) } .product--in-basket .product__button svg { color: var(--black) } .basket-product { display: -webkit-box; display: -ms-flexbox; display: flex } .basket-product:not(:last-child) { margin-bottom: 1px } .basket-product__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; width: 100%; padding: 1.5rem; -webkit-box-shadow: 0 0 0 1px var(--gray-6); box-shadow: 0 0 0 1px var(--gray-6) } @media(max-width:1200px) { .basket-product__wrap { padding: 20px } } @media(max-width:700px) { .basket-product__wrap { padding: 12px } } .basket-product__inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } .basket-product__top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .basket-product__top:not(:last-child) { margin-bottom: 16px } @media(max-width:700px) { .basket-product__top { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset } } .basket-product .product__img-wrapper { max-width: 152px; margin: 0 16px auto 0 } @media(max-width:1200px) { .basket-product .product__img-wrapper { max-width: 110px } } @media(max-width:700px) { .basket-product .product__img-wrapper { max-width: 68px; margin-right: 10px } } .basket-product__desc { width: 100%; max-width: 500px; margin-right: 40px } @media(max-width:1200px) { .basket-product__desc { margin-right: 24px } } @media(max-width:700px) { .basket-product__desc { padding-top: 10px; margin-right: 0; margin-bottom: 16px } } .basket-product__title { margin: 0 0 14px; font-size: 16px; font-weight: 600; line-height: 1.5 } @media(max-width:900px) { .basket-product__title { font-size: 12px } } .basket-product__text { font-size: 14px; line-height: 1.4286 } .basket-product .product__sizes { position: static; padding: 0; background-color: transparent; border-radius: 0 } .basket-product .product__size { font-weight: 600 } @media(max-width:900px) { .basket-product .product__size { font-size: 12px } } .basket-product__total { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } @media(max-width:700px) { .basket-product__total { -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end } } .basket-product__total .counter-wrapper { width: 100%; max-width: 118px; margin-right: 65px } @media(max-width:1200px) { .basket-product__total .counter-wrapper { margin-right: 20px } } .basket-product__total .product-card__price-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; width: 150px; margin: 0 0 0 auto } @media(max-width:1200px) { .basket-product__total .product-card__price-wrapper { width: 120px } } @media(max-width:700px) { .basket-product__total .product-card__price-wrapper { width: auto } } .basket-product__total .product-card__price-wrapper .product-price { margin-bottom: 0; white-space: nowrap } @media(max-width:900px) { .basket-product__total .product-card__price-wrapper .product-price__old { font-size: 12px; line-height: 18px } } @media(max-width:900px) { .basket-product__total .product-card__price-wrapper .product-price__current { font-size: 18px; font-weight: 800; line-height: 28px } } .basket-product__total .product-card__price { margin-top: auto; font-size: 28px; font-weight: 700; color: var(--primary-default); white-space: nowrap } @media(max-width:900px) { .basket-product__total .product-card__price { font-size: 22px } } .basket-product__total .product-card__price--old { position: relative; margin: 0; font-size: 20px; font-weight: 400; color: var(--secondary-2) } .basket-product__total .product-card__price--old:before { position: absolute; top: 50%; left: 0; z-index: 1; width: 100%; height: 1px; content: ""; background-color: var(--primary-default); -webkit-transform: translateY(-50%); transform: translateY(-50%) } .basket-product__bottom { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: auto } @media(max-width:700px) { .basket-product__bottom { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset } } .basket-product .catalog-card__status { margin-right: 15px } @media(max-width:700px) { .basket-product .catalog-card__status { margin-right: 0; margin-bottom: 15px } } .basket-product__controls { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; margin: 0 0 0 auto } @media(max-width:700px) { .basket-product__controls { -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-left: 0 } } .basket-product__controls .button { --font-size: 13px; --line-height: 20px; margin: 0; font-weight: 400 } @media(max-width:700px) { .basket-product__controls .button { --font-size: 12px; --line-height: 16px } } .basket-product__controls .button.active { --color: var(--primary-default) } .basket-product__controls .button.active svg { fill: currentColor } .basket-product__controls .button:not(:last-child) { margin-right: 32px } @media(max-width:700px) { .basket-product__controls .button:not(:last-child) { margin-right: 10px } } .basket-product__controls .button svg { fill: transparent } @media(max-width:700px) { .basket-product__controls .button svg { font-size: 16px } } .header-basket { position: absolute; top: calc(100% + 10px); right: 0; z-index: 1; min-width: 476px; visibility: hidden; background-color: var(--white); border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15); opacity: 0; -webkit-transition: opacity .2s ease, visibility .2s ease; transition: opacity .2s ease, visibility .2s ease; -webkit-transition-delay: .1s; transition-delay: .1s } .header__control:hover .header-basket { visibility: visible; opacity: 1; -webkit-transition-delay: 0s; transition-delay: 0s } @media(max-width:900px) { .header-basket { display: none } } .header-basket:before { position: absolute; right: 26px; bottom: 100%; display: block; width: 0; height: 0; content: ""; border-left: 7px solid transparent; border-bottom: 7px solid var(--white); border-right: 7px solid transparent; border-top: 0 solid transparent } .header-basket__wrap { position: relative; z-index: 1; overflow: hidden; background-color: var(--white); border-radius: 8px } .header-basket__list { max-height: 354px; padding: 0 24px 0 16px; overflow-x: hidden; scrollbar-color: var(--primary-active) var(--gray-6); scrollbar-width: thin } .header-basket__list::-webkit-scrollbar { width: 3px } .header-basket__list::-webkit-scrollbar-thumb { background: var(--primary-active); border-radius: 4px } .header-basket__list::-webkit-scrollbar-track { background: var(--gray-6); border-radius: 4px } .header-basket__item:first-child { margin-top: 18px } .header-basket__item:last-child { margin-bottom: 18px } .header-basket__footer { position: relative; z-index: 1; padding: 18px 20px; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } .header-basket__total { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .header-basket__total .button { margin: 0 } .header-basket-price { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-right: 20px } .header-basket-price__text { font-size: 14px; line-height: 1.4286; color: var(--gray-3) } .header-basket-price__num { display: block; font-size: 24px; font-weight: 800 } .header-basket-product { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; padding: 8px 16px 8px 8px; border-radius: 4px } .header-basket-product:hover { background-color: var(--gray-8) } .header-basket-product:hover .header-basket-product__top .button-icon { opacity: 1 } .header-basket-product__img-wrapper { display: block; width: 100%; max-width: 88px; margin-right: 1rem; overflow: hidden; border-radius: 4px } .header-basket-product__img-container { position: relative; width: 100%; padding-bottom: 100%; border-radius: inherit } .header-basket-product__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: inherit; -o-object-fit: cover; object-fit: cover } .header-basket-product__wrap { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } .header-basket-product__top { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .header-basket-product__top .button-icon { --size: 24px; --font-size: 24px; margin: 0 0 0 20px; opacity: 0 } .header-basket-product__top .button-icon svg { font-size: inherit } .header-basket-product__desc { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } .header-basket-product__title { display: block; margin: 0; font-size: 14px; font-weight: 600; line-height: 1.4286; color: inherit } .header-basket-product__total { margin-left: .75rem; text-align: right } .header-basket-product__price { display: block; font-size: 1.125rem; font-weight: 800; line-height: 1.3333; color: var(--black); white-space: nowrap } .header-basket-product__price--old { font-size: 1rem; font-weight: 400; line-height: 1.5; color: var(--gray-4) } .basket-aside { position: sticky; top: calc(var(--header-height, 64px) + 20px); -webkit-box-flex: 0; -ms-flex: 0 0 340px; flex: 0 0 340px; margin-left: 2.5rem } @media(max-width:1200px) { .basket-aside { -webkit-box-flex: 0; -ms-flex: 0 0 300px; flex: 0 0 300px; margin-left: 24px } } @media(max-width:900px) { .basket-aside { position: static; top: 0; -webkit-box-flex: 0; -ms-flex: 0; flex: 0; margin-top: 32px; margin-left: 0 } } .basket-aside__wrap { padding: 2.5rem 2rem; background-color: var(--white); border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } @media(max-width:900px) { .basket-aside__wrap { padding: 32px 24px } } .basket-aside__wrap>.checkbox { margin-top: 16px } @media(max-width:900px) { .basket-aside__wrap>.checkbox { margin-top: 12px } } .basket-aside__wrap>.checkbox .checkbox__custom { margin-right: 8px; font-size: 16px } @media(max-width:900px) { .basket-aside__wrap>.checkbox .checkbox__custom { font-size: 20px } } .basket-aside__wrap>.checkbox .checkbox__text { font-size: 12px; line-height: 16px; color: var(--gray-3) } .basket-aside__wrap>.checkbox .checkbox__icon { font-size: 13px } @media(max-width:900px) { .basket-aside__wrap>.checkbox .checkbox__icon { font-size: 16px } } .basket-aside__total { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 1rem; font-size: 28px; font-weight: 700; line-height: 1.5 } @media(max-width:900px) { .basket-aside__total { margin-bottom: 16px; font-size: 24px } } .basket-aside__total span { margin-right: 20px } .basket-aside__total em { font-weight: 700 } .basket-aside__title { margin: 0 0 24px; font-size: 1.5rem; line-height: 1.5; text-transform: uppercase } .basket-aside .product-card__item:not(:last-child) { margin-bottom: 12px } @media(max-width:900px) { .basket-aside .product-card__item:not(:last-child) { margin-bottom: 14px } } .basket-aside .product-card__item .product-card__key:after { color: var(--gray-6) } .basket-aside .product-card__item .product-card__value { color: var(--gray-3) } .basket-aside .product-card__item--total { margin-top: 18px } @media(max-width:900px) { .basket-aside .product-card__item--total { margin-top: 16px } } .basket-aside .product-card__item--total .product-card__key { font-size: 1.25rem; font-weight: 700; line-height: 1.4; color: var(--color-main) } @media(max-width:900px) { .basket-aside .product-card__item--total .product-card__key { font-size: 18px; line-height: 28px } } .basket-aside .product-card__item--total .product-card__key:after { content: none } .basket-aside .product-card__item--total .product-card__value { font-size: 1.25rem; font-weight: 800; line-height: 1.4; color: var(--color-main) } @media(max-width:900px) { .basket-aside .product-card__item--total .product-card__value { font-size: 18px; line-height: 28px } } .basket-aside .product-card__list:not(:last-child) { margin-bottom: 20px } .basket-aside .product-card__list--col .product-card__item { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .basket-aside .product-card__list--col .product-card__item:not(:last-child) { margin-bottom: 12px } .basket-aside .product-card__list--col .product-card__key { margin-right: 0; margin-bottom: 4px } .basket-aside .product-card__list--col .product-card__key:after { content: none } .basket-aside .product-card__list--col .product-card__value { color: var(--color-main); text-align: left; white-space: normal } .basket-aside .product-card__list .product-card__value { white-space: normal } .basket-aside__form { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: 100%; height: var(--size-btn); margin-top: 16px } .basket-aside__form .input-wrapper { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin: 0 -2px 0 0; border-top-right-radius: 0; border-bottom-right-radius: 0 } .basket-aside__form .input-wrapper:focus { -webkit-box-shadow: none; box-shadow: none } .basket-aside__form .button { margin: 0; border-top-left-radius: 0; border-bottom-left-radius: 0 } .basket-aside .basket-aside-promocode { margin-top: 24px } @media(max-width:900px) { .basket-aside .basket-aside-promocode { margin-top: 20px } } .basket-aside .basket-aside-promocode:not(.show) .basket-aside-promocode__wrap { display: none } .basket-aside .basket-aside-promocode .basket-aside__form { max-width: none } .basket-aside .basket-aside-promocode .basket-aside__form .input { width: 100% } .basket-aside .basket-aside-promocode .checkbox { margin: 0 } .basket-aside .basket-aside-promocode .checkbox__custom { width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin-right: 12px; font-size: 24px } @media(max-width:900px) { .basket-aside .basket-aside-promocode .checkbox__custom { font-size: 20px } } .basket-aside .basket-aside-promocode .checkbox__icon { width: 1em; height: 1em; font-size: 19px } .basket-aside .basket-aside-promocode .checkbox__text { padding-top: 2px; font-size: 1rem } @media(max-width:900px) { .basket-aside .basket-aside-promocode .checkbox__text { font-size: 16px } } .basket-aside__button { width: 100%; margin: 24px 0 0 } @media(max-width:900px) { .basket-aside__button { margin-top: 20px } } .basket-aside__list { margin-bottom: 20px } .basket-aside__item:not(:last-child) { margin-bottom: 12px } .basket-aside hr { width: 100%; margin: 0 0 20px; border: none; border-bottom: 1px solid var(--gray-5) } .basket-aside-product { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .basket-aside-product .product__img-wrapper { max-width: 72px; margin-right: 12px } .basket-aside-product__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .basket-aside-product__wrap .basket-product__title { margin: 0; font-size: 14px; line-height: 20px } .basket-aside-product__wrap .product-price { margin: 0 0 0 12px; white-space: nowrap } .basket-aside-product__wrap .product-price__current { margin: 0; font-size: 1rem; line-height: 1.5 } .personal-aside { position: sticky; top: calc(var(--header-height, 64px) + 20px); -webkit-box-flex: 0; -ms-flex: 0 0 248px; flex: 0 0 248px; width: 100%; margin-right: 80px } @media(max-width:1200px) { .personal-aside { -webkit-box-flex: 0; -ms-flex: 0 0 225px; flex: 0 0 225px } } @media(max-width:900px) { .personal-aside { -webkit-box-flex: 0; -ms-flex: 0 0 200px; flex: 0 0 200px } } @media(max-width:768px) { .personal-aside { display: none } } .personal-aside__wrap { padding: 24px 0 32px; background-color: var(--white); border: 1px solid var(--gray-5) } @media(max-width:1200px) { .personal-aside__wrap { padding: 16px 0 24px } } .personal-aside__list { margin-bottom: 16px } @media(max-width:1200px) { .personal-aside__list { margin-bottom: 12px } } @media(max-width:900px) { .personal-aside__list { margin-bottom: 8px } } .personal-aside__item { position: relative; padding: 8px 24px } @media(max-width:1200px) { .personal-aside__item { padding: 8px 20px } } @media(max-width:900px) { .personal-aside__item { padding: 8px 16px } } .personal-aside__item:before { position: absolute; top: 0; left: 0; width: 4px; height: 100%; visibility: hidden; content: ""; background-color: var(--primary-default); opacity: 0 } .personal-aside__item:not(:last-child) { margin-bottom: 8px } @media(max-width:1200px) { .personal-aside__item:not(:last-child) { margin-bottom: 6px } } @media(max-width:900px) { .personal-aside__item:not(:last-child) { margin-bottom: 4px } } .personal-aside__item.selected:before { visibility: visible; opacity: 1 } .personal-aside__item.selected .personal-aside__link { font-weight: 600 } .personal-aside__link { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal-aside__link { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal-aside__link { font-size: 13px; line-height: 18px } } .personal-aside__link .svg { margin-right: 12px; font-size: 24px } @media(max-width:1200px) { .personal-aside__link .svg { margin-right: 10px; font-size: 20px } } @media(max-width:900px) { .personal-aside__link .svg { margin-right: 8px; font-size: 16px } } .personal-aside__exit { padding: 24px 0 0; margin: 0 24px; border-top: 1px solid var(--gray-5) } @media(max-width:1200px) { .personal-aside__exit { padding: 20px 0 0; margin: 0 20px } } @media(max-width:900px) { .personal-aside__exit { padding: 16px 0 0; margin: 0 16px } } .personal-aside__exit .personal-aside__link { color: var(--gray-3) } .personal-aside__exit .personal-aside__link:hover { color: var(--primary-hover) } * { -webkit-box-sizing: border-box; box-sizing: border-box } ::-moz-selection { background: var(--primary-disable) } ::selection { background: var(--primary-disable) } html:not(.is-ready) * { -webkit-transition: none !important; transition: none !important } body, html { width: 100%; height: 100% } .content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; min-height: 100% } main { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } section { padding: 60px 0 } @media(max-width:1100px) { section { padding: 40px 0 } } @media(max-width:600px) { section { padding: 20px 0 } } .container { --container-padding: 16px; --container-padding-native: 16px; width: 100%; max-width: 1404px; padding: 0 16px; margin: 0 auto } .header { position: sticky; top: 0; z-index: 9; width: 100%; background-color: var(--white) } .header:before { position: absolute; bottom: 0; left: 50%; width: 100%; height: 1px; content: ""; background-color: var(--gray-6); -webkit-transform: translateX(-50%); transform: translateX(-50%) } /* .header .container { max-width: 1760px } */ .header__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .header__left { -webkit-box-flex: 0; -ms-flex: 0 0 100px; flex: 0 0 100px; margin-right: 5rem } @media(max-width:1500px) { .header__left { margin-right: 2rem } } @media(max-width:900px) { .header__left { -webkit-box-flex: 0; -ms-flex: 0 0 72px; flex: 0 0 72px; margin-right: 1rem } } .header__center { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin: 0 auto } @media(max-width:900px) { .header .header__center { display: none } } .header__nav { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex } .header__nav:not(:last-child) { margin-right: 2rem } @media(max-width:1100px) { .header .header__nav { display: none } } .header__link { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; padding: 8px 0; font-family: NunitoSans, Arial; font-size: 1rem; font-weight: 600; line-height: 1.5; color: inherit; text-align: center; -webkit-transition: color .2s ease; transition: color .2s ease } .header__link:hover { color: var(--primary-default) } .header__link.selected:before { opacity: 1 } .header__link:not(:last-child) { margin-right: 32px } @media(max-width:1500px) { .header__link:not(:last-child) { margin-right: 1rem } } .header__link:before { position: absolute; bottom: 0; left: 50%; display: block; width: 100%; height: 2px; pointer-events: none; content: ""; background-color: var(--black); opacity: 0; -webkit-transform: translateX(-50%); transform: translateX(-50%) } .header__link svg { margin-right: 8px; font-size: 20px } .header__link>a { color: inherit } .header__link--catalog { position: relative } @media(hover:hover) { .header__link--catalog:hover .catalog-popup, .header__link--catalog:hover .catalog-popup-gift, .header__link--catalog:hover .catalog-popup-about { display: block; opacity: 1 } } .header__search { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; max-width: 400px; padding: 10px 0; margin: 0 auto } @media(max-width:1100px) { .header__search { max-width: none } } .header__search .dropdown { width: 100%; margin: 0 } .header__search .dropdown__content { right: 0; left: auto; min-width: 270px } .header__search .dropdown__list { max-height: 360px } .header__search .input-wrapper { width: 100%; margin: 0 } .header__right { padding-left: 2rem; margin-left: auto } @media(max-width:1500px) { .header__right { padding-left: 1rem } } @media(max-width:900px) { .header__right { padding-left: 0 } } .header__phone { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 1rem; font-weight: 600; line-height: 1.5; color: inherit; -webkit-transition: color .2s ease; transition: color .2s ease } .header-phones__title { margin-bottom: 4px; font-size: 14px; line-height: 1.2857; color: var(--gray-4) } .header-phones .header__phone:not(:last-child) { margin-bottom: 4px } .header__controls { display: -webkit-box; display: -ms-flexbox; display: flex; height: 100%; margin-right: -15px } .header__control { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center } .header__control:not(:last-child):after { position: absolute; top: 50%; right: -1px; display: block; width: 1px; height: 68.75%; content: ""; background-color: var(--gray-6); -webkit-transform: translateY(-50%); transform: translateY(-50%) } @media(min-width:1501px) { .header__control--phone>.button-icon { display: none } } .header__control--phone>.button-icon:hover~.header__dropdown .dropdown__content { visibility: visible; opacity: 1; -webkit-transform: none; transform: none } @media(max-width:600px) { .header__control--phone>.button-icon~.header__dropdown { display: none } } @media(max-width:900px) { .header__control--profile { display: none } } @media(min-width:1101px) { .header__control--hamburger { display: none } } .header__control .header__dropdown .dropdown>.button-icon, .header__control>.button-icon { --size: 64px; --font-size: 32px; --padding: 16px; --color: inherit; margin: auto } @media(max-width:900px) { .header__control .header__dropdown .dropdown>.button-icon, .header__control>.button-icon { --size: 52px; --font-size: 28px; --padding: 12px; height: 100%; min-height: 48px } } .header__control .header__dropdown .dropdown>.button-icon>div, .header__control>.button-icon>div { position: relative } .header__control .header__dropdown .dropdown>.button-icon svg, .header__control>.button-icon svg { margin: 0 !important; font-size: inherit; fill: transparent } .header__dropdown { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .header__dropdown:hover .dropdown__content { visibility: visible; opacity: 1; -webkit-transform: none; transform: none } .header__dropdown .dropdown { height: 100%; margin: 0 } @media(min-width:1501px) { .header__dropdown .dropdown { padding-right: 16px } } .header__dropdown .dropdown.active .dropdown__button { --color: var(--color-main) } .header__dropdown .dropdown__button { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } @media(max-width:1500px) { .header__dropdown .dropdown__button { display: none } } .header__dropdown .dropdown>.button-icon { margin: 0 } @media(min-width:1501px) { .header__dropdown .dropdown>.button-icon { display: none } } .header__dropdown .dropdown__arrow-wrapper { margin-left: 6px; font-size: 1rem; cursor: pointer; -webkit-transition: color .2s ease; transition: color .2s ease } .header__dropdown .dropdown__arrow-wrapper:hover { color: var(--primary-default) } .header__dropdown .dropdown__content { right: 0; left: auto; min-width: 224px; padding: 20px 24px; border-radius: 4px } .logo { position: relative; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; width: 100%; max-width: 100px; margin: 7px 0; -webkit-transition: color .2s ease; transition: color .2s ease } @media(max-width:900px) { .logo { max-width: 72px; margin: 6px 0 } } .logo:before { display: block; width: 100%; padding-bottom: 50%; content: "" } .logo__icon { position: absolute; top: 0; left: 0; width: 100%; min-width: auto; height: 100%; min-height: auto } .controls { position: fixed; right: 5rem; bottom: 2.5rem; z-index: 9; visibility: hidden; opacity: 0; -webkit-transition: opacity .25s ease, visibility .25s ease, -webkit-transform .25s ease; transition: opacity .25s ease, visibility .25s ease, -webkit-transform .25s ease; transition: opacity .25s ease, visibility .25s ease, transform .25s ease; transition: opacity .25s ease, visibility .25s ease, transform .25s ease, -webkit-transform .25s ease; -webkit-transform: translateX(50%); transform: translateX(50%) } @media(max-width:1500px) { .controls { right: 24px; bottom: 80px } } @media(max-width:900px) { .controls { right: 16px; bottom: 104px } } .controls.show { visibility: visible; opacity: 1; -webkit-transform: none; transform: none } .controls.show .button--top { -webkit-transform: translateY(-50%); transform: translateY(-50%) } .controls__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .control:not(:first-child) { margin-top: 1rem } @media(max-width:900px) { .control:last-child { display: none } } .control .button-icon { --size: 48px; --font-size: 28px; --padding: 5px; margin: 0 } @media(max-width:900px) { .control .button-icon { --size: 44px; --font-size: 24px } } .control .button-icon .svg { font-size: inherit } .control-social { position: relative } .control-social.active .control-social__show { display: none } .control-social.active .control-social__hide { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex } .control-social.active .social { visibility: visible; opacity: 1; -webkit-transform: translateY(-50%); transform: translateY(-50%) } .control-social__hide { display: none } .control-social .social { position: absolute; top: 50%; right: calc(100% + 16px); min-width: auto; visibility: visible; opacity: 0; -webkit-transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease; transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease; transition: opacity .2s ease, visibility .2s ease, transform .2s ease; transition: opacity .2s ease, visibility .2s ease, transform .2s ease, -webkit-transform .2s ease; -webkit-transform: translateY(-50%) translateX(50%); transform: translateY(-50%) translateX(50%) } @media(max-width:900px) { .control-social .social { right: calc(100% + 12px) } } .control-social .social-link { font-size: 2.5rem } @media(max-width:900px) { .control-social .social-link { font-size: 32px } } .control-social .social-link:not(:last-child) { margin-right: 1rem } @media(max-width:900px) { .control-social .social-link:not(:last-child) { margin-right: 12px } } .breadcrumbs-section { padding: 24px 0 20px; overflow: hidden } @media(max-width:900px) { .breadcrumbs-section { padding: 24px 0 10px } } .breadcrumbs-section+main section:first-of-type { padding-top: 20px } @media(max-width:900px) { .breadcrumbs-section+main section:first-of-type { padding-top: 10px } } .breadcrumbs__list { display: -webkit-box; display: -ms-flexbox; display: flex; max-width: 100%; margin: -4px } @media(max-width: 900px) { .breadcrumbs__list { margin: -2px; } } @media(max-width: 767px) { .breadcrumbs__list { display: block; padding-bottom: 6px; white-space: nowrap; overflow-x: auto; } } .breadcrumbs__item { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 4px } @media(max-width:900px) { .breadcrumbs__item { margin: 2px } } .breadcrumbs__item:not(:first-of-type):before { display: block; margin: auto 8px auto 0; font-size: 8px; color: var(--primary-default); content: "►" } @media(max-width:900px) { .breadcrumbs__item:not(:first-of-type):before { margin: auto 4px auto 0; font-size: 6px } } .breadcrumbs__item:last-of-type { position: relative; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; min-width: 0 } .breadcrumbs__item:last-of-type:after { position: absolute; top: 0; right: 0; width: 100%; max-width: 24px; height: 100%; content: ""; background: -webkit-gradient(linear, right top, left top, color-stop(5%, var(--white)), color-stop(65%, hsla(0, 0%, 100%, 0))); background: linear-gradient(270deg, var(--white) 5%, hsla(0, 0%, 100%, 0) 65%) } .breadcrumbs__item:last-of-type .breadcrumbs__link { color: var(--black) } .breadcrumbs__link { display: block; min-width: 0; overflow: hidden; font-size: 14px; line-height: 20px; color: var(--gray-3); white-space: nowrap; -webkit-transition: color .2s ease; transition: color .2s ease } @media(max-width:900px) { .breadcrumbs__link { font-size: 10px; line-height: 14px } } @media(hover) { .breadcrumbs__link:hover { color: var(--primary-default) } } .breadcrumbs__item:last-of-type .breadcrumbs__link, .breadcrumbs__item:last-of-type .breadcrumbs__link:hover{ text-decoration: none; cursor: default; } .menu-overlay { position: fixed; top: 0; left: 0; z-index: 10; width: 100%; height: var(--vh, 100%); visibility: hidden; opacity: 0; -webkit-transition: opacity .3s ease, visibility .3s ease; transition: opacity .3s ease, visibility .3s ease; -webkit-transform-origin: bottom center; transform-origin: bottom center } .menu-overlay.active { visibility: visible; opacity: 1 } @media(min-width:1101px) { .menu-overlay { display: none } } .menu-section { position: fixed; top: 0; right: 0; z-index: 11; width: 100%; max-width: 260px; height: var(--vh, 100%); padding: 0; overflow-x: hidden; visibility: hidden; background-color: var(--white); -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15); opacity: 0; -webkit-transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease; transition: opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease; transition: transform .2s ease, opacity .2s ease, visibility .2s ease; transition: transform .2s ease, opacity .2s ease, visibility .2s ease, -webkit-transform .2s ease; -webkit-transform: translateX(100%); transform: translateX(100%); scrollbar-color: var(--primary-active) var(--gray-6); scrollbar-width: thin } .menu-section::-webkit-scrollbar { width: 3px } .menu-section::-webkit-scrollbar-thumb { background: var(--primary-active); border-radius: 4px } .menu-section::-webkit-scrollbar-track { background: var(--gray-6); border-radius: 4px } @media(min-width:1101px) { .menu-section { display: none } } .menu-section.active { visibility: visible; opacity: 1; -webkit-transform: none; transform: none } .menu-section .container { max-width: none; height: 100%; padding: 0 } .menu { height: 100% } .menu__wrap { height: 100% } .menu__header, .menu__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } .menu__header { padding: 8px 16px 0; background-color: var(--white) } .menu__header:after { bottom: 0; left: 50%; display: block; width: 87.6923%; width: 100%; height: 1px; margin-top: 20px; content: ""; background-color: var(--gray-5) } .menu__header>.button-icon { --color: var(--gray-1); --size: 28px; --font-size: 28px; --padding: 0; z-index: 4; margin: 0 -4px 8px auto } .menu__header>.button-icon svg { font-size: inherit } .menu__header .header__search { max-width: none; padding: 0; margin: 0 0 20px } .menu__header .header__search .dropdown { position: static } .menu__header .header__search .dropdown.active .dropdown__content { display: block } .menu__header .header__search .dropdown__container { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100% } .menu__header .header__search .dropdown__content { top: 0; left: 0; z-index: -1; display: none; width: 100%; min-width: auto; max-width: none; height: 100%; padding-top: 100px; border-radius: 0; -webkit-box-shadow: none; box-shadow: none } .menu__header .header__search .dropdown__list { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-height: none; padding-top: 0; padding-bottom: 0 } .menu__header .header__search .dropdown__item:first-child { margin-top: 0 } .menu__header .header__link { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 0; font-size: 14px; line-height: 16px } .menu__header .header__link:not(:last-child) { margin-right: 0; margin-bottom: 20px } .menu__header .header__link:before { content: none } .menu__body { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; padding: 12px 16px } .menu__body .header__nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset } .menu__body .header__link { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 0; font-size: 14px; line-height: 20px } .menu__body .header__link:not(:last-child) { margin-right: 0; margin-bottom: 20px } .menu__body .header__link:before { content: none } .menu__body .header__subnav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset; padding: 12px 0; border-bottom: 1px solid var(--secondary-6) } .menu__body .header__sublink { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; padding: 0 20px; font-size: 10px; font-weight: 400; line-height: 16px } .menu__body .header__sublink:not(:last-child) { margin-right: 0; margin-bottom: 12px } .menu__body .header__contacts { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 16px 20px 24px } .menu__body .header__contacts>.button { --padding: 7px 14px; --font-size: 12px; margin: 20px 0 0; border-radius: 4px } .menu__body .header__phones { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; margin: 0 } .menu__body .header-phone:not(:last-child) { margin-right: 0; margin-bottom: 12px } .menu__body .header-phone__link { font-size: 12px } .menu__footer { position: relative; padding: 20px 16px } .menu__footer:before { position: absolute; top: 0; left: 50%; display: block; width: 87.6923%; height: 1px; content: ""; background-color: var(--gray-5); -webkit-transform: translateX(-50%); transform: translateX(-50%) } .menu__footer>.button { width: 100%; margin: 20px 0 0 } .footer__body .container>:first-child { border-top: 1px solid var(--gray-5) } .footer__body .container>:not(:last-child) { border-bottom: 1px solid var(--gray-5) } .footer__cols { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 3.5rem 0 } @media(max-width:900px) { .footer__cols { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; padding: 0 0 20px } } .footer__col { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; max-width: 212px } @media(max-width:1100px) { .footer__col { max-width: 200px } } @media(max-width:900px) { .footer__col { max-width: none } } .footer__col:not(:last-child) { margin-right: 2rem } @media(max-width:900px) { .footer__col:not(:last-child) { margin-right: 0; border-bottom: 1px solid var(--gray-5) } } @media(min-width:1201px) { .footer__col:last-child { max-width: 328px } } @media(max-width:900px) { .footer__col:last-child { padding-bottom: 0 } } @media(max-width:900px) { .footer-accordion[data-accordion] .footer-accordion__button { margin-bottom: 0 } } @media(min-width:901px) { .footer-accordion[data-accordion] .footer-accordion__content { height: auto; max-height: none; overflow: visible } } .footer-accordion__button { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 1.5rem } @media(min-width:901px) { .footer-accordion__button { /*pointer-events: none;*/ } } @media(max-width:900px) { .footer-accordion__button { padding: 12px 0; margin-bottom: 0 } } .footer-accordion__title { font-size: 1.125rem; font-weight: 700; line-height: 1.5556 } @media(max-width:900px) { .footer-accordion__title { font-size: 16px; line-height: 1.5 } } .footer-accordion__arrow { font-size: 16px; -webkit-transition: color .2s ease, -webkit-transform .2s ease; transition: color .2s ease, -webkit-transform .2s ease; transition: color .2s ease, transform .2s ease; transition: color .2s ease, transform .2s ease, -webkit-transform .2s ease } @media(min-width:901px) { .footer-accordion__arrow { display: none } } @media(max-width:900px) { .footer-accordion .footer__nav { margin-bottom: 16px } } .footer__nav { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } .footer__link { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 1rem; line-height: 1.5; color: inherit; -webkit-transition: color .2s ease; transition: color .2s ease } @media(max-width:900px) { .footer__link { font-size: 12px } } .footer__link:not(:last-child) { margin-bottom: 12px } @media(max-width:900px) { .footer__link:not(:last-child) { margin-bottom: 8px } } .footer__link:not(.footer__link--text):hover { color: var(--primary-hover) } .footer__link--icon:not(:last-child) { margin-bottom: 1.25rem } @media(max-width:900px) { .footer__link--icon:not(:last-child) { margin-bottom: 12px } } .footer__link--big { font-size: 1.125rem; font-weight: 700; line-height: 1.5556 } @media(max-width:900px) { .footer__link--big { font-size: 14px; line-height: 1.4286 } } .footer__link--big:not(:last-child) { margin-bottom: 1rem } .footer__link--underline { border-bottom: 1px solid var(--primary-default) } .footer__link svg { margin-right: .75rem; font-size: 1.5rem } @media(max-width:900px) { .footer__contacts { padding-top: 20px } } .footer__contacts>.button { margin: 0 0 1.5rem } @media(max-width:900px) { .footer__contacts>.button { margin: 0 0 16px } } .footer__desc { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 1.375rem 0 } @media(max-width:900px) { .footer__desc { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; padding: 16px 0 } } .footer__sublinks { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } @media(max-width:900px) { .footer__sublinks { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-bottom: 12px } } .footer__sublink { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 14px; font-weight: 300; color: var(--gray-3); -webkit-transition: color .2s ease; transition: color .2s ease } @media(max-width:900px) { .footer__sublink { font-size: 12px; line-height: 16px } } .footer__sublink:not(:last-child) { margin-right: 3.5rem } @media(max-width:900px) { .footer__sublink:not(:last-child) { margin-right: 0; margin-bottom: 8px } } .social { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; min-width: 328px } @media(max-width:1200px) { .social { min-width: 212px } } @media(max-width:1100px) { .social { min-width: 200px } } @media(max-width:900px) { .social { min-width: auto } } .social-link { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-negative: 0; flex-shrink: 0; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; font-size: 2rem; color: var(--primary-default); border-radius: 50%; -webkit-transition: color .2s ease; transition: color .2s ease } @media(max-width:900px) { .social-link { font-size: 24px } } .social-link:not(:last-child) { margin-right: .5rem } @media(max-width:900px) { .social-link:not(:last-child) { margin-right: 12px } } .social-link:hover { color: var(--primary-hover) } .social-link--vk { color: #2787f5 } .social-link--vk:hover { color: #0065d9 } .social-link--sk { color: #03a9f4 } .social-link--sk:hover { color: #009adf } .social-link--wa { color: #1ac81b } .social-link--wa:hover { color: #00aa01 } .footer__footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 15px 0; color: #fff; background-color: var(--primary-default) } @media(max-width:900px) { .footer__footer { padding: 12px 0 } } .footer__info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } @media(max-width:900px) { .footer__info { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset } } .copyright { margin-right: 2rem; font-size: 16px; font-weight: 300; line-height: 1.5 } @media(max-width:900px) { .copyright { margin-right: 0; margin-bottom: 8px; font-size: 12px; line-height: 16px } } .developer { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end } @media(max-width:900px) { .developer { -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start } } .developer__text { margin-right: 1rem; font-size: 1rem; line-height: 1.5; white-space: nowrap } @media(max-width:900px) { .developer__text { margin-right: 4px; font-size: 12px; font-weight: 300; line-height: 16px } } .developer__link { width: 100%; max-width: 96px; color: inherit } @media(max-width:900px) { .developer__link { max-width: 64px } } .developer__icon-wrapper { position: relative; width: 100%; padding-bottom: 35.416667% } @media(max-width:900px) { .developer__icon-wrapper { padding-bottom: 37.5% } } .developer__icon { position: absolute; top: 0; left: 0; width: 100%; height: 100% } @-webkit-keyframes visible { 0% { opacity: 0 } to { opacity: 1 } } @keyframes visible { 0% { opacity: 0 } to { opacity: 1 } } .catalog-popup, .catalog-popup-gift, .catalog-popup-about { position: absolute; top: 100%; left: -3.5rem; display: none; width: 34.25rem; max-width: calc(100vw - var(--container-padding-native)*2); max-height: calc(var(--vh, 100vh) - var(--header-height)); padding: .25rem; background: #fff; border-radius: 8px; -webkit-box-shadow: 0 0 20px 0 rgba(0, 0, 0, .15); box-shadow: 0 0 20px 0 rgba(0, 0, 0, .15); opacity: 0; -webkit-animation: visible .2s; animation: visible .2s } .catalog-popup:before, .catalog-popup-gift:before, .catalog-popup-about:before { position: absolute; top: -1rem; left: 0; width: 100%; height: 1.5rem; content: "" } .catalog-popup__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; height: calc(444px - .5rem); max-height: calc(var(--vh, 100vh) - var(--header-height) - .5rem); padding: 1.6rem 2.5rem; overflow-x: hidden; overflow-y: auto; scrollbar-color: var(--primary-active) var(--gray-6); scrollbar-width: thin } .catalog-popup__wrap::-webkit-scrollbar { width: 3px } .catalog-popup__wrap::-webkit-scrollbar-thumb { background: var(--primary-active); border-radius: 4px } .catalog-popup__wrap::-webkit-scrollbar-track { background: var(--gray-6); border-radius: 4px } .catalog-popup__item { --color: var(--gray-1); --color-hover: var(--primary-default); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; width: 50%; padding: .625rem .75rem; border-radius: 4px; -webkit-transition: background-color .2s ease, color .2s ease; transition: background-color .2s ease, color .2s ease } @media(hover) { .catalog-popup__item:hover { background-color: #f9f9f9 } } .catalog-popup__image-wrapper { position: relative; -ms-flex-negative: 0; flex-shrink: 0; width: 44px; height: 44px; margin-right: 1.25rem; overflow: hidden; background-color: var(--gray-6); border-radius: 50% } .catalog-popup__image { position: absolute; top: 0; left: 0; -o-object-fit: cover; object-fit: cover } .catalog-popup__text { font-weight: 400; line-height: 1.5; text-align: left; } .banner-section { padding: 32px 0 20px; overflow: hidden } @media(max-width:900px) { .banner-section { padding: 32px 0 14px } } .banner__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .banner-slider-wrapper { position: relative; -webkit-box-flex: 1; -ms-flex: 1 1 1024px; flex: 1 1 1024px } .banner-slider { width: 100%; height: 100% } .banner-slider .swiper-wrapper { width: 1px; min-width: 100% } .banner-slider-navigation { position: absolute; top: 50%; left: 0; z-index: 1; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; padding: 24px; pointer-events: none; -webkit-transform: translateY(-50%); transform: translateY(-50%) } @media(max-width:600px) { .banner-slider-navigation { display: none } } .banner-slider-navigation .button-icon { --color: var(--primary-default); margin: 0; pointer-events: all; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } .banner-slider-navigation .button-icon.disabled, .banner-slider-navigation .button-icon:disabled { opacity: .8 } .banner-slider-pagination { bottom: 18px; left: 50%; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-transform: translateX(-50%); transform: translateX(-50%) } @media(max-width:600px) { .banner-slider-pagination { bottom: 8px } } .banner-slider-pagination .swiper-pagination-bullet { width: 6px; height: 6px; background-color: #fff; opacity: .7 } .banner-slider-pagination .swiper-pagination-bullet:not(:last-child) { margin-right: 15px } .banner-slider-pagination .swiper-pagination-bullet:hover { background-color: #fff; opacity: .8 } .banner-slider-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: #fff; opacity: 1 } .banner-card { display: block; height: 100% } .banner-card__wrap { position: relative; z-index: 1; height: 100%; min-height: 218px; color: #fff; border-radius: 8px } .banner-card__bg { position: absolute; top: 0; left: 0; z-index: -1 } .banner-card__bg, .banner-card__bg img { width: 100%; height: 100%; border-radius: inherit } .banner-card__bg img { -o-object-fit: cover; object-fit: cover } .banner-card__content { position: relative; z-index: 1; height: 100%; padding: 2.5rem 5rem } @media(max-width:600px) { .banner-card__content { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 32px } } .banner-card__inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; width: 100%; max-width: 632px; height: 100%; margin: 0 auto } .banner-card__title { max-width: 515px; margin: 0 0 18px; font-size: 2rem; font-weight: 800; line-height: 1.25 } @media(max-width:600px) { .banner-card__title { font-size: 20px; line-height: 1.2 text-shadow: 0 0 10px BLACK; } } .banner-card__button { margin: auto 0 0; border-radius: 6px } .banner-card--small .banner-card__content { padding: 2rem } .banner-card--small .banner-card__title { margin: 0 0 2.5rem; font-size: 1.254em; font-weight: 700; line-height: 1.2 } .banner__secondary { -webkit-box-flex: 0; -ms-flex: 0 0 328px; flex: 0 0 328px; margin-left: 20px } @media(max-width:900px) { .banner__secondary { display: none } } .filter-section { padding: 20px 0 } @media(max-width:900px) { .filter-section { padding: 0 } } @media(max-width:900px) { .filter__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; width: calc(100% + 32px); padding: 20px 16px; margin-top: -6px; margin-left: -16px; overflow-y: hidden } .filter__wrap::-webkit-scrollbar { display: none } } .filter__form { display: -webkit-box; display: -ms-flexbox; display: flex; border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } @media(max-width:900px) { .filter__form { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } } .filter-item { position: relative; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; width: 20% } @media(max-width:900px) { .filter-item { min-width: 116px } } .filter-item:not(:last-child) { margin-right: -1px } .filter-item:not(:last-child):after { position: absolute; top: 50%; right: 1px; z-index: 2; display: block; width: 1px; height: 68.75%; content: ""; background-color: var(--gray-5); -webkit-transform: translateY(-50%); transform: translateY(-50%) } .filter-item .dropdown { position: static; z-index: 0; width: 100%; margin: 0 } .filter-item .dropdown.count .dropdown__placeholder { text-overflow: unset; white-space: normal } .filter-item .dropdown.count .dropdown-tag { width: 100% } .filter-item .dropdown.count .dropdown-tag span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap } .filter-item .dropdown__button { border-radius: 0 } .filter-item .dropdown__content { top: auto; right: auto; bottom: auto; left: auto; z-index: 8; -webkit-transition: none; transition: none; -webkit-transform: none; transform: none } .filter-item:first-child .dropdown__button { border-radius: 8px 0 0 8px } .filter-item:last-child .dropdown__button { border-radius: 0 8px 8px 0 } .filter-item:only-child .dropdown__button { border-radius: 8px } .products-section { padding-top: 24px; overflow: hidden } @media(max-width:900px) { .products-section { padding-top: 12px } } .products__header { margin: 0 0 32px; text-align: center } @media(max-width:900px) { .products__header { margin: 0 0 16px } } .products__title { margin: 0 } @media(max-width:900px) { .products__inner { width: calc(100% + 32px); margin-left: -16px } } .products__footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 2rem } .products__footer .button { width: 100%; max-width: 444px; margin: 0 } .products__grid { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap } .products__grid .product { width: 25% } @media(max-width:1100px) { .products__grid .product { width: 33.33333% } } @media(max-width:500px) { .products__grid .product { width: 50% } } .other-products-section { padding: 6rem 0; overflow: hidden } @media(max-width:900px) { .other-products-section { padding: 32px 0 40px } } .other-products-section--gray { padding: 7rem 0; background-color: var(--gray-8) } @media(max-width:900px) { .other-products-section--gray { padding: 40px 0 } } .other-products__title { margin: 0 0 2rem } @media(max-width:900px) { .other-products__title { margin: 0 0 24px; line-height: 1.3334 } } .other-products__header { margin: 0 0 3rem } @media(max-width:900px) { .other-products__header { margin: 0 0 28px } } .other-products__header .other-products__title { margin: 0 0 3rem } @media(max-width:900px) { .other-products__header .other-products__title { margin: 0 0 18px } } .other-products-slider-wrapper { position: relative } @media(max-width:900px) { .other-products-slider-wrapper { width: calc(100% + 32px); margin-left: -16px } } .other-products-slider { padding: 20px 0; margin: -20px 0; /*overflow: visible*/ } .other-product-slide { height: auto; -webkit-transition: opacity .5s ease, visibility .5s ease; transition: opacity .5s ease, visibility .5s ease } @media(max-width:900px) { .other-product-slide { width: 100%; /*max-width: 160px*/ } } .other-product-slide:not(.swiper-slide-visible) { visibility: hidden; opacity: 0 } .other-product-slide .product { height: 100% } .other-products-slider-navigation { position: absolute; top: 50%; left: 50%; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; pointer-events: none; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%) } @media(max-width:900px) { .other-products-slider-navigation { display: none } } .other-products-slider-navigation .button-icon { --color: var(--primary-default); margin: 0; pointer-events: all } .other-products-slider-navigation .button-icon--prev { -webkit-transform: translateX(-50%); transform: translateX(-50%) } .other-products-slider-navigation .button-icon--next { -webkit-transform: translateX(50%); transform: translateX(50%) } .other-products-slider-navigation .button-icon.swiper-button-lock { display: none } .desc-section { padding: 3.5rem 0 } @media(max-width:900px) { .desc-section { padding: 16px 0 } } @media(min-width:901px) { .desc-section--reverse .desc__wrap { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -ms-flex-flow: row-reverse; flex-flow: row-reverse } } @media(min-width:901px) { .desc-section--reverse .desc__img-wrapper { margin-right: 8.5rem; margin-left: 0 } } .desc-section--first { padding-top: 6rem } @media(max-width:900px) { .desc-section--first { padding-top: 40px } } .desc-section--last { padding-bottom: 9rem } @media(max-width:900px) { .desc-section--last { padding-bottom: 40px } } .desc__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } @media(max-width:900px) { .desc__wrap { -webkit-box-orient: vertical; -webkit-box-direction: reverse; -ms-flex-direction: column-reverse; flex-direction: column-reverse; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } } .desc__content { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } .desc__title { margin: 0 0 1.5rem } @media(max-width:900px) { .desc__title { margin: 0 0 16px } } .desc__title:after { display: block; width: 100%; max-width: 4.625rem; height: 4px; margin-top: 24px; content: ""; background-color: var(--primary-default); border-radius: 2px } @media(max-width:900px) { .desc__title:after { max-width: 56px; height: 1px; margin-top: 16px } } .desc__inner { font-size: 1rem; line-height: 1.5 } .desc__inner>:not(:last-child) { margin-bottom: 1.5rem } .desc__inner a { position: relative } .desc__inner a:hover:before { opacity: 0 } .desc__inner a:before { position: absolute; top: 100%; width: 100%; height: 1px; content: ""; background-color: currentColor } .desc__item { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } .desc__item:not(:last-child) { margin-bottom: 1rem } @media(max-width:900px) { .desc__item:not(:last-child) { margin-bottom: 12px } } .desc__item:before { display: block; width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin-top: .5rem; margin-right: 12px; font-size: 6px; content: ""; background-color: var(--primary-default); border-radius: 50% } .desc__img-wrapper { position: relative; width: 100%; max-width: 444px; margin-left: 8.5rem } @media(max-width:900px) { .desc__img-wrapper { max-width: 180px; margin-bottom: 24px; margin-left: 0 } } .desc__img-wrapper:before { display: block; width: 100%; padding-bottom: 73.87387%; content: "" } .desc__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain } .product-card-section { padding-bottom: 6rem } @media(max-width:900px) { .product-card-section { padding-bottom: 32px } } .product-card-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; position: relative; } @media(max-width:900px) { .product-card-inner { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset } } .product-card-inner .product-card-note { margin-top: 1.5rem; margin-left: calc(14.894% + 16px) } @media(max-width:1200px) { .product-card-inner .product-card-note { margin-left: 0 } } .product-card-left { position: sticky; top: calc(var(--header-height) + 10px); -webkit-box-flex: 0; -ms-flex: 0 1 752px; flex: 0 1 752px; width: 100%; margin-right: 60px } @media(max-width:1300px) { .product-card-left { margin-right: 20px } } @media(max-width:900px) { .product-card-left { position: static; top: auto; -webkit-box-flex: 1; -ms-flex: auto; flex: auto; margin-right: 0; margin-bottom: 20px } } .product-card-preview { display: -webkit-box; display: -ms-flexbox; display: flex } .product-card-thumbs-wrap { width: 100%; max-width: 14.894%; margin-right: 16px } @media(max-width:900px) { .product-card-thumbs-wrap { display: none } } .product-card-thumbs-slider-wrapper { position: relative; height: 100% } .product-card-thumbs-slider { height: 100%; padding-top: 32px } .product-card-thumbs-slider.swiper-slider-lock { padding-top: 0 } .product-card-thumbs-slider .product-card__el { cursor: pointer } .product-card-thumbs-slider .swiper-wrapper { height: 1px; min-height: 100% } .product-card-thumbs-slide { -webkit-transition: opacity .2s ease; transition: opacity .2s ease } .product-card-thumbs-slide .product-card__el { padding: 4px; border-radius: 8px; -webkit-box-shadow: inset 0 0 0 2px rgba(var(--primary-default-rgb), 1); box-shadow: inset 0 0 0 2px rgba(var(--primary-default-rgb), 1) } .product-card-thumbs-slide:not(.swiper-slide-thumb-active) .product-card__el { -webkit-box-shadow: inset 0 0 0 2px rgba(var(--primary-default-rgb), 0); box-shadow: inset 0 0 0 2px rgba(var(--primary-default-rgb), 0) } @media(hover) { .product-card-thumbs-slide:not(.swiper-slide-thumb-active):hover .product-card__el { -webkit-box-shadow: inset 0 0 0 2px rgba(var(--primary-default-rgb), .5); box-shadow: inset 0 0 0 2px rgba(var(--primary-default-rgb), .5) } } .product-card-thumbs-slide:not(.swiper-slide-visible) { pointer-events: none; opacity: .2 } .product-card-thumbs-slider-navigation { position: absolute; top: 0; left: 50%; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; height: 100%; padding: 0 4px; pointer-events: none; -webkit-transform: translateX(-50%); transform: translateX(-50%) } .product-card-thumbs-slider-navigation .button-icon { --size: 24px; --padding: 0; --color: var(--black); --color-disable: var(--gray-3); --bg-color-disable: var(--white); --border-color-disable: var(--white); z-index: 2; width: 100%; min-width: auto; margin: 0; pointer-events: all; border-radius: 4px; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } .product-card-thumbs-slider-navigation .button-icon.swiper-button-lock { display: none } .product-card-thumbs-slider-navigation .button-icon svg { font-size: 10px } .product-card-thumbs-slider-navigation .button-icon--prev svg { -webkit-transform: rotate(-90deg); transform: rotate(-90deg) } .product-card-thumbs-slider-navigation .button-icon--next svg { -webkit-transform: rotate(90deg); transform: rotate(90deg) } .product-card-preview-wrap { width: 100%; max-width: 624px; overflow: hidden } @media(max-width:900px) { .product-card-preview-wrap { max-width: none } } .product-card-preview-slider__container { position: relative; padding-bottom: 100% } .product-card-preview-slider__inner { position: absolute; top: 0; left: 0; width: 100%; height: 100% } .product-card-preview-slider { height: 100% } .product-card-preview-slide .product__img-wrapper { overflow: hidden } .product-card-preview-slide .product__img-wrapper .js-image-zoom__zoomed-area { pointer-events: none } @media(max-width:900px) { .product-card-preview-slide .product__img-wrapper .js-image-zoom__zoomed-area { display: none !important } } .product-card-preview-slide .product__img-wrapper .js-image-zoom__zoomed-image { z-index: 2; pointer-events: none; -webkit-transform: none !important; transform: none !important } @media(max-width:900px) { .product-card-preview-slide .product__img-wrapper .js-image-zoom__zoomed-image { display: none !important } } .product-card__el .product__hint { padding: 4px 12px; font-size: 1rem; font-weight: 700; line-height: 1.75 } @media(max-width:900px) { .product-card__el .product__hint { top: 8px; padding: 2px 12px; font-size: 12px; line-height: 18px } } @media(max-width:900px) { .product-card__el .product__sizes { padding: 6px 12px 7px } } .product-card__el .product__size { font-size: 1.125rem; line-height: 1.5556 } @media(max-width:900px) { .product-card__el .product__size { font-size: 12px; line-height: 16px } } .product-card__el .product__size:not(:last-child) { margin-right: 14px } @media(max-width:900px) { .product-card__el .product__size:not(:last-child) { margin-right: 4px } } @media(max-width:900px) { .product-card__el .product__size:before { width: 18px } } @media(max-width:900px) { .product-card__el .product__size--vertical:before { width: 4px; height: 18px } } .product-card-preview-slider-pagination { display: none } @media(max-width:900px) { .product-card-preview-slider-pagination { position: static; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-top: 12px } .product-card-preview-slider-pagination .swiper-pagination-bullet { width: 6px; height: 6px; margin: 0 4px; background-color: transparent; border: 1px solid var(--primary-default); opacity: 1 } .product-card-preview-slider-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active { background-color: var(--primary-default); opacity: 1 } } .product-card-note { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; padding: 1.5rem 2.5rem; color: var(--primary-default); background-color: var(--primary-disable); border-radius: 8px } @media(max-width:900px) { .product-card-note { display: none; padding: 16px 12px } } .product-card-note--mobile { display: none } @media(max-width:900px) { .product-card-note--mobile { display: -webkit-box; display: -ms-flexbox; display: flex } } .product-card-note__icon { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 1rem; font-size: 2.5rem } @media(max-width:900px) { .product-card-note__icon { margin-right: 8px; font-size: 34px } } .product-card-note__text { font-size: 1rem; font-weight: 600; line-height: 1.5 } @media(max-width:900px) { .product-card-note__text { font-size: 12px; font-weight: 400; line-height: 16px } } .product-card-note__text b { font-weight: 700 } .product-card-right { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; max-width: 560px } @media(max-width:1200px) { .product-card-right { max-width: 400px } } @media(max-width:900px) { .product-card-right { -webkit-box-flex: 0; -ms-flex: none; flex: none; max-width: none } } .product-card__content .product-price { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin: 0 0 1.5rem } @media(max-width:900px) { .product-card__content .product-price { -ms-flex-wrap: nowrap; flex-wrap: nowrap; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; width: 100%; margin-bottom: 16px } } .product-card__content .product-price__old { margin: 0 0 0 8px; font-size: 1.25rem; line-height: 1.6 } @media(max-width:900px) { .product-card__content .product-price__old { font-size: 14px; line-height: 20px; white-space: nowrap } } .product-card__content .product-price__current { -webkit-box-ordinal-group: 0; -ms-flex-order: -1; order: -1; margin: 0; font-size: 2.25rem; font-weight: 800; line-height: 1.1 } @media(max-width:900px) { .product-card__content .product-price__current { font-size: 24px; line-height: 1.5; white-space: nowrap } } .product-card__content .product-price .product__quantity { width: 100%; margin-top: -5px; font-size: 1rem; line-height: 1.5 } @media(max-width:900px) { .product-card__content .product-price .product__quantity { width: auto; margin-top: 0; margin-left: auto; font-size: 14px; line-height: 20px; text-align: right } } .product-card__title { margin: 0 0 20px; font-size: 2rem; font-weight: 700; line-height: 1.25 } @media(max-width:900px) { .product-card__title { display: none } } .product-card__title--mobile { display: none } @media(max-width:900px) { .product-card__title--mobile { display: block; margin: 0 0 24px; font-size: 24px; line-height: 1.33334 } } .product-card-block:not(:last-child) { margin-bottom: 1.5rem } @media(max-width:900px) { .product-card-block:not(:last-child) { margin-bottom: 20px } } .product-card-block__label { display: block; margin: 0 0 12px; font-size: 1.125rem; font-weight: 700; line-height: 1.5556 } @media(max-width:900px) { .product-card-block__label { margin: 0 0 16px; font-size: 16px; line-height: 1.5 } } @media(min-width:1201px) { .product-card-block--row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } } @media(max-width:1200px) { .product-card-block--row { display: block } } @media(min-width:1201px) { .product-card-block--row .product-card-block__label { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; margin-right: 8px; margin-bottom: 0 } } @media(max-width:900px) { .product-card-block--row .product-card-block__label { margin: 0 0 12px } } .product-card-radios { overflow: hidden } @media(max-width:900px) { .product-card-radios--sizes { width: calc(100% + 32px); padding: 0 16px; margin-left: -16px; overflow-x: auto } .product-card-radios--sizes::-webkit-scrollbar { display: none } } .product-card-radios--sizes .product-card-radios__wrap { margin: -4px } @media(max-width:900px) { .product-card-radios--sizes .product-card-radios__wrap { -ms-flex-wrap: nowrap; flex-wrap: nowrap } .product-card-radios--sizes .product-card-radios__wrap:after { display: block; width: 16px; min-width: 16px; content: "" } } @media(max-width:900px) { .product-card-radios--sizes .product-card-radios__wrap .product-card-radio { -ms-flex-negative: 0; flex-shrink: 0; width: auto; margin: 4px } } .product-card-radios__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -4px } @media(max-width:900px) { .product-card-radios__wrap { margin: -2px } } .product-card-radios__wrap .product-card-radio { margin: 4px } @media(max-width:900px) { .product-card-radios__wrap .product-card-radio { width: calc(33.33333% - 4px); margin: 2px } } .product-card-radio { position: relative; display: block; width: 100%; max-width: 128px } .product-card-radio__input { position: absolute; top: 50%; left: 50%; z-index: -2; width: 1px; height: 1px; margin: 0; opacity: 0; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-appearance: none; -moz-appearance: none; appearance: none } .product-card-radio__input:disabled~.product-card-radio__wrap { pointer-events: none; opacity: .5 } .product-card-radio__input:checked~.product-card-radio__wrap { -webkit-box-shadow: inset 0 0 0 2px var(--primary-default); box-shadow: inset 0 0 0 2px var(--primary-default) } .product-card-radio__input:checked~.product-card-radio__wrap .product-card-radio__footer .button-icon { --bg-color: var(--primary-active); --bg-color-hover: var(--primary-active); --bg-color-focus: var(--primary-active); --border-color: var(--primary-active); --border-color-hover: var(--primary-active); --border-color-focus: var(--primary-active) } .product-card-radio__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100%; padding: 8px; cursor: pointer; border-radius: 4px; -webkit-box-shadow: inset 0 0 0 1px var(--gray-6); box-shadow: inset 0 0 0 1px var(--gray-6); -webkit-transition: background-color .2s ease, -webkit-box-shadow .2s ease; transition: background-color .2s ease, -webkit-box-shadow .2s ease; transition: box-shadow .2s ease, background-color .2s ease; transition: box-shadow .2s ease, background-color .2s ease, -webkit-box-shadow .2s ease } .product-card-radio__wrap:hover { -webkit-box-shadow: inset 0 0 0 2px var(--primary-default); box-shadow: inset 0 0 0 2px var(--primary-default) } .product-card-radio__wrap .product__img-wrapper { border-radius: inherit } .product-card-radio .product__sizes { position: static; padding: 0 0 6px; margin-top: 9px; background-color: transparent; border-radius: 0 } @media(max-width:900px) { .product-card-radio .product__sizes { padding-bottom: 3px; margin-top: 6px } } .product-card-radio .product__size { font-size: 14px; line-height: 16px } @media(max-width:900px) { .product-card-radio .product__size { font-size: 12px } } .product-card-radio__size { --size: 20px; position: absolute; bottom: 4px; left: 4px; display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; min-width: var(--size); min-height: var(--size); font-size: 14px; font-weight: 800; line-height: 20px; color: var(--primary-default); text-transform: uppercase; background-color: var(--white); border-radius: 10px } .product-card-radio__value { display: block; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin-top: 11px; margin-bottom: 4px; font-size: 14px; line-height: 16px } .product-card-radio__value:not(:last-child) { min-height: 32px; margin-top: 4px; margin-bottom: 4px } @media(max-width:900px) { .product-card-radio__value { margin-top: 6px; font-size: 12px; line-height: 16px } } .product-card-radio__footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .product-card-radio__footer .button-icon { --size: 24px; margin: 0 } .product-card-radio__footer .button-icon .svg { font-size: 16px } .product-card-radio__price { font-size: 14px; font-weight: 800; line-height: 20px } .product-card-radio__text { display: block; font-size: 16px; line-height: 1.5 } .product-card-radio--size { width: auto; max-width: none } .product-card-radio--size .product-card-radio__input:checked~.product-card-radio__wrap { background-color: var(--gray-7) } .product-card-radio--size .product-card-radio__input:checked~.product-card-radio__wrap:hover { background-color: var(--gray-7); -webkit-box-shadow: inset 0 0 0 2px var(--primary-default); box-shadow: inset 0 0 0 2px var(--primary-default) } .product-card-radio--size .product-card-radio__input:checked~.product-card-radio__wrap .product-card-radio__text { color: var(--primary-default) } .product-card-radio--size .product-card-radio__wrap { padding: 4px 12px; -webkit-box-shadow: inset 0 0 0 1px var(--gray-5); box-shadow: inset 0 0 0 1px var(--gray-5) } .product-card-radio--size .product-card-radio__wrap:hover { background-color: var(--primary-disable); -webkit-box-shadow: inset 0 0 0 1px var(--gray-5); box-shadow: inset 0 0 0 1px var(--gray-5) } .product-card__buttons { display: -webkit-box; display: -ms-flexbox; display: flex } @media(max-width:1200px) { .product-card__buttons { -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -6px -4px } } .product-card__buttons .button { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin: 0 } @media(max-width:1200px) { .product-card__buttons .button { --font-size: 14px; --padding: 8px 22px; --line-height: 20px; width: calc(100% - 8px); margin: 6px 4px } } .product-card__buttons .button:not(:last-child) { margin-right: 12px } @media(max-width:1200px) { .product-card__buttons .button:not(:last-child) { margin-right: 4px } } @media(max-width:1200px) { .product-card__buttons .button:nth-child(2) { width: calc(100% - 56px); margin: 6px 4px } } .product-card__buttons .button .svg { margin-top: -4px; margin-bottom: -4px; font-size: 32px } @media(max-width:1200px) { .product-card__buttons .button .svg { font-size: 25px } } .product-card__buttons .button-icon { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; border-radius: 4px } @media(max-width:1200px) { .product-card__buttons .button-icon { --size: 40px; --padding: 5px; width: calc(var(--size) - 8px); margin: 6px 4px } } .product-card__buttons .button-icon.active { --color: var(--primary-default); --color-hover: var(--primary-default); --color-focus: var(--primary-default); --bg-color: var(--primary-disable); --bg-color-hover: var(--primary-disable); --bg-color-focus: var(--primary-disable) } .product-card__buttons .button-icon.active .svg { color: currentColor; fill: currentColor } .product-card__buttons .button-icon .svg { margin: 0; fill: none } .product-card-desc { margin-top: 2rem } @media(max-width:900px) { .product-card-desc { margin-top: 24px } } .product-card-desc__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } .product-card-desc__item:not(:last-child) { margin-bottom: 6px } @media(max-width:900px) { .product-card-desc__item:not(:last-child) { margin-bottom: 16px } } .product-card-desc__item dd { font-size: 1rem; line-height: 1.55 } .product-card-desc__icon { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 9px; font-size: 2rem } @media(max-width:900px) { .product-card-desc__icon { margin-right: 8px; font-size: 24px } } .product-card-desc__text { margin: auto 0; font-size: 1rem; line-height: 1.5 } @media(max-width:900px) { .product-card-desc__text { font-size: 14px; line-height: 20px } } .product-card-desc__text b { font-size: 1.125rem; font-weight: 700; line-height: 1.5556 } @media(max-width:900px) { .product-card-desc__text b { font-size: 16px; line-height: 1.5 } } .product-card-desc__text a { border-bottom: 1px dashed } .product-card__accordions { margin-top: 2rem } @media(max-width:900px) { .product-card__accordions { margin-top: 32px } } .product-card-accordion { border-bottom: 1px solid var(--gray-5) } .product-card-accordion:first-child { border-top: 1px solid var(--gray-5) } .product-card-accordion__button { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 14px 0; cursor: pointer; -webkit-transition: color .2s ease; transition: color .2s ease } @media(max-width:900px) { .product-card-accordion__button { padding: 16px 0 } } .product-card-accordion__button:hover { color: var(--primary-hover) } .product-card-accordion__button .svg { margin-left: 1rem; font-size: 20px } .product-card-accordion__title { font-size: 1.125rem; font-weight: 700; line-height: 1.55556 } @media(max-width:900px) { .product-card-accordion__title { font-size: 16px; line-height: 1.5 } } .product-card-accordion__inner { padding-bottom: 1.5rem; font-size: 1rem; line-height: 1.5 } .product-card-accordion__inner .desc__list:not(:last-child) { margin-bottom: 1rem } @media(max-width:900px) { .product-card-accordion__inner .desc__list:not(:last-child) { margin-bottom: 16px } } .product-card-accordion__inner .desc__item:not(:last-child) { margin-bottom: 12px } .product-card-accordion__inner .desc__item:before { margin-right: 8px } .product-card-accordion__inner a { border-bottom: 1px solid } .product-card__list-wrapper { overflow: hidden; text-align: justify; } .product-card__list-wrapper p{ text-align: justify; } .product-card__list--cols { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -2px -26px } @media(max-width:900px) { .product-card__list--cols { margin: -2px -8px } } .product-card__list--cols .product-card__item { width: calc(50% - 52px); margin: 2px 26px } @media(max-width:900px) { .product-card__list--cols .product-card__item { width: calc(50% - 16px); margin: 2px 8px } } .product-card__item { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; line-height: 1.5 } .product-card__item:not(:last-of-type) { margin-bottom: 4px } .product-card__key { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin-right: 6px; color: var(--gray-3) } @media(max-width:900px) { .product-card__key { margin-right: 4px } } .product-card__key:after { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; min-width: 20px; margin-left: 6px; pointer-events: none; content: ""; border-top: 1px dashed; -webkit-transform: translateY(1em); transform: translateY(1em) } @media(max-width:900px) { .product-card__key:after { min-width: 8px; margin-left: 4px } } .product-card__value { text-align: right; white-space: nowrap } .product-card__form { margin-bottom: 1.5rem } @media(max-width:900px) { .product-card__form { margin-bottom: 12px } } .product-card-delivery__label { display: block; margin-bottom: 4px; font-size: 14px; line-height: 20px } .product-card-delivery__grid { display: -webkit-box; display: -ms-flexbox; display: flex } @media(max-width:500px) { .product-card-delivery__grid { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .product-card-delivery__grid>.button { margin: 0 } .product-card-delivery__inner { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1; margin-right: 6px } @media(max-width:500px) { .product-card-delivery__inner { margin-right: 0; margin-bottom: 12px } } .product-card-delivery__inner .input-wrapper { width: 100%; height: 100%; margin: 0 } .product-card-delivery__inner .input-wrapper .input { padding-top: 8px; padding-bottom: 8px } .product-card-delivery__map-wrapper { position: relative; width: 100%; margin-top: 1.25rem } .product-card-delivery__map-wrapper:before { display: block; width: 100%; padding-bottom: 53.58423%; content: "" } .product-card-delivery__map { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: var(--primary-disable) } .product-card-delivery__price { margin-top: 12px; font-size: 1.25rem; font-weight: 300; line-height: 1.6 } @media(max-width:500px) { .product-card-delivery__price { font-size: 14px; line-height: 20px } } .product-card-delivery__price em, .product-card-delivery__price .like_em { margin-left: 8px; font-size: 2.25rem; font-weight: 800; line-height: 1.5556 } @media(max-width:500px) { .product-card-delivery__price em, .product-card-delivery__price .like_em { font-size: 24px; line-height: 1.5 } } .product-card__text:not(:last-child) { margin-bottom: 1rem } .product-card-slider-wrapper { position: relative } .product-card-slider { padding-left: 29px } @media(max-width:900px) { .product-card-slider { width: calc(100% + 32px); padding: 0 16px; margin-left: -16px } } .product-card-slider.swiper-slider-lock { padding-left: 0 } @media(max-width:900px) { .product-card-slider.swiper-slider-lock { padding-left: 16px } } .product-card-slide { width: 100%; max-width: 128px; height: auto } @media(max-width:900px) { .product-card-slide { max-width: 106px } } .product-card-slide .product-card-radio { max-width: none; height: 100% } .product-card-slider-navigation { position: absolute; top: 0; left: 50%; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; height: 100%; padding: 0; pointer-events: none; -webkit-transform: translateX(-50%); transform: translateX(-50%) } @media(max-width:900px) { .product-card-slider-navigation { display: none } } .product-card-slider-navigation .button-icon { --size: 24px; --padding: 0; --color: var(--black); --color-disable: var(--gray-3); --bg-color-disable: var(--white); --border-color-disable: var(--white); z-index: 2; height: 100%; min-height: auto; margin: 0; pointer-events: all; border-radius: 4px; -webkit-box-shadow: 0 0 20px rgba(var(--black-rgb), .15); box-shadow: 0 0 20px rgba(var(--black-rgb), .15) } .product-card-slider-navigation .button-icon.swiper-button-lock { display: none } .product-card-slider-navigation .button-icon svg { font-size: 10px } .basket-section { padding: 3.5rem 0 7rem } @media(max-width:900px) { .basket-section { padding: 32px 0 } } .basket__title { margin: 0 0 2.5rem } @media(max-width:900px) { .basket__title { margin: 0 0 28px } } .basket__grid { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } @media(max-width:900px) { .basket__grid { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: unset; -ms-flex-align: unset; align-items: unset; -webkit-box-pack: unset; -ms-flex-pack: unset; justify-content: unset } } .basket__content { -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } @media(max-width:900px) { .basket__content { -webkit-box-flex: 0; -ms-flex-positive: 0; flex-grow: 0; width: 100% } } .basket-product--postcard { margin-top: 1px } .basket-postcard { width: 100% } .basket-postcard__header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .basket-postcard__header.show~.basket-postcard__body { display: block } .basket-postcard .checkbox { margin: 0 1rem 0 0 } .basket-postcard .checkbox__custom { width: 1em; min-width: 1em; height: 1em; min-height: 1em; margin-right: 12px; font-size: 24px } @media(max-width:900px) { .basket-postcard .checkbox__custom { font-size: 20px } } .basket-postcard .checkbox__icon { width: 1em; height: 1em; font-size: 19px } @media(max-width:900px) { .basket-postcard .checkbox__icon { font-size: 16px } } .basket-postcard .checkbox__text { padding-top: 2px; font-size: 1rem } .basket-postcard .checkbox__text .a, .basket-postcard .checkbox__text a { border-bottom: 1px solid } .basket-postcard__price { margin-left: auto; font-size: 16px; font-weight: 700; line-height: 1.75; text-align: right; text-transform: uppercase } @media(max-width:900px) { .basket-postcard__price { font-size: 12px; line-height: 18px } } .basket-postcard__form .input-wrapper { width: 100%; margin: 0 } .basket-postcard__form .input-wrapper .textarea { width: 100%; height: 140px; margin: 0; resize: none } .basket-postcard__form .button { margin: 16px 0 0 } @media(max-width:600px) { .basket-postcard__form .button { width: 100% } } .basket-postcard__subtitle { display: block; margin: 0 0 4px; font-size: 14px; line-height: 20px } .basket-postcard__subtext { display: block; font-size: 12px; line-height: 18px; color: var(--gray-4) } .basket-postcard__body { display: none; margin-top: 1.25rem } @media(max-width:900px) { .basket-postcard__body { margin-top: 20px } } .basket-section--order .basket__title { margin-bottom: 2rem } @media(max-width:900px) { .basket-section--order .basket__title { margin-bottom: 24px } } .order-text { margin-bottom: 2rem; font-size: 1rem; line-height: 1.5 } @media(max-width:900px) { .order-text { margin-bottom: 24px; font-size: 14px; line-height: 20px } } .order-text a { font-weight: 600 } .order__form { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap } .order__form>* { width: 100% } .order__row { width: 100%; padding: 3rem 2.5rem; margin-bottom: 1px; -webkit-box-shadow: 0 0 0 1px var(--gray-6); box-shadow: 0 0 0 1px var(--gray-6) } @media(max-width:900px) { .order__row { padding: 24px 12px } } .order__row--half { width: calc(50% - .5px) } @media(max-width:900px) { .order__row--half { width: calc(100% - .5px) } } .order__row--half:not(:last-child) { margin-right: 1px } @media(max-width:900px) { .order__row--half:not(:last-child) { margin-right: 0 } } .order__title { width: 100%; max-width: 525px; margin: 0 0 1.5rem; font-size: 1.5rem; line-height: 1.5 } @media(max-width:900px) { .order__title { max-width: none; margin: 0 0 16px; font-size: 18px; line-height: 28px } } .order__title:not(:first-child) { margin-top: 2.5rem } @media(max-width:900px) { .order__title:not(:first-child) { margin-top: 24px } } .order__title b { color: var(--primary-default) } .order__inner { width: 100%; max-width: 724px } .order__blocks { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -8px -12px } @media(max-width:600px) { .order__blocks { margin: -6px -4px } } .order-block { width: calc(50% - 24px); max-width: none; margin: 8px 12px } @media(max-width:600px) { .order-block { width: calc(100% - 8px); margin: 6px 4px } } .order-block--big { width: calc(100% - 24px) } @media(max-width:600px) { .order-block--big { width: calc(100% - 8px) } } .order-block--small { width: calc(25% - 24px) } @media(max-width:600px) { .order-block--small { width: calc(50% - 8px) } } .order-block__label { display: block; min-height: 1.4286em; margin-bottom: 4px; font-size: 14px; line-height: 1.4286 } @media(max-width:600px) { .order-block__label { min-height: auto } } .order-block__label sup { color: var(--error) } .order-block__wrap .input-wrapper { width: 100%; margin: 0 } .order-block__wrap .dropdown { margin: 0 } .order-block__wrap .dropdown:not(.active).selected .dropdown__button { --color: var(--color-main); --color-hover: var(--color-main); --bg-color: var(--white); --bg-color-hover: var(--white); --bg-color-focus: var(--white); --border-color: var(--gray-5); --border-color-hover: var(--primary-hover); --border-color-focus: var(--primary-hover) } .order-block__text { font-size: 14px; line-height: 20px; color: var(--gray-3) } @media(max-width:900px) { .order-block__text { font-size: 12px; line-height: 16px } } .order__checkbox:not(:first-child) { margin-top: 1.5rem } @media(max-width:900px) { .order__checkbox:not(:first-child) { margin-top: 16px } } .order__checkbox:not(:last-child) { margin-bottom: 2.5rem } @media(max-width:900px) { .order__checkbox:not(:last-child) { margin-bottom: 24px } } .order__checkbox .checkbox { margin: 0 } .order__switch:not(:last-child) { margin-bottom: 1.5rem } @media(max-width:900px) { .order__switch:not(:last-child) { margin-bottom: 16px } } .order__switch .checkbox { margin: 0 } .order__switch .checkbox:not(:last-child) { margin-bottom: 1.5rem } @media(max-width:900px) { .order__switch .checkbox:not(:last-child) { margin-bottom: 16px } } .order__switch.show .order__blocks { display: none } .order__days { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -4px } @media(max-width:900px) { .order__days { margin: -3px } } .order__days .product-card-radio { margin: 4px } @media(max-width:900px) { .order__days .product-card-radio { margin: 3px } } .order__days .product-card-radio__input:checked~.product-card-radio__wrap, .order__days .product-card-radio__input:checked~.product-card-radio__wrap:hover { background-color: var(--secondary-7); -webkit-box-shadow: inset 0 0 0 1px var(--primary-default); box-shadow: inset 0 0 0 1px var(--primary-default) } .order__days .product-card-radio__wrap { padding: 8px 12px } @media(max-width:900px) { .order__days .product-card-radio__wrap { padding: 10px 15px } } @media(max-width:900px) { .order__days .product-card-radio__text { font-size: 14px; line-height: 20px } } .order-radio { display: -webkit-box; display: -ms-flexbox; display: flex } .order-radio:not(:last-child) { margin-bottom: 1rem } @media(max-width:900px) { .order-radio:not(:last-child) { margin-bottom: 12px } } .order-radio:not(.show) .order-radio__inner { display: none } .order-radio .checkbox, .order-radio .radio { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin: 0 } .order-radio__inner { margin-top: 1.25rem } .order__textarea .order-block { width: 100%; max-width: none; margin: 0 } .order__textarea .order-block .input-wrapper { display: -webkit-box; display: -ms-flexbox; display: flex } .order__textarea .order-block .textarea { width: 100%; height: 160px; margin: 0 } @media(max-width:900px) { .order__textarea .order-block .textarea { height: 136px } } .order__row--success .order__inner { max-width: none } .order-success__text { width: 100%; max-width: 656px; margin-bottom: 1.75rem; font-size: 1rem; line-height: 1.5 } @media(max-width:900px) { .order-success__text { margin-bottom: 20px; font-size: 14px; line-height: 20px } } .order-success__subtitle { margin: 0 0 2rem; font-size: 1.25rem; font-weight: 700; line-height: 1.4 } @media(max-width:900px) { .order-success__subtitle { margin: 0 0 20px; font-size: 16px; line-height: 1.5 } } .order-success__wrap { overflow: hidden } .order-success__inner { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -1.5rem } @media(max-width:1100px) { .order-success__inner { margin: -1rem } } @media(max-width:900px) { .order-success__inner { margin: -17px } } @media(max-width:600px) { .order-success__inner { margin: -10px -17px } } .order-success-item { width: calc(25% - 3rem); margin: 1.5rem } @media(max-width:1100px) { .order-success-item { width: calc(25% - 2rem); margin: 1rem } } @media(max-width:900px) { .order-success-item { width: calc(25% - 34px); margin: 17px } } @media(max-width:600px) { .order-success-item { width: calc(50% - 34px); margin: 10px 17px } } .order-success-item__img-wrapper { position: relative; width: 100%; max-width: 118px; margin-bottom: 1.25rem } @media(max-width:600px) { .order-success-item__img-wrapper { max-width: 94px; margin-bottom: 8px } } .order-success-item__img-wrapper:before { display: block; width: 100%; padding-bottom: 76.2712%; content: "" } .order-success-item__img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; -o-object-fit: contain; object-fit: contain } .order-success-item__text { font-size: 1rem; font-weight: 600; line-height: 1.5 } @media(max-width:900px) { .order-success-item__text { font-size: 12px; line-height: 18px } } .order-success>.button { margin: 1.5rem 0 0 } @media(max-width:900px) { .order-success>.button { margin: 24px 0 0 } } @media(max-width:600px) { .order-success>.button { width: 100% } } .personal { padding: 20px 0 112px } @media(max-width:1200px) { .personal { padding: 20px 0 80px; padding: 2px 0 40px } } .personal__title { font-size: 28px; font-weight: 700; line-height: 42px; color: var(--gray-1) } .personal__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } @media(max-width:768px) { .personal__wrap { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .personal__left { width: 100%; max-width: 248px; margin-right: 80px } @media(max-width:1366px) { .personal__left { margin-right: 40px } } @media(max-width:1200px) { .personal__left { margin-right: 20px } } @media(max-width:900px) { .personal__left { margin-right: 15px } } @media(max-width:768px) { .personal__left { max-width: 100%; margin-right: 0; margin-bottom: 16 } } .personal__right { width: 100% } .personal__right section:first-of-type { padding: 0 !important } .personal__cards { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -10px } @media(max-width:1200px) { .personal__cards { margin: -8px } } @media(max-width:900px) { .personal__cards { margin: -6px } } .personal .card { width: calc(50% - 20px); padding: 40px 32px; margin: 10px; background-color: var(--white); border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .08); box-shadow: 0 0 20px rgba(0, 0, 0, .08); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal .card { width: calc(50% - 16px); padding: 32px 24px; margin: 8px } } @media(max-width:1024px) { .personal .card { width: calc(100% - 16px) } } @media(max-width:900px) { .personal .card { width: calc(100% - 12px); padding: 24px 20px; margin: 6px } } .personal .card:hover { border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .15); box-shadow: 0 0 20px rgba(0, 0, 0, .15) } .personal .card__header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-bottom: 24px } @media(max-width:1200px) { .personal .card__header { margin-bottom: 18px } } @media(max-width:900px) { .personal .card__header { margin-bottom: 12px } } .personal .card__header-left, .personal .card__name { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .personal .card__name { -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 48px; height: 48px; margin-right: 16px; background-color: var(--primary-disable); border-radius: 100% } @media(max-width:1200px) { .personal .card__name { width: 44px; height: 44px; margin-right: 14px } } @media(max-width:900px) { .personal .card__name { width: 40px; height: 40px; margin-right: 12px } } .personal .card__name:before { font-size: 20px; font-weight: 700; line-height: 28px; color: var(--primary-default); content: attr(data-name) } @media(max-width:1200px) { .personal .card__name:before { font-size: 18px } } .personal .card__title { padding-right: 10px; margin: 0; font-size: 28px; font-weight: 700; line-height: 42px; color: var(--gray-1) } @media(max-width:1200px) { .personal .card__title { padding-right: 5px; font-size: 24px; line-height: 32px } } @media(max-width:900px) { .personal .card__title { font-size: 20px; line-height: 24px } } .personal .card__header-link { padding: 0; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--primary-default); background-color: transparent; border: 0; border-bottom: 1px dashed var(--primary-default); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal .card__header-link { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal .card__header-link { font-size: 13px } } .personal .card__header-link:hover { color: var(--primary-hover) } .personal .card__rows:not(:last-child) { margin-bottom: 16px } .personal .card__row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-3) } @media(max-width:1200px) { .personal .card__row { font-size: 13px; line-height: 18px } } .personal .card__row:not(:last-child) { margin-bottom: 16px } @media(max-width:1200px) { .personal .card__row:not(:last-child) { margin-bottom: 12px } } @media(max-width:900px) { .personal .card__row:not(:last-child) { margin-bottom: 8px } } .personal .card__row-link { display: block; width: -webkit-max-content; width: -moz-max-content; width: max-content; margin-top: 4px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal .card__row-link { margin-top: 2px; font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal .card__row-link { margin-top: 0 } } .personal .card__row-link:hover { color: var(--primary-hover) } .personal .card__row-text { margin-left: 8px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal .card__row-text { font-size: 14px; line-height: 20px } } .personal .card__line { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: 100%; margin-bottom: 12px } @media(max-width:1200px) { .personal .card__line { margin-bottom: 10px } } @media(max-width:900px) { .personal .card__line { margin-bottom: 8px } } .personal .card__line-progress { margin-bottom: 4px; border-bottom: 1px solid var(--secondary-5) } .personal .card__line-move { position: relative; bottom: -1px; width: 50%; height: 2px; background-color: var(--primary-default) } .personal .card__line-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } .personal .card__line-sale { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--primary-default) } @media(max-width:1200px) { .personal .card__line-sale { font-size: 14px; line-height: 20px } } .personal .card__text { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-2) } @media(max-width:1200px) { .personal .card__text { font-size: 14px; line-height: 20px } } .personal .card__order { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 22px } @media(max-width:1200px) { .personal .card__order { margin-bottom: 16px } } @media(max-width:900px) { .personal .card__order { margin-bottom: 10px } } .personal .card__order-text { margin-right: 8px; font-size: 20px; font-weight: 700; line-height: 28px; color: var(--gray-1) } @media(max-width:1200px) { .personal .card__order-text { font-size: 18px } } @media(max-width:900px) { .personal .card__order-text { font-size: 16px; line-height: 24px } } .personal .card__order-number { display: -webkit-inline-box; display: -ms-inline-flexbox; display: inline-flex; margin-right: 24px; font-size: 20px; font-weight: 700; line-height: 28px; color: var(--primary-default); border-bottom: 1px dashed var(--primary-default) } @media(max-width:1200px) { .personal .card__order-number { margin-right: 22px; font-size: 18px } } @media(max-width:900px) { .personal .card__order-number { margin-right: 20px; font-size: 16px; line-height: 24px } } .personal .card__order-status { padding: 2px 15px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--primary-default); background-color: var(--gray-7); border: 2px solid var(--primary-default); border-radius: 4px } @media(max-width:1200px) { .personal .card__order-status { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal .card__order-status { font-size: 13px; line-height: 18px } } .personal .card__body-left { margin-right: 20px } @media(max-width:1200px) { .personal .card__body-left { margin-right: 16px } } @media(max-width:900px) { .personal .card__body-left { margin-right: 12px } } .personal .card__body-icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 64px; height: 64px; background-color: var(--primary-disable); border-radius: 100% } @media(max-width:1200px) { .personal .card__body-icon { width: 48px; height: 48px } } @media(max-width:900px) { .personal .card__body-icon { width: 40px; height: 40px } } .personal .card__body-icon .svg { font-size: 32px } @media(max-width:1200px) { .personal .card__body-icon .svg { font-size: 24px } } @media(max-width:900px) { .personal .card__body-icon .svg { font-size: 20px } } .personal .card__body-event { display: -webkit-box; display: -ms-flexbox; display: flex; font-size: 20px; font-weight: 600; line-height: 32px; color: var(--gray-1) } @media(max-width:1200px) { .personal .card__body-event { font-size: 18px } } @media(max-width:900px) { .personal .card__body-event { font-size: 16px; line-height: 24px } } .personal .card__body-event span:not(:last-child) { position: relative; padding-right: 16px } .personal .card__body-event span:not(:last-child):after { position: absolute; top: 50%; right: 8px; width: 1px; height: 100%; max-height: 24px; content: ""; background-color: var(--gray-1); -webkit-transform: translateY(-50%); transform: translateY(-50%) } @media(max-width:1200px) { .personal .card__body-event span:not(:last-child):after { max-height: 20px } } .personal .card__body-date { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-3) } @media(max-width:1200px) { .personal .card__body-date { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal .card__body-date { font-size: 13px; line-height: 18px } } .personal .card__button { max-width: 150px; margin-top: 12px; margin-left: 84px } @media(max-width:1200px) { .personal .card__button { margin-left: 64px } } @media(max-width:900px) { .personal .card__button { margin-left: 52px } } @media(max-width:600px) { .personal .card__button { width: 100%; max-width: 100%; margin-top: 20px; margin-left: 0 } } .personal .card__button .button { width: 100%; margin: 0 } .personal .card--program .card__header { margin-bottom: 12px } @media(max-width:1200px) { .personal .card--program .card__header { margin-bottom: 10px } } @media(max-width:900px) { .personal .card--program .card__header { margin-bottom: 8px } } .personal .card--program .card__rows:not(:last-child) { margin-bottom: 12px } .personal .card--program .card__row { -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .personal .card--program .card__row:not(:last-child) { margin-bottom: 6px } .personal .card--orders .card__header { margin-bottom: 16px } @media(max-width:1200px) { .personal .card--orders .card__header { margin-bottom: 14px } } .personal .card--reminder .card__header { margin-bottom: 16px } @media(max-width:1200px) { .personal .card--reminder .card__header { margin-bottom: 14px } } .personal .card--reminder .card__body { display: -webkit-box; display: -ms-flexbox; display: flex } .personal .dropdown { display: none } @media(max-width:768px) { .personal .dropdown { display: -webkit-box; display: -ms-flexbox; display: flex; margin: 0 0 16px } } .personal .dropdown.active .dropdown__arrow { color: var(--primary-default); fill: var(--primary-default) } .personal .dropdown.active .dropdown__button { border-color: var(--primary-default) } .personal .dropdown__item.selected .checkbox { background-color: var(--gray-7) } .personal .dropdown__item.selected .checkbox .checkbox__text { color: var(--primary-hover) } .personal__data { width: 100%; padding: 48px 56px; background-color: var(--white); border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .08); box-shadow: 0 0 20px rgba(0, 0, 0, .08) } @media(max-width:1200px) { .personal__data { padding: 32px 24px } } @media(max-width:900px) { .personal__data { padding: 24px 16px } } .personal__data-item:not(:last-child) { margin-bottom: 56px } @media(max-width:1200px) { .personal__data-item:not(:last-child) { margin-bottom: 40px } } .personal__data-title { margin-bottom: 32px; font-size: 28px; font-weight: 700; line-height: 42px; color: var(--gray-1) } @media(max-width:1200px) { .personal__data-title { margin-bottom: 24px; font-size: 24px; line-height: 36px } } @media(max-width:900px) { .personal__data-title { margin-bottom: 16px } } .personal__data-save { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-top: 24px } @media(max-width:600px) { .personal__data-save { margin-top: 20px } } .personal__data-save .button { width: 100%; max-width: 219px; margin: 0 } .personal__data-save .button:not(:last-child) { margin-right: 16px } @media(max-width:600px) { .personal__data-save .button:not(:last-child) { margin-right: 0; margin-bottom: 12px } } @media(max-width:600px) { .personal__data-save .button { max-width: 100% } } .personal__data-save .button--secondary { max-width: 115px } @media(max-width:600px) { .personal__data-save .button--secondary { max-width: 100% } } .personal__form { max-width: 732px } .personal__inputs { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -10px -16px } @media(max-width:1200px) { .personal__inputs { margin: -5px -8px } } @media(max-width:900px) { .personal__inputs { margin: -6px 0 } } .personal__input { position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; width: calc(50% - 32px); max-width: 468px; height: -webkit-max-content; height: -moz-max-content; height: max-content; margin: 10px 16px } @media(max-width:1200px) { .personal__input { width: calc(50% - 16px); margin: 5px 8px } } @media(max-width:1024px) { .personal__input { width: calc(100% - 16px); max-width: 100% } } @media(max-width:900px) { .personal__input { width: 100%; margin: 6px 0 } } .personal__input span { color: var(--red) } .personal__input label { margin-bottom: 4px; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-1) } .personal__input .input { width: 100%; padding: 9px 11px; margin: 0; font-size: 14px; font-weight: 300; line-height: 20px } .personal__input-pass { position: relative } .personal__input-pass .input-fogot { position: absolute; top: 0; right: 0; font-size: 14px; font-weight: 600; line-height: 20px; color: var(--primary-default); -webkit-transition: .3s; transition: .3s } @media(max-width:768px) { .personal__input-pass .input-fogot { font-size: 12px; line-height: 18px } } .personal__input-pass .input-fogot:hover { color: var(--primary-hover) } .personal__input .input-submit { position: absolute; right: 0; bottom: -24px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--red) } @media(max-width:1200px) { .personal__input .input-submit { font-size: 12px; line-height: 20px } } @media(max-width:359px) { .personal__input .input-submit { font-size: 10px; line-height: 18px } } .personal__input .input-submit a { display: block; margin-left: 4px; color: var(--red); border-bottom: 1px dashed var(--red) } .personal__input--big { width: 100%; max-width: 100% } .personal__input-tooltip { position: absolute; top: calc(100% + 8px); z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; padding: 20px 12px; font-size: 14px; font-weight: 600; line-height: 20px; color: var(--gray-1); visibility: hidden; background-color: var(--white); border-radius: 2px; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .12); box-shadow: 0 0 20px rgba(0, 0, 0, .12); opacity: 0; -webkit-transition: .3s; transition: .3s } @media(max-width:600px) { .personal__input-tooltip { top: calc(100% + 4px); padding: 16px 12px 16px 11px; font-size: 12px; line-height: 18px } } .personal__input-tooltip:before { position: absolute; top: -20px; left: 11px; content: ""; border: 12px solid transparent; border-bottom: 12px solid var(--white) } @media(max-width:600px) { .personal__input-tooltip:before { top: -16px } } .personal__input-tooltip svg { -ms-flex-negative: 0; flex-shrink: 0; margin-right: 4px; font-size: 20px; color: var(--gray-3); stroke: var(--gray-3) } @media(max-width:600px) { .personal__input-tooltip svg { font-size: 16px } } .personal__input-tooltip span { color: var(--error) } .personal__input-tooltip.active { visibility: visible; opacity: 1 } .personal__input-close { position: absolute; top: 8px; right: 8px; width: 14px; height: 14px; padding: 0; background-color: transparent; border: 0 } @media(max-width:600px) { .personal__input-close { display: none; width: 10px; height: 10px } } .personal__input-close .svg { font-size: 14px } @media(max-width:600px) { .personal__input-close .svg { font-size: 10px } } .personal__order { width: 100% } .personal__order .item { padding: 40px 32px; background-color: var(--white); border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .08); box-shadow: 0 0 20px rgba(0, 0, 0, .08) } @media(max-width:1200px) { .personal__order .item { padding: 32px 24px } } @media(max-width:900px) { .personal__order .item { padding: 24px 16px } } .personal__order .item:not(:last-child) { margin-bottom: 20px } .personal__order .item__header { margin-bottom: 22px } @media(max-width:1200px) { .personal__order .item__header { margin-bottom: 20px } } .personal__order .item__order-wrap { width: 100% } .personal__order .item__order-left, .personal__order .item__order-wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } @media(max-width:600px) { .personal__order .item__order-left { -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; width: 100% } } .personal__order .item__order-info { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center } @media(max-width:950px) { .personal__order .item__order-info { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } } .personal__order .item__order-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } @media(max-width:600px) { .personal__order .item__order-inner { margin-bottom: 4px } } .personal__order .item__repeat { display: block; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--primary-default); border-bottom: 1px dashed var(--primary-default); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal__order .item__repeat { font-size: 14px; line-height: 20px } } @media(max-width:640px) { .personal__order .item__repeat { display: none } } .personal__order .item__repeat:hover { color: var(--primary-hover); border-color: var(--primary-hover) } .personal__order .item__repeat--mobile { display: none } @media(max-width:640px) { .personal__order .item__repeat--mobile { display: inline-block; margin-top: 20px } } .personal__order .item__order { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 16px } @media(max-width:1200px) { .personal__order .item__order { margin-bottom: 12px } } @media(max-width:900px) { .personal__order .item__order { margin-bottom: 8px } } .personal__order .item__order-text { font-size: 24px; font-weight: 700; line-height: 36px; color: var(--gray-1) } @media(max-width:1200px) { .personal__order .item__order-text { font-size: 20px; line-height: 28px } } @media(max-width:900px) { .personal__order .item__order-text { font-size: 18px } } .personal__order .item__order-text span { position: relative } .personal__order .item__order-text span:not(:last-child) { padding-right: 16px } @media(max-width:900px) { .personal__order .item__order-text span:not(:last-child) { padding-right: 12px } } @media(max-width:600px) { .personal__order .item__order-text span:not(:last-child) { padding-right: 8px } } .personal__order .item__order-text span:not(:last-child):after { position: absolute; top: 50%; right: 8px; width: 2px; height: 100%; max-height: 22px; content: ""; background-color: var(--gray-1); -webkit-transform: translateY(-50%); transform: translateY(-50%) } @media(max-width:900px) { .personal__order .item__order-text span:not(:last-child):after { right: 6px } } @media(max-width:600px) { .personal__order .item__order-text span:not(:last-child):after { right: 4px } } .personal__order .item__order-number { margin: 0 4px; font-size: 24px; font-weight: 700; line-height: 36px; color: var(--primary-default); cursor: pointer; border-bottom: 1px dashed var(--primary-default); -webkit-transition: .3s; transition: .3s } .personal__order .item__order-number:hover { color: var(--primary-hover); border-color: var(--primary-hover) } @media(max-width:1200px) { .personal__order .item__order-number { margin: 0 2px; font-size: 20px; line-height: 28px } } @media(max-width:900px) { .personal__order .item__order-number { margin: 0 8px; font-size: 18px } } .personal__order .item__order-status { padding: 2px 15px; margin-left: 24px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--primary-default); background-color: var(--gray-7); border: 2px solid var(--primary-default); border-radius: 4px } @media(max-width:1200px) { .personal__order .item__order-status { margin-left: 10px; font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal__order .item__order-status { padding: 4px 15px; margin-left: 16px; font-size: 13px; line-height: 18px } } @media(max-width:600px) { .personal__order .item__order-status { -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end } } .personal__order .item__order--canceled { background-color: var(--white); border-color: var(--gray-5) } .personal__order .item__date { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .personal__order .item__date { font-size: 14px; line-height: 20px } } @media(max-width:600px) { .personal__order .item__date { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .personal__order .item__date span { font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-3) } @media(max-width:1200px) { .personal__order .item__date span { font-size: 13px; line-height: 18px } } .personal__order .item__body-info { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100% } .personal__order .item__body-info:not(:last-child) { margin-bottom: 24px } @media(max-width:600px) { .personal__order .item__body-info { position: relative; width: 100% } } .personal__order .item__body-left { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; width: 100%; margin-right: 20px } @media(max-width:1200px) { .personal__order .item__body-left { margin-right: 10px } } @media(max-width:600px) { .personal__order .item__body-left { margin-right: 0 } } .personal__order .item__body-inner { width: 100% } .personal__order .item__img { position: relative; -ms-flex-negative: 0; flex-shrink: 0; width: 100%; max-width: 152px; margin-right: 16px } @media(max-width:1200px) { .personal__order .item__img { max-width: 125px; margin-right: 12px } } @media(max-width:900px) { .personal__order .item__img { max-width: 100px; margin-right: 10px } } @media(max-width:768px) { .personal__order .item__img { max-width: 70px; margin-right: 9px } } .personal__order .item__img:before { display: block; padding-bottom: 100%; content: "" } .personal__order .item__img img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: 8px; -o-object-fit: cover; object-fit: cover } .personal__order .item__name { width: 100%; margin-top: 0; margin-bottom: 20px; font-size: 16px; font-weight: 600; line-height: 20px; color: var(--gray-1) } @media(max-width:1200px) { .personal__order .item__name { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal__order .item__name { margin-right: 10px } } .personal__order .item__sizes { position: static; padding: 0 } @media(max-width:600px) { .personal__order .item__sizes { -ms-flex-negative: 0; flex-shrink: 0 } } .personal__order .item__body-right { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; width: 100%; max-width: 260px } @media(max-width:1200px) { .personal__order .item__body-right { max-width: 200px } } @media(max-width:900px) { .personal__order .item__body-right { max-width: 175px } } @media(max-width:600px) { .personal__order .item__body-right { display: none } } .personal__order .item__body-right--mobile { display: none } @media(max-width:600px) { .personal__order .item__body-right--mobile { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; max-width: unset } } .personal__order .item__body-parameters { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center } .personal__order .item__count { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .personal__order .item__count { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal__order .item__count { font-size: 12px; line-height: 18px } } .personal__order .item__price { margin-left: 32px; font-size: 24px; font-weight: 800; line-height: 36px; color: var(--gray-1) } @media(max-width:1200px) { .personal__order .item__price { font-size: 20px; line-height: 28px } } @media(max-width:900px) { .personal__order .item__price { font-size: 16px; line-height: 24px } } .personal__order .item__footer { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; margin-top: 24px } @media(max-width:1200px) { .personal__order .item__footer { margin-top: 20px } } .personal__order .item__total { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end; margin-bottom: 10px; font-size: 16px; font-weight: 600; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .personal__order .item__total { margin-bottom: 16px; font-size: 14px; line-height: 20px } } .personal__order .item__total-sum { margin-left: 8px; font-size: 24px; font-weight: 800; line-height: 34px; color: var(--primary-default); cursor: pointer; border-bottom: 1px dashed var(--primary-default); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal__order .item__total-sum { font-size: 20px; line-height: 28px } } @media(max-width:900px) { .personal__order .item__total-sum { margin-left: 10px; font-size: 16px; line-height: 24px } } .personal__order .item__total-sum:hover { color: var(--primary-hover) } .personal__order .item__footer-inner { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between } @media(max-width:600px) { .personal__order .item__footer-inner { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column } } .personal__order .item__footer-left { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: end; -ms-flex-align: end; align-items: flex-end } .personal__order .item__payment { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--gray-3) } @media(max-width:1200px) { .personal__order .item__payment { font-size: 13px; line-height: 18px } } .personal__order .item__payment span { display: block; margin-top: 4px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .personal__order .item__payment span { font-size: 14px; line-height: 20px } } @media(max-width:600px) { .personal__order .item__payment span { margin-top: 0 } } .personal__order .item__edit { margin-left: 16px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--primary-default); cursor: pointer; border-bottom: 1px dashed var(--primary-default); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal__order .item__edit { margin-left: 10px; font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal__order .item__edit { font-size: 12px; line-height: 18px } } .personal__order .item__edit:hover { color: var(--primary-hover); border-color: var(--primary-hover) } @media(max-width:600px) { .personal__order .item__footer-right { width: 100%; max-width: 100%; margin-top: 20px } } .personal__order .item__footer-right .button { margin: 0 } @media(max-width:600px) { .personal__order .item__footer-right .button { width: 100% } } .personal__reminders { width: 100% } .personal__reminders-header { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 24px } @media(max-width:1200px) { .personal__reminders-header { margin-bottom: 20px } } @media(max-width:600px) { .personal__reminders-header { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start } } .personal__reminders-title { margin: 0; font-size: 28px; font-weight: 700; line-height: 42px; color: var(--gray-1) } @media(max-width:1200px) { .personal__reminders-title { font-size: 24px; line-height: 32px } } .personal__reminders-add { padding: 0; margin-left: 16px; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--primary-default); background-color: transparent; border: 0; -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal__reminders-add { margin-left: 12px; font-size: 14px; line-height: 20px } } @media(max-width:600px) { .personal__reminders-add { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; margin-top: 8px; margin-left: 0 } } .personal__reminders-add:hover { color: var(--primary-hover) } .personal .reminders__cards { display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin: -6px } @media(max-width:600px) { .personal .reminders__cards { margin: -4px } } .personal .reminders .card { position: relative; width: calc(25% - 12px); padding: 32px 24px; margin: 6px; border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .08); box-shadow: 0 0 20px rgba(0, 0, 0, .08) } @media(max-width:1366px) { .personal .reminders .card { width: calc(33.33333% - 12px) } } @media(max-width:1200px) { .personal .reminders .card { padding: 24px 16px } } @media(max-width:900px) { .personal .reminders .card { width: calc(50% - 12px); padding: 20px 12px } } @media(max-width:600px) { .personal .reminders .card { width: calc(50% - 8px); margin: 4px } } .personal .reminders .card:hover { z-index: 3; -webkit-box-shadow: none; box-shadow: none } @media(max-width:1024px) { .personal .reminders .card:hover { -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .15); box-shadow: 0 0 20px rgba(0, 0, 0, .15) } } .personal .reminders .card:hover .card__footer { visibility: visible; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .15); box-shadow: 0 0 20px rgba(0, 0, 0, .15); opacity: 1 } @media(max-width:1024px) { .personal .reminders .card:hover .card__footer { -webkit-box-shadow: none; box-shadow: none } } .personal .reminders .card__wrap { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; height: 100% } .personal .reminders .card__header { position: relative; z-index: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: start; -ms-flex-align: start; align-items: flex-start; -webkit-box-pack: start; -ms-flex-pack: start; justify-content: flex-start; margin-bottom: 16px } .personal .reminders .card__header-left { margin-right: 8px } .personal .reminders .card__icon { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 32px; height: 32px; background-color: var(--primary-disable); border-radius: 100% } @media(max-width:1200px) { .personal .reminders .card__icon { width: 28px; height: 28px } } @media(max-width:900px) { .personal .reminders .card__icon { width: 24px; height: 24px } } .personal .reminders .card__icon .svg { font-size: 18px } @media(max-width:1200px) { .personal .reminders .card__icon .svg { font-size: 16px } } @media(max-width:900px) { .personal .reminders .card__icon .svg { font-size: 14px } } @media(max-width:768px) { .personal .reminders .card__icon .svg { font-size: 12px } } .personal .reminders .card__title { padding: 0; margin: 0; font-size: 18px; font-weight: 600; line-height: 28px; color: var(--gray-1) } @media(max-width:1200px) { .personal .reminders .card__title { font-size: 16px; line-height: 24px } } @media(max-width:900px) { .personal .reminders .card__title { font-size: 14px; line-height: 20px } } @media(max-width:768px) { .personal .reminders .card__title { font-size: 13px; line-height: 18px } } .personal .reminders .card__date { font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-3) } @media(max-width:1200px) { .personal .reminders .card__date { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal .reminders .card__date { font-size: 13px; line-height: 18px } } @media(max-width:768px) { .personal .reminders .card__date { font-size: 12px; line-height: 16px } } .personal .reminders .card__body { position: relative; z-index: 2; -webkit-box-flex: 1; -ms-flex-positive: 1; flex-grow: 1 } .personal .reminders .card__row { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: horizontal; -webkit-box-direction: normal; -ms-flex-direction: row; flex-direction: row; -ms-flex-wrap: wrap; flex-wrap: wrap; font-size: 16px; font-weight: 400; line-height: 24px; color: var(--gray-1) } @media(max-width:1200px) { .personal .reminders .card__row { font-size: 14px; line-height: 20px } } @media(max-width:900px) { .personal .reminders .card__row { font-size: 13px; line-height: 18px } } @media(max-width:768px) { .personal .reminders .card__row { font-size: 12px; line-height: 14px } } @media(max-width:600px) { .personal .reminders .card__row { -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; line-height: 16px } } .personal .reminders .card__row:not(:last-child) { margin-bottom: 6px } @media(max-width:768px) { .personal .reminders .card__row:not(:last-child) { margin-bottom: 8px } } .personal .reminders .card__row span { display: inline-block; margin-right: 4px; font-size: 14px; font-weight: 400; line-height: 24px; color: var(--gray-3) } @media(max-width:1200px) { .personal .reminders .card__row span { font-size: 13px; line-height: 18px } } @media(max-width:900px) { .personal .reminders .card__row span { font-size: 12px; line-height: 16px } } @media(max-width:768px) { .personal .reminders .card__row span { font-size: 10px; line-height: 14px } } @media(max-width:600px) { .personal .reminders .card__row span { margin-right: 0; margin-bottom: 2px } } .personal .reminders .card__footer { position: absolute; bottom: -92px; left: 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-direction: column; flex-direction: column; -webkit-box-pack: end; -ms-flex-pack: end; justify-content: flex-end; width: 100%; height: calc(100% + 92px); padding: 16px 24px 32px; visibility: hidden; background-color: var(--white); border-radius: 8px; -webkit-box-shadow: 0 0 20px rgba(0, 0, 0, .08); box-shadow: 0 0 20px rgba(0, 0, 0, .08); opacity: 0; -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal .reminders .card__footer { bottom: -88px; height: calc(100% + 88px); padding: 16px 24px } } @media(max-width:1024px) { .personal .reminders .card__footer { position: static; padding: 0; margin-top: 16px; visibility: visible; -webkit-box-shadow: none; box-shadow: none; opacity: 1 } } .personal .reminders .card__button { width: 100%; max-width: 100%; margin: 0 } @media(max-width:900px) { .personal .reminders .card__button { padding: 6px; font-size: 12px; line-height: 16px } } .personal .reminders .card__delete { display: -webkit-box; display: -ms-flexbox; display: flex; padding: 0; margin: 16px auto 0; font-size: 14px; font-weight: 400; line-height: 20px; color: var(--primary-default); background-color: transparent; border: 0; border-bottom: 1px dashed var(--primary-default); -webkit-transition: .3s; transition: .3s } @media(max-width:1200px) { .personal .reminders .card__delete { margin-top: 12px } } @media(max-width:900px) { .personal .reminders .card__delete { margin-top: 8px; font-size: 12px; line-height: 16px } } .personal .reminders .card__delete:hover { color: var(--primary-hover); border-color: var(--primary-hover) } .margin-b-15{ margin-bottom: 15px; } .news-detail ul { list-style: disc; margin-left: 40px; } .desc-section-c ul { list-style: disc; margin-left: 40px; } .news-detail ol { list-style: auto; margin-left: 40px; } .gross{ font-weight: bold; } @media (max-width:1300px){ .header__link{ font-size: .8rem; } } .main-section-wrap{ display: flex; flex-wrap: wrap; justify-content: space-around; margin-top: 30px; } .main-section-inner{ width: 185px; min-width: 185px; display: flex; flex-direction: column; gap: 15px; align-items: center; margin-bottom: 20px; } .main-section-img img{ max-width: 100%; } .main-section-hdr{ font-size: 18px; font-weight: 600; line-height: 16px; text-align: center; color: #333; } .main-section-wrap a:hover{ opacity: .85; transition: .4s; } @media (max-width: 1360px){ .main-section-wrap{ max-width: 900px; margin: 30px auto 0; } } @media (max-width: 767px){ .main-section-wrap{ flex-wrap: nowrap; overflow-x: auto; justify-content: flex-start; gap: 20px; } .main-section-hdr{ font-size: 16px; } } .partners_slider_wrapper { padding-top: 30px; margin-top: 40px; margin-bottom: 50px; } .owl-dots { display: flex; padding-top: 20px; padding-bottom: 20px; justify-content: center; gap: 8px; align-items: center; } .partners_slider_wrapper button.owl-dot.active { width: 15px; height: 15px; border: 1px solid #9f62ba; background: #9f62ba!important; border-radius: 50%; } .partners_slider_wrapper button.owl-dot { width: 8px; height: 8px; border: 1px solid #9f62ba!important; border-radius: 50%; transition: all 0.3s ease; } .how-buy-container h2{ text-align: center; } .how-buu-cart-wrap h2{ text-align: left; } .how-buy-wrapper{ display: flex; flex-wrap: wrap; justify-content: space-around; padding: 40px 10px 20px; margin: 50px 0 70px; background: #F5EFF8; border-radius: 12px; } .how-buy-inner{ text-align: center; width: 240px; display: flex; flex-direction: column; margin-bottom: 20px; gap: 10px; } .how-buy-img img{ height: 60px; margin: 0 auto; } .how-buy-txt{ font-size: 16px; font-weight: 700; line-height: 24px; text-align: center; color: #000000; } .card-advant-wrapper{ display: flex; flex-wrap: wrap; justify-content: space-between; padding: 40px 40px 30px; margin: 30px 0 20px; background: #F5EFF8; border-radius: 12px; } .card-advant-inner{ width: 240px; display: flex; justify-content: flex-start; align-items: center; flex-wrap: nowrap; margin-bottom: 10px; gap: 10px; } .card-advant-img img{ height: 30px; margin-right: 5px; } .card-advant-txt{ font-size: 16px; font-weight: 400; line-height: 24px; text-align: left; color: #333; } @media (max-width: 900px){ .card-advant-wrapper{ justify-content: space-around; } } .alert.alert-success { color: green; font-weight: bold; } .purple_flex { display: flex; flex-wrap: nowrap; align-items: center; justify-content: space-between; } .purple_line {background: #9F62BA;} .purple_line_menu_item a { color: #fff; display: flex; align-items: center; } .purple_line_menu_item { display: flex; gap: 25px; min-height: 64px; } .purple_line_menu { position: relative; } .purple_line_search { flex-grow: 1; } form.header__search { margin-left: auto; margin-right: 0; } @media screen and (max-width:1350px) { .purple_line_menu_item { gap: 15px; } .purple_line_search { max-width: 220px; } } @media screen and (max-width:1100px) { .purple_flex { display: none; } } .on_main_products_title h2 { margin-bottom: 0; } .on_main_products_title { margin-bottom: 30px; margin-top: 50px; } .seo_text__head { color: rgb(51, 51, 51); font-size: 40px; font-weight: 700; line-height: 60px; text-align: left; } .seo_text_1 { padding-top: 80px; padding-bottom: 50px; } .seo_text__head { margin-bottom: 50px; } .row_seo_text_flex { display: flex; gap: 10px; align-items: flex-start; justify-content: flex-start; } .row_seo_text_flex_image { flex: none; max-width: 100%; width: 440px; } .purple_container_row { background: linear-gradient(-41.67deg, rgb(124, 88, 150) 5.12%, rgb(190, 105, 190) 85.676%), rgb(245, 239, 248); padding: 50px 75px; position: relative; max-height: 346px; display: flex; align-items: center; justify-content: space-between; gap: 20px; } .purple_container_row_text_head { color: rgb(255, 255, 255); font-size: 16px; font-weight: 700; line-height: 24px; } .purple_container_row_text_under_head { color: rgb(255, 255, 255); font-size: 40px; font-weight: 700; margin-bottom: 20px; } .purple_container_row_text_text { font-size: 16px; font-weight: 400; color: #fff; } .purple_container_row_text_button a { border-radius: 4px; background: rgb(255, 255, 255); padding: 10px 40px; display: inline-block; transition: all 0.3s ease; } .purple_container_row_text_button { margin-top: 30px; margin-bottom: 20px; font-weight: bold; } .purple_container_row_text_button a:hover { box-shadow: inset 0 0 4px var(--primary-hover); } .purple_container_row_text { width: 50%; } .purple_container_wrapper { padding-bottom: 100px; } /* .purple_container_row_image { position: absolute; top: -100%; transform: translateY(50%); right: 75px; }*/ .pre_section_row_flex { display: flex; gap: 30px; } .pre_section { padding: 50px 0; } .pre_section_image { flex: none; } .pre_head { color: rgb(51, 51, 51); font-size: 40px; font-weight: 700; margin-bottom: 30px; } .pre_section_text_item { display: flex; gap: 20px; margin-bottom: 20px; } .pre_section_text_item_icon { flex: none; } .other_text { margin: 20px 0; } .pre_section_text_item_text_head { font-weight: bold; } @media screen and (max-width:1279px) { .pre_section_row_flex { flex-direction: column; } .pre_section_image { display: none; } } @media screen and (max-width:1199px) { .purple_container_row_text_under_head { font-size: 24px; line-height: 28px; } } @media screen and (max-width:991px) { .purple_container_row { max-height: unset; flex-direction: column; } .purple_container_row { padding: 15px; } .purple_container_row_text { width: 100%; } .seo_text__head { font-size: 24px; line-height: 28px; } } @media screen and (max-width:767px) { .row_seo_text_flex { flex-direction: column; } } .blog_slider_wrapper .owl-nav { top: 35%; } textarea#FORM01_FIELD_MESSAGE { border-color: var(--gray-5); resize: none; width: 100%; margin-bottom: 30px; margin-top: 6px; padding-left: 10px; padding-right: 10px; } /* FAQ faq_accordion */ .text-content ul.faq_accordion-in-content{ padding-left: 0px; padding-right: 0px; } .faq_accordion { margin: 0; margin-bottom: 1.5rem; padding: 0; list-style: none; } .faq_accordion li { position: static; padding-left: 0px; margin-bottom: 10px; } .faq_accordion li:before{ display: none; } .faq_accordion_item { border-bottom: 1px solid #fff; } .faq_accordion_item:last-of-type { border-bottom: none; } .faq_accordion_trigger { display: block; background-color: #9F62BA; color: #ffffff; font-weight: bold; cursor: pointer; padding: 1.2em; } .faq_accordion_toggle:checked ~ .faq_accordion_trigger { background-color: #9F62BA; } .faq_accordion_toggle { position: absolute; display: none; } .faq_accordion_target { border: 0; clip: rect(0 0 0 0); height: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute; width: 1px; background-color: #F5EFF8; color: #000; } .faq_accordion_toggle:checked ~ .faq_accordion_target { position: static; overflow: visible; clip: auto; margin: auto; padding: 1.2rem; width: auto; height: auto; -webkit-animation:fadeIn ease-in 0.5s; -moz-animation:fadeIn ease-in 0.5s; animation:fadeIn ease-in 0.5s; } @-moz-keyframes fadeIn { from { opacity: 0; } to { opacity: 1 } } @-webkit-keyframes fadeIn { from { opacity: 0; } to { opacity: 1 } } @keyframes fadeIn { from { opacity: 0; } to { opacity: 1 } } .section-tags-container{ display: flex; flex-wrap: wrap; justify-content: flex-start; gap: 15px; } .section-tags-container a{ padding: 12px; color: #333; background: #f5eff8; border-radius: 10px; } .section-tags-container a:hover{ opacity: .85; text-decoration: none; } .section-tags-container:before, .section-tags-container:after{ display: none; } .sitemap-wrapper .bx_sitemap_ul{ columns: 2; } .sitemap-wrapper .bx_sitemap_ul > li > h2{ font-weight: bold; margin-top: 10px; } .sitemap-wrapper .bx_sitemap .bx_sitemap_li_title a { color: #9f62ba; } .sitemap-wrapper .bx_sitemap_ul ul li{ padding-left: 30px; } .sitemap-wrapper .map-columns a{ font-weight: normal; padding-left: 30px; } @media (max-width: 480px){ .sitemap-wrapper .bx_sitemap_ul{ columns: 1; } } @media (min-width: 1101px){ .giftMenuLink, .aboutMenuLink{ color: inherit; } } ol.decimal{ list-style: decimal; margin-left: 30px; margin-bottom: 30px; } ol.decimal li{ margin-bottom: 10px; } .ya-share2{ position: absolute; top: -30px; right: 0; } @media (max-width: 900px){ .ya-share2{ position: relative; display: flex; align-self: flex-end; top: auto; right: auto; } .ya-share2__link_more.ya-share2__link_more-button-type_short{ padding: 1px !important; } } .now-watch{ margin-top: 30px; color: #828282; } /* BOTTOM FORM */ .purple_bottom_container_wrapper form#footer__form{ max-width: 100%; border-radius: 0px; border: 0px; padding-left: 0px; } .purple_bottom_container_wrapper .inputs-block__form{ display: flex; flex-wrap: nowrap; gap: 15px; margin-top: 20px; } .purple_bottom_container_wrapper .inputs-block__form .formgroup{ width: 49%; margin: 0px; } .purple_bottom_container_wrapper form#footer__form input{ font-family: NunitoSans, Arial; width: 100%; border: 0px; border-radius: 2px; padding: 10px; } .purple_bottom_container_wrapper form#footer__form textarea{ font-family: NunitoSans, Arial; resize: none; width: 100%; height: 90px; border-radius: 2px; padding: 10px; } .purple_bottom_container_wrapper form#footer__form button.send{ font-family: NunitoSans, Arial; font-weight: 700; font-size: 16px; line-height: 24px; text-align: center; border: 0px; color: #BE69BE; margin: 20px auto 0 0; background: #ffffff; padding: 7px 20px; } .purple_bottom_container_wrapper form#footer__form button.send:hover{ box-shadow: inset 0 0 4px var(--primary-hover); transition: .3s; } .purple_bottom_container_wrapper { padding: 80px 0; } .purple_bottom_container_row { background: linear-gradient(-41.67deg, rgb(124, 88, 150) 5.12%, rgb(190, 105, 190) 85.676%), rgb(245, 239, 248); padding: 50px 75px; position: relative; max-height: 485px; display: flex; align-items: center; justify-content: space-between; gap: 20px; } .purple_bottom_container_row_text_head { color: rgb(255, 255, 255); font-size: 40px; font-weight: 700; margin: 20px 0; } .purple_bottom_container_row_text_text { font-size: 16px; font-weight: 400; color: #fff; } .purple_bottom_container_row_text { width: 50%; } .purple_bottom_container_wrapper .agree__block{ margin-top: 20px; } .agree__block label{ position: relative; } .agree__block label .checkbox__input{ height: auto !important; width: auto !important; } .purple_bottom_container_wrapper .agree__block label{ display: flex; } .purple_bottom_container_wrapper .agree__block .checkbox__text, .purple_bottom_container_wrapper .agree__block .checkbox__text a{ font-family: NunitoSans, Arial; font-weight: 400; font-size: 16px; line-height: 24px; color: #ffffff; text-align: left; padding-top: 0px; padding-left: 5px; } .purple_bottom_container_wrapper .agree__block .checkbox__text a{ text-decoration: underline; } @media (max-width: 991px){ .purple_bottom_container_row{ flex-direction: column; } .purple_bottom_container_row_text{ width: 100%; } .purple_bottom_container_row_image{ display: none; } .purple_bottom_container_row{ max-height: 100%; } } @media (max-width: 767px){ .purple_bottom_container_wrapper form#footer__form{ padding-right: 0px; } .purple_bottom_container_row_text_head { font-size: 24px; } .purple_bottom_container_wrapper .agree__block .checkbox__text, .purple_bottom_container_wrapper .agree__block .checkbox__text a{ font-size: 14px; } .purple_bottom_container_wrapper form#footer__form button.send{ width: 100%; } .purple_bottom_container_wrapper .inputs-block__form{ flex-direction: column; } .purple_bottom_container_wrapper .inputs-block__form .formgroup{ width: 100%; } .purple_bottom_container_row{ padding: 40px; } .purple_bottom_container_row_text_text { line-height: 22px; } } @media (max-width: 480px){ .purple_bottom_container_row{ padding: 30px; } } .show_more_chars, .hide_chars{ width: 100%; font-size: 14px; font-weight: 400; line-height: 17px; color: #9F62BA; margin: 10px 0; text-align: center; } .show_more_chars:hover, .hide_chars:hover{ cursor: pointer; text-decoration: underline; } .hidden_char, .hide_chars{ display: none; } .hidden_item{ display: none; } .modal-menu-btn{ border-radius: 4px; background: rgb(255, 255, 255); padding: 10px 40px; display: inline-block; transition: all 0.3s ease; border: 1px solid #9f62ba; } @media (min-width: 1101px){ .modal-menu-btn{ display: none; } } .sort-select{ padding: 7px 20px; font-size: 16px; border-color: #ccc; color: #757575; } .sort-select-wrap{ display: flex; justify-content: flex-end; } @media (max-width: 900px){ .sort-select{ width: 100%; } } .oplata__col a:hover{ color: inherit !important; cursor: default; text-decoration: none; } a.footer-accordion__title{ color: #333333; } a.footer-accordion__title:hover{ color: #7f4f95; text-decoration: underline; } .img-right, .right-img{ float: right; width: 350px; max-width: 100%; margin: 0 0 10px 20px; } @media (max-width: 480px){ .img-right, .right-img{ float: none; width: 100% !important; margin: 10px 0; } } .section_reviews_slider .review_item_text{ margin-top: 15px; line-height: 20px; } .summer_bonus_15{ margin: 40px 0; } /* SLIDER 15 PERCENT */ @media (max-width: 600px){ #bx_3218110189_53039 .banner-card__button{ position: absolute; right: 20px; bottom: 20px; } } @media (min-width: 601px) and (max-width: 800px){ #bx_3218110189_53039 picture{ display: none; } #bx_3218110189_53039{ background: url('/img/bann_15_tablet_1.png') no-repeat; background-size: 150% 100%; background-position: center; } #bx_3218110189_53039 .banner-card__button{ position: absolute; left: 30px; bottom: 30px; } } .popular-block-wrap{ margin: 10px 0 20px; } .popular-block-hdr{ font-weight: 400; font-size: 21px; line-height: 100%; color: #000; margin-bottom: 15px; } .popular-block-row{ display: flex; flex-wrap: wrap; justify-content: flex-start; margin: 15px 0; gap: 20px; } .popular-block-col{ display: flex; flex-direction: column; width: 210px; margin-bottom: 15px; gap: 6px; } .popular-block-col a{ display: block; } .popular-block-wrap .flowers__block{ margin-bottom: 20px; } @media (max-width: 767px){ .popular-block-row{ justify-content: space-around; gap: unset; } .popular-block-col{ width: 49%; } } .product-like-mobile{ display: none; position: absolute; top: 10px; right: 10px; } @media (max-width: 480px){ .blog-page-wrapper{ display: flex; flex-direction: column; } .blog-page-wrapper .colleft{ order: 1; } .product-card-preview{ position: relative; } .product-like-mobile{ display: block; position: absolute; top: 5px; right: 5px; font-size: 40px; z-index: 200; } .product-like-desk{ display: none; } } .blog_slider_more{ margin: 30px 0; text-align: right; } .blog_slider_more a{ padding: 10px 25px; border: 1px solid var(--gray-5); transition: 0.3s; width: auto; margin: 5px; } .blog_slider_more a:hover{ color: var(--primary-hover); border-color: var(--primary-hover); } .detail-shops-props iframe{ margin-top: 15px; } /* End */ /* Start:/bitrix/components/h2o/favorites.add/templates/.default/style.css?15323411742374*/ #favorites_popup_wrap{ /*width: 600px!important;*/ min-height: 100%; padding: 0px; position: relative; display: inline-block; color: #4d4c4c; } #favorites_popup_wrap .modal-header { min-height: 16.42857143px; padding: 0px 0px; border: none; font-size: 30px; } #favorites_popup_wrap .modal-body{ position: relative; padding: 30px; font-size: 18px; } #favorites_popup_wrap .modal-body p{ } #favorites_popup_wrap .form-row{ max-width: 960px; margin-left: auto; margin-right: auto; margin: 10px 0; } #favorites_popup_wrap .form-row:after { content: ""; display: table; clear: both; } #favorites_popup_wrap .form-row:first-child { margin-top: 0; } #favorites_popup_wrap .form-cell-3 { float: left; display: block; margin-right: 2%; width: 30%; } #favorites_popup_wrap .form-cell-3:last-child { margin-right: 0; } #favorites_popup_wrap .form-cell-9 { float: left; display: block; margin-right: 2%; width: 68%; } #favorites_popup_wrap .form-cell-9:last-child { margin-right: 0; } #favorites_popup_wrap label{ font-weight: normal; font-size: 18px; } #favorites_popup_wrap input[type=text]{ height: 32px; } #favorites_popup_wrap input[type=text].error{ box-shadow: 0 0 0 1px red; } #favorites_popup_wrap textarea{ height: 112px; } #favorites_popup_wrap input[type=text], #favorites_popup_wrap textarea{ width: 100%; border: 1px #b7b7b7 solid; padding: 0px 5px; transition: all .25s; -webkit-transition: all .25s; -o-transition: all .25s; } #favorites_popup_wrap .button_wrap{ text-align: right; } #favorites_popup_wrap button{ font-size: 18px; border: none; background-color: rgb(221, 221, 221); transition: all .25s; -webkit-transition: all .25s; -o-transition: all .25s; } #favorites_popup_wrap button:hover { box-shadow: 0 0 0 3px rgba(204,204,204,1); } #favorites_popup_wrap small.error{ color: red; } @media screen and (min-width: 600px){ #favorites_popup_wrap{ width: 600px; } } @media screen and (max-width: 600px){ #favorites_popup_wrap .form-cell-3{ float: none; } #favorites_popup_wrap .form-cell-9{ float: none; width: 100%; } #favorites_popup_wrap .modal-header{ font-size: 25px; } } /* End */ /* Start:/local/templates/rozbl22/components/bitrix/catalog.section.list/flowers/style.css?1738649415617*/ .flowers__block { display: flex; flex-wrap: wrap; gap: 9px; } .flower_section-relink { padding: 6px 14px; min-width: auto; /* margin: 0 0 0 auto; */ border: 2px solid #9f62ba; border-radius: 4px; transition: all ease 0.2s; } .flower_section-relink a { display: block; transition: color .2s ease; color: #000; font-weight: 600; font-size: 16px; /*text-transform: lowercase;*/ } .flower_section-relink:hover { color: var(--color-hover); background: #f5eff8; border-color: #7f4f95; } .flower_section-relink a:hover { color: #7f4f95; } /* End */ /* Start:/bitrix/components/custom/sms.auth/templates/.default/style.css?166325063696*/ .modal__form.j_form{ display: none; } .modal__form.j_form.active{ display: block; } /* End */ /* Start:/local/templates/rozbl22/components/bitrix/main.userconsent.request/in_form/user_consent.css?17528354474324*/ .main-user-consent-request a { cursor: pointer; } .main-user-consent-request-popup { position: fixed; top: 0; left: 0; bottom: 0; right: 0; background-color: rgba(0,0,0,0.5); overflow: hidden; z-index: 150000; } .main-user-consent-request-popup-cont { min-height: 290px; position: absolute; top: 50%; left: 50%; margin: 0 auto; padding: 20px; min-width: 320px; width: 100%; max-width: 600px; background: #fff; text-align: center; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); -webkit-border-radius: 5px; border-radius: 5px; -webkit-box-sizing: border-box; box-sizing: border-box; overflow-y: auto; } .main-user-consent-request-popup-header { margin: 0 0 10px 0; font: normal 18px "Helvetica Neue", Arial, Helvetica, sans-serif; color: #000; text-align: left; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; max-width: 260px; } .main-user-consent-request-popup-textarea-block { margin: 0 0 20px 0; } .main-user-consent-request-popup-buttons { display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -ms-flex-align: center; align-items: center; } .main-user-consent-request-popup-button { display: inline-block; height: 39px; margin: 0 10px 5px 0; padding: 0 18px; border: none; border-radius: 2px; font: normal 12px/39px "Helvetica Neue", Helvetica, Arial, sans-serif; color: #535c69; outline: none; vertical-align: middle; text-decoration: none; text-transform: uppercase; text-shadow: none; white-space: nowrap; -webkit-font-smoothing: antialiased; -webkit-transition: background-color 0.2s linear, color 0.2s linear; transition: background-color 0.2s linear, color 0.2s linear; cursor: pointer; } .main-user-consent-request-popup-button-acc { background: #bbed21; } .main-user-consent-request-popup-button-acc:hover { background: #d2f95f; } .main-user-consent-request-popup-button-rej { -webkit-box-shadow: inset 0 0 0 1px #a1a6ac; box-shadow: inset 0 0 0 1px #a1a6ac; background: none; } .main-user-consent-request-popup-button-rej:hover { background: #cfd4d8; } .main-user-consent-request-popup-text { border: 1px solid #999; overflow: auto; padding: 8px; text-align: left; color: rgb(84, 84, 84); } .main-user-consent-request-popup-link { height: 130px; display: flex; justify-content: center; align-items: center; flex-direction: column; } .main-user-consent-request-popup-link a { display: block; margin: 20px 0 0 0; text-overflow: ellipsis; overflow: hidden; max-width: 260px; } /** LOADER **/ .main-user-consent-request-loader { position: relative; height: 100px; width: 100px; margin: 0 auto; -webkit-transform: translate(0, 50%); transform: translate(0, 50%); } .main-user-consent-request-path { stroke: #80868e; stroke-dasharray: 100, 200; } .main-user-consent-request-loader:before { content: ''; display: block; padding-top: 100%; } .main-user-consent-request-circular { position: absolute; top: 0; bottom: 0; left: 0; right: 0; margin: auto; height: inherit; width: inherit; -webkit-animation: rotate 1s linear infinite; animation: rotate 1s linear infinite; -webkit-transform-origin: center center; transform-origin: center center; } .main-user-consent-request-path { stroke: #ccc; stroke-dasharray: 60, 200; stroke-dashoffset: 0; -webkit-animation: dash 1.5s ease-in-out infinite; animation: dash 1.5s ease-in-out infinite; stroke-linecap: round; } .main-user-consent-request-announce{ color: #333; font-size:13px; line-height: 15px; } .main-user-consent-request-announce-link{ cursor: pointer; } @keyframes rotate { 100% { transform: rotate(360deg); } } @-webkit-keyframes rotate { 100% { -webkit-transform: rotate(360deg); } } @media (min-width: 1000px) { .main-user-consent-request-popup-cont { min-height: 400px; min-width: 640px; } .main-user-consent-request-popup-header { max-width: 590px; } .main-user-consent-request-popup-text, .main-user-consent-request-popup-link { height: 240px; } .main-user-consent-request-popup-link a { max-width: 200px; } } @media (max-width: 768px) { .main-user-consent-request-popup-cont { height: 100%; } } /* End */ /* Start:/local/templates/rozbl22/template_styles.css?175308514327801*/ .container.container-text-page { font-size: 1rem; line-height: 1.5; } .container.container-text-page p:not(:last-child) { margin-bottom: 1.5rem; } .container.container-text-page .news-detail p:not(:last-child) { margin-bottom: 0px; } .alert.hidden { display: none; } .hidden { display: none; } .help-block { color: red; } .form-group .help-block { position: absolute; bottom: -150%; color: red; left: 0; z-index: 999999; } .input-wrapper.form-group .help-block { bottom: -50%; } .products-section-filtered { display: none; } .products-section-filtered.filtered { display: block; } .other-product-slide .product { height: 100% !important; } .slam-easyform .hidden { display: none !important; visibility: hidden !important; } .counter__value { max-width: 30px; } .favor .text_in_active { display: none; } .favor .text_none_active { display: block; } .favor.active .text_in_active { display: block; } .favor.active .text_none_active { display: none; } #bx-soa-region, #bx-soa-delivery, #bx-soa-total-mobile { display: none !important; } .main-user-consent-request.сheckbox { display: flex; margin-top: 16px; } .alert.alert-danger { margin-bottom: 10px; padding: 10px; color: red; } .delivery_date { margin-bottom: 10px; font-weight: bold; display: flex; justify-content: flex-start; align-items: center; } .store { line-height: 1.3571; position: relative; padding: 17px 0 1px; } .store-col { width: 420px; } .container.container-text-page .store p { margin-bottom: 15px; } .store a { text-decoration: none; border-bottom: 1px dotted #ab73c4; } a { color: #aa71c3; } .store-col-wrapper { display: flex; gap: 200px; } #YMapsID { height: 800px; } @media only screen and (min-width: 1000px) { body .header__link_mobile { display: none; } } @media only screen and (max-width: 1000px) { .store-col { width: 100%; } .store-col-wrapper { flex-direction: column; gap: unset; } .lk-profile.custom_lk { flex-direction: column; } .disc_block_custom { width: 100%; margin-top: 24px; } #YMapsID { height: 300px; } } .product__hint+.product__hint { top: 45px; } .product__hint+.product__hint+.product__hint { top: 74px; } /*18.10.22*/ .contentright { margin-bottom: 144px; } #bx_incl_area_15_1_1 .blog-item:last-child { margin-bottom: 144px; } .contentright .search-page { display: none; } .colleft .calendar { display: none; } .blog-nav { margin-bottom: 40px; } .blog-nav dl, .blog-nav dd { display: flex; flex-wrap: wrap; } .blog-nav dd span { display: none; } .blog-nav dt { width: 100%; margin: 5px; font-size: 18px; font-weight: 600; } .blog-nav dd a { padding: 5px; border: 1px solid var(--gray-5); transition: 0.3s; width: auto; margin: 5px; } .blog-nav dd a:hover { color: var(--primary-hover); border-color: var(--primary-hover); } .blog-nav li:not(:last-child) { margin-bottom: 24px; } .blog-item { padding: 48px 24px; background-color: var(--white); box-shadow: 0 0 32px rgb(0 0 0 / 8%); border-radius: 8px; } .blog-item:not(:last-child) { margin-bottom: 36px; } .blog-item-title { font-size: 36px; line-height: 42px; margin-top: 0; margin-bottom: 12px; } .blog-item-date { font-size: 20px; line-height: 28px; color: var(--gray-3); font-weight: 500; margin-bottom: 24px; } .blog-item-image { position: relative; border-radius: 8px; } .blog-item-image:before { display: block; width: 100%; padding-bottom: 75%; content: ""; } .blog-item-image img { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border-radius: inherit; -o-object-fit: cover; object-fit: cover; } .blog-item-anons { font-size: 18px; line-height: 28px; color: var(--gray-1); } .blog-item-wrap { display: flex; } .blog-item-left { width: 100%; max-width: 430px; margin-right: 30px; } .blog-item-right { width: 100%; } .blog-item-right .content { min-height: auto; height: auto; margin-bottom: 24px; } .blog-item-right .content a { display: inline-block; width: max-content; margin-top: 5px; } .blog-item-tags { margin-bottom: 20px; } .blog-item-tags li { display: flex; flex-direction: column; flex-wrap: wrap; } .blog-item-tags li:not(:last-child) { margin-bottom: 16px; } .blog-item-tags li a { padding: 5px; border: 1px solid var(--gray-5); transition: 0.3s; width: max-content; margin: 5px; } .blog-item-tags li span { display: block; margin-bottom: 5px; } .blog-item-tags li a:hover { color: var(--primary-hover); border-color: var(--primary-hover); } /* .blog-item-tags li .block-span a { margin: 0; } */ .blog-item-tags li .block-span { display: flex; flex-wrap: wrap; margin: -5px; } .blog-item-tags li span+a { margin-top: 0; margin-left: 0; } .blog-item-tag { display: flex; flex-wrap: wrap; margin: -5px; } .search-tags-cloud { display: none; } div.search-tags-chain a { font-size: 20px; line-height: 28px; } .search-tags-chain { color: var(--gray-3); transition: 0.3s; } div.search-tags-chain a.search-tags-link { transition: 0.3s; font-size: 20px; color: var(--gray-3); } div.search-tags-chain a.search-tags-link:hover { color: var(--primary-hover); } .search-tags-cloud a { font-size: 20px !important; line-height: 28px !important; } .contentright .news-detail { font-size: 18px; line-height: 28px; } .contentright .news-detail h2, .contentright .news-detail h3 { margin: 0px; } .contentright p a { font-size: 20px; line-height: 28px; } .contentright #bx_incl_area_15_1_3>br { display: none; } .contentright .reviews { padding: 0; max-width: 900px; } .contentright .reviews .reviews-row { display: flex; flex-direction: column; } .contentright .reviews .reviews-col textarea { resize: none; height: 230px; } .contentright .reviews .reviews-capcha { margin-top: 20px; } .contentright .news-detail .blog-item-image { margin-bottom: 40px; } .contentright .news-detail .blog-item-image a { display: block; position: relative; border-radius: 8px; max-width: 900px; /* margin: 0 auto; */ } .contentright .news-detail .blog-item-image a::before { display: block; width: 100%; padding-bottom: 75%; content: ""; } .contentright .news-detail .blog-item-image::before { content: none; } @media (max-width: 1200px) { .blog-item { padding: 30px 20px; } .blog-item-left { margin-left: 15px; } .blog-item-title { font-size: 30px; line-height: 36px; margin-bottom: 10px; } .blog-item-date { font-size: 18px; line-height: 28px; margin-bottom: 20px; } .blog-item-anons { font-size: 16px; line-height: 24px; } .blog-item-right .content { margin-bottom: 20px; } .blog-item:not(:last-child) { margin-bottom: 30px; } .contentright { margin-bottom: 80px; } #bx_incl_area_15_1_1 .blog-item:last-child { margin-bottom: 80px; } } @media (max-width: 900px) { .blog-item { padding: 20px; } .blog-item-left { margin-left: 0; margin-bottom: 20px; max-width: 100%; } .blog-item-wrap { flex-direction: column; } .blog-item-title { font-size: 24px; line-height: 32px; margin-bottom: 8px; } .blog-item-date { font-size: 16px; line-height: 24px; margin-bottom: 16px; } .blog-item-anons { font-size: 14px; line-height: 20px; } .blog-item-right .content { margin-bottom: 16px; } .blog-item:not(:last-child) { margin-bottom: 24px; } .contentright { margin-bottom: 40px; } #bx_incl_area_15_1_1 .blog-item:last-child { margin-bottom: 40px; } } @media (max-width: 600px) { .contentright .reviews .reviews-row:last-child .reviews-col { display: flex; margin: -5px; margin-top: 10px; } .contentright .reviews .reviews-row:last-child .reviews-col .button { width: calc(100% / 2 - 10px); } } .is-disabled { opacity: 0.4; } #bx-soa-properties .input { max-height: 50px; } .order-block__wrap.j_map_container .dropdown-content-scroller .radio { border-bottom: 1px solid #d9e9ee; padding: 5px; } .order-block__wrap.j_map_container .dropdown-content-scroller { border: 1px solid #b29595; display: flex; flex-direction: column; } body .order-block__wrap.j_map_container .dropdown-content-scroller.container_input_value { border: unset; } body .order-block__wrap.j_map_container .dropdown-content-scroller.container_input_value .radio { border: unset; } .dropdown__item.hidden { display: none !important; } .str_err_msg_interval { padding: 10px; color: red; } .desc-section-c { margin-top: 40px; } /* выподашка мобилки каталога*/ .mobile-popup, .mobile-popup-gift, .mobile-popup-about { display: none; } .newAccordion, .newAccordionGift, .newAccordionAbout { display: none; } .newAccordionOld, .newAccordionOldGift, .newAccordionOldAbout { display: none; } @media(max-width: 1100px) { .mobile-popup, .mobile-popup-gift, .mobile-popup-about { width: 100%; } .mobile-popup .catalog-popup__text, .mobile-popup-gift .catalog-popup__text, .mobile-popup-about .catalog-popup__text{ padding: 5px; } .newAccordion, .newAccordionGift, .newAccordionAbout { display: block; margin-left: 15px; } .newAccordionOld, .newAccordionOldGift, .newAccordionOldAbout { display: none; transform: rotateX(-180deg); margin-left: 15px; } .newCatalog-accordion, .newCatalog-accordion-gift, .newCatalog-accordion-about { display: flex; } .header__link.header__link--catalog { display: flex; flex-direction: column; align-items: flex-start; } .mobile-popup .catalog-popup__wrap, .mobile-popup-gift .catalog-popup__wrap, .mobile-popup-about .catalog-popup__wrap{ padding: 0; flex-wrap: unset; flex-direction: column; overflow-x: unset; overflow-y: unset; text-align: initial; height: auto; padding: 10px; background: #f1e9e959; border-radius: 5px; } .mobile-popup-gift .catalog-popup__wrap, .mobile-popup-about .catalog-popup__wrap{ z-index: 120 !important; padding: 15px 10px !important; } .mobile-popup .catalog-popup__item, .mobile-popup-gift .catalog-popup__item, .mobile-popup-about .catalog-popup__item { padding: 0; width: 100%; } } @media(max-width: 800px) { .mobile-popup, .mobile-popup-gift, .mobile-popup-about { width: 100%; } .mobile-popup .catalog-popup__text, .mobile-popup-gift .catalog-popup__text, .mobile-popup-about .catalog-popup__text { padding: 5px; } .newAccordion, .newAccordionGift, .newAccordionAbout { display: block; margin-left: 15px; } .newAccordionOld, .newAccordionOldGift, .newAccordionOldAbout { display: none; transform: rotateX(-180deg); margin-left: 15px; } .newCatalog-accordion, .newCatalog-accordion-gift, .newCatalog-accordion-about { display: flex; } .header__link.header__link--catalog { display: flex; flex-direction: column; align-items: flex-start; } .mobile-popup .catalog-popup__wrap, .mobile-popup-gift .catalog-popup__wrap, .mobile-popup-about .catalog-popup__wrap { padding: 0; flex-wrap: unset; flex-direction: column; overflow-x: unset; overflow-y: unset; text-align: initial; height: auto; padding: 10px; background: #f1e9e959; border-radius: 5px; } .mobile-popup .catalog-popup__item, .mobile-popup-gift .catalog-popup__item, .mobile-popup-about .catalog-popup__item { padding: 0; width: 100%; } } @media(max-width: 500px) { .mobile-popup, .mobile-popup-gift, .mobile-popup-about { width: 100%; } .mobile-popup .catalog-popup__text, .mobile-popup-gift .catalog-popup__text, .mobile-popup-about .catalog-popup__text { padding: 5px; } .newAccordion, .newAccordionGift, .newAccordionAbout { display: block; margin-left: 5px; } .newAccordionOld, .newAccordionOldGift, .newAccordionOldAbout { display: none; transform: rotateX(-180deg); margin-left: 5px; } .newCatalog-accordion, .newCatalog-accordion-gift, .newCatalog-accordion-about { display: flex; } .header__link.header__link--catalog { display: flex; flex-direction: column; align-items: flex-start; } .mobile-popup .catalog-popup__wrap, .mobile-popup-gift .catalog-popup__wrap, .mobile-popup-about .catalog-popup__wrap { padding: 0; flex-wrap: unset; flex-direction: column; overflow-x: unset; overflow-y: unset; text-align: initial; height: auto; padding: 10px; background: #f1e9e959; border-radius: 5px; } .mobile-popup .catalog-popup__item, .mobile-popup-gift .catalog-popup__item, .mobile-popup-about .catalog-popup__item { padding: 0; width: 100%; } } /* выпадашка мобилки каталога*/ .flex-for-menu { display: flex; } h1.mp-h1-block { text-align: left; margin-top: 15px; margin-bottom: 0px; font-size: 24px; font-weight: 100; margin-left: 140px; } @media (max-width: 1350px) { h1.mp-h1-block { margin-left: 30px; } } @media (max-width: 1100px) { .flex-for-menu { flex-direction: column; } } @media (max-width: 768px) { h1.mp-h1-block { text-align: center; margin-top: 15px; margin-bottom: 0px; font-size: 16px; font-weight: 100; } } .social { margin: 15px 0; } .do-install { font-weight: bold; } .footer__app { display: flex; flex-wrap: wrap; justify-content: left; align-items: center; margin-top: 10px; } .footer__app img { margin-right: 5px; height: 40px; margin-bottom: 10px; } .footer__app img:hover { opacity: .85; } @media (max-width: 480px) { .footer__app { margin-bottom: 10px; } } body .filter-item.data_test_4 { order: 0; } body .filter-item { order: 1; } body .filter-item.data_test_4:after { position: absolute; top: 50%; right: -1px; z-index: 2; display: block; width: 1px; height: 68.75%; content: ""; background-color: var(--gray-5); -webkit-transform: translateY(-50%); transform: translateY(-50%); display: none; } body .filter-item:nth-child(4):after { opacity: 0; } body .filter-item:first-child .dropdown__button { border-radius: 0px; } body .filter-item:last-child .dropdown__button { border-radius: 8px 0px 0px 8px; background: #fff; color: #9f62ba; } body .filter-item:nth-child(4) .dropdown__button { border-radius: 0px 8px 8px 0px !important; } @media (max-width: 992px) { body form.filter__form { display: flex; flex-wrap: wrap; } body .filter-item { min-width: 50%; } body .filter-item:last-child .dropdown__button { border-radius: 0px; } body .filter-item:nth-child(4) .dropdown__button { border-radius: 0px !important; } body .filter-item:not(:last-child):after { opacity: 0 !important; } body .filter-item .dropdown__button { border-bottom: 1px solid rgba(0, 0, 0, 0.05); border-left: 1px solid rgba(0, 0, 0, 0.05) !important; } body .dropdown.active .dropdown__button { border-color: var(--primary-hover) !important; border: 0px !important; } body .filter-item .dropdown__button { border: none !important; } } @media (min-width: 992px) { body .filter-item:last-child .dropdown__button:after { position: absolute; top: 50%; right: 1px; z-index: 2; display: block; width: 1px; height: 68.75%; content: ""; background-color: var(--gray-5); -webkit-transform: translateY(-50%); transform: translateY(-50%); } } /* body .filter-item:last-child .dropdown__button { background: #9f62ba !important; color: #fff !important; } */ @media (max-width: 992px) { body .filter-item { min-width: fit-content; } .dropdown__button { font-size: 14px !important; } body .filter-item .dropdown__button { padding: 10px 5px !important; } body form.filter__form { flex-wrap: nowrap !important; } } @media (max-width: 768px) { body .filter-item { min-width: fit-content; } .dropdown__button { font-size: 12px !important; } body .filter-item .dropdown__button { padding: 5px !important; } body .filter-item { width: fit-content; } .dropdown__button { font-size: 14px !important; } } @media (max-width: 550px) { body .filter-item { min-width: fit-content; } body .filter-item { width: fit-content; } .dropdown__button { font-size: 12px !important; } .dropdown__arrow-wrapper { margin-left: 3px !important; } body .filter-item .dropdown__button { padding: 3px !important; } } @media (max-width: 450px) { body .filter-item { min-width: fit-content; } body .filter-item { width: fit-content; } .dropdown__button { font-size: 10px !important; } .dropdown__arrow-wrapper { margin-left: 3px; } } .menu-section .catalog-popup__wrap { max-height:unset; } .container.container-text-page h1{ /*color:white;*/ } form#footer__form { /* display: flex; */ /* flex-wrap: wrap; */ } .left__form { width: 370px; display: inline-block; vertical-align: top; } .right__form { width: 350px; display: inline-block; } .agree__block { display: block; text-align: center; max-width: 740px; margin: 0 auto; } .formgroup label { display: block; text-align: left; } form#footer__form { text-align: center; max-width: 820px; margin: 0 auto; border: 2px solid #9f62ba; padding: 30px; border-radius: 15px; } form#footer__form input { width: 350px; height: 40px; border: 1px solid #e0e0e0; } form#footer__form input:hover, form#footer__form input:focus { border-color: #9f62ba !important; } form#footer__form input:focus { outline: none; } .footer__form-lozung{ font-weight: bold; margin-bottom: 20px; } .formgroup + .formgroup { margin-top: 30px; } .form-sup-footer h2 { text-align: center; } .left__form textarea { width: 320px; height: 130px; margin-top: 12px; resize: none; } button.send { margin-top: 30px; border: 0; background: 0; padding: 6px 14px; min-width: auto; /* margin: 0 0 0 auto; */ border: 2px solid #9f62ba; border-radius: 4px; transition: all ease 0.2s; display: block; margin: 0 auto; margin-top: 30px; } form#footer__form input#agree_check { width: 15px; height: 14px; background: #9f62ba; } .form-thanks { padding: 50px; text-align: center; font-size: 18px; border: 2px solid #9f62ba; width: 500px; border-radius: 4px; margin: 0 auto; margin-bottom: 50px; } p.big_thanks { font-size: 26px; } .formgroup label span { color: #ff0000; } @media (max-width:480px) { .left__form textarea { width: 100%; margin-top: unset; } .left__form { width: 100%; display: block; } .right__form { width: 100%; display: block; margin-top: 20px; } form#footer__form input { width: 100%; } .agree__block { margin-top: 30px; } } .v_grid-flex { display:grid; } @media (max-width:767px){ .v_grid-flex { display:flex!important; gap: 10px!important; } .button.button--big { min-width: 100px!important; padding: 5px!important; } div[data-entity="buttons-block"] { width: 100%; min-width: 100px!important; padding: 5px!important; } div[data-entity="buttons-block"] button { width: 100%!important; } } .percent_discount { position: absolute; top: 50px; left: 0; z-index: 1000; color: #fff; background: red; padding: 5px; font-weight: bold; } .ajax-search-link img { flex: none; width: 50px; } a.ajax-search-link { display: flex; align-items: center; gap: 10px; } ul.markered { list-style: disc; margin-left: 20px; } ol.markered { list-style: dec; margin: 10px 0 10px 20px; } ol.markered li{ margin-bottom: 5px; } .head_flex_row { display: flex; justify-content: space-between; align-items: center; } .head_phones_wrapper { display: flex; flex-wrap: nowrap; } .topest_menu { display: flex; gap: 11px; align-items: flex-start; justify-content: flex-start; } .topest_menu a { color: rgb(51, 51, 51); font-size: 16px; font-weight: 400; } .right_header_blocks { display: flex; flex-wrap: nowrap; justify-content: flex-end; margin-top: 10px; margin-bottom: 10px; } .right_header_blocks>div { border-left: 1px solid #eee; border-right: 1px solid #eee; border-collapse:collapse; margin-left:-1px; } div.news-list { word-wrap: break-word; } div.news-list img.preview_picture { float:left; margin:0 4px 6px 0; } .news-date-time { color:#486DAA; } .review_item { border: 1px solid rgb(159 98 186 / 29%); padding: 20px; margin-bottom: 20px; } .review_item_name { color: rgb(159, 98, 186); font-weight: bold; font-size: 18px; } .review_item date { color: #999; font-style: italic; } .reviews_top { display: flex; flex-wrap: wrap; justify-content: space-between; } .owl-nav { height: 40px; position: absolute; top: 50%; transform: translateY(-50%); width: 100%; } .reviews_slider_wrapper button.owl-prev { left: 0; position: absolute; font-size: 0!important; line-height: 0!important; } .reviews_slider_wrapper button.owl-next { right: 0; font-size: 0!important; line-height: 0!important; position: absolute; } button.owl-prev { background-image: url(/local/templates/rozbl22/assets/images/left.svg)!important; background-repeat: no-repeat!important; background-position: center center!important; width: 40px; height: 40px; border: 2px solid rgb(255, 255, 255)!important; border-radius: 85px; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15); background-color:#fff!important; } button.owl-next { background-image: url(/local/templates/rozbl22/assets/images/right.svg)!important; background-repeat: no-repeat!important; background-position: center center!important; width: 40px; height: 40px; border: 2px solid rgb(255, 255, 255)!important; border-radius: 85px; box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.15); background-color:#fff!important; } .blog_slider_wrapper button.owl-prev { left: 0; position: absolute; } .blog_slider_wrapper button.owl-next { right: 0; position: absolute; } .review_item_text { min-height: 130px; } .reviews_slider_on_main .review_item { padding-left: 50px; padding-right: 50px; } .blog_item_slide_image { padding-bottom: 26px; } .blog_item_slide_name { font-size: 18px; font-weight: bold; line-height: 27px; margin-bottom: 10px; padding-left: 10px; padding-right: 10px; min-height: 60px; } .blog_item_slide_date { color: rgb(153, 153, 153); font-size: 14px; padding-left: 10px; padding-right: 10px; } .blog_item_slide_anounce { font-size: 16px; line-height: 22px; padding-left: 10px; padding-right: 10px; min-height: 150px; } .blog_item_slide { border: 1px solid rgb(241, 232, 245); padding: 5px; margin-bottom: 5px; } .blog_item_slide_anounce svg { display: inline-block; vertical-align: middle; margin-left: 3px; margin-top: -3px; } .on_main_products_title.flex_title { display: flex; gap: 40px; align-items: center; } .on_main_products_title.flex_title h2 { flex: none; } .in_title_links { display: flex; flex-wrap: nowrap; gap: 0 20px; overflow-x: auto; scrollbar-width: thin; scrollbar-color: var(--primary-default) #eee; align-items: center; padding-bottom: 7px; max-width: 100%; } .in_title_links a { white-space: nowrap; display: inline!important; } @media screen and (max-width:1199px) { .on_main_products_title.flex_title { flex-direction: column; } } /*.news-detail ul li, .news-detail ol li { margin-bottom: -15px; margin-top: -15px; } .news-detail ul, .news-detail ol { margin-bottom: -25px; margin-top: -25px; }*/ .item-reviews-section{ padding-top: 10px; } .item-reviews-section .reviews_top{ margin-bottom: 15px; } .item-reviews-section .review_item_text{ min-height: 80px; } .item-reviews-section .review_item_text{ line-height: 20px; } .item-reviews-section .swiper-pagination-bullet-active{ background: #7f4f95; } .product-card__list-wrapper ul { list-style: disc; margin-left: 40px; margin-top: 10px; margin-bottom: 10px; } .product-card__list-wrapper p { margin-bottom: 15px; } .news-detail .blog-item-image img{ position: relative; width: auto; height: auto; max-width: 100%; object-fit: none; } .contentright .news-detail .blog-item-image a::before{ display: none; } .my-datepicker.hidden { display: inline-flex !important; } .form_response { text-align: center; font-weight: bold; font-size: 20px; } .form_response { text-align: center; font-weight: bold; font-size: 20px; } .footer_form_callback input[type="text"] { font-family: NunitoSans, Arial; width: 100%; border: 0px; border-radius: 2px; padding: 10px; border: 1px solid #ddd; outline: none!important; background: #fff!important; } .form-group { padding: 10px 0; } .footer_form_callback { max-width: 100%; width: 360px; } .head_feedback_link { margin-bottom: 10px; font-weight: bold; color: #7f4f95; cursor: pointer; } .head_feedback_link:hover { text-decoration: underline; } .footer_form_callback input[type="text"]:focus { border: 1px solid #7f4f95!important; } .footer_form_callback .h2 { margin-bottom: 0!important; } .footer_form_callback .form_subtitle { margin-bottom:20px; } /* End */ /* /local/templates/rozbl22/assets/css/bundle.css?1751622479296580 */ /* /bitrix/components/h2o/favorites.add/templates/.default/style.css?15323411742374 */ /* /local/templates/rozbl22/components/bitrix/catalog.section.list/flowers/style.css?1738649415617 */ /* /bitrix/components/custom/sms.auth/templates/.default/style.css?166325063696 */ /* /local/templates/rozbl22/components/bitrix/main.userconsent.request/in_form/user_consent.css?17528354474324 */ /* /local/templates/rozbl22/template_styles.css?175308514327801 */