|
|
@ -236,645 +236,7 @@ |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* modal */ |
|
|
|
|
|
|
|
.modal{ |
|
|
|
|
|
|
|
position: fixed; |
|
|
|
|
|
|
|
top: 0; |
|
|
|
|
|
|
|
left: 0; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding: 20px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
background: rgba(0, 0, 0, 0.25); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
z-index: 200; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
opacity: 0; |
|
|
|
|
|
|
|
transition: opacity .2s ease-out; |
|
|
|
|
|
|
|
pointer-events: none; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
overflow-y: auto; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal.active{ |
|
|
|
|
|
|
|
opacity: 1; |
|
|
|
|
|
|
|
pointer-events: auto; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__notification{} |
|
|
|
|
|
|
|
.form__button-mobile{ |
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__aside{ |
|
|
|
|
|
|
|
position: fixed; |
|
|
|
|
|
|
|
top: 0; |
|
|
|
|
|
|
|
right: 0; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 0; |
|
|
|
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
overflow: hidden; |
|
|
|
|
|
|
|
transition: width .4s ease-out; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__item{ |
|
|
|
|
|
|
|
height: 100%; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
background: var(--background-white); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
filter: blur(10px); |
|
|
|
|
|
|
|
transition: filter .2s ease-out; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__item--no-title{ |
|
|
|
|
|
|
|
padding-top: 72px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__item.active{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
flex-direction: column; |
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__close{ |
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
top: 32px; |
|
|
|
|
|
|
|
right: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 24px; |
|
|
|
|
|
|
|
height: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
border: none; |
|
|
|
|
|
|
|
background: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__header{} |
|
|
|
|
|
|
|
.modal__title{ |
|
|
|
|
|
|
|
padding-right: 48px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 700; |
|
|
|
|
|
|
|
font-size: 36px; |
|
|
|
|
|
|
|
line-height: 111%; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__small-title{ |
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 700; |
|
|
|
|
|
|
|
font-size: 24px; |
|
|
|
|
|
|
|
line-height: 100%; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__text{ |
|
|
|
|
|
|
|
margin-top: 16px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding-right: 10px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 400; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 120%; |
|
|
|
|
|
|
|
color: var(--text-0); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__form-sub{ |
|
|
|
|
|
|
|
margin-top: 48px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-sub__submit{ |
|
|
|
|
|
|
|
margin-top: 64px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__block-button{ |
|
|
|
|
|
|
|
margin-top: 24px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__button{ |
|
|
|
|
|
|
|
margin-top: 16px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__button:first-child{ |
|
|
|
|
|
|
|
margin-top: 0; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__content{ |
|
|
|
|
|
|
|
margin-top: 24px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__filter{ |
|
|
|
|
|
|
|
width: 400px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__footer{ |
|
|
|
|
|
|
|
border-top: 1px solid var(--text-6); |
|
|
|
|
|
|
|
padding-top: 23px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__block-price{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-block-price__title{ |
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 600; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 120%; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-block-price__price{ |
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 700; |
|
|
|
|
|
|
|
font-size: 24px; |
|
|
|
|
|
|
|
line-height: 100%; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
text-align: right; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-block-price__price::after{ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__basket{ |
|
|
|
|
|
|
|
width: 600px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__to-know, |
|
|
|
|
|
|
|
.modal__to-know-submit{ |
|
|
|
|
|
|
|
width: 412px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.modal-basket__item{ |
|
|
|
|
|
|
|
padding-top: 23px; |
|
|
|
|
|
|
|
padding-right: 15px; |
|
|
|
|
|
|
|
padding-bottom: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
border-top: 1px solid var(--background-grey); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket__item::before{ |
|
|
|
|
|
|
|
content: ''; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
top: 24px; |
|
|
|
|
|
|
|
right: 6px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 24px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
background-image: url(../img/svg/main/basket.svg); |
|
|
|
|
|
|
|
background-repeat: no-repeat; |
|
|
|
|
|
|
|
background-position: center; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
cursor: pointer; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
transition: opacity .2s ease-out; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket__item:hover .modal-basket__item::before{ |
|
|
|
|
|
|
|
opacity: .8; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket__item--return{ |
|
|
|
|
|
|
|
padding-right: 5px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket__item--return .modal-basket-item__title{ |
|
|
|
|
|
|
|
padding-right: 10px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket__item--return::before{ |
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__return{ |
|
|
|
|
|
|
|
border-radius: 20px; |
|
|
|
|
|
|
|
padding: 4px 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 600; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 120%; |
|
|
|
|
|
|
|
color: var(--text-white); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
background: var(--background-black); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
border: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__block-image{ |
|
|
|
|
|
|
|
width: 128px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__image{ |
|
|
|
|
|
|
|
width: 96px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
object-fit: contain; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__content{ |
|
|
|
|
|
|
|
margin-left: 16px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__title{ |
|
|
|
|
|
|
|
padding-right: 40px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 500; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 120%; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__sub-title{ |
|
|
|
|
|
|
|
margin-top: 8px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 700; |
|
|
|
|
|
|
|
font-size: 12px; |
|
|
|
|
|
|
|
line-height: 133%; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__control{ |
|
|
|
|
|
|
|
margin-top: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__price{ |
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 600; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 120%; |
|
|
|
|
|
|
|
text-align: right; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-basket-item__price::after{ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding-left: 4px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__basket .modal__header{ |
|
|
|
|
|
|
|
height: calc(100% - 92px); |
|
|
|
|
|
|
|
margin-bottom: -36px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__basket .modal__content{ |
|
|
|
|
|
|
|
height: calc(100% - 100px); |
|
|
|
|
|
|
|
overflow-x: hidden; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__basket .modal__content::-webkit-scrollbar { |
|
|
|
|
|
|
|
width: 7px; |
|
|
|
|
|
|
|
background-color: #f9f9fd; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__basket .modal__content::-webkit-scrollbar-thumb { |
|
|
|
|
|
|
|
background-color: var(--background-black); |
|
|
|
|
|
|
|
border-radius: 2px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.modal-form{ |
|
|
|
|
|
|
|
margin: auto; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 600px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
border-radius: 20px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form.active{ |
|
|
|
|
|
|
|
display: block; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form--white{ |
|
|
|
|
|
|
|
border: 1px solid var(--background-black); |
|
|
|
|
|
|
|
background: var(--background-white); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form--green-gradient{ |
|
|
|
|
|
|
|
background: var(--gradient-blue); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form--width-584{ |
|
|
|
|
|
|
|
width: 584px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form--cdek{ |
|
|
|
|
|
|
|
width: 836px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__close{ |
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
top: 24px; |
|
|
|
|
|
|
|
right: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 24px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
border: none; |
|
|
|
|
|
|
|
background: none; |
|
|
|
|
|
|
|
background-image: url(../img/svg/main/black-x.svg); |
|
|
|
|
|
|
|
background-repeat: no-repeat; |
|
|
|
|
|
|
|
background-size: 24px; |
|
|
|
|
|
|
|
background-position: center; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
transition: opacity .2s ease-out; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
z-index: 10; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__close--white{ |
|
|
|
|
|
|
|
background-image: url(../img/svg/main/white-x.svg); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__close:hover{ |
|
|
|
|
|
|
|
opacity: .8; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__button-close{} |
|
|
|
|
|
|
|
.modal-form__title{ |
|
|
|
|
|
|
|
padding-right: 50px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 700; |
|
|
|
|
|
|
|
font-size: 26px; |
|
|
|
|
|
|
|
line-height: 123%; |
|
|
|
|
|
|
|
text-transform: uppercase; |
|
|
|
|
|
|
|
color: var(--text-dark); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__text--center{ |
|
|
|
|
|
|
|
text-align: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__text--center-pc{ |
|
|
|
|
|
|
|
text-align: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__title--green-gradient{ |
|
|
|
|
|
|
|
background: var(--gradient-blue); |
|
|
|
|
|
|
|
background-clip: text; |
|
|
|
|
|
|
|
-webkit-background-clip: text; |
|
|
|
|
|
|
|
-webkit-text-fill-color: transparent; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__title--white{ |
|
|
|
|
|
|
|
color: var(--text-white); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__element{ |
|
|
|
|
|
|
|
margin-top: 24px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__element--center{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__element--top-40{ |
|
|
|
|
|
|
|
margin-top: 40px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__text{ |
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 400; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 120%; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__text--weight-500{ |
|
|
|
|
|
|
|
font-weight: 500; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__text--white{ |
|
|
|
|
|
|
|
color: var(--text-white); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__img{ |
|
|
|
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
height: 360px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
object-fit: contain; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__content{ |
|
|
|
|
|
|
|
margin-top: 40px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.form-row{ |
|
|
|
|
|
|
|
margin-top: 24px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.form-row:first-child{ |
|
|
|
|
|
|
|
margin-top: 0; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--two{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--two-mobile{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--two-mobile .modal-form-content-line__element{ |
|
|
|
|
|
|
|
width: calc(50% - 12px); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content-line__element{ |
|
|
|
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content-line__element--arrow::after{ |
|
|
|
|
|
|
|
content: ''; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
right: 16px; |
|
|
|
|
|
|
|
bottom: 16px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 16px; |
|
|
|
|
|
|
|
height: 16px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
background-image: url(../img/svg/main/arrow-right-input.svg); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
pointer-events: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--two .modal-form-content-line__element{ |
|
|
|
|
|
|
|
width: calc(50% - 12px); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--three{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--three .modal-form-content-line__element:nth-child(1){ |
|
|
|
|
|
|
|
width: 85px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--three .modal-form-content-line__element:nth-child(2){ |
|
|
|
|
|
|
|
margin-left: 8px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 100%; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--three .modal-form-content-line__element:nth-child(3){ |
|
|
|
|
|
|
|
margin-left: 8px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 85px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
flex-shrink: 0; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form-content__line--margin-top-16{ |
|
|
|
|
|
|
|
margin-top: 16px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__buttons{ |
|
|
|
|
|
|
|
margin-top: 32px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-form__buttons--two{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
justify-content: space-between; |
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
.modal-form__buttons--two button, |
|
|
|
|
|
|
|
.modal-form__buttons--two input{ |
|
|
|
|
|
|
|
width: calc(50% - 20px); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map{ |
|
|
|
|
|
|
|
margin: auto; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: 1105px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
border-radius: 24px; |
|
|
|
|
|
|
|
border: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map.active{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map__left{ |
|
|
|
|
|
|
|
width: 600px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding: 24px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map__control{ |
|
|
|
|
|
|
|
margin: 38px -12px -12px -12px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map__control--delivery{ |
|
|
|
|
|
|
|
margin-top: 12px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control__item{ |
|
|
|
|
|
|
|
margin: 12px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
padding: 2px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
width: calc(50% - 24px); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
background: var(--background-9); |
|
|
|
|
|
|
|
border-radius: 20px; |
|
|
|
|
|
|
|
border: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control__item.active{ |
|
|
|
|
|
|
|
background: var(--gradient-blue); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control__item.active .form-input-radio__circle::before{ |
|
|
|
|
|
|
|
content: ''; |
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
top: 4px; |
|
|
|
|
|
|
|
left: 4px; |
|
|
|
|
|
|
|
width: 12px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
border-radius: 50%; |
|
|
|
|
|
|
|
background: var(--gradient-blue); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__content{ |
|
|
|
|
|
|
|
padding: 14px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
border-radius: 18px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
background: var(--background-white); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__header{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
align-items: center; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__circle{ |
|
|
|
|
|
|
|
padding: 2px; |
|
|
|
|
|
|
|
width: 20px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
border-radius: 50%; |
|
|
|
|
|
|
|
background: var(--background-9); |
|
|
|
|
|
|
|
position: relative; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__input{ |
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item-circle__content{ |
|
|
|
|
|
|
|
width: 16px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
border-radius: 50%; |
|
|
|
|
|
|
|
background: var(--background-white); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control__item.active .modal-map-control-item__circle{ |
|
|
|
|
|
|
|
background: var(--gradient-blue); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control__item.active .modal-map-control-item__circle::before{ |
|
|
|
|
|
|
|
content: ''; |
|
|
|
|
|
|
|
position: absolute; |
|
|
|
|
|
|
|
top: 4px; |
|
|
|
|
|
|
|
left: 4px; |
|
|
|
|
|
|
|
width: 12px; |
|
|
|
|
|
|
|
aspect-ratio: 1; |
|
|
|
|
|
|
|
border-radius: 50%; |
|
|
|
|
|
|
|
background: var(--gradient-blue); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__title{ |
|
|
|
|
|
|
|
margin-left: 8px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 400; |
|
|
|
|
|
|
|
font-size: 20px; |
|
|
|
|
|
|
|
line-height: 120%; |
|
|
|
|
|
|
|
color: var(--text-dark); |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__description{ |
|
|
|
|
|
|
|
margin-top: 16px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__time{ |
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 500; |
|
|
|
|
|
|
|
font-size: 16px; |
|
|
|
|
|
|
|
line-height: 125%; |
|
|
|
|
|
|
|
color: var(--text-black); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
text-align: start; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-control-item__price{ |
|
|
|
|
|
|
|
margin-top: 8px; |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
font-family: var(--font-family); |
|
|
|
|
|
|
|
font-weight: 700; |
|
|
|
|
|
|
|
font-size: 12px; |
|
|
|
|
|
|
|
line-height: 133%; |
|
|
|
|
|
|
|
color: var(--text-6); |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
text-align: start; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map__form{ |
|
|
|
|
|
|
|
margin-top: 24px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-form__hidden{ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-form__button{ |
|
|
|
|
|
|
|
margin-top: 83px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map-form__sub-button{ |
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map__right{ |
|
|
|
|
|
|
|
padding: 16px 0px 16px 16px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map__map{ |
|
|
|
|
|
|
|
border: 2px solid var(--background-9); |
|
|
|
|
|
|
|
border-radius: 16px; |
|
|
|
|
|
|
|
border-top-right-radius: 0; |
|
|
|
|
|
|
|
border-bottom-right-radius: 0; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal-map__map iframe{ |
|
|
|
|
|
|
|
height: 650px; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__age{ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__age > div{ |
|
|
|
|
|
|
|
display: none; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
.modal__age > div.active{ |
|
|
|
|
|
|
|
display: flex; |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
/* modal */ |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
/* toggle */ |
|
|
|
/* toggle */ |
|
|
|
.toggle{ |
|
|
|
.toggle{ |
|
|
|