/* colors */
/* status */
/* dialog */
/* tools */
:root {
  --io-100: #000000;
  --io-120: #0a0a0a;
  --io-150: #0f0f11;
  --io-170: #111112;
  --io-180: #17171b;
  --io-190: #151517;
  --io-200: #1a1b21;
  --io-220: #1d1e22;
  --io-250: #212226;
  --io-270: #26272c;
  --io-300: #27292F;
  --io-400: #292B31;
  --io-450: #353740;
  --io-550: #4e5562;
  --io-600: #4F5461;
  --io-700: #5e6372;
  --io-750: #848B99;
  --io-770: #888D9B;
  --io-800: #A4A9B7;
  --io-850: #b8bbc6;
  --io-white: #ffffff;
  --io-yellow-1: #EEAC1C;
  --io-yellow-2: #FFBC3B;
  --io-green: #00c32e;
  --io-modal: #2B2E35E8;
  --io-darkorange: #B34F12;
  --io-blue-1: #3a83d1;
  --io-blue-2: #448cd9;
  --iog-brick-darker: #C65040FF;
  --iog-brick: #DC5947FF;
  --iog-brick-lighter: #EA614FFF;
  --iog-brick-superlight: #fc6b58FF;
  --iog-brick-trans: #DC594733;
  --iog-000-trans: #00000000;
  --iog-000: #000000FF;
  --iog-050: #050506FF;
  --iog-100: #0B0C0EFF;
  --iog-150: #0E0E11FF;
  --iog-160: #121216FF;
  --iog-200: #151519FF;
  --iog-200-trans: #15151961;
  --iog-225: #17181DFF;
  --iog-250: #1A1A1FFF;
  --iog-300: #202026FF;
  --iog-350: #25262CFF;
  --iog-400: #2A2B33FF;
  --iog-450: #393944FF;
  --iog-500: #4C4E59FF;
  --iog-600: #5F626EFF;
  --iog-700: #848A99FF;
  --iog-725: #A4A9B7FF;
  --iog-750: #B7BDCDFF;
  --iog-800: #CBCED4FF;
  --iog-850: #E4E5E8FF;
  --iog-white: #FFFFFFFF;
  --iog-shadow-1: #0000008C;
  --iog-shadow-2: #00000066;
  --iog-shadow-3: #0000004D;
  --iog-shadow-4: #000000DE;
  --iog-lighter-1: #FFFFFF05;
  --iog-lighter-2: #FFFFFFDE;

}

@import url('https://fonts.googleapis.com/css2?family=Manrope:wght@400;600;700&display=swap');

/* io-yellow-1 */
/* io-700 */
/* io-450 */
body {
  background: var(--iog-200) !important;
  font: 16px "Manrope", system-ui, Sans-serif;
  color: #ffffff;
  margin: 0;
  padding: 0;
}

a {
  text-decoration: none;
  color: var(--iog-brick);
}

a:hover {
 color: var(--iog-brick-superlight);
}


.layout {
  position: relative;
  width: 100%;
}
.layout h1 {
  font-family: 'Manrope', system-ui, sans-serif;
  font-size: 1.8em;
  font-weight: 700;
  margin: 0;
  padding-bottom: 10px;
  color: #ffffff;
}

.layout h2 {
  font-size: 1.8em;
  font-weight: normal;
  text-align: center;
  color: #ffffff;
  margin: 0;
  padding-bottom: 10px;
}

.layout p {
  color: #ffffff;
}

.layout p.help-text {
  color: #ffffff !important;
}

.layout #sms-form {
  margin: 0 auto;
  margin-top: 200px;
  width: 320px;
  padding: 24px 32px;
  background: var(--iog-250);
  border-radius: 8px;
  border: 1px solid var(--io-250);
  box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.3);
}
.layout #sms-form p {
  margin: 10px 0;
  font-size: 16px !important;
}

