body,
h1,
h2,
h3,
h4,
h5,
h6 {
  margin: 0;
}

body {
  font-size: 15px;
  line-height: 24px;
  margin: 0;
  background-color: #a9a9a9;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell,
    'Open Sans', 'Helvetica Neue', sans-serif;
  color: #666;
}

input {
  color: #666 !important;
}

body,
html,
#app,
#app > div {
  height: 100%;
}

#root {
  scroll-behavior: smooth;
}

a,
a:visited,
a:link,
a:hover {
  color: #d65600;
  text-decoration: none;
}
a:hover {
  text-decoration: underline;
}

img {
  max-width: 100%;
}

.sub-text {
  color: #777777;
  font-size: 0.9em;
}

.error-msg {
  color: red;
  font-size: 0.9em;
}

/* For OTP input field */
.otp-input-div-wrapper div {
  justify-content: space-between;
}

.otp-input-wrapper input {
  font-size: 1.8em;
  border: 1px solid #cbcbcb;
  border-radius: 5px;
  padding: 12px;
}

/* For all focused elements */
input:not(:disabled).otp-input-focused {
  outline-color: #607d8b !important;
  outline-width: 1px !important;
  outline-style: auto !important;
}

@media screen and (max-width: 330px) {
  .otp-input-wrapper input {
    font-size: 1.2em;
    padding: 5px;
  }
}

@media screen and (max-width: 600px) {
  .otp-input-wrapper input {
    padding: 10px 8px;
  }
}