html { background: #191919; padding: 1rem; }


body {margin: 0 auto; background: #191919;}
h1 { font-family: "Courier", monospace; color: #F4F7F5; margin: 0 auto; text-align: center; font-size: 2rem}
p {font-family: "Courier New", monospace; color: #f4f7f5; text-align: center; font-size: 1.1rem}

.link-to-home{font-size: 2.7rem;}

a { color: #bf0603; }
img {height: 25px}

.center {margin: 0 auto; position: absolute; top: 50%;left: 50%; -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%);}
.socials {margin: 0 auto; display: flex; justify-content: center;}
.externalLink {margin: 0px 10px}

.menu {display: flex; justify-content: flex-end;}

/* Dropdown Button */
.dropbtn {
  background-color: #191919;
  background-image: url( '../static/hamburger.png' );
  background-position: center;
  background-size: contain;
  color: #F4F7F5;
  padding: 25px;
  border: none;
}

/* The container <div> - needed to position the dropdown content */
.dropdown {
  position: relative;
  display: inline-block;
}

/* Dropdown Content (Hidden by Default) */
.dropdown-content {
  display: none;
  position: absolute;
  background-color: #191919;
  z-index: 1;
}

/* Links inside the dropdown */
.dropdown-content a {
  font-family: "Courier", monospace;
  color: #bf0603;
  padding: 12px 8px;
  text-decoration: none;
  text-shadow: #000000 1px 0 10px;
  text-align: right;
  display: block;
  font-weight: bold
}

/* Change color of dropdown links on hover */
.dropdown-content a:hover {
	/*background-color: #bf0603;*/
	text-shadow: #ffffff 1px 0 10px;
	color: #F4F7F5;
}

/* Show the dropdown menu on hover */
.dropdown:hover .dropdown-content {display: block;right:0;}

/* Change the background color of the dropdown button when the dropdown content is shown */
.dropdown:hover .dropbtn {background-image: url( '../static/hamburger-hover-glow.png' );}


