body {
    height: 100vh;
    font-family: 'VT323', monospace;
    background-color: black;
}

.background-GIF {
    background-image: url(https://i.pinimg.com/originals/8b/e4/ef/8be4efc0a8e5bc4903aae00db82cb982.gif);
    background-size: cover;
}

.container-fluid {
    background-color: rgba(0, 0, 0, 0.5);
    height: 100%;
}

.click-area {
    height: 45vh;
}

.clicker-item:hover {
    transform: scale(1.1);
    animation: shake 5s ease-in-out infinite;
    animation-iteration-count: infinite;
}

@keyframes shake {

    0%,
    100% {
        transform: translateX(-5px) rotate(5deg);
    }

    50% {
        transform: translatex(5px) rotate(-5deg);
    }
}

.card {
    background-color: rgba(0, 136, 0, 0.4);
}

.card-deuteranopia {
    background-color: rgba(16, 0, 158, 0.4) !important;
}

.btn-hacker {
    border: 2px solid rgb(0, 136, 0);
    background-color: rgb(0, 0, 0);
    color: white;
    padding: 5px;
    border-radius: 8px;
    outline: none !important;
}

.btn-hacker-deuteranopia {
    border: 2px solid rgb(0, 0, 136) !important;
}

.btn-hacker:hover {
    border: 2px solid rgb(0, 255, 0);
    transition: 0.1s ease;
}

.btn-hacker-deuteranopia:hover {
    border: 2px solid rgb(0, 17, 255) !important;
}

.btn-hacker-off {
    border: 2px dashed rgb(136, 0, 0);
    background-color: rgb(0, 0, 0);
    color: white;
    padding: 5px;
    border-radius: 8px;
    outline: none !important;
}

.btn-hacker-off:hover {
    border: 2px solid rgb(136, 0, 0);
}

.btn-hacker-off-deuteranopia {
    border: 2px dashed rgb(238, 255, 0) !important;
}

.btn-hacker-off-deuteranopia:hover {
    border: 2px solid rgb(217, 255, 0) !important;
}

.text-gold {
    color: rgb(251, 255, 42);
}

.bot-img:hover {
    transform: scale(1.3);
}

.text-size-medium {
    font-size: 16pt;
}