html {
  height:auto;
  background-color:#1b2230;
  /*background-image:linear-gradient(to bottom right, #2d3849, #1b2230);*/
  color:#fff;font-family:monospace;
}

body {
  height: auto;
  background-repeat: no-repeat;
  background-attachment: fixed;
  background-size: cover;
}

p{font-size:16px;}
h1,h2,img{margin:0;padding:0;}
/*
main {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 100%;
  width:100%;
  border: 3px solid #fff;
  background:rgba(0,0,0,.5);
}*/


.container {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: row;
  gap:16px;
}

.element {
  inset: 0px;
  width: 12rem;
  height: 5rem;
  max-width: 100vw;
  max-height: 100dvh;
}

.infobox {
  background:rgba(0,0,0,.5);
  padding:16px;margin:16px;
  text-shadow: 2px 2px #000;
}
span{font-size:16px;}
a:hover{text-shadow: 2px 2px #809ef5;}
a,a:visited{color:#b099ff;font-size:16px;margin:0;padding:0;}
a.headline,a.headline:visited{color:#ff802d;font-size:24px;font-weight:bold;margin-top:16px;}
a.headline:hover{text-shadow: 2px 2px #ffff2d;}

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

.flex-container-row > div {
  text-align: center;
}

.flex-container-column {
  display: flex;
  flex-direction:column;
  justify-content: center;
  align-items:center;
}

.flex-container-column > div {
  text-align: center;
}

.tooltip .tooltiptext {
  visibility: hidden;
  width: 120px;
  background-color: rgba(0,0,0,.5);
  color: #fff;
  text-align: center;
  border-radius: 6px;
  padding: 5px 0;

  /* Position the tooltip */
  position: absolute;
  z-index: 1;
  margin-top:-24px;
  margin-left:-88px;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

/*html{cursor: url(https://cur.cursors-4u.net/nature/nat-2/nat120.cur), auto !important;}*/