body {
	background-image: url("../res/space.jpg");
	background-repeat: repeat;
}

#alien-add {
	border: 3px dashed lime;
	width: 450px;
	height: 283px;
	display: flex;
	justify-content: flex-end;
	align-items: center;
	flex-direction: column;
	background-image: url("../res/alien-hacker-hacking-digital-infrastructure.jpg");
	margin: 2rem auto;
	box-shadow: 0 0 20px lime, 0 0 40px rgba(0, 255, 0, 0.5);
}

#alien-add p {
	color: lime;
	padding: 0.8rem 1.2rem;
	font-family: "Comic Sans MS", "Chalkboard SE", cursive;
	font-size: 1.2rem;
	text-align: center;
	text-shadow: 0 0 10px lime;
	margin-bottom: 1rem;
}

#alien-add span {
	display: inline-block;
	color: red;
	font-weight: bold;
	animation: blink 0.3s infinite;
}

.caps {
	display: inline-block;
	font-family: "Impact", "Arial Black", sans-serif;
	color: red;
	font-weight: bold;
	text-shadow: 0 0 10px red;
}

.caps:nth-of-type(6n+1) {
	animation: blink 0.5s infinite;
}

.caps:nth-of-type(6n+2) {
	animation: wobble 0.3s infinite;
}

.caps:nth-of-type(6n+3) {
	animation: pulse 0.4s infinite;
}

.caps:nth-of-type(6n+4) {
	animation: blink-rotate 0.6s infinite;
}

.caps:nth-of-type(6n+5) {
	animation: shake 0.15s infinite;
}

.caps:nth-of-type(6n) {
	animation: pulse-blink 0.5s infinite;
}

@keyframes blink {
	0%, 49% { opacity: 1; }
	50%, 100% { opacity: 0; }
}

@keyframes wobble {
	0% { transform: rotate(-5deg); }
	50% { transform: rotate(5deg); }
	100% { transform: rotate(-5deg); }
}

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

@keyframes blink-rotate {
	0% { opacity: 1; transform: rotate(0deg); }
	25% { opacity: 0; transform: rotate(90deg); }
	50% { opacity: 1; transform: rotate(180deg); }
	75% { opacity: 0; transform: rotate(270deg); }
	100% { opacity: 1; transform: rotate(360deg); }
}

@keyframes shake {
	0% { transform: translate(0, 0); }
	25% { transform: translate(-3px, 3px); }
	50% { transform: translate(3px, -3px); }
	75% { transform: translate(-3px, -3px); }
	100% { transform: translate(3px, 3px); }
}

@keyframes pulse-blink {
	0% { transform: scale(1); opacity: 1; }
	25% { transform: scale(1.2); opacity: 0; }
	50% { transform: scale(1); opacity: 1; }
	75% { transform: scale(1.2); opacity: 0; }
	100% { transform: scale(1); opacity: 1; }
}