/*.w3-animate-top {
    position: relative;
    animation: animatetop 1s
}

@keyframes animatetop {
    from {
        top: -300px;
        opacity: 0
    }

    to {
        top: 0;
        opacity: 1
    }
}*/


.pulseit {
    animation: shake 2s;
}

@keyframes shake {
    0% {
        transform: translate(1px, 1px) rotate(0deg);
    }

    10% {
        transform: translate(-1px, -2px) rotate(-1deg);
    }

    20% {
        transform: translate(-3px, 0px) rotate(1deg);
    }

    30% {
        transform: translate(3px, 2px) rotate(0deg);
    }

    40% {
        transform: translate(1px, -1px) rotate(1deg);
    }

    50% {
        transform: translate(-1px, 2px) rotate(-1deg);
    }

    60% {
        transform: translate(-3px, 1px) rotate(0deg);
    }

    70% {
        transform: translate(3px, 1px) rotate(-1deg);
    }

    80% {
        transform: translate(-1px, -1px) rotate(1deg);
    }

    90% {
        transform: translate(1px, 2px) rotate(0deg);
    }

    100% {
        transform: translate(1px, -2px) rotate(-1deg);
    }
}







.cart-button1 {
    position: relative;
    padding: 10px;
    width: 70%;
    height: 3rem;
    border: 0;
    outline: none;
    cursor: pointer;
    color: #fff;
    background-color: #212529;
    border-color: #212529;
    transition: 0.3s ease-in-out;
    overflow: hidden;
    padding: 0.525rem 0.75rem;
    /*    user-select: none;*/
}

    .cart-button1:hover {
        background-color: #202431;
    }

    .cart-button1:active {
        transform: scale(0.9);
    }

    .cart-button1 .fa-shopping-cart {
        position: absolute;
        z-index: 2;
        top: 50%;
        left: -10%;
        transform: translate(-50%, -50%);
    }

    .cart-button1 span {
        position: absolute;
        z-index: 3;
        left: 50%;
        top: 50%;
        color: #fff;
        transform: translate(-50%, -50%);
    }

        .cart-button1 span.add-to-cart {
            opacity: 1;
        }

        .cart-button1 span.added {
            opacity: 0;
        }

    .cart-button1.clicked .fa-shopping-cart {
        animation: cart 1.5s ease-in-out forwards;
    }

    .cart-button1.clicked span.add-to-cart {
        animation: txt1 1.5s ease-in-out forwards;
    }

    .cart-button1.clicked span.added {
        animation: txt2 1.5s ease-in-out forwards;
    }

@keyframes cart {
    0% {
        left: -10%;
    }

    40%, 60% {
        left: 50%;
    }

    100% {
        left: 110%;
    }
}

@keyframes txt1 {
    0% {
        opacity: 1;
    }

    20%, 100% {
        opacity: 0;
    }
}

@keyframes txt2 {
    0%, 80% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.pqt-plus,
.pqt-minus {
    background: #fff;
    border: none;
    font-size: 20px;
    padding: 0 20px;
    width: 50px;
    border-radius: 10px;
    height: 3rem;
/*    user-select: none;*/
    line-height: 50px;
}

    .pqt-plus:hover,
    .pqt-minus:hover {
        background: #202431;
        color: #fff;
        cursor: pointer;
    }