html, body {
    font-family: "proxima-nova", sans-serif;
    background-color: #f6f6f6;
    touch-action: manipulation;
}

body {
    padding-bottom: 80px;
}

p, ul, li, span, label, h1, h2, h3, h4 {
    margin: 0;
    padding: 0;
}
textarea {
    -webkit-appearance: none;
    -moz-appearance: none;
}
textarea:focus {
    outline: none;
    border-color: #000;
}

a:focus {
    outline: none;
}

.has-error input[type='text'], .has-error input[type='tel'], .has-error input[type='password'], .has-error textarea {
    border-color: #ff5677 !important;
    color: #000 !important;
}

.has-error .focusPlaceholder, .colorRed {
    color: #ff5677 !important;
}

.btn-black {
    color: #000;
    border-color: #000;
    background-color: transparent;
}

.btn {
    -webkit-transition: color 0.3s ease;
    transition: color 0.3s ease;
}

.btnStepSubmit, .btnApplePay {
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1.5px;
    text-align: center;
    text-transform: uppercase;
    width: 100% !important;
    justify-content: center;
    align-content: center;
    height: 40px;
    line-height: 40px;
    background-color: #000;
    border-color: #000;
    padding: 0;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    position: relative;
    color: transparent;
    z-index: 1;
}
.btnApplePay {
    margin-bottom: 4px;
}

.btnStepSubmit:hover, .btnStepSubmit:focus {
    color: transparent;
    border-color: #000;
    background-color: #000;
    outline: none;
}

.btnStepSubmit.disabled {
    pointer-events: none;
    background-color: #000 !important;
    opacity: 1 !important;
}

.btnStepSubmit.disabled::after {
    color: #8e8e93 !important;
}

@keyframes btnLoading {
    0% {
        width: 0%;
    }
    100% {
        width: 100%;
    }
}


.btnStepSubmit::after{
    display: none !important;
}
.btnOrderSubmit::after{
    display: block !important;
}
.btnStepSubmit span,
.btnOrderSubmit::after{
    content: 'ПРОДОЛЖИТЬ';
    display: block;
    height: 40px;
    line-height: 40px;
    position: absolute;
    left: 0px;
    top: 0px;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1.5px;
    color: #fff !important;
    text-align: center;
    width: 100%;
}

.btnSubmitMap {
    width: 160px;
    margin-left: 24px;
    margin-top: 0;
    height: 44px;
    line-height: 44px;
    font-size: 13px;
    font-weight: bold;
    letter-spacing: 1px;
    text-align: center;
    color: #000;
    flex: 1 0 auto;
}

.btnSubmitMap::after {
    content: 'адрес верный';
    letter-spacing: 1px;
    font-size: 13px;
    height: 44px;
    line-height: 44px;
}

.modalAddrInput {
    flex-wrap: nowrap;
}

.modal-body .btnSubmitMap, .modal-body .btnSubmitMap::after {
    letter-spacing: 1px;
    font-size: 13px;
}

.mapModalIcon {
    transform: scale(0.75) !important;
    cursor: pointer;
}
a#mapModalIcon {
    border-bottom: 1px dotted;
    text-decoration: none;
}

.imageText {
    display: flex;
    align-items: center;
}

.imageText img, .imageText p, .imageText a {
    display: inline-flex;
    color: #000;
    font-size: 13px;;
}
.imageText a:hover, .imageText a:focus, .imageText a:hover:focus {
    color: #007aff;
    text-decoration: none;
}
.headerDropdownMenu > a:hover, .headerDropdownMenu > a:hover:focus, .headerDropdownMenu > a:focus {
    color: #000;
}

.imageText img {
    margin-right: 8px;
}

.imageText a:focus, .imageText a:active {
    outline: none;
}

.verticalCenter {
    display: flex;
    position: relative;
    z-index: 1;
}


.verticalCenter div {
    display: inline-flex;
    align-items: center;
}

.verticalCenter div:nth-of-type(1) img {
    margin-left: 6px;
}

.verticalCenter div:nth-of-type(2) {
    justify-content: center;
}

.verticalCenter div:last-of-type {
    justify-content: flex-end;
}

.headerContainer {
    padding: 24px 15px;
    border-bottom: 1px solid #e5e5ea;
    background-color: #ffffff;
}

.checkoutStep {
    display: flex;
    flex-wrap: wrap;
    padding: 24px;
    border-radius: 4px;
    background-color: #ffffff;
    border: solid 1px #e5e5ea;
    margin-top: 16px;
}

.checkoutStep:first-of-type {
    margin-top: 28px;
}

.checkoutStep + .checkoutStep {
    margin-top: 16px;
}

.checkoutStep .count {
    align-items: center;
    color: #8e8e93;
    margin-bottom: 0px;
    width: 100%;
    font-size: 17px;
    /*-webkit-transition: margin-bottom 0.4s ease;
    transition: margin-bottom 0.4s ease;*/
}

.checkoutStep .count span {
    display: inline-flex;
    width: 24px;
    height: 24px;
    justify-content: center;
    align-content: center;
    border: 1px solid #8e8e93;
    color: #8e8e93;
    padding: 0;
    padding-left: 0px;
    line-height: 22px;
    border-radius: 50%;
    box-sizing: border-box;
    text-align: center;
    margin-right: 8px;
    font-size: 15px;
    font-weight: 300;
}

/*.checkoutStep .count span.one {
    width: 21px;
    padding-right: 1px;
    padding-left: 0px;
}*/

.checkoutStepActive .count {
    color: #000;
    margin-bottom: 22px;
}

.checkoutStepFinished .count {
    margin-bottom: 22px;
}

.checkoutStepActive .count span {
    color: #fff;
    border-color: #000;
    background-color: #000;
}

.checkoutStep .count a {
    float: right;
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 1.5px;
    color: #3c3c3c;
    height: 24px;
    line-height: 30px;
    display: none;
}

.checkoutStepFinished .count a {
    display: inline-block;
}

.placeholderInput {
    position: relative;
    margin-bottom: 12px;
    min-height: 44px;
    /*-webkit-transition: height 0.5s ease, margin-bottom 0.5s ease;
    transition: height 0.5s ease, margin-bottom 0.5s ease;*/
    /*overflow: hidden;*/
    width: 100%;
}

.radioControl .placeholderInput {
    min-height: auto;
}

.help-block {
    color: #ff5677 !important;
    font-size: 12px;
    padding: 0 4px;
    margin: 0;
}

.placeholderInput.collapsed {
    height: 0;
    margin-bottom: 0;
}

.placeholderInput .intl-tel-input {
    width: 100% !important;
}

.placeholderInput input[type='text'], .placeholderInput input[type='password'], input[type=tel] {
    width: 100% !important;
    height: 44px !important;
    padding-right: 0 !important;
    border: solid 1px #c7c7cc;
    border-radius: 3px;
    padding-left: 15px;
    /*background-color: transparent;*/
    font-size: 14px;
    color: #000;
    padding-top: 0;
    padding-bottom: 0;
    /*-webkit-transition: padding-top 0.2s ease 0s, border-color 0.2s ease;
    transition: padding-top 0.2s ease 0s, border-color 0.2s ease;*/
}

.placeholderInput input[type='text']:focus, .placeholderInput.hasInput input[type='text'], .placeholderInput input[type='password']:focus, .placeholderInput.hasInput input[type='password'] {
    padding-top: 16px;
    border-color: #000;
    outline: none;
}

.intl-tel-input input[type=tel]:focus, .placeholderInput.hasInput input[type=tel] {
    border-color: #000;
    outline: none;
}

.placeholderInput .focusPlaceholder {
    position: absolute;
    left: 16px;
    top: 10px;
    text-transform: uppercase;
    font-size: 9px;
    height: 9px;
    line-height: 9px;
    letter-spacing: 1px;
    opacity: 0;
    /*-webkit-transition: opacity 0.2s ease 0.2s;
    transition: opacity 0.2s ease 0.2s;*/
    color: #8E8E93;
    -weblit-user-select: none;
    user-select: none;
    font-weight: 400 !important;
}

.placeholderInput.hasInput .focusPlaceholder {
    opacity: 1;
}

.placeholderInput.transitionComplete .focusPlaceholder {
    /*-webkit-transition: opacity 0.2s ease 0.0s;
    transition: opacity 0.2s ease 0.0s;*/
}

.placeholderInput.transitionComplete input[type='text'], .placeholderInput.transitionComplete input[type='password'] {
    /*-webkit-transition: padding-top 0.2s ease 0.2s;
    transition: padding-top 0.2s ease 0.2s;*/
}

.doubleInput .placeholderInput {
    width: 148px;
    margin-top: 4px !important;
}

.doubleInput .placeholderInput:nth-of-type(1) {
    float: left;
}

.doubleInput .placeholderInput:nth-of-type(2) {
    float: right;
}

.phoneInput {
    position: relative;
    margin-bottom: 12px;
    min-height: 44px;
    /*-webkit-transition: height 0.5s ease, margin-bottom 0.5s ease;
    transition: height 0.5s ease, margin-bottom 0.5s ease;*/
    overflow: visible;
    width: 100%;
}

