@import url("https://fonts.googleapis.com/css?family=Raleway");

:root {
  --neonBGcolor: #6c757d;
  --neonCreate: #28a745;
  --neonCreating: #ec5a16;

  --neonColor: #a55;
  --neonTextColor: #ffffff;
}

/* Hide checkbox */
#neonButtonCheckBoxId {
  display: none;
}

/* Container */
.NeonContainer {
  display: flex;
  justify-content: center;
  align-items: center;

  margin: 20px 0;
  clear: both;
}

/* Simple clean button */
.NeonButton {
  display: flex;
  align-items: center;
  justify-content: center;

  padding: 0.6em 1.6em;

  background-color: var(--neonBGcolor);
  color: white;

  border: none;
  border-radius: 8px;

  font-family: "Raleway", sans-serif;
  font-size: 1.4em;
  font-weight: 700;

  cursor: pointer;

  box-shadow: none;
  text-shadow: none;
  filter: none;
}

/* Hover */
.NeonButton:hover {
  /* background-color: #7a838c; */
}

/* Pressed */
.NeonButton:active {
  transform: scale(0.98);
}

/* Text */
.NeonText {
  color: inherit;
}

/* Mobile */
@media screen and (max-width: 600px) {
  .NeonButton {
    max-width: 15em;
    padding: 0.5em 1.2em;
    font-size: 1.2em;
  }
}