.barcode-input{
  background-color: #EFEFEF;
  color: #01626B;
  font-weight: bold;
  width: 60%;
  line-height: 2rem;
  padding: 0 0 0 10px;
  border-top: 3px solid #01626B;
  border-left: 3px solid #01626B;
  border-bottom: 3px solid #01626B;
  border-right: none;
  border-radius: 0;

  outline: 0;
  font-size: .7142857143rem;
  margin: 0;
  height: 2rem;
  float: left;
}

::-webkit-input-placeholder {
   color: #01626B;
   font-weight: normal;
}

:-moz-placeholder { /* Firefox 18- */
   color: #01626B;
   font-weight: normal;
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #01626B;
   font-weight: normal;
}

:-ms-input-placeholder {
   color: #01626B;
   font-weight: normal;
}

.generate-button{
  font-weight: 700;
  text-transform: uppercase;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #01626B;
  color: #EFEFEF;
  width: 40%;
  line-height: 1rem;
  border: 3px solid #01626B;
  position: relative;
  overflow: hidden;
  transition: background .2s cubic-bezier(.16,0,.06,1);

  outline: 0;
  font-size: .7142857143rem;
  margin: 0;
  height: 2rem;
  float: left;

  cursor: pointer;
}

.generate-button:hover {
  background-color: #C3333F;
}

button[disabled=disabled], button:disabled {
  cursor: auto;
}

.red-input{
  border-top: 3px solid #C3333F;
  border-left: 3px solid #C3333F;
  border-bottom: 3px solid #C3333F;
}

.red-button{
  background-color: #C3333F;
  border: 3px solid #C3333F;
}

.red-button-no-border{
  background-color: #C3333F;
}