.form-check-label {
    width: 100%;
    display: flex;
    align-items: flex-start !important;
}

.form-check-label span {
    height: auto !important;
    font-size: 13px;
    font-weight: 400;
    color: #3c3c3c;
    line-height: 21px !important;
}

input[type='checkbox'] {
    display: inline-block;
    width: 16px;
    height: 16px;
    background-color: #fff;
    border: 0px none;
    margin: 0;
    -webkit-appearance: none;
    border: solid 1px #3c3c3c;
    margin-right: 8px;
    border-radius: 4px;
}

input[type='checkbox']:checked {
    background-color: #000;
    background-image: url(../images/checkout/checbox_active.svg);
    background-size: 20px 20px;
    background-position: center;
    background-repeat: no-repeat;
    border-color: #000;
    box-shadow: none;
}

input[type='checkbox']:checked, input[type='checkbox']:focus, input[type='checkbox']:active {
    outline: none;
}

.checkboxGroup .placeholderInput, .checkboxGroup .phoneInput {
    margin-top: 8px;
    margin-bottom: 8px;
}

.checkboxGroup + .checkboxGroup {
    margin-top: 16px;
}

.smallText {
    font-size: 12px;
    line-height: 1;
    text-align: center;
    color: #3c3c3c;
    margin-top: 8px;
    width: 100%;
}

.titleRow {
    margin-top: 32px;
}

.titleRow h1,
.titleRow .h1 {
    font-size: 24px;
    line-height: 1;
    text-align: center;
    color: #000000;
}

.titleRow a, .headerBack {
    height: 24px;
    font-size: 13px;
    line-height: 28px;
    color: #000000;
    text-decoration: none;
    display: flex;
    align-content: center;
    align-items: center;
}
.headerBack:hover, .headerBack:focus, .headerBack:hover:focus {
    color: #000;
    text-decoration: none;
}

.titleRow a img, .headerBack img {
    margin-left: 6px;
    margin-right: 8px;
    margin-top: -2px;
}
.titleRow a embed, .headerBack embed {
    margin-left: 6px;
    margin-right: 8px;
}

.sidebarProducts {
    padding: 24px;
    padding-top: 22px;
    border-radius: 4px 4px 0 0;
    border: solid 1px #e5e5ea;
    margin-top: 28px;
    background-color: #fff;
}

.sidebarProducts .singleProduct {
    display: flex;
    justify-content: space-between;
}

.singleProduct + .singleProduct {
    margin-top: 16px;
}

.singleProduct.deleted {
    opacity: 0.5;
}
.singleProduct.deleted .prodImg, .singleProduct.deleted .prodTitle, . {

}

.prodImg {
    border-radius: 4px;
    border: solid 1px #e5e5ea;
    display: inline-flex;
    margin-right: 16px;
    width: 64px;
    height: 64px;
    flex: 0 0 auto;
    overflow: hidden;
}

.prodTitle {
    display: inline-flex;
    flex: 1 1 auto;
    flex-wrap: wrap;
    font-size: 13px;
    line-height: 18px;
    text-align: left;
    color: #3c3c3c;
    padding-right: 14px;
    justify-content: flex-start !important;
}
.prodTitle .unitPrice {
    font-size: 12px;
    line-height: 1;
    color: #999;
}

.prodActions {
    width: 62px;
    flex: 0 0 auto;
    justify-content: flex-end;
}

.prodActions p {
    font-size: 13px;
    line-height: 1.38;
    color: #3c3c3c;
    text-align: right;
}

.prodActions span.prodCount {
    border-radius: 3px;
    background-color: #ffffff;
    border: solid 1px #e5e5ea;
    width: 24px;
    height: 16px;
    line-height: 16px;
    text-align: center;
    display: block;
    font-size: 12px;
    color: #c7c7cc;
    float: right;
}

.counter {
    margin-top: 9px;
    width: 62px;
    position: relative;
    height: 16px;
    margin-bottom: 8px;
    float: right;
    border: solid 1px #e5e5ea;
    border-radius: 3px;
}

.counter a {
    display: block;
    width: 20px;
    height: 14px;
    background-color: #f8f8f8;
    border-right: solid 1px #e5e5ea;
    color: #000;
    font-size: 16px;
    font-weight: 500;
    position: absolute;
    left: 0;
    top: 0;
    text-align: center;
    line-height: 13px;
}

.counter a.plus {
    left: auto;
    right: 0;
    line-height: 16px;
    border-left: solid 1px #e5e5ea;
    border-right: 0px none;
}

.counter a:hover, .counter a:focus {
    text-decoration: none;
}

.counter input {
    display: block;
    height: 14px;
    line-height: 15px;
    font-size: 13px;
    text-align: center;
    color: #000000;
    position: absolute;
    left: 50%;
    margin-left: -10px;
    width: 20px;;
    border: 0;
}

.prodDelete {
    font-size: 12px;
    line-height: 1;
    text-align: right;
    color: #8e8e93;
    float: right;
}

.prodDelete:focus {
    color: #8e8e93;
    text-decoration: none;
}

.prodDelete:hover {
    color: #000;
    text-decoration: none;

}

.checkoutTotal {
    padding: 24px;
    border-radius: 0 0 4px 4px;
    border: solid 1px #e5e5ea;
    border-top: 0px none;
    background-color: #fff;
}

.colorBlue {
    color: #007aff !important;
}

.checkoutTotal p {
    font-size: 13px;
    line-height: 18px;
    text-align: left;
    color: #000000;
    width: 100%;
    margin-bottom: 6px;
}

.checkoutTotal p > span {
    float: right;
    width: auto;
    min-width: 68px;
    text-align: right;
    font-weight: 400;
}

.checkoutTotal p a {
    float: right;
}

.checkoutTotal p a.remove {
    margin-right: 16px;
}

.checkoutTotal p.total {
    margin-top: 14px;
    margin-bottom: 0;
    font-weight: 700;
    color: #000;
    font-size: 15px;
}
.checkoutTotal p.total span {
    font-weight: 700;
}

.sidebarPresents {
    border-radius: 4px;
    background-color: #ffffff;
    border: solid 1px #e5e5ea;
    margin-top: 16px;
    padding: 24px;
    padding-top: 21px;
}

.sidebarPresents h3 {
    font-size: 17px;
    line-height: 18px;
    margin-bottom: 16px;
    text-align: left;
    color: #3c3c3c;
}

.presentsCarousel {
    display: flex;
}

.presentsCarousel a {
    margin-right: 8px;
}

.presentsCarousel a .prodImg {
    margin: 0;
}

.finishedContent {
    width: 100%;
    display: none;
}

.finishedContent p {
    font-size: 14px;
    line-height: 20px;
    color: #3c3c3c;
    word-wrap: break-word;
}

.finishedContent p span {
    color: #8e8e93;
}

.finishedContent p + p {
    margin-top: 16px;
}

.activeContent {
    width: 100%;
}

.checkoutStepPassive .activeContent {
    display: none;
}

.checkboxGroup, .form-check-label {
    position: relative;
}
.form-check-label .popupText {
    margin-top: 2px;
    margin-left: 4px;
}

.cardText {
    padding: 0px;
    background-color: #ffffff;
    border: 0px none;
    color: #000;
    width: 100%;
    resize: none;
    /*height: 176px;*/
    max-height: 138px;
    white-space: pre-line;
    font-size: 13px;
    line-height: 16px;
}

.cardTextContainer {
    padding: 14px 16px 24px 16px;
    background-color: #ffffff;
    border: solid 1px #c7c7cc;
    border-radius: 3px;
    color: #000;
    margin-top: 8px;
    width: 100%;
    height: 176px;
}

.cardTextContainer:focus {
    border-color: #A1A1A1;
}

.cardLines {
    position: absolute;
    left: 16px;
    bottom: 4px;
    font-size: 10px;
    color: #8e8e93;
    background-color: #fff;
}

.cardSymbols {
    position: absolute;
    bottom: 4px;
    right: 16px;
    font-size: 10px;
    color: #8e8e93;
    background-color: #fff;
}

.borderBlack {
    border-color: #A1A1A1;
}

.tipsText {
    position: absolute;
    border-radius: 8px;
    background-color: #f8f8f8;
    box-shadow: 0 16px 32px 0 rgba(0, 0, 0, 0.16), 1px 1px 2px 0 rgba(0, 0, 0, 0.08), -1px -1px 2px 0 rgba(0, 0, 0, 0.08);
    top: 36px;
    display: none;
    height: 0;
    /*-webkit-transition: height 0.3s ease, padding 0.3s ease;
    transition: height 0.3s ease, padding 0.3s ease;*/
    overflow: hidden;
    padding: 0 16px;
    z-index: 0;
}

.tipsShown .tipsText {
    padding: 16px;
    z-index: 2;
    display: block;
}

.tipsShown {
    z-index: 1000 !important;
}

.tipsText p {
    font-size: 13px;
    line-height: 14px;
    color: #3c3c3c;
}

