/* CSS for thumbnail images in nanogallery2 */
.ngy2-thumbnail {
  margin: 5px;
  border: none;
}

/* Set the size of the thumbnails */
.ngy2-thumbnail {
    width: 100px;
    height: 100px;
}

/* Remove the border around the thumbnails */
.ngy2-thumbnail-container {
    border: none;
}

/* Set the border radius for the thumbnails */
.ngy2-thumbnail-container img {
    border-radius: 200px;
}

body {
  		padding-top: 5px;
  		background-color: black;
}

body,
html {
	height: 100%;
	display: flex;
	flex-direction: column;
	margin: 0;
}

.colors {
	height: 25vh;
	display: flex;
	align-items: center;
	justify-content: center;
}

p {
	margin: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Luckiest Guy", cursive;
	font-size: 4rem;
	letter-spacing: 0.4rem;
	width: 100%;
	height: 100%;
	color: white;
	background: black;
	text-align: center;
	mix-blend-mode: multiply;
	text-shadow: -2px 2px 0px black, -10px 5px 0px white, -10px 10px 0px purple;
}

.yellow {
	background: url("bg/yellow.jpg");
	background-position: center;
	background-size: cover;
}

.red {
	background: url("bg/red.jpg");
	background-position: center;
	background-size: cover;
}

.blue {
	background: url("bg/blue.jpg");
	background-position: center;
	background-size: cover;
}

.green {
	background: url("bg/green.jpg");
	background-position: center;
	background-size: cover;
}

.orange {
	background: url("bg/orange.jpg");
	background-position: center;
	background-size: cover;
}

.purple {
	background: url("bg/purple.jpg");
	background-position: center;
	background-size: cover;
}

.pink {
	background: url("bg/pink.jpg");
	background-position: center;
	background-size: cover;
}

.brown {
	background: url("bg/brown.jpg");
	background-position: center;
	background-size: cover;
}


.multi1 {
	background: url("bg/multi1.jpg");
	background-position: center;
	background-size: cover;
}

.multi2 {
	background: url("bg/multi2.jpg");
	background-position: center;
	background-size: cover;
}

.multi3 {
	background: url("bg/multi3.jpg");
	background-position: center;
	background-size: cover;
}

.multi4 {
	background: url("bg/multi4.jpg");
	background-position: center;
	background-size: cover;
}

.rainbow1 {
	background: url("bg/rainbow1.jpg");
	background-position: center;
	background-size: cover;
}

.rainbow2 {
	background: url("bg/rainbow2.jpg");
	background-position: center;
	background-size: cover;
}