/* Tailwind */

/* Breitenbeschränkung für Inhalt */

/* allgemeine Styles */

/* Formularvorlagen */

body.formtemplates section {
  margin-bottom: 4rem;
}

@media (min-width: 640px) {
  body.formtemplates section {
    margin-bottom: 5rem;
  }
}

@media (min-width: 1280px) {
  body.formtemplates section {
    margin-bottom: 8rem;
  }
}

body.formtemplates section > div {
  max-width: 86%;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

@media (min-width: 500px) {
  body.formtemplates section > div {
    max-width: 90%
  }
}

@media (min-width: 98rem) {
  body.formtemplates section > div {
    max-width: 90rem
  }
}

@media (min-width: 1280px) {
  body.formtemplates section > div {
    padding-left: 3.5rem;
    padding-right: 3.5rem;
  }
}

/* Hero */

body.formtemplates section#hero {
  background: url(./../img/hub-head-bg.avif) right top no-repeat, linear-gradient(rgb(235, 239, 250) 0%, rgba(248, 249, 252, 0) 90%);
}

body.formtemplates section#hero > div > div {
  gap: 3rem;
}

@media (min-width: 1024px) {
  body.formtemplates section#hero > div > div {
    gap: 3rem;
  }

  body.formtemplates section#hero > div > div > div:first-child {
    width: 50%;
  }

  body.formtemplates section#hero > div > div > div:last-child {
    width: 50%;
  }
}

@media (min-width: 640px) {
  body.formtemplates section#hero > div > div > div:last-child img {
    width: 66.666667%;
  }
}

@media (min-width: 1024px) {
  body.formtemplates section#hero > div > div > div:last-child img {
    width: 100%;
  }
}

body.formtemplates section#list {
  max-width: 86%;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

@media (min-width: 500px) {
  body.formtemplates section#list {
    max-width: 90%
  }
}

@media (min-width: 98rem) {
  body.formtemplates section#list {
    max-width: 90rem
  }
}

body.formtemplates section#list {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  gap: 2rem;
}

@media (min-width: 640px) {
  body.formtemplates section#list {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (min-width: 768px) {
  body.formtemplates section#list {
    -moz-column-gap: 4rem;
         column-gap: 4rem;
    row-gap: 3rem;
  }
}

@media (min-width: 1024px) {
  body.formtemplates section#list {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    -moz-column-gap: 7rem;
         column-gap: 7rem;
  }
}

@media (min-width: 1280px) {
  body.formtemplates section#list {
    padding-left: 3.5rem;
    padding-right: 3.5rem;
  }
}

body.formtemplates section#list article {
  position: relative;
  isolation: isolate;
  margin-bottom: 1rem;
  display: flex;
  flex-direction: column;
}

@media (min-width: 1024px) {
  body.formtemplates section#list article {
    margin-bottom: 2rem;
  }
}

body.formtemplates section#list article .thumb {
  width: 100%;
  flex: none;
  overflow: hidden;
  border-radius: 0.25rem;
}

body.formtemplates section#list article .thumb > img {
  margin-top: 0px;
  margin-bottom: 0px;
  height: auto;
  width: 100%;
}

body.formtemplates section#list article .desc {
  display: flex;
  width: 100%;
  flex: 1 1 0%;
  flex-direction: column;
  text-align: left;
}

body.formtemplates section#list article .desc h3 {
  margin-top: 1.5rem;
  margin-bottom: 1.75rem;
  flex: none;
  overflow-wrap: break-word;
}

body.formtemplates section#list article .desc p {
  margin-top: -1rem;
  flex: 1 1 0%;
}

body.formtemplates section#list article .desc .btn {
  flex: none;
}

body.formtemplates section#setup {
  --tw-bg-opacity: 1;
  background-color: rgb(255 247 237 / var(--tw-bg-opacity, 1));
}