.tipsText strong {
    font-weight: 600;
}

.anonimousOrder, .surpriseCheck {
    position: relative;
    margin-top: 8px;
    z-index: 1;
}

.anonimousOrder .tipsText {
    width: 228px;
    left: 34px;
    top: -90px;
    font-size: 13px;
    text-align: left;
}

.anonimousOrder.tipsShown .tipsText {
    height: 84px;
    padding: 14px 16px 14px;
}

.deliveryPrice .tipsText,
.form-check-label .tipsText{
    width: 232px;
    left: 74px;
    padding: 0 16px;
    top: -113px;
    display: block;
    visibility: hidden;
    height: auto;
}

.deliveryPrice.tipsShown .tipsText,
.form-check-label.tipsShown .tipsText{
    height: 108px;
    padding: 14px 16px;
    visibility: visible;
}

.ccNumberPlaceholderInput.tipsShown, .ccCvv.tipsShown {
    overflow: visible;
}

.ccNumberPlaceholderInput .tipsText {
    width: 232px;
    height: 150px;
    padding: 14px 16px 16px;
    top: -145px;
    left: 119px;
}

.ccNumberPlaceholderInput .tipsText p {
    line-height: 15px;
}

.ccCvv .tipsText {
    width: 228px;
    height: 118px;
    left: -42px;
    top: -111px;
    padding: 14px 16px 16px;
}

.ccCvv .tipsText p {
    line-height: 15px;
}

.takePhotoCheck {
    margin-top: 8px;
}

.popupText {
    margin-top: -2px;
}

.deliveryMethod {
    position: relative;
    padding-bottom: 24px;
    margin-bottom: 24px;
}

.deliveryMethod::after {
    content: '';
    display: block;
    position: absolute;
    width: auto;
    height: 1px;
    background-color: #e5e5ea;
    left: 0;
    right: 0;
    bottom: 0;
    margin-left: -24px;
    margin-right: -24px;
}

.deliveryComment {
    width: 100%;
    padding: 16px;
    padding-top: 14px;
    font-size: 14px;
    line-height: 1.14;
    text-align: left;
    color: #000;
    height: 88px;
    resize: none;
    margin-top: 4px;
    border-radius: 3px;
    background-color: #ffffff;
    border: solid 1px #e4e4e4;
}

.mkadDistanceContainer {
    margin-top: 16px;
}

.deliveryPrice {
    position: relative;
}

.mainContent {
    position: relative;
    z-index: 1;
}

@media (max-width: 768px) {
    .mainContent {
        padding-bottom: 40px;
    }
}

.pickupMap {
    width: 100% !important;
    margin-top: 16px;
    border-radius: 4px;
    overflow: hidden;
    border: 1px solid #e5e5ea;
    position: relative;
}

.nav-tabs > li > a {
    margin: 0;
    padding: 0;
    flex: 1 0 auto;
    text-align: center;
    font-size: 13px;
    line-height: 14px;
    letter-spacing: 1px;
    text-align: center;
    color: #3c3c3c;
    padding: 14px 0;
    border-radius: 0px;
    border-left: 0px none;
    border-top-color: #e5e5ea;
    border-right-color: #e5e5ea;
    border-bottom: 0px none;
    min-width: 60px;
    text-transform: uppercase;
}
.nav-tabs > li > a > span {
    font-size: 11px;
}
.nav-tabs > li:hover {
    border-bottom: 1px solid #e5e5ea !important;
}
.nav-tabs > li.active:hover {
    border-bottom: 0px none !important;
}

.nav-tabs > li > a:hover {
    border-top-color: #e5e5ea;
    border-right-color: #e5e5ea;
}

.nav-tabs > li.active > a {
    font-weight: 700;
    border-left-color: transparent;
}

.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {
    border-left: 0px none;
}

.nav-tabs > li:first-of-type > a {
    border-radius: 4px 0 0 0;
    border-left: 1px solid #e5e5ea !important;
}

.nav-tabs > li:last-of-type > a {
    border-radius: 0 4px 0 0;
    border-color: #e5e5ea;
    border-bottom: 0px none;
}

.nav-tabs > li:last-of-type > a:hover, .nav-tabs > li:last-of-type > a:focus {
    outline: none;
    background-color: #fff;
    border-color: #e5e5ea;
}
.nav-tabs > li:last-of-type:hover

.nav-tabs > li > a > span {
    font-size: 11px;
    line-height: 1.09;
}

.tab-content > .active {
    width: 100%;
}

.nav-tabs {
    display: flex;
}

.nav-tabs li {
    display: inline-flex;
    justify-content: center;
    padding: 0;
    flex: 1 0 auto;
}

.nav-tabs > li > a > img {
    margin: 4px 19px 0;
}

.panel-default {
    border: 0px none;
}

.panel-group .panel + .panel {
    margin-top: 0;
}

.tab-content {
    border: solid 1px #e5e5ea;
    border-top: 0px none;
    margin-right: 0px;
    border-radius: 0 0 4px 4px;
    overflow: hidden;
    width: 100% !important;
}

.panel-title a img {
    width: 12px;
    height: 24px;
    transform: rotate(180deg);
    margin-right: 10px;
    margin-left: 0px;
}

.panel-title a.collapsed img {
    transform: rotate(00deg);
}

.panel-title a {
    font-size: 14px;
    line-height: 1;
    text-align: left;
    color: #3c3c3c;
    height: 46px;
    line-height: 46px;
    padding: 0 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    background-color: #f6f6f6;
    border-bottom: 1px solid #f6f6f6;
}

.panel-title a img, .panel-title a span.price {
    flex: initial;
}

.panel-title a span.title {
    flex: 1 0 auto;
}

.panel-title a.collapsed {
    background-color: #fff;
    border-bottom: 1px solid #e5e5ea;
}

.panel-title a:hover, .panel-title a:focus {
    text-decoration: none;
}

.panel-default > .panel-heading {
    background-color: #fff;
    border: 0px none;
    border-radius: 0px;
    padding: 0;
}

.panel-group .panel-heading + .panel-collapse > .panel-body, .panel-group .panel-heading + .panel-collapse > .list-group {
    border-top: 0px none;
    border-bottom: 1px solid #e5e5ea;
}
.panel-group .panel:last-of-type .panel-heading + .panel-collapse > .panel-body {
    border-bottom: 0px none;
}

.panel-group .panel-heading + .panel-collapse > .panel-body {
    padding-top: 4px;
}
.collapse {
    transform: translateZ(0);
}

.panel-group {
    margin-bottom: 0px;
}

.panel-body {
    padding: 0 24px 16px;
    background-color: #f6f6f6;
}

.panel-body .radio {
    margin: 0;
    margin-left: 20px;
    padding-left: 25px;
    color: #3c3c3c;
    font-weight: 400;
    font-size: 14px;
    line-height: 1;
}

.preciseTime .radio {
    margin-left: 22px;
    font-weight: 400;
}

.panel-body .radio input[type='radio'] {
    margin-top: -1px;
}

.panel-body > .radio + .radio {
    margin-top: 16px;
}

.panel-default:last-of-type .panel-title a {
    border-bottom: 0px none;
}

.preciseTime {
    padding: 16px 24px;
    border-bottom: 1px solid #e5e5ea;
    position: relative;
    z-index: 1;
}

.preciseTime.dropdownActive {
    background-color: #f6f6f6;
    border-bottom-color: #e5e5ea;
}
.pickupTime .preciseTime.dropdownActive {
    border-bottom-color: #f6f6f6;
}

.preciseTimeDropdown {
    /*position: absolute;
    left: 0;
    bottom: -76px;*/
    padding: 0 24px;
    background-color: #f6f6f6;
    width: 100%;
    display: flex;
    height: 0;
    overflow: hidden;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

.preciseTime.dropdownActive .preciseTimeDropdown {
    height: 76px;
    padding: 16px 24px;
}

.preciseTimeDropdown select, .preciseTimeDropdown select option {
    height: 44px;
    line-height: 44px;
    font-size: 14px;
    letter-spacing: 0.5px;
    color: #3c3c3c;
    width: 68px;
    text-align: left;
    margin: 0;
    padding-left: 16px;
    background-image: url(../images/checkout/more.svg);
    background-size: 12px;
    background-repeat: no-repeat;
    background-position: 38px 18px;
    border-color: #e5e5ea;
    background-color: #ffffff;
}

.preciseTimeDropdown select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
}
.preciseTimeDropdown select:focus, .preciseTimeDropdown select:active,
.preciseTimeDropdown select:focus:active, .preciseTimeDropdown select:focus:hover {
    outline: none !important;
}

.preciseTimeDropdown select:nth-of-type(1) {
    border-radius: 4px 0 0 4px;
    border-right: 0px none;
}

.preciseTimeDropdown select:nth-of-type(2) {
    border-radius: 0 4px 4px 0;
}

.panel-title a.disabled {
    /*pointer-events: none;*/
}

.panel-title a.disabled span {
    color: #3c3c3c !important;
    opacity: 0.5;
}

