/* - FONTS - */

@font-face {
    font-family: 'orbit';
    src: url("/!data/content/fonts/Orbit/Orbit-Regular.ttf");
}

@font-face {
    font-family: 'tourney';
    src: url("/!data/content/fonts/Tourney/Tourney-VariableFont-wdthwght.ttf");
    font-weight: 100;
}


/* - BASICS - */

* {
  font-variant-ligatures: none;
}

body {
    background-color: black;
    color: white;
    font-family: 'orbit', 'Courier New', Courier, monospace;
    margin: 0;
    margin-top: 10vh;
    padding: 0;
}

h1 {
    font-family: 'tourney', 'orbit', 'Courier New', Courier, monospace;
    font-size: 400%;
    line-height: 50%;
}

h2 {
    font-size: 200%;
}

h3 {
    font-size: 150%;
}

a {
  color: white;
}

ul {
  list-style-type: none;
  padding: 0px;
}


.content-area {
  padding: 10px;
  margin: 30px 40px;
  text-align: center;
}

.card {
  /*background-color: #0e0e0e;*/

}

.fx-skew {
  transform-style: preserve-3d;
	transform: skewY(-10deg);
  max-width: min-content;
  margin: auto;
  
}

.fx-skew li:hover {
  color: white;
  transition: 0.2s;
}

.fx-glow {
  text-shadow: 2px 2px 5px #ff0000;
}

/* - NAVBAR - */
div.navbar ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  background-color: #0e0e0e;
  display: flex;
  align-items: center;
}

div.navbar ul li a {
  display: block;
  color: rgb(255, 255, 255);
  font-weight: bold;
  font-size: larger;
  padding: 14px 12px;
  height: 100%;
  text-decoration: none;
  transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}

div.navbar li {
  height: fit-content;
  padding: 0px 0px;
}

div.navbar ul li a:hover {
  background-color: #ffffff;
  color: black;
}

div.navbar img {
  height: 64px;
  margin: -22px 16px -22px 20px;
  filter: invert();
  transform: translate(0px, 3px) rotate(90deg);
}

div.navbar {
  position: fixed;
  height: 10%;
  width: 100vw;
  overflow: hidden;
  top: 0;
  z-index: 10;
}


#loadOverlay
{
  transition: 1s ease-in-out;
  opacity: 0;
  pointer-events: none;
}