/* || Set font-family & font-size */

@font-face {
  font-family: "Open Sans Light";
  src: url("fonts/opensans-light.woff2") format("woff2"),
       url("fonts/opensans-light.woff") format("woff"),
       url("fonts/opensans-light.ttf") format("ttf");
  font-weight: normal;
  font-style: normal;
}

html {
  font-size: 10px;
  font-family: "Open Sans Light"/*, "Open Sans"*/, sans-serif;
  font-weight: 100;
}

body {
  font-size: 1.7rem;
}

h1,
h2 {
  font-size: 2.5rem;
  font-weight: 100;
}



/* || General */

html {
  background-color: #111a24;
}

body {
  color: #ffffff;
  padding-left: 50px;
  padding-right: 35px;
  max-width: 600px;
  margin: 25px 0 0 0;
}

main p {
  text-indent: 2rem;
}

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

a:visited {
  color: #a79c7b;
}

a:hover,
a:focus {
  color: #f5e6b8;
	text-shadow: 0px 0px 0px;
}

a:active {
  background-color: #f5e6b8;
  border-radius: 2px;
  color: #111a24;
}

h1 {
  margin: 0px 0 40px;
}

footer {
  color: grey;
}

footer p::before {
  content: ">";
}

/* || .back links */

a.back::before {
  content: "\00a0 \00a0 << ";
}

a.back:hover::before,
a.back:focus::before {
  content: "<< \00a0 \00a0 ";
}

a.back:visited {
  color: #f5e6b8;
}

a.back:active {
  background-color: #f5e6b8;
  border-radius: 2px;
  color: #111a24;
}

/* || Images */

main img {
  border: 5px solid black;
  width:100%;
  max-width: 580px;
}

/* || Homepage differences */

main#home p {
  text-indent: 0px;
}

main#home h2 {
  text-transform: uppercase;
}

main#home h2::before {
  content: "• "
}

main#home h2::after {
  content: " •";
}