.radio.disabled span {
    color: #3c3c3c !important;
}

.radio.disabled {
    pointer-events: none;
    opacity: 0.5;
}

.dateTabs .form-check-label {
    margin-bottom: 16px;
}

.dateTabs .tab-pane .preciseTime,
.dateTabs .tab-pane .panel-group {
    display: none;
}

.dateTabs ul.nav-tabs {
    display: flex;
}

.dateTabs.enabled .tab-pane.active .preciseTime,
.dateTabs.enabled .tab-pane.active .panel-group {
    display: block;
}

.recipientTime {
    padding: 16px 24px;
    display: none;
}

.recipientTime.enabled {
    display: block;
    padding: 24px;
}

.askRecipientText {
    margin-bottom: 16px;
    display: none;
}

.askRecipientText.enabled {
    display: block;
}

.recipientTime p {
    margin-bottom: 16px;
}

.recipientTime .radio {
    padding-left: 24px;
    font-size: 14px;
    line-height: 14px;
    font-weight: 400;
    color: #3c3c3c;
    margin: 0;
}

.recipientTime .radio + .radio {
    margin-top: 16px;
}

.recipientTime .radio input {
    margin-top: -1px !important;
}

.paymentContent .radio {
    padding-left: 23px;
    font-size: 14px;
    text-align: left;
    color: #3c3c3c;
    font-weight: 400;
    margin: 0;
    margin-top: 16px;
}

.paymentContent .radio:first-of-type {
    margin-top: 0px;
}

.paymentContent .radioChecked {
    margin-bottom: 8px
}

.ccData {
    margin-bottom: 8px;
    border-radius: 4px;
}

.ccData.cloudpayments {
    padding: 24px;
    border: solid 1px #e5e5ea;
}

.ccDate {
    max-width: 70px;
    margin-right: 4px;
    float: left;
}

.ccDate + .ccDate {
    margin-left: 6px;
}

.ccCvv {
    max-width: 92px;
    float: right;
}

.ccSelect {
    border: solid 1px #c7c7cc;
    border-radius: 3px;
    z-index: 1;
    display: block;
    width: 100%;
    height: 44px;
    margin-bottom: -44px;
    padding-left: 14px;
    position: relative;
    background-image: url('../images/checkout/more.svg');
    background-size: 12px;
    background-repeat: no-repeat;
    background-position: 225px 10px;
    -webkit-appearance: none;
    -moz-appearance: none;
    background-color: #fff;
}

.ccSelect:focus {
    border-color: #3c3c3c;
}

.ccNumberPlaceholderInput.newCard {
    position: relative;
    z-index: 2;
    margin-top: 56px;
}

.radioControl {
    display: none;
    margin-left: 23px;
}

.radioControl.card {
    display: block;
}

.ui-datepicker-inline {
    width: 100%;
}

.modal-header {
    height: 4px;
    padding: 0;
}

.modal-body h4 {
    font-size: 19px;
    color: #000000;
    margin-bottom: 16px;
    height: 24px;
    line-height: 24px;
}

.modal-body p {
    font-size: 14px;
    text-align: left;
    color: #000000;
    margin-bottom: 16px;
}

.modal-body {
    padding: 24px;
    border-radius: 8px;
}


.modal-sm {
    width: 320px;
}

.modal-content {
    box-shadow: none !important;
    border-radius: 8px;
    background-color: #fcfcfc;
    border: solid 1px #e5e5ea;
}

.modal-backdrop {
    opacity: 0.32 !important;
}

@keyframes modalZoomIn {
    from {
        opacity: 0;
        transform: scale3d(.3, .3, .3);
    }

    30% {
        opacity: 1;
    }
    90% {
        transform: scale3d(1.02, 1.02, 1.02);
    }
    100% {
        transform: scale3d(1, 1, 1);
    }
}

.modalZoomIn {
    animation-name: modalZoomIn;
    animation-duration: 0.25s;
}

@keyframes animateBlink {
    from {
        background-color: #ffffff;
    }
    50% {
        background-color: #ff5677;
    }
    to {
        background-color: #ffffff;
    }
}

.animateBlink {
    animation-name: animateBlink;
    animation-duration: 0.2s;
}

.radio input[type="radio"], .radio-inline input[type="radio"], .checkbox input[type="checkbox"], .checkbox-inline input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    background-image: url('../images/checkout/radio_inactive.svg');
    width: 16px;
    height: 16px;
    margin-top: 1px;
    margin-left: -24px;
    background-size: 16px 16px;
    background-position: center;
    border-radius: 50%;
    overflow: hidden;
}

.radio input[type="radio"]:checked, .radio-inline input[type="radio"]:checked, .checkbox input[type="checkbox"]:checked, .checkbox-inline input[type="checkbox"]:checked {
    background-image: url('../images/checkout/radio_active.svg');
    outline: none;
}

.prodWrapper {
    display: flex;
    flex-wrap: nowrap;
    flex: 1 1 auto;
}

.stepRestoreMobile {
    display: none;
}

.orderFollow {
    border-top: 1px solid #e5e5ea;
    padding: 24px;
    padding-bottom: 16px;
    margin-left: -24px;
    margin-right: -24px;
    margin-top: 24px;
}
.orderComment {
    margin-top: 0;
    margin-bottom: 20px;
    height: 56px;
}

.checkoutStep .btn-group {
    margin-bottom: 12px;
}

.checkoutStep .btn-group .btn {
    border-radius: 4px !important;
    border: solid 1px #c7c7cc;
    padding: 0 8px;
    height: 24px;
    line-height: 22px;
    font-size: 14px;
    color: #3c3c3c;
    margin-top: 12px;
    background-color: #fff;
    -webkit-transition: all 0s linear;
    transition: all 0s linear;
}

.checkoutStep .btn-group .btn.active, .checkoutStep .btn-group .btn:focus,
.checkoutStep .btn-group .btn:active, .checkoutStep .btn-group .btn:hover, .checkoutStep .btn-group .btn:focus:hover {
    border: solid 1px  #3c3c3c;
    background-color:  #3c3c3c;
    color: #ffffff;
    box-shadow: none;
    -webkit-box-shadow: none;
    outline: none !important;
}

.checkoutStep .btn-group .btn + .btn {
    margin-left: 8px;
}

.checkoutStep .btn-group .btn:focus, .checkoutStep .btn-group .btn:hover, .checkoutStep .btn-group .btn:active {
    outline: none !important;
}

#loginModal .modal-sm {
    width: 360px;
}

.loginModal {
    padding: 32px;
    padding-bottom: 24px;
}

.loginModal h3 {
    font-size: 23px;
    text-align: center;
    color: #000000;
    margin-bottom: 8px;
}

.loginInfo {
    min-height: 16px;
    line-height: 16px;
    font-size: 13px;
    color: #3c3c3c;
    margin-bottom: 0px !important;
    text-align: center !important;
}

.loginInfo.hasContent {
    margin-bottom: 16px !important;
}

.loginModal .btn-group .btn, .loginModal .btn-group .btn:hover {
    border-color: #000 !important;
    color: #3c3c3c;
    background-color: #fff;
    font-size: 13px;
    line-height: 24px;
    height: 24px;
    text-align: left;
    padding: 0 8px;

}

.loginModal .btn-group .btn:focus, .loginModal .btn-group .btn.focus {
    outline: none !important;
}

.loginModal .btn-group .btn.active {
    background-color: #000;
    color: #fff;
}

.loginModeSelector p {
    display: inline-block;
    height: 24px;
    line-height: 24px;
    font-size: 14px;
    margin-right: 6px;
}

.loginForm div .placeholderInput:last-of-type {
    margin-bottom: 8px;
}

.forgotPassword {
    font-size: 13px;
    color: #3c3c3c;
}

.forgotPassword:hover {
    color: #3c3c3c;
}

.btnLogin::after {
    content: 'ВОЙТИ';
}

.btnRegister::after {
    content: 'регистрация';
}

.btnRestore::after {
    content: 'восстановить';
}

.loginFooter {
    padding: 16px 0;
    text-align: center;
}

.loginRegister, .loginRegister:hover, .loginRegister:focus {
    font-size: 13px;
    text-align: center;
    color: #007aff;
    text-decoration: none;
}

.modal-header .close {
    margin-top: 8px;
    right: 0;
    margin-right: -32px;
    width: 24px;
    height: 24px;
    color: #fff;
    opacity: 1;
    font-size: 0;
    font-weight: 300;
    overflow: visible;
    background-image: url("../images/checkout/icon_close_white.svg");
    background-size: 24px 24px;
}

.modal-header .close:focus, .modal-header .close:active {
    outline: none;
}

.modal-header {
    height: 0px;
    border: 0px none;
}

.registerPromoInput {
    display: none;
    margin-bottom: 0;
    margin-top: 8px;
    margin-bottom: 0 !important;
}

.restoreForm {
    display: none;
}

.placeholderInput .inputDropdown {
    position: absolute;
    left: 0;
    bottom: 0;
    margin-top: 0;
    width: 100%;
}

