@charset "UTF-8";

:root {
--font-family: "Onest", sans-serif;
--second-family: "Dela Gothic One", sans-serif;
--third-family: "Geologica", sans-serif;
--content-width: 180rem;
--container-offset: 6rem;
--container-width: calc(var(--content-width) + (var(--container-offset) * 2));
--pink: #e91783;
--pink-hover: #f05ca8;
--black: #000;
--white: #fff;
--grey1: #ededed;
--grey2: #d9d9d9;
--grey3: #b3b3b3;
--grey4: #8c8c8c;
--red-alarm: #f00;
--green: #42b388;
--blue: #2778ce;
}
@media screen and (width <= 576px) {
:root {
--container-offset: 3rem;
}
}   .custom-checkbox__field:checked + .custom-checkbox__content::after {
opacity: 1;
}
.custom-checkbox__field:focus + .custom-checkbox__content::before {
outline: 2px solid #f00;
outline-offset: 2px;
}
.custom-checkbox__field:disabled + .custom-checkbox__content {
opacity: 0.4;
pointer-events: none;
}   @font-face {
font-family: "Dela Gothic One";
src: url(//sexyfonlove.ru/wp-content/themes/sexyphone/assets/fonts/DelaGothicOne-Regular.woff2) format("woff2");
font-weight: 400;
font-display: swap;
font-style: normal;
}
@font-face {
font-family: "Geologica";
src: url(//sexyfonlove.ru/wp-content/themes/sexyphone/assets/fonts/Geologica-Regular.woff2) format("woff2");
font-weight: 400;
font-display: swap;
font-style: normal;
}
@font-face {
font-family: "Onest";
src: url(//sexyfonlove.ru/wp-content/themes/sexyphone/assets/fonts/Onest-Light.woff2) format("woff2");
font-weight: 300;
font-display: swap;
font-style: normal;
}
@font-face {
font-family: "Onest";
src: url(//sexyfonlove.ru/wp-content/themes/sexyphone/assets/fonts/Onest-Regular.woff2) format("woff2");
font-weight: 400;
font-display: swap;
font-style: normal;
}
@font-face {
font-family: "Onest";
src: url(//sexyfonlove.ru/wp-content/themes/sexyphone/assets/fonts/Onest-Medium.woff2) format("woff2");
font-weight: 500;
font-display: swap;
font-style: normal;
}
@font-face {
font-family: "Onest";
src: url(//sexyfonlove.ru/wp-content/themes/sexyphone/assets/fonts/Onest-SemiBold.woff2) format("woff2");
font-weight: 600;
font-display: swap;
font-style: normal;
}
*,
*::before,
*::after {
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.page {
height: 100%;
font-family: var(--font-family, sans-serif);
font-size: 0.5208333333vw;
-webkit-text-size-adjust: 100%;
background-color: #f5f5f5;
scroll-behavior: smooth;
}
@media (width >= 1920px) {
.page {
font-size: 10px;
}
}
@media (max-width: 576px) {
.page {
font-size: 1.7361111111vw;
}
}
.page__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin: 0;
min-width: 360px;
min-height: 100%;
font-size: 16px;
}
img {
height: auto;
max-width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
a {
text-decoration: none;
}
.site-container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding-top: var(--header-height, 0);
}
.main {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.is-hidden {
display: none !important; }
.btn-reset {
border: none;
padding: 0;
background-color: transparent;
cursor: pointer;
}
.list-reset {
list-style: none;
margin: 0;
padding: 0;
}
.input-reset {
-webkit-appearance: none;
-moz-appearance: none;
appearance: none;
border: none;
border-radius: 0;
background-color: #fff;
}
.input-reset::-webkit-search-decoration, .input-reset::-webkit-search-cancel-button, .input-reset::-webkit-search-results-button, .input-reset::-webkit-search-results-decoration {
display: none;
}
.visually-hidden {
position: absolute;
overflow: hidden;
margin: -1px;
border: 0;
padding: 0;
width: 1px;
height: 1px;
clip: rect(0 0 0 0);
}
.container {
margin: 0 auto;
padding: 0 var(--container-offset);
max-width: var(--container-width);
}
.centered {
text-align: center;
}
.dis-scroll {
position: fixed;
left: 0;
top: 0;
overflow: hidden;
width: 100%;
height: 100vh;
-ms-scroll-chaining: none;
overscroll-behavior: none;
}
.page--ios .dis-scroll {
position: relative;
}
.accent-bg {
border-radius: 5rem;
background-color: var(--pink);
}
@media (max-width: 576px) {
.accent-bg {
border-radius: 3rem;
}
}
.mt:not(:first-child) {
margin-top: 7.5rem;
}
@media (max-width: 576px) {
.mt:not(:first-child) {
margin-top: 5rem;
}
}
.mb:not(:last-child) {
margin-bottom: 7.5rem;
}
@media (max-width: 576px) {
.mb:not(:last-child) {
margin-bottom: 5rem;
}
}
.mt-lg:not(:first-child) {
margin-top: 15rem;
}
@media (max-width: 576px) {
.mt-lg:not(:first-child) {
margin-top: 10rem;
}
}
.mb-lg:not(:last-child) {
margin-bottom: 15rem;
}
@media (max-width: 576px) {
.mb-lg:not(:last-child) {
margin-bottom: 10rem;
}
}
.pb {
padding-bottom: 7.5rem;
}
@media (max-width: 576px) {
.pb {
padding-bottom: 5rem;
}
}
.pt {
padding-top: 7.5rem;
}
@media (max-width: 576px) {
.pt {
padding-top: 5rem;
}
}
.pb.mb:not(:last-child) {
margin-bottom: 0;
}
@media (max-width: 576px) {
.pb.mb:not(:last-child) {
margin-bottom: 0;
}
}
.pt.mt:not(:first-child) {
margin-top: 0;
}
@media (max-width: 576px) {
.pt.mt:not(:first-child) {
margin-top: 0;
}
}
.pt.mt-lg:not(:first-child) {
margin-top: 7.5rem;
}
@media (max-width: 576px) {
.pt.mt-lg:not(:first-child) {
margin-top: 5rem;
}
}
.pb.mb-lg:not(:last-child) {
margin-bottom: 7.5rem;
}
@media (max-width: 576px) {
.pb.mb-lg:not(:last-child) {
margin-bottom: 5rem;
}
}
.slider .swiper-slide {
width: auto;
height: auto;
}
.slider .swiper-slide > * {
height: 100%;
}
*::-moz-selection {
color: var(--white);
background-color: var(--pink);
}
*::selection {
color: var(--white);
background-color: var(--pink);
}
h1,
h1 {
display: block;
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 7rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
h1,
h1 {
font-size: 3.6rem;
}
}
h2,
.h2 {
display: block;
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 5rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
h2,
.h2 {
font-size: 3rem;
}
}
h3,
.h3 {
display: block;
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.2rem;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
h3,
.h3 {
font-size: 2rem;
}
}
h4,
.h4 {
display: block;
margin: 0;
font-family: var(--font-family);
font-weight: 300;
font-size: 3rem;
line-height: 120%;
letter-spacing: normal;
text-transform: initial;
color: var(--black);
}
@media (max-width: 576px) {
h4,
.h4 {
font-size: 2rem;
}
}
content > *:not(:last-child) {
margin-bottom: 1em;
}
content > *:not(:first-child) {
margin-top: 1em;
}
p,
.p,
ul,
ol {
display: block;
margin: 0;
font-family: var(--font-family);
font-weight: 300;
font-size: 2rem;
line-height: 150%;
letter-spacing: normal;
text-transform: initial;
color: var(--black);
}
ul li::marker {
font-size: 60%;
}
.subtitle {
display: block;
margin: 0;
font-weight: 300;
font-size: 3rem;
line-height: 120%;
color: var(--black);
}
@media (max-width: 576px) {
.subtitle {
font-size: 2rem;
}
}
.text-light {
color: var(--white);
}
time,
.time {
display: inline-block;
font-weight: 400;
font-size: 1.8rem;
letter-spacing: 0.05em;
color: var(--black);
}
.btn {
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;
border: none;
border-radius: 2.5rem;
padding: 1.735rem 3rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.2rem;
letter-spacing: 0.05em;
text-align: center;
text-transform: uppercase;
color: var(--white);
background-color: var(--pink);
-webkit-transition-property: color, background-color;
transition-property: color, background-color;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease;
transition-timing-function: ease;
cursor: pointer;
}
@media (max-width: 576px) {
.btn {
border-radius: 1.5rem;
}
}
@media (any-hover: hover) {
.btn:hover {
color: var(--white);
background-color: var(--pink-hover);
}
}
.btn:focus-visible {
outline: none;
color: var(--white);
background-color: var(--pink-hover);
}
.btn:active {
color: var(--white);
background-color: var(--pink);
}
.btn:disabled {
color: var(--grey3);
background-color: var(--grey2);
cursor: not-allowed;
}
.btn_sm {
border-radius: 1.5rem;
padding: 1rem 2rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 1.8rem;
line-height: none;
letter-spacing: normal;
letter-spacing: 0.05em;
text-transform: lowercase;
}
.btn-icon {
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;
border: none;
border-radius: 1.5rem;
width: 4rem;
color: var(--black);
background-color: var(--grey1);
-webkit-transition-property: color, background-color;
transition-property: color, background-color;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease;
transition-timing-function: ease;
cursor: pointer;
}
.btn-icon svg {
display: block;
width: 50%;
height: 50%;
fill: currentcolor;
}
@media (any-hover: hover) {
.btn-icon:hover {
color: var(--pink-hover);
}
}
.btn-icon:focus-visible {
outline: none;
color: var(--pink-hover);
}
.btn-icon:active {
color: var(--pink);
}
.btn_pink {
color: var(--white);
background-color: var(--pink);
-webkit-transition-property: color, background-color;
transition-property: color, background-color;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease;
transition-timing-function: ease;
}
@media (any-hover: hover) {
.btn_pink:hover {
color: var(--white);
background-color: var(--pink-hover);
}
}
.btn_pink:focus-visible {
outline: none;
color: var(--white);
background-color: var(--pink-hover);
}
.btn_pink:active {
color: var(--white);
background-color: var(--pink);
}
.btn_pink:disabled {
color: var(--grey3);
background-color: var(--grey2);
cursor: not-allowed;
}
.btn_gray {
color: var(--black);
background-color: var(--grey1);
}
.btn_gray.active {
color: var(--white);
background-color: var(--pink);
}
@media (any-hover: hover) {
.btn_gray:hover {
color: var(--white);
background-color: var(--black);
}
}
.btn_gray:focus-visible {
outline: none;
color: var(--white);
background-color: var(--black);
}
.btn_gray:active {
color: var(--white);
background-color: var(--pink-hover);
}
.btn_gray:disabled {
color: var(--grey3);
background-color: var(--grey2);
cursor: not-allowed;
}
.btn_dark {
color: var(--white);
background-color: var(--black);
}
@media (any-hover: hover) {
.btn_dark:hover {
color: var(--white);
background-color: var(--pink-hover);
}
}
.btn_dark:focus-visible {
outline: none;
color: var(--white);
background-color: var(--pink-hover);
}
.btn_dark:active {
color: var(--white);
background-color: var(--pink);
}
.btn_dark:disabled {
color: var(--grey3);
background-color: var(--grey2);
cursor: not-allowed;
}
.btn-square {
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;
border-radius: 2rem;
padding: 1.4rem;
width: 5rem;
-webkit-transition-property: background-color, color;
transition-property: background-color, color;
aspect-ratio: 1/1;
}
.btn-square svg,
.btn-square img {
display: block;
-ms-flex-negative: 0;
flex-shrink: 0;
width: 100%;
height: 100%;
fill: currentcolor;
}
.btn-soc {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-box;
display: -ms-flexbox;
display: 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;
border-radius: 2rem;
padding: 1.4rem;
width: 6rem;
height: 6rem;
background-color: var(--pink);
-webkit-transition-property: background-color, color;
transition-property: background-color, color;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease;
transition-timing-function: ease;
}
.btn-soc svg,
.btn-soc img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
@media (any-hover: hover) {
.btn-soc:hover {
background-color: var(--pink-hover);
}
}
.btn-soc:focus-visible {
outline: none;
background-color: var(--pink-hover);
}
.btn-soc:active {
background-color: var(--pink);
}
.btn-soc:disabled {
color: var(--grey3);
background-color: var(--grey2);
cursor: not-allowed;
}
a {
text-decoration: none;
color: inherit;
-webkit-transition-property: color;
transition-property: color;
-webkit-transition-duration: 0.3s;
transition-duration: 0.3s;
-webkit-transition-timing-function: ease;
transition-timing-function: ease;
}
@media (any-hover: hover) {
a:hover {
color: var(--pink-hover);
}
}
a:focus-visible {
outline: none;
color: var(--pink-hover);
}
a:active {
color: var(--pink-hover);
}
.cart-btn {
position: relative;
}
.cart-btn span {
position: absolute;
left: 50%;
bottom: 0.8rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 1.1rem;
line-height: 100%;
letter-spacing: 0.05em;
text-align: center;
text-transform: uppercase;
color: var(--white);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.icon-btn {
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;
color: var(--black);
-webkit-transition: color 0.3s ease-in;
transition: color 0.3s ease-in;
}
.icon-btn svg {
width: 100%;
height: 100%;
fill: currentcolor;
}
@media (any-hover: hover) {
.icon-btn:hover {
color: var(--pink);
}
}
.icon-btn:focus-visible {
outline: none;
color: var(--pink-hover);
}
.icon-btn:active {
color: var(--pink);
}
:root {
--dropdown-border-radius-md: 2rem;
--dropdown-border-radius-sm: 0.8rem;
--dropdown-border-width: 0.1rem;
--dropdown-transition-fast: 0.12s ease;
--dropdown-transition-normal: 0.18s ease;
--dropdown-transition-slow: 0.2s ease;
--dropdown-z-panel: 1000;
--dropdown-z-submenu: 1100;
--dropdown-width: 28rem;
--dropdown-submenu-min-width: 24rem;
--dropdown-submenu-max-width: 28rem;
--dropdown-max-height: 42rem;
} .dropdown {
position: relative;
width: 100%;
height: 100%;
}
.dropdown_open {
z-index: var(--dropdown-z-panel);
} .dropdown__trigger {
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;
border-radius: var(--dropdown-border-radius-md);
padding: 1.2rem 1.6rem;
height: 100%;
background-color: var(--grey1);
-webkit-transition: all var(--dropdown-transition-slow);
transition: all var(--dropdown-transition-slow);
cursor: pointer;
gap: 0.4rem;
} .dropdown__trigger-text {
font-weight: 500;
font-size: 1.4rem;
color: var(--black);
} .dropdown__trigger-arrow {
font-size: 1rem;
line-height: 1;
color: var(--black);
-webkit-transition: -webkit-transform var(--dropdown-transition-slow);
transition: -webkit-transform var(--dropdown-transition-slow);
transition: transform var(--dropdown-transition-slow);
transition: transform var(--dropdown-transition-slow), -webkit-transform var(--dropdown-transition-slow);
} .dropdown_open .dropdown__trigger-arrow {
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
} .dropdown__panel {
position: absolute;
left: 0;
top: calc(100% + 0.8rem);
z-index: var(--dropdown-z-panel);
border-radius: var(--dropdown-border-radius-md);
width: var(--dropdown-width);
min-width: 100%;
max-height: var(--dropdown-max-height);
background-color: var(--grey1);
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(-0.8rem);
-ms-transform: translateY(-0.8rem);
transform: translateY(-0.8rem);
-webkit-transition: opacity var(--dropdown-transition-normal), visibility var(--dropdown-transition-normal), -webkit-transform var(--dropdown-transition-normal);
transition: opacity var(--dropdown-transition-normal), visibility var(--dropdown-transition-normal), -webkit-transform var(--dropdown-transition-normal);
transition: opacity var(--dropdown-transition-normal), visibility var(--dropdown-transition-normal), transform var(--dropdown-transition-normal);
transition: opacity var(--dropdown-transition-normal), visibility var(--dropdown-transition-normal), transform var(--dropdown-transition-normal), -webkit-transform var(--dropdown-transition-normal);
} .dropdown_open .dropdown__panel {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
} .dropdown__panel::-webkit-scrollbar {
width: 0.6rem;
}
.dropdown__panel::-webkit-scrollbar-track {
border-radius: 1rem;
background: #f0f2f5;
}
.dropdown__panel::-webkit-scrollbar-thumb {
border-radius: 1rem;
background: #cbdbe0;
} .dropdown__menu-root {
list-style: none;
margin: 0;
border-radius: var(--dropdown-border-radius-md);
padding: 0.4rem 0;
background-color: var(--grey1);
} .dropdown__item {
position: relative;
list-style: none;
} .dropdown__link {
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: 0.2rem 0.6rem;
border-radius: var(--dropdown-border-radius-md);
padding: 0.9rem 1.4rem;
font-size: 1.3rem;
white-space: nowrap;
text-decoration: none;
color: #1f2f3e;
background-color: var(--grey1);
-webkit-transition: background var(--dropdown-transition-fast);
transition: background var(--dropdown-transition-fast);
cursor: pointer;
}
.dropdown__link span:first-child {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.dropdown__link:hover,
.dropdown__item.hovered > .dropdown__link {
color: var(--white);
background-color: var(--pink-hover);
} .dropdown__sub-arrow {
-ms-flex-negative: 0;
flex-shrink: 0;
margin-left: 1rem;
font-size: 1rem;
color: inherit;
-webkit-transition: -webkit-transform var(--dropdown-transition-fast);
transition: -webkit-transform var(--dropdown-transition-fast);
transition: transform var(--dropdown-transition-fast);
transition: transform var(--dropdown-transition-fast), -webkit-transform var(--dropdown-transition-fast);
} .dropdown__submenu {
position: absolute;
left: calc(100% + 1px);
top: 0;
z-index: var(--dropdown-z-submenu);
border: var(--dropdown-border-width) solid #eef2f8;
border-radius: var(--dropdown-border-radius-md);
padding: 0.4rem 0;
min-width: var(--dropdown-submenu-min-width);
max-width: var(--dropdown-submenu-max-width);
background-color: var(--grey1);
opacity: 0;
visibility: hidden;
-webkit-transition: opacity var(--dropdown-transition-fast), visibility var(--dropdown-transition-fast);
transition: opacity var(--dropdown-transition-fast), visibility var(--dropdown-transition-fast);
pointer-events: none;
} .dropdown__item:hover > .dropdown__submenu {
opacity: 1;
visibility: visible;
pointer-events: auto;
} .dropdown__submenu .dropdown__link {
white-space: nowrap;
} .dropdown__submenu .dropdown__sub-arrow {
font-size: 1rem;
} @media (width <= 576px) {
:root {
--dropdown-width: 26rem;
--dropdown-submenu-min-width: 22rem;
--dropdown-submenu-max-width: 26rem;
}
}
.product-reviews__filters .dropdown.dropdown_lg,
.dropdown.dropdown_lg {
height: 6rem;
}
.dropdown_lg .dropdown__trigger {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.dropdown_lg .dropdown__trigger {
padding: 1rem 2rem;
}
.dropdown_lg .dropdown__trigger-text_placeholder {
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--grey4);
}
.dropdown_lg .dropdown__trigger-arrow {
-ms-flex-negative: 0;
flex-shrink: 0;
padding: 1rem;
width: 3.6rem;
height: 3.6rem;
color: var(--black);
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transform-origin: center;
-ms-transform-origin: center;
transform-origin: center;
}
.dropdown_lg .dropdown__trigger-arrow svg {
width: 100%;
height: 100%;
fill: none;
stroke: currentcolor;
stroke-width: 2px;
}
.dropdown_lg .dropdown__link {
font-size: 1.8rem;
}
.modal {
position: fixed;
left: 0;
top: 0;
z-index: 990;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow-y: auto;
padding: var(--container-offset);
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.5);
opacity: 0;
-webkit-transition: opacity 0.3s ease-in;
transition: opacity 0.3s ease-in;
pointer-events: none;
}
.modal.active {
opacity: 1;
pointer-events: all;
}
.modal__header {
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;
margin-bottom: 2rem;
gap: 1rem;
}
.modal__desc:not(:last-child) {
margin-bottom: 5rem;
}
.modal__close {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 2.6rem;
height: 2.6rem;
color: var(--black);
-webkit-transition: color 0.3s ease-in;
transition: color 0.3s ease-in;
}
.modal__close svg {
width: 100%;
height: 100%;
stroke: currentcolor;
stroke-linecap: round;
stroke-width: 4px;
}
@media (any-hover: hover) {
.modal__close:hover {
color: var(--red);
}
}
.modal__close:focus-visible {
outline: none;
color: var(--red);
}
.modal__close:active {
color: var(--red);
}
.modal__body {
position: relative;
overflow: hidden;
margin: auto;
border-radius: 2rem;
padding: 8rem;
width: 100%;
max-width: var(--content-width);
background-color: var(--white);
}
@media (max-width: 576px) {
.modal__body {
padding: 3rem;
}
}
.modal__title {
font-size: 3rem;
}
.modal__cols {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
gap: 3rem;
}
.modal__cols:not(:last-child) {
margin-bottom: 5rem;
}
@media (max-width: 576px) {
.modal__cols {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.modal__bottom {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
}
.modal__btn {
width: 100%;
max-width: 37rem;
}
@media (max-width: 576px) {
.modal_service {
padding: 0;
}
.modal_service .modal__body {
position: relative;
border-radius: 0;
padding: 0;
background-color: #f7f7f7;
}
.modal_service .modal__header {
position: sticky;
top: 0;
z-index: 2;
margin-bottom: 0;
border-radius: 0 0 2rem 2rem;
padding: 4rem 3rem;
background-color: #fff;
}
.modal_service .modal__title {
font-size: 2.4rem;
text-transform: initial;
}
.modal_service .modal__content {
padding: var(--container-offset);
}
.modal_service .modal__bottom {
position: sticky;
bottom: 0;
z-index: 2;
border-radius: 2rem 2rem 0 0;
padding: 3rem;
background-color: var(--white);
}
.modal_service .modal__btn {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
max-width: calc(100% - 5rem);
}
}
.modal_cta .cta__img {
margin-right: -8rem;
}
@media (max-width: 576px) {
.modal_cta .cta__img {
margin-top: -3rem;
margin-right: -6rem;
}
}
.modal_cta .modal__close {
position: absolute;
right: 2rem;
top: 2rem;
z-index: 4;
}
@media (max-width: 576px) {
.modal_cta .modal__close {
color: var(--white);
}
}
.modal_success .modal__body {
padding: 5rem 4rem 4rem;
max-width: 48rem;
text-align: center;
}
@media (max-width: 576px) {
.modal_success .modal__body {
padding: 4rem 3rem 3rem;
}
}
.modal_success .modal__close {
position: absolute;
right: 2rem;
top: 2rem;
}
.modal-success__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;
margin: 0 auto 3rem;
border-radius: 50%;
width: 7.2rem;
height: 7.2rem;
color: var(--red);
background-color: rgba(243, 12, 27, 0.08);
}
.modal-success__check {
display: block;
width: 3.2rem;
height: 3.2rem;
}
.modal-success__title {
margin-bottom: 1.5rem;
}
.modal-success__text {
margin: 0 0 3rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--grey4);
}
@media (max-width: 576px) {
.modal-success__text {
margin-bottom: 2.5rem;
font-size: 1.8rem;
}
}
.modal-success__btn {
width: 100%;
text-transform: lowercase;
}
.form {
display: -ms-grid;
display: grid;
-ms-grid-columns: (1fr)[2];
grid-template-columns: repeat(2, 1fr);
gap: 2rem;
}
@media (max-width: 576px) {
.form {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.form__field {
position: relative;
display: block;
width: 100%;
}
.form__field--long {
-ms-grid-column-span: 2;
grid-column: 2 span;
}
@media (any-hover: hover) {
.form__field:hover input:not(:disabled) ~ .form__label {
color: rgba(0, 0, 0, 0.45);
}
.form__field:hover textarea:not(:disabled) ~ .form__label {
color: rgba(0, 0, 0, 0.45);
}
}
.form__field-wrapper {
position: relative;
display: block;
overflow: hidden;
outline: 2px solid transparent;
border-radius: 2rem;
height: 6rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
text-transform: lowercase;
background-color: var(--grey1);
-webkit-transition: color 0.3s ease-out, background-color 0.3s ease-out, outline-color 0.3s ease-in;
transition: color 0.3s ease-out, background-color 0.3s ease-out, outline-color 0.3s ease-in;
}
.form__field-wrapper--area {
height: 14rem;
}
.form__field.filled .form__label {
font-size: 1.4rem;
-webkit-transform: translateY(0.4rem);
-ms-transform: translateY(0.4rem);
transform: translateY(0.4rem);
}
.form__field.filled .form__input--area {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.form__label {
position: absolute;
left: 2rem;
top: 0;
z-index: 4;
width: 100%;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
text-transform: lowercase;
color: rgba(0, 0, 0, 0.25);
-webkit-transform: translateY(1.6rem);
-ms-transform: translateY(1.6rem);
transform: translateY(1.6rem);
-webkit-transition: color 0.3s ease-out;
transition: color 0.3s ease-out;
-webkit-transition: font-size 0.3s ease-in, background-color 0.3s ease-in, -webkit-transform 0.3s ease-in;
transition: font-size 0.3s ease-in, background-color 0.3s ease-in, -webkit-transform 0.3s ease-in;
transition: transform 0.3s ease-in, font-size 0.3s ease-in, background-color 0.3s ease-in;
transition: transform 0.3s ease-in, font-size 0.3s ease-in, background-color 0.3s ease-in, -webkit-transform 0.3s ease-in;
pointer-events: none;
}
.form__input {
position: absolute;
left: 0;
top: 0;
display: block;
border: 2px solid transparent;
border-radius: 2rem;
padding: 1.8rem 2rem 1.2rem;
width: 100%;
height: 100%;
background: none;
-webkit-transition: background-color 0.3s ease-in, -webkit-transform 0.3s ease-in;
transition: background-color 0.3s ease-in, -webkit-transform 0.3s ease-in;
transition: transform 0.3s ease-in, background-color 0.3s ease-in;
transition: transform 0.3s ease-in, background-color 0.3s ease-in, -webkit-transform 0.3s ease-in;
}
.form__input:focus {
outline: none;
}
.form__input:focus ~ .form__label {
font-size: 1.4rem;
-webkit-transform: translateY(0.4rem);
-ms-transform: translateY(0.4rem);
transform: translateY(0.4rem);
}
.form__input:disabled {
background-color: #e3e6e6;
cursor: not-allowed;
-ms-touch-action: none;
touch-action: none;
}
.form__input--area {
resize: none;
}
.form__input--area:focus {
-webkit-transform: none;
-ms-transform: none;
transform: none;
}
.form__btn {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-grid-column-span: 2;
grid-column: 2 span;
margin-top: 2rem;
padding: 1.5rem 3rem 1.6rem;
width: 100%;
}
.form__extra {
-ms-grid-column-span: 2;
grid-column: 2 span;
width: 100%;
font-size: 1.8rem;
}
.form__field_password .form__input {
padding-right: 6rem;
}
.form__password-toggle {
position: absolute;
right: 2rem;
top: 50%;
z-index: 5;
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: 3rem;
height: 3rem;
color: var(--black);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
.form__password-toggle[hidden] {
display: none;
}
@media (any-hover: hover) {
.form__password-toggle:hover {
color: var(--pink);
}
}
.form__password-icon {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
.form__password-icon[hidden] {
display: none;
}
.filter-tab {
position: relative;
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;
overflow: hidden;
border-radius: 1.5rem;
padding: 1rem 7rem;
height: 4rem;
font-weight: 500;
font-size: 1.8rem;
letter-spacing: 0.05em;
white-space: nowrap;
text-transform: lowercase;
color: var(--black);
background-color: var(--grey1);
-webkit-transition-property: color, background-color;
transition-property: color, background-color;
}
@media (any-hover: hover) {
.filter-tab:hover {
color: var(--white);
background-color: var(--black);
}
}
.filter-tab:active {
color: var(--white);
background-color: var(--pink-hover);
}
.filter-tab_active, .filter-tab.filter-tab_active {
color: var(--white);
background-color: var(--pink);
}
@media (any-hover: hover) {
.filter-tab_active:hover, .filter-tab.filter-tab_active:hover {
color: var(--white);
background-color: var(--pink-hover);
}
}
.badge {
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;
border: 1px solid var(--pink);
border-radius: 5rem;
padding: 0.8rem 1rem 1rem;
min-width: 12rem;
font-family: var(--font-family);
font-weight: 400;
font-size: 1.6rem;
letter-spacing: 0.05em;
white-space: nowrap;
color: var(--pink-hover);
}
.badge_blue {
border-color: var(--blue);
color: var(--blue);
}
.badge_green {
border-color: var(--green);
color: var(--green);
}
.flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
.jcsb {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
.jcc {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.align-center {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
.align-start {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.aligne-end {
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
}
.flex-col {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.flex-1 {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.grow {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
.grow-0 {
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
}
.shrink-0 {
-ms-flex-negative: 0;
flex-shrink: 0;
}
.control {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 1rem;
}
@media (max-width: 576px) {
.control {
display: none;
}
}
.control__btn {
padding: 0.4rem;
width: 5rem;
height: 5rem;
color: var(--black);
-webkit-transition: color 0.2s ease-in;
transition: color 0.2s ease-in;
}
.control__btn svg {
display: block;
width: auto;
height: 100%;
fill: none;
stroke: currentcolor;
stroke-width: 0.8rem;
}
.control__btn_next {
-webkit-transform: rotateY(180deg);
transform: rotateY(180deg);
}
@media (any-hover: hover) {
.control__btn:hover {
color: var(--pink-hover);
}
}
.control__btn:focus-visible {
outline: none;
color: var(--pink-hover);
}
.control__btn:active {
color: var(--pink);
}
.control_light .control__btn {
color: var(--white);
}
@media (any-hover: hover) {
.control_light .control__btn:hover {
color: var(--black);
}
}
.control_light .control__btn:focus-visible {
outline: none;
color: var(--black);
}
.control_light .control__btn:active {
color: var(--black);
}
.checkbox {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-family: var(--font3);
font-weight: 400;
font-size: 2rem;
line-height: 150%;
color: var(--black);
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
gap: 1rem;
}
.checkbox__input {
position: absolute;
overflow: hidden;
margin: -1px;
border: 0;
padding: 0;
width: 1px;
height: 1px;
white-space: nowrap;
clip: rect(0, 0, 0, 0);
}
.checkbox__box {
position: relative;
-ms-flex-negative: 0;
flex-shrink: 0;
border: 0.2rem solid var(--grey2);
border-radius: 1rem;
width: 3rem;
height: 3rem;
background-color: var(--white);
-webkit-transition: background-color 0.12s ease, border-color 0.12s ease;
transition: background-color 0.12s ease, border-color 0.12s ease;
}
.checkbox__box::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
display: block;
border-radius: 0.4rem;
width: 1.8rem;
height: 1.8rem;
background-color: var(--pink);
opacity: 0;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: opacity 0.12s ease;
transition: opacity 0.12s ease;
}
.checkbox__input:checked + .checkbox__box::after {
opacity: 1;
}
.checkbox__input:disabled + .checkbox__box {
opacity: 0.5;
cursor: not-allowed;
}
.checkbox__input:disabled ~ .checkbox__text {
opacity: 0.5;
cursor: not-allowed;
}
.radio {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-family: var(--font3);
font-weight: 400;
font-size: 2rem;
line-height: 150%;
color: var(--black);
cursor: pointer;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
gap: 1rem;
}
.radio__input {
position: absolute;
overflow: hidden;
margin: -1px;
border: 0;
padding: 0;
width: 1px;
height: 1px;
white-space: nowrap;
clip: rect(0, 0, 0, 0);
}
.radio__box {
position: relative;
-ms-flex-negative: 0;
flex-shrink: 0;
border: 0.2rem solid var(--grey2);
border-radius: 1rem;
width: 3rem;
height: 3rem;
background-color: var(--white);
-webkit-transition: background-color 0.12s ease, border-color 0.12s ease;
transition: background-color 0.12s ease, border-color 0.12s ease;
}
.radio__box::after {
content: "";
position: absolute;
left: 50%;
top: 50%;
display: block;
border-radius: 0.4rem;
width: 1.8rem;
height: 1.8rem;
background-color: var(--pink);
opacity: 0;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: opacity 0.12s ease;
transition: opacity 0.12s ease;
}
.radio__input:checked + .radio__box::after {
opacity: 1;
}
.radio__input:disabled + .radio__box {
opacity: 0.5;
cursor: not-allowed;
}
.radio__input:disabled ~ .radio__text {
opacity: 0.5;
cursor: not-allowed;
}
.product-card {
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;
border-radius: 5rem;
padding: 5rem;
width: 42rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.product-card {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.product-card__img {
margin-bottom: 3rem;
width: 100%;
aspect-ratio: 1/1;
}
.product-card__img img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-webkit-transition: -webkit-transform 0.3s ease;
transition: -webkit-transform 0.3s ease;
transition: transform 0.3s ease;
transition: transform 0.3s ease, -webkit-transform 0.3s ease;
}
.product-card__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;
margin-bottom: 2rem;
}
.product-card__stock {
font-family: var(--font-family);
font-weight: 500;
font-size: 1.8rem;
letter-spacing: 0.05em;
text-transform: lowercase;
color: var(--grey3);
}
.product-card__title {
font-weight: 400;
line-height: 120%;
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.product-card__title:not(:last-child) {
margin-bottom: 2rem;
}
.product-card__info {
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-top: auto;
margin-bottom: 2rem;
}
.product-card__price span {
display: block;
font-family: var(--font-family);
font-weight: 500;
font-size: 1.8rem;
letter-spacing: 0.05em;
text-decoration: line-through;
text-transform: uppercase;
color: var(--grey3);
}
.product-card__price div {
font-family: var(--second-family);
font-weight: 400;
font-size: 2.6rem;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--pink);
}
.product-card__discount {
font-family: var(--second-family);
font-weight: 400;
font-size: 2.6rem;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--black);
}
.product-card__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 1rem;
}
.product-card__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
.product-card__incart {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
line-height: 1;
}
@media (max-width: 576px) {
.product-card_favorites {
padding: 3rem;
}
.product-card_favorites .product-card__title {
font-size: 1.6rem;
}
.product-card_favorites .product-card__stock {
font-size: 1.4rem;
}
.product-card_favorites .product-card__rating.rating {
gap: 0.4rem;
}
.product-card_favorites .product-card__rating.rating svg {
width: 1.4rem;
height: 1.4rem;
}
.product-card_favorites .product-card__info {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
.product-card_favorites .product-card__price {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.product-card_favorites .product-card__price span {
font-size: 1.2rem;
}
.product-card_favorites .product-card__price div {
font-size: 1.6rem;
}
.product-card_favorites .product-card__discount {
font-size: 1.4rem;
}
}
.header {
position: relative;
border-radius: 0 0 5rem 5rem;
padding: 2.5rem 0;
background-color: var(--white);
}
.header_fixed {
position: fixed;
left: 0;
right: 0;
top: 0;
z-index: 200;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
-webkit-transition: -webkit-transform 0.35s ease;
transition: -webkit-transform 0.35s ease;
transition: transform 0.35s ease;
transition: transform 0.35s ease, -webkit-transform 0.35s ease;
will-change: transform;
}
.header_is-hidden {
-webkit-transform: translateY(-100%);
-ms-transform: translateY(-100%);
transform: translateY(-100%);
}
@media (max-width: 576px) {
.header {
border-radius: 0 0 3rem 3rem;
}
}
.header__logo {
display: block;
width: 20rem;
height: 4rem;
}
.header__logo img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: left;
object-position: left;
}
@media (max-width: 576px) {
.header__logo {
width: 4rem;
}
}
.header__container {
position: relative;
z-index: 60;
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: 576px) {
.header__container {
gap: 3rem;
}
}
.header__left {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 4rem;
}
@media (max-width: 576px) {
.header__left {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
gap: 3rem;
}
}
@media (max-width: 576px) {
.header__nav {
display: none;
}
}
.header__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 3rem;
}
@media (max-width: 576px) {
.header__actions {
display: none;
}
}
.header__act_like {
width: 3rem;
height: 3rem;
}
.header__act_profile {
width: 2.5rem;
height: 3.5rem;
}
.header__act_cart {
position: relative;
width: 3rem;
height: 3.5rem;
}
.header__act_cart span {
position: absolute;
left: 50%;
bottom: 0.8rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 1.1rem;
line-height: 100%;
letter-spacing: 0.05em;
text-align: center;
text-transform: uppercase;
color: var(--white);
-webkit-transform: translateX(-50%);
-ms-transform: translateX(-50%);
transform: translateX(-50%);
}
.header__burger {
display: none;
}
@media (max-width: 576px) {
.header__burger {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
}
}
.burger {
--burger-width: 3rem;
--burger-height: 3rem;
--burger-line-height: 0.4rem;
position: relative;
border: none;
padding: 0;
width: var(--burger-width);
height: var(--burger-height);
color: #000;
background-color: transparent;
cursor: pointer;
}
.burger::before, .burger::after {
content: "";
position: absolute;
left: 0;
width: 100%;
height: var(--burger-line-height);
background-color: currentColor;
border-radius: 10px;
-webkit-transition: top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
transition: top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, top 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.burger::before {
top: 0;
}
.burger::after {
top: calc(100% - var(--burger-line-height));
}
.burger__line {
position: absolute;
left: 0;
top: 50%;
border-radius: 10px;
width: 100%;
height: var(--burger-line-height);
background-color: currentColor;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: -webkit-transform 0.3s ease-in-out;
transition: -webkit-transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.burger--active::before {
top: 50%;
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transition: top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
transition: top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, top 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.burger--active::after {
top: 50%;
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transition: top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
transition: top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, top 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, top 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.burger--active .burger__line {
-webkit-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
-webkit-transition: -webkit-transform 0.3s ease-in-out;
transition: -webkit-transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out;
transition: transform 0.3s ease-in-out, -webkit-transform 0.3s ease-in-out;
}
.header-features {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 1rem;
}
@media (max-width: 576px) {
.header-features {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
}
.header-features__dropdown {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 16rem;
height: 5rem;
}
@media (max-width: 576px) {
.header-features__dropdown {
display: none;
}
}
.header-features__search {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 37rem;
}
.header-features__search .form__field-wrapper {
height: 5rem;
}
.header-features__search .form__field-wrapper .form__label,
.header-features__search .form__field-wrapper .form__input {
font-size: 1.6rem;
}
.header-features__search .form__field-wrapper .form__input:not(:focus) .form__label,
.header-features__search .form__field-wrapper .form__input:not(.filled) .form__label {
-webkit-transform: translateY(1.2rem);
-ms-transform: translateY(1.2rem);
transform: translateY(1.2rem);
}
@media (max-width: 576px) {
.header-features__search {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
width: auto;
}
}
.footer {
margin-top: 7.5rem;
border-radius: 5rem 5rem 0 0;
padding: 8rem 0;
-webkit-box-shadow: 0 10px 60px 0 rgba(0, 0, 0, 0.05);
box-shadow: 0 10px 60px 0 rgba(0, 0, 0, 0.05);
background-color: var(--white);
}
.footer__container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
gap: 19rem;
}
@media (max-width: 576px) {
.footer__container {
-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;
gap: 5rem;
}
}
.footer__left {
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;
gap: 3rem;
}
@media (max-width: 576px) {
.footer__left {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
}
}
.footer__logo {
display: block;
width: 30rem;
height: 6rem;
}
.footer__logo img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
.footer__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 1rem;
}
@media (max-width: 576px) {
.footer__actions {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
gap: 2rem;
}
}
.footer__btn {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
border-radius: 2.5rem;
width: 100%;
max-width: 28.4rem;
}
@media (max-width: 576px) {
.footer__btn {
height: 6rem;
max-width: 33rem;
}
}
.footer__capture {
display: block;
margin-bottom: 2rem;
min-width: 21rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2.2rem;
line-height: 150%;
color: #1c1c1c;
}
.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;
font-weight: 300;
font-size: 2.2rem;
line-height: 150%;
color: #1c1c1c;
gap: 2rem;
}
.footer__nav ul {
display: inherit;
-webkit-box-orient: inherit;
-webkit-box-direction: inherit;
-ms-flex-direction: inherit;
flex-direction: inherit;
gap: inherit;
}
.footer__right {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
font-family: var(--font-family);
font-weight: 300;
font-size: 2.2rem;
line-height: 150%;
text-align: right;
color: var(--grey4);
gap: 3rem;
}
.footer__right p,
.footer__right small {
font-weight: inherit;
font-size: inherit;
color: inherit;
}
@media (max-width: 576px) {
.footer__right {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
}
}
.footer__adult span {
display: block;
margin-bottom: 2rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 3rem;
line-height: 110%;
text-transform: uppercase;
color: var(--grey4);
}
.address {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
font-style: normal;
gap: 1.5rem;
}
.address:not(:last-child) {
margin-bottom: 4rem;
}
.address__value {
font-family: var(--second-family);
font-weight: 400;
font-size: 2rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
.nav ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
list-style: none;
margin: 0;
padding: 0;
gap: 4rem;
}
.nav ul li a {
font-weight: 400;
font-size: 2.4rem;
line-height: 130%;
text-transform: lowercase;
color: var(--black);
-webkit-transition: color 0.3s ease-in;
transition: color 0.3s ease-in;
}
@media (any-hover: hover) {
.nav ul li a:hover {
color: var(--pink);
}
}
.nav ul li a:focus-visible {
outline: none;
color: var(--pink);
}
.nav ul li a:active {
color: var(--pink);
}
.banner__container {
position: relative;
z-index: 2;
overflow: hidden;
border-radius: 5rem;
padding: 9rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.banner__container {
overflow: hidden;
border-radius: 3rem;
padding: 0;
}
}
.banner__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;
gap: 5rem;
}
@media (max-width: 576px) {
.banner__content {
padding: 5rem 4rem;
gap: 2.6rem;
}
}
.banner__subtitle {
max-width: 38rem;
}
@media (max-width: 576px) {
.banner__subtitle {
max-width: 25rem;
}
}
.banner__img {
position: absolute;
right: 0;
top: 0;
z-index: -1;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/banner/mask.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/banner/mask.svg);
-webkit-mask-position: right;
mask-position: right;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: auto 100%;
mask-size: auto 100%;
width: auto;
height: 100%;
min-width: 135.5rem;
background-color: #ccc;
}
@media (max-width: 576px) {
.banner__img {
position: static;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/banner/mask-mob.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/banner/mask-mob.svg);
height: 44.2rem;
min-width: 100%;
}
}
.banner__img img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: right;
object-position: right;
}
.banner__btn {
width: 100%;
max-width: 40.8rem;
}
@media (max-width: 576px) {
.banner__btn {
max-width: 100%;
}
}
.blog-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow: hidden;
border-radius: 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.blog-item {
border-radius: 3rem;
}
}
.blog-item__img {
overflow: hidden;
border-radius: 5rem;
height: 45rem;
}
@media (max-width: 576px) {
.blog-item__img {
border-radius: 3rem;
height: 25rem;
}
}
.blog-item__img img {
display: block;
width: 100%;
height: 100%;
}
.blog-item__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 5rem;
}
.blog-item__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;
margin-bottom: 2rem;
}
.blog-item__title {
margin-bottom: 2rem;
}
.blog-item__desc {
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
margin-bottom: 4rem;
}
.blog-item__btn {
margin-top: auto;
}
.mobile-menu {
display: none;
}
@media (max-width: 576px) {
.mobile-menu {
position: fixed;
left: 0;
right: 0;
bottom: 0;
z-index: 100;
display: block;
border-radius: 3rem 3rem 0 0;
padding: 2.7rem 0 calc(2.7rem + env(safe-area-inset-bottom));
-webkit-box-shadow: 0 4px 60px 0 rgba(0, 0, 0, 0.07);
box-shadow: 0 4px 60px 0 rgba(0, 0, 0, 0.07);
background-color: var(--white);
}
}
.mobile-menu__panel {
display: none;
margin-bottom: 2.4rem;
width: 100%;
}
.mobile-menu__incart-btn {
width: 100%;
}
.mobile-menu__incart-btn a {
width: 100%;
}
.mobile-menu__checkout {
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;
gap: 2rem;
}
.mobile-menu__prices {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
gap: 0.4rem;
}
.mobile-menu__total {
font-family: var(--font-family);
font-weight: 600;
font-size: 3rem;
text-transform: uppercase;
color: var(--black);
}
.mobile-menu__old {
font-weight: 400;
font-size: 1.8rem;
text-decoration: line-through;
color: var(--grey4);
}
.mobile-menu__order-btn {
-ms-flex-negative: 0;
flex-shrink: 0;
border-radius: 1.5rem;
padding: 1.2rem 4rem;
min-height: 6rem;
font-weight: 500;
font-size: 1.6rem;
white-space: nowrap;
text-transform: uppercase;
}
.mobile-menu__help-links {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 1rem;
}
.mobile-menu__help-link {
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;
border-radius: 1.5rem;
padding: 1rem 4rem;
min-height: 4rem;
font-weight: 500;
font-size: 1.8rem;
text-align: center;
text-transform: lowercase;
color: var(--black);
background-color: var(--grey1);
-webkit-transition: background-color 0.2s ease;
transition: background-color 0.2s ease;
}
@media (any-hover: hover) {
.mobile-menu__help-link:hover {
background-color: rgba(255, 47, 146, 0.08);
}
}
.mobile-menu__nav ul {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: space-evenly;
-ms-flex-pack: space-evenly;
justify-content: space-evenly;
gap: 2rem;
}
.mobile-menu__nav ul a {
display: block;
width: 3rem;
height: 3rem;
}
.mobile-menu__nav ul a.active-page {
pointer-events: none;
}
.mobile-menu__nav ul a.active-page svg {
fill: var(--pink);
}
.mobile-menu__nav ul a svg {
width: 100%;
height: 100%;
}
@media (max-width: 576px) {
.page__body_mobile-cart .mobile-menu__panel_cart {
display: block;
}
}
@media (max-width: 576px) {
.page__body_mobile-help .mobile-menu__panel_help {
display: block;
}
}
@media (max-width: 576px) {
.page__body_mobile-product .mobile-menu__panel_default {
display: block;
}
}
@media (max-width: 576px) {
.site-container {
padding-bottom: 8rem;
}
}
.burger-menu {
position: absolute;
left: 0;
top: 8rem;
z-index: 1000;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
width: 100%;
opacity: 0;
visibility: hidden;
-webkit-transition: opacity 0.3s ease, visibility 0.3s ease;
transition: opacity 0.3s ease, visibility 0.3s ease;
pointer-events: none;
}
.burger-menu.menu--active {
opacity: 1;
visibility: visible;
pointer-events: all;
}
.burger-menu__overlay {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100vh;
background-color: rgba(0, 0, 0, 0.45);
}
.burger-menu__panel {
position: relative;
z-index: 1;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow: hidden;
border-radius: 0 0 3rem 3rem;
padding: 3rem;
padding-top: 6rem;
width: 100%;
background-color: var(--white);
}
.burger-menu__panel_profile {
overflow-y: auto;
padding-bottom: calc(3rem + env(safe-area-inset-bottom));
}
.burger-menu__head {
display: -ms-grid;
display: grid;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-grid-columns: 4rem minmax(0, 1fr) 4rem;
grid-template-columns: 4rem minmax(0, 1fr) 4rem;
margin-bottom: 4rem;
gap: 1.2rem;
}
.burger-menu__head_profile {
-ms-grid-columns: 4rem minmax(0, 1fr) 4rem;
grid-template-columns: 4rem minmax(0, 1fr) 4rem;
margin-bottom: 3rem;
}
.burger-menu__logo {
display: block;
width: 4rem;
height: 4rem;
}
.burger-menu__logo img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
.burger-menu__search {
min-width: 0;
}
.burger-menu__search .form__field-wrapper {
border-radius: 2.5rem;
height: 5rem;
}
.burger-menu__search .form__label,
.burger-menu__search .form__input {
font-size: 1.6rem;
}
.burger-menu__search .form__input:not(:focus, .filled) ~ .form__label,
.burger-menu__search .form__field:not(.filled) .form__label {
-webkit-transform: translateY(1.2rem);
-ms-transform: translateY(1.2rem);
transform: translateY(1.2rem);
}
.burger-menu__profile-title {
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 110%;
text-align: center;
text-transform: uppercase;
color: var(--black);
}
.burger-menu__close {
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;
margin-left: auto;
width: 4rem;
height: 4rem;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
.burger-menu__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.burger-menu__close:hover {
color: var(--pink);
}
}
.burger-menu__nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-bottom: 4rem;
}
.burger-menu__list {
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: center;
-ms-flex-align: center;
align-items: center;
width: 100%;
gap: 2.4rem;
}
.burger-menu__link {
font-family: var(--font-family);
font-weight: 400;
font-size: 2rem;
line-height: 150%;
text-align: center;
text-transform: lowercase;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
@media (any-hover: hover) {
.burger-menu__link:hover {
color: var(--pink);
}
}
.burger-menu__callback {
border-radius: 2rem;
width: 100%;
min-height: 6rem;
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.burger-menu__profile-user {
margin-bottom: 3rem;
}
.burger-menu .profile-nav__title {
font-size: 2rem;
}
.burger-menu .profile-nav__link {
font-size: 1.8rem;
}
.burger-menu .profile-nav__group:not(:last-child) {
margin-bottom: 3rem;
}
@media (max-width: 576px) {
.page__body_profile .header-features {
display: none;
}
.page__body_profile .header__profile-title {
display: block;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
margin: 0;
font-size: 2.4rem;
text-align: center;
}
.page__body_profile .header__left {
-webkit-box-flex: 0;
-ms-flex-positive: 0;
flex-grow: 0;
}
.page__body_profile .header__container {
display: -ms-grid;
display: grid;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-ms-grid-columns: 4rem 1fr 3rem;
grid-template-columns: 4rem 1fr 3rem;
gap: 1.6rem;
}
.page__body_profile .profile__title {
display: none;
}
.header__profile-title {
display: none;
}
}
@media (min-width: 1025px) {
.burger-menu_profile {
display: none;
}
}
.breadcrumbs {
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;
margin-bottom: 3rem;
}
.breadcrumbs span {
font-weight: 300;
font-size: 1.8rem;
line-height: 120%;
text-transform: lowercase;
color: var(--grey4);
}
.breadcrumbs span:not(:last-child) {
margin-right: 0.6rem;
}
.breadcrumbs span:not(:last-child)::after {
content: "/";
margin-left: 0.2rem;
}
.breadcrumbs a {
color: var(--black);
}
@media (any-hover: hover) {
.breadcrumbs a:hover {
color: var(--pink);
}
}
.catalog-toolbar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 1rem;
}
@media (max-width: 576px) {
.catalog-toolbar {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
}
.custom-sort {
position: relative;
}
@media (max-width: 576px) {
.custom-sort {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
}
}
.custom-sort.active .custom-sort__arrow {
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.custom-sort.active .custom-sort__dropdown {
opacity: 1;
visibility: visible;
-webkit-transform: translateY(0);
-ms-transform: translateY(0);
transform: translateY(0);
}
.custom-sort.active .custom-sort__trigger,
.custom-sort.active .custom-sort__arrow {
color: var(--pink);
}
.custom-sort__trigger {
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;
border: none;
border-radius: 2rem;
padding: 0 2rem;
width: 30rem;
height: 6rem;
font-weight: 300;
font-size: 2rem;
color: var(--black);
background: var(--grey1);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
cursor: pointer;
}
@media (any-hover: hover) {
.custom-sort__trigger:hover {
color: var(--pink);
}
}
@media (max-width: 576px) {
.custom-sort__trigger {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
width: auto;
}
}
.custom-sort__label {
line-height: 1;
}
.custom-sort__arrow {
-ms-flex-negative: 0;
flex-shrink: 0;
color: currentcolor;
-webkit-transition: -webkit-transform 0.25s ease;
transition: -webkit-transform 0.25s ease;
transition: transform 0.25s ease;
transition: transform 0.25s ease, -webkit-transform 0.25s ease;
}
.custom-sort__dropdown {
position: absolute;
left: 0;
top: calc(100% + 1rem);
z-index: 100;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow: hidden;
border-radius: 2rem;
padding: 0.8rem 0;
width: 100%;
background: var(--grey1);
opacity: 0;
visibility: hidden;
-webkit-transform: translateY(1rem);
-ms-transform: translateY(1rem);
transform: translateY(1rem);
-webkit-transition: all 0.25s ease;
transition: all 0.25s ease;
}
.custom-sort__dropdown button {
border: none;
padding: 1rem 2rem;
width: 100%;
font-weight: 300;
font-size: 2rem;
text-align: left;
color: var(--black);
background: transparent;
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
cursor: pointer;
}
.custom-sort__dropdown button:hover {
color: var(--pink);
}
.catalog-filters-btn {
width: 6rem;
}
.catalog-tabs {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 1rem;
}
@media (max-width: 576px) {
.catalog-tabs {
-ms-flex-wrap: nowrap;
flex-wrap: nowrap;
overflow: auto hidden;
margin-right: calc(-1 * var(--container-offset));
margin-left: calc(-1 * var(--container-offset));
padding: 0 var(--container-offset);
scrollbar-width: none;
}
}
.modal_filter {
padding: var(--container-offset);
}
.modal_filter .modal__body {
overflow: hidden;
border-radius: 5rem;
padding: 0;
max-width: 72rem;
}
@media (max-width: 576px) {
.modal_filter .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;
border-radius: 3rem;
max-width: 100%;
max-height: calc(100dvh - 2 * var(--container-offset));
}
}
.catalog-filter-modal {
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;
max-height: calc(100dvh - 2 * var(--container-offset));
}
.catalog-filter-modal__close {
position: absolute;
right: 2.4rem;
top: 2.4rem;
z-index: 2;
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;
border-radius: 1.6rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--grey1);
-webkit-transition: color 0.2s ease, background-color 0.2s ease;
transition: color 0.2s ease, background-color 0.2s ease;
}
.catalog-filter-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.catalog-filter-modal__close:hover {
color: var(--pink);
}
}
@media (max-width: 576px) {
.catalog-filter-modal__close {
right: 1.6rem;
top: 1.6rem;
}
}
.catalog-filter-modal__head {
padding: 5rem 5rem 0;
padding-right: 8rem;
}
@media (max-width: 576px) {
.catalog-filter-modal__head {
padding: 4rem 3rem 0;
padding-right: 7rem;
}
}
.catalog-filter-modal__title {
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 3rem;
line-height: 120%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.catalog-filter-modal__title {
font-size: 2.4rem;
}
}
.catalog-filter-modal__form {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-height: 0;
}
.catalog-filter-modal__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow-y: auto;
padding: 3rem 5rem 4rem;
gap: 3rem;
}
@media (max-width: 576px) {
.catalog-filter-modal__content {
padding: 2rem 3rem 3rem;
}
}
.catalog-filter-modal__section-title {
margin: 0 0 1.6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 1.8rem;
line-height: 140%;
text-transform: lowercase;
color: var(--black);
}
.catalog-filter-modal__price-fields {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
margin-bottom: 2.4rem;
gap: 1rem;
}
.catalog-filter-modal__price-field .form__field-wrapper {
border-radius: 2.5rem;
height: 6rem;
}
.catalog-filter-modal__price-field .form__input {
border-radius: 2.5rem;
}
.catalog-filter-modal__slider {
margin: 1rem 1.2rem 0.4rem;
padding: 1.6rem 0;
}
.catalog-filter-modal__slider.noUi-target {
border: none;
-webkit-box-shadow: none;
box-shadow: none;
background: transparent;
}
.catalog-filter-modal__slider.noUi-horizontal {
height: 4px;
}
.catalog-filter-modal__slider .noUi-base,
.catalog-filter-modal__slider .noUi-connects {
height: 4px;
}
.catalog-filter-modal__slider .noUi-connects {
border-radius: 4px;
background: var(--grey2);
}
.catalog-filter-modal__slider .noUi-connect {
background: var(--pink);
}
.catalog-filter-modal__slider.noUi-horizontal .noUi-handle {
right: -10px;
top: -8px;
z-index: 2;
border: none;
border-radius: 50%;
width: 20px;
height: 20px;
-webkit-box-shadow: none;
box-shadow: none;
background: var(--pink);
cursor: -webkit-grab;
cursor: grab;
}
.catalog-filter-modal__slider.noUi-horizontal .noUi-handle::before, .catalog-filter-modal__slider.noUi-horizontal .noUi-handle::after {
display: none;
}
.catalog-filter-modal__slider.noUi-horizontal .noUi-handle:active {
cursor: -webkit-grabbing;
cursor: grabbing;
}
.catalog-filter-modal__slider .noUi-touch-area {
cursor: inherit;
}
.catalog-filter-modal__tabs {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 1rem;
}
.catalog-filter-modal__actions {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
padding: 0 5rem 5rem;
gap: 1rem;
}
@media (max-width: 576px) {
.catalog-filter-modal__actions {
padding: 0 3rem 3rem;
}
}
.catalog-filter-modal__reset, .catalog-filter-modal__submit {
border-radius: 2.5rem;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
@media (max-width: 576px) {
.catalog-filter-modal__reset, .catalog-filter-modal__submit {
min-height: 5rem;
font-size: 1.8rem;
}
}
.catalog-filter-tab {
position: relative;
margin: 0;
border: none;
cursor: pointer;
}
.catalog-filter-tab__input {
position: absolute;
overflow: hidden;
margin: -1px;
border: 0;
padding: 0;
width: 1px;
height: 1px;
white-space: nowrap;
clip: rect(0, 0, 0, 0);
}
.catalog-filter-tab__text {
pointer-events: none;
}
.product-gallery {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
min-width: 0;
max-width: 100%;
max-height: 71rem;
gap: 2rem;
}
.product-gallery__thumbnails {
-ms-flex-negative: 0;
flex-shrink: 0;
padding: 2px 0;
width: 13rem;
height: 100%;
min-height: 0;
max-width: 100%;
max-height: 100%;
cursor: -webkit-grab;
cursor: grab;
}
.product-gallery__thumbnails .swiper-slide {
overflow: hidden;
border-radius: 5rem;
padding: 1.5rem;
background-color: var(--white);
}
.product-gallery__thumbnails .swiper-slide img {
display: block;
width: 100%;
height: 100%;
}
.product-gallery__thumbnails .swiper-slide.swiper-slide-thumb-active {
border: 2px solid var(--pink);
}
@media (max-width: 576px) {
.product-gallery__thumbnails {
display: none;
}
}
.product-gallery__main {
cursor: -webkit-grab;
cursor: grab;
}
.product-gallery__main .swiper-slide {
overflow: hidden;
border-radius: 5rem;
padding: 6rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.product-gallery__main .swiper-slide {
border-radius: 3rem;
padding: 2rem;
max-height: 51.6rem;
}
}
.product-gallery__main .swiper-slide img {
display: block;
width: 100%;
height: 100%;
}
.summary {
overflow: hidden;
border-radius: 5rem;
padding: 5rem 6rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.summary {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.summary__header {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-bottom: 3rem;
gap: 3rem;
}
.summary__title {
font-size: 3rem;
}
@media (max-width: 576px) {
.summary__title {
font-family: var(--font-family);
font-weight: 500;
font-size: 2.6rem;
line-height: 110%;
text-transform: initial;
color: var(--black);
}
}
.summary__brand {
border-radius: 5rem;
padding: 4rem 3rem;
width: auto;
font-family: var(--second-family);
font-weight: 400;
font-size: 1.8rem;
line-height: 110%;
text-align: center;
text-transform: uppercase;
color: var(--black);
background-color: #f5f5f5;
}
@media (max-width: 576px) {
.summary__brand {
position: absolute;
left: 4rem;
top: 4rem;
z-index: 4;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 3rem;
padding: 1rem 2.8rem;
height: 5rem;
font-size: 1.6rem;
}
}
.summary__bottom {
margin-top: 4rem;
}
@media (max-width: 576px) {
.summary__bottom {
position: absolute;
right: 4rem;
top: 4rem;
z-index: 4;
margin-top: 0;
}
}
.summary__like {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
font-weight: 500;
font-size: 1.8rem;
letter-spacing: 0.05em;
color: var(--black);
gap: 1rem;
}
.summary__like svg {
width: 1.8rem;
height: 1.8rem;
fill: currentcolor;
}
@media (max-width: 576px) {
.summary__like {
overflow: hidden;
border-radius: 1.5rem;
padding: 1.4rem;
width: 5rem;
height: 5rem;
background-color: var(--grey1);
}
.summary__like span {
display: none;
}
.summary__like svg {
width: 2rem;
height: 2rem;
}
}
.summary__like.active {
color: var(--pink);
}
.summary__rating {
margin-bottom: 3rem;
}
.summary__desc {
margin-bottom: 2rem;
}
@media (max-width: 576px) {
.summary__desc {
display: none;
}
}
.summary__desc p {
font-family: var(--font-family);
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 5;
}
.summary__desc p strong {
font-weight: bolder;
}
.summary__more {
display: inline-block;
margin-top: 1.5rem;
font-weight: 400;
font-size: 2rem;
line-height: 130%;
color: var(--black);
}
.summary__price {
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;
margin-bottom: 3rem;
gap: 3rem;
}
@media (max-width: 576px) {
.summary__price {
margin-bottom: 2rem;
gap: 1rem;
}
}
.summary__cost {
font-family: var(--second-family);
font-weight: 400;
font-size: 5rem;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.summary__cost {
font-size: 3rem;
}
}
.summary__old {
font-family: var(--second-family);
font-weight: 400;
font-size: 3rem;
letter-spacing: 0.05em;
text-decoration: line-through;
text-transform: uppercase;
color: var(--grey3);
}
@media (max-width: 576px) {
.summary__old {
-webkit-box-ordinal-group: 3;
-ms-flex-order: 2;
order: 2;
width: 100%;
font-size: 2rem;
}
}
.summary__diff {
font-family: var(--second-family);
font-weight: 400;
font-size: 4rem;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--pink);
}
@media (max-width: 576px) {
.summary__diff {
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
margin-left: auto;
font-size: 3rem;
}
}
.summary__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 2rem;
}
@media (max-width: 576px) {
.summary__actions {
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
}
}
.summary__incart {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
border-radius: 2.5rem;
}
@media (max-width: 576px) {
.summary__incart {
display: none;
}
}
.summary__stock {
border-radius: 2.5rem;
padding: 1.7rem 4rem;
width: 100%;
max-width: 30rem;
font-weight: 600;
font-size: 2rem;
letter-spacing: 0.05em;
text-align: center;
color: var(--black);
background-color: #f5f5f5;
}
@media (max-width: 576px) {
.summary__stock {
border-radius: 1.5rem;
max-width: 25rem;
font-size: 1.8rem;
}
}
.rating {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 0.8rem;
}
.rating button,
.rating div {
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;
}
.rating svg {
width: 2rem;
height: 2rem;
fill: none;
stroke: var(--grey3);
stroke-width: 0.2rem;
}
.rating svg.fill {
fill: var(--grey3);
}
.rating_accent svg {
stroke: var(--pink);
}
.rating_accent svg.fill {
fill: var(--pink);
}
.rating_sm svg {
width: 1.6rem;
height: 1.6rem;
}
.product-tabs {
border-radius: 3rem;
padding: 2rem;
}
.product-tabs__nav {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-bottom: 5rem;
gap: 4rem;
}
@media (max-width: 576px) {
.product-tabs__nav {
margin-bottom: 4rem;
gap: 4rem;
}
}
.product-tabs__tab {
border: none;
font-weight: 500;
font-size: 3rem;
line-height: 110%;
white-space: nowrap;
text-transform: lowercase;
color: var(--black);
background: none;
-webkit-transition: color 0.2s;
transition: color 0.2s;
}
@media (max-width: 576px) {
.product-tabs__tab {
font-size: 2.2rem;
}
}
.product-tabs__tab.is-active {
color: var(--pink);
}
.product-tabs__tab:not(.is-active) {
cursor: pointer;
}
@media (any-hover: hover) {
.product-tabs__tab:not(.is-active):hover {
color: var(--pink-hover);
}
}
.product-tabs__panel {
display: none;
width: 100%;
}
.product-tabs__panel.is-active {
display: block;
}
.product-tabs__container {
overflow: hidden;
border-radius: 5rem;
padding: 6rem;
background-color: var(--white);
}
.product-tabs__container:has(.dropdown_open) {
overflow: visible;
}
@media (max-width: 576px) {
.product-tabs__container {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.product-description {
font-size: 1.4rem;
line-height: 1.8;
}
.product-description p {
margin-bottom: 2rem;
}
.product-description ul {
padding-left: 2rem;
}
.product-description ul li {
margin-bottom: 1rem;
}
.product-details {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 2rem;
}
@media (max-width: 576px) {
.product-details {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.product-detail-card {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
border-radius: 4rem;
padding: 6rem;
min-width: 40rem;
min-height: 12rem;
background-color: var(--grey1);
}
@media (max-width: 576px) {
.product-detail-card {
padding: 5rem 4rem;
width: 100%;
min-width: unset;
min-height: unset;
}
}
.product-detail-card span {
display: block;
margin-bottom: 2.4rem;
font-weight: 400;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.product-detail-card span {
font-size: 1.8rem;
}
}
.product-detail-card strong {
display: block;
font-weight: 500;
font-size: 2rem;
line-height: 150%;
}
@media (max-width: 576px) {
.product-detail-card strong {
font-size: 1.8rem;
}
}
.product-reviews__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;
margin-bottom: 5rem;
}
.product-reviews__filters {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 2rem;
}
@media (max-width: 576px) {
.product-reviews__filters {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
width: 100%;
}
}
.product-reviews__filters .dropdown {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 28rem;
height: 6rem;
}
@media (max-width: 576px) {
.product-reviews__filters .dropdown {
width: 100%;
}
}
.product-reviews select {
border: none;
border-radius: 1.6rem;
padding: 0 2rem;
width: 17rem;
height: 5rem;
background: #fff;
}
.reviews-btn {
width: 100%;
height: 6rem;
max-width: 43rem;
font-weight: 400;
}
@media (max-width: 576px) {
.reviews-btn {
margin-top: 4rem;
max-width: 100%;
}
}
.reviews-grid {
overflow: visible;
}
.review-card {
border-radius: 4rem;
padding: 6rem;
width: 52rem;
background-color: #f5f5f5;
}
@media (max-width: 576px) {
.review-card {
padding: 5rem 4rem;
width: 39.6rem;
}
}
.review-card__author {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: 2rem;
gap: 1.5rem;
}
@media (max-width: 576px) {
.review-card__author {
gap: 1rem;
}
}
.review-card__avatar {
border-radius: 4rem;
width: 10rem;
height: 10rem;
background-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/avatar.svg);
background-position: center;
background-size: contain;
background-repeat: no-repeat;
background-color: var(--grey2);
}
@media (max-width: 576px) {
.review-card__avatar {
border-radius: 3rem;
width: 7.4rem;
height: 7.4rem;
}
}
.review-card__avatar img {
display: block;
width: 100%;
height: 100%;
}
.review-card h4 {
margin: 0;
margin-bottom: 2rem;
font-family: var(--font4);
font-weight: 500;
font-size: 3rem;
line-height: 100%;
color: #18181a;
}
@media (max-width: 576px) {
.review-card h4 {
margin-bottom: 1rem;
font-size: 2.4rem;
}
}
.review-card__rating {
color: #ff2f92;
}
.review-card__date {
margin-bottom: 2.5rem;
font-weight: 500;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
.review-card__text {
margin-bottom: 3rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
.review-card__gallery {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 0.8rem;
}
.review-card__gallery img {
border-radius: 1.6rem;
width: 13rem;
height: 13rem;
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.review-card__gallery img {
width: 8.7rem;
height: 8.7rem;
}
}
.modal_review,
.modal_review-login {
padding: var(--container-offset);
}
.modal_review .modal__body,
.modal_review-login .modal__body {
border-radius: 5rem;
padding: 8rem;
width: 100%;
max-width: 70rem;
}
@media (max-width: 576px) {
.modal_review .modal__body,
.modal_review-login .modal__body {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.review-modal,
.review-login-modal {
position: relative;
}
.review-modal__close {
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;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--grey1);
-webkit-transition: color 0.15s ease-in;
transition: color 0.15s ease-in;
}
.review-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.review-modal__close:hover {
color: var(--pink);
}
}
.review-modal__header {
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;
margin-bottom: 6rem;
}
@media (max-width: 576px) {
.review-modal__header {
margin-bottom: 2rem;
}
}
.review-modal__title {
font-family: var(--second-family);
font-weight: 400;
font-size: 4rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.review-modal__title {
font-size: 3rem;
}
}
.review-modal__rating {
margin-bottom: 3rem;
}
.review-modal__rating svg {
width: 4rem;
height: 4rem;
fill: var(--grey4);
stroke: none;
}
.review-modal__rating button {
cursor: pointer;
}
.review-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;
gap: 3rem;
}
.review-modal__field {
width: 100%;
}
.review-modal__textarea {
display: block;
border: none;
border-radius: 2.5rem;
padding: 2rem 3rem;
width: 100%;
height: 12rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
background-color: var(--grey1);
resize: none;
}
.review-modal__textarea::-webkit-input-placeholder {
color: rgba(0, 0, 0, 0.35);
}
.review-modal__textarea::-moz-placeholder {
color: rgba(0, 0, 0, 0.35);
}
.review-modal__textarea:-ms-input-placeholder {
color: rgba(0, 0, 0, 0.35);
}
.review-modal__textarea::-ms-input-placeholder {
color: rgba(0, 0, 0, 0.35);
}
.review-modal__textarea::placeholder {
color: rgba(0, 0, 0, 0.35);
}
.review-modal__textarea:focus {
outline: none;
}
.review-modal__attachments {
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;
margin-bottom: 3rem;
gap: 1rem;
}
@media (max-width: 576px) {
.review-modal__attachments {
margin-bottom: 0;
}
}
.review-modal__upload {
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;
border-radius: 2rem;
width: 12rem;
height: 12rem;
background-color: var(--grey2);
-webkit-transition: background-color 0.2s ease;
transition: background-color 0.2s ease;
cursor: pointer;
}
.review-modal__upload svg {
width: 3.4rem;
height: 2.6rem;
fill: var(--grey4);
-webkit-transition: fill 0.2s ease;
transition: fill 0.2s ease;
}
@media (any-hover: hover) {
.review-modal__upload:hover {
background-color: var(--pink-hover);
}
.review-modal__upload:hover svg {
fill: var(--pink);
}
}
.review-modal__thumbs {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 1rem;
}
.review-modal__thumb {
position: relative;
-ms-flex-negative: 0;
flex-shrink: 0;
overflow: hidden;
border-radius: 1.6rem;
width: 8rem;
height: 8rem;
}
.review-modal__thumb img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.review-modal__thumb-remove {
position: absolute;
right: 0.4rem;
top: 0.4rem;
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;
border-radius: 0.6rem;
width: 2.4rem;
height: 2.4rem;
color: var(--black);
background-color: var(--white);
-webkit-transition: color 0.15s ease;
transition: color 0.15s ease;
}
.review-modal__thumb-remove svg {
display: block;
width: 1.2rem;
height: 1.2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.review-modal__thumb-remove:hover {
color: var(--pink);
}
}
.review-modal__actions {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
gap: 2rem;
}
@media (max-width: 576px) {
.review-modal__actions {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.review-modal__cancel, .review-modal__submit {
border-radius: 1.5rem;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.review-login-modal__close {
position: absolute;
right: 0;
top: 0;
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;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--grey1);
-webkit-transition: color 0.15s ease-in;
transition: color 0.15s ease-in;
}
.review-login-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.review-login-modal__close:hover {
color: var(--pink);
}
}
.review-login-modal__title {
margin: 0 0 6rem;
padding-right: 6rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 4rem;
line-height: 120%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.review-login-modal__title {
margin-bottom: 4rem;
font-size: 3rem;
}
}
.review-login-modal__actions {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
gap: 2rem;
}
@media (max-width: 576px) {
.review-login-modal__actions {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.review-login-modal__cancel, .review-login-modal__login {
border-radius: 1.5rem;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.quantity {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 2.5rem;
padding: 1rem 3.8rem;
min-height: 5rem;
background-color: var(--grey1);
gap: 0.4rem;
}
.quantity__btn {
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;
padding: 0.6rem;
width: 2rem;
height: 2rem;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
@media (any-hover: hover) {
.quantity__btn:hover {
color: var(--pink);
}
}
.quantity__btn:focus-visible {
outline: none;
color: var(--pink-hover);
}
.quantity__btn svg {
width: 100%;
height: 100%;
fill: currentcolor;
}
.quantity__input {
-webkit-appearance: textfield;
-moz-appearance: textfield;
appearance: textfield;
border: none;
padding: 0;
width: 3.6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 1.8rem;
line-height: 1;
text-align: center;
color: var(--black);
background-color: transparent;
}
.quantity__input::-webkit-outer-spin-button, .quantity__input::-webkit-inner-spin-button {
-webkit-appearance: none;
appearance: none;
margin: 0;
}
.quantity__input:focus {
outline: none;
}
.cart-item {
display: -ms-grid;
display: grid;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
-ms-grid-rows: auto 1.6rem auto;
-ms-grid-columns: auto 3rem minmax(0, 1fr) 3rem auto 3rem auto;
grid-template: "thumb title price quantity" auto "thumb actions price quantity" auto/auto minmax(0, 1fr) auto auto;
padding: 5rem 0;
gap: 1.6rem 3rem;
}
.cart-item__thumb {
-ms-grid-row: 1;
-ms-grid-row-span: 3;
-ms-grid-column: 1;
position: relative;
display: block;
-ms-flex-negative: 0;
flex-shrink: 0;
grid-area: thumb;
overflow: hidden;
border-radius: 2rem;
width: 15rem;
height: 15rem;
background-color: var(--grey1);
}
.cart-item__thumb img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.cart-item__checkbox {
position: absolute;
left: 0.8rem;
top: 0.8rem;
z-index: 2;
}
.cart-item__price {
-ms-grid-row: 1;
-ms-grid-row-span: 3;
-ms-grid-column: 5;
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;
grid-area: price;
white-space: nowrap;
gap: 0.4rem;
}
.cart-item__price-current {
font-family: var(--font-family);
font-weight: 600;
font-size: 3rem;
line-height: 1.2;
color: var(--black);
}
.cart-item__price-discount {
font-weight: 500;
font-size: 1.8rem;
line-height: 1.2;
color: var(--grey3);
}
.cart-item__title {
-ms-grid-row: 1;
-ms-grid-column: 3;
grid-area: title;
margin: 0;
font-family: var(--font-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 120%;
letter-spacing: normal;
text-transform: none;
color: var(--black);
}
.cart-item__title a {
color: inherit;
}
@media (any-hover: hover) {
.cart-item__title a:hover {
color: var(--pink);
}
}
.cart-item__actions {
-ms-grid-row: 3;
-ms-grid-column: 3;
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;
grid-area: actions;
gap: 1rem;
}
.cart-item__actions .btn-icon {
width: 5rem;
height: 5rem;
}
.cart-item__actions .btn-icon svg {
width: 2rem;
height: 2rem;
}
.cart-item__buy {
padding: 0.8rem 2rem;
min-width: 13rem;
min-height: 5rem;
font-size: 2rem;
}
.cart-item__quantity {
-ms-grid-row: 1;
-ms-grid-row-span: 3;
-ms-grid-column: 7;
grid-area: quantity;
}
.cart-item__toolbar {
display: none;
}
@media (max-width: 576px) {
.cart-item {
-ms-grid-rows: auto 1rem auto 1rem auto;
-ms-grid-columns: 12rem 1.2rem minmax(0, 1fr);
grid-template: "thumb price" auto "thumb title" auto "toolbar toolbar" auto/12rem minmax(0, 1fr);
padding: 2.4rem 0;
gap: 1rem 1.2rem;
}
.cart-item__thumb {
border-radius: 1.6rem;
width: 12rem;
height: 12rem;
}
.cart-item__checkbox {
left: 0.6rem;
top: 0.6rem;
}
.cart-item__checkbox .checkbox__box {
border-width: 0.15rem;
border-radius: 0.8rem;
width: 2.4rem;
height: 2.4rem;
}
.cart-item__checkbox .checkbox__box::after {
border-radius: 0.3rem;
width: 1.4rem;
height: 1.4rem;
}
.cart-item__price {
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-align: baseline;
-ms-flex-align: baseline;
align-items: baseline;
gap: 0.6rem 1rem;
}
.cart-item__price-current {
font-size: 2.4rem;
}
.cart-item__price-discount {
font-size: 1.6rem;
text-decoration: line-through;
}
.cart-item__title {
font-size: 1.6rem;
line-height: 130%;
}
.cart-item__toolbar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
grid-area: toolbar;
width: 100%;
gap: 0.8rem;
}
.cart-item__toolbar .btn-icon {
-ms-flex-negative: 0;
flex-shrink: 0;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
}
.cart-item__toolbar .btn-icon svg {
width: 2rem;
height: 2rem;
}
.cart-item__toolbar .cart-item__quantity {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-ms-flex-item-align: stretch;
-ms-grid-row-align: stretch;
align-self: stretch;
min-width: 0;
}
.cart-item__toolbar .cart-item__buy {
margin-left: 1.5rem;
}
.cart-item__thumb {
-ms-grid-row: 1;
-ms-grid-row-span: 3;
-ms-grid-column: 1;
}
.cart-item__price {
-ms-grid-row: 1;
-ms-grid-row-span: 1;
-ms-grid-column: 3;
}
.cart-item__title {
-ms-grid-row: 3;
-ms-grid-column: 3;
}
}
.cart-summary {
border-radius: 5rem;
padding: 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.cart-summary {
border-radius: 3rem;
padding: 3rem;
}
}
.cart-summary__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: 3rem;
gap: 1.5rem;
}
.cart-summary__title {
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 3rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.cart-summary__title {
font-size: 2.4rem;
}
}
.cart-summary__count {
font-family: var(--font-family);
font-weight: 400;
font-size: 1.8rem;
text-transform: lowercase;
color: var(--grey4);
}
.cart-summary__details {
margin: 0 0 4rem;
}
.cart-summary__row {
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: 1.8rem;
line-height: 150%;
color: var(--black);
gap: 2rem;
}
.cart-summary__row:not(:last-child) {
margin-bottom: 2rem;
}
.cart-summary__row dt,
.cart-summary__row dd {
margin: 0;
}
.cart-summary__row dt {
color: var(--grey4);
}
.cart-summary__row dd {
font-weight: 500;
white-space: nowrap;
}
.cart-summary__row_discount dd {
color: var(--pink);
}
.cart-summary__total {
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;
margin-bottom: 3rem;
gap: 2rem;
}
.cart-summary__total-label {
font-weight: 500;
font-size: 3.2rem;
line-height: 110%;
text-transform: lowercase;
color: var(--grey4);
}
.cart-summary__total-value {
font-family: var(--font-family);
font-weight: 600;
font-size: 3rem;
line-height: 1.1;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.cart-summary__total-value {
font-size: 2.4rem;
}
}
.cart-summary__checkout {
margin: 0;
}
.cart-summary__btn {
width: 100%;
min-height: 6rem;
}
.cart-info {
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;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
overflow: hidden;
margin-top: 4rem;
border-radius: 5rem;
padding: 5rem;
min-height: 38rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.cart-info {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
margin-top: 0;
border-radius: 3rem;
padding: 2rem 3rem;
min-height: 12rem;
}
}
.cart-info__content {
position: relative;
z-index: 2;
max-width: 28rem;
}
@media (max-width: 576px) {
.cart-info__content {
max-width: 32rem;
}
}
.cart-info__title {
margin: 0;
font-family: var(--font-family);
font-weight: 300;
font-size: 2rem;
line-height: 120%;
color: var(--black);
}
@media (max-width: 576px) {
.cart-info__title {
font-size: 1.6rem;
}
}
.cart-info__title span {
display: block;
margin-bottom: 3rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 4rem;
line-height: 1;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.cart-info__title span {
margin-bottom: 1rem;
font-size: 2rem;
}
}
.cart-info__img {
position: absolute;
right: 0;
top: 0;
z-index: 1;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/cart/mask.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/cart/mask.svg);
-webkit-mask-position: left center;
mask-position: left center;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: auto 100%;
mask-size: auto 100%;
width: 75%;
height: 100%;
}
@media (max-width: 576px) {
.cart-info__img {
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/cart/mask-mob.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/cart/mask-mob.svg);
width: 43%;
}
}
.cart-info__img img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center;
object-position: center;
}
.payment-cards {
overflow: visible;
margin: 0;
padding: 0.5rem 0;
width: 100%;
min-width: 0;
max-width: 100%;
cursor: -webkit-grab;
cursor: grab;
}
.payment-cards__item {
-ms-flex-negative: 0;
flex-shrink: 0;
scroll-snap-align: start;
}
.payment-cards__item .payment_box {
display: none;
}
.payment-cards__item_active .payment-card {
-webkit-box-shadow: 0 0 0 0.3rem var(--white), 0 0 0 0.5rem var(--pink);
box-shadow: 0 0 0 0.3rem var(--white), 0 0 0 0.5rem var(--pink);
}
.payment-cards__item[class*=payment_method_yookassa] .payment-card__title, .payment-cards__item.payment_method_yookassa_epl .payment-card__title {
font-size: 1.6rem;
line-height: 130%;
}
.payment-cards__item[class*=payment_method_yookassa] .payment-card__subtitle, .payment-cards__item.payment_method_yookassa_epl .payment-card__subtitle {
font-size: 1.4rem;
line-height: 130%;
}
.payment-cards__item[class*=payment_method_yookassa] > label:not(.payment-card), .payment-cards__item.payment_method_yookassa_epl > label:not(.payment-card) {
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;
border-radius: 2rem;
padding: 2rem;
width: 21rem;
min-height: 13.6rem;
color: var(--black);
background-color: var(--grey1);
-webkit-transition: -webkit-transform 0.2s ease;
transition: -webkit-transform 0.2s ease;
transition: transform 0.2s ease;
transition: transform 0.2s ease, -webkit-transform 0.2s ease;
cursor: pointer;
gap: 1rem;
}
.payment-cards__gateway {
margin-top: 2rem;
border-radius: 2.5rem;
padding: 2.5rem 3rem;
background-color: var(--grey1);
}
@media (max-width: 576px) {
.payment-cards__gateway {
padding: 2rem;
}
}
.payment-cards__gateway[hidden] {
display: none;
}
.payment_box > p:first-child {
display: none;
}
.payment_box .woocommerce-SavedPaymentMethods {
margin: 0;
padding: 0;
list-style: none;
}
.payment_box .woocommerce-SavedPaymentMethods[data-count="0"] {
display: none;
}
.payment_box .woocommerce-SavedPaymentMethods li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 1rem;
}
.payment_box .woocommerce-SavedPaymentMethods li:not(:last-child) {
margin-bottom: 1rem;
}
.payment_box .woocommerce-SavedPaymentMethods input[type=radio] {
position: absolute;
overflow: hidden;
margin: -1px;
border: 0;
padding: 0;
width: 1px;
height: 1px;
white-space: nowrap;
clip: rect(0, 0, 0, 0);
}
.payment_box .woocommerce-SavedPaymentMethods label {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
min-height: 3rem;
padding-left: 4rem;
font-weight: 300;
font-size: 1.8rem;
line-height: 140%;
text-transform: lowercase;
color: var(--black);
cursor: pointer;
}
.payment_box .woocommerce-SavedPaymentMethods label::before {
content: "";
position: absolute;
left: 0;
top: 50%;
border: 0.2rem solid var(--grey2);
border-radius: 1rem;
width: 3rem;
height: 3rem;
background-color: var(--white);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.payment_box .woocommerce-SavedPaymentMethods label::after {
content: "";
position: absolute;
left: 0.6rem;
top: 50%;
border-radius: 0.4rem;
width: 1.8rem;
height: 1.8rem;
background-color: var(--pink);
opacity: 0;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: opacity 0.12s ease;
transition: opacity 0.12s ease;
}
.payment_box .woocommerce-SavedPaymentMethods input[type=radio]:checked + label::after {
opacity: 1;
}
.payment_box .woocommerce-SavedPaymentMethods-saveNew {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 1rem;
margin: 1.5rem 0 0;
}
.payment_box .woocommerce-SavedPaymentMethods-saveNew input[type=checkbox] {
position: absolute;
overflow: hidden;
margin: -1px;
border: 0;
padding: 0;
width: 1px;
height: 1px;
white-space: nowrap;
clip: rect(0, 0, 0, 0);
}
.payment_box .woocommerce-SavedPaymentMethods-saveNew label {
position: relative;
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
min-height: 3rem;
padding-left: 4rem;
font-weight: 300;
font-size: 1.6rem;
line-height: 140%;
text-transform: lowercase;
color: var(--black);
cursor: pointer;
}
.payment_box .woocommerce-SavedPaymentMethods-saveNew label::before {
content: "";
position: absolute;
left: 0;
top: 50%;
border: 0.2rem solid var(--grey2);
border-radius: 1rem;
width: 3rem;
height: 3rem;
background-color: var(--white);
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.payment_box .woocommerce-SavedPaymentMethods-saveNew label::after {
content: "";
position: absolute;
left: 0.6rem;
top: 50%;
border-radius: 0.4rem;
width: 1.8rem;
height: 1.8rem;
background-color: var(--pink);
opacity: 0;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
-webkit-transition: opacity 0.12s ease;
transition: opacity 0.12s ease;
}
.payment_box .woocommerce-SavedPaymentMethods-saveNew input[type=checkbox]:checked + label::after {
opacity: 1;
}
.payment-card {
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;
border-radius: 2rem;
padding: 2rem;
width: 21rem;
min-height: 13.6rem;
color: var(--white);
-webkit-transition: -webkit-transform 0.2s ease;
transition: -webkit-transform 0.2s ease;
transition: transform 0.2s ease;
transition: transform 0.2s ease, -webkit-transform 0.2s ease;
cursor: pointer;
gap: 1rem;
}
@media (max-width: 576px) {
.payment-card {
padding: 1.6rem;
width: auto;
min-width: 15.5rem;
min-height: 9.5rem;
}
}
@media (any-hover: hover) {
.payment-card:hover {
-webkit-transform: translateY(-0.2rem);
-ms-transform: translateY(-0.2rem);
transform: translateY(-0.2rem);
}
}
.payment-card__title {
font-family: var(--font-family);
font-weight: 500;
font-size: 1.8rem;
line-height: 120%;
text-transform: lowercase;
}
@media (max-width: 576px) {
.payment-card__title {
font-size: 1.6rem;
}
}
.payment-card__subtitle {
font-size: 1.6rem;
line-height: 130%;
text-transform: lowercase;
opacity: 0.9;
}
.payment-card_pink {
background-color: #f05ca8;
}
.payment-card_green {
background-color: #62cd54;
}
.payment-card_dark {
background-color: var(--black);
}
.payment-card_navy {
background-color: #0e0637;
}
.payment-card_light {
color: var(--black);
background-color: var(--grey1);
}
.payment-card_light .payment-card__subtitle {
font-weight: 500;
font-size: 2.4rem;
opacity: 1;
}
.shipping-cards {
overflow: visible;
margin: 0;
padding: 0.5rem 0;
width: 100%;
min-width: 0;
max-width: 100%;
}
.shipping-cards .swiper-wrapper {
list-style: none;
margin: 0;
padding: 0;
}
.shipping-cards__item_active .shipping-card {
-webkit-box-shadow: 0 0 0 0.3rem var(--white), 0 0 0 0.5rem var(--pink);
box-shadow: 0 0 0 0.3rem var(--white), 0 0 0 0.5rem var(--pink);
}
.shipping-card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 2rem;
padding: 2rem;
width: 30rem;
height: 100%;
min-height: 16rem;
background-color: var(--grey1);
-webkit-transition: -webkit-box-shadow 0.2s ease;
transition: -webkit-box-shadow 0.2s ease;
transition: box-shadow 0.2s ease;
transition: box-shadow 0.2s ease, -webkit-box-shadow 0.2s ease;
cursor: pointer;
gap: 1rem;
}
@media (max-width: 576px) {
.shipping-card {
width: auto;
min-width: 18rem;
min-height: 9.5rem;
}
}
.shipping-card__title {
font-family: var(--font-family);
font-weight: 400;
font-size: 1.8rem;
line-height: 120%;
color: var(--grey3);
}
@media (max-width: 576px) {
.shipping-card__title {
font-size: 1.4rem;
}
}
.shipping-card__address {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
font-weight: 400;
font-size: 2rem;
line-height: 120%;
color: var(--black);
}
@media (max-width: 576px) {
.shipping-card__address {
font-size: 1.6rem;
}
}
.shipping-card__price {
font-weight: 600;
font-size: 2rem;
color: var(--black);
}
@media (max-width: 576px) {
.shipping-card__price {
font-size: 1.6rem;
}
}
.checkout-review {
border-radius: 5rem;
padding: 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.checkout-review {
border-radius: 3rem;
padding: 3rem;
}
}
.checkout-review__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: 3rem;
gap: 1.5rem;
}
.checkout-review__title {
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 3rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.checkout-review__title {
font-size: 2rem;
}
}
.checkout-review__count {
font-size: 1.8rem;
text-transform: lowercase;
color: var(--grey4);
}
.checkout-review__items {
list-style: none;
margin: 0 0 3rem;
padding: 0;
}
.checkout-review__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;
gap: 3rem;
}
.checkout-review__item:not(:last-child) {
margin-bottom: 2rem;
}
.checkout-review__item-info {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
font-size: 1.8rem;
line-height: 1.1;
color: var(--black);
gap: 0.4rem;
}
.checkout-review__item-info .product-name {
color: var(--grey4);
}
.checkout-review__item-info .product-quantity {
font-weight: 500;
}
.checkout-review__item-prices {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-negative: 0;
flex-shrink: 0;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: end;
-ms-flex-align: end;
align-items: flex-end;
line-height: 1;
white-space: nowrap;
gap: 1rem;
}
.checkout-review__item-price {
font-weight: 600;
font-size: 1.8rem;
color: var(--black);
}
.checkout-review__item-discount {
font-weight: 500;
font-size: 1.4rem;
color: var(--pink);
}
.checkout-review__shipping {
margin-bottom: 3rem;
font-size: 1.8rem;
color: var(--grey4);
}
.checkout-review__shipping-city {
display: block;
margin-bottom: 0.8rem;
line-height: 1.1;
color: var(--grey4);
}
.checkout-review__shipping-row {
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;
font-weight: 500;
color: var(--black);
gap: 2rem;
}
.checkout-review__total {
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;
margin-bottom: 3rem;
gap: 2rem;
}
.checkout-review__total-label {
font-weight: 500;
font-size: 3.2rem;
line-height: 110%;
text-transform: lowercase;
color: var(--grey4);
}
.checkout-review__total-value {
font-weight: 600;
font-size: 3rem;
line-height: 1.1;
text-transform: uppercase;
color: var(--black);
}
.checkout-review__submit {
margin: 0 0 2rem;
}
.checkout-review__btn {
width: 100%;
min-height: 6rem;
font-size: 2rem;
}
.checkout-review__privacy {
margin: 0;
font-size: 2rem;
line-height: 150%;
color: var(--grey4);
}
.checkout-review__privacy a {
text-decoration: underline;
text-underline-offset: 0.2rem;
}
@media (any-hover: hover) {
.checkout-review__privacy a:hover {
color: var(--pink);
}
}
.promo-accordion {
overflow: hidden;
border-radius: 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.promo-accordion {
border-radius: 3rem;
}
}
.promo-accordion_open .promo-accordion__arrow {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.promo-accordion__trigger {
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: 2rem 5rem;
width: 100%;
font-family: var(--font-family);
font-weight: 400;
font-size: 2rem;
line-height: 140%;
text-align: left;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
gap: 2rem;
}
@media (max-width: 576px) {
.promo-accordion__trigger {
padding: 2.4rem 3rem;
font-size: 1.6rem;
}
}
@media (any-hover: hover) {
.promo-accordion__trigger:hover {
color: var(--pink);
}
}
.promo-accordion__trigger:focus-visible {
outline: 0.2rem solid var(--pink);
outline-offset: -0.2rem;
}
.promo-accordion__arrow {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 2rem;
height: 2rem;
fill: none;
stroke: currentcolor;
stroke-width: 0.2rem;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transition: -webkit-transform 0.25s ease;
transition: -webkit-transform 0.25s ease;
transition: transform 0.25s ease;
transition: transform 0.25s ease, -webkit-transform 0.25s ease;
}
.promo-accordion__panel {
padding: 0 5rem 3rem;
}
@media (max-width: 576px) {
.promo-accordion__panel {
padding: 0 3rem 2.4rem;
}
}
.promo-accordion__panel[hidden] {
display: none;
}
.promo-accordion__form {
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: stretch;
-ms-flex-align: stretch;
align-items: stretch;
gap: 2rem;
}
@media (max-width: 576px) {
.promo-accordion__form {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.promo-accordion__field {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 0;
}
.promo-accordion__apply {
-ms-flex-negative: 0;
flex-shrink: 0;
border-radius: 1.5rem;
height: 5rem;
font-size: 1.8rem;
}
@media (max-width: 576px) {
.promo-accordion__apply {
width: 100%;
}
}
.profile-user {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin-bottom: 4rem;
gap: 2rem;
}
@media (max-width: 576px) {
.profile-user {
-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;
margin-bottom: 0;
}
}
.profile-user__avatar {
-ms-flex-negative: 0;
flex-shrink: 0;
overflow: hidden;
border-radius: 5rem;
width: 13rem;
height: 13rem;
background-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/avatar.svg);
background-position: center;
background-size: 70%;
background-repeat: no-repeat;
background-color: var(--grey2);
}
@media (max-width: 576px) {
.profile-user__avatar {
border-radius: 1.5rem;
width: 7rem;
height: 7rem;
}
}
.profile-user__avatar img {
display: block;
width: 100%;
height: 100%;
}
.profile-user__name {
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 2rem;
line-height: 120%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.profile-user__name {
font-size: 2.2rem;
}
}
@media (max-width: 576px) {
.profile-nav {
margin-top: 4rem;
}
}
.profile-nav__group:not(:last-child) {
margin-bottom: 4rem;
}
.profile-nav__title {
margin: 0 0 1.4rem;
font-weight: 600;
font-size: 2.2rem;
color: var(--black);
}
.profile-nav__list {
list-style: none;
margin: 0;
padding: 0;
}
.profile-nav__item:not(:last-child) {
margin-bottom: 1.4rem;
}
.profile-nav__item_active .profile-nav__link {
color: var(--pink);
}
.profile-nav__link {
display: inline-block;
font-weight: 400;
font-size: 2rem;
line-height: 1;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
@media (any-hover: hover) {
.profile-nav__link:hover {
color: var(--pink);
}
}
.profile-order-card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 5rem;
padding: 5rem;
min-width: 53rem;
min-height: 25rem;
background-color: var(--white);
gap: 2rem;
}
@media (max-width: 576px) {
.profile-order-card {
padding: 3rem;
min-width: 39rem;
min-height: 18.5rem;
}
}
.profile-order-card__thumb {
-ms-flex-negative: 0;
flex-shrink: 0;
overflow: hidden;
width: 15rem;
height: 15rem;
background-color: var(--grey1);
}
@media (max-width: 576px) {
.profile-order-card__thumb {
width: 10rem;
height: 10rem;
}
}
.profile-order-card__thumb img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.profile-order-card__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-pack: center;
-ms-flex-pack: center;
justify-content: center;
min-width: 0;
gap: 2rem;
}
@media (max-width: 576px) {
.profile-order-card__body {
gap: 1.5rem;
}
}
.profile-order-card__status {
margin: 0;
font-weight: 600;
font-size: 2.8rem;
line-height: 120%;
color: var(--black);
}
@media (max-width: 576px) {
.profile-order-card__status {
font-size: 2rem;
}
}
.profile-order-card__status_green {
color: var(--green);
}
.profile-order-card__status_blue {
color: var(--blue);
}
.profile-order-card__meta {
margin: 0;
font-weight: 400;
font-size: 2rem;
line-height: 1;
color: var(--black);
}
.profile-order-card__meta span {
display: block;
margin-bottom: 0.5rem;
font-size: 1.6rem;
color: var(--grey3);
}
.profile-order-card__price {
margin: 0;
font-weight: 600;
font-size: 2.4rem;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.profile-order-card__price {
font-size: 2.2rem;
}
}
.profile-rate-card {
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;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
border-radius: 5rem;
padding: 5rem;
width: 50rem;
text-align: center;
background-color: var(--white);
}
@media (max-width: 576px) {
.profile-rate-card {
width: 42.7rem;
}
}
.profile-rate-card__close {
position: absolute;
right: 5rem;
top: 5rem;
z-index: 2;
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;
border-radius: 1.5rem;
width: 4rem;
height: 4rem;
}
.profile-rate-card__close svg {
display: block;
width: 1.6rem;
height: 1.6rem;
fill: currentcolor;
}
.profile-rate-card__thumb {
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;
overflow: hidden;
margin-bottom: 2rem;
width: 100%;
height: 20rem;
}
.profile-rate-card__thumb img {
display: block;
width: 100%;
max-height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
.profile-rate-card__title {
margin: 0 0 2rem;
font-family: var(--font-family);
font-weight: 400;
font-size: 1.8rem;
line-height: 120%;
letter-spacing: normal;
text-align: center;
text-transform: initial;
color: var(--black);
}
.profile-rate-card__title a {
color: inherit;
}
.profile-rate-card__rating {
color: var(--grey2);
}
.profile-rate-card__rating button {
cursor: default;
}
.profile-rate-card__rating svg {
width: 3.2rem;
height: 3.2rem;
fill: currentcolor;
}
.profile-address-card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
border-radius: 3rem;
background-color: var(--white);
gap: 2rem;
}
@media (max-width: 576px) {
.profile-address-card {
border: 1px solid transparent;
border-radius: 2rem;
-webkit-transition: border-color 0.2s ease;
transition: border-color 0.2s ease;
cursor: pointer;
}
.profile-address-card_active {
border-color: var(--pink);
}
}
.profile-address-card__map {
-ms-flex-negative: 0;
flex-shrink: 0;
overflow: hidden;
border-radius: 2rem;
width: 25.4rem;
height: 100%;
min-height: 25.4rem;
background-color: var(--grey1);
}
@media (max-width: 576px) {
.profile-address-card__map {
display: none;
}
}
.profile-address-card__map-canvas {
width: 100%;
height: 100%;
pointer-events: none;
-ms-touch-action: none;
touch-action: none;
}
.profile-address-card__body {
padding: 5rem;
padding-left: 0;
min-width: 0;
}
@media (max-width: 576px) {
.profile-address-card__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
padding: 3rem;
gap: 2rem;
}
}
.profile-address-card__row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 1rem;
}
.profile-address-card__text {
margin: 0 0 3rem;
font-weight: 500;
font-size: 2.4rem;
line-height: 120%;
color: var(--black);
}
@media (max-width: 576px) {
.profile-address-card__text {
margin: 0;
font-size: 2rem;
}
}
.profile-address-card__radio {
margin: 0;
margin-right: auto;
max-width: 18.5rem;
line-height: 1;
}
@media (max-width: 576px) {
.profile-address-card__radio {
display: none;
}
}
.profile-address-card__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-item-align: center;
-ms-grid-row-align: center;
align-self: center;
gap: 1rem;
}
@media (max-width: 576px) {
.profile-address-card__actions {
-ms-grid-row: 3;
-ms-grid-column: 3;
-webkit-box-orient: horizontal;
-webkit-box-direction: normal;
-ms-flex-direction: row;
flex-direction: row;
-ms-grid-row-align: auto;
align-self: auto;
grid-area: actions;
margin-top: 0.4rem;
}
}
@media (max-width: 576px){
.cart-item__toolbar {
-ms-grid-row: 5;
-ms-grid-column: 1;
-ms-grid-column-span: 3;
}
}
.profile-address-card__actions .btn-icon {
width: 5rem;
height: 5rem;
}
.modal_address {
padding: var(--container-offset);
}
.modal_address .modal__body {
overflow: hidden;
border-radius: 5rem;
padding: 0;
max-width: 120rem;
}
@media (max-width: 576px) {
.modal_address .modal__body {
border-radius: 3rem;
max-width: 100%;
}
}
.modal_address.active .modal__body {
margin: auto;
}
.address-modal {
position: relative;
}
.address-modal__close {
position: absolute;
right: 2.4rem;
top: 2.4rem;
z-index: 5;
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;
border-radius: 1.6rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--grey1);
-webkit-transition: color 0.2s ease, background-color 0.2s ease;
transition: color 0.2s ease, background-color 0.2s ease;
}
.address-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.address-modal__close:hover {
color: var(--pink);
}
}
@media (max-width: 576px) {
.address-modal__close {
right: 1.6rem;
top: 1.6rem;
}
}
.address-modal__layout {
display: -ms-grid;
display: grid;
-ms-grid-columns: minmax(0, 1fr) 52rem;
grid-template-columns: minmax(0, 1fr) 52rem;
min-width: 0;
min-height: 56rem;
}
@media (max-width: 576px) {
.address-modal__layout {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
min-height: auto;
}
}
.address-modal__map-wrap {
min-width: 0;
min-height: 56rem;
background-color: var(--grey1);
}
@media (max-width: 576px) {
.address-modal__map-wrap {
min-height: 28rem;
}
}
.address-modal__map {
width: 100%;
height: 100%;
min-height: 56rem;
}
@media (max-width: 576px) {
.address-modal__map {
min-height: 28rem;
}
}
.address-modal__panel {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 6rem 5rem 5rem;
min-width: 0;
}
@media (max-width: 576px) {
.address-modal__panel {
padding: 5rem 3rem 3rem;
}
}
.address-modal__title {
margin: 0 0 4rem;
padding-right: 5rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 120%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.address-modal__title {
margin-bottom: 3rem;
font-size: 2rem;
}
}
.address-modal__form {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-height: 0;
}
.address-modal__hint {
margin: 1.2rem 0 0;
font-size: 1.4rem;
line-height: 140%;
color: var(--grey4);
}
.address-modal__error {
margin: 1rem 0 0;
font-size: 1.4rem;
line-height: 140%;
color: var(--red);
}
.address-modal__error[hidden] {
display: none;
}
.address-modal__field {
position: relative;
margin-bottom: auto;
}
.address-modal__field.form__field_error .form__field-wrapper {
outline-color: var(--red);
}
.address-modal__field .form__field-wrapper {
border-radius: 3rem;
height: 6rem;
}
.address-modal__field .form__input {
border-radius: 3rem;
}
.address-modal__field .form__label {
left: 2.4rem;
}
.address-modal__suggestions {
position: absolute;
left: 0;
right: 0;
top: calc(100% + 0.8rem);
z-index: 6;
overflow-y: auto;
border-radius: 2rem;
padding: 0.8rem;
max-height: 24rem;
-webkit-box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, 0.12);
box-shadow: 0 1.2rem 3rem rgba(0, 0, 0, 0.12);
background-color: var(--white);
}
.address-modal__suggestions[hidden] {
display: none;
}
.address-modal__suggestion {
display: block;
border: none;
border-radius: 1.6rem;
padding: 1.2rem 1.6rem;
width: 100%;
font-family: var(--font-family);
font-size: 1.6rem;
line-height: 140%;
text-align: left;
color: var(--black);
background: transparent;
-webkit-transition: background-color 0.15s ease;
transition: background-color 0.15s ease;
cursor: pointer;
}
@media (any-hover: hover) {
.address-modal__suggestion:hover {
background-color: var(--grey1);
}
}
.address-modal__suggestion_selected, .address-modal__suggestion_selected:hover {
background-color: var(--grey1);
}
.address-modal__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
margin-top: 4rem;
gap: 1rem;
}
@media (max-width: 576px) {
.address-modal__actions {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-top: 3rem;
}
}
.address-modal__cancel, .address-modal__submit {
-webkit-box-flex: 1;
-ms-flex: 1 1 0px;
flex: 1 1 0;
min-height: 6rem;
font-size: 1.8rem;
text-transform: lowercase;
}
.address-modal__delete {
-ms-flex-negative: 0;
flex-shrink: 0;
border-radius: 2rem;
width: 6rem;
height: 6rem;
background-color: var(--grey1);
}
.address-modal__delete[hidden] {
display: none;
}
.profile-payment-card {
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;
border-radius: 3rem;
padding: 4rem;
min-height: 24rem;
-webkit-box-shadow: 0 0.4rem 2.4rem rgba(0, 0, 0, 0.04);
box-shadow: 0 0.4rem 2.4rem rgba(0, 0, 0, 0.04);
background-color: var(--white);
gap: 2.4rem;
}
.profile-payment-card__top, .profile-payment-card__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;
gap: 1.2rem;
}
.profile-payment-card__bank {
font-weight: 500;
font-size: 3rem;
line-height: 100%;
text-transform: lowercase;
color: var(--black);
}
.profile-payment-card__brand {
display: block;
-ms-flex-negative: 0;
flex-shrink: 0;
width: auto;
height: 3rem;
max-width: 10rem;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: right center;
object-position: right center;
}
.profile-payment-card__number {
font-weight: 500;
font-size: 3rem;
line-height: 100%;
letter-spacing: 0.04em;
color: var(--black);
}
.profile-payment-card__remove {
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
}
.profile-payment-card__remove svg {
width: 2rem;
height: 2rem;
}
.modal_payment-card {
padding: var(--container-offset);
}
.modal_payment-card .modal__body {
border-radius: 4rem;
padding: 5rem;
max-width: 56rem;
}
@media (max-width: 576px) {
.modal_payment-card .modal__body {
border-radius: 3rem;
padding: 4rem 3rem 3rem;
}
}
.payment-card-modal {
position: relative;
}
.payment-card-modal__close {
position: absolute;
right: 0;
top: 0;
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;
border-radius: 1.6rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--grey1);
}
.payment-card-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.payment-card-modal__close:hover {
color: var(--pink);
}
}
.payment-card-modal__title {
margin: 0 8rem 3rem 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 120%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.payment-card-modal__title {
margin-bottom: 2.4rem;
font-size: 2rem;
}
}
.payment-card-modal__preview {
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: 3rem;
border-radius: 2rem;
padding: 2rem 2.4rem;
background-color: var(--grey1);
gap: 1.6rem;
}
.payment-card-modal__preview-bank {
font-size: 1.8rem;
line-height: 120%;
text-transform: lowercase;
color: var(--black);
}
.payment-card-modal__preview-brand {
display: block;
width: auto;
height: 3rem;
max-width: 4.6rem;
-o-object-fit: contain;
object-fit: contain;
-o-object-position: right center;
object-position: right center;
}
.payment-card-modal__preview-brand[hidden] {
display: none;
}
.payment-card-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;
gap: 2rem;
}
.payment-card-modal__row {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
@media (max-width: 576px) {
.payment-card-modal__row {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.payment-card-modal__field .form__field-wrapper {
border-radius: 3rem;
height: 6rem;
}
.payment-card-modal__field .form__input {
border-radius: 3rem;
}
.payment-card-modal__field .form__label {
left: 2.4rem;
}
.payment-card-modal__field.form__field_error .form__field-wrapper {
outline-color: var(--red);
}
.payment-card-modal__error {
margin: 0.8rem 0 0;
padding-left: 2.4rem;
font-size: 1.4rem;
line-height: 140%;
color: var(--red);
}
.payment-card-modal__error[hidden] {
display: none;
}
.payment-card-modal__hint {
margin: 0;
font-size: 1.4rem;
line-height: 140%;
color: var(--grey4);
}
.payment-card-modal__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin-top: 1rem;
gap: 1rem;
}
.payment-card-modal__cancel, .payment-card-modal__submit {
-webkit-box-flex: 1;
-ms-flex: 1 1 0px;
flex: 1 1 0;
min-height: 6rem;
font-size: 1.8rem;
text-transform: lowercase;
}
.profile-order {
display: -ms-grid;
display: grid;
-ms-grid-columns: 45rem minmax(0, 1fr);
grid-template-columns: 45rem minmax(0, 1fr);
min-width: 0;
gap: 2rem;
}
@media (max-width: 576px) {
.profile-order {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
overflow: hidden;
border-radius: 3rem;
padding: 4rem;
background-color: var(--white);
gap: 3rem;
}
}
.profile-order__status-card {
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;
border-radius: 3rem;
padding: 5rem;
min-height: 28.4rem;
background-color: var(--white);
gap: 2rem;
}
@media (max-width: 576px) {
.profile-order__status-card {
border-radius: 0;
padding: 0;
min-height: unset;
background-color: transparent;
}
}
.profile-order__status {
margin: 0;
font-weight: 600;
font-size: 2.8rem;
line-height: 120%;
color: var(--black);
}
@media (max-width: 576px) {
.profile-order__status {
font-size: 2.6rem;
}
}
.profile-order__status a {
text-decoration: none;
color: inherit;
}
@media (any-hover: hover) {
.profile-order__status a:hover {
color: var(--pink);
}
}
.profile-order__status_green {
color: var(--green);
}
.profile-order__status_blue {
color: var(--blue);
}
.profile-order__meta {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
margin: 0;
font-weight: 400;
font-size: 2rem;
line-height: 1;
color: var(--black);
}
.profile-order__meta span {
display: block;
margin-bottom: 1rem;
font-size: 1.6rem;
line-height: 1;
color: var(--grey4);
}
.profile-order__rate {
width: 100%;
min-height: 5rem;
font-size: 1.6rem;
text-transform: uppercase;
}
.profile-order__products {
overflow: hidden;
border-radius: 3rem;
padding: 5rem;
width: 100%;
min-width: 0;
max-width: 100%;
background-color: var(--white);
}
@media (max-width: 576px) {
.profile-order__products {
overflow: visible;
border-radius: 0;
padding: 0;
background-color: transparent;
}
}
.profile-order__product {
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: center;
-ms-flex-align: center;
align-items: center;
width: 18.4rem;
text-align: center;
color: var(--black);
gap: 2rem;
}
@media (max-width: 576px) {
.profile-order__product {
padding: 0 0.5rem;
width: auto;
}
}
.profile-order__product img {
display: block;
width: 15rem;
height: 15rem;
background-color: var(--grey1);
-o-object-fit: cover;
object-fit: cover;
}
@media (max-width: 576px) {
.profile-order__product img {
width: 7.8rem;
height: 7.8rem;
}
}
.profile-order__product span {
font-weight: 600;
font-size: 1.6rem;
white-space: nowrap;
}
@media (max-width: 576px) {
.profile-order__product span {
font-size: 1.4rem;
}
}
.profile-questionnaire__card {
display: -ms-grid;
display: grid;
-ms-grid-columns: auto minmax(0, 1fr);
grid-template-columns: auto minmax(0, 1fr);
border-radius: 5rem;
padding: 6rem;
background-color: var(--white);
gap: 4rem;
}
@media (max-width: 576px) {
.profile-questionnaire__card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.profile-questionnaire__avatar {
border-radius: 5rem;
width: 25.4rem;
height: 25.4rem;
background-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/avatar.svg);
background-position: center;
background-size: 60%;
background-repeat: no-repeat;
background-color: var(--grey2);
}
@media (max-width: 576px) {
.profile-questionnaire__avatar {
margin: 0 auto;
width: 100%;
height: auto;
aspect-ratio: 1/1;
}
}
.profile-questionnaire__fields.form {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
.profile-questionnaire__fields .form__field-wrapper {
border-radius: 2.5rem;
}
.profile-questionnaire__hint {
grid-column: 1/-1;
margin: 0;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.profile-questionnaire__hint {
font-size: 1.6rem;
}
}
.profile-questionnaire__actions {
display: -ms-grid;
display: grid;
-ms-grid-column-span: 2;
grid-column: 2 span;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
.profile-questionnaire__actions .btn {
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
@media (max-width: 576px) {
.profile-questionnaire__actions .btn {
padding: 1rem;
min-height: 5rem;
}
}
.profile-account__card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 5rem;
padding: 4rem;
background-color: var(--white);
gap: 2rem;
}
@media (max-width: 576px) {
.profile-account__card {
border-radius: 3rem;
padding: 3rem;
}
}
.profile-account__fields.form {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
.profile-account__fields .form__field-wrapper {
border-radius: 2.5rem;
}
.profile-account__fields .form__input:-moz-read-only {
background: none;
cursor: default;
}
.profile-account__fields .form__input:read-only,
.profile-account__fields .form__input:disabled {
background: none;
cursor: default;
}
.profile-account__password-edit {
display: contents;
}
.profile-account__password-edit[hidden] {
display: none;
}
.profile-account__password-view[hidden] {
display: none;
}
.profile-account__actions[hidden] {
display: none;
}
.profile-account__actions_edit {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
.profile-account__submit {
border-radius: 2.5rem;
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
@media (max-width: 576px) {
.profile-account__submit {
padding: 1rem;
min-height: 5rem;
}
}
.profile-account__password-feedback[hidden] {
display: none;
}
.profile-account__password-feedback {
display: -ms-grid;
display: grid;
display: grid;
margin-top: -0.4rem;
gap: 0.8rem;
}
.profile-account__password-feedback .woocommerce-password-strength {
border-radius: 1.2rem;
padding: 0.8rem 1.2rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 1.2rem;
line-height: 1.3;
text-align: left;
}
.profile-account__password-feedback .woocommerce-password-hint {
display: block;
margin: 0;
font-family: var(--font-family);
font-size: 1.2rem;
line-height: 1.4;
color: var(--gray, #767676);
}
.profile-account__password-feedback[hidden] {
display: none;
}
.profile-account__password-feedback {
display: -ms-grid;
display: grid;
display: grid;
margin-top: -0.4rem;
gap: 0.8rem;
}
.profile-account__password-feedback .woocommerce-password-strength:not([style*="display: none"]) {
display: block;
}
.profile-account__password-feedback .woocommerce-password-strength[style*="display: none"] {
display: none !important;
}
.profile-account__password-feedback .woocommerce-password-strength {
border-radius: 1.2rem;
padding: 0.8rem 1.2rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 1.8rem;
line-height: 1.3;
text-align: left;
}
.profile-account__password-feedback .woocommerce-password-hint {
display: block;
margin: 0;
font-family: var(--font-family);
font-size: 1.8rem;
line-height: 1.4;
color: var(--gray, #767676);
}
.at-ben {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow: hidden;
border-radius: 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.at-ben {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.at-ben__title {
margin-bottom: 4rem;
font-family: var(--font-family);
font-size: 2.6rem;
line-height: 150%;
letter-spacing: normal;
text-transform: initial;
}
.at-ben__title span {
margin-bottom: 1rem;
color: var(--pink);
}
@media (max-width: 576px) {
.at-ben__title {
font-weight: 500;
font-size: 2.2rem;
}
}
.at-ben__img {
position: relative;
-webkit-box-flex: 1;
-ms-flex: 1 0 85rem;
flex: 1 0 85rem;
overflow: hidden;
border-radius: 5rem;
}
.at-ben__img img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
@media (max-width: 576px) {
.at-ben__img {
-ms-flex-preferred-size: unset;
flex-basis: unset;
-webkit-box-ordinal-group: 4;
-ms-flex-order: 3;
order: 3;
height: 30rem;
}
}
.at-ben__content {
padding: 6rem;
}
@media (max-width: 576px) {
.at-ben__content {
padding: 5rem 4rem;
}
}
.address-placement {
border-radius: 5rem;
font-style: normal;
background-color: var(--white);
}
@media (max-width: 576px) {
.address-placement {
border-radius: 3rem;
}
}
.address-placement__map {
position: relative;
overflow: hidden;
border-radius: 5rem;
aspect-ratio: 880/417;
}
.address-placement__map iframe {
margin: 0 !important;
border: none !important;
padding: 0 !important;
}
@media (max-width: 576px) {
.address-placement__map {
border-radius: 3rem;
aspect-ratio: 516/420;
}
}
.address-placement__content {
padding: 6rem;
padding-right: 5rem;
}
@media (max-width: 576px) {
.address-placement__content {
padding: 5rem 4rem;
}
}
.address-placement__title {
margin-bottom: 4rem;
font-size: 3rem;
color: var(--pink);
}
@media (max-width: 576px) {
.address-placement__title {
font-size: 2.2rem;
}
}
.address-placement__text {
font-weight: 500;
font-size: 2.6rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.address-placement__text {
font-size: 2rem;
}
}
.address-placement__row:not(:last-child) {
margin-bottom: 4rem;
}
.address-placement__row {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
gap: 4rem;
}
.help-nav__list {
list-style: none;
margin: 0;
padding: 0;
}
.help-nav__item:not(:last-child) {
margin-bottom: 1.4rem;
}
.help-nav__item_active .help-nav__link {
color: var(--pink);
}
.help-nav__link {
display: inline-block;
font-weight: 400;
font-size: 2rem;
line-height: 1.2;
text-align: left;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
@media (any-hover: hover) {
.help-nav__link:hover {
color: var(--pink);
}
}
.help-card {
min-width: 0;
}
.help-card__link {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow: hidden;
border-radius: 3rem;
height: 100%;
text-decoration: none;
color: inherit;
background-color: var(--white);
-webkit-transition: -webkit-transform 0.2s ease;
transition: -webkit-transform 0.2s ease;
transition: transform 0.2s ease;
transition: transform 0.2s ease, -webkit-transform 0.2s ease;
}
@media (any-hover: hover) {
.help-card__link:hover {
-webkit-transform: translateY(-0.2rem);
-ms-transform: translateY(-0.2rem);
transform: translateY(-0.2rem);
}
}
@media (max-width: 576px) {
.help-card__link {
-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;
}
}
.help-card__head {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
padding: 6rem;
min-height: 18.6rem;
}
@media (max-width: 576px) {
.help-card__head {
padding: 4rem;
min-height: 12.8rem;
}
}
.help-card__title {
margin: 0;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 110%;
text-align: left;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.help-card__title {
font-size: 2.2rem;
}
}
.help-card__visual {
position: relative;
overflow: hidden;
margin-top: auto;
border-radius: 5rem;
height: 37rem;
background: radial-gradient(120% 80% at 50% 100%, rgba(240, 92, 168, 0.15), transparent 60%), -webkit-gradient(linear, left top, left bottom, from(#1a1a1a), to(#0a0a0a));
background: radial-gradient(120% 80% at 50% 100%, rgba(240, 92, 168, 0.15), transparent 60%), linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
}
@media (max-width: 576px) {
.help-card__visual {
-webkit-box-flex: 1;
-ms-flex: 1 0 23.6rem;
flex: 1 0 23.6rem;
height: 100%;
}
}
.help-card__img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.help-info-cards {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: 3rem 0;
gap: 2rem;
}
@media (max-width: 576px) {
.help-info-cards {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.help-info-cards_cols-2 > * {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
}
.help-info-card {
position: relative;
border-radius: 5rem;
padding: 6rem;
min-width: 37rem;
min-height: 21.6rem;
background-color: var(--grey1);
}
@media (max-width: 576px) {
.help-info-card {
border-radius: 3rem;
padding: 4rem;
min-height: unset;
background-color: var(--white);
}
}
.help-info-card__header {
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;
margin-bottom: 3rem;
gap: 3rem;
}
@media (max-width: 576px) {
.help-info-card__header {
margin-bottom: 2rem;
}
}
.help-info-card__title {
font-family: var(--second-family);
font-weight: 400;
font-size: 2rem;
line-height: 120%;
text-transform: uppercase;
color: var(--black);
}
.help-info-card__num {
display: block;
font-family: var(--second-family);
font-weight: 400;
font-size: 2rem;
line-height: 1;
color: var(--pink);
}
.help-info-card__text {
margin: 0;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
.help-info-card__text ul {
margin: 0;
padding: 0 0 0 2rem;
}
.help-info-card__text *:not(:last-child) {
margin-bottom: 1rem;
}
@media (max-width: 576px) {
.help-info-card__text {
font-size: 1.6rem;
}
}
.help-reason-cards {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
margin: 3rem 0;
gap: 2rem;
}
@media (max-width: 576px) {
.help-reason-cards {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.help-reason-card {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
border-radius: 5rem;
padding: 6rem;
background-color: var(--grey1);
}
@media (max-width: 576px) {
.help-reason-card {
border-radius: 3rem;
padding: 4rem;
background-color: var(--white);
}
}
.help-reason-card__title {
margin: 0 0 3rem;
font-weight: 600;
font-size: 2rem;
line-height: 140%;
text-transform: uppercase;
color: var(--pink);
}
.help-reason-card__text {
margin: 0;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
.help-reason-card__text ul {
margin: 0;
padding: 0 0 0 2rem;
}
.help-reason-card__text *:not(:last-child) {
margin-bottom: 0.8rem;
}
.help-content {
border-radius: 5rem;
padding: 6rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
background-color: var(--white);
}
@media (max-width: 576px) {
.help-content {
border-radius: 0;
padding: 0;
background-color: unset;
}
}
.help-content > *:first-child {
margin-top: 0;
}
.help-content h2 {
margin: 6rem 0 2rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.6rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.help-content h2 {
margin: 4rem 0 3rem;
font-size: 2rem;
}
}
.help-content h2:first-child {
margin-top: 0;
}
.help-content h2:last-child {
margin-bottom: 0;
}
.help-content a {
text-decoration: underline;
color: inherit;
}
@media (any-hover: hover) {
.help-content a:hover {
text-decoration: none;
}
}
.help-faq {
display: -ms-grid;
display: grid;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
@media (max-width: 576px) {
.help-faq {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.help-faq__item {
overflow: hidden;
border-radius: 5rem;
padding: 4rem 6rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.help-faq__item {
border-radius: 3rem;
padding: 4rem 3rem;
}
}
.help-faq__item_open .help-faq__arrow {
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
}
.help-faq__trigger {
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%;
font-family: var(--font-family);
font-weight: 400;
font-size: 2rem;
line-height: 140%;
text-align: left;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
gap: 2rem;
}
@media (any-hover: hover) {
.help-faq__trigger:hover {
color: var(--pink);
}
}
.help-faq__trigger:focus-visible {
outline: none;
color: var(--pink-hover);
}
.help-faq__question {
min-width: 0;
font-weight: 500;
font-size: 2.2rem;
line-height: 120%;
}
.help-faq__arrow {
-ms-flex-negative: 0;
flex-shrink: 0;
width: 2rem;
height: 2rem;
fill: none;
stroke: currentcolor;
stroke-width: 2px;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
-webkit-transition: -webkit-transform 0.25s ease;
transition: -webkit-transform 0.25s ease;
transition: transform 0.25s ease;
transition: transform 0.25s ease, -webkit-transform 0.25s ease;
}
.help-faq__panel {
overflow: hidden;
max-height: 0;
-webkit-transition: max-height 0.35s ease;
transition: max-height 0.35s ease;
}
.help-faq__panel-inner {
padding-top: 3rem;
}
.help-faq__answer {
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
.help-faq__answer p {
margin: 0;
}
.help-faq__answer ol,
.help-faq__answer ul {
margin: 0;
padding-left: 2rem;
}
.help-faq__answer li:not(:last-child) {
margin-bottom: 0.8rem;
}
.modal_help-question {
padding: var(--container-offset);
}
.modal_help-question .modal__body {
overflow: hidden;
border-radius: 5rem;
padding: 0;
max-width: 160rem;
}
@media (max-width: 576px) {
.modal_help-question .modal__body {
border-radius: 3rem;
max-width: 100%;
}
}
.help-question-modal {
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: 82rem;
}
.help-question-modal__layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 0;
}
@media (max-width: 576px) {
.help-question-modal__layout {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-height: auto;
}
}
.help-question-modal__panel {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 8rem;
min-width: 0;
}
@media (max-width: 576px) {
.help-question-modal__panel {
padding: 5rem 4rem;
}
}
.help-question-modal__title {
margin: 0 0 4rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 5rem;
line-height: 110%;
text-transform: uppercase;
color: var(--pink);
}
@media (max-width: 576px) {
.help-question-modal__title {
margin-bottom: 2rem;
font-size: 3rem;
}
}
.help-question-modal__desc {
margin: 0 0 6rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.help-question-modal__desc {
margin-bottom: 3rem;
}
}
.help-question-modal__form {
display: -ms-grid;
display: grid;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
.help-question-modal__form .form__field-wrapper {
border-radius: 2.5rem;
}
.help-question-modal__submit {
margin-top: 1rem;
border-radius: 2.5rem;
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.help-question-modal__consent {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 1rem;
}
.help-question-modal__consent .checkbox__text {
font-weight: 300;
font-size: 1.6rem;
line-height: 140%;
}
.help-question-modal__consent .checkbox__text a {
text-decoration: underline;
color: inherit;
}
@media (any-hover: hover) {
.help-question-modal__consent .checkbox__text a:hover {
text-decoration: none;
}
}
.help-question-modal__visual {
position: relative;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
overflow: hidden;
background: radial-gradient(120% 80% at 50% 100%, rgba(240, 92, 168, 0.2), transparent 60%), -webkit-gradient(linear, left top, left bottom, from(#1a1a1a), to(#0a0a0a));
background: radial-gradient(120% 80% at 50% 100%, rgba(240, 92, 168, 0.2), transparent 60%), linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
}
.help-question-modal__visual img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
@media (max-width: 576px) {
.help-question-modal__visual {
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1;
border-radius: 3rem;
min-height: 22rem;
}
}
.help-question-modal__close {
position: absolute;
right: 4rem;
top: 4rem;
z-index: 2;
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;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--white);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
.help-question-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.help-question-modal__close:hover {
color: var(--pink);
}
}
@media (max-width: 576px) {
.help-question-modal__close {
right: 1.6rem;
top: 1.6rem;
}
}
.promo-card {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
overflow: hidden;
border-radius: 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.promo-card {
border-radius: 3rem;
}
}
.promo-card__img {
overflow: hidden;
border-radius: 5rem;
height: 30rem;
}
@media (max-width: 576px) {
.promo-card__img {
border-radius: 3rem;
height: 22rem;
}
}
.promo-card__img img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.promo-card__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 5rem;
}
@media (max-width: 576px) {
.promo-card__content {
padding: 3rem;
}
}
.promo-card__title {
margin: 0 0 2rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 120%;
letter-spacing: 0.05em;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.promo-card__title {
font-size: 2rem;
}
}
.promo-card__desc {
margin-bottom: 4rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
display: -webkit-box;
overflow: hidden;
text-overflow: ellipsis;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.promo-card__btn {
-ms-flex-item-align: start;
align-self: flex-start;
margin-top: auto;
width: 100%;
height: 5rem;
text-transform: lowercase;
}
.modal_promo {
padding: var(--container-offset);
}
.modal_promo .modal__body {
overflow: hidden;
border-radius: 5rem;
padding: 0;
max-width: 160rem;
}
@media (max-width: 576px) {
.modal_promo .modal__body {
border-radius: 3rem;
max-width: 100%;
}
}
.promo-modal {
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: 82rem;
}
@media (max-width: 576px) {
.promo-modal {
min-height: unset;
}
}
.promo-modal__layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 0;
}
@media (max-width: 576px) {
.promo-modal__layout {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-height: auto;
}
}
.promo-modal__panel {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 8rem;
min-width: 0;
}
@media (max-width: 576px) {
.promo-modal__panel {
padding: 5rem 4rem;
}
}
.promo-modal__title {
margin: 0 0 4rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 5rem;
line-height: 110%;
text-transform: uppercase;
color: var(--pink);
}
@media (max-width: 576px) {
.promo-modal__title {
margin-bottom: 2rem;
font-size: 3rem;
}
}
.promo-modal__desc {
margin: 0 0 5rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.promo-modal__desc {
margin-bottom: 3rem;
}
}
.promo-modal__form {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
margin-bottom: 4rem;
gap: 2rem;
}
.promo-modal__form .form__field-wrapper {
border-radius: 2.5rem;
}
.promo-modal__form[hidden] {
display: none;
}
.promo-modal__submit {
border-radius: 2.5rem;
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.promo-modal__action {
margin-bottom: 4rem;
}
.promo-modal__action[hidden] {
display: none;
}
.promo-modal__link {
border-radius: 2.5rem;
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.promo-modal__note {
margin: auto 0 0;
font-weight: 300;
font-size: 1.6rem;
line-height: 140%;
color: var(--grey4);
}
.promo-modal__note[hidden] {
display: none;
}
.promo-modal__visual {
position: relative;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
overflow: hidden;
background-color: var(--pink);
}
@media (max-width: 576px) {
.promo-modal__visual {
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1;
border-radius: 3rem;
min-height: 22rem;
}
}
.promo-modal__img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.promo-modal__close {
position: absolute;
right: 4rem;
top: 4rem;
z-index: 2;
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;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--white);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
.promo-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.promo-modal__close:hover {
color: var(--pink);
}
}
@media (max-width: 576px) {
.promo-modal__close {
right: 1.6rem;
top: 1.6rem;
}
}
.modal_callback {
padding: var(--container-offset);
}
.modal_callback .modal__body {
overflow: hidden;
border-radius: 5rem;
padding: 0;
max-width: 128.2rem;
width: 100%;
}
@media (max-width: 576px) {
.modal_callback .modal__body {
border-radius: 3rem;
max-width: 100%;
}
}
.callback-modal {
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: 61rem;
}
@media (max-width: 576px) {
.callback-modal {
min-height: unset;
}
}
.callback-modal__layout {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 0;
}
@media (max-width: 576px) {
.callback-modal__layout {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-height: auto;
}
}
.callback-modal__panel {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
padding: 8rem;
min-width: 0;
-webkit-box-ordinal-group: 2;
-ms-flex-order: 1;
order: 1;
}
@media (max-width: 576px) {
.callback-modal__panel {
padding: 5rem 4rem;
}
}
.callback-modal__title {
margin: 0 0 4rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 4rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.callback-modal__title {
margin-bottom: 2rem;
font-size: 3rem;
}
}
.callback-modal__form {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
margin-bottom: 0;
gap: 2rem;
}
.callback-modal__form .form__field-wrapper {
border-radius: 2.5rem;
}
.callback-modal__actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: end;
-ms-flex-pack: end;
justify-content: flex-end;
gap: 2rem;
margin-top: 2rem;
}
@media (max-width: 576px) {
.callback-modal__actions {
gap: 1.5rem;
}
}
.callback-modal__cancel, .callback-modal__submit {
-webkit-box-flex: 1;
-ms-flex: 1;
flex: 1;
border-radius: 2.5rem;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
@media (max-width: 576px) {
.callback-modal__cancel, .callback-modal__submit {
min-height: 5.4rem;
font-size: 1.8rem;
}
}
.callback-modal__visual {
position: relative;
-webkit-box-flex: 0;
-ms-flex: 0 0 auto;
flex: 0 0 auto;
overflow: hidden;
width: 49rem;
background: radial-gradient(120% 80% at 50% 100%, rgba(240, 92, 168, 0.2), transparent 60%), -webkit-gradient(linear, left top, left bottom, from(#1a1a1a), to(#0a0a0a));
background: radial-gradient(120% 80% at 50% 100%, rgba(240, 92, 168, 0.2), transparent 60%), linear-gradient(180deg, #1a1a1a 0%, #0a0a0a 100%);
}
@media (max-width: 576px) {
.callback-modal__visual {
border-radius: 3rem;
height: 35rem;
width: 100%;
}
}
.callback-modal__img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
-o-object-position: center top;
object-position: center top;
}
.callback-modal__close {
position: absolute;
right: 4rem;
top: 4rem;
z-index: 2;
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;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--white);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
.callback-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.callback-modal__close:hover {
color: var(--pink);
}
}
@media (max-width: 576px) {
.callback-modal__close {
right: 1.6rem;
top: 1.6rem;
}
}
.hero__container {
overflow: hidden;
border-radius: 5rem;
height: 73rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.hero__container {
border-radius: 3rem;
height: auto;
}
}
.hero__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;
padding: 8rem;
max-width: 100rem;
gap: 5rem;
}
@media (max-width: 576px) {
.hero__content {
padding: 4rem;
padding-bottom: 13.6rem;
gap: 2.6rem;
}
}
.hero__slide {
position: relative;
}
@media (max-width: 576px) {
.hero__slide {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
}
.hero__subtitle {
max-width: 37rem;
}
.hero__btn {
width: 100%;
max-width: 49rem;
}
.hero__img {
position: absolute;
right: 0;
top: 0;
z-index: -1;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/hero/hero-mask.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/hero/hero-mask.svg);
-webkit-mask-position: left;
mask-position: left;
-webkit-mask-size: auto 100%;
mask-size: auto 100%;
width: auto;
height: 100%;
}
@media (max-width: 576px) {
.hero__img {
position: static;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/hero/hero-mask-mob.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/hero/hero-mask-mob.svg);
-webkit-mask-position: bottom;
mask-position: bottom;
-webkit-mask-size: 100% 100%;
mask-size: 100% 100%;
height: 42rem;
}
}
.hero__img img {
width: auto;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
@media (max-width: 576px) {
.hero__img img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
}
.hero__thumbs {
position: absolute;
left: 8rem;
bottom: 8rem;
z-index: 7;
max-width: 100rem;
}
@media (max-width: 576px) {
.hero__thumbs {
left: 4rem;
right: 4rem;
bottom: 4rem;
max-width: 100%;
}
}
.hero__thumbs .swiper-wrapper {
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
}
@media (max-width: 576px) {
.hero__thumbs .swiper-wrapper {
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
}
.hero__thumbs .swiper-slide {
width: auto;
}
.hero__thumbs .swiper-slide-thumb-active .hero__thumb {
width: 6rem;
}
.hero__thumbs .swiper-slide-thumb-active .hero__thumb::after {
opacity: 1;
}
.hero__thumb {
position: relative;
display: block;
overflow: hidden;
border-radius: 2rem;
width: 5.3rem;
aspect-ratio: 1/1;
}
.hero__thumb img {
display: block;
width: 100%;
height: 100%;
}
.hero__thumb::after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 0.5rem;
background-color: var(--pink);
opacity: 0;
-webkit-transform: scaleX(var(--hero-thumb-progress, 0));
-ms-transform: scaleX(var(--hero-thumb-progress, 0));
transform: scaleX(var(--hero-thumb-progress, 0));
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
will-change: transform;
}
.cats {
overflow: hidden;
}
.cats__header {
margin-bottom: 5rem;
}
@media (max-width: 576px) {
.cats__header {
margin-bottom: 4rem;
}
}
.cats__slider {
overflow: visible;
}
.cats__item {
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;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
border-radius: 5rem;
padding-top: 4rem;
padding-bottom: 4rem;
width: 40rem;
height: 40rem;
background-color: var(--white);
gap: 3rem;
}
@media (max-width: 576px) {
.cats__item {
padding: 5rem;
width: 30rem;
height: auto;
gap: 0;
}
}
.cats__item img {
display: block;
width: 100%;
height: 25.4rem;
-o-object-fit: contain;
object-fit: contain;
}
@media (max-width: 576px) {
.cats__item img {
height: 24rem;
-o-object-position: top;
object-position: top;
}
}
.cats__item span {
display: block;
-webkit-transition: color 0.3s ease-in;
transition: color 0.3s ease-in;
}
@media (max-width: 576px) {
.cats__item span {
margin-top: -4rem;
font-size: 1.6rem;
}
}
@media (any-hover: hover) {
.cats__item:hover span {
color: var(--pink);
}
}
.cats__item:focus-visible {
outline: none;
}
.cats__item:focus-visible span {
color: var(--pink);
}
.cats__item:active span {
color: var(--pink);
}
.benefits__container {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
gap: 3rem;
}
@media (max-width: 576px) {
.benefits__container {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
}
.benefits__item {
min-height: 38rem;
}
@media (max-width: 576px) {
.benefits__item {
min-height: 22.6rem;
}
}
.benefit {
position: relative;
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: end;
-ms-flex-pack: end;
justify-content: flex-end;
overflow: hidden;
border-radius: 5rem;
padding: 6rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.benefit {
border-radius: 3rem;
padding: 3.4rem;
}
}
.benefit__img {
position: absolute;
right: 0;
top: 0;
z-index: -1;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/benefits/mask.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/benefits/mask.svg);
-webkit-mask-position: left;
mask-position: left;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: auto 100%;
mask-size: auto 100%;
width: 80%;
height: 100%;
}
@media (max-width: 576px) {
.benefit__img {
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/benefits/mask-mob.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/benefits/mask-mob.svg);
}
}
.benefit__img img {
display: block;
width: auto;
height: 100%;
-o-object-position: right;
object-position: right;
}
.benefit__content {
max-width: 28.5rem;
}
@media (max-width: 576px) {
.benefit__content {
max-width: 20rem;
}
}
.benefit__title {
margin-bottom: 2.4rem;
}
.about-section__container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 6rem;
}
@media (max-width: 576px) {
.about-section__container {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
gap: 5rem;
}
}
.about-section__content {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-negative: 0;
flex-shrink: 0;
-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: 93.5rem;
gap: 5rem;
}
@media (max-width: 576px) {
.about-section__content {
gap: 4rem;
}
}
.about-section__img {
position: relative;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
overflow: hidden;
border-radius: 7rem;
min-height: 80rem;
}
@media (max-width: 576px) {
.about-section__img {
border-radius: 3rem;
width: 100%;
min-height: 53.5rem;
}
}
.about-section__img img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.about-section__btn {
width: 100%;
max-width: 41rem;
}
@media (max-width: 576px) {
.about-section__btn {
max-width: 100%;
}
}
.brands__title {
margin-bottom: 5rem;
}
@media (max-width: 576px) {
.brands__title {
margin-bottom: 4rem;
}
}
.brands__container {
display: -ms-grid;
display: grid;
-ms-grid-columns: (1fr)[3];
grid-template-columns: repeat(3, 1fr);
gap: 3rem;
}
@media (max-width: 576px) {
.brands__container {
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
gap: 2rem;
}
}
.brands__item {
overflow: hidden;
border-radius: 5rem;
padding: 0 7.2rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.brands__item {
border-radius: 3rem;
padding: 0 2.8rem;
}
}
.products {
overflow: hidden;
}
.products__header {
margin-bottom: 5rem;
}
@media (max-width: 576px) {
.products__header {
margin-bottom: 4rem;
}
}
.products__slider {
overflow: visible;
}
.blog-section__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: 5rem;
gap: 2rem;
}
.blog-section__container {
display: -ms-grid;
display: grid;
-ms-grid-columns: (1fr)[3];
grid-template-columns: repeat(3, 1fr);
gap: 3rem;
}
@media (max-width: 576px) {
.blog-section__container {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
margin-bottom: 4rem;
gap: 2rem;
}
}
.blog-section__btn {
width: 100%;
max-width: 35rem;
}
@media (max-width: 576px) {
.blog-section__btn {
max-width: 100%;
}
}
.catalog__top {
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;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-bottom: 3rem;
gap: 2rem;
}
.catalog__header {
margin-bottom: 5rem;
}
.catalog__grid {
display: -ms-grid;
display: grid;
-ms-grid-columns: (1fr)[4];
grid-template-columns: repeat(4, 1fr);
gap: 3rem;
}
@media (max-width: 576px) {
.catalog__grid {
-ms-grid-columns: (1fr)[2];
grid-template-columns: repeat(2, 1fr);
gap: 2rem;
}
}
@media (max-width: 576px) {
.catalog__grid .product-card {
width: auto;
padding: 3rem;
}
.catalog__grid .product-card__title {
font-size: 1.6rem;
margin-bottom: 1.5rem;
}
.catalog__grid .product-card__stock {
font-size: 1.4rem;
}
.catalog__grid .product-card__rating.rating {
gap: 0.4rem;
}
.catalog__grid .product-card__rating.rating svg {
width: 1.4rem;
height: 1.4rem;
}
.catalog__grid .product-card__info {
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
margin-bottom: 1.5rem;
}
.catalog__grid .product-card__price {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
.catalog__grid .product-card__price span {
font-size: 1.2rem;
}
.catalog__grid .product-card__price div {
font-size: 1.6rem;
}
.catalog__grid .product-card__discount {
font-size: 1.4rem;
}
}
.catalog__more {
margin-top: 4rem;
width: 100%;
}
@media (max-width: 576px) {
.catalog__actions {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
width: 100%;
}
}
.product__container {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
gap: 4rem;
}
@media (max-width: 576px) {
.product__container {
position: relative;
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
}
.about-hero__container {
position: relative;
z-index: 3;
overflow: hidden;
border-radius: 5rem;
padding: 8rem;
height: 81rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.about-hero__container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 3rem;
padding: 0;
height: auto;
}
}
.about-hero__title span {
color: var(--pink);
}
@media (max-width: 576px) {
.about-hero__title {
font-size: 3.4rem;
}
}
.about-hero__img {
position: absolute;
right: 0;
top: 0;
z-index: -1;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/about/hero-mask.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/about/hero-mask.svg);
-webkit-mask-position: left;
mask-position: left;
-webkit-mask-repeat: no-repeat;
mask-repeat: no-repeat;
-webkit-mask-size: auto 100%;
mask-size: auto 100%;
width: auto;
height: 100%;
}
@media (max-width: 576px) {
.about-hero__img {
position: static;
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1;
-webkit-mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/hero/hero-mask-mob.svg);
mask-image: url(https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/.https://sexyfonlove.ru/wp-content/themes/sexyphone/assets/css/img/hero/hero-mask-mob.svg);
-webkit-mask-position: bottom;
mask-position: bottom;
-webkit-mask-size: 100% 100%;
mask-size: 100% 100%;
height: 42rem;
}
}
.about-hero__img img {
width: auto;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}
@media (max-width: 576px) {
.about-hero__img img {
width: 100%;
-o-object-fit: cover;
object-fit: cover;
}
}
.about-hero__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;
max-width: 93rem;
gap: 5rem;
}
@media (max-width: 576px) {
.about-hero__content {
padding: 4rem;
gap: 2.6rem;
}
}
.about-hero__desc {
max-width: 51rem;
font-weight: 500;
}
.about-hero__desc span {
color: var(--pink);
}
.about-benefits__title {
margin-bottom: 6rem;
}
@media (max-width: 576px) {
.about-benefits__title {
margin-bottom: 4rem;
}
}
.about-benefits__item:not(:last-child) {
margin-bottom: 4rem;
}
.about-benefits__item:nth-child(even) {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
@media (max-width: 576px) {
.about-benefits__item:nth-child(even) {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.placement__container {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
gap: 4rem;
}
@media (max-width: 576px) {
.placement__container {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
}
.placement__title {
margin-bottom: 6rem;
}
@media (max-width: 576px) {
.placement__title {
margin-bottom: 4rem;
}
}
.reasons {
overflow: hidden;
}
.reasons__title {
margin-bottom: 6rem;
}
.reasons__slider {
overflow: visible;
cursor: -webkit-grab;
cursor: grab;
}
.reasons__item {
border-radius: 5rem;
padding: 5.5rem 6rem;
width: 50rem;
min-height: 64.2rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.reasons__item {
border-radius: 3rem;
padding: 5rem 4rem;
min-height: 50rem;
}
}
.reasons__item-header {
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;
margin-bottom: 4rem;
}
.reasons__item-title {
font-size: 2.6rem;
}
@media (max-width: 576px) {
.reasons__item-title {
font-size: 2.2rem;
}
}
.reasons__item-fig {
font-size: 2.6rem;
color: var(--pink);
}
@media (max-width: 576px) {
.reasons__item-fig {
font-size: 2.2rem;
}
}
.blog__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: 5rem;
gap: 3rem;
}
@media (max-width: 576px) {
.blog__header {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
}
.blog__dropdown {
max-width: 30rem;
}
@media (max-width: 576px) {
.blog__dropdown {
max-width: 100%;
}
}
.blog__grid {
display: -ms-grid;
display: grid;
-ms-grid-columns: (1fr)[3];
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
@media (max-width: 576px) {
.blog__grid {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
}
.blog__more {
margin-top: 5rem;
width: 100%;
}
.single__top {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
overflow: hidden;
margin-bottom: 6rem;
border-radius: 5rem;
min-height: 60rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.single__top {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin-bottom: 10rem;
border-radius: 3rem;
min-height: unset;
}
}
.single__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-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
padding: 8rem 6rem;
gap: 3rem;
}
@media (max-width: 576px) {
.single__content {
padding: 5rem 4rem;
gap: 4rem;
}
}
.single__title {
margin-bottom: 2rem;
color: var(--pink);
}
@media (max-width: 576px) {
.single__title {
margin-bottom: 2.4rem;
font-size: 3.4rem;
}
}
.single__desc {
font-size: 2.2rem;
}
.single__img {
position: relative;
-ms-flex-negative: 0;
flex-shrink: 0;
overflow: hidden;
border-radius: 5rem;
width: 100%;
max-width: 90rem;
}
@media (max-width: 576px) {
.single__img {
border-radius: 3rem;
height: 34rem;
max-width: 100%;
}
}
.single__img img {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
}
.single__meta {
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;
}
.single__total {
margin-top: 6rem;
border-radius: 5rem;
padding: 8rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.single__total {
margin-top: 4rem;
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.single__conc {
margin-bottom: 3rem;
font-size: 3rem;
color: var(--pink);
}
.article-content {
border-radius: 5rem;
padding: 8rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
background-color: var(--white);
}
.article-content__wrapper {
margin: 0 auto;
max-width: 128rem;
}
@media (max-width: 576px) {
.article-content {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.article-content > *:first-child {
margin-top: 0;
}
.article-content h2 {
margin: 6rem 0 3rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.6rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.article-content h2 {
margin: 4rem 0 3rem;
font-size: 2rem;
}
}
.article-content h2:first-child {
margin-top: 0;
}
.article-content h2:last-child {
margin-bottom: 0;
}
.article-content p {
margin: 0 0 2.4rem;
}
.article-content ul {
list-style: none;
margin: 0 0 3rem;
padding: 0;
}
.article-content ul li {
position: relative;
}
.article-content blockquote {
margin: 6rem 0;
border-radius: 5rem;
padding: 5rem;
font-weight: 500;
font-size: 2rem;
line-height: 1.5;
color: #fff;
background: #000;
}
.article-content blockquote * {
margin-top: 0;
margin-bottom: 0;
font-weight: inherit;
color: inherit;
}
.article-content blockquote *:not(:last-child) {
margin-bottom: 1em;
}
@media (max-width: 576px) {
.article-content blockquote {
margin: 4rem 0;
border-radius: 3rem;
}
}
.article-content strong {
font-weight: 700;
}
.article-content a {
text-decoration: underline;
color: inherit;
}
.article-content a:hover {
text-decoration: none;
}
.cart__layout {
display: -ms-grid;
display: grid;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
-ms-grid-columns: minmax(0, 1fr) 61rem;
grid-template-columns: minmax(0, 1fr) 61rem;
gap: 3rem;
}
@media (max-width: 576px) {
.cart__layout {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.cart__title {
margin-bottom: 3rem;
}
.cart__count {
top: -0.1em;
vertical-align: super;
margin-left: 0.4rem;
font-weight: 500;
line-height: 1.1;
letter-spacing: normal;
text-transform: none;
}
.cart__sidebar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 0;
}
@media (max-width: 576px) {
.cart__sidebar {
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1;
}
}
.cart-toolbar {
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: 2rem;
border-radius: 5rem;
padding: 2.4rem 5rem;
background-color: var(--white);
gap: 2rem;
}
@media (max-width: 576px) {
.cart-toolbar {
border-radius: 2rem;
padding: 2.6rem 4rem;
}
}
.cart-toolbar__remove {
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;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
color: var(--black);
-webkit-transition: color 0.2s ease, background-color 0.2s ease;
transition: color 0.2s ease, background-color 0.2s ease;
}
.cart-toolbar__remove svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.cart-toolbar__remove:hover {
color: var(--pink);
background-color: var(--grey1);
}
}
.cart-toolbar__remove:focus-visible {
outline: 0.2rem solid var(--pink);
outline-offset: 0.2rem;
}
.cart-items {
border-radius: 5rem;
padding: 0 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.cart-items {
border-radius: 3rem;
padding: 0 4rem;
}
}
.checkbox_muted .checkbox__text {
font-family: var(--font-family);
font-size: 2rem;
line-height: 150%;
text-transform: lowercase;
color: var(--black);
}
.checkout__title {
margin-bottom: 3rem;
}
.checkout__form {
min-width: 0;
}
.checkout__layout {
display: -ms-grid;
display: grid;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
-ms-grid-columns: minmax(0, 1fr) 61rem;
grid-template-columns: minmax(0, 1fr) 61rem;
min-width: 0;
gap: 3rem;
}
@media (max-width: 576px) {
.checkout__layout {
-ms-grid-columns: minmax(0, 1fr);
grid-template-columns: minmax(0, 1fr);
}
}
.checkout__main {
min-width: 0;
}
.checkout__sidebar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
min-width: 0;
gap: 2rem;
}
@media (max-width: 576px) {
.checkout__sidebar {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
}
}
.checkout-form {
display: block;
}
.checkout-form_single {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
.checkout-form wc-order-attribution-inputs {
position: absolute;
left: 0;
top: 0;
overflow: hidden;
width: 1px;
height: 1px;
opacity: 0;
pointer-events: none;
}
.checkout-form .woocommerce-billing-fields__field-wrapper {
display: -ms-grid;
display: grid;
-ms-grid-columns: (1fr)[2];
grid-template-columns: repeat(2, 1fr);
gap: 2rem;
}
@media (max-width: 576px) {
.checkout-form .woocommerce-billing-fields__field-wrapper {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
}
}
.checkout-section {
overflow: hidden;
border-radius: 5rem;
padding: 4rem 5rem;
min-width: 0;
background-color: var(--white);
}
.checkout-section:not(:last-child) {
margin-bottom: 2rem;
}
@media (max-width: 576px) {
.checkout-section {
border-radius: 3rem;
padding: 4rem;
}
}
.checkout-section__header {
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;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-bottom: 3rem;
gap: 2rem;
}
@media (max-width: 576px) {
.checkout-section__header {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
margin-bottom: 2rem;
}
}
.checkout-section__title {
margin: 0;
font-family: var(--font-family);
font-weight: 600;
font-size: 3rem;
line-height: 110%;
text-transform: lowercase;
color: var(--black);
}
@media (max-width: 576px) {
.checkout-section__title {
font-size: 2.6rem;
}
}
.checkout-section__title-note {
color: var(--grey3);
}
.checkout-section_notes .checkout-section__title {
margin-bottom: 3rem;
}
.checkout-section__meta {
margin: 0;
font-weight: 500;
font-size: 2rem;
line-height: 130%;
color: var(--grey3);
}
.checkout-section__meta span {
color: var(--black);
}
.checkout-section__checkbox {
-ms-flex-negative: 0;
flex-shrink: 0;
}
.checkout-section__checkbox .checkbox__text {
font-size: 1.8rem;
white-space: nowrap;
text-transform: lowercase;
}
.profile__title {
margin-bottom: 3rem;
}
.profile__layout {
position: relative;
display: -ms-grid;
display: grid;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
-ms-grid-columns: 42rem minmax(0, 1fr);
grid-template-columns: 42rem minmax(0, 1fr);
min-width: 0;
gap: 4rem;
}
@media (max-width: 576px) {
.profile__layout {
-ms-grid-columns: minmax(0, 1fr);
grid-template-columns: minmax(0, 1fr);
gap: 2rem;
}
}
.profile__sidebar {
border-radius: 5rem;
padding: 5rem;
min-width: 0;
background-color: var(--white);
}
@media (max-width: 576px) {
.profile__sidebar {
border-radius: 3rem;
padding: 4rem;
}
}
.profile__content {
min-width: 0;
}
.profile-section:not(:last-child) {
margin-bottom: 4rem;
}
.profile-section__head {
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;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-bottom: 3rem;
gap: 2rem;
}
.profile-section__title {
margin: 0 0 4rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 3rem;
text-transform: uppercase;
color: var(--black);
}
.profile-section__head .profile-section__title {
margin-bottom: 0;
}
@media (max-width: 576px) {
.profile-section__title {
max-width: 39rem;
}
}
.profile-section__action {
border-radius: 1.5rem;
padding: 1rem 2.4rem;
width: 100%;
min-height: 5rem;
max-width: 37.5rem;
font-size: 1.8rem;
white-space: nowrap;
}
@media (max-width: 576px) {
.profile-section__action {
max-width: 100%;
}
}
.profile-slider {
overflow: hidden;
width: 100%;
min-width: 0;
max-width: 100%;
}
@media (max-width: 576px) {
.profile-slider {
overflow: visible;
}
}
.profile-favorites {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[3];
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 2rem;
}
@media (max-width: 576px) {
.profile-favorites {
-ms-grid-columns: 1fr 1fr;
grid-template-columns: 1fr 1fr;
}
}
.profile-favorites .product-card {
width: 100%;
}
.profile-addresses {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[2];
grid-template-columns: repeat(2, minmax(0, 1fr));
gap: 2rem;
}
@media (max-width: 576px) {
.profile-addresses {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.profile-payments {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[3];
grid-template-columns: repeat(3, minmax(0, 1fr));
gap: 2rem;
}
@media (max-width: 576px) {
.profile-payments {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.profile-orders {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 2rem;
}
.help__title {
margin-bottom: 4rem;
}
.help__intro {
margin: 0 0 5rem;
font-weight: 400;
font-size: 2.2rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.help__intro {
margin-bottom: 3rem;
font-size: 1.8rem;
}
}
.help__categories {
display: -ms-grid;
display: grid;
-ms-grid-columns: (minmax(0, 1fr))[4];
grid-template-columns: repeat(4, minmax(0, 1fr));
gap: 2rem;
}
@media (max-width: 576px) {
.help__categories {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.help__layout {
display: -ms-grid;
display: grid;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: start;
-ms-grid-columns: 28.8rem minmax(0, 1fr);
grid-template-columns: 28.8rem minmax(0, 1fr);
min-width: 0;
gap: 3rem;
}
@media (max-width: 576px) {
.help__layout {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
}
.help__sidebar {
border-radius: 5rem;
padding: 5rem;
min-width: 0;
background-color: var(--white);
}
@media (max-width: 576px) {
.help__sidebar {
display: none;
}
}
.help__content {
min-width: 0;
}
.help__note {
margin: 6rem 0 0;
font-weight: 500;
font-size: 2.2rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.help__note {
margin-top: 4rem;
}
}
.order-view__layout {
display: -ms-grid;
display: grid;
-ms-grid-columns: minmax(0, 1fr) 61rem;
grid-template-columns: minmax(0, 1fr) 61rem;
min-width: 0;
gap: 4rem;
}
@media (max-width: 576px) {
.order-view__layout {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
}
.order-view__main, .order-view__sidebar {
min-width: 0;
}
.order-view__sidebar {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 2rem;
}
.order-view__card {
border-radius: 5rem;
padding: 5rem;
height: 100%;
background-color: var(--white);
}
@media (max-width: 576px) {
.order-view__card {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.order-view__head {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin-bottom: 5rem;
gap: 5rem;
}
.order-view__title {
margin: 0;
}
.order-view__meta {
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: 576px) {
.order-view__meta {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
gap: 3rem;
}
}
.order-view__status {
font-weight: 600;
font-size: 2.8rem;
color: var(--black);
}
.order-view__delivery {
margin: 0;
font-weight: 400;
font-size: 2rem;
line-height: 120%;
text-align: right;
color: var(--black);
}
.order-view__delivery span {
display: block;
margin-bottom: 0.4rem;
font-size: 1.6rem;
line-height: 1;
color: var(--grey3);
}
@media (max-width: 576px) {
.order-view__delivery {
text-align: left;
}
}
.order-view__items {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 5rem;
}
@media (max-width: 576px) {
.order-view__items {
gap: 4rem;
}
}
.order-view-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
gap: 2rem;
}
@media (max-width: 576px) {
.order-view-item {
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
}
}
.order-view-item__thumb {
display: block;
-ms-flex-negative: 0;
flex-shrink: 0;
overflow: hidden;
width: 15rem;
height: 15rem;
background-color: var(--grey3);
}
.order-view-item__thumb img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.order-view-item__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
min-width: 0;
gap: 2rem;
}
@media (max-width: 576px) {
.order-view-item__body {
-ms-flex-preferred-size: 26rem;
flex-basis: 26rem;
}
}
.order-view-item__title {
max-width: 52rem;
font-family: var(--font-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 120%;
text-transform: initial;
color: var(--black);
}
@media (max-width: 576px) {
.order-view-item__title {
font-size: 2rem;
}
}
.order-view-item__title a {
text-decoration: none;
color: inherit;
}
@media (any-hover: hover) {
.order-view-item__title a:hover {
color: var(--pink);
}
}
.order-view-item__footer {
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;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-ordinal-group: 6;
-ms-flex-order: 5;
order: 5;
margin-top: auto;
width: 100%;
max-width: 52rem;
gap: 2rem;
}
.order-view-item__price {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin-left: auto;
}
@media (max-width: 576px) {
.order-view-item__price {
-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;
-webkit-box-ordinal-group: 0;
-ms-flex-order: -1;
order: -1;
margin-left: unset;
gap: 1rem;
}
}
.order-view-item__price-current {
margin-bottom: 1rem;
font-weight: 600;
font-size: 3rem;
color: var(--black);
}
@media (max-width: 576px) {
.order-view-item__price-current {
margin-bottom: 0;
font-size: 2.6rem;
}
}
.order-view-item__price-discount {
font-weight: 500;
font-size: 1.8rem;
line-height: 1;
color: var(--grey3);
}
.order-view-item__actions {
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;
gap: 1rem;
}
@media (max-width: 576px) {
.order-view-item__actions {
-webkit-box-orient: horizontal;
-webkit-box-direction: reverse;
-ms-flex-direction: row-reverse;
flex-direction: row-reverse;
}
}
.order-view-item__cart {
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
min-width: 16rem;
}
@media (max-width: 576px) {
.order-view-item__cart {
height: 5rem;
min-width: unset;
}
}
.order-view-item__like {
width: 4rem;
height: 4rem;
}
@media (max-width: 576px) {
.order-view-item__like {
width: 5rem;
height: 5rem;
}
}
.order-view-item__like svg {
width: 1.6rem;
height: 1.6rem;
}
.order-view-summary {
border-radius: 5rem;
padding: 5rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.order-view-summary {
border-radius: 3rem;
padding: 3rem;
}
}
.order-view-summary__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: 3rem;
gap: 1rem;
}
.order-view-summary__title {
margin: 0;
font-family: var(--font-family);
font-weight: 600;
font-size: 3rem;
text-transform: initial;
color: var(--black);
}
.order-view-summary__count {
font-size: 1.8rem;
line-height: 1;
color: var(--grey4);
}
.order-view-summary__details {
margin: 0 0 3rem;
}
.order-view-summary__row {
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: 1.8rem;
gap: 2rem;
}
.order-view-summary__row:not(:last-child) {
margin-bottom: 2rem;
}
.order-view-summary__row dt,
.order-view-summary__row dd {
margin: 0;
}
.order-view-summary__row dt {
color: var(--grey4);
}
.order-view-summary__row dd {
font-weight: 500;
white-space: nowrap;
}
.order-view-summary__row_discount dd {
color: var(--pink);
}
.order-view-summary__total {
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;
margin-bottom: 3rem;
gap: 2rem;
}
.order-view-summary__total-label {
font-weight: 500;
font-size: 3.2rem;
color: var(--grey4);
}
.order-view-summary__total-value {
font-weight: 600;
font-size: 3rem;
color: var(--black);
}
.order-view-summary__repeat {
width: 100%;
min-height: 6rem;
}
.order-view-actions {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
border-radius: 5rem;
padding: 5rem;
background-color: var(--white);
gap: 1rem;
}
@media (max-width: 576px) {
.order-view-actions {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.order-view-actions__btn {
border-radius: 1.5rem;
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
letter-spacing: 0.05em;
text-transform: lowercase;
}
.order-return__layout {
display: -ms-grid;
display: grid;
-ms-grid-columns: minmax(0, 1fr) 61rem;
grid-template-columns: minmax(0, 1fr) 61rem;
min-width: 0;
gap: 4rem;
}
@media (max-width: 576px) {
.order-return__layout {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
}
.order-return__products, .order-return__form-wrap {
border-radius: 5rem;
padding: 5rem;
min-width: 0;
background-color: var(--white);
}
@media (max-width: 576px) {
.order-return__products, .order-return__form-wrap {
border-radius: 3rem;
padding: 4rem 3rem;
}
}
.order-return__title {
margin: 0 0 4rem;
}
.order-return__form-title {
margin: 0 0 4rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 110%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.order-return__form-title {
margin-bottom: 3rem;
font-size: 2rem;
}
}
.order-return__list {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 5rem;
}
.order-return-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-align: center;
-ms-flex-align: center;
align-items: center;
gap: 2rem;
}
.order-return-item__checkbox {
position: absolute;
left: 0;
top: 0;
}
@media (max-width: 576px) {
.order-return-item__checkbox {
grid-area: checkbox;
}
}
.order-return-item__thumb {
position: relative;
display: block;
-ms-flex-negative: 0;
flex-shrink: 0;
width: 15rem;
height: 15rem;
background-color: var(--grey1);
}
.order-return-item__thumb img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: cover;
object-fit: cover;
}
.order-return-item__body {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-flex: 1;
-ms-flex-positive: 1;
flex-grow: 1;
-webkit-box-align: start;
-ms-flex-align: start;
align-items: flex-start;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
min-width: 0;
}
@media (max-width: 576px) {
.order-return-item__body {
-webkit-box-orient: vertical;
-webkit-box-direction: reverse;
-ms-flex-direction: column-reverse;
flex-direction: column-reverse;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
gap: 2rem;
}
}
.order-return-item__title {
margin: 0;
max-width: 52rem;
font-family: var(--font-family);
font-weight: 400;
font-size: 2.4rem;
line-height: 150%;
letter-spacing: normal;
text-transform: initial;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
@media (max-width: 576px) {
.order-return-item__title {
font-size: 1.6rem;
}
}
.order-return-item__title a {
text-decoration: none;
color: inherit;
}
@media (any-hover: hover) {
.order-return-item__title:hover {
color: var(--pink);
}
}
.order-return-item__price {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
margin-left: auto;
gap: 0.4rem;
}
@media (max-width: 576px) {
.order-return-item__price {
-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;
margin-left: unset;
gap: 1rem;
}
}
.order-return-item__price-current {
font-weight: 600;
font-size: 3rem;
line-height: 1.1;
color: var(--black);
}
@media (max-width: 576px) {
.order-return-item__price-current {
font-size: 2.6rem;
}
}
.order-return-item__price-old {
font-size: 1.8rem;
line-height: 1;
text-decoration: line-through;
color: var(--grey4);
}
.order-return-form {
display: -ms-grid;
display: grid;
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
.order-return-form .form__field-wrapper {
border-radius: 2.5rem;
}
.order-return-form__submit {
width: 100%;
min-height: 6rem;
}
.modal_order-return-success {
padding: var(--container-offset);
}
.modal_order-return-success .modal__body {
border-radius: 5rem;
padding: 8rem;
width: 100%;
max-width: 76rem;
text-align: left;
}
@media (max-width: 576px) {
.modal_order-return-success .modal__body {
padding: 5rem 4rem;
}
}
.order-return-success-modal {
position: relative;
}
.order-return-success-modal__close {
position: absolute;
right: 8rem;
top: 8rem;
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;
border-radius: 1.5rem;
width: 5rem;
height: 5rem;
color: var(--black);
background-color: var(--grey1);
-webkit-transition: color 0.15s ease-in;
transition: color 0.15s ease-in;
}
@media (max-width: 576px) {
.order-return-success-modal__close {
right: 5rem;
top: 5rem;
}
}
.order-return-success-modal__close svg {
display: block;
width: 2rem;
height: 2rem;
fill: currentcolor;
}
@media (any-hover: hover) {
.order-return-success-modal__close:hover {
color: var(--pink);
}
}
.order-return-success-modal__title {
margin: 0 0 6rem;
font-family: var(--second-family);
font-weight: 400;
font-size: 4rem;
line-height: 120%;
text-transform: uppercase;
color: var(--black);
}
@media (max-width: 576px) {
.order-return-success-modal__title {
margin-bottom: 4rem;
font-size: 3rem;
}
}
.order-return-success-modal__text {
margin: 0 0 6rem;
font-weight: 400;
font-size: 2.4rem;
line-height: 120%;
color: var(--black);
}
@media (max-width: 576px) {
.order-return-success-modal__text {
margin-bottom: 4rem;
}
}
.order-return-success-modal__btn {
border-radius: 1.5rem;
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.promotions__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: 5rem;
gap: 3rem;
}
@media (max-width: 576px) {
.promotions__header {
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
-webkit-box-align: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
}
.promotions__title {
margin: 0;
text-transform: uppercase;
}
.promotions__dropdown {
max-width: 30rem;
}
@media (max-width: 576px) {
.promotions__dropdown {
max-width: 100%;
}
}
.promotions__grid {
display: -ms-grid;
display: grid;
-ms-grid-columns: (1fr)[3];
grid-template-columns: repeat(3, 1fr);
gap: 4rem;
}
@media (max-width: 576px) {
.promotions__grid {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
gap: 2rem;
}
}
.promotions__more {
margin-top: 5rem;
width: 100%;
text-transform: lowercase;
}
.auth__container {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: center;
-ms-flex-pack: center;
justify-content: center;
}
.auth-card {
border-radius: 5rem;
padding: 6rem 5rem;
width: 100%;
max-width: 56rem;
background-color: var(--white);
}
@media (max-width: 576px) {
.auth-card {
border-radius: 3rem;
padding: 5rem 4rem;
}
}
.auth-card__title {
margin: 0 0 2rem;
font-size: 3.2rem;
text-transform: uppercase;
}
.auth-card__desc {
margin: 0 0 4rem;
font-weight: 300;
font-size: 2rem;
line-height: 150%;
color: var(--black);
}
@media (max-width: 576px) {
.auth-card__desc {
margin-bottom: 3rem;
font-size: 1.8rem;
}
}
.auth-card__form {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-webkit-box-orient: vertical;
-webkit-box-direction: normal;
-ms-flex-direction: column;
flex-direction: column;
gap: 2rem;
}
.auth-card__form.form {
-ms-grid-columns: 1fr;
grid-template-columns: 1fr;
}
.auth-card__form .form__field-wrapper {
border-radius: 2.5rem;
}
.auth-card__meta {
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;
-webkit-box-pack: justify;
-ms-flex-pack: justify;
justify-content: space-between;
margin-top: -0.5rem;
gap: 2rem;
}
.auth-card__remember .checkbox__text {
font-weight: 300;
font-size: 1.6rem;
line-height: 140%;
}
.auth-card__link {
font-weight: 400;
font-size: 1.6rem;
line-height: 140%;
text-decoration: underline;
text-transform: lowercase;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
@media (any-hover: hover) {
.auth-card__link:hover {
color: var(--pink);
}
}
.auth-card__consent .checkbox__text {
font-weight: 300;
font-size: 1.6rem;
line-height: 140%;
}
.auth-card__consent .checkbox__text a {
text-decoration: underline;
color: inherit;
}
@media (any-hover: hover) {
.auth-card__consent .checkbox__text a:hover {
color: var(--pink);
}
}
.auth-card__submit {
margin-top: 1rem;
border-radius: 2.5rem;
width: 100%;
min-height: 6rem;
font-family: var(--font-family);
font-weight: 500;
font-size: 2rem;
text-transform: lowercase;
}
.auth-card__switch {
margin: 3rem 0 0;
font-weight: 300;
font-size: 1.8rem;
line-height: 150%;
text-align: center;
color: var(--grey4);
}
.auth-card__switch a {
font-weight: 400;
text-decoration: underline;
color: var(--black);
-webkit-transition: color 0.2s ease;
transition: color 0.2s ease;
}
@media (any-hover: hover) {
.auth-card__switch a:hover {
color: var(--pink);
}
}
.hide {
display: none;
}
.show {
display: inherit;
}
.mob-show {
display: none;
}
@media (max-width: 576px) {
.mob-show {
display: -webkit-inline-box;
display: -ms-inline-flexbox;
display: inline-flex;
}
}
@media (max-width: 576px) {
.mob-hide {
display: none;
}
}
.peremena {
-webkit-box-shadow: 0 1px 60px 0 rgba(0, 0, 0, 0.1);
box-shadow: 0 1px 60px 0 rgba(0, 0, 0, 0.1);
width: 21rem;
height: 11rem;
margin-left: auto;
padding: 2rem;
}
@media (max-width: 576px) {
.peremena {
margin: 0 auto;
}
}
.peremena img {
display: block;
width: 100%;
height: 100%;
-o-object-fit: contain;
object-fit: contain;
}