.input-code {
  font-size: calc(0.5em + 1vw);
  display: block;
  margin: 1em auto;
  border: none;
  padding: 0;
  width: 12ch;
  background: repeating-linear-gradient(90deg, dimgrey 0, dimgrey 1ch, transparent 0, transparent 1.5ch) 0 100%/11.5ch 2px no-repeat;
  font: 5ch droid sans mono, consolas, monospace;
  letter-spacing: 0.5ch;
}
.input-code:focus {
  outline: none;
  color: dodgerblue;
}
.logo-csa{
  width: 50%;
}

.guide-text {
  font-size: 2.5rem;
}

.create-code-ref {
  font-size: calc(0.5em + 1vw);
}

.button {
  background-color: #4CAF50; /* Green */
  border: none;
  color: white;
  padding: 15px 32px;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 2ch;
  display: block;
  margin: 1em auto;
}

.form-link {
	margin: 1em auto;
}

.selector {
	font-size: auto;
}

.result {
  font-size: calc(0.5em + 0.8vw);
}


/*.container-xl {
  width: 100%;
  padding-right: 0 !important;
  padding-left: 0 !important;
  margin-right: 2vw !important;
  margin-left: 2vw !important;
}*/

@media only screen and (max-width: 1200px) {
	.text-input-guide {
		display: block;
	}
  .col-form-label-lg {
    font-size: 3rem !important;
  }
}

@media only screen and (orientation: portrait) {
  .col-form-label-lg {
    font-size: 4rem !important;
  }
  .form-control-lg {
    /*line-height: 4 !important;*/
    font-size: 4rem !important;
  }
  

  .input-code {
    font-size: calc(0.5em + 1vw);
    display: block;
    margin: 1em auto;
    border: none;
    padding: 0;
    width: 12ch;
    background: repeating-linear-gradient(90deg, dimgrey 0, dimgrey 1ch, transparent 0, transparent 1.5ch) 0 100%/11.5ch 2px no-repeat;
    font: 12ch droid sans mono, consolas, monospace;
    letter-spacing: 0.5ch;
  }
  .input-code:focus {
    outline: none;
    color: dodgerblue;
  }
  .logo-csa{
    width: 100%;
  }
  .guide-text {
    font-size: 5rem;
  }
  .result {
    font-size: 5vw;
  }

  .button {
	  background-color: #4CAF50; /* Green */
	  border: none;
	  color: white;
	  padding: 15px 32px;
	  text-align: center;
	  text-decoration: none;
	  display: inline-block;
	  font-size: 5ch;
	  display: block;
	  margin: 1em auto;
	}

  .create-code-ref {
    font-size: 4vw;
  }

  .form-link {
		margin: 2em auto;
	}

	.selector {
		font-size: 3vw;
	}

	.btn-primary {
		font-size: 3vw !important;
	}
}