
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Oxygen",
    "Ubuntu", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue",
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  background-color: black;
}

.angled {
  clip-path: polygon(
    0% 10px,
    /* top left */ 10px 0%,
    /* top left */ 0% 0%,
    /*calc(100% - 20px) 0%,/* top right */ 100% 0%,
    /*100% 20px,/* top right */ 100% calc(100% - 10px),
    /* bottom right */ calc(100% - 10px) 100%,
    /* bottom right */ 0% 100%,
    /*20px 100%,/* bottom left */ 0% 0% /*0 calc(100% - 20px)/* bottom left */
  );
}
body {
  font-family: "Sora v10 latin", sans-serif;
  color: #fff;
  font-size: 14px;
  line-height: 20px;
  background: url('./images/5d17a313-e321-4a72-b4d0-7906f485f88e.jpg');
  background-repeat: repeat;
}

.welcome-section {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  height: 100vh;
  padding-top: 131px;
  padding-bottom: 0px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  grid-auto-columns: 1fr;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
}

.welcome-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
}

.logo-image {
  margin-bottom: 174px;
}

.fearless-button {
  margin-bottom: 20px;
  padding-top: 16px;
  padding-bottom: 16px;
  background-color: blue;
  -webkit-transition: opacity 200ms ease;
  transition: opacity 200ms ease;
  text-align: center;
}

.fearless-button:active {
  opacity: 0.37;
}

.fearless-button.angled {
  cursor: pointer;
}

.fearless-button.import {
  width: 100%;
}

.fearless-button.import.angled.back-up-mnemonic {
  position: absolute;
  left: 5%;
  top: auto;
  right: 0%;
  bottom: 0%;
  width: 90%;
}

.fearless-button.import.angled.back-up-mnemonic.secondary {
  bottom: 9%;
  background-color: rgba(31, 31, 31, 0.99);
}

.terms {
  position: absolute;
  left: 0%;
  top: auto;
  right: 0%;
  bottom: 5%;
  text-align: center;
}

.terms-link {
  color: rgb(56, 56, 255);
}

.import-phrase-container {
  
  padding: 6px 40px;
  background-color: #000;
}
.fearless-button:disabled, .fearless-button[disabled]{
  opacity: 0.4;
  background-color: rgba(31, 31, 31, 0.99);
  cursor: not-allowed;
}
.import-phrase-container.new-phrase {
  
}

.import-phrase-container.backup-mnemonic {
  position: relative;
  
  height: 600px;
}

.import-phrase-container.confirm-mnemonic {
  position: relative;
  
  height: 700px;
}

.import-heading {
  width: 460px;
  font-size: 18px;
  text-align: center;
}