body.formtemplates section#setup > div {
  display: grid;
  grid-template-columns: repeat(1, minmax(0, 1fr));
  row-gap: 2.5rem;
  padding-top: 3rem;
  padding-bottom: 3rem;
}

@media (min-width: 1024px) {
  body.formtemplates section#setup > div {
    grid-template-columns: repeat(12, minmax(0, 1fr));
    -moz-column-gap: 3.5rem;
         column-gap: 3.5rem;
    padding-top: 6rem;
    padding-bottom: 6rem;
  }

  body.formtemplates section#setup > div > div:first-child {
    grid-column: span 4 / span 4;
  }

  body.formtemplates section#setup > div > div:last-child {
    grid-column: span 8 / span 8;
  }
}

@media (min-width: 1280px) {
  body.formtemplates section#setup > div > div:last-child {
    grid-column: span 7 / span 7;
    grid-column-start: 6;
  }
}

body.formtemplates section#setup ol.list {
  margin: 0px;
  list-style-type: none;
}

body.formtemplates section#setup ol.list > :not([hidden]) ~ :not([hidden]) {
  --tw-space-y-reverse: 0;
  margin-top: calc(1.5rem * calc(1 - var(--tw-space-y-reverse)));
  margin-bottom: calc(1.5rem * var(--tw-space-y-reverse));
}

body.formtemplates section#setup ol.list {
  padding: 0px;
  counter-reset: muffins;
}

body.formtemplates section#setup ol.list > li {
  position: relative;
  padding-left: 4rem;
  counter-increment: muffins;
}

body.formtemplates section#setup ol.list > li:before {
  content: counter(muffins) ".";
  position: absolute;
  left: -1.5rem;
  top: -1.5rem;
  display: flex;
  height: 5rem;
  width: 5rem;
  align-items: center;
  justify-content: center;
  background-position: center;
  background-repeat: no-repeat;
  font-size: 1rem;
  line-height: 1.5rem;
  font-weight: 700;
  --tw-text-opacity: 1;
  color: rgb(180 83 9 / var(--tw-text-opacity, 1));
}

@media (min-width: 1024px) {
  body.formtemplates section#setup ol.list > li:before {
    font-size: 1.125rem;
    line-height: 1.75rem;
  }
}

body.formtemplates section#setup ol.list > li:before {
  background-size: 100% 100%;
}

body.formtemplates section#setup ol.list > li:nth-child(1):before {
  background-image: url("data:image/svg+xml,%3Csvg%20viewBox%3D%22-120%20-120%20240%20240%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M%2074.59911974679646%2C0%20C%2074.59911974679646%2C40.136792191482066%2042.58449689568297%2C102.2430953657485%206.260583973729075e-15%2C102.2430953657485%20C%20-42.58449689568295%2C102.2430953657485%20-95.73886783593538%2C40.13679219148208%20-95.73886783593538%2C1.1724629804926975e-14%20C%20-95.73886783593538%2C-40.13679219148205%20-42.584496895682975%2C-58.30407340017977%20-1.0710284530017372e-14%2C-58.30407340017977%20C%2042.584496895682946%2C-58.30407340017977%2074.59911974679646%2C-40.136792191482066%2074.59911974679646%2C0%20Z%22%20fill%3D%22%23fdba74%22%20%2F%3E%3C%2Fsvg%3E");
}

body.formtemplates section#setup ol.list > li:nth-child(2):before {
  background-image: url("data:image/svg+xml,%3Csvg%20viewBox%3D%22-120%20-120%20240%20240%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M%2097.82614977327444%2C0%20C%2097.82614977327444%2C40.54768961279303%2042.44301448245518%2C91.57473846308463%205.60733551707863e-15%2C91.57473846308463%20C%20-42.44301448245517%2C91.57473846308463%20-71.94590815654627%2C40.547689612793036%20-71.94590815654627%2C8.810832613566384e-15%20C%20-71.94590815654627%2C-40.54768961279302%20-42.44301448245519%2C-70.61601998808749%20-1.2971952427040528e-14%2C-70.61601998808749%20C%2042.44301448245516%2C-70.61601998808749%2097.82614977327444%2C-40.54768961279303%2097.82614977327444%2C0%20Z%22%20fill%3D%22%23fdba74%22%20%2F%3E%3C%2Fsvg%3E");
}

