/* CSS is how you can add style to your website, such as colors, fonts, and positioning of your
   HTML content. To learn how to do something, just try searching Google for questions like
   "how to change link color." */

body {
  background-color: #00582d;
  color: white;
  font-family: Helvetica;
  font-size: 11pt;
  text-align: center;
}

h1 {
  font-family: Amarante;
  font-size: 34pt;
  text-align: center;
}

h2 {
  font-family: Amarante;
  font-size: 24pt;
  text-align: center;
}

h3 {
  font-family: Amarante;
  font-size: 16pt;
  text-align: center;
  padding: 0px;
  margin: 0px;
  line-height: 1;
}

a {
  color: #b5e6cd;
  text-decoration: none;
  font-weight: bold;
}

a:visited {
  color: #b5e6cd;
  text-decoration: none;
  font-weight: bold;
}

a:hover {
  color: #CCF5E0;
  text-decoration: none;
  font-weight: bold;
}

a:focus {
  color: #CCF5E0;
  text-decoration: none;
  font-weight: bold;
}

a:active {
  color: #CCF5E0;
  text-decoration: none;
  font-weight: bold;
}

a.item {
  font-weight: bold;
  color: #052917;
}

a.item:visited {
  font-weight: bold;
  color: #052917;
}

a.item:active {
  font-weight: bold;
  color: #052917;
}

a.item:focus {
  font-weight: bold;
  color: #052917;
}

a.item:hover {
  font-weight: bold;
  color: #052917;
}

article p a {
  color: #1F6B43;
  text-decoration: none;
  font-weight: bold;
}

article p a:visited {
  color: #1F6B43;
  text-decoration: none;
  font-weight: bold;
}

article p a:hover {
  color: #1F6B43;
  text-decoration: underline;
  font-weight: bold;
}

article p a:focus {
  color: #1F6B43;
  text-decoration: none;
  font-weight: bold;
}

article p a:active {
  color: #1F6B43;
  text-decoration: underline;
  font-weight: bold;
}
  
.game {
  background-color: #052917;
  text-align: center;
  max-width: 250px;
  margin: 7px auto;
  padding: 10px;
}

.nav {
  font-size: 8pt;
}

.keys {
  text-decoration: underline;
}

header {
  background-color: #052917;
  margin: 0px 40px 0px;
  padding: 3px;
  line-height: 1;
}

section {
  display: flex;
  flex-flow: row wrap;
  background-color: #052917;
  text-align: center;
  margin: 0px 40px 10px;
}

.img-art {
  height: 75px;
  width: 75px;
}

.icon {
    vertical-align: middle;
    line-height: 1.4;
}

.img-inl {
  display: inline-block;
  vertical-align: middle;
  height: 14px;
  width: 14px;
  }
  
  .iconl a:hover {
    text-decoration: none;
  }
    

  

  

article {
background-color: #b5e6cd;
color: #052917;
font-size: 11pt;
margin: 8px;
padding: 4px;
flex: 1 76px;
}

#hotkey article {
  flex: 1 150px;
}