.top-header {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.top-header.confirm {
  -webkit-justify-content: space-around;
  -ms-flex-pack: distribute;
  justify-content: space-around;
}

.dropdown {
  background-color: hsla(0, 0%, 95.3%, 0);
  background-image: -webkit-gradient(
    linear,
    left top,
    left bottom,
    from(transparent),
    to(transparent)
  );
  background-image: linear-gradient(180deg, transparent, transparent);
  color: #fff;
}

.dropdown.angled {
  width: 100%;
  border-style: solid;
  border-width: 1px;
  border-color: hsla(0, 0%, 100%, 0.25);
  color: #fff;
}

.input {
  padding-top: 26px;
  padding-bottom: 26px;
  border-style: solid;
  border-width: 1px;
  border-color: hsla(0, 0%, 100%, 0.21);
  background-color: transparent;
  color: #fff;
}

.input.angled {
  border-style: none;
  border-width: 0px;
  background-color: rgba(31, 31, 31, 0.99);
}

.supporting-text {
  margin-top: 17px;
  margin-bottom: 23px;
  color: hsla(0, 0%, 100%, 0.74);
}

.supporting-text.advanced {
  margin-top: 0px;
}

.textarea.angled {
  height: 140px;
  margin-bottom: 59px;
  border-style: none;
  border-width: 0px;
  border-color: hsla(0, 0%, 100%, 0.21);
  background-color: rgba(31, 31, 31, 0.99);
  color: #fff;
}

.advanced-section {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 43px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.advanced-section.phrase {
  margin-top: 22px;
  margin-bottom: 9px;
}

.advanced-text {
  color: hsla(0, 0%, 100%, 0.74);
}

.div-block {
  display: block;
  margin-bottom: 38px;
}

.advanced-section {
  cursor: pointer;
}

/* .div-block.phrase {
  display: none;
} */

.imported-container {
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.image {
  width: 50px;
}

.imported-message {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.phrase-grid {
  display: -ms-grid;
  display: grid;
  padding-right: 81px;
  padding-left: 81px;
  grid-auto-columns: 1fr;
  grid-column-gap: 16px;
  grid-row-gap: 0px;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
}

.text-span {
  margin-right: 14px;
  color: hsla(0, 0%, 100%, 0.74);
}

.chosen-words {
  height: 150px;
  border-radius: 7px;
  background-color: rgba(31, 31, 31, 0.99);
}

.chosen-words.filled {
  display: -ms-grid;
  display: grid;
  height: 170px;
  padding: 17px 67px;
  grid-auto-columns: 1fr;
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  -ms-grid-columns: 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  -ms-grid-rows: auto auto;
  grid-template-rows: auto auto;
}

.instruction {
  margin-top: 14px;
  margin-bottom: 14px;
  text-align: center;
}

.mnemonic {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  height: 40px;
  margin-bottom: -3px;
  padding-right: 21px;
  padding-left: 21px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-radius: 6px;
  background-color: black;
}

.mnemonic.picked {
  background-color: rgba(0, 51, 255, 0.978);
}

@media screen and (max-width: 479px) {
  .welcome-container {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
  }

  .fearless-button.import.angled {
    font-size: 12px;
  }

  .terms {
    font-size: 12px;
  }

  .import-phrase-container {
    max-width: 350px;
    padding-right: 9px;
    padding-left: 9px;
  }

  /* .import-phrase-container.confirm-mnemonic {
    display: none;
  } */

  .import-heading {
    font-size: 16px;
  }

  .input.angled {
    font-size: 12px;
  }

  .supporting-text {
    font-size: 13px;
  }

  .supporting-text.advanced {
    font-size: 12px;
  }

  .textarea.angled {
    font-size: 12px;
  }

  /* .div-block.phrase {
    display: none;
  } */

  .text-span {
    margin-right: 0px;
  }

  .chosen-words.filled {
    padding-right: 7px;
    padding-left: 7px;
  }

  .mnemonic {
    padding-right: 8px;
    padding-left: 8px;
  }

  .success-text {
    font-size: 20px;
    line-height: 30px;
    text-align: center;
  }
}

#w-node-eb0a3b42-289f-0b2a-56ce-7b3a5c7beaa7-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-_3a1f8922-b2db-319f-46e5-b41b052f1b7e-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-_3d5afed5-ae4a-3535-3801-4c07d8616b65-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-cb517555-4c92-1e91-3d97-0180569524c2-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-ade59292-ed5a-3a59-2f08-85965d2050df-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-_37343b0f-688d-834d-1921-e6678a5edc82-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-_3819fdde-d08a-94ee-f0a6-b7bed886fedc-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-a31e1eb2-e13a-1aab-9e15-14765cf66dd1-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-b5997888-5b2c-8f19-2f3c-a66508709a8a-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-ac6c8f22-96b2-d370-8278-6c236a36c207-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-_38a4755e-8cf7-2737-5895-d3fa101d384d-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-f4e7ea3b-6d62-0b50-e441-b9e92d51f8cd-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
}

#w-node-de2ec56b-6d21-b2f6-d3eb-5a1e72e7d7a5-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_90f42a1e-6e76-b21e-7ecd-14347c03aea6-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_55b1d197-bd43-9f2b-5556-b8bc8d478b34-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_01292f5d-b9dc-c735-129a-0cde0480c338-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-d9396110-1653-609c-6835-0458623b7142-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_8e5c524e-d26a-912b-3ca4-e02b172fbb5c-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-d5c89f86-d002-578f-ce9b-caa9af6058ee-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_3dd9f591-955a-e15f-e5d0-ca9635e0daa2-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-bf3200a9-8322-0252-05b9-6128fd45b695-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-bf7d042a-ed54-f9ff-c2eb-108035c0afee-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_60b38f1d-6d44-de5c-0049-ac318af6c455-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_35c49d32-f962-2885-5af8-23c28aa11307-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}

#w-node-_687498d4-4854-22d7-3d70-048bf5460577-facedbcf {
  -ms-grid-column: span 1;
  grid-column-start: span 1;
  -ms-grid-column-span: 1;
  grid-column-end: span 1;
  -ms-grid-row: span 1;
  grid-row-start: span 1;
  -ms-grid-row-span: 1;
  grid-row-end: span 1;
  align-self: baseline;
  -ms-grid-column-align: end;
  justify-self: end;
}
@font-face {
  font-family: "Sora v10 latin 600";
  src: url("/fonts/638876bcd5caa3681f022f41_sora-v10-latin-600.woff2")
    format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sora v10 latin 700";
  src: url("/fonts/638876bc719ea6f84e78e3c1_sora-v10-latin-700.woff2")
    format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sora v10 latin";
  src: url("/fonts/638876bc83b03ab3e7362c3c_sora-v10-latin-regular.woff2")
    format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sora v10 latin 800";
  src: url("/fonts/638876bcd8c4fc6e11f47893_sora-v10-latin-800.woff2")
    format("woff2");
  font-weight: 800;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sora v10 latin 100";
  src: url("/fonts/638876bb3306175c436e0612_sora-v10-latin-100.woff2")
    format("woff2");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sora v10 latin 500";
  src: url("/fonts/638876bb330617674f6e0613_sora-v10-latin-500.woff2")
    format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sora v10 latin 300";
  src: url("/fonts/638876bba2089ee34555b245_sora-v10-latin-300.woff2")
    format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Sora v10 latin 200";
  src: url("/fonts/638876bb027ee0b726ca1605_sora-v10-latin-200.woff2")
    format("woff2");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