body.formtemplates section#setup ol.list > li:nth-child(3):before {
  background-image: url("data:image/svg+xml,%3Csvg%20viewBox%3D%22-120%20-120%20240%20240%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M%2095.42448933882348%2C0%20C%2095.42448933882348%2C37.83708570450027%2048.966881347843206%2C94.30695201744643%205.77463534627544e-15%2C94.30695201744643%20C%20-48.96688134784319%2C94.30695201744643%20-100.44303605254933%2C37.83708570450028%20-100.44303605254933%2C1.2300724259839674e-14%20C%20-100.44303605254933%2C-37.837085704500254%20-48.966881347843206%2C-57.041390800554645%20-1.0478333499421879e-14%2C-57.041390800554645%20C%2048.96688134784319%2C-57.041390800554645%2095.42448933882348%2C-37.83708570450027%2095.42448933882348%2C0%20Z%22%20fill%3D%22%23fdba74%22%20%2F%3E%3C%2Fsvg%3E");
}

body.formtemplates section#setup ol.list h3 {
  margin: 0px;
  font-size: 1rem;
  font-weight: 600;
  line-height: 2rem;
}

@media (min-width: 1024px) {
  body.formtemplates section#setup ol.list h3 {
    font-size: 1.125rem;
    line-height: 2rem;
  }
}

body.formtemplates section#setup ol.list p {
  margin: 0px;
}

body.formtemplates section#highlights h2 {
  text-align: center;
}

body.formtemplates section#highlights .list {
  margin-top: 3rem;
  display: grid;
  gap: 2rem;
}

@media (min-width: 1024px) {
  body.formtemplates section#highlights .list {
    margin-top: 4rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 4rem;
  }
}

body.formtemplates section#highlights .list .icon {
  margin-bottom: 0.75rem;
  display: flex;
  height: 2.75rem;
  width: 2.75rem;
  flex: none;
  align-items: center;
  justify-content: center;
  border-radius: 0.25rem;
  background-repeat: no-repeat;
}

@media (min-width: 1024px) {
  body.formtemplates section#highlights .list .icon {
    margin-bottom: 1.5rem;
  }
}

body.formtemplates section#highlights .list .icon {
  background-image: url("../img/Grain-Corner.png");
  background-size: 150% 100%;
  background-position: right bottom;
}

body.formtemplates section#highlights .list .icon svg {
  height: 1.5rem;
  width: 1.5rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

body.formtemplates section#highlights .list h4 {
  margin-bottom: 0px;
}

body.formtemplates section#highlights .list p {
  margin-top: 0.5rem;
}

body.formtemplates section#highlights .btnrow {
  margin-top: 3rem;
  text-align: center;
}

@media (min-width: 1024px) {
  body.formtemplates section#highlights .btnrow {
    margin-top: 5rem;
  }
}

/* Formularvorlage */

body.formtemplate section {
  margin-bottom: 4rem;
}

@media (min-width: 640px) {
  body.formtemplate section {
    margin-bottom: 5rem;
  }
}

@media (min-width: 1280px) {
  body.formtemplate section {
    margin-bottom: 8rem;
  }
}