.layout #sms-form label {
  display: none;
}
.layout #sms-form input, .layout #sms-form input[type=reset], .layout #sms-form input[type=submit].btn-reset, .layout #sms-form input[type=submit]:not(.btn-reset) {
  width: 100%;
  background: var(--io-300);
  border: 1px solid var(--io-250);
  border-radius: 4px;
  text-align: center;
  font-size: 16px;
  letter-spacing: 1px;
  line-height: 1.5;
  padding: 8px;
  box-sizing: border-box;
  font-family: inherit;
  font-size: inherit;
  color: #ffffff;
}
.layout #sms-form input::-webkit-input-placeholder, .layout #sms-form input[type=reset]::-webkit-input-placeholder, .layout #sms-form input[type=submit].btn-reset::-webkit-input-placeholder, .layout #sms-form input[type=submit]:not(.btn-reset)::-webkit-input-placeholder { /* WebKit browsers */
  color: white;
}
.layout #sms-form input:-moz-placeholder, .layout #sms-form input[type=reset]:-moz-placeholder, .layout #sms-form input[type=submit].btn-reset:-moz-placeholder, .layout #sms-form input[type=submit]:-moz-placeholder:not(.btn-reset) { /* Mozilla Firefox 4 to 18 */
  color: white;
  opacity: 1;
}
.layout #sms-form input::-moz-placeholder, .layout #sms-form input[type=reset]::-moz-placeholder, .layout #sms-form input[type=submit].btn-reset::-moz-placeholder, .layout #sms-form input[type=submit]:not(.btn-reset)::-moz-placeholder { /* Mozilla Firefox 19+ */
  color: white;
  opacity: 1;
}
.layout #sms-form input:-ms-input-placeholder, .layout #sms-form input[type=reset]:-ms-input-placeholder, .layout #sms-form input[type=submit].btn-reset:-ms-input-placeholder, .layout #sms-form input[type=submit]:-ms-input-placeholder:not(.btn-reset) { /* Internet Explorer 10+ */
  color: white;
}
.layout #sms-form input:focus, .layout #sms-form input[type=reset]:focus, .layout #sms-form input[type=submit].btn-reset:focus, .layout #sms-form input[type=submit]:focus:not(.btn-reset) {
  outline: none;
}
.layout #sms-form input[type=submit], .layout #sms-form input[type=submit][type=reset], .layout #sms-form input[type=submit].btn-reset, .layout #sms-form input[type=submit]:not(.btn-reset), .layout #sms-form input[type=reset], .layout #sms-form input[type=reset] {
  box-shadow: none;
  cursor: pointer;
  padding: 15px;
  margin-bottom: 8px;
  text-transform: uppercase;
}
.layout #sms-form input[type=submit]:not(.btn-reset) {
  background: var(--iog-brick);
  border-color: var(--iog-brick);
  color: var(--iog-white);
}
.layout #sms-form input[type=submit]:not(.btn-reset):active, .layout #sms-form input[type=submit]:not(.btn-reset):hover {
  background: var(--iog-brick-superlight);
}
.layout #sms-form input[type=reset], .layout #sms-form input[type=reset][type=submit]:not(.btn-reset), .layout #sms-form input[type=submit].btn-reset {
  background: #5e6372;
  border-color: #5e6372;
  color: var(--io-800);
}
.layout #sms-form input[type=reset]:active, .layout #sms-form input[type=submit].btn-reset:active {
  background: #474b56;
}
.layout #sms-form .control-buttons {
  margin-top: 15px;
}

ul.alert {
  padding: 25px;
  margin: 20px auto;
  border: 1px solid transparent;
  border-radius: 4px;
  list-style: none;
  width: 300px;
}
ul.alert.msg-success {
  background-color: #dff0d8;
  border-color: #d6e9c6;
  color: #3c763d;
}
ul.alert.msg-error {
  background-color: #353740;
  border-color: black;
  color: #a94442;
}
ul.alert.msg-notice {
  background-color: #fcf8e3;
  border-color: #faebcc;
  color: #8a6d3b;
}

#footer {
  position: fixed;
  bottom: 16px;
  width: 100%;
  text-align: center;
  color: #fff;
}
#footer a {
  color: var(--iog-brick);
  text-decoration: none;
}

.orange {
  color: var(--iog-brick);
  /*color: #F3790C;*/
}

/*# sourceMappingURL=smsAuth.css.map */