:root {
  --color--grey--13: #222;
  --color--grey--98: #faf9fb;
  --color--magenta--22: #3e3040;
  --font-family--font-2: "Apercu Pro";
  --font-size--16: 16px;
  --font-weight--400: 400px;
  --font-weight--500: 500px;
  --item-spacing--8: 8px;
  --item-spacing--20: 20px;
  --line-height--22_4: 22.4px;
  --line-height--16: 16px;
  --width--1920: 1920px;
  --width--154_28: 154.28px;
  --width--63_67: 63.67px;
  --width--194_84: 194.84px;
  --width--160: 160px;
  --width--411_14: 411.14px;
  --width--88_34: 88.34px;
  --width--1536: 1536px;
}

.body {
  background-image: radial-gradient(circle farthest-side at 75% 100%, #ccb4fc, #fff 75%);
  font-family: Manrope, sans-serif;
  font-size: 1rem;
  line-height: 1.5;
}

.page-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  display: flex;
}

.main-wrapper {
  justify-content: center;
  align-items: center;
}

.padding-global {
  margin-left: 5%;
  margin-right: 5%;
}

.container {
  grid-column-gap: 2rem;
  grid-row-gap: 2rem;
  width: 100%;
  max-width: 22rem;
  margin-left: auto;
  margin-right: auto;
}

.logo-image {
  object-fit: cover;
  flex: none;
}

.identity-image {
  border-radius: 1.4rem;
  justify-content: space-between;
  width: 100%;
  max-width: 6rem;
  height: auto;
  display: flex;
  overflow: hidden;
}

.identity-name {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-flow: column;
  display: flex;
}

.social-link {
  background-color: var(--color--grey--13);
  color: var(--color--grey--98);
  border-radius: .5rem;
  justify-content: center;
  align-items: center;
  width: 3rem;
  height: 3rem;
  text-decoration: none;
  transition: opacity .2s cubic-bezier(.77, 0, .175, 1);
  display: flex;
}

.social-link:hover {
  opacity: .9;
}

.social-icon {
  justify-content: center;
  align-items: center;
  display: flex;
}

.heading-style-h1 {
  margin-top: 0;
  margin-bottom: 0;
  font-family: Sora, sans-serif;
  font-size: 1.5rem;
  line-height: 1;
}

.text-size-normal {
  margin-bottom: 0;
}

.pixkey-info {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  text-align: center;
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.info-key-title {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  justify-content: center;
  align-items: center;
  font-weight: 600;
  display: flex;
}

.icon-key {
  justify-content: center;
  align-items: center;
  display: flex;
}

.text-size-large {
  font-family: Sora, sans-serif;
}

.button {
  background-color: var(--color--grey--13);
  color: var(--color--grey--98);
  text-align: center;
  border-radius: .875rem;
  justify-content: center;
  align-items: center;
  padding: 1rem;
  text-decoration: none;
  display: flex;
}

.section_identity {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  text-align: center;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.footer {
  text-align: center;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.section_qrcode {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  padding-top: 1rem;
  display: flex;
}

.qrcode-button {
  grid-column-gap: .25rem;
  grid-row-gap: .25rem;
  cursor: pointer;
  justify-content: center;
  align-items: center;
  padding: .25rem .25rem .25rem .6rem;
  font-weight: 600;
  display: flex;
}

.icon-arrow {
  justify-content: center;
  align-items: center;
  margin-top: .15rem;
  display: flex;
}

.qrcode-content {
  overflow: hidden;
}

.qrcode {
  background-color: var(--color--grey--98);
  border-radius: .5rem;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  max-width: 10rem;
  height: auto;
  display: flex;
  overflow: hidden;
}

.qrcode-image {
  object-fit: contain;
  flex: none;
  padding: 1rem;
}

.section_pixkey {
  flex-flow: column;
  display: flex;
}

.section_social {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  justify-content: center;
  align-items: center;
  padding-top: 1.5rem;
  padding-bottom: 1.5rem;
  display: flex;
}

.identity-wrapper {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
}

.social-wrapper {
  grid-column-gap: .5rem;
  grid-row-gap: .5rem;
  justify-content: space-between;
  align-items: center;
  display: flex;
}

.pixkey-wrapper {
  grid-column-gap: 1rem;
  grid-row-gap: 1rem;
  flex-flow: column;
  display: flex;
}

.qrcode-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
}

.text-style-small {
  font-size: 1rem;
  font-weight: 500;
  line-height: 1;
}

.website-link {
  color: var(--color--grey--13);
  justify-content: center;
  align-items: center;
  padding: .2rem .5rem .3rem;
  font-weight: 600;
  text-decoration: none;
  transition: opacity .2s cubic-bezier(.77, 0, .175, 1);
  display: flex;
}

.website-link:hover {
  opacity: .75;
}

@media screen and (max-width: 479px) {
  .body {
    height: 100%;
    overflow: hidden;
  }

  .page-wrapper {
    height: 100%;
  }
}