body.formtemplate section > div {
  max-width: 86%;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

@media (min-width: 500px) {
  body.formtemplate section > div {
    max-width: 90%
  }
}

@media (min-width: 98rem) {
  body.formtemplate section > div {
    max-width: 90rem
  }
}

@media (min-width: 1280px) {
  body.formtemplate section > div {
    padding-left: 3.5rem;
    padding-right: 3.5rem;
  }
}

body.formtemplate header {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: 10;
}

body.formtemplate header > div {
  background-color: transparent;
}

body.formtemplate main {
  width: 100%;
}

body.formtemplate main > .head {
  position: relative;
  width: 100%;
  overflow: visible;
  background-image: url("../img/formtemplate-head-bg.avif"), linear-gradient(81.31deg, rgba(59, 130, 246, 0.35) -2.6%, rgba(59, 130, 246, 0.1) 111.71%);
  background-position: center bottom, center center;
  background-repeat: no-repeat, no-repeat;
  background-size: 745px, 100%;
  background-color: #F2F6FF;
  padding-top: 4.25rem;
  padding-bottom: 290px;
}

@media (min-width: 768px) {
  body.formtemplate main > .head {
    background-position: left bottom, center center;
    background-size: 100%, 100%
  }
}

@media (min-width: 1024px) {
  body.formtemplate main > .head {
    padding-top: 5.75rem
  }
}

body.formtemplate main > .head > div {
  max-width: 86%;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

@media (min-width: 500px) {
  body.formtemplate main > .head > div {
    max-width: 90%
  }
}

@media (min-width: 98rem) {
  body.formtemplate main > .head > div {
    max-width: 90rem
  }
}

body.formtemplate main > .head > div {
  padding-bottom: 2rem;
  padding-top: 1.5rem;
  text-align: center;
}

@media (min-width: 1024px) {
  body.formtemplate main > .head > div {
    padding-bottom: 3.5rem;
    padding-top: 2rem;
  }
}

body.formtemplate main > .head > svg {
  position: absolute;
  right: 0px;
  top: auto;
  z-index: 0;
  height: auto;
  width: 150vw;
  bottom: -1px;
  transform: rotateZ(-180deg);
}

@media (min-width: 768px) {
  body.formtemplate main > .head > svg {
    width: 100vw
  }
}

body.formtemplate main > .head a.btn {
  margin-bottom: 0.75rem;
  --tw-bg-opacity: 1;
  background-color: rgb(168 85 247 / var(--tw-bg-opacity, 1));
  padding-left: 0.75rem;
  padding-right: 0.75rem;
  padding-top: 0px;
  padding-bottom: 0px;
  font-size: 1rem;
  line-height: 1.5rem;
  line-height: 1.625;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

body.formtemplate main > .head a.btn:hover {
  --tw-bg-opacity: 1;
  background-color: rgb(147 51 234 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

body.formtemplate main > .head a.btn:focus-visible {
  outline-color: #a855f7;
}

body.formtemplate main > .head a.btn:hover:disabled {
  --tw-bg-opacity: 1;
  background-color: rgb(216 180 254 / var(--tw-bg-opacity, 1));
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

@media (min-width: 1024px) {
  body.formtemplate main > .head a.btn {
    margin-bottom: 1rem;
  }
}

body.formtemplate main > .head h1 {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px;
  width: 100%;
  overflow-wrap: break-word;
  max-width: 800px;
}

body.formtemplate main > .head p {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.75rem;
  width: 100%;
}

@media (min-width: 1024px) {
  body.formtemplate main > .head p {
    margin-top: 1rem;
  }
}

body.formtemplate main > .head p {
  max-width: 480px;
}

body.formtemplate section.form {
  position: relative;
}

body.formtemplate section.form #formcard + div {
  position: relative;
}

body.formtemplate section.form #formcard + div:after {
  position: absolute;
  z-index: 10;
  display: none;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}

@media (min-width: 640px) {
  body.formtemplate section.form #formcard + div:after {
    display: block;
  }
}

body.formtemplate section.form #formcard + div:after {
  background-image: url("../img/formtemplate-arrow.svg");
  content: "";
  width: calc(295px * .4);
  height: calc(326px * .4);
  left: calc(50% + 140px);
  bottom: 30px;
}

body.formtemplate #formcard {
  width: 90%;
  margin-left: auto;
  margin-right: auto;
  min-height: 24rem;
  max-width: 1024px;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding: 2rem;
  margin-top: -290px;
  box-shadow: 0px 1px 1px 0px rgba(49,67,81, 0.02),0px 2px 2px 0.5px rgba(49,67,81, 0.04),0px 4px 4px 1px rgba(49,67,81, 0.06),0px 8px 8px 1.5px rgba(49,67,81, 0.08),0px 16px 16px 2px rgba(49,67,81, 0.1),0px 32px 32px 2.5px rgba(49,67,81, 0.12);
}

body.formtemplate #formcard > div {
  margin-left: auto;
  margin-right: auto;
}

