@font-face {
  font-family: Leipis;
  src: url("etusivu-fontit/Grenze/Grenze-Regular.ttf");
}
@font-face {
  font-family: Leipis;
  src: url("etusivu-fontit/Grenze/Grenze-Bold.ttf");
  font-weight: bold;
}
@font-face {
  font-family: Leipis;
  src: url("etusivu-fontit/Grenze/Grenze-Italic.ttf");
  font-style: italic;
}

@font-face {
  font-family: Otsikko;
  src: url("etusivu-fontit/IM_Fell_English_SC/IMFellEnglishSC-Regular.ttf");
}

h1, h2 {
  font-family: Otsikko, serif;
  font-weight: normal;
}


body {
  font-family: Leipis, sans-serif;
  background-color: #3b3b3b;
  background-image: url(pilvet.jpg);
  background-attachment: fixed;
  color: #d5d3de;
  text-align: center;
  padding: 40px;
}

.header {
  padding: 30px;
  font-size: 40px;
  background-color: #000000;
  color: #d5d3de;
  font-family: Otsikko, serif;
}

div {
  max-width: 700px;
  background-color: #0f0f0f;
  margin-left: auto;
  margin-right: auto;
  padding: 20px;
  border: 10px double;
    border: 10px double;
  color: #d5d3de;
}

.footer {
  background-color: #000000;
  color: #d5d3de;
  padding: 30px;
  font-size: 30px;
}

a:link {
  color: #d5d3de;
}

a:visited {
  color: #a1a1a1;
}

a:hover {
  text-decoration: none;
}

.header, .footer {
  text-align: center;
}