h1{
	color: white;
	font-family: "comic sans ms", cursive;
	text-shadow: 1px 1px 5px lightskyblue;
}
h2{
	color: white;
	font-family: monospace;
	text-shadow: 1px 1px 5px lightskyblue;
}
.h2{
	color: red;
	text-shadow: 1px 1px 5px darkred;
	font-size: 36px;
	font-family: monospace;
}
.h1{
	color: red;
	text-shadow: 1px 1px 5px darkred;
	font-size: 22px;
}
p{
	color: white;
	font-family: "comic sans ms", cursive;
	text-shadow: 1px 1px 5px lightskyblue;
}
img{
	height: 250px;
	width: 300px;
	filter: drop-shadow(1px 1px 5px lightskyblue);
}
a{
	color: white;
	text-decoration: none;
	display: inline-block;
	padding: 20px 5px;
	width: 100%;
	font-weight: 100;
	letter-spacing: 2px;
	font-family: "comic sans ms", cursive;
	text-shadow: 1px 1px 5px lightskyblue;
}
a:hover{
	color: lightblue;
	font-size: 20px;
	text-shadow: 1px 1px 5px lightskyblue;
}

.clas:hover{
	color: #ffffff;
	font-size: 25px;
	text-shadow: 1px 1px 5px lightskyblue;
}

.flex-nav {
  display: flex;
  justify-content: center; /* center horizontally */
}

.flex-nav ul {
  list-style: none;
  padding: 0;
  margin: 0 auto; /* center the list inside the nav */
  text-align: center; /* center text inside <li> */
}

.flex-nav li {
  margin: 10px 0; /* space between items */
}

.flex-nav a {
  text-decoration: none;
  color: white; /* or whatever color you're using */
  font-family: 'Comic Sans MS', cursive; /* or whatever you're using */
}

li {
  list-style-type: none; /* removes the dot */
  padding: 0;
  margin: 0;
}
.copyright:hover{
  font-size: 0;
}
.copyright:hover:after{
  content: attr(data-hover);
  font-size: 75px;
  color: #ff0000;
  text-shadow: 1px 1px 5px darkred;
}
.secret-link {
  display: inline; /* Keep it in the same line */
  margin: 0; /* remove weird margins */
  padding: 0; /* remove weird paddings */
}
.secret-link:hover{
	color: white;
	font-size: 16px;
}