body.formtemplate section.txtfrmt {
  width: 90%;
  position: relative;
  margin-left: auto;
  margin-right: auto;
  margin-top: 4rem;
  max-width: 768px;
}

@media (min-width: 640px) {
  body.formtemplate section.txtfrmt {
    margin-top: 6rem;
  }
}

body.formtemplate section.install {
  margin-left: auto;
  margin-right: auto;
  max-width: 1024px;
}

body.formtemplate section.faq {
  margin-bottom: 0px;
}

body.formtemplate section.faq > div {
  padding-top: 0px;
}

/* Formulareinrichtung */

body.formsetup section {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 4rem;
  max-width: 1024px;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding: 2rem;
  box-shadow: 0px 7px 18px 2px rgba(0,0,0,0.24);
  width: 90%;
}

@media (min-width: 1280px) {
  body.formsetup section > div {
    padding-left: 3.5rem;
    padding-right: 3.5rem;
  }
}

body.formsetup header {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: 10;
}

body.formsetup header > div {
  background-color: transparent;
}

body.formsetup main {
  width: 100%;
}

body.formsetup main > .head {
  position: relative;
  width: 100%;
  overflow: visible;
  background-image: url("../img/formtemplate-head-bg.avif"), linear-gradient(81.31deg, rgba(59, 130, 246, 0.35) -2.6%, rgba(59, 130, 246, 0.1) 111.71%);
  background-position: center bottom, center center;
  background-repeat: no-repeat, no-repeat;
  background-size: 745px, 100%;
  background-color: #F2F6FF;
  padding-top: 4.25rem;
  padding-bottom: 290px;
}

@media (min-width: 768px) {
  body.formsetup main > .head {
    background-position: left bottom, center center;
    background-size: 100%, 100%
  }
}

@media (min-width: 1024px) {
  body.formsetup main > .head {
    padding-top: 5.75rem
  }
}

body.formsetup main > .head > div {
  max-width: 86%;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

@media (min-width: 500px) {
  body.formsetup main > .head > div {
    max-width: 90%
  }
}

@media (min-width: 98rem) {
  body.formsetup main > .head > div {
    max-width: 90rem
  }
}

body.formsetup main > .head > div {
  padding-bottom: 2rem;
  padding-top: 1.5rem;
  text-align: center;
}

@media (min-width: 1024px) {
  body.formsetup main > .head > div {
    padding-bottom: 3.5rem;
    padding-top: 2rem;
  }
}

body.formsetup main > .head > svg {
  position: absolute;
  right: 0px;
  top: auto;
  z-index: 0;
  height: auto;
  width: 150vw;
  bottom: -1px;
  transform: rotateZ(-180deg);
}

@media (min-width: 768px) {
  body.formsetup main > .head > svg {
    width: 100vw
  }
}

body.formsetup main > .head h1 {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px;
  width: 100%;
  overflow-wrap: break-word;
  max-width: 800px;
}

body.formsetup main > .head p {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.75rem;
  width: 100%;
}

@media (min-width: 1024px) {
  body.formsetup main > .head p {
    margin-top: 1rem;
  }
}

body.formsetup main > .head p {
  max-width: 480px;
}

body.formsetup section#html {
  margin-top: -290px;
}

body.formsetup section#html .connection-info-area, body.formsetup section#html .connection-ready-area .toast {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}

