.btn-primary {
    background-color: #0047bb!important;
    border-color: #0047bb!important;
}
.btn-primary:hover {
    background-color: #256adb!important;
    border-color: #256adb!important;
}

.btn-success {
    background-color: #008A65!important;
    border-color: #008A65!important;
}

.btn-success:hover {
    background-color: #0e6c53!important;
    border-color: #0e6c53!important;
}

#container {
    align-items: center;
    max-width: 1100px;
    display: flex;
    align-items: center;
    align-content: center;
    justify-content: center;
    position: relative;
}

@keyframes pulse {
    0% {
        transform: scale(1);
    }
    50% {
        transform: scale(1.1);
    }
    100% {
        transform: scale(1);
    }
}

#container div {
    width: 150px;
    height: 265px;
    border-radius: 4%;
    filter: drop-shadow(7px 7px 7px rgba(0, 0, 0, 0.33));
    background: url('../img/tarot-card-back.png') no-repeat center;
    position: absolute;
    animation: rotateCards 2s ease-in-out infinite, pulse 2s ease-in-out infinite;
    transform-origin: center center;
    animation-name: pulse;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    transition: width 2s, height 2s, border-radius 2s;
}

#container div:hover {
    z-index: 2;
}


#container div:nth-child(1) {
    top: 0%;
    left: 0%;
    animation-delay: .5s;
}
#container div:nth-child(2) {
    top: 0%;
    left: 2%;
    animation-delay: 1s;
}
#container div:nth-child(3) {
    top: 0%;
    left: 4%;
    animation-delay: 1.5s;
}
#container div:nth-child(4) {
    top: 0%;
    left: 6%;
    animation-delay: .5s;
}
#container div:nth-child(5) {
    top: 0%;
    left: 8%;
    animation-delay: .8s;
}
#container div:nth-child(6) {
    top: 0%;
    left: 10%;
    animation-delay: 1.5s;
}
#container div:nth-child(7) {
    top: 0%;
    left: 12%;
    animation-delay: .5s;
}
#container div:nth-child(8) {
    top: 0%;
    left: 14%;
    animation-delay: 1.5s;
}
#container div:nth-child(9) {
    top: 0%;
    left: 16%;
    animation-delay: 1s;
}
#container div:nth-child(10) {
    top: 0%;
    left: 18%;
    animation-delay: .5s;
}
#container div:nth-child(11) {
    top: 0%;
    left: 20%;
    animation-delay: 1s;
}
#container div:nth-child(12) {
    top: 0%;
    left: 22%;
    animation-delay: 1.5s;
}
#container div:nth-child(13) {
    top: 0%;
    left: 24%;
    animation-delay: .5s;
}
#container div:nth-child(14) {
    top: 0%;
    left: 26%;
    animation-delay: .8s;
}
#container div:nth-child(15) {
    top: 0%;
    left: 28%;
    animation-delay: 1.5s;
}
#container div:nth-child(16) {
    top: 0%;
    left: 30%;
    animation-delay: .5s;
}
#container div:nth-child(17) {
    top: 0%;
    left: 32%;
    animation-delay: 1.5s;
}
#container div:nth-child(18) {
    top: 0%;
    left: 34%;
    animation-delay: 1s;
}
#container div:nth-child(19) {
    top: 0%;
    left: 36%;
    animation-delay: .5s;
}
#container div:nth-child(20) {
    top: 0%;
    left: 38%;
    animation-delay: 1s;
}
#container div:nth-child(21) {
    top: 0%;
    left: 40%;
    animation-delay: 1.5s;
}
#container div:nth-child(22) {
    top: 0%;
    left: 42%;
    animation-delay: .5s;
}
#container div:nth-child(23) {
    top: 0%;
    left: 44%;
    animation-delay: .8s;
}
#container div:nth-child(24) {
    top: 0%;
    left: 46%;
    animation-delay: 1.5s;
}
#container div:nth-child(25) {
    top: 0%;
    left: 48%;
    animation-delay: .5s;
}
#container div:nth-child(26) {
    top: 0%;
    left: 50%;
    animation-delay: 1.5s;
}
#container div:nth-child(27) {
    top: 0%;
    left: 52%;
    animation-delay: 1s;
}
#container div:nth-child(28) {
    top: 0%;
    left: 54%;
    animation-delay: .5s;
}
#container div:nth-child(29) {
    top: 0%;
    left: 58%;
    animation-delay: .5s;
}
#container div:nth-child(30) {
    top: 0%;
    left: 60%;
    animation-delay: 1s;
}
#container div:nth-child(31) {
    top: 0%;
    left: 62%;
    animation-delay: 1.5s;
}
#container div:nth-child(32) {
    top: 0%;
    left: 64%;
    animation-delay: .5s;
}
#container div:nth-child(33) {
    top: 0%;
    left: 66%;
    animation-delay: .8s;
}
#container div:nth-child(34) {
    top: 0%;
    left: 68%;
    animation-delay: 1.5s;
}
#container div:nth-child(35) {
    top: 0%;
    left: 70%;
    animation-delay: .5s;
}
#container div:nth-child(36) {
    top: 0%;
    left: 72%;
    animation-delay: 1.5s;
}
#container div:nth-child(37) {
    top: 0%;
    left: 74%;
    animation-delay: 1s;
}
#container div:nth-child(38) {
    top: 0%;
    left: 76%;
    animation-delay: .5s;
}
#container div:nth-child(39) {
    top: 0%;
    left: 78%;
    animation-delay: 1s;
}
#container div:nth-child(40) {
    top: 0%;
    left: 80%;
    animation-delay: 1.5s;
}
#container div:nth-child(41) {
    top: 0%;
    left: 82%;
    animation-delay: .5s;
}
#container div:nth-child(42) {
    top: 0%;
    left: 84%;
    animation-delay: 1s;
}
#container div:nth-child(43) {
    top: 0%;
    left: 86%;
    animation-delay: 1.5s;
}




/*
  #container div:nth-child(1):hover {
     background: url('img/homecards/card1.jpg') no-repeat center;
}
*/

#card-container {
    position: relative;
}

#shuffle-button {
    display: block;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    font-size: 1.8rem;
    padding: 0.4rem 0.8rem;
    margin-top: 15px;
}

#pretekstas {
    display: none;

}


#shuffle-button2 {
    display: block;
    align-items: center;
    text-align: center;
    margin: 0 auto;
    font-size: 1.8rem;
    padding: 0.4rem 0.8rem;
    z-index: 9;
    position: relative;
}

@keyframes shuffle2 {
    0% {
        transform: translateX(0);
    }
    25% {
        transform: translateX(150px) rotate(90deg);
    }
    50% {
        transform: translateX(150px) translateY(150px) rotate(0);
    }
    75% {
        transform: translateX(0) translateY(150px) rotate(90deg);
    }
    100% {
        transform: translateX(0);
    }
}
.hide {
    display: none;
}