body {
  min-height: var(--full-height);
  width: var(--body--width);
  background-color: var(--main--color);
  position: relative;
}

#loadingOverlay {
  position: fixed;
  opacity: 1;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #000; /* Black background */
  z-index: 99; /* Ensure it covers everything */
  transition: opacity 1s ease-in;
  pointer-events: none;
  isolation: isolate;
}

#loadingOverlay.close {
  opacity: 0;
}

::-moz-selection {
  background: inherit;
  text-shadow: none;
}

::selection {
  background: inherit;
  text-shadow: none;
}

a {
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

/*
 * A better looking default horizontal rule
 */

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */

audio,
canvas,
iframe,
img,
svg,
video {
  vertical-align: middle;
}

/*
 * Remove default fieldset styles.
 */

fieldset {
  border: 0;
  margin: 0;
  padding: 0;
}

/*
 * Allow only vertical resizing of textareas.
 */

textarea {
  resize: vertical;
}

/*
 * Hide visually and from screen readers, but maintain layout
 */

.invisible {
  visibility: hidden;
}

/*
 * Clearfix: contain floats
 *
 * For modern browsers
 * 1. The space content is one way to avoid an Opera bug when the
 *    `contenteditable` attribute is included anywhere else in the document.
 *    Otherwise it causes space to appear at the top and bottom of elements
 *    that receive the `clearfix` class.
 * 2. The use of `table` rather than `block` is only necessary if using
 *    `:before` to contain the top-margins of child elements.
 */

.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
}

.clearfix::after {
  clear: both;
}


/* 
    MAIN STYLES 
*/


* {
  box-sizing: border-box;
  scroll-behavior: smooth;
}

html {
  -webkit-overflow-scrolling: touch;
}

button {
  background: none;
  color: inherit;
  border: none;
  padding: 0;
  font: inherit;
  cursor: pointer;
  outline: inherit;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

a {
  color: inherit;
  text-decoration: none;
}


p {
  margin: 0px;
}

ul,
li {
  list-style-type: none;
  padding: 0;
  margin: 0;
  font-style: normal;
}

input {
  all: unset;
}