body.formsetup section#html .connection-info-area > div:first-child, body.formsetup section#html .connection-ready-area .toast > div:first-child {
  flex: none;
}

body.formsetup section#html .connection-info-area > div:last-child, body.formsetup section#html .connection-ready-area .toast > div:last-child {
  flex: 1 1 0%;
}

body.formsetup section#html .connection-info-area svg, body.formsetup section#html .connection-ready-area .toast svg {
  width: 2rem;
  height: 2rem;
}

body.formsetup section#html .connection-info-area h4, body.formsetup section#html .connection-ready-area .toast h4 {
  margin: 0px;
}

body.formsetup section#html .btn-area {
  margin-top: 1.5rem;
  text-align: center;
}

@media (min-width: 640px) {
  body.formsetup section#html .btn-area {
    text-align: right;
  }
}

body.formsetup section#html .btn {
  margin-bottom: 0.5rem;
  width: 100%;
}

@media (min-width: 640px) {
  body.formsetup section#html .btn {
    margin-left: 0.5rem;
    width: auto;
  }
}

body.formsetup section#html .code {
  max-width: none;
}

body.formsetup section#html .code > pre {
  height: 24rem;
}

/* Sendeadresse anfordern */

body.formrequest section {
  position: relative;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 4rem;
  max-width: 1024px;
  border-radius: 0.5rem;
  --tw-bg-opacity: 1;
  background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
  padding: 2rem;
}

@media (min-width: 640px) {
  body.formrequest section {
    margin-bottom: 5rem;
  }
}

@media (min-width: 1280px) {
  body.formrequest section {
    margin-bottom: 8rem;
  }
}

body.formrequest section {
  box-shadow: 0px 7px 18px 2px rgba(0,0,0,0.24);
  width: 90%;
}

@media (min-width: 1280px) {
  body.formrequest section > div {
    padding-left: 3.5rem;
    padding-right: 3.5rem;
  }
}

body.formrequest header {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  z-index: 10;
}

body.formrequest header > div {
  background-color: transparent;
}

body.formrequest main {
  width: 100%;
}

body.formrequest main > .head {
  position: relative;
  width: 100%;
  overflow: visible;
  background-image: url("../img/formtemplate-head-bg.avif"), linear-gradient(81.31deg, rgba(59, 130, 246, 0.35) -2.6%, rgba(59, 130, 246, 0.1) 111.71%);
  background-position: center bottom, center center;
  background-repeat: no-repeat, no-repeat;
  background-size: 745px, 100%;
  background-color: #F2F6FF;
  padding-top: 4.25rem;
  padding-bottom: 290px;
}

@media (min-width: 768px) {
  body.formrequest main > .head {
    background-position: left bottom, center center;
    background-size: 100%, 100%
  }
}

@media (min-width: 1024px) {
  body.formrequest main > .head {
    padding-top: 5.75rem
  }
}

body.formrequest main > .head > div {
  max-width: 86%;
  margin-left: auto;
  margin-right: auto;
  width: 100%;
}

@media (min-width: 500px) {
  body.formrequest main > .head > div {
    max-width: 90%
  }
}

@media (min-width: 98rem) {
  body.formrequest main > .head > div {
    max-width: 90rem
  }
}

body.formrequest main > .head > div {
  padding-bottom: 2rem;
  padding-top: 1.5rem;
  text-align: center;
}

@media (min-width: 1024px) {
  body.formrequest main > .head > div {
    padding-bottom: 3.5rem;
    padding-top: 2rem;
  }
}

body.formrequest main > .head > svg {
  position: absolute;
  right: 0px;
  top: auto;
  z-index: 0;
  height: auto;
  width: 150vw;
  bottom: -1px;
  transform: rotateZ(-180deg);
}

@media (min-width: 768px) {
  body.formrequest main > .head > svg {
    width: 100vw
  }
}

body.formrequest main > .head img {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 2rem;
  width: 66.666667%;
}

