/*! formalize.css | MIT License | github.com/interacthings/formalize */
*, *:before, *:after {
  box-sizing: inherit; }

html {
  box-sizing: border-box;
  text-rendering: optimizeLegibility; }

body {
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale; }

a {
  color: inherit;
  text-decoration: none; }

a:active, a:focus, a:hover {
  outline: none;
  color: currentColor;
  text-decoration: none; }

button:active, button:focus, button:hover {
  outline: none;
  color: currentColor;
  text-decoration: none; }

img {
  vertical-align: middle; }

blockquote, dl, dd, h1, h2, h3, h4, h5, h6, figure, p, pre, fieldset, ul, ol, menu, form {
  margin: 0; }

button, fieldset, iframe {
  border: 0; }

fieldset, ul, ol, button, menu {
  padding: 0; }

ol, ul {
  list-style: none; }

textarea {
  resize: vertical; }

table {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0; }

td {
  padding: 0; }

body {
  font-family: 'Poppins', sans-serif;
  margin: 0;
  padding: 0; }

.mobile {
  display: none !important; }

.mobile-f {
  display: none !important; }

.desktop {
  display: block; }

.desktop-f {
  display: flex; }

.mb-0 {
  margin-bottom: 0 !important; }

.hidden {
  display: none; }

.Login {
  width: 100vw;
  height: 100vh;
  background-image: url(../images/desktop-bg.jpg);
  background-size: cover;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative; }
  .Login .container {
    width: 100%;
    max-width: 1240px;
    display: flex;
    align-items: center;
    justify-content: center; }
  .Login-in {
    width: 100%;
    height: 100%;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative; }
  .Login-form {
    width: 100%;
    max-width: 731px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center; }
  .Login-logo {
    display: flex;
    align-items: center;
    justify-content: center;
    max-width: clamp(214px, 12.3vw, 236px); }
    .Login-logo img {
      width: 100%; }
  .Login-item {
    width: 100%;
    max-width: 446px;
    margin-top: 22px; }
    .Login-item:first-of-type {
      margin-top: 0; }
    .Login-item label {
      width: 100%;
      display: flex;
      position: relative;
      padding: 22px;
      border-radius: 800px;
      border: 1px solid #178B42;
      background: linear-gradient(269deg, #0E6100 0%, #000F0A 53.13%, #0E6100 100%);
      box-shadow: 0px 4px 20px 0px rgba(0, 198, 20, 0.5); }
      .Login-item label span {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
        pointer-events: none;
        transition: all 300ms;
        font-size: 20px;
        font-weight: 500;
        text-align: center;
        color: #fff; }
      .Login-item label input {
        width: 100%;
        background-color: transparent;
        border: none;
        outline: none;
        box-shadow: none;
        font-size: 20px;
        font-weight: 500;
        text-align: center;
        color: #fff; }
        .Login-item label input:focus, .Login-item label input:valid {
          background-color: transparent;
          border: none;
          outline: none;
          box-shadow: none; }
          .Login-item label input:focus + span, .Login-item label input:valid + span {
            left: 0;
            top: 0;
            font-size: 16px;
            transform: translate(30px, 5px); }
  .Login-text {
    margin-bottom: clamp(16px, 3.65vw, 70px);
    display: flex;
    align-items: center; }
    .Login-text h2 {
      font-size: clamp(24px, 1.875vw, 36px);
      font-weight: 600;
      line-height: 1.36;
      text-align: left;
      color: #fff; }
  .Login i.icon-check {
    width: 106px;
    height: 106px;
    background-size: 100% 100%;
    background-image: url(../images/icon-check.svg);
    flex-shrink: 0;
    margin-right: 24px; }
  .Login button {
    cursor: pointer; }
  .Login button[type=submit] {
    margin-top: 22px; }
  .Login-submit {
    width: 100%;
    max-width: 446px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 21px;
    border-radius: 800px;
    background: #FFC700;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    color: #000f0a;
    transition: all 300ms;
    position: relative;
    z-index: 1;
    margin-bottom: 20px; }
    .Login-submit:hover {
      transform: scale(0.97); }
  .Login-register {
    width: 100%;
    max-width: 446px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 21px;
    border-radius: 800px;
    background: #00CA4B;
    font-size: 20px;
    font-weight: 600;
    text-align: center;
    color: #000f0a;
    transition: all 300ms;
    position: relative;
    z-index: 1;
    margin-bottom: 20px; }
    .Login-register:hover {
      transform: scale(0.97); }
  .Login-error {
    color: #fff;
    margin-top: 8px; }

@media (max-width: 768px) {
  .Login {
    background-image: url(../images/mobile-bg.jpg); }
    .Login .container {
      padding: 0 25px; }
    .Login-logo {
      margin-bottom: 24px; }
    .Login-item {
      max-width: 375px;
      margin-top: 16px; }
      .Login-item label {
        padding: 16px; }
        .Login-item label span {
          font-size: 15px; }
        .Login-item label input {
          font-size: 15px; }
          .Login-item label input:focus + span, .Login-item label input:valid + span {
            font-size: 12px; }
    .Login-text {
      flex-direction: column; }
      .Login-text i.icon-check {
        margin-right: 0;
        margin-bottom: 16px; }
      .Login-text h2 {
        text-align: center; }
    .Login-submit {
      max-width: 375px;
      padding: 16px;
      font-size: 15px;
      margin-bottom: 15px; }
    .Login-register {
      max-width: 375px;
      padding: 16px;
      font-size: 15px; } }