.newyork-text {
    font-family: 'NewYork', sans-serif !important;
}

.rustic-text {
    font-family: 'Rustic Roadway - Personal use', sans-serif;
}

.seo-h1 {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0
}

.button--secondary,
.button--secondary:visited {
    cursor: pointer;
    display: inline-block;
    font-family: inherit;
    font-size: inherit;
    line-height: 15px;
    outline: 0;
    text-align: center;
    text-decoration: none;
    text-shadow: none;
    transition: border .9s ease-in-out;
    font-weight: 400;
    color: #0090e3;
    background: #fff;
    box-shadow: none;
    padding: 15px
}

.button--full-width {
    min-width: 385px
}

.icon-with-text {
    display: inline-flex;
    align-items: flex-start
}

.icon-with-text__icon {
    flex-shrink: 0;
    margin-right: 8px;
    margin-top: -2px
}

.icon-svg--color-silver {
    fill: #000000;
    color: #ccc
}

.icon-svg--color-blue {
    fill: #dd0d96;
    color: #dd0d96
}

.icon-svg {
    display: inline-block;
    vertical-align: middle;
    height: 16px;
    width: 16px
}

.heart-full {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0
}

.btn__effect {
    display: inline-block;
    position: relative
}

.effect-group {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    transform: rotate(25deg)
}

.effect-group .effect {
    display: block;
    position: absolute;
    top: 38%;
    left: 50%;
    width: 20px;
    transform-origin: 0px 2px
}

.effect-group .effect:nth-child(2) {
    transform: rotate(72deg)
}

.effect-group .effect:nth-child(3) {
    transform: rotate(144deg)
}

.effect-group .effect:nth-child(4) {
    transform: rotate(216deg)
}

.effect-group .effect:nth-child(5) {
    transform: rotate(288deg)
}

.effect-group .effect:before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    border-radius: 1.5px;
    height: 3px;
    background: #0090e3
}

.effect-group .effect:after {
    content: "";
    display: block;
    position: absolute;
    top: 10px;
    right: 10%;
    border-radius: 50%;
    width: 3px;
    height: 3px;
    background: #f60;
    transform: scale(0, 0)
}

.active .heart-stroke {
    opacity: 0
}

.active .heart-full,
.deactivate .broken-heart {
    opacity: 1
}

.active .icon-svg {
    -webkit-animation: .5s linear bounceIn;
    animation: .5s linear bounceIn
}

.active .effect:before {
    -webkit-animation: .5s linear .1s fireworkLine;
    animation: .5s linear .1s fireworkLine
}

.active .effect:after {
    -webkit-animation: .5s linear .1s fireworkPoint;
    animation: .5s linear .1s fireworkPoint
}

.broken-heart {
    position: absolute;
    left: -16px;
    top: 0;
    opacity: 0
}

.broken-heart--left {
    transform: rotate(0);
    transform-origin: 60% 200%
}

.broken-heart--right {
    transform: rotate(0);
    transform-origin: 63% 200%
}

.broken-heart--crack {
    stroke-dasharray: 15;
    stroke-dashoffset: 15
}

.deactivate .broken-heart--left {
    -webkit-animation: .35s cubic-bezier(.68, -.55, .265, 2.85) .15s forwards crackLeft, .25s ease-in .55s forwards hide;
    animation: .35s cubic-bezier(.68, -.55, .265, 2.85) .15s forwards crackLeft, .25s ease-in .55s forwards hide
}

.deactivate .broken-heart--right {
    -webkit-animation: .35s cubic-bezier(.68, -.55, .265, 2.85) .15s forwards crackRight, .25s ease-in .55s forwards hide;
    animation: .35s cubic-bezier(.68, -.55, .265, 2.85) .15s forwards crackRight, .25s ease-in .55s forwards hide
}

.deactivate .broken-heart--crack {
    -webkit-animation: .2s ease-in forwards crack;
    animation: .2s ease-in forwards crack
}

.button.one.desktop:not(.active):hover .heart-stroke {
    -webkit-animation: 1s ease-out infinite pulse;
    animation: 1s ease-out infinite pulse
}

.button.two.desktop:not(.active):hover .heart-stroke {
    -webkit-animation: 1s ease-out infinite pulseBlue;
    animation: 1s ease-out infinite pulseBlue
}