@media (min-width: 640px) {
  body.formrequest main > .head img {
    width: 24rem;
  }
}

body.formrequest main > .head h1 {
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 0px;
  width: 100%;
  overflow-wrap: break-word;
  max-width: 800px;
}

body.formrequest main > .head p {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0.75rem;
  width: 100%;
}

@media (min-width: 1024px) {
  body.formrequest main > .head p {
    margin-top: 1rem;
  }
}

body.formrequest main > .head p {
  max-width: 480px;
}

body.formrequest section#connection {
  margin-top: -290px;
}

body.formrequest section#connection form {
  margin-top: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

@media (min-width: 768px) {
  body.formrequest section#connection form {
    gap: 1.5rem;
  }
}

@media (min-width: 1024px) {
  body.formrequest section#connection form {
    margin-top: 3rem;
    margin-bottom: 3rem;
    margin-left: 3rem;
    margin-right: 3rem;
  }
}

body.formrequest section#connection form > div:last-child {
  margin-top: 0.5rem;
  display: flex;
  flex-direction: column;
  align-items: stretch;
}

@media (min-width: 640px) {
  body.formrequest section#connection form > div:last-child {
    align-items: flex-end;
  }
}

@media (min-width: 768px) {
  body.formrequest section#connection form > div:last-child {
    flex-direction: row;
    -moz-column-gap: 2rem;
         column-gap: 2rem;
  }
}

body.formrequest section#connection form > div:last-child > div:first-child {
  flex: 1 1 0%;
}

body.formrequest section#connection form > div:last-child > div:last-child {
  margin-top: 1rem;
  flex: none;
}

@media (min-width: 768px) {
  body.formrequest section#connection form > div:last-child > div:last-child {
    margin-top: 0px;
  }
}

body.formrequest section#connection form .btn {
  width: 100%;
}

@media (min-width: 640px) {
  body.formrequest section#connection form .btn {
    width: auto;
  }
}

body.formrequest section#connection .toast {
  margin-top: 2rem;
}

body.formrequest section#connection #content-success h3 {
  margin-top: 1.5rem;
}

body.formrequest section#connection #content-success .address {
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

@media (min-width: 640px) {
  body.formrequest section#connection #content-success .address {
    flex-direction: row;
    gap: 1rem;
  }
}

@media (min-width: 768px) {
  body.formrequest section#connection #content-success .address {
    margin-top: 2.5rem;
    margin-bottom: 2.5rem;
  }
}

@media (min-width: 1024px) {
  body.formrequest section#connection #content-success .address {
    margin-left: 6rem;
    margin-right: 6rem;
  }
}

body.formrequest section#connection #content-success .address pre {
  flex: 1 1 0%;
  overflow-x: auto;
  border-radius: 0.25rem;
  --tw-bg-opacity: 1;
  background-color: rgb(231 70 148 / var(--tw-bg-opacity, 1));
  padding-left: 1rem;
  padding-right: 1rem;
  padding-top: 0.75rem;
  padding-bottom: 0.75rem;
  line-height: 1.75rem;
  --tw-text-opacity: 1;
  color: rgb(255 255 255 / var(--tw-text-opacity, 1));
}

body.formrequest section#connection #content-success .address button {
  display: block;
  width: 100%;
  flex: none;
}

@media (min-width: 640px) {
  body.formrequest section#connection #content-success .address button {
    width: auto;
  }
}

body.formrequest section#connection #content-success .btn-area {
  margin-top: 1.5rem;
  text-align: center;
}

@media (min-width: 640px) {
  body.formrequest section#connection #content-success .btn-area {
    text-align: right;
  }
}

body.formrequest section#connection #content-success .btn-area .btn {
  margin-bottom: 0.5rem;
  width: 100%;
}

@media (min-width: 640px) {
  body.formrequest section#connection #content-success .btn-area .btn {
    margin-left: 0.5rem;
    width: auto;
  }
}