/*============================================================================================*/
/* Your custom styles below */
/*============================================================================================*/
:root{
  --main-color:rgb(60,14,188);
  --main-color-rgb:60,14,188;

  --second-color:rgb(187,26,26);
  --second-color-rgb:187,26,26;
}

.main-color{
  background-color: var(--main-color);
}
.second-color{
  background-color: var(--second-color);
}
.top-bg{
  background: linear-gradient(to bottom right, rgba(var(--main-color-rgb), 1),rgba(var(--second-color-rgb),1));
}
.input-bg{
  background: linear-gradient(to bottom right, rgba(var(--main-color-rgb), 0.2),rgba(var(--second-color-rgb),0.2));
}
.text-kosai{
    color: #fff;
    font-size: 250%;
    text-shadow: 1px 1px 2px #ffffff ,
    -1px 1px 2px #ffffff ,
    1px -1px 2px #ffffff ,
    -1px -1px 2px #ffffff;
    }

#register_container {
      width: 600px;
      margin: auto;
}
@media (max-width: 991px) {
  #register_container {
    width: 100%;
  }
}
.qr{
  width: 100vw;
  height: 100vw;
  max-width: 300px;
  max-height: 300px;
}
.thanks{
  font-size: 4rem;
  font-weight: 900;
  color: var(--main-color);
  background: -webkit-linear-gradient(0deg, var(--main-color), var(--second-color));
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.answered {
  color: var(--main-color);
  background-color: rgba(var(--second-color-rgb), 0.1);
  width: fit-content;
}