html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}

body {
  background: url("../images/frutigerBG.jpg") no-repeat center center fixed;
  background-size: cover;
  color: black;
  font-family: "Roboto", arial, serif;
  cursor: url("https://cur.cursors-4u.net/games/gam-12/gam1113.cur"), auto;
  height: 100vh;
  overflow-x: hidden;
  overflow-y: auto;
}

*, *::before, *::after {
  box-sizing: border-box;
}

.hoverable{
  cursor: url("https://cur.cursors-4u.net/games/gam-12/gam1113.cur"), auto !important;
}

a,
button,
input,
select,
textarea,
.clickable{
  cursor: url("https://cur.cursors-4u.net/games/gam-12/gam1109.cur"), pointer;
}

a:active,
button:active,
input:active,
select:active,
textarea:active,
.clickable:active{
  cursor: url("https://cur.cursors-4u.net/games/gam-12/gam1101.cur"), auto;
}

.mini-logo {
  width: 16px;
  height: 16px;
}

#header {
  grid-area: header;
}

#headerTitle {
  display: block;
  margin: 0.33rem 0;
  font-family: porkys, fantasy;
  font-size: 6rem;
  text-align: center;
  text-decoration: none;
  -webkit-text-stroke: 3px white;
}

ul[role="menubar"],
ul[role="menubar"] li,
ul[role="menubar"] a,
ul[role="menubar"] button {
  cursor: url("https://cur.cursors-4u.net/games/gam-12/gam1109.cur"), pointer;
}

ul[role="menubar"] a:active,
ul[role="menubar"] button:active {
  cursor: url("https://cur.cursors-4u.net/games/gam-12/gam1101.cur"), auto;
}

ul[role="menubar"] a,
ul[role="menubar"] a:visited {
  color: black !important;
  text-decoration: none;
}
ul[role="menubar"] a:hover,
ul[role="menubar"] a:focus {
  color: black !important;
  text-decoration: underline;
}