.placeholderInput.dropdownActive {
    overflow: visible;
    z-index: 10;
}

.placeholderInput.dropdownActive input {
    border-color: #A1A1A1 !important;
}

.placeholderInput .inputDropdown {
    display: none;
}

.placeholderInput.dropdownActive .inputDropdown {
    display: block;
}

.dropdownActive input {
    border-radius: 4px 4px 0 0 !important;
    border-color: #A1A1A1 !important;
}

.inputDropdown ul {
    margin: 0;
    padding: 0;
    background-color: #fff;
    border: 1px solid #A1A1A1;
    border-top: 0px none;
    border-radius: 0 0 4px 4px;
}

.inputDropdown ul li {
    display: block;
    width: 100%;
    margin: 0;
}

.inputDropdown > ul > li + li {
    border-top: solid 1px #e5e5ea;
}

.inputDropdown ul li a {
    display: block;
    width: 100%;
    padding: 0 16px;
    height: 38px;
    line-height: 38px;
    font-size: 14px;
    text-align: left;
    color: #3c3c3c;
}

.inputDropdown ul li a:hover {
    background-color: #f8f8f8;
}

.inputDropdown ul li a:hover, .inputDropdown ul li a:focus {
    color: #3c3c3c;
    text-decoration: none;
}

.dropdownTrigger {
    position: absolute;
    right: 0;
    top: 0;
    height: 44px;
    width: 44px;
    /*background-image: url('../images/checkout/contacts.svg');*/
    background-size: 16px 16px;
    background-position: center;
    background-repeat: no-repeat;
}

.dropdownTrigger::before {
    content: '';
    display: block;
    position: absolute;
    left: -1px;
    top: 8px;
    width: 1px;
    height: 28px;
    background-color: #e5e5ea;
}

.dropdownTrigger img {
    width: 32px;
    height: 32px;
    display: block;
    margin: 7px auto 0;
    image-rendering: optimizeQuality;
    transform: scale(0.5);
}

.placeholderInput .inputIcon {
    position: absolute;
    right: 8px;
    top: 8px;
    width: 32px;
    height: 32px;
    transform: scale(0.5);
}

.placeholderInput .errorContainer {
    display: none;
}

.placeholderInput.inputErrorUnder {
    height: auto;
    background-color: #ff5677;
    border-radius: 3px;
}

.placeholderInput.inputErrorUnder .errorContainer {
    display: block;
    background-color: #ff5677;
    font-size: 11px;
    font-weight: 500;
    text-align: left;
    color: #ffffff;
    padding: 4px 16px;
    border-radius: 0 0 3px 3px;
}
.paymentError {
    background-color: #ff5677;
    font-size: 11px;
    font-weight: 500;
    text-align: left;
    color: #ffffff;
    padding: 4px 16px;
    border-radius: 3px;
    margin-bottom: 12px;
}

.placeholderInput.shortInput {
    width: 128px;
}

.ccNumberPlaceholderInput {
    margin-bottom: 0;
}

.ccNumberPlaceholderInput.newCard {
    margin-bottom: 12px;
}

.placeholderInput input {
    border-color: #e4e4e4 !important;
}

.placeholderInput input:focus {
    border-color: #A1A1A1 !important;
}

.placeholderInput.inputErrorUnder input, .placeholderInput.inputErrorUnder input:focus {
    border-color: #ff5677 !important;
}

.ui-datepicker-calendar tbody tr td, .ui-datepicker-calendar tbody tr td.ui-state-disabled, .ui-datepicker th {
    width: 30px;
    height: 29px;
    padding: 0;
    border: 0px none;
}

.ui-datepicker-calendar tbody tr td a, .ui-datepicker-calendar tbody tr td.ui-state-disabled span {
    padding: 0;
    text-align: center;
    width: 30px;
    height: 29px;
    line-height: 28px;
    margin-bottom: 4px;
    background: #fcfcfc !important;
    border-color: #fcfcfc !important;
    border-radius: 4px;
    color: #000;
    font-size: 15px;
}

.ui-datepicker-calendar tbody tr td a.ui-state-active {
    color: #fff !important;
    background: #000 !important;
    border-color: #000 !important;
}

.ui-widget.ui-widget-content {
    border: 0px none;
    background-color: #fcfcfc;
    padding-left: 0;
    padding-right: 0;
}

.ui-datepicker .ui-datepicker-header {
    background:  #fcfcfc;
    border: 0px none;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    margin-bottom: 26px;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    left: auto !important;
    right: auto !important;
    top: auto !important;
    display: inline-flex;
    position: relative !important;
    background-image: url('../images/checkout/calendar_left.svg');
    background-size: 8px;
    width: 24px;
    height: 24px;
    background-position: center;
    background-repeat: no-repeat;
}

.ui-datepicker .ui-datepicker-next {
    order: 3;
    transform: rotate(180deg);
}

.ui-datepicker .ui-datepicker-prev span, .ui-datepicker .ui-datepicker-next span {
    opacity: 0;
}

.ui-datepicker .ui-datepicker-prev:hover, .ui-datepicker .ui-datepicker-next:hover {
    background-color: #fff;
    border: 0px none;
}

.ui-datepicker .ui-datepicker-prev span {
    background-image: url('../images/checkout/calendar_left.svg');
}

.ui-datepicker .ui-datepicker-next span {
    background-image: url('../images/checkout/calendar_right.svg');
}

th.ui-datepicker-week-end span {
    color: #ff5677;
}

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight {
    color: #007aff;
}

.ui-datepicker-title {
    margin: 0 30px !important;
    font-size: 19px;
    line-height: 24px !important;
    height: 24px;
    font-weight: 400;
    color: #000000;
    align-content: center;
    width: 132px !important;
}

.ui-datepicker thead {
    height: 42px;
}

.ui-datepicker thead::after {
    content: '';
    display: block;
    position: absolute;
    left: 0;
    top: 105px;
    width: 100%;
    height: 1px;
    background-color: #e5e5ea;
}

.ui-datepicker th {
    font-weight: 400;
    font-size: 15px;
    padding-bottom: 14px;
}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default {
    line-height: 27px;
}

#calendarModal .modal-content {
    background-color: #fcfcfc;
}
#calendarModal .modal-sm {
    width: 347px;
}
#calendarModal .modal-body {
    padding: 16px;
    padding-top: 21px;
}
#calendarModal .ui-datepicker-title {
    margin: 0 12px !important;
    font-size: 17px;
}
#calendarModal .ui-datepicker .ui-datepicker-header {
    margin-bottom: 23px;
}
#calendarModal thead span {
    margin-left: -12px;
}
#calendarModal table {
    margin-left: 0px;
    background-color: #fcfcfc;
}
#calendarModal .ui-state-default, #calendarModal .ui-widget-content .ui-state-default, #calendarModal .ui-widget-header .ui-state-default {
    margin-bottom: 3px;
}
#calendarModal .ui-datepicker thead::after {
    top:98px
}
#calendarModal .btnStepSubmit {
    max-width: 299px;
    margin: 24px auto 8px;
}

#calendarModal .ui-datepicker .ui-datepicker-header {
    margin-left: -16px;
}
#calendar {
    margin-left: 8px;
    margin-right: -8px;
}
#calendar::after {
    position: absolute;
    left: 0;
    bottom: 87px;
    width: 100%;
    height: 1px;
    background-color: #e5e5ea;
    content: '';
}
#calendarModal .ui-state-default, #calendarModal .ui-widget-content .ui-state-default, #calendarModal .ui-widget-header .ui-state-default {
    border-color: transparent !important;
    background: transparent !important;
}
#calendarModal .ui-state-default.ui-state-active, #calendarModal .ui-widget-content .ui-state-default.ui-state-active, #calendarModal .ui-widget-header .ui-state-default.ui-state-active {
    border-color: #000 !important;
    background: #000 !important;
}

.cityDropdown ul li a span {
    display: block;
    width: 100%;
    font-size: 11px;
    height: auto;
    line-height: 16px;
    color: #8e8e93;
}

.cityDropdown ul li a {
    line-height: 13px;
    padding: 14px;
    height: auto;
}

.onTop {
    z-index: 100;
    position: relative;
}

#dateNavTabs.highlightActive li.active a {
background-color: #f6f6f6;
}
.img.inputIcon, img.popupText {
    image-rendering: optimizeQuality;
}

.cartQuantMinus {
    line-height: 13px !important;
    border-radius: 3px 0 0 3px;
}

.cartQuantPlus {
    line-height: 13px !important;
    border-radius: 0 3px 3px 0;
}

.ymaps-map {
    max-width: 592px !important;
    max-height: 328px !important;
}

.modal-lg {
    width: 640px;
}

.modal-lg .pickupMap {
    margin-top: 0;
    /*height: 328px !important;*/
    margin-bottom: 24px;
}

.dateSelectMobile {
    display: none;
    overflow: hidden;
}

input, input:focus, input:active {
    -webkit-appearance: none;
}

.modal-body h4.warning {
    padding-left: 32px;
    position: relative;
    line-height: 26px;
}

