html,
body,
#root,
#app {
  background-color: whitesmoke;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  font-weight: 400;
  overflow: hidden;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0.5);
  image-rendering: -moz-crisp-edges; /* Firefox */
  image-rendering: -o-crisp-edges; /* Opera */
  image-rendering: -webkit-optimize-contrast; /* Webkit (non-standard naming) */
  image-rendering: crisp-edges;
  -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */
}

/* width */
::-webkit-scrollbar {
  width: 8px;
  height: 5px;
}

/* Track */
::-webkit-scrollbar-track {
  box-shadow: inset 0 0 5px grey;
}

/* Handle */
::-webkit-scrollbar-thumb {
  background: gray;
  border-radius: 4px;
}

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #43ad9e;
}

h1 {
  font-family: 'Comfortaa', sans-serif;
  opacity: 0.8;
  margin: 1rem 0rem;
  font-size: 21px;
  font-weight: 600;
}

h2 {
  font-family: 'Comfortaa', sans-serif;
  margin: 0.33rem 0rem;
  opacity: 0.7;
  font-size: 18px;
  font-weight: 600;
}

h3 {
  font-family: 'Comfortaa', sans-serif;
  margin: 0.25rem 0rem;
  opacity: 0.6;
  font-size: 16px;
  font-weight: 600;
}

a {
  color: #002faa;
  opacity: 0.8;
  text-decoration: none;
}

a:hover {
  opacity: 1;
}

/* Change the white to any color */
input:-webkit-autofill,
input:-webkit-autofill:hover,
input:-webkit-autofill:focus,
input:-webkit-autofill:active {
  -webkit-box-shadow: 0 0 0 30px white inset !important;
  font-family: 'hero-new';
}

input {
  font-family: 'hero-new', courier;
}

/* button:focus {
  box-shadow: 0 0 5px rgba(0, 0, 0, 0.5) !important;
} */

@font-face {
  font-family: hero-new;
  src: url('/fonts/NHL.otf');
}

.grecaptcha-badge {
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
}