* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	font-family: "Roboto", sans-serif;
	text-decoration: none;
}

/* Custom properties */
:root {
	--blanco: #ffffff;
	--negro: #111111;
	--color-primario: #2b1141;
	--color-secundario: #d49de3;
	--color-fondo-carta: linear-gradient(
		-45deg,
		var(--color-primario) 0%,
		transparent 30%
	);
	--color-degradado: linear-gradient(var(--blanco), #c9c9c9);
	--color-degradado2: linear-gradient(
		-45deg,
		var(--color-primario) 0%,
		transparent 45%
	);
	--color-fondo-index: linear-gradient(
		-45deg,
		var(--color-primario) 25%,
		transparent 45%
	);
	--color-formulario: linear-gradient(-45deg, #55cb60 0, var(--blanco) 40%);

	/* Sombras */
	--sombra: 3px 3px 14px #ffffff, -3px -3px 14px #ffffff5e;
	--sombra2: 1px 1px 2px #ffffff, -1px -1px 2px #ffffff;
	/* Botones */
	--border: 2px double var(--color-primario);
	--border-radius: 20px;
	/* Tipografía */
	--tipo-principal: "Roboto", sans-serif;
	--tipo-secundaria: Verdana;
	/* Transition */
	--transition: all 0.5s ease-in-out;
}
html {
	color: var(--negro);
  background-color: #111111;
}
body {
	width: 100%;
}

/* fadeIn - En el <body> de cada página */
.fade-in {
	animation: fadeIn ease 2s;
}
@keyframes fadeIn {
	0% {
		opacity: 0;
	}
	100% {
		opacity: 1;
	}
}

/* LUCES BRILLANTES */
@keyframes STAR {
	0% {
		background: powderblue;
		height: 1px;
		width: 1px;
		box-shadow: 0px 0px 13px white;
	}
	10% {
		background: #cbe8e4;
	}
	20% {
		background: #b0e5cc;
	}
	30% {
		background: #cce5b0;
	}
	40% {
		background: #dae5b0;
	}
	50% {
		background: #e5ddb0;
		width: 4px;
		height: 4px;
		box-shadow: 0px 0px 13px #ffffff;
	}
	100% {
		width: 1px;
		height: 1px;
		background: powderblue;
		box-shadow: 0px 0px 13px white;
	}
}

.star {
	height: 1px;
	width: 1px;
	border-radius: 5px;
	box-shadow: 0px 0px 13px white;
	background: powderblue;
	position: fixed;
}

.star.pulse {
	animation: STAR 2s infinite;
}