.modal-body h4.warning::before {
    width: 24px;
    height: 24px;
    content: '' !important;
    display: block;
    position: absolute;
    left: 0px;
    top: 0;
    background-color: transparent;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    background-image: url("../images/checkout/warning.svg");
    background-size: 24px;
}

.todayWarning {
    padding: 20px 24px 16px 56px;
    position: relative;
    font-size: 14px;
    line-height: 16px;
    text-align: left;
    color: #3c3c3c;
    background-color: #f6f6f6;
}
.todayWarning::before {
    width: 24px;
    height: 24px;
    content: '!';
    display: block;
    position: absolute;
    left: 24px;
    top: 16px;
    background-color: #ff9500;
    border-radius: 50%;
    color: #fff;
    text-align: center;
    font-size: 24px;
    line-height: 24px;
}

.has-error {
    background-color: #ff5677;
    border-radius: 4px;
}

.has-error .help-block {
    color: #fff !important;
    font-size: 11px;
    font-weight: 500;
    padding: 4px 16px;
}

.paymentMethodsLogos {
    display: none;
    /*position: absolute;*/
    /*right: 24px;*/
    /*top: 29px;*/
}

.paymentMethodsLogos img + img {
    margin-left: 12px;
}

.checkoutStepActive {
    position: relative;
}
@media (max-width: 767px) {
    .checkoutStepActive {
        overflow-x: hidden;
    }
}

.checkoutStepActive .paymentMethodsLogos {
    display: flex;
    align-items: center;
    /*justify-content: flex-end;*/
}

.dateTabs.error .nav-tabs li a {
    border-top-color: #ff5677 !important;
}

.dateTabs.error .nav-tabs li:first-of-type > a {
    border-left-color: #ff5677 !important;
}

.dateTabs.error .nav-tabs li:last-of-type > a {
    border-right-color: #ff5677 !important;
}

.dateTabs.error .tab-content {
    border-left-color: #ff5677 !important;
    border-right-color: #ff5677 !important;
    border-bottom-color: #ff5677 !important;
    border-radius: 0;
}

.field-orderDeliveryTime-date.has-error {
    border-radius: 0 0 4px 4px;
}

.disabledForm {
    pointer-events: none;
    opacity: 1;
}
.disabledForm .stickyContent, .disabledForm .sidebarMobileTrigger {
    opacity: 0.4;
}
.disabledForm::before{
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    width: 72px;
    height: 56px;
    margin-top: -28px;
    margin-left: -36px;
    background-color: #000;
    border-radius: 18px;
    z-index: 1;
}
.disabledForm::after {
    width: 24px;
    height: 24px;
    content: '';
    position: absolute;
    left: 50%;
    top: 50%;
    margin-top: -12px;
    margin-left: -12px;
    background-image: url("../images/loading/loader.svg");
    animation: animateSpin 2s linear infinite;
    z-index: 2;
}
.btnStepSubmit.animated::before {
    content: '';
    display: block;
    position: absolute;
    left:50%;
    top:50%;
    width: 24px;
    height: 24px;
    margin-left: -12px;
    margin-top: -12px;
    animation: animateSpin 2s linear infinite !important;
}

@keyframes animateSpin {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(360deg);
    }
}

@media (min-width: 991px) {
    .stickyContent.sticky {
        position: fixed;
        width: 345px;
        top: 0;
    }
}

@media (max-width: 767px) {
    #cartProductsForm .sidebarProducts {
        margin-top: 0;
        border-radius: 0;
        border-top: 0px none;
    }
    #checkoutStepOne {
        margin-top: 52px;
    }
}
@media (min-width: 768px) {
    .sidebarProducts {
        margin-top: 28px;
    }
}

@media (max-width: 767px) {
    .sidebarMobileTrigger p {
        font-size: 17px;
        font-weight: 400;
        color: #3c3c3c;
        height: 53px;
        line-height: 53px;
        background-color: #fff;
        border-radius: 4px 4px 0 0;
        padding: 0 24px;
        margin-top: 16px;
        border: solid 1px #e5e5ea;
        position: relative;
    }

    .sidebarMobileTrigger p::after {
        content: '';
        display: block;
        position: absolute;
        left: 101px;
        top: 19px;
        width: 8px;
        height: 16px;
        background-image: url(../images/checkout/left.svg);
        transform: rotate(90deg);
    }

    .sidebarMobileTrigger.cartClosed p {
        border-radius: 4px;

    }

    .sidebarMobileTrigger.cartClosed p::after {
        transform: rotate(-90deg);
    }



    .singleProduct .prodTitle {
        display: block; /* Fallback for non-webkit */
        display: -webkit-box;
        height: 32px; /* Fallback for non-webkit */
        margin: 0 auto;
        font-size: 13px;
        line-height: 16px;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        font-weight: 400;
    }

    .prodWrapper {
        flex-wrap: wrap;
        flex: 1 1 auto;
    }
    .singleProduct .prodTitle {
        margin: 0;
        width: 100%;
    }

    .prodActions {
        flex-wrap: nowrap;
        width: 100%;
        display: flex;
        justify-content: flex-start;
        align-items: center;
        margin-top: 8px;
    }

    .prodActions p, .prodActions .prodDelete, .prodActions .counter {
        display: flex;
        flex: 1;
        order: 1;

    }
    .prodActions p {
        font-weight: 400;
    }

    .prodActions .counter {
        flex: initial;
        margin: 0;
    }
    .prodActions .counterMobile {
        height: 24px;
    }
    .counterMobile select {
        -webkit-appearance: none;
        -moz-appearance: none;
        height: 24px;
        width: 48px;
        border-radius: 3px;
        background-color: #ffffff;
        border: solid 0.5px #e5e5ea;
        padding-left: 12px;
        background-image: url("../images/checkout/down_small.svg");
        background-repeat: no-repeat;
        background-size: 8px 8px;
        background-position: 28px 6px;
        font-size: 13px;
        line-height: 24px;
    }
    .counterMobile select:focus {
        outline: none;
    }

    .prodActions .prodDelete {
        order: 2;
        background-image: url('../images/checkout/icon_delete_mobile.svg');
        background-position: left center;
        background-repeat: no-repeat;
        width: 16px;
        height: 20px;
        font-size: 0;
        flex: initial;
        margin: -2px 16px 0;
        background-size: 16px;
    }

    .prodActions p {
        order: 3;
        flex: 0 1 auto;
        margin-left: auto;
    }

    .stepRestore, .checkoutStep .count a {
        display: none;
    }

    .stepRestoreMobile {
        display: none;
        width: 100%;
        border-radius: 0 0 4px 4px;
        background-color: #fcfcfc;
        border: solid 1px #e5e5ea;
        font-size: 13px;
        letter-spacing: 1.5px;
        text-align: center;
        color: #000000;
        height: 40px;
        line-height: 40px;
    }

    .stepRestoreMobile:hover, .stepRestoreMobile:focus {
        text-decoration: none;
        color: #000;
    }

    .stepRestoreMobile.active, .checkoutStepFinished + .stepRestoreMobile {
        display: block !important;
    }

    .checkoutStepFinished {
        border-bottom: 0px none;
        border-radius: 4px 4px 0 0;
    }

    .form-check-label {
        align-items: flex-start;
    }

    .form-check-label input[type='checkbox'] {
        margin-top: 0px;
    }

    .form-check-label span {
        height: auto;
    }

    .doubleInput .placeholderInput {
        width: 48%;
    }

    .placeholderInput input, .phoneInput {
        font-size: 13px !important;
    }

    .tab-content {
        margin-right: 0px;
        width: 100% !important;
    }

    .nav-tabs > li > a > img {
        margin: 4px 0 0;
    }

    .ccDate {
        width: 48px;
    }

    .ccDate + .ccDate {
        margin-left: 8px;
    }

    .ccCvv {
        width: 84px;
    }

    .ccData {
        padding: 16px;
    }
    .paymentLinkWrap .ccData {
        padding: 0;
    }

    .dateTabs ul.nav-tabs {
        margin-left: 0;
        margin-right: 0px;
    }

    .headerBack {
        display: flex;
        align-items: center;
        font-size: 13px;
        height: 24px;
        margin-top: -0px;
    }

    .headerBack img {
        margin-left: 0 !important;
        margin-top: 0 !important;
    }

    .textLogoMobile {
        font-size: 15px;
        letter-spacing: -0.5px;
        text-align: center;
        color: #000000;
        font-weight: 900;
        height: 24px;
        line-height: 24px;
    }
    a.textLogoMobile:hover, a.textLogoMobile:focus, a.textLogoMobile:hover:focus {
        text-decoration: none !important;
        color: #000000 !important;
    }

    .headerMobile div {
        padding-left: 0;
        padding-right: 0;
    }

    select.quantitiyMobile {
        border-radius: 3px;
        background-color: #ffffff;
        border: solid 0.5px #e5e5ea;
        -webkit-appearance: none;
        width: 48px;
        height: 24px;
        line-height: 23px;
        padding-left: 12px;
        background-image: url("../images/checkout/more.svg");
        background-size: 16px 16px;
        background-position: 26px 3px;
        background-repeat: no-repeat;
    }

    .tipsShown .tipsText {
        left: 0 !important;
        width: 100% !important;
        background-color: #000000;
        border: solid 0.5px #e5e5ea;
        height: auto !important;
    }

    .tipsText p {
        color: #ffffff;
        margin-right: 24px;
    }

    .tipsClose {
        position: absolute;
        right: 16px;
        top: 16px;
        width: 16px;
        height: 16px;
        background-image: url("../images/checkout/icon_close_white.svg");
        background-size: 16px 16px;
    }

    .checkoutStep .btn-group .btn + .btn {
        margin-left: 8px;
    }

    .checkoutStep .btn-group .btn {
        padding: 0 6px;
    }

    .modal {
        margin: 100px 0 0;
    }

    .modal-dialog {
        margin: 0 auto;
    }

    .modal-header {
        position: relative;
        z-index: 1;
    }

    .modal-header .close {
        margin-right: 24px;
        margin-top: 24px;
        background-image: url("../images/checkout/icon_close_black.svg");
    }

    #mapModal .modal-body {
        padding-top: 48px;
    }


    #mapModal .modal-content {
        border-radius: 0px;
        margin-top: 0 !important;
        height: 100% !important;
    }
    #mapModal .modal-dialog {
        margin-top: 0 !important;
    }
    .modalAddrInput {
        flex-wrap: wrap;
    }
    .modalAddrInput .placeholderInput {
        padding-right: 0 !important;
        text-align: center;
        min-height: 0 !important;
        font-size: 13px !important;
        margin-bottom: 16px !important;
    }

    #deliveryMap {
        position: relative;
        margin-top: 16px !important;
        margin-bottom: 16px !important;
    }



    .dateSelectMobile {
        display: block;
        opacity: 0;
        width: 60px;
        -webkit-appearance: none;
        -moz-appearance: none;
        border: 0px none;
        height: 59px;
        overflow: hidden;

    }

    #dateNavTabs li:last-of-type {
        background-image: url("../images/checkout/icon_calendar.svg");
        background-size: 24px 24px;
        background-position: center;
        background-repeat: no-repeat;
        border-top: 1px solid #ddd;
        border-right: 1px solid #ddd;
        border-radius: 0 4px 0 0;
    }
    #dateNavTabs li:last-of-type:hover {
        border-bottom: 1px solid #e5e5ea;
    }
    .error #dateNavTabs li:last-of-type {
        border-top-color: #ff5677 !important;
        border-right-color: #ff5677 !important;
    }

    .deleted .prodActions .prodDelete {
        background-image: url("../images/checkout/return.svg");
        width: 20px;
        height: 20px;
        background-size: 20px 20px;
    }

    body {
        padding-bottom: 24px;
    }
}