@-webkit-keyframes pulse {
    0% {
        opacity: 1;
        transform-origin: center center;
        transform: scale(1)
    }

    50% {
        opacity: .6;
        transform: scale(1.15)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

@keyframes pulse {
    0% {
        opacity: 1;
        transform-origin: center center;
        transform: scale(1)
    }

    50% {
        opacity: .6;
        transform: scale(1.15)
    }

    100% {
        opacity: 1;
        transform: scale(1)
    }
}

@-webkit-keyframes pulseBlue {
    0% {
        transform-origin: center center;
        transform: scale(1);
        fill: #cccccc
    }

    50% {
        transform: scale(1.15);
        fill: #0090e3
    }

    100% {
        transform: scale(1);
        fill: #cccccc
    }
}

@keyframes pulseBlue {
    0% {
        transform-origin: center center;
        transform: scale(1);
        fill: #cccccc
    }

    50% {
        transform: scale(1.15);
        fill: #0090e3
    }

    100% {
        transform: scale(1);
        fill: #cccccc
    }
}

@-webkit-keyframes fireworkLine {
    0% {
        right: 20%;
        transform: scale(0, 0)
    }

    25% {
        right: 20%;
        width: 6px;
        transform: scale(1, 1)
    }

    35% {
        right: 0;
        width: 35%
    }

    70% {
        right: 0;
        width: 4px;
        transform: scale(1, 1)
    }

    100% {
        right: 0;
        transform: scale(0, 0)
    }
}

@keyframes fireworkLine {
    0% {
        right: 20%;
        transform: scale(0, 0)
    }

    25% {
        right: 20%;
        width: 6px;
        transform: scale(1, 1)
    }

    35% {
        right: 0;
        width: 35%
    }

    70% {
        right: 0;
        width: 4px;
        transform: scale(1, 1)
    }

    100% {
        right: 0;
        transform: scale(0, 0)
    }
}

@-webkit-keyframes fireworkPoint {

    100%,
    30% {
        transform: scale(0, 0)
    }

    60% {
        transform: scale(1, 1)
    }
}

@keyframes fireworkPoint {

    100%,
    30% {
        transform: scale(0, 0)
    }

    60% {
        transform: scale(1, 1)
    }
}

@-webkit-keyframes bounceIn {
    0% {
        transform: scale(0)
    }

    30% {
        transform: scale(1.25)
    }

    50% {
        transform: scale(.9)
    }

    70% {
        transform: scale(1.1)
    }

    80% {
        transform: scale(1)
    }
}

@keyframes bounceIn {
    0% {
        transform: scale(0)
    }

    30% {
        transform: scale(1.25)
    }

    50% {
        transform: scale(.9)
    }

    70% {
        transform: scale(1.1)
    }

    80% {
        transform: scale(1)
    }
}

@-webkit-keyframes crackLeft {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(-45deg)
    }
}

@keyframes crackLeft {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(-45deg)
    }
}

@-webkit-keyframes crackRight {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(45deg)
    }
}

@keyframes crackRight {
    0% {
        transform: rotate(0)
    }

    100% {
        transform: rotate(45deg)
    }
}

@-webkit-keyframes crack {
    0% {
        stroke-dasharray: 15;
        stroke-dashoffset: 15
    }

    80% {
        stroke-dasharray: 15;
        stroke-dashoffset: 0;
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes crack {
    0% {
        stroke-dasharray: 15;
        stroke-dashoffset: 15
    }

    80% {
        stroke-dasharray: 15;
        stroke-dashoffset: 0;
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes hide {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

@keyframes hide {
    0% {
        opacity: 1
    }

    100% {
        opacity: 0
    }
}

.view-cart-button {
    display: none;
    background: #f8cdd9;
}

#updatePincodeBtn {
    margin: 20px;
    font-size: 16px;
    cursor: pointer
}

.popup {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, .5);
    justify-content: center;
    align-items: center;
    z-index: 101
}

.popup-content {
    background-color: #fff;
    padding: 20px;
    border-radius: 5px;
    text-align: center;
    position: relative
}

.popup-content h2 {
    margin-top: 0
}

.popup-content input {
    padding: 10px;
    width: 80%;
    margin: 10px 0;
    border: 1px solid #ccc;
    border-radius: 5px
}

.popup-content button {
    padding: 10px 20px;
    background-color: #d2ef9a;
    color: #000;
    border: none;
    border-radius: 5px;
    cursor: pointer
}

.popup-content .close {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: 20px;
    cursor: pointer
}