html {
  font-size: 62.5%;
}

body {
  background: #202222; /* in case browser doesn't support gradient. Options: #202222, #042022 */
  /* background: linear-gradient(to bottom, #202222 90%, #221f04 99%); */
  /* #606F71 --> #3B444D*/
  color: #eaeaea;
  font-family: 'Open Sans', Tahoma, 'Geneva', Verdana, sans-serif;
  font-size: 1.8rem;
  padding: 0 5rem;
  display: grid;
  grid-template-rows: auto 1fr auto;
  grid-template-areas:
    "header"
    "main"
    "footer";
  min-height: 100vh;
}

header {
  grid-area: header;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items:baseline;
}

nav {
  font-size: 1.6rem;
  padding: 0.7rem;
}

nav ul {
  display: flex;
  flex-direction: row;
  list-style: none;
  padding-left: 0;
  text-align: top;
}

nav li {
  margin-left: 2rem;
}

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

#main-contents .container {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: baseline;
}

#main-contents .container a {
  color: #ffc400;
  text-decoration: none;
  font-style: italic;
}

a {
  color: #ffc400;
  text-decoration: none;
}

a:visited {
  color: none;
}

header h1 a, header nav a:hover {
  color: #fff;
}

main {
  grid-area: main;
  margin: 1rem;
}

h2 {
  text-align: center;
}

#resume {
  display: flex;
  justify-content: center;
}

#main .container img {
  width: 400px;
  height: 400px;
  display: block;
  margin: 1rem auto 5rem auto;

}

::selection {
  /* background-color: #042022;
  color: #76cae4; */
  background-color: #221f04;
  color: #e4d276;
  border: 2px solid yellow;
  text-shadow: 0 0 1px #000000;
}

@media screen and (min-width: 768px) {
  nav ul{
    font-size: 1.8rem;
    justify-content: flex-end;
  }
}

footer {
  grid-area: footer;
}

footer p {
  display: flex;
  justify-content: center;
  color: #7d7d7d;
  /* font-style: italic; */
  margin-top: 5rem;
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-size: 1.4rem;
}

/* i like these colors: #0c3d44, #441a0c - could be used as accents*/