.thanksData {
    text-align: center;
}

.thanksData h1 {
    font-size: 24px;
    font-weight: 400;
    text-align: center;
    color: #000000;
    height: auto;
    line-height: 24px;
    margin-top: 40px;
    margin-bottom: 8px;
}

.thanksData p {
    font-size: 13px;
    text-align: center;
    color: #000000;
    height: 16px;
    line-height: 16px;
    margin-bottom: 32px;
}

.thanksData p a {
    font-weight: 500;
    color: #007aff;
    text-decoration: underline;
}

.colLeftContainer {
    max-width: 352px;
    text-align: center;
    margin: 0 auto;
}

.colContainer h3 {
    font-size: 24px;
    font-weight: 100;
    height: 29px;
    line-height: 29px;
    margin-bottom: 16px;
    color: #3c3c3c;
}

.colContainer p {
    font-size: 13px;
    line-height: 21px;
    text-align: center;
    color: #3c3c3c;
}

.promoContainer {
    display: flex;
    margin-top: 16px;
    align-items: center;
    justify-content: center;
}

.promoContainer .promoOutput {
    border-radius: 3px;
    background-color: #ffffff;
    border: solid 1px #c7c7cc;
    display: inline-flex;
    height: 44px;
    line-height: 44px;
    font-size: 14px;
    text-align: center;
    color: #3c3c3c;
    padding: 0 16px;
    margin-right: 8px;
}

.promoContainer a {
    font-size: 13px;
    color: #007aff;
}

.promoContainer a:focus {
    text-decoration: none;
}
@media (max-width: 767px) {
    .verticalCenter.visible-xs {
        display: flex !important;
    }

    #checkoutStepOne::before {
        display: block;
        position: absolute;
        left: 0;
        top: -32px;
        height: 24px;
        line-height: 24px;
        width: 100%;
        font-size: 17px;
        text-align: center;
        color: #000000;
        content: 'Оформление заказа';
    }
}
@media (max-width: 768px) {
    .thanksData h1 {
        margin-top: 24px;
    }

    .thanksData {
        position: relative;
    }

    .thanksData::after {
        position: absolute;
        left: 0;
        bottom: 24px;
        width: 100%;
        height: 1px;
        background-color: #e5e5ea;
        content: '';
        display: block;
    }

    .colContainer h3 {
        font-size: 21px;
        font-weight: 300;
        text-align: center;
        height: 25px;
        line-height: 25px;
        margin-bottom: 8px;
    }

    .thanksData p {
        height: auto;
        margin-bottom: 48px;
    }

    .colContainer p {
        text-align: center;
    }

    .promoContainer {
        justify-content: center;
        margin-top: 16px;
    }

    .singleProduct.deleted {
        opacity: 1;
    }
    .singleProduct.deleted .prodImg, .singleProduct.deleted .prodTitle, .singleProduct.deleted .counterMobile, .singleProduct.deleted .prodActions p {
        opacity: 0.5;
        pointer-events: none;
    }
    #mapModal .modal-body {
        padding: 16px;
        padding-top: 48px;
    }
    #mapModal .modal-body::before {
        content: 'Адрес доставки';
        position: absolute;
        left: 16px;
        top: 25px;
        font-size: 19px;
        color: #000;
    }
    #mapModal .modal-dialog {
        height: 100%;
    }
    #mapModal .modal-header .close {
        margin-right: 16px;
    }

    .dropdownActive .preciseTimeMobile input[type='time'] {
        -webkit-appearance: none;
        -moz-appearance: none;
        border: 1px solid #e5e5ea;
        width: 136px;
        height: 44px;
        line-height: 44px;
        border-radius: 4px !important;
        background-image: url(../images/checkout/more.svg);
        background-size: 24px 24px;
        background-repeat: no-repeat;
        background-position: 100px 10px;
        border-color: #e5e5ea !important;
        padding-left: 16px;
        margin-top: 16px;
    }
    .dropdownActive .preciseTimeMobile input[type='time']:focus {
        outline: none;
    }
}



.pickupTime .preciseTime .radio {
    margin: 0;
    height: 14px;
    line-height: 14px;
}
.pickupTime .preciseTime {
    padding: 16px;
    padding-top: 18px;
}
.pickupTime .preciseTime.dropdownActive .preciseTimeDropdown {
    padding-left: 0px;
    padding-bottom: 0;
    height: 60px;
}
.pickupTime .tab-content {
    border-radius: 0 0 4px 4px;
}

.nav-tabs {
    border-bottom: 0px none;
}
.nav-tabs > li {
    border-bottom: 1px solid #e5e5ea;
    margin-bottom: 0;
}
.nav-tabs > li.active, .nav-tabs > li:hover, .nav-tabs > li.active:hover {
    border-bottom: 0px none;
}
.nav-tabs > li > a {
    min-width: 0;
}
.nav-tabs > li > a > img {
    margin: 4px 14px 0;
}
.nav-tabs > li:first-of-type > a {
    padding-left: 8px;
}
.radio-inline, .checkbox-inline {
    padding-left: 24px;
}
.radio-inline + .radio-inline, .checkbox-inline + .checkbox-inline {
    margin-left: 16px;
}
.deliveryMethod {
    display: flex;
}
.deliveryMethod .radio-inline {
    display: inline-flex;
}

.modalAddrInput {
    align-items: center;
    justify-content: space-between;
}
.modalAddrInput .placeholderInput {
    flex: 0 1 auto;
    margin: 0;
    height: auto;
    padding-right: 24px;
    min-height: 40px;
    font-size: 15px;
    color: #000;
}
.modalAddrInput .btnSubmitMap {
    width: 160px;
    flex: 1 0 auto;
    margin: 0;
}
.modalAddrInput .btnSubmitMap::after {
    content: 'АДРЕС ВЕРНЫЙ';
}

.ccSelect + .ccNumberPlaceholderInput {
    margin-bottom: 0 !important;
}
.ccSelect + .ccNumberPlaceholderInput.newCard {
    margin-bottom: 12px !important;
}

.btnStepSubmit.btnOrderSubmit, .btnStepSubmit.btnOrderSubmit:hover, .btnStepSubmit.btnOrderSubmit:focus {
    background-color: #007aff;
    border-color: #007aff;
    margin-top: 0 !important;
}

