* {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  font-family: "Electrolize", sans-serif;
  scroll-behavior: smooth;
  border-width: 0;
}
:root {
  --bgTemp: #123417;
  --ss: 1%;
  --sixty: #1e3a60;
  --thirty: #efefef;
  --acc: #42c8ee;
  --sf: 2em;
  --full: 100%;
  --menu: #42c8ee7e;
}
/* unvisited link */
a:link {
  color: var(--acc);
  text-decoration: none;
}

/* visited link */
a:visited {
  color: var(--acc);
  text-decoration: none;
}

/* mouse over link */
a:hover {
  color: var(--acc);
  text-decoration: none;
}

/* selected link */
a:active {
  color: var(--acc);
  text-decoration: none;
}
body {
  background-color: var(--thirty);
}
#landing {
display: none;
    margin-bottom: var(--sf);
}
#poster{
    position: relative;
    top: 0;
    overflow-y: hidden;
}

#carousel > img{
    background-color: var(--acc);
    /* padding:3em; */
    
    border-width: var(--sf);

}
#sort {
  position: fixed;
  top: 0;
  display: flex;
  margin-left: var(--ss);
}


#sort > p {
  margin-left: var(--ss);
  padding-left: var(--ss);
}
footer {
  background-color: var(--thirty);
  position: fixed;
  bottom: 0;
  width: var(--full);
  height: var(--2em);
  color: var(--acc);
  margin-bottom: 0;
}
footer > a {
  margin: var(--sf);
}
#HUD {
  width: var(--full);
  height: var(--full)- var(--sf);
}

/* canvas{
    background-color: var(--thirty);
    width: var(--full);
    height: var(--full)- var(--sf);

} */
#target {
    
  display: flex;
  /* display: none; */
  flex-wrap: wrap;
  justify-content: space-evenly;
  padding: var(--ss);
}
.Item {
  margin: var(--sf);
  background-color: var(--sixty);
  width: max-content;
  padding: var(--ss);

  transform: scale(1);
  transform-origin: center;
}
.item:hover {
  transform: scale(2);
  transition: transform 200ms ease-in-out;
}

#empty {
  margin-top: var(--sf);
}
#navMenu {
  position: fixed;
  z-index: 100;
  width: 40vw;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  flex-wrap: wrap;
  transform: scale(0);
  transform-origin: top left;
}
#navMenu.active {
  transform: scale(1);
  transition: transform 200ms ease-in-out;
}

#navMenu .hexagonArea {
  display: flex;
}
#navMenu .hexagonArea .hexagon {
  position: relative;
  width: 256px;
  height: 256px;
  margin: var(--ss);
  clip-path: polygon(0 25%, 50% 0, 100% 25%, 100% 75%, 50% 100%, 0 75%);
  background-color: var(--menu);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  cursor: pointer;
  transition: 0.5s;
}
#navMenu .hexagonArea .hexagon form {
  display: flex;
  flex-direction: column;
}
#centerRow {
  transform: translateY(-69px);
}
#lastRow {
  transform: translateY(-140px);
}
div#centerdiv.hexagon {
  background-color: transparent !important  ;
  border-color: transparent;
}

.hexagon {
  border-radius: 0px;
  background: #0e718f;
  box-shadow: 18px 18px 36px #0c607a, -18px -18px 36px #1082a4;
}
.standard {
  color: black !important;
}
button {
  background-color: transparent;
  border: dashed;
}