* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

body {
  font: 100%/1.5 Verdana, Helvetica, Arial, sans-serif;
  color: #444;
  background-color: #fff;
}

/* =================== main =================== */

main {
  width: 90%;
  max-width: 960px;
  margin: 2em auto;
}

/* =================== header =================== */

header {
  display:flex;
  gap: 150px;
  align-items: last baseline;
  margin-bottom: 30px;
}

header a {
  text-decoration: none;
}

header a:link {
  color: #000;
}

header a:link {
  color: rgb(103, 103, 103)
}

header a:hover {
  color: red;
}

/* ========================== header hgroup ========================== */

header hgroup {
  display: flex;
  gap: 15px;
  align-items: center;
}

header hgroup img {}

header hgroup h1 {
  font-weight: normal;
  font-family: Georgia, 'Times New Roman', Times, serif;
  font-style: italic;
  font-size: 200%;
}

header hgroup h2 {
  font-weight: normal;
  font-size: 108%;
}

/* ========================== header nav ========================== */

nav ul {
  list-style-type: none;
  display: flex;
  gap: 5px 20px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

nav .current {
  font-weight: bold;
}

/* ============================== blindtext ============================== */

.blindtext {
  color: rgb(88, 83, 83);
}

.blindtext article {
  width: 60%;
}

.blindtext h2 {
  font-size: 100%;
}

.blindtext p {
  text-indent: 1.5em;
}

/* ============================== footer ============================== */

footer {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 70vh;
  background: linear-gradient(transparent, #fff);
}