.btnStepSubmit.btnOrderSubmit::after {
    content: 'ОПЛАТИТЬ';
}

.btnStepSubmit.btnOrderSubmit.btnOrder::after {
    content: 'ОФОРМИТЬ ЗАКАЗ';
}
.btnStepSubmit.btnOrderSubmit.btnOrder.animated::after {
    content: 'ПОДОЖДИТЕ';
}
.btnStepSubmit.btnOrderSubmit.btnPaymentDisabled {
    pointer-events: none;
}
.btnStepSubmit.btnOrderSubmit.btnPaymentDisabled::after {
    content: 'ВВЕДИТЕ ДАННЫЕ';
}

.applePay {
    background-color: #000;
    border-color: #000;
}
.googlePay {
    background-color: #000;
    border-color: #000;
    padding: 12px 0px 10px !important;
}
.mobilePayment{
    display: flex;
    justify-content: space-between;
}
.mobilePayment .mp-visible+.mp-visible{
    margin-left: 10px;
}

.applePay::after {
    content: '';
    background-image: url("../images/checkout/apple-pay-logo.svg");
    background-size: 51px 24px;
    background-repeat: no-repeat;
    background-position: center 7px;
    width: 100%;
    height: 100%;
    left: 0;
    color: #fff;
    text-align: left;
    position: absolute;
}
/*.googlePay::after {*/
    /*content: '';*/
    /*background-image: url("../images/checkout/google-pay-logo.svg");*/
    /*background-size: 51px 24px;*/
    /*background-repeat: no-repeat;*/
    /*background-position: center 7px;*/
    /*width: 100%;*/
    /*height: 100%;*/
    /*left: 0;*/
    /*text-align: left;*/
    /*position: absolute;*/
/*}*/
.noMarginTop {
    margin-top: 0 !important;
}
.errorBorderFix.has-error input[type='text'], .errorBorderFix.has-error input[type='password'], .errorBorderFix.has-error input[type=tel] {
    border-color: #c7c7cc !important;
}
.errorBorderFix .help-block {
    display: none !important;
}
.ccData.invoice, .radioControl.cash {
    padding: 0;
}

.dropdownActive .radio input[type='radio'] {
    border-radius: 50% !important;
}
.dropdownActive .radio input[type='radio']:checked {
    border-color: #000 !important;
}
.form-check-label img, img.popupText {
    width: 16px;
    height: 16px;
}
#checkoutStepFive.checkoutStepFinished .count {
    margin-bottom: 0;
}
.field-noSendStatus {
    margin-bottom: 0;
    height: 16px;
}
.checkoutStep .btn-group {
    margin-bottom: 0;
}

@media (min-width: 992px) {
    .container {
        width: 764px;
    }
}
@media (max-width: 414px) {
    .ccDate {
        max-width: 47px;
        margin-right: 0;
    }
    .ccCvv {
        max-width: 80px;
    }
    .checkoutStep .btn-group .btn + .btn {
        margin-left: 4px;
    }
    .checkoutStep .btn-group .btn {
        padding: 0 3px;
    }
    #chatra {
        transform: scale(0.75) !important;
    }
    #chatra.chatra--expanded {
        transform: scale(1) !important;
    }
    #bonusesModal .modal-content {
        margin-top: -78%;
    }
    #promocodeModal .modal-content {
        margin-top: -70%;
    }
    .ccSelect {
        /*background-position: 160px 18px !important;*/
    }
    .tipsShown .tipsText {
        width: 288px !important;
        left: -24px !important;
    }
    .ccNumberPlaceholderInput.tipsShown .tipsText {
        left: -50px !important;
    }
    .ccCvv.tipsShown .tipsText {
        left: -38px !important;
    }
    .nav-tabs > li:first-of-type > a {
        padding-left: 4px;
    }
    .dateSelectMobile {
        width: 44px;
    }
    #checkoutStepFive.checkoutStepPassive {
        height: 75px;
    }
    .headerDropdownMenu > a {
        font-size: 0 !important;
        margin-right: 0 !important;
        margin-left: 8px !important;
        display: inline-flex;
        order: 2;
    }
}
@media (min-width: 768px) {
    .headerDropdownMenu .img-circle {
        display: none !important;
    }
}

#checkoutStepOne .form-check-label + .placeholderInput {
    margin-top: 8px;
}
#checkoutStepOne .smallText {
    font-size: 13px;
    line-height: 16px;
    color: #3c3c3c;
}

.overflowScroll::-webkit-scrollbar {
    width: 4px;
}

/* Track */
.overflowScroll::-webkit-scrollbar-track {
    background: transparent;
}

/* Handle */
.overflowScroll::-webkit-scrollbar-thumb {
    background: #000000;
    border-radius: 2px;
    opacity: 0.55;
}
.overflowScroll {
    overflow-y: scroll;
    overflow-x: hidden;
    padding-right: 8px;
}

@media (max-width: 767px) {
    .field-cartform-cartproducts {
        max-height: none !important;
    }
    .overflowScroll {
        overflow: visible !important;
        max-height: none !important;
    }
}

/*ROISTAT PROMO BOX*/
.roistat-promo-wrap {
    display: flex;
    padding: 4px 8px !important;
    border-radius: 0 3px 0 0;
    border-top: 1px solid #e5e5ea;
    border-right: 1px solid #e5e5ea;
    background-color: #ffffff;
    opacity: 1 !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    color: #000 !important;
    z-index: 100000 !important;
}
.roistat-promo-text {
    font-size: 0 !important;
}
.roistat-promo-text::after {
    content: 'Ваш код: ';
    display: inline-block;
    font-size: 11px !important;
    margin-right: 2px;
}


.modal.in {
    display: -webkit-box !important;
    display: -webkit-flex !important;
    display: -ms-flexbox !important;
    display: flex !important;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.modal.in .modal-content {
    margin: 0;
}

#checkoutStepOne .btnStepSubmit.animated::before,
#checkoutStepTwo .btnStepSubmit.animated::before,
#checkoutStepThree .btnStepSubmit.animated::before,
#checkoutStepFour .btnStepSubmit.animated::before
{
    margin-left: 56px;
}

.btnStepSubmit.btnOrderSubmit.btnPay::after {
    left: -10px;
}

#sbpBanksList {
    margin: 0;
    padding: 0;
    height: 100%;
    z-index: 10000;
}

#sbpBanksList .modal-content {
    margin-top: 0 !important;
    height: 100%;
    border: 0px none;
    border-radius: 0px;
}

#sbpBanksList:not(#dateLocationModal) > .modal-dialog {
    margin: 0 !important;
    height: 100%;
    width: 100%;
}

#sbpBanksList .h3 {
    margin-top: 0;
}

ul.banks-list img {
    height: 25px;
    margin-right: 10px;
}

ul.banks-list li {
    list-style: none;
    margin: 10px 0;
    padding: 10px;
    box-shadow: 0 0 10px 5px #eee;
    font-size: 125%;
}

#sbpBanksList .modal-body {
    padding: 24px 15px 5px 15px;
    margin-bottom: 103px;
}

#sbpBanksList .modal-footer {
    position: fixed;
    bottom: 0;
    display: block;
    width: 100%;
    text-align: center;
}

#sbpBanksList .modal-footer .btnStepSubmit {
    margin: 0;
    height: auto;
    line-height: 25px;
    padding: 10px;
    white-space: normal;
}

#sbpBanksList .modal-header .close {
    margin-left: 10px;
}

#sbpBanksList .search {
    position: relative;
    margin-bottom: 16px;
}

#sbpBanksList .search input {
    -webkit-appearance: none;
    border-radius: 4px;
    background-color: #f0f0f0;
    border: solid 1px #f0f0f0;
    height: 40px;
    line-height: 1;
    font-size: 18px;
    text-align: left;
    color: #000000;
    padding-left: 12px;
    width: 100%;
    z-index: 10;
    background-image: url(../images/header_new/search.svg);
    background-repeat: no-repeat;
    background-position: right 12px top 10px;
    background-size: 18px 18px;
}



.refreshLoader.active {
    display: flex;
}
.refreshLoader img {
    animation: animateSpin 2s linear infinite;
}


/*LOADER FOR PJAX*/
.refreshLoader {
    display: none;
    align-items: center;
    align-content: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    border-radius: 4px;
    background-color: #000;
    position: fixed;
    left: 50%;
    top: 50%;
    margin-left: -20px;
    margin-top: -20px;
    z-index: 1000;
}

@media (max-width:767px) {
    #loginModal.loading .refreshLoader img {
        width: 30px;
    }
}

@media (min-width:768px) {
    #loginModal.loading .modal-content {
        height: 100px;
    }
}

#loginModal.loading .loginModal {
    background: none;
}

#loginModal.loading .refreshLoader {
    background: none;
}

.sbp-convenient-label {
    border-radius: 5px;
    padding: 1px 6px;
    background-color: #448f2a;
    font-size: 12px;
    color: #dff0d8;
    top: -1px;
    position: relative;
    margin: 0 1px;
}

#calndarPick.btnStepSubmit.animated::before
{
    margin-left: 57px;
}