body {
    background-color: rgb(100, 140, 180); /* Custom bluish-gray mix */
    color: white; /* White text */
    text-align: center; /* Center everything */
    font-size: 24px; /* Bigger text */
}

h1 {
    font-size: 36px;
    font-weight: bold;
}

.warning {
    color: yellow;
    font-weight: bold;
    background-color: black;
    padding: 10px;
    border-radius: 5px;
}

button {
    background-color: limegreen; /* Lime green button */
    color: white;
    padding: 15px 30px;
    font-size: 20px;
    border: none;
    cursor: pointer;
}

button:hover {
    background-color: darkgreen; /* Darker shade when hovered */
}

.monkeys {
    position: relative;
    width: 100%;
    height: 100vh; /* Full screen */
}

.monkey {
    position: absolute;
    font-size: 40px; /* Bigger emojis */
}

/* Random positions */
.monkey:nth-child(1) { top: 10%; left: 15%; }
.monkey:nth-child(2) { top: 30%; left: 60%; }
.monkey:nth-child(3) { top: 50%; left: 40%; }
.monkey:nth-child(4) { top: 70%; left: 80%; }
.monkey:nth-child(5) { top: 20%; left: 85%; }
.monkey:nth-child(6) { top: 40%; left: 10%; }
.monkey:nth-child(7) { top: 60%; left: 50%; }
.monkey:nth-child(8) { top: 80%; left: 30%; }
.monkey:nth-child(9) { top: 90%; left: 70%; }
.monkey:nth-child(10) { top: 95%; left: 5%; }

/* Bouncing animation */
@keyframes bounce {
    0% { transform: translateY(0); }
    100% { transform: translateY(-30px); }
}
body {
    filter: blur(0px);
    transition: filter 2s ease-in-out;
}

body.creepy {
    filter: blur(5px) grayscale(50%) contrast(150%);
}