/*! normalize-scss | MIT/GPLv2 License | bit.ly/normalize-scss */
/* Document
   ========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in
 *    IE on Windows Phone and in iOS.
 */
html {
  line-height: 1.15;
  /* 1 */
  -ms-text-size-adjust: 100%;
  /* 2 */
  -webkit-text-size-adjust: 100%;
  /* 2 */
}

/* Sections
   ========================================================================== */
/**
 * Remove the margin in all browsers (opinionated).
 */
body {
  margin: 0;
}

/**
 * Add the correct display in IE 9-.
 */
article,
aside,
footer,
header,
nav,
section {
  display: block;
}

/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
h1 {
  font-size: 2em;
  margin: 0.67em 0;
}

/* Grouping content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
figcaption,
figure {
  display: block;
}

/**
 * Add the correct margin in IE 8.
 */
figure {
  margin: 1em 40px;
}

/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
hr {
  box-sizing: content-box;
  /* 1 */
  height: 0;
  /* 1 */
  overflow: visible;
  /* 2 */
}

/**
 * Add the correct display in IE.
 */
main {
  display: block;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
pre {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/* Links
   ========================================================================== */
/**
 * 1. Remove the gray background on active links in IE 10.
 * 2. Remove gaps in links underline in iOS 8+ and Safari 8+.
 */
a {
  background-color: transparent;
  /* 1 */
  -webkit-text-decoration-skip: objects;
  /* 2 */
}

/* Text-level semantics
   ========================================================================== */
/**
 * 1. Remove the bottom border in Chrome 57- and Firefox 39-.
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
abbr[title] {
  border-bottom: none;
  /* 1 */
  text-decoration: underline;
  /* 2 */
  -webkit-text-decoration: underline dotted;
          text-decoration: underline dotted;
  /* 2 */
}

/**
 * Prevent the duplicate application of `bolder` by the next rule in Safari 6.
 */
b,
strong {
  font-weight: inherit;
}

/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
b,
strong {
  font-weight: bolder;
}

/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
code,
kbd,
samp {
  font-family: monospace, monospace;
  /* 1 */
  font-size: 1em;
  /* 2 */
}

/**
 * Add the correct font style in Android 4.3-.
 */
dfn {
  font-style: italic;
}

/**
 * Add the correct background and color in IE 9-.
 */
mark {
  background-color: #ff0;
  color: #000;
}

/**
 * Add the correct font size in all browsers.
 */
small {
  font-size: 80%;
}

/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
sub,
sup {
  font-size: 75%;
  line-height: 0;
  position: relative;
  vertical-align: baseline;
}

sub {
  bottom: -0.25em;
}

sup {
  top: -0.5em;
}

/* Embedded content
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
audio,
video {
  display: inline-block;
}

/**
 * Add the correct display in iOS 4-7.
 */
audio:not([controls]) {
  display: none;
  height: 0;
}

/**
 * Remove the border on images inside links in IE 10-.
 */
img {
  border-style: none;
}

/**
 * Hide the overflow in IE.
 */
svg:not(:root) {
  overflow: hidden;
}

/* Forms
   ========================================================================== */
/**
 * 1. Change the font styles in all browsers (opinionated).
 * 2. Remove the margin in Firefox and Safari.
 */
button,
input,
optgroup,
select,
textarea {
  font-family: sans-serif;
  /* 1 */
  font-size: 100%;
  /* 1 */
  line-height: 1.15;
  /* 1 */
  margin: 0;
  /* 2 */
}

/**
 * Show the overflow in IE.
 */
button {
  overflow: visible;
}

/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
button,
select {
  /* 1 */
  text-transform: none;
}

/**
 * 1. Prevent a WebKit bug where (2) destroys native `audio` and `video`
 *    controls in Android 4.
 * 2. Correct the inability to style clickable types in iOS and Safari.
 */
button,
html [type=button],
[type=reset],
[type=submit] {
  -webkit-appearance: button;
  /* 2 */
}

button,
[type=button],
[type=reset],
[type=submit] {
  /**
   * Remove the inner border and padding in Firefox.
   */
  /**
   * Restore the focus styles unset by the previous rule.
   */
}
button::-moz-focus-inner,
[type=button]::-moz-focus-inner,
[type=reset]::-moz-focus-inner,
[type=submit]::-moz-focus-inner {
  border-style: none;
  padding: 0;
}
button:-moz-focusring,
[type=button]:-moz-focusring,
[type=reset]:-moz-focusring,
[type=submit]:-moz-focusring {
  outline: 1px dotted ButtonText;
}

/**
 * Show the overflow in Edge.
 */
input {
  overflow: visible;
}

/**
 * 1. Add the correct box sizing in IE 10-.
 * 2. Remove the padding in IE 10-.
 */
[type=checkbox],
[type=radio] {
  box-sizing: border-box;
  /* 1 */
  padding: 0;
  /* 2 */
}

/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
[type=number]::-webkit-inner-spin-button,
[type=number]::-webkit-outer-spin-button {
  height: auto;
}

/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
[type=search] {
  -webkit-appearance: textfield;
  /* 1 */
  outline-offset: -2px;
  /* 2 */
  /**
   * Remove the inner padding and cancel buttons in Chrome and Safari on macOS.
   */
}
[type=search]::-webkit-search-cancel-button, [type=search]::-webkit-search-decoration {
  -webkit-appearance: none;
}

/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
::-webkit-file-upload-button {
  -webkit-appearance: button;
  /* 1 */
  font: inherit;
  /* 2 */
}

/**
 * Correct the padding in Firefox.
 */
fieldset {
  padding: 0.35em 0.75em 0.625em;
}

/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
legend {
  box-sizing: border-box;
  /* 1 */
  display: table;
  /* 1 */
  max-width: 100%;
  /* 1 */
  padding: 0;
  /* 3 */
  color: inherit;
  /* 2 */
  white-space: normal;
  /* 1 */
}

/**
 * 1. Add the correct display in IE 9-.
 * 2. Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
progress {
  display: inline-block;
  /* 1 */
  vertical-align: baseline;
  /* 2 */
}

/**
 * Remove the default vertical scrollbar in IE.
 */
textarea {
  overflow: auto;
}

/* Interactive
   ========================================================================== */
/*
 * Add the correct display in Edge, IE, and Firefox.
 */
details {
  display: block;
}

/*
 * Add the correct display in all browsers.
 */
summary {
  display: list-item;
}

/*
 * Add the correct display in IE 9-.
 */
menu {
  display: block;
}

/* Scripting
   ========================================================================== */
/**
 * Add the correct display in IE 9-.
 */
canvas {
  display: inline-block;
}

/**
 * Add the correct display in IE.
 */
template {
  display: none;
}

/* Hidden
   ========================================================================== */
/**
 * Add the correct display in IE 10-.
 */
[hidden] {
  display: none;
}

.blocker {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  z-index: 1;
  padding: 20px;
  box-sizing: border-box;
  background-color: #000;
  background-color: rgba(0, 0, 0, 0.75);
  text-align: center;
}

.blocker:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.05em;
}

.blocker.behind {
  background-color: transparent;
}

.modal {
  display: none;
  vertical-align: middle;
  position: relative;
  z-index: 2;
  max-width: 500px;
  box-sizing: border-box;
  width: 90%;
  background: #fff;
  padding: 15px 30px;
  border-radius: 8px;
  -o-box-shadow: 0 0 10px #000;
  -ms-box-shadow: 0 0 10px #000;
  box-shadow: 0 0 10px #000;
  text-align: left;
}

.modal a.close-modal {
  position: absolute;
  top: -12.5px;
  right: -12.5px;
  display: block;
  width: 30px;
  height: 30px;
  text-indent: -9999px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAYAAAA6/NlyAAAAAXNSR0IArs4c6QAAA3hJREFUaAXlm8+K00Acx7MiCIJH/yw+gA9g25O49SL4AO3Bp1jw5NvktC+wF88qevK4BU97EmzxUBCEolK/n5gp3W6TTJPfpNPNF37MNsl85/vN/DaTmU6PknC4K+pniqeKJ3k8UnkvDxXJzzy+q/yaxxeVHxW/FNHjgRSeKt4rFoplzaAuHHDBGR2eS9G54reirsmienDCTRt7xwsp+KAoEmt9nLaGitZxrBbPFNaGfPloGw2t4JVamSt8xYW6Dg1oCYo3Yv+rCGViV160oMkcd8SYKnYV1Nb1aEOjCe6L5ZOiLfF120EjWhuBu3YIZt1NQmujnk5F4MgOpURzLfAwOBSTmzp3fpDxuI/pabxpqOoz2r2HLAb0GMbZKlNV5/Hg9XJypguryA7lPF5KMdTZQzHjqxNPhWhzIuAruOl1eNqKEx1tSh5rfbxdw7mOxCq4qS68ZTjKS1YVvilu559vWvFHhh4rZrdyZ69Vmpgdj8fJbDZLJpNJ0uv1cnr/gjrUhQMuI+ANjyuwftQ0bbL6Erp0mM/ny8Fg4M3LtdRxgMtKl3jwmIHVxYXChFy94/Rmpa/pTbNUhstKV+4Rr8lLQ9KlUvJKLyG8yvQ2s9SBy1Jb7jV5a0yapfF6apaZLjLLcWtd4sNrmJUMHyM+1xibTjH82Zh01TNlhsrOhdKTe00uAzZQmN6+KW+sDa/JD2PSVQ873m29yf+1Q9VDzfEYlHi1G5LKBBWZbtEsHbFwb1oYDwr1ZiF/2bnCSg1OBE/pfr9/bWx26UxJL3ONPISOLKUvQza0LZUxSKyjpdTGa/vDEr25rddbMM0Q3O6Lx3rqFvU+x6UrRKQY7tyrZecmD9FODy8uLizTmilwNj0kraNcAJhOp5aGVwsAGD5VmJBrWWbJSgWT9zrzWepQF47RaGSiKfeGx6Szi3gzmX/HHbihwBser4B9UJYpFBNX4R6vTn3VQnez0SymnrHQMsRYGTr1dSk34ljRqS/EMd2pLQ8YBp3a1PLfcqCpo8gtHkZFHKkTX6fs3MY0blKnth66rKCnU0VRGu37ONrQaA4eZDFtWAu2fXj9zjFkxTBOo8F7t926gTp/83Kyzzcy2kZD6xiqxTYnHLRFm3vHiRSwNSjkz3hoIzo8lCKWUlg/YtGs7tObunDAZfpDLbfEI15zsEIY3U/x/gHHc/G1zltnAgAAAABJRU5ErkJggg==");
}

.modal-spinner {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translateY(-50%) translateX(-50%);
  padding: 12px 16px;
  border-radius: 5px;
  background-color: #111;
  height: 20px;
}

.modal-spinner > div {
  border-radius: 100px;
  background-color: #fff;
  height: 20px;
  width: 2px;
  margin: 0 1px;
  display: inline-block;
  -webkit-animation: sk-stretchdelay 1.2s infinite ease-in-out;
  animation: sk-stretchdelay 1.2s infinite ease-in-out;
}

.modal-spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}

.modal-spinner .rect3 {
  -webkit-animation-delay: -1s;
  animation-delay: -1s;
}

.modal-spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}

@-webkit-keyframes sk-stretchdelay {
  0%, 40%, 100% {
    -webkit-transform: scaleY(0.5);
  }
  20% {
    -webkit-transform: scaleY(1);
  }
}
@keyframes sk-stretchdelay {
  0%, 40%, 100% {
    transform: scaleY(0.5);
    -webkit-transform: scaleY(0.5);
  }
  20% {
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
  }
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-Black.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-LightItalic.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-LightItalic.woff") format("woff");
  font-weight: 300;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-BoldItalic.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-BoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-BlackItalic.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-BlackItalic.woff") format("woff");
  font-weight: 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-Italic.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-Italic.woff") format("woff");
  font-weight: normal;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-Light.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-Bold.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-Thin.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-Thin.woff") format("woff");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-Regular.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta XBold";
  src: url("../static/fonts/MagaluTextosBeta-XBold.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-XBold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-MediumItalic.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-MediumItalic.woff") format("woff");
  font-weight: 500;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-Medium.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta XBold";
  src: url("../static/fonts/MagaluTextosBeta-XBoldItalic.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-XBoldItalic.woff") format("woff");
  font-weight: bold;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "Magalu Textos Beta";
  src: url("../static/fonts/MagaluTextosBeta-ThinItalic.woff2") format("woff2"), url("../static/fonts/MagaluTextosBeta-ThinItalic.woff") format("woff");
  font-weight: 100;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Heavy.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Heavy.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Black.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Black.woff") format("woff");
  font-weight: 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Bold.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Light.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Light.woff") format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Ultralight.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Ultralight.woff") format("woff");
  font-weight: 200;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Semibold.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Semibold.woff") format("woff");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Thin.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Thin.woff") format("woff");
  font-weight: 100;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "SF UI Display";
  src: url("../static/fonts/SFUIDisplay-Medium.woff2") format("woff2"), url("../static/fonts/SFUIDisplay-Medium.woff") format("woff");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}
/* -------------------
---- COLORS
------------------- */
/* -------------------
---- TABLES 
------------------- */
/* -------------------
---- MEDIA QUERIES
------------------- */
/* -------------------
---- FONTS
------------------- */
/* -------------------
---- MIXINS
------------------- */
/* -------------------
---- PROPERTIES
------------------- */
/* -------------------
---- FONTS MIXINS
------------------- */
/* -------------------
---- FUNCTIONS
------------------- */
.button, .profile__button, .contract__services-more, .contract__services-button, .logged__purchase, .login__button, .login__pin-button, .formbuttoninvert, .component-form .fieldbutton--invert,
.component-form .fieldfile .fieldfile-name--invert, .formbutton, .component-form .fieldbutton--big,
.component-form .fieldfile .fieldfile-name--big, .component-form .fieldbutton,
.component-form .fieldfile .fieldfile-name, .component-form label.photo button,
.component-form .fieldlabel.photo button {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  font-size: 0.16rem;
  font-weight: 800;
  transition: 0.3s;
  position: relative;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: 0.48rem;
  min-width: 3.3rem;
  color: #ba1cf7;
  overflow: hidden;
  text-decoration: none;
  text-align: center;
  white-space: nowrap;
  border: 0;
  border-radius: 0.06rem;
  box-sizing: border-box;
  text-transform: unset;
  cursor: pointer;
}
.button:after, .profile__button:after, .contract__services-more:after, .contract__services-button:after, .logged__purchase:after, .login__button:after, .login__pin-button:after, .formbuttoninvert:after, .component-form .fieldbutton--invert:after,
.component-form .fieldfile .fieldfile-name--invert:after, .formbutton:after, .component-form .fieldbutton--big:after,
.component-form .fieldfile .fieldfile-name--big:after, .component-form .fieldbutton:after,
.component-form .fieldfile .fieldfile-name:after, .component-form label.photo button:after,
.component-form .fieldlabel.photo button:after, .button:before, .profile__button:before, .contract__services-more:before, .contract__services-button:before, .logged__purchase:before, .login__button:before, .login__pin-button:before, .formbuttoninvert:before, .component-form .fieldbutton--invert:before,
.component-form .fieldfile .fieldfile-name--invert:before, .formbutton:before, .component-form .fieldbutton--big:before,
.component-form .fieldfile .fieldfile-name--big:before, .component-form .fieldbutton:before,
.component-form .fieldfile .fieldfile-name:before, .component-form label.photo button:before,
.component-form .fieldlabel.photo button:before {
  content: "";
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1;
  background: #fff;
  border-radius: 0.06rem;
  border: 2px solid #fff;
  box-sizing: border-box;
}
.button:before, .profile__button:before, .contract__services-more:before, .contract__services-button:before, .logged__purchase:before, .login__button:before, .login__pin-button:before, .formbuttoninvert:before, .component-form .fieldbutton--invert:before,
.component-form .fieldfile .fieldfile-name--invert:before, .formbutton:before, .component-form .fieldbutton--big:before,
.component-form .fieldfile .fieldfile-name--big:before, .component-form .fieldbutton:before,
.component-form .fieldfile .fieldfile-name:before, .component-form label.photo button:before,
.component-form .fieldlabel.photo button:before {
  transition: opacity 0.2s 0.1s ease-in-out, top 0.3s ease-in-out;
  opacity: 0;
  top: 150%;
  width: 100%;
  background: #ba1cf7;
  z-index: 2;
  color: #fff;
}
.button span, .profile__button span, .contract__services-more span, .contract__services-button span, .logged__purchase span, .login__button span, .login__pin-button span, .formbuttoninvert span, .component-form .fieldbutton--invert span,
.component-form .fieldfile .fieldfile-name--invert span, .formbutton span, .component-form .fieldbutton--big span,
.component-form .fieldfile .fieldfile-name--big span, .component-form .fieldbutton span,
.component-form .fieldfile .fieldfile-name span, .component-form label.photo button span,
.component-form .fieldlabel.photo button span,
.button strong,
.profile__button strong,
.contract__services-more strong,
.contract__services-button strong,
.logged__purchase strong,
.login__button strong,
.login__pin-button strong,
.formbuttoninvert strong,
.component-form .fieldbutton--invert strong,
.component-form .fieldfile .fieldfile-name--invert strong,
.formbutton strong,
.component-form .fieldbutton--big strong,
.component-form .fieldfile .fieldfile-name--big strong,
.component-form .fieldbutton strong,
.component-form .fieldfile .fieldfile-name strong,
.component-form label.photo button strong,
.component-form .fieldlabel.photo button strong {
  position: relative;
  text-indent: 0;
  z-index: 3;
}
.button span.align-left, .profile__button span.align-left, .contract__services-more span.align-left, .contract__services-button span.align-left, .logged__purchase span.align-left, .login__button span.align-left, .login__pin-button span.align-left, .formbuttoninvert span.align-left, .component-form .fieldbutton--invert span.align-left,
.component-form .fieldfile .fieldfile-name--invert span.align-left, .formbutton span.align-left, .component-form .fieldbutton--big span.align-left,
.component-form .fieldfile .fieldfile-name--big span.align-left, .component-form .fieldbutton span.align-left,
.component-form .fieldfile .fieldfile-name span.align-left, .component-form label.photo button span.align-left,
.component-form .fieldlabel.photo button span.align-left,
.button strong.align-left,
.profile__button strong.align-left,
.contract__services-more strong.align-left,
.contract__services-button strong.align-left,
.logged__purchase strong.align-left,
.login__button strong.align-left,
.login__pin-button strong.align-left,
.formbuttoninvert strong.align-left,
.component-form .fieldbutton--invert strong.align-left,
.component-form .fieldfile .fieldfile-name--invert strong.align-left,
.formbutton strong.align-left,
.component-form .fieldbutton--big strong.align-left,
.component-form .fieldfile .fieldfile-name--big strong.align-left,
.component-form .fieldbutton strong.align-left,
.component-form .fieldfile .fieldfile-name strong.align-left,
.component-form label.photo button strong.align-left,
.component-form .fieldlabel.photo button strong.align-left {
  margin: 0 auto 0 0.28rem;
  text-align: left;
}
.button span.align-left:not(:first-child):last-child, .profile__button span.align-left:not(:first-child):last-child, .contract__services-more span.align-left:not(:first-child):last-child, .contract__services-button span.align-left:not(:first-child):last-child, .logged__purchase span.align-left:not(:first-child):last-child, .login__button span.align-left:not(:first-child):last-child, .login__pin-button span.align-left:not(:first-child):last-child, .formbuttoninvert span.align-left:not(:first-child):last-child, .component-form .fieldbutton--invert span.align-left:not(:first-child):last-child,
.component-form .fieldfile .fieldfile-name--invert span.align-left:not(:first-child):last-child, .formbutton span.align-left:not(:first-child):last-child, .component-form .fieldbutton--big span.align-left:not(:first-child):last-child,
.component-form .fieldfile .fieldfile-name--big span.align-left:not(:first-child):last-child, .component-form .fieldbutton span.align-left:not(:first-child):last-child,
.component-form .fieldfile .fieldfile-name span.align-left:not(:first-child):last-child, .component-form label.photo button span.align-left:not(:first-child):last-child,
.component-form .fieldlabel.photo button span.align-left:not(:first-child):last-child,
.button strong.align-left:not(:first-child):last-child,
.profile__button strong.align-left:not(:first-child):last-child,
.contract__services-more strong.align-left:not(:first-child):last-child,
.contract__services-button strong.align-left:not(:first-child):last-child,
.logged__purchase strong.align-left:not(:first-child):last-child,
.login__button strong.align-left:not(:first-child):last-child,
.login__pin-button strong.align-left:not(:first-child):last-child,
.formbuttoninvert strong.align-left:not(:first-child):last-child,
.component-form .fieldbutton--invert strong.align-left:not(:first-child):last-child,
.component-form .fieldfile .fieldfile-name--invert strong.align-left:not(:first-child):last-child,
.formbutton strong.align-left:not(:first-child):last-child,
.component-form .fieldbutton--big strong.align-left:not(:first-child):last-child,
.component-form .fieldfile .fieldfile-name--big strong.align-left:not(:first-child):last-child,
.component-form .fieldbutton strong.align-left:not(:first-child):last-child,
.component-form .fieldfile .fieldfile-name strong.align-left:not(:first-child):last-child,
.component-form label.photo button strong.align-left:not(:first-child):last-child,
.component-form .fieldlabel.photo button strong.align-left:not(:first-child):last-child {
  margin: 0 auto 0 0.68rem;
}
.button span.align-right, .profile__button span.align-right, .contract__services-more span.align-right, .contract__services-button span.align-right, .logged__purchase span.align-right, .login__button span.align-right, .login__pin-button span.align-right, .formbuttoninvert span.align-right, .component-form .fieldbutton--invert span.align-right,
.component-form .fieldfile .fieldfile-name--invert span.align-right, .formbutton span.align-right, .component-form .fieldbutton--big span.align-right,
.component-form .fieldfile .fieldfile-name--big span.align-right, .component-form .fieldbutton span.align-right,
.component-form .fieldfile .fieldfile-name span.align-right, .component-form label.photo button span.align-right,
.component-form .fieldlabel.photo button span.align-right,
.button strong.align-right,
.profile__button strong.align-right,
.contract__services-more strong.align-right,
.contract__services-button strong.align-right,
.logged__purchase strong.align-right,
.login__button strong.align-right,
.login__pin-button strong.align-right,
.formbuttoninvert strong.align-right,
.component-form .fieldbutton--invert strong.align-right,
.component-form .fieldfile .fieldfile-name--invert strong.align-right,
.formbutton strong.align-right,
.component-form .fieldbutton--big strong.align-right,
.component-form .fieldfile .fieldfile-name--big strong.align-right,
.component-form .fieldbutton strong.align-right,
.component-form .fieldfile .fieldfile-name strong.align-right,
.component-form label.photo button strong.align-right,
.component-form .fieldlabel.photo button strong.align-right {
  margin: 0 0.28rem 0 auto;
  text-align: right;
}
.button span.align-right:not(:last-child):first-child, .profile__button span.align-right:not(:last-child):first-child, .contract__services-more span.align-right:not(:last-child):first-child, .contract__services-button span.align-right:not(:last-child):first-child, .logged__purchase span.align-right:not(:last-child):first-child, .login__button span.align-right:not(:last-child):first-child, .login__pin-button span.align-right:not(:last-child):first-child, .formbuttoninvert span.align-right:not(:last-child):first-child, .component-form .fieldbutton--invert span.align-right:not(:last-child):first-child,
.component-form .fieldfile .fieldfile-name--invert span.align-right:not(:last-child):first-child, .formbutton span.align-right:not(:last-child):first-child, .component-form .fieldbutton--big span.align-right:not(:last-child):first-child,
.component-form .fieldfile .fieldfile-name--big span.align-right:not(:last-child):first-child, .component-form .fieldbutton span.align-right:not(:last-child):first-child,
.component-form .fieldfile .fieldfile-name span.align-right:not(:last-child):first-child, .component-form label.photo button span.align-right:not(:last-child):first-child,
.component-form .fieldlabel.photo button span.align-right:not(:last-child):first-child,
.button strong.align-right:not(:last-child):first-child,
.profile__button strong.align-right:not(:last-child):first-child,
.contract__services-more strong.align-right:not(:last-child):first-child,
.contract__services-button strong.align-right:not(:last-child):first-child,
.logged__purchase strong.align-right:not(:last-child):first-child,
.login__button strong.align-right:not(:last-child):first-child,
.login__pin-button strong.align-right:not(:last-child):first-child,
.formbuttoninvert strong.align-right:not(:last-child):first-child,
.component-form .fieldbutton--invert strong.align-right:not(:last-child):first-child,
.component-form .fieldfile .fieldfile-name--invert strong.align-right:not(:last-child):first-child,
.formbutton strong.align-right:not(:last-child):first-child,
.component-form .fieldbutton--big strong.align-right:not(:last-child):first-child,
.component-form .fieldfile .fieldfile-name--big strong.align-right:not(:last-child):first-child,
.component-form .fieldbutton strong.align-right:not(:last-child):first-child,
.component-form .fieldfile .fieldfile-name strong.align-right:not(:last-child):first-child,
.component-form label.photo button strong.align-right:not(:last-child):first-child,
.component-form .fieldlabel.photo button strong.align-right:not(:last-child):first-child {
  margin: 0 0.68rem 0 auto;
}
.button svg, .profile__button svg, .contract__services-more svg, .contract__services-button svg, .logged__purchase svg, .login__button svg, .login__pin-button svg, .formbuttoninvert svg, .component-form .fieldbutton--invert svg,
.component-form .fieldfile .fieldfile-name--invert svg, .formbutton svg, .component-form .fieldbutton--big svg,
.component-form .fieldfile .fieldfile-name--big svg, .component-form .fieldbutton svg,
.component-form .fieldfile .fieldfile-name svg, .component-form label.photo button svg,
.component-form .fieldlabel.photo button svg,
.button .icon,
.profile__button .icon,
.contract__services-more .icon,
.contract__services-button .icon,
.logged__purchase .icon,
.login__button .icon,
.login__pin-button .icon,
.formbuttoninvert .icon,
.component-form .fieldbutton--invert .icon,
.component-form .fieldfile .fieldfile-name--invert .icon,
.formbutton .icon,
.component-form .fieldbutton--big .icon,
.component-form .fieldfile .fieldfile-name--big .icon,
.component-form .fieldbutton .icon,
.component-form .fieldfile .fieldfile-name .icon,
.component-form label.photo button .icon,
.component-form .fieldlabel.photo button .icon {
  transition: fill 0.4s ease-in-out, stroke 0.4s ease-in-out;
  display: block;
  position: absolute;
  z-index: 4;
  fill: #fff;
  stroke: #fff;
  top: 50%;
  transform: translate(0, -50%);
}
.button svg:first-child, .profile__button svg:first-child, .contract__services-more svg:first-child, .contract__services-button svg:first-child, .logged__purchase svg:first-child, .login__button svg:first-child, .login__pin-button svg:first-child, .formbuttoninvert svg:first-child, .component-form .fieldbutton--invert svg:first-child,
.component-form .fieldfile .fieldfile-name--invert svg:first-child, .formbutton svg:first-child, .component-form .fieldbutton--big svg:first-child,
.component-form .fieldfile .fieldfile-name--big svg:first-child, .component-form .fieldbutton svg:first-child,
.component-form .fieldfile .fieldfile-name svg:first-child, .component-form label.photo button svg:first-child,
.component-form .fieldlabel.photo button svg:first-child,
.button .icon:first-child,
.profile__button .icon:first-child,
.contract__services-more .icon:first-child,
.contract__services-button .icon:first-child,
.logged__purchase .icon:first-child,
.login__button .icon:first-child,
.login__pin-button .icon:first-child,
.formbuttoninvert .icon:first-child,
.component-form .fieldbutton--invert .icon:first-child,
.component-form .fieldfile .fieldfile-name--invert .icon:first-child,
.formbutton .icon:first-child,
.component-form .fieldbutton--big .icon:first-child,
.component-form .fieldfile .fieldfile-name--big .icon:first-child,
.component-form .fieldbutton .icon:first-child,
.component-form .fieldfile .fieldfile-name .icon:first-child,
.component-form label.photo button .icon:first-child,
.component-form .fieldlabel.photo button .icon:first-child {
  left: 0.24rem;
}
.button svg:last-child, .profile__button svg:last-child, .contract__services-more svg:last-child, .contract__services-button svg:last-child, .logged__purchase svg:last-child, .login__button svg:last-child, .login__pin-button svg:last-child, .formbuttoninvert svg:last-child, .component-form .fieldbutton--invert svg:last-child,
.component-form .fieldfile .fieldfile-name--invert svg:last-child, .formbutton svg:last-child, .component-form .fieldbutton--big svg:last-child,
.component-form .fieldfile .fieldfile-name--big svg:last-child, .component-form .fieldbutton svg:last-child,
.component-form .fieldfile .fieldfile-name svg:last-child, .component-form label.photo button svg:last-child,
.component-form .fieldlabel.photo button svg:last-child,
.button .icon:last-child,
.profile__button .icon:last-child,
.contract__services-more .icon:last-child,
.contract__services-button .icon:last-child,
.logged__purchase .icon:last-child,
.login__button .icon:last-child,
.login__pin-button .icon:last-child,
.formbuttoninvert .icon:last-child,
.component-form .fieldbutton--invert .icon:last-child,
.component-form .fieldfile .fieldfile-name--invert .icon:last-child,
.formbutton .icon:last-child,
.component-form .fieldbutton--big .icon:last-child,
.component-form .fieldfile .fieldfile-name--big .icon:last-child,
.component-form .fieldbutton .icon:last-child,
.component-form .fieldfile .fieldfile-name .icon:last-child,
.component-form label.photo button .icon:last-child,
.component-form .fieldlabel.photo button .icon:last-child {
  right: 0.24rem;
}
.button svg + span, .profile__button svg + span, .contract__services-more svg + span, .contract__services-button svg + span, .logged__purchase svg + span, .login__button svg + span, .login__pin-button svg + span, .formbuttoninvert svg + span, .component-form .fieldbutton--invert svg + span,
.component-form .fieldfile .fieldfile-name--invert svg + span, .formbutton svg + span, .component-form .fieldbutton--big svg + span,
.component-form .fieldfile .fieldfile-name--big svg + span, .component-form .fieldbutton svg + span,
.component-form .fieldfile .fieldfile-name svg + span, .component-form label.photo button svg + span,
.component-form .fieldlabel.photo button svg + span,
.button .icon + span,
.profile__button .icon + span,
.contract__services-more .icon + span,
.contract__services-button .icon + span,
.logged__purchase .icon + span,
.login__button .icon + span,
.login__pin-button .icon + span,
.formbuttoninvert .icon + span,
.component-form .fieldbutton--invert .icon + span,
.component-form .fieldfile .fieldfile-name--invert .icon + span,
.formbutton .icon + span,
.component-form .fieldbutton--big .icon + span,
.component-form .fieldfile .fieldfile-name--big .icon + span,
.component-form .fieldbutton .icon + span,
.component-form .fieldfile .fieldfile-name .icon + span,
.component-form label.photo button .icon + span,
.component-form .fieldlabel.photo button .icon + span {
  margin-left: 0.4rem;
}
.button .icon, .profile__button .icon, .contract__services-more .icon, .contract__services-button .icon, .logged__purchase .icon, .login__button .icon, .login__pin-button .icon, .formbuttoninvert .icon, .component-form .fieldbutton--invert .icon,
.component-form .fieldfile .fieldfile-name--invert .icon, .formbutton .icon, .component-form .fieldbutton--big .icon,
.component-form .fieldfile .fieldfile-name--big .icon, .component-form .fieldbutton .icon,
.component-form .fieldfile .fieldfile-name .icon, .component-form label.photo button .icon,
.component-form .fieldlabel.photo button .icon {
  transition: color 0.4s ease-in-out, border-color 0.4s ease-in-out, background-color 0.4s ease-in-out;
}
.button:disabled, .profile__button:disabled, .contract__services-more:disabled, .contract__services-button:disabled, .logged__purchase:disabled, .login__button:disabled, .login__pin-button:disabled, .formbuttoninvert:disabled, .component-form .fieldbutton--invert:disabled,
.component-form .fieldfile .fieldfile-name--invert:disabled, .formbutton:disabled, .component-form .fieldbutton--big:disabled,
.component-form .fieldfile .fieldfile-name--big:disabled, .component-form .fieldbutton:disabled,
.component-form .fieldfile .fieldfile-name:disabled, .component-form label.photo button:disabled,
.component-form .fieldlabel.photo button:disabled {
  opacity: 0.65;
}
.button:not(:disabled):hover, .profile__button:not(:disabled):hover, .contract__services-more:not(:disabled):hover, .contract__services-button:not(:disabled):hover, .logged__purchase:not(:disabled):hover, .login__button:not(:disabled):hover, .login__pin-button:not(:disabled):hover, .formbuttoninvert:not(:disabled):hover, .component-form .fieldbutton--invert:not(:disabled):hover,
.component-form .fieldfile .fieldfile-name--invert:not(:disabled):hover, .formbutton:not(:disabled):hover, .component-form .fieldbutton--big:not(:disabled):hover,
.component-form .fieldfile .fieldfile-name--big:not(:disabled):hover, .component-form .fieldbutton:not(:disabled):hover,
.component-form .fieldfile .fieldfile-name:not(:disabled):hover, .component-form label.photo button:not(:disabled):hover,
.component-form .fieldlabel.photo button:not(:disabled):hover, input[type=radio]:not(:disabled):checked ~ .button, input[type=radio]:not(:disabled):checked ~ .profile__button, input[type=radio]:not(:disabled):checked ~ .contract__services-more, input[type=radio]:not(:disabled):checked ~ .contract__services-button, input[type=radio]:not(:disabled):checked ~ .logged__purchase, input[type=radio]:not(:disabled):checked ~ .login__button, input[type=radio]:not(:disabled):checked ~ .login__pin-button, input[type=radio]:not(:disabled):checked ~ .formbuttoninvert, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--invert,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--invert, input[type=radio]:not(:disabled):checked ~ .formbutton, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--big,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--big, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name, .component-form label.photo input[type=radio]:not(:disabled):checked ~ button,
.component-form .fieldlabel.photo input[type=radio]:not(:disabled):checked ~ button, input[type=checkbox]:not(:disabled):checked ~ .button, input[type=checkbox]:not(:disabled):checked ~ .profile__button, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase, input[type=checkbox]:not(:disabled):checked ~ .login__button, input[type=checkbox]:not(:disabled):checked ~ .login__pin-button, input[type=checkbox]:not(:disabled):checked ~ .formbuttoninvert, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--invert,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--invert, input[type=checkbox]:not(:disabled):checked ~ .formbutton, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--big,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--big, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name, .component-form label.photo input[type=checkbox]:not(:disabled):checked ~ button,
.component-form .fieldlabel.photo input[type=checkbox]:not(:disabled):checked ~ button {
  color: #fff;
}
.button:not(:disabled):hover:before, .profile__button:not(:disabled):hover:before, .contract__services-more:not(:disabled):hover:before, .contract__services-button:not(:disabled):hover:before, .logged__purchase:not(:disabled):hover:before, .login__button:not(:disabled):hover:before, .login__pin-button:not(:disabled):hover:before, .formbuttoninvert:not(:disabled):hover:before, .component-form .fieldbutton--invert:not(:disabled):hover:before,
.component-form .fieldfile .fieldfile-name--invert:not(:disabled):hover:before, .formbutton:not(:disabled):hover:before, .component-form .fieldbutton--big:not(:disabled):hover:before,
.component-form .fieldfile .fieldfile-name--big:not(:disabled):hover:before, .component-form .fieldbutton:not(:disabled):hover:before,
.component-form .fieldfile .fieldfile-name:not(:disabled):hover:before, .component-form label.photo button:not(:disabled):hover:before,
.component-form .fieldlabel.photo button:not(:disabled):hover:before, input[type=radio]:not(:disabled):checked ~ .button:before, input[type=radio]:not(:disabled):checked ~ .profile__button:before, input[type=radio]:not(:disabled):checked ~ .contract__services-more:before, input[type=radio]:not(:disabled):checked ~ .contract__services-button:before, input[type=radio]:not(:disabled):checked ~ .logged__purchase:before, input[type=radio]:not(:disabled):checked ~ .login__button:before, input[type=radio]:not(:disabled):checked ~ .login__pin-button:before, input[type=radio]:not(:disabled):checked ~ .formbuttoninvert:before, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--invert:before,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--invert:before, input[type=radio]:not(:disabled):checked ~ .formbutton:before, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--big:before,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--big:before, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton:before,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name:before, .component-form label.photo input[type=radio]:not(:disabled):checked ~ button:before,
.component-form .fieldlabel.photo input[type=radio]:not(:disabled):checked ~ button:before, input[type=checkbox]:not(:disabled):checked ~ .button:before, input[type=checkbox]:not(:disabled):checked ~ .profile__button:before, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more:before, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button:before, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase:before, input[type=checkbox]:not(:disabled):checked ~ .login__button:before, input[type=checkbox]:not(:disabled):checked ~ .login__pin-button:before, input[type=checkbox]:not(:disabled):checked ~ .formbuttoninvert:before, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--invert:before,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--invert:before, input[type=checkbox]:not(:disabled):checked ~ .formbutton:before, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--big:before,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--big:before, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton:before,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name:before, .component-form label.photo input[type=checkbox]:not(:disabled):checked ~ button:before,
.component-form .fieldlabel.photo input[type=checkbox]:not(:disabled):checked ~ button:before {
  transition: opacity 0.2s ease-in-out, top 0.3s ease-in-out;
  top: 50%;
  opacity: 1;
}
.button:not(:disabled):hover svg, .profile__button:not(:disabled):hover svg, .contract__services-more:not(:disabled):hover svg, .contract__services-button:not(:disabled):hover svg, .logged__purchase:not(:disabled):hover svg, .login__button:not(:disabled):hover svg, .login__pin-button:not(:disabled):hover svg, .formbuttoninvert:not(:disabled):hover svg, .component-form .fieldbutton--invert:not(:disabled):hover svg,
.component-form .fieldfile .fieldfile-name--invert:not(:disabled):hover svg, .formbutton:not(:disabled):hover svg, .component-form .fieldbutton--big:not(:disabled):hover svg,
.component-form .fieldfile .fieldfile-name--big:not(:disabled):hover svg, .component-form .fieldbutton:not(:disabled):hover svg,
.component-form .fieldfile .fieldfile-name:not(:disabled):hover svg, .component-form label.photo button:not(:disabled):hover svg,
.component-form .fieldlabel.photo button:not(:disabled):hover svg, input[type=radio]:not(:disabled):checked ~ .button svg, input[type=radio]:not(:disabled):checked ~ .profile__button svg, input[type=radio]:not(:disabled):checked ~ .contract__services-more svg, input[type=radio]:not(:disabled):checked ~ .contract__services-button svg, input[type=radio]:not(:disabled):checked ~ .logged__purchase svg, input[type=radio]:not(:disabled):checked ~ .login__button svg, input[type=radio]:not(:disabled):checked ~ .login__pin-button svg, input[type=radio]:not(:disabled):checked ~ .formbuttoninvert svg, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--invert svg,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--invert svg, input[type=radio]:not(:disabled):checked ~ .formbutton svg, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--big svg,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--big svg, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton svg,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name svg, .component-form label.photo input[type=radio]:not(:disabled):checked ~ button svg,
.component-form .fieldlabel.photo input[type=radio]:not(:disabled):checked ~ button svg, input[type=checkbox]:not(:disabled):checked ~ .button svg, input[type=checkbox]:not(:disabled):checked ~ .profile__button svg, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more svg, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button svg, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase svg, input[type=checkbox]:not(:disabled):checked ~ .login__button svg, input[type=checkbox]:not(:disabled):checked ~ .login__pin-button svg, input[type=checkbox]:not(:disabled):checked ~ .formbuttoninvert svg, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--invert svg,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--invert svg, input[type=checkbox]:not(:disabled):checked ~ .formbutton svg, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--big svg,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--big svg, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton svg,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name svg, .component-form label.photo input[type=checkbox]:not(:disabled):checked ~ button svg,
.component-form .fieldlabel.photo input[type=checkbox]:not(:disabled):checked ~ button svg {
  fill: #fff;
  stroke: #fff;
}
.button:not(:disabled):hover .icon, .profile__button:not(:disabled):hover .icon, .contract__services-more:not(:disabled):hover .icon, .contract__services-button:not(:disabled):hover .icon, .logged__purchase:not(:disabled):hover .icon, .login__button:not(:disabled):hover .icon, .login__pin-button:not(:disabled):hover .icon, .formbuttoninvert:not(:disabled):hover .icon, .component-form .fieldbutton--invert:not(:disabled):hover .icon,
.component-form .fieldfile .fieldfile-name--invert:not(:disabled):hover .icon, .formbutton:not(:disabled):hover .icon, .component-form .fieldbutton--big:not(:disabled):hover .icon,
.component-form .fieldfile .fieldfile-name--big:not(:disabled):hover .icon, .component-form .fieldbutton:not(:disabled):hover .icon,
.component-form .fieldfile .fieldfile-name:not(:disabled):hover .icon, .component-form label.photo button:not(:disabled):hover .icon,
.component-form .fieldlabel.photo button:not(:disabled):hover .icon, input[type=radio]:not(:disabled):checked ~ .button .icon, input[type=radio]:not(:disabled):checked ~ .profile__button .icon, input[type=radio]:not(:disabled):checked ~ .contract__services-more .icon, input[type=radio]:not(:disabled):checked ~ .contract__services-button .icon, input[type=radio]:not(:disabled):checked ~ .logged__purchase .icon, input[type=radio]:not(:disabled):checked ~ .login__button .icon, input[type=radio]:not(:disabled):checked ~ .login__pin-button .icon, input[type=radio]:not(:disabled):checked ~ .formbuttoninvert .icon, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--invert .icon,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--invert .icon, input[type=radio]:not(:disabled):checked ~ .formbutton .icon, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--big .icon,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--big .icon, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton .icon,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name .icon, .component-form label.photo input[type=radio]:not(:disabled):checked ~ button .icon,
.component-form .fieldlabel.photo input[type=radio]:not(:disabled):checked ~ button .icon, input[type=checkbox]:not(:disabled):checked ~ .button .icon, input[type=checkbox]:not(:disabled):checked ~ .profile__button .icon, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more .icon, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button .icon, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase .icon, input[type=checkbox]:not(:disabled):checked ~ .login__button .icon, input[type=checkbox]:not(:disabled):checked ~ .login__pin-button .icon, input[type=checkbox]:not(:disabled):checked ~ .formbuttoninvert .icon, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--invert .icon,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--invert .icon, input[type=checkbox]:not(:disabled):checked ~ .formbutton .icon, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--big .icon,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--big .icon, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton .icon,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name .icon, .component-form label.photo input[type=checkbox]:not(:disabled):checked ~ button .icon,
.component-form .fieldlabel.photo input[type=checkbox]:not(:disabled):checked ~ button .icon {
  border-color: #fff;
  color: #fff;
}
input[type=radio]:not(:disabled):checked ~ .button .icon::after, input[type=radio]:not(:disabled):checked ~ .profile__button .icon::after, input[type=radio]:not(:disabled):checked ~ .contract__services-more .icon::after, input[type=radio]:not(:disabled):checked ~ .contract__services-button .icon::after, input[type=radio]:not(:disabled):checked ~ .logged__purchase .icon::after, input[type=radio]:not(:disabled):checked ~ .login__button .icon::after, input[type=radio]:not(:disabled):checked ~ .login__pin-button .icon::after, input[type=radio]:not(:disabled):checked ~ .formbuttoninvert .icon::after, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--invert .icon::after,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--invert .icon::after, input[type=radio]:not(:disabled):checked ~ .formbutton .icon::after, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton--big .icon::after,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name--big .icon::after, .component-form input[type=radio]:not(:disabled):checked ~ .fieldbutton .icon::after,
.component-form .fieldfile input[type=radio]:not(:disabled):checked ~ .fieldfile-name .icon::after, .component-form label.photo input[type=radio]:not(:disabled):checked ~ button .icon::after,
.component-form .fieldlabel.photo input[type=radio]:not(:disabled):checked ~ button .icon::after, input[type=checkbox]:not(:disabled):checked ~ .button .icon::after, input[type=checkbox]:not(:disabled):checked ~ .profile__button .icon::after, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more .icon::after, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button .icon::after, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase .icon::after, input[type=checkbox]:not(:disabled):checked ~ .login__button .icon::after, input[type=checkbox]:not(:disabled):checked ~ .login__pin-button .icon::after, input[type=checkbox]:not(:disabled):checked ~ .formbuttoninvert .icon::after, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--invert .icon::after,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--invert .icon::after, input[type=checkbox]:not(:disabled):checked ~ .formbutton .icon::after, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton--big .icon::after,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name--big .icon::after, .component-form input[type=checkbox]:not(:disabled):checked ~ .fieldbutton .icon::after,
.component-form .fieldfile input[type=checkbox]:not(:disabled):checked ~ .fieldfile-name .icon::after, .component-form label.photo input[type=checkbox]:not(:disabled):checked ~ button .icon::after,
.component-form .fieldlabel.photo input[type=checkbox]:not(:disabled):checked ~ button .icon::after {
  opacity: 1;
}
.button--disabled {
  cursor: default;
  outline: none;
  color: #6e6e6e;
}
.button--disabled:after {
  background: #eaeaea;
  border-color: #eaeaea;
}
.button--disabled:before {
  background: #eaeaea;
  border-color: #eaeaea;
}
.button--disabled svg {
  fill: #ee00ff;
  stroke: #ee00ff;
}
.button--disabled:not(:disabled):hover, input[type=radio]:not(:disabled):checked ~ .button--disabled, input[type=checkbox]:not(:disabled):checked ~ .button--disabled {
  color: #6e6e6e;
}
.button--disabled:not(:disabled):hover svg, input[type=radio]:not(:disabled):checked ~ .button--disabled svg, input[type=checkbox]:not(:disabled):checked ~ .button--disabled svg {
  fill: #ee00ff;
  stroke: #ee00ff;
}
.button--disabled:not(:disabled):hover .icon, input[type=radio]:not(:disabled):checked ~ .button--disabled .icon, input[type=checkbox]:not(:disabled):checked ~ .button--disabled .icon {
  border-color: #ee00ff;
  color: #ee00ff;
}
.button--pink, .contract__services-button, .logged__purchase {
  color: #fff;
}
.button--pink:after, .contract__services-button:after, .logged__purchase:after {
  background: #ee00ff;
  border-color: #ee00ff;
}
.button--pink:before, .contract__services-button:before, .logged__purchase:before {
  background: #ba1cf7;
  border-color: #ba1cf7;
}
.button--pink svg, .contract__services-button svg, .logged__purchase svg {
  fill: #000;
  stroke: #000;
}
.button--pink:not(:disabled):hover, .contract__services-button:not(:disabled):hover, .logged__purchase:not(:disabled):hover, input[type=radio]:not(:disabled):checked ~ .button--pink, input[type=radio]:not(:disabled):checked ~ .contract__services-button, input[type=radio]:not(:disabled):checked ~ .logged__purchase, input[type=checkbox]:not(:disabled):checked ~ .button--pink, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase {
  color: #fff;
}
.button--pink:not(:disabled):hover svg, .contract__services-button:not(:disabled):hover svg, .logged__purchase:not(:disabled):hover svg, input[type=radio]:not(:disabled):checked ~ .button--pink svg, input[type=radio]:not(:disabled):checked ~ .contract__services-button svg, input[type=radio]:not(:disabled):checked ~ .logged__purchase svg, input[type=checkbox]:not(:disabled):checked ~ .button--pink svg, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button svg, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase svg {
  fill: #fff;
  stroke: #fff;
}
.button--pink:not(:disabled):hover .icon, .contract__services-button:not(:disabled):hover .icon, .logged__purchase:not(:disabled):hover .icon, input[type=radio]:not(:disabled):checked ~ .button--pink .icon, input[type=radio]:not(:disabled):checked ~ .contract__services-button .icon, input[type=radio]:not(:disabled):checked ~ .logged__purchase .icon, input[type=checkbox]:not(:disabled):checked ~ .button--pink .icon, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button .icon, input[type=checkbox]:not(:disabled):checked ~ .logged__purchase .icon {
  border-color: #fff;
  color: #fff;
}
.button--pink-bordered, .contract__services-more, .contract__services-button--bordered {
  color: #ee00ff;
}
.button--pink-bordered:after, .contract__services-more:after, .contract__services-button--bordered:after {
  background: #fff;
  border-color: #ee00ff;
}
.button--pink-bordered:before, .contract__services-more:before, .contract__services-button--bordered:before {
  background: #ba1cf7;
  border-color: #ba1cf7;
}
.button--pink-bordered svg, .contract__services-more svg, .contract__services-button--bordered svg {
  fill: #000;
  stroke: #000;
}
.button--pink-bordered:not(:disabled):hover, .contract__services-more:not(:disabled):hover, .contract__services-button--bordered:not(:disabled):hover, input[type=radio]:not(:disabled):checked ~ .button--pink-bordered, input[type=radio]:not(:disabled):checked ~ .contract__services-more, input[type=radio]:not(:disabled):checked ~ .contract__services-button--bordered, input[type=checkbox]:not(:disabled):checked ~ .button--pink-bordered, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button--bordered {
  color: #fff;
}
.button--pink-bordered:not(:disabled):hover svg, .contract__services-more:not(:disabled):hover svg, .contract__services-button--bordered:not(:disabled):hover svg, input[type=radio]:not(:disabled):checked ~ .button--pink-bordered svg, input[type=radio]:not(:disabled):checked ~ .contract__services-more svg, input[type=radio]:not(:disabled):checked ~ .contract__services-button--bordered svg, input[type=checkbox]:not(:disabled):checked ~ .button--pink-bordered svg, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more svg, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button--bordered svg {
  fill: #fff;
  stroke: #fff;
}
.button--pink-bordered:not(:disabled):hover .icon, .contract__services-more:not(:disabled):hover .icon, .contract__services-button--bordered:not(:disabled):hover .icon, input[type=radio]:not(:disabled):checked ~ .button--pink-bordered .icon, input[type=radio]:not(:disabled):checked ~ .contract__services-more .icon, input[type=radio]:not(:disabled):checked ~ .contract__services-button--bordered .icon, input[type=checkbox]:not(:disabled):checked ~ .button--pink-bordered .icon, input[type=checkbox]:not(:disabled):checked ~ .contract__services-more .icon, input[type=checkbox]:not(:disabled):checked ~ .contract__services-button--bordered .icon {
  border-color: #fff;
  color: #fff;
}
.button--transparent span, .login__pin-button span {
  color: #fff;
}
.button--transparent:after, .login__pin-button:after {
  background: transparent;
  border-color: #fff;
  top: 50%;
}
.button--transparent:before, .login__pin-button:before {
  background: #ba1cf7;
  border-color: #fff;
  top: 50%;
}
.button--transparent-active span, .login__pin-button.active span {
  color: #ba1cf7;
}
.button--transparent-active:after, .login__pin-button.active:after {
  background: #fff;
  border-color: #fff;
  top: 50%;
  color: #ba1cf7;
}
.button--transparent-active:before, .login__pin-button.active:before {
  background: #fff;
  border-color: #fff;
  top: 50%;
  color: #ba1cf7;
}

.formbutton, .component-form .fieldbutton--big,
.component-form .fieldfile .fieldfile-name--big, .component-form .fieldbutton,
.component-form .fieldfile .fieldfile-name, .component-form label.photo button,
.component-form .fieldlabel.photo button {
  font-size: 0.14rem;
}

.formbuttoninvert, .component-form .fieldbutton--invert,
.component-form .fieldfile .fieldfile-name--invert {
  font-size: 0.14rem;
}

@media (min-width: 1025px) {
  .only-mobile {
    display: none !important;
  }
}
@media (max-width: 1024px) {
  .only-desktop {
    display: none !important;
  }
}
.split, .component-form .formsplit--align-right,
.component-form .formnavigation--align-right, .component-form .formsplit--align-center,
.component-form .formnavigation--align-center, .component-form .formsplit--align-between,
.component-form .formnavigation--align-between {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-around;
  align-items: center;
}
@media (min-width: 721px) {
  .split, .component-form .formsplit--align-right,
.component-form .formnavigation--align-right, .component-form .formsplit--align-center,
.component-form .formnavigation--align-center, .component-form .formsplit--align-between,
.component-form .formnavigation--align-between {
    flex-flow: row nowrap;
    justify-content: space-between;
    align-items: center;
  }
}

.hidden {
  display: none;
}

*:focus-visible {
  outline: none !important;
}

input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

input[type=number] {
  -moz-appearance: textfield;
}

::-webkit-scrollbar {
  width: 10px;
}

::-webkit-scrollbar-track {
  background: #f1f1f1;
}

::-webkit-scrollbar-thumb {
  background: #ee00ff;
  border-radius: 99px;
}

@media (max-width: 1025px) {
  html {
    overflow: scroll;
    overflow-x: hidden;
  }

  ::-webkit-scrollbar {
    width: 0px;
    background: transparent;
  }
}
/* -------------------
---- LAYOUT
------------------- */
html {
  font-size: 24.7524752475vw;
}
@media (min-width: 1025px) {
  html {
    font-size: 5.2083333333vw;
  }
}
@media (min-width: 1920px) {
  html {
    font-size: 100px;
  }
}

body * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

html,
body {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  margin: 0;
  padding: 0;
  width: 100%;
}

button {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  text-transform: uppercase;
  cursor: pointer;
}

body {
  position: relative;
  font-size: 0.24rem;
}

body * {
  box-sizing: border-box;
}

a,
button {
  cursor: pointer;
}

@-webkit-keyframes loadingBar {
  0% {
    left: 0%;
    right: 100%;
  }
  50% {
    left: 0%;
    right: 0%;
  }
  100% {
    left: 100%;
    right: 0%;
  }
}

@keyframes loadingBar {
  0% {
    left: 0%;
    right: 100%;
  }
  50% {
    left: 0%;
    right: 0%;
  }
  100% {
    left: 100%;
    right: 0%;
  }
}
.jquery-modal {
  z-index: 999;
}

#content {
  overflow: hidden;
  margin: auto;
  position: relative;
}
@media (max-width: 850px) and (min-width: 1025px) {
  #content {
    overflow-x: hidden;
  }
}

.blocker {
  transition: height 0.4s ease-in-out, padding 0.4s ease-in-out, opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
  opacity: 0;
  transform: translate(0, 0%);
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 0%;
  z-index: 200;
  padding: 0;
  box-sizing: border-box;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.2);
}
@media (max-width: 1025px) {
  .blocker {
    padding: 15px;
  }
}
.blocker.open-animation {
  opacity: 1;
  height: 100%;
  transform: translate(0, 0%);
}
.blocker.close-animation {
  transition: height 0.4s 0.4s ease-in-out, opacity 0.6s 0.4s ease-in-out, transform 0.6s 0.4s ease-in-out;
  opacity: 0;
  height: 0%;
  transform: translate(0, 0%);
}

.blocker:before {
  content: "";
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.05em;
}

.blocker.behind {
  background-color: transparent;
}

.modal {
  transition: opacity 0.6s 0.4s ease-in-out, transform 0.6s 0.4s ease-in-out;
  transform: translate(0, 100%);
  opacity: 0;
  position: relative;
  z-index: 300;
  box-sizing: border-box;
  max-width: 7.8rem;
  width: 90%;
  background-color: #fff;
  color: #222;
  font-size: 0.14rem;
  padding: 0.45rem 0.35rem;
  border-radius: 0.2rem;
  -o-box-shadow: 0 0 10px #000;
  -ms-box-shadow: 0 0 10px #000;
  box-shadow: 0 0 10px #000;
  text-align: left;
  margin: 3% 0;
  min-height: 0.8rem;
}
@media (max-width: 1025px) {
  .modal {
    width: 100%;
    padding: 0.4rem 0.3rem !important;
    margin: 0;
  }
}
.modal p sub {
  font-size: 0.16rem;
  bottom: -1.05em;
}
@media (max-width: 1025px) {
  .modal p sub {
    font-size: 0.14rem;
  }
}
.open-animation .modal {
  opacity: 1;
  transform: translate(0, 0%);
}
.close-animation .modal {
  transition: opacity 0.6s ease-in-out, transform 0.6s ease-in-out;
  opacity: 0;
  transform: translate(0, 100%);
}
.modal a.close-modal {
  position: absolute;
  top: 0.08rem;
  right: 0.08rem;
  display: block;
  width: 0.26rem;
  height: 0.26rem;
  text-indent: -9999px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url(../static/images/icons/modal-close.svg);
  opacity: 1;
}
@media (min-width: 1025px) {
  .modal a.close-modal {
    top: 0.14rem;
    right: 0.14rem;
  }
}

.modal#modal-video {
  height: 3rem;
}
@media (min-width: 1025px) {
  .modal#modal-video {
    width: 8.6rem !important;
    height: 5.1rem !important;
  }
}
.modal#modal-video .modal-dialog,
.modal#modal-video .modal-content,
.modal#modal-video .modal-body {
  height: 100%;
}
.modal#modal-video iframe {
  width: 100%;
  height: 100%;
}

.modal#modal-blocked,
.modal#modal-no-services {
  padding: 0.55rem 0.3rem 0.2rem 0.3rem;
}
@media (min-width: 1025px) {
  .modal#modal-blocked,
.modal#modal-no-services {
    width: 4.5rem !important;
    height: 3rem;
    padding: 0.4rem 0.2rem !important;
  }
}
.modal#modal-blocked .modal-dialog,
.modal#modal-blocked .modal-content,
.modal#modal-blocked .modal-body,
.modal#modal-no-services .modal-dialog,
.modal#modal-no-services .modal-content,
.modal#modal-no-services .modal-body {
  height: 100%;
}
.modal#modal-blocked .modal-body,
.modal#modal-no-services .modal-body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
.modal#modal-blocked .modal-body a,
.modal#modal-no-services .modal-body a {
  max-width: 2rem;
  margin-top: 0.2rem;
}
.modal#modal-blocked .modal-body a:before, .modal#modal-blocked .modal-body a:after,
.modal#modal-no-services .modal-body a:before,
.modal#modal-no-services .modal-body a:after {
  width: 2rem;
}
@media (min-width: 1025px) {
  .modal#modal-blocked .modal-body a,
.modal#modal-no-services .modal-body a {
    font-weight: bold;
    font-size: 0.18rem;
  }
}
.modal#modal-blocked h6,
.modal#modal-no-services h6 {
  text-align: center;
  font-size: 0.22rem;
  margin: 0 0 0.2rem 0;
  font-weight: 500;
}

/* estrutura de uso 
    - component-form
        ? formtab
        - formheader
        - fieldgroup
            - fieldlabel
                - span (Nome)
                - fieldtext|fieldtextarea|fieldtextaudio|fieldradio|fieldcheckbox|fieldselect
            - fieldlabel ...
        - fieldgroup
            - fieldlabel
                - span (Selecione os campos)
                - fieldlist
                    - fieldlabel
                        - fieldcheckbox|fieldradio
                        - fieldcheckbox-label (Item 1)
                    - fieldlabel ...
        - formerrors|formsuccess
        - formnavigation
            - fieldlink
            - fieldbutton
*/
/*
*
*
ATENCAO
*
*
Pequenos ajustes de posicionamentos devem ser feitos de preferencia em outro arquivo css...
*
*
*
*
*
*
*
*
*/
.component-form {
  position: relative;
  /* reset */
  /* elemento para lista de mensagem de erro geral (tipo retorno backend) */
  /* elemento para mensagem de atencao (*voce precisa aceitar os termos)*/
  /* elemento para definir cabecalho do formulario*/
  /* elemento para agrupar campos lado a lado ou unicos */
  /* elemento para criar listagem de campos tipo radio/checkbox*/
  /* elemento para dividir conteudo e/ou botoes de navegacao*/
  /* padrao para campos */
  /* campos de texto */
  /* campo select */
  /* botao de envio de arquivo*/
  /* botoes do formulario */
  /* Campo checkbox e campo radio */
  /* Campo checkbox ou radio com estilo de botao*/
  /* estilo para botoes tipo ancora */
  /* Estilo para elemento contendo mensagem de texto quando formulario retornar erro (lista de erros) */
  /* Estilo para elemento contendo mensagem de texto quando formulario retornar sucesso */
  /* modificador de estilo para campos com corretos*/
  /* modificador de estilo para campos com erro*/
  /* mensagem de erro individual*/
  /* Abas / Componente Tab dentro do Form*/
  /* Padroes de tamanhos e reset de espacamento...*/
  /* Linha de espaco tipo HR */
}
.component-form fieldset {
  margin: 0;
  padding: 0;
  border: 0;
}
.component-form .formmessage {
  font-size: 0.16rem;
  line-height: 0.35rem;
  color: #fff;
  margin-bottom: 0.32rem;
}
@media (min-width: <desktop) {
  .component-form .formmessage {
    font-size: 0.16rem;
  }
}
.component-form .formmessage--small {
  font-size: 0.144rem;
  line-height: 0.35rem;
}
@media (min-width: <desktop) {
  .component-form .formmessage--small {
    font-size: 0.144rem;
  }
}
.component-form .formmessage em {
  font-weight: bold;
}
.component-form .formwarning {
  font-size: 0.11rem;
  color: #fff;
  margin-top: 0.08rem;
}
@media (min-width: <desktop) {
  .component-form .formwarning {
    font-size: 0.09rem;
  }
}
.component-form .formheader {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  text-align: center;
  margin-bottom: 0.32rem;
}
.component-form .formheader__title {
  font-size: 0.24rem;
  line-height: 1.4em;
  font-weight: 500;
  margin: 0;
}
@media (min-width: <desktop) {
  .component-form .formheader__title {
    font-size: 0.22rem;
  }
}
.component-form .formheader__description {
  font-size: 0.22rem;
  line-height: 0.22rem;
  font-weight: normal;
}
@media (min-width: <desktop) {
  .component-form .formheader__description {
    font-size: 0.22rem;
  }
}
.component-form .fieldgroup {
  display: flex;
  flex-flow: row nowrap;
  align-items: baseline;
  margin: 0 0 0.16rem;
}
.component-form .fieldgroup--no-margin {
  margin-bottom: 0;
}
.component-form .fieldgroup[style*="display: block"] {
  display: flex !important;
}
.component-form .fieldgroup--small > label > span:first-child,
.component-form .fieldgroup--small > .fieldlabel > span:first-child {
  font-size: 0.14rem;
}
.component-form .fieldgroup--small .fieldtext {
  font-size: 0.14rem;
}
@media (min-width: <desktop) {
  .component-form .fieldgroup--small .fieldtext {
    font-size: 0.14rem;
  }
}
.component-form .fieldgroup--small .fieldselect select {
  font-size: 0.14rem;
}
@media (min-width: <desktop) {
  .component-form .fieldgroup--small .fieldselect select {
    font-size: 0.14rem;
  }
}
.component-form .fieldgroup--column {
  flex-direction: column;
}
.component-form .fieldgroup--column .formsuccess,
.component-form .fieldgroup--column .formerrors,
.component-form .fieldgroup--column .fieldspacer,
.component-form .fieldgroup--column .forminfo,
.component-form .fieldgroup--column label,
.component-form .fieldgroup--column .fieldlabel {
  margin-right: 0;
  margin-bottom: 0.16rem;
}
.component-form .fieldgroup--column .formsuccess:last-child,
.component-form .fieldgroup--column .formerrors:last-child,
.component-form .fieldgroup--column .fieldspacer:last-child,
.component-form .fieldgroup--column .forminfo:last-child,
.component-form .fieldgroup--column label:last-child,
.component-form .fieldgroup--column .fieldlabel:last-child {
  margin-bottom: 0;
}
.component-form .fieldgroup--small, .component-form .fieldgroup--slim {
  margin: 0 0 0.08rem;
}
@media (min-width: <desktop) {
  .component-form .fieldgroup:not(.preventclear) {
    display: block !important;
    flex: none;
  }
  .component-form .fieldgroup:not(.preventclear)[style*="display: block"] {
    display: block !important;
  }
}
.component-form .fieldgroup > .fieldgroup {
  flex: 1;
  /* IE10+ specific styles go here */
  margin-bottom: 0;
  align-items: stretch;
}
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  .component-form .fieldgroup > .fieldgroup {
    flex: auto;
  }
}
.component-form .fieldlist {
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  margin-bottom: -0.08rem;
}
.component-form .fieldlist[style*="display: block"] {
  display: flex !important;
}
.component-form .fieldlist input[type=radio],
.component-form .fieldlist input[type=checkbox] {
  margin-right: 0.08rem;
}
.component-form .fieldlist .fieldlabel {
  width: 100%;
  margin-bottom: 0.16rem;
}
.component-form .fieldlist .fieldlabel .fieldtext {
  border-width: 1px;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-radius: 0;
  width: 100%;
  margin-top: 0.04rem;
  padding-top: 0;
  padding-bottom: 0.04rem;
  height: 0.2rem;
  font-size: 0.16rem;
}
@media (min-width: <desktop) {
  .component-form .fieldlist .fieldlabel .fieldtext {
    font-size: 0.16rem;
  }
}
.component-form .fieldlist .fieldlabel--flex {
  display: flex;
}
.component-form .fieldlist .fieldlabel--flex span:first-child {
  margin-right: 0.16rem;
}
@media (min-width: <desktop) {
  .component-form .fieldlist .fieldlabel--flex {
    display: block;
  }
}
.component-form .formsplit,
.component-form .formnavigation {
  display: flex;
  flex-flow: column nowrap;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 0 0.3rem;
}
.component-form .formsplit [style*="display: block"],
.component-form .formnavigation [style*="display: block"] {
  display: flex !important;
}
.component-form .formsplit--no-padding,
.component-form .formnavigation--no-padding {
  padding: 0;
}
.component-form .formsplit--align-between,
.component-form .formnavigation--align-between {
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
  padding: 0;
}
.component-form .formsplit--align-between .fieldbutton,
.component-form .formnavigation--align-between .fieldbutton {
  width: auto;
  min-width: auto;
  padding: 0 0.3rem;
}
@media (min-width: <desktop) {
  .component-form .formsplit--align-between,
.component-form .formnavigation--align-between {
    justify-content: space-between;
  }
}
.component-form .formsplit--align-center,
.component-form .formnavigation--align-center {
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
}
.component-form .formsplit--align-right,
.component-form .formnavigation--align-right {
  justify-content: flex-end;
}
.component-form .formsplit--align-right .fieldbutton,
.component-form .formnavigation--align-right .fieldbutton {
  width: auto;
  align-self: flex-end;
}
.component-form .formsplit .fieldbutton + .fieldlink,
.component-form .formnavigation .fieldbutton + .fieldlink {
  margin-top: 0.3rem;
}
.component-form label,
.component-form .fieldlabel {
  /* modificador para labels vazios, apenas criar espaco*/
  position: relative;
  display: inline-block;
  /* modificador para colocar label ao lado dos campos*/
  /* modificador para criar estilo de upload de foto para perfil*/
  /* modificador para esconder label de select*/
  /* modificador para colocar label acima dos campos, tipo placeholder com animacao*/
  /* modificador de borda apenas em baixo */
}
.component-form label.fill-space,
.component-form .fieldlabel.fill-space {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.component-form label.fluid,
.component-form .fieldlabel.fluid {
  display: block;
  min-width: 100%;
}
.component-form label.optin,
.component-form .fieldlabel.optin {
  display: flex;
  align-items: center;
}
.component-form label.optin span,
.component-form .fieldlabel.optin span {
  padding-left: 0.1rem;
}
@media (min-width: <desktop) {
  .component-form label,
.component-form .fieldlabel {
    width: 100%;
  }
}
.component-form label.aside, .component-form label.aside-break,
.component-form .fieldlabel.aside,
.component-form .fieldlabel.aside-break {
  position: relative;
  display: flex;
  align-items: baseline;
}
@media (min-width: <desktop) {
  .component-form label.aside, .component-form label.aside-break,
.component-form .fieldlabel.aside,
.component-form .fieldlabel.aside-break {
    display: block;
    width: 100%;
  }
}
.component-form label.aside span, .component-form label.aside-break span,
.component-form .fieldlabel.aside span,
.component-form .fieldlabel.aside-break span {
  width: 20%;
  margin-bottom: 0;
}
@media (min-width: <desktop) {
  .component-form label.aside span, .component-form label.aside-break span,
.component-form .fieldlabel.aside span,
.component-form .fieldlabel.aside-break span {
    width: 100%;
  }
}
.component-form label.aside .fieldtext,
.component-form label.aside .fieldtextarea,
.component-form label.aside .fieldtextaudio,
.component-form label.aside .fieldselect, .component-form label.aside-break .fieldtext,
.component-form label.aside-break .fieldtextarea,
.component-form label.aside-break .fieldtextaudio,
.component-form label.aside-break .fieldselect,
.component-form .fieldlabel.aside .fieldtext,
.component-form .fieldlabel.aside .fieldtextarea,
.component-form .fieldlabel.aside .fieldtextaudio,
.component-form .fieldlabel.aside .fieldselect,
.component-form .fieldlabel.aside-break .fieldtext,
.component-form .fieldlabel.aside-break .fieldtextarea,
.component-form .fieldlabel.aside-break .fieldtextaudio,
.component-form .fieldlabel.aside-break .fieldselect {
  width: 80%;
}
@media (min-width: <desktop) {
  .component-form label.aside .fieldtext,
.component-form label.aside .fieldtextarea,
.component-form label.aside .fieldtextaudio,
.component-form label.aside .fieldselect, .component-form label.aside-break .fieldtext,
.component-form label.aside-break .fieldtextarea,
.component-form label.aside-break .fieldtextaudio,
.component-form label.aside-break .fieldselect,
.component-form .fieldlabel.aside .fieldtext,
.component-form .fieldlabel.aside .fieldtextarea,
.component-form .fieldlabel.aside .fieldtextaudio,
.component-form .fieldlabel.aside .fieldselect,
.component-form .fieldlabel.aside-break .fieldtext,
.component-form .fieldlabel.aside-break .fieldtextarea,
.component-form .fieldlabel.aside-break .fieldtextaudio,
.component-form .fieldlabel.aside-break .fieldselect {
    width: 100%;
  }
}
.component-form label.aside .fieldtext span.error,
.component-form label.aside .fieldtextarea span.error,
.component-form label.aside .fieldtextaudio span.error,
.component-form label.aside .fieldselect span.error, .component-form label.aside-break .fieldtext span.error,
.component-form label.aside-break .fieldtextarea span.error,
.component-form label.aside-break .fieldtextaudio span.error,
.component-form label.aside-break .fieldselect span.error,
.component-form .fieldlabel.aside .fieldtext span.error,
.component-form .fieldlabel.aside .fieldtextarea span.error,
.component-form .fieldlabel.aside .fieldtextaudio span.error,
.component-form .fieldlabel.aside .fieldselect span.error,
.component-form .fieldlabel.aside-break .fieldtext span.error,
.component-form .fieldlabel.aside-break .fieldtextarea span.error,
.component-form .fieldlabel.aside-break .fieldtextaudio span.error,
.component-form .fieldlabel.aside-break .fieldselect span.error {
  left: 0;
  bottom: -0.14rem;
}
@media (min-width: <desktop) {
  .component-form label.aside .fieldtext span.error,
.component-form label.aside .fieldtextarea span.error,
.component-form label.aside .fieldtextaudio span.error,
.component-form label.aside .fieldselect span.error, .component-form label.aside-break .fieldtext span.error,
.component-form label.aside-break .fieldtextarea span.error,
.component-form label.aside-break .fieldtextaudio span.error,
.component-form label.aside-break .fieldselect span.error,
.component-form .fieldlabel.aside .fieldtext span.error,
.component-form .fieldlabel.aside .fieldtextarea span.error,
.component-form .fieldlabel.aside .fieldtextaudio span.error,
.component-form .fieldlabel.aside .fieldselect span.error,
.component-form .fieldlabel.aside-break .fieldtext span.error,
.component-form .fieldlabel.aside-break .fieldtextarea span.error,
.component-form .fieldlabel.aside-break .fieldtextaudio span.error,
.component-form .fieldlabel.aside-break .fieldselect span.error {
    right: 0;
    top: 0.05rem;
    left: auto;
    bottom: auto;
  }
}
.component-form label.aside span.error, .component-form label.aside-break span.error,
.component-form .fieldlabel.aside span.error,
.component-form .fieldlabel.aside-break span.error {
  left: 20%;
  font-size: 0.1rem;
  color: #fff;
  text-transform: none;
  width: auto;
  bottom: -0.12rem;
}
@media (min-width: <desktop) {
  .component-form label.aside span.error, .component-form label.aside-break span.error,
.component-form .fieldlabel.aside span.error,
.component-form .fieldlabel.aside-break span.error {
    right: 0;
    top: 0.05rem;
    left: auto;
    bottom: auto;
  }
}
.component-form label.aside.labelradio, .component-form label.aside-break.labelradio,
.component-form .fieldlabel.aside.labelradio,
.component-form .fieldlabel.aside-break.labelradio {
  height: auto;
  align-self: flex-end;
}
.component-form label.aside.labelradio span, .component-form label.aside-break.labelradio span,
.component-form .fieldlabel.aside.labelradio span,
.component-form .fieldlabel.aside-break.labelradio span {
  width: auto;
}
.component-form label.aside.labelradio span.error, .component-form label.aside-break.labelradio span.error,
.component-form .fieldlabel.aside.labelradio span.error,
.component-form .fieldlabel.aside-break.labelradio span.error {
  left: 0;
}
.component-form label.aside-break,
.component-form .fieldlabel.aside-break {
  align-items: center;
}
.component-form label.photo,
.component-form .fieldlabel.photo {
  width: 100%;
  position: relative;
  text-align: center;
  margin: 0 auto 0.32rem;
}
.component-form label.photo.fineupload:hover .cover:before,
.component-form .fieldlabel.photo.fineupload:hover .cover:before {
  content: " ";
}
.component-form label.photo span,
.component-form .fieldlabel.photo span {
  text-align: center;
}
.component-form label.photo img,
.component-form .fieldlabel.photo img {
  z-index: 0;
  display: inline-block;
  cursor: default;
  text-align: center;
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  transform: scale(1.1);
}
.component-form label.photo .cover,
.component-form .fieldlabel.photo .cover {
  display: block;
  border: 1px solid transparent;
  border-radius: 50%;
  height: 1.04rem;
  overflow: hidden;
  position: relative;
  width: 1.04rem;
  margin: 0 auto 0.25rem;
}
.component-form label.photo .cover:before,
.component-form .fieldlabel.photo .cover:before {
  line-height: 1.04rem;
  content: attr(data-value);
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  color: #fff;
  font-size: 0.45rem;
  font-weight: 800;
  background-position: center;
  cursor: pointer;
  display: inline-block;
  height: 100%;
  left: 0;
  opacity: 0.9;
  position: absolute;
  text-align: center;
  vertical-align: middle;
  top: 0;
  width: 100%;
  z-index: 0;
  background: #bfddf1;
  transform: scale(1.1);
}
.component-form label.photo input,
.component-form .fieldlabel.photo input {
  text-align: center;
  display: inline-block;
  position: absolute;
  z-index: 1;
  width: 100%;
  height: 2rem;
  top: 0;
  left: 0;
  opacity: 0;
  cursor: default;
}
.component-form label.photo--clean,
.component-form .fieldlabel.photo--clean {
  margin-bottom: 0;
  overflow: hidden;
}
.component-form label.photo--clean .cover,
.component-form .fieldlabel.photo--clean .cover {
  margin-bottom: 0;
}
.component-form label > span,
.component-form .fieldlabel > span {
  transition: color 0.4s ease-in-out;
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  display: block;
  margin: 0 0 0.08rem;
  color: #fff;
  font-size: 0.16rem;
}
.component-form label > span strong,
.component-form .fieldlabel > span strong {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  color: #fff;
}
.component-form label > span em,
.component-form .fieldlabel > span em {
  display: inline-block;
  font-size: 0.176rem;
  color: #fff;
  margin: 0.3rem 0 0.14rem;
}
.component-form label > span small,
.component-form .fieldlabel > span small {
  font-size: 0.144rem;
}
.component-form label > span i,
.component-form .fieldlabel > span i {
  transition: opacity 0.4s ease-in-out;
  font-style: normal;
  color: #fff;
  opacity: 1;
}
@media (min-width: <desktop) {
  .component-form label > span,
.component-form .fieldlabel > span {
    margin: 0 0 0.08rem;
    font-size: 0.16rem;
  }
  .component-form label > span em,
.component-form .fieldlabel > span em {
    font-size: 0.176rem;
  }
  .component-form label > span small,
.component-form .fieldlabel > span small {
    font-size: 0.144rem;
  }
}
.component-form label em,
.component-form .fieldlabel em {
  color: #fff;
  font-style: normal;
}
.component-form label.hiddenlabel > span,
.component-form label.hiddenlabel > .fieldlabel,
.component-form .fieldlabel.hiddenlabel > span,
.component-form .fieldlabel.hiddenlabel > .fieldlabel {
  display: none;
}
.component-form label.hiddenerror span.error,
.component-form .fieldlabel.hiddenerror span.error {
  display: none !important;
  visibility: hidden;
}
.component-form label.placelabel,
.component-form .fieldlabel.placelabel {
  border-radius: 0.1rem;
}
.component-form label.placelabel > span:first-child,
.component-form .fieldlabel.placelabel > span:first-child {
  transition: top 0.2s ease-in, font-size 0.2s ease-in, color 0.4s ease-in;
  position: absolute;
  top: 0.1792rem;
  left: calc(0.16rem + 1px);
  pointer-events: none;
  z-index: 2;
}
.component-form label.placelabel.fitness > span:first-child,
.component-form .fieldlabel.placelabel.fitness > span:first-child {
  top: 0.0448rem;
  left: calc(0.08rem + 1px);
}
.component-form label.placelabel.ontop > span:first-child,
.component-form .fieldlabel.placelabel.ontop > span:first-child {
  top: 0.1008rem;
  font-size: 0.12rem;
  color: #fff;
}
@media (min-width: <desktop) {
  .component-form label.placelabel.ontop > span:first-child,
.component-form .fieldlabel.placelabel.ontop > span:first-child {
    font-size: 0.12rem;
  }
}
.component-form label.placelabel.ontop > span:first-child i,
.component-form .fieldlabel.placelabel.ontop > span:first-child i {
  color: #fff;
  opacity: 0;
}
.component-form label.placelabel.fitness.ontop > span:first-child,
.component-form .fieldlabel.placelabel.fitness.ontop > span:first-child {
  top: -0.0224rem;
}
.component-form label.placelabel .fieldtext,
.component-form label.placelabel .fieldcheckbox,
.component-form label.placelabel .fieldradio,
.component-form label.placelabel .fieldtextarea,
.component-form label.placelabel .fieldtextaudio,
.component-form .fieldlabel.placelabel .fieldtext,
.component-form .fieldlabel.placelabel .fieldcheckbox,
.component-form .fieldlabel.placelabel .fieldradio,
.component-form .fieldlabel.placelabel .fieldtextarea,
.component-form .fieldlabel.placelabel .fieldtextaudio {
  padding-top: 0.1792rem;
  height: 0.56rem;
}
.component-form label.placelabel.fitness .fieldtext,
.component-form label.placelabel.fitness .fieldcheckbox,
.component-form label.placelabel.fitness .fieldradio,
.component-form label.placelabel.fitness .fieldtextarea,
.component-form label.placelabel.fitness .fieldtextaudio,
.component-form .fieldlabel.placelabel.fitness .fieldtext,
.component-form .fieldlabel.placelabel.fitness .fieldcheckbox,
.component-form .fieldlabel.placelabel.fitness .fieldradio,
.component-form .fieldlabel.placelabel.fitness .fieldtextarea,
.component-form .fieldlabel.placelabel.fitness .fieldtextaudio {
  padding-top: 0.0896rem;
  height: 0.28rem;
}
.component-form label.placelabel .fieldselect,
.component-form .fieldlabel.placelabel .fieldselect {
  height: 0.56rem;
}
.component-form label.placelabel .fieldselect select,
.component-form .fieldlabel.placelabel .fieldselect select {
  height: 0.56rem;
  padding-top: 0.224rem;
}
.component-form label.placelabel.fitness .fieldselect,
.component-form .fieldlabel.placelabel.fitness .fieldselect {
  height: 0.28rem;
}
.component-form label.placelabel.fitness .fieldselect select,
.component-form .fieldlabel.placelabel.fitness .fieldselect select {
  height: 0.28rem;
  padding-top: 0.112rem;
}
.component-form label.placeicon-left .fieldtext,
.component-form label.placeicon-left .fieldcheckbox,
.component-form label.placeicon-left .fieldradio,
.component-form label.placeicon-left .fieldtextarea,
.component-form label.placeicon-left .fieldtextaudio,
.component-form label.placeicon-left .fieldselect,
.component-form label .placeicon-left .fieldtext,
.component-form label .placeicon-left .fieldcheckbox,
.component-form label .placeicon-left .fieldradio,
.component-form label .placeicon-left .fieldtextarea,
.component-form label .placeicon-left .fieldtextaudio,
.component-form label .placeicon-left .fieldselect, .component-form label.placeicon-right .fieldtext,
.component-form label.placeicon-right .fieldcheckbox,
.component-form label.placeicon-right .fieldradio,
.component-form label.placeicon-right .fieldtextarea,
.component-form label.placeicon-right .fieldtextaudio,
.component-form label.placeicon-right .fieldselect,
.component-form label .placeicon-right .fieldtext,
.component-form label .placeicon-right .fieldcheckbox,
.component-form label .placeicon-right .fieldradio,
.component-form label .placeicon-right .fieldtextarea,
.component-form label .placeicon-right .fieldtextaudio,
.component-form label .placeicon-right .fieldselect, .component-form label.placeicon-error .fieldtext,
.component-form label.placeicon-error .fieldcheckbox,
.component-form label.placeicon-error .fieldradio,
.component-form label.placeicon-error .fieldtextarea,
.component-form label.placeicon-error .fieldtextaudio,
.component-form label.placeicon-error .fieldselect,
.component-form label .placeicon-error .fieldtext,
.component-form label .placeicon-error .fieldcheckbox,
.component-form label .placeicon-error .fieldradio,
.component-form label .placeicon-error .fieldtextarea,
.component-form label .placeicon-error .fieldtextaudio,
.component-form label .placeicon-error .fieldselect,
.component-form .fieldlabel.placeicon-left .fieldtext,
.component-form .fieldlabel.placeicon-left .fieldcheckbox,
.component-form .fieldlabel.placeicon-left .fieldradio,
.component-form .fieldlabel.placeicon-left .fieldtextarea,
.component-form .fieldlabel.placeicon-left .fieldtextaudio,
.component-form .fieldlabel.placeicon-left .fieldselect,
.component-form .fieldlabel .placeicon-left .fieldtext,
.component-form .fieldlabel .placeicon-left .fieldcheckbox,
.component-form .fieldlabel .placeicon-left .fieldradio,
.component-form .fieldlabel .placeicon-left .fieldtextarea,
.component-form .fieldlabel .placeicon-left .fieldtextaudio,
.component-form .fieldlabel .placeicon-left .fieldselect,
.component-form .fieldlabel.placeicon-right .fieldtext,
.component-form .fieldlabel.placeicon-right .fieldcheckbox,
.component-form .fieldlabel.placeicon-right .fieldradio,
.component-form .fieldlabel.placeicon-right .fieldtextarea,
.component-form .fieldlabel.placeicon-right .fieldtextaudio,
.component-form .fieldlabel.placeicon-right .fieldselect,
.component-form .fieldlabel .placeicon-right .fieldtext,
.component-form .fieldlabel .placeicon-right .fieldcheckbox,
.component-form .fieldlabel .placeicon-right .fieldradio,
.component-form .fieldlabel .placeicon-right .fieldtextarea,
.component-form .fieldlabel .placeicon-right .fieldtextaudio,
.component-form .fieldlabel .placeicon-right .fieldselect,
.component-form .fieldlabel.placeicon-error .fieldtext,
.component-form .fieldlabel.placeicon-error .fieldcheckbox,
.component-form .fieldlabel.placeicon-error .fieldradio,
.component-form .fieldlabel.placeicon-error .fieldtextarea,
.component-form .fieldlabel.placeicon-error .fieldtextaudio,
.component-form .fieldlabel.placeicon-error .fieldselect,
.component-form .fieldlabel .placeicon-error .fieldtext,
.component-form .fieldlabel .placeicon-error .fieldcheckbox,
.component-form .fieldlabel .placeicon-error .fieldradio,
.component-form .fieldlabel .placeicon-error .fieldtextarea,
.component-form .fieldlabel .placeicon-error .fieldtextaudio,
.component-form .fieldlabel .placeicon-error .fieldselect {
  padding-right: 0.4rem;
}
.component-form label.placeicon-left:after, .component-form label.placeicon-left:before,
.component-form label .placeicon-left:after,
.component-form label .placeicon-left:before, .component-form label.placeicon-right:after, .component-form label.placeicon-right:before,
.component-form label .placeicon-right:after,
.component-form label .placeicon-right:before, .component-form label.placeicon-error:after, .component-form label.placeicon-error:before,
.component-form label .placeicon-error:after,
.component-form label .placeicon-error:before,
.component-form .fieldlabel.placeicon-left:after,
.component-form .fieldlabel.placeicon-left:before,
.component-form .fieldlabel .placeicon-left:after,
.component-form .fieldlabel .placeicon-left:before,
.component-form .fieldlabel.placeicon-right:after,
.component-form .fieldlabel.placeicon-right:before,
.component-form .fieldlabel .placeicon-right:after,
.component-form .fieldlabel .placeicon-right:before,
.component-form .fieldlabel.placeicon-error:after,
.component-form .fieldlabel.placeicon-error:before,
.component-form .fieldlabel .placeicon-error:after,
.component-form .fieldlabel .placeicon-error:before {
  content: "";
  transition: opacity 0.4s ease-in-out;
  display: block;
  position: absolute;
  width: 0.2rem;
  height: 0.2rem;
  top: 50%;
  right: 0.2rem;
  transform: translate(0, -50%);
  background: no-repeat center;
  background-size: contain;
}
.component-form label .placeicon,
.component-form .fieldlabel .placeicon {
  position: relative;
  display: block;
}
.component-form label.underborder .fieldtext,
.component-form label.underborder .fieldcheckbox,
.component-form label.underborder .fieldradio,
.component-form label.underborder .fieldtextarea,
.component-form label.underborder .fieldtextaudio,
.component-form label.underborder .fieldselect,
.component-form .fieldlabel.underborder .fieldtext,
.component-form .fieldlabel.underborder .fieldcheckbox,
.component-form .fieldlabel.underborder .fieldradio,
.component-form .fieldlabel.underborder .fieldtextarea,
.component-form .fieldlabel.underborder .fieldtextaudio,
.component-form .fieldlabel.underborder .fieldselect {
  border-width: 1px;
  border-top: 0;
  border-left: 0;
  border-right: 0;
  border-color: #fff;
  border-radius: 0;
}
.component-form label.underborder .fieldtext:focus,
.component-form label.underborder .fieldcheckbox:focus,
.component-form label.underborder .fieldradio:focus,
.component-form label.underborder .fieldtextarea:focus,
.component-form label.underborder .fieldtextaudio:focus,
.component-form label.underborder .fieldselect:focus,
.component-form .fieldlabel.underborder .fieldtext:focus,
.component-form .fieldlabel.underborder .fieldcheckbox:focus,
.component-form .fieldlabel.underborder .fieldradio:focus,
.component-form .fieldlabel.underborder .fieldtextarea:focus,
.component-form .fieldlabel.underborder .fieldtextaudio:focus,
.component-form .fieldlabel.underborder .fieldselect:focus {
  border-bottom-color: #fff;
}
.component-form.placeicon-left.placelabel .fieldtext,
.component-form.placeicon-left.placelabel .fieldcheckbox,
.component-form.placeicon-left.placelabel .fieldradio,
.component-form.placeicon-left.placelabel .fieldtextarea,
.component-form.placeicon-left.placelabel .fieldtextaudio,
.component-form.placeicon-left.placelabel .fieldselect,
.component-form .placeicon-left.placelabel .fieldtext,
.component-form .placeicon-left.placelabel .fieldcheckbox,
.component-form .placeicon-left.placelabel .fieldradio,
.component-form .placeicon-left.placelabel .fieldtextarea,
.component-form .placeicon-left.placelabel .fieldtextaudio,
.component-form .placeicon-left.placelabel .fieldselect {
  padding-left: 0.6rem;
}
.component-form.placeicon-left.placelabel > span:first-child,
.component-form .placeicon-left.placelabel > span:first-child {
  left: 0.3rem;
}
.component-form.placeicon-left.placelabel:after, .component-form.placeicon-left.placelabel:before,
.component-form .placeicon-left.placelabel:after,
.component-form .placeicon-left.placelabel:before {
  right: auto;
  left: 0.2rem;
}
.component-form.placeicon-left.aside, .component-form.placeicon-left.aside-break,
.component-form .placeicon-left.aside,
.component-form .placeicon-left.aside-break {
  padding-left: 0.6rem;
}
.component-form.placeicon-left.aside:after, .component-form.placeicon-left.aside:before, .component-form.placeicon-left.aside-break:after, .component-form.placeicon-left.aside-break:before,
.component-form .placeicon-left.aside:after,
.component-form .placeicon-left.aside:before,
.component-form .placeicon-left.aside-break:after,
.component-form .placeicon-left.aside-break:before {
  right: auto;
  left: 0.2rem;
}
.component-form.placeicon-error:after,
.component-form .placeicon-error:after {
  opacity: 0;
}
.component-form.placeicon-error.error.placeicon-error:after, .component-form.placeicon-error.error .placeicon-error:after,
.component-form .placeicon-error.error.placeicon-error:after,
.component-form .placeicon-error.error .placeicon-error:after {
  background-image: url(../static/images/icons/icon__error.svg);
  opacity: 1;
}
.component-form.placeicon-error.valid.placeicon:after, .component-form.placeicon-error.valid .placeicon:after,
.component-form .placeicon-error.valid.placeicon:after,
.component-form .placeicon-error.valid .placeicon:after {
  background-image: url(../static/images/icons/icon__valid.svg);
  opacity: 1;
}
.component-form .fieldtext,
.component-form .fieldcheckbox,
.component-form .fieldradio,
.component-form .fieldtextarea,
.component-form .fieldtextaudio,
.component-form .fieldselect {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  font-size: 0.16rem;
  width: 100%;
  height: 0.42rem;
  border: 2px solid #dfe4d5;
  border-radius: 0.08rem;
  background: transparent no-repeat 95% center;
  background-size: auto 0.21rem;
  resize: none;
  color: #fff;
  box-sizing: border-box;
}
@media (min-width: <desktop) {
  .component-form .fieldtext,
.component-form .fieldcheckbox,
.component-form .fieldradio,
.component-form .fieldtextarea,
.component-form .fieldtextaudio,
.component-form .fieldselect {
    font-size: 0.16rem;
  }
}
.component-form .fieldtext[data-rule-money],
.component-form .fieldcheckbox[data-rule-money],
.component-form .fieldradio[data-rule-money],
.component-form .fieldtextarea[data-rule-money],
.component-form .fieldtextaudio[data-rule-money],
.component-form .fieldselect[data-rule-money] {
  text-align: right;
}
.component-form .fieldtext[disabled],
.component-form .fieldcheckbox[disabled],
.component-form .fieldradio[disabled],
.component-form .fieldtextarea[disabled],
.component-form .fieldtextaudio[disabled],
.component-form .fieldselect[disabled] {
  background-color: rgba(0, 0, 0, 0.3);
  border-color: rgba(223, 228, 213, 0.3);
}
.component-form .fitness .fieldtext,
.component-form .fitness .fieldcheckbox,
.component-form .fitness .fieldradio,
.component-form .fitness .fieldtextarea,
.component-form .fitness .fieldtextaudio,
.component-form .fitness .fieldselect {
  border-width: 2px;
  height: 0.21rem;
}
.component-form .fieldtext,
.component-form .fieldtextarea,
.component-form .fieldtextaudio {
  padding: 0rem 0.16rem;
  color: #fff;
}
.component-form .fieldtext.small,
.component-form .fieldtextarea.small,
.component-form .fieldtextaudio.small {
  font-size: 0.14rem;
}
@media (min-width: <desktop) {
  .component-form .fieldtext.small,
.component-form .fieldtextarea.small,
.component-form .fieldtextaudio.small {
    font-size: 0.14rem;
  }
}
.component-form .fitness .fieldtext,
.component-form .fitness .fieldtextarea,
.component-form .fitness .fieldtextaudio {
  height: 0.21rem;
  padding: 0rem 0.08rem;
}
.component-form .fieldtextarea,
.component-form .fieldtextaudio {
  padding: 0.16rem 0.16rem;
  height: auto;
  min-height: 2rem;
}
.component-form .fitness .fieldtextarea,
.component-form .fitness .fieldtextaudio {
  padding: 0.08rem 0.08rem;
  height: auto;
  min-height: 1rem;
}
.component-form .fieldtextaudio {
  position: relative;
  min-height: 0;
  margin-bottom: 0.3rem;
}
.component-form .fieldtextaudio__area {
  border: 0;
  padding: 0;
  margin: 0;
  width: 100%;
  min-width: 100%;
  max-width: 100%;
  outline: none;
  height: auto;
  min-height: 2rem;
  color: #fff;
}
.small .component-form .fieldtextaudio__area {
  font-size: 0.14rem;
}
@media (min-width: <desktop) {
  .small .component-form .fieldtextaudio__area {
    font-size: 0.14rem;
  }
}
.component-form .fieldtextaudio__button {
  position: absolute;
  display: table-cell;
  border-radius: 100vw;
  width: 0.7rem;
  height: 0.7rem;
  overflow: hidden;
  text-align: center;
  vertical-align: middle;
  color: white;
  background-color: #ee00ff;
  bottom: -0.35rem;
  right: -0.35rem;
}
.component-form .fieldtextaudio__button--0, .component-form .fieldtextaudio__button[data-deg="0"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(90deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--0 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="0"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--0 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="0"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--0::before, .component-form .fieldtextaudio__button[data-deg="0"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--1, .component-form .fieldtextaudio__button[data-deg="1"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(93.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--1 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="1"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--1 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="1"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--1::before, .component-form .fieldtextaudio__button[data-deg="1"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--2, .component-form .fieldtextaudio__button[data-deg="2"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(97.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--2 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="2"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--2 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="2"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--2::before, .component-form .fieldtextaudio__button[data-deg="2"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--3, .component-form .fieldtextaudio__button[data-deg="3"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(100.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--3 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="3"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--3 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="3"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--3::before, .component-form .fieldtextaudio__button[data-deg="3"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--4, .component-form .fieldtextaudio__button[data-deg="4"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(104.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--4 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="4"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--4 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="4"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--4::before, .component-form .fieldtextaudio__button[data-deg="4"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--5, .component-form .fieldtextaudio__button[data-deg="5"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(108deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--5 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="5"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--5 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="5"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--5::before, .component-form .fieldtextaudio__button[data-deg="5"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--6, .component-form .fieldtextaudio__button[data-deg="6"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(111.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--6 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="6"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--6 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="6"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--6::before, .component-form .fieldtextaudio__button[data-deg="6"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--7, .component-form .fieldtextaudio__button[data-deg="7"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(115.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--7 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="7"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--7 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="7"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--7::before, .component-form .fieldtextaudio__button[data-deg="7"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--8, .component-form .fieldtextaudio__button[data-deg="8"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(118.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--8 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="8"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--8 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="8"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--8::before, .component-form .fieldtextaudio__button[data-deg="8"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--9, .component-form .fieldtextaudio__button[data-deg="9"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(122.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--9 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="9"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--9 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="9"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--9::before, .component-form .fieldtextaudio__button[data-deg="9"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--10, .component-form .fieldtextaudio__button[data-deg="10"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(126deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--10 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="10"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--10 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="10"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--10::before, .component-form .fieldtextaudio__button[data-deg="10"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--11, .component-form .fieldtextaudio__button[data-deg="11"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(129.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--11 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="11"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--11 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="11"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--11::before, .component-form .fieldtextaudio__button[data-deg="11"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--12, .component-form .fieldtextaudio__button[data-deg="12"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(133.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--12 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="12"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--12 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="12"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--12::before, .component-form .fieldtextaudio__button[data-deg="12"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--13, .component-form .fieldtextaudio__button[data-deg="13"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(136.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--13 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="13"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--13 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="13"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--13::before, .component-form .fieldtextaudio__button[data-deg="13"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--14, .component-form .fieldtextaudio__button[data-deg="14"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(140.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--14 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="14"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--14 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="14"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--14::before, .component-form .fieldtextaudio__button[data-deg="14"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--15, .component-form .fieldtextaudio__button[data-deg="15"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(144deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--15 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="15"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--15 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="15"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--15::before, .component-form .fieldtextaudio__button[data-deg="15"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--16, .component-form .fieldtextaudio__button[data-deg="16"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(147.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--16 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="16"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--16 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="16"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--16::before, .component-form .fieldtextaudio__button[data-deg="16"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--17, .component-form .fieldtextaudio__button[data-deg="17"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(151.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--17 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="17"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--17 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="17"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--17::before, .component-form .fieldtextaudio__button[data-deg="17"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--18, .component-form .fieldtextaudio__button[data-deg="18"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(154.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--18 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="18"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--18 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="18"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--18::before, .component-form .fieldtextaudio__button[data-deg="18"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--19, .component-form .fieldtextaudio__button[data-deg="19"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(158.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--19 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="19"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--19 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="19"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--19::before, .component-form .fieldtextaudio__button[data-deg="19"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--20, .component-form .fieldtextaudio__button[data-deg="20"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(162deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--20 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="20"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--20 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="20"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--20::before, .component-form .fieldtextaudio__button[data-deg="20"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--21, .component-form .fieldtextaudio__button[data-deg="21"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(165.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--21 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="21"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--21 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="21"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--21::before, .component-form .fieldtextaudio__button[data-deg="21"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--22, .component-form .fieldtextaudio__button[data-deg="22"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(169.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--22 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="22"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--22 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="22"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--22::before, .component-form .fieldtextaudio__button[data-deg="22"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--23, .component-form .fieldtextaudio__button[data-deg="23"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(172.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--23 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="23"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--23 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="23"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--23::before, .component-form .fieldtextaudio__button[data-deg="23"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--24, .component-form .fieldtextaudio__button[data-deg="24"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(176.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--24 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="24"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--24 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="24"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--24::before, .component-form .fieldtextaudio__button[data-deg="24"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--25, .component-form .fieldtextaudio__button[data-deg="25"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(180deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--25 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="25"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--25 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="25"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--25::before, .component-form .fieldtextaudio__button[data-deg="25"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--26, .component-form .fieldtextaudio__button[data-deg="26"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(183.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--26 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="26"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--26 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="26"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--26::before, .component-form .fieldtextaudio__button[data-deg="26"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--27, .component-form .fieldtextaudio__button[data-deg="27"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(187.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--27 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="27"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--27 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="27"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--27::before, .component-form .fieldtextaudio__button[data-deg="27"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--28, .component-form .fieldtextaudio__button[data-deg="28"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(190.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--28 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="28"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--28 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="28"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--28::before, .component-form .fieldtextaudio__button[data-deg="28"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--29, .component-form .fieldtextaudio__button[data-deg="29"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(194.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--29 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="29"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--29 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="29"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--29::before, .component-form .fieldtextaudio__button[data-deg="29"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--30, .component-form .fieldtextaudio__button[data-deg="30"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(198deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--30 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="30"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--30 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="30"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--30::before, .component-form .fieldtextaudio__button[data-deg="30"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--31, .component-form .fieldtextaudio__button[data-deg="31"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(201.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--31 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="31"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--31 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="31"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--31::before, .component-form .fieldtextaudio__button[data-deg="31"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--32, .component-form .fieldtextaudio__button[data-deg="32"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(205.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--32 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="32"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--32 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="32"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--32::before, .component-form .fieldtextaudio__button[data-deg="32"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--33, .component-form .fieldtextaudio__button[data-deg="33"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(208.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--33 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="33"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--33 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="33"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--33::before, .component-form .fieldtextaudio__button[data-deg="33"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--34, .component-form .fieldtextaudio__button[data-deg="34"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(212.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--34 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="34"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--34 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="34"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--34::before, .component-form .fieldtextaudio__button[data-deg="34"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--35, .component-form .fieldtextaudio__button[data-deg="35"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(216deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--35 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="35"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--35 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="35"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--35::before, .component-form .fieldtextaudio__button[data-deg="35"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--36, .component-form .fieldtextaudio__button[data-deg="36"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(219.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--36 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="36"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--36 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="36"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--36::before, .component-form .fieldtextaudio__button[data-deg="36"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--37, .component-form .fieldtextaudio__button[data-deg="37"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(223.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--37 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="37"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--37 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="37"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--37::before, .component-form .fieldtextaudio__button[data-deg="37"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--38, .component-form .fieldtextaudio__button[data-deg="38"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(226.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--38 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="38"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--38 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="38"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--38::before, .component-form .fieldtextaudio__button[data-deg="38"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--39, .component-form .fieldtextaudio__button[data-deg="39"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(230.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--39 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="39"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--39 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="39"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--39::before, .component-form .fieldtextaudio__button[data-deg="39"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--40, .component-form .fieldtextaudio__button[data-deg="40"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(234deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--40 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="40"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--40 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="40"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--40::before, .component-form .fieldtextaudio__button[data-deg="40"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--41, .component-form .fieldtextaudio__button[data-deg="41"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(237.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--41 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="41"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--41 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="41"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--41::before, .component-form .fieldtextaudio__button[data-deg="41"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--42, .component-form .fieldtextaudio__button[data-deg="42"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(241.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--42 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="42"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--42 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="42"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--42::before, .component-form .fieldtextaudio__button[data-deg="42"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--43, .component-form .fieldtextaudio__button[data-deg="43"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(244.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--43 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="43"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--43 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="43"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--43::before, .component-form .fieldtextaudio__button[data-deg="43"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--44, .component-form .fieldtextaudio__button[data-deg="44"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(248.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--44 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="44"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--44 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="44"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--44::before, .component-form .fieldtextaudio__button[data-deg="44"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--45, .component-form .fieldtextaudio__button[data-deg="45"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(252deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--45 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="45"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--45 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="45"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--45::before, .component-form .fieldtextaudio__button[data-deg="45"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--46, .component-form .fieldtextaudio__button[data-deg="46"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(255.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--46 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="46"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--46 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="46"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--46::before, .component-form .fieldtextaudio__button[data-deg="46"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--47, .component-form .fieldtextaudio__button[data-deg="47"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(259.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--47 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="47"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--47 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="47"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--47::before, .component-form .fieldtextaudio__button[data-deg="47"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--48, .component-form .fieldtextaudio__button[data-deg="48"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(262.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--48 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="48"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--48 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="48"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--48::before, .component-form .fieldtextaudio__button[data-deg="48"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--49, .component-form .fieldtextaudio__button[data-deg="49"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(266.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--49 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="49"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--49 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="49"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--49::before, .component-form .fieldtextaudio__button[data-deg="49"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--50, .component-form .fieldtextaudio__button[data-deg="50"] {
  background: linear-gradient(to right, #ee00ff 50%, transparent 50%), linear-gradient(270deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--50 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="50"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--50 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="50"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--50::before, .component-form .fieldtextaudio__button[data-deg="50"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--51, .component-form .fieldtextaudio__button[data-deg="51"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(273.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--51 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="51"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--51 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="51"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--51::before, .component-form .fieldtextaudio__button[data-deg="51"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--52, .component-form .fieldtextaudio__button[data-deg="52"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(277.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--52 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="52"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--52 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="52"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--52::before, .component-form .fieldtextaudio__button[data-deg="52"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--53, .component-form .fieldtextaudio__button[data-deg="53"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(280.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--53 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="53"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--53 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="53"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--53::before, .component-form .fieldtextaudio__button[data-deg="53"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--54, .component-form .fieldtextaudio__button[data-deg="54"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(284.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--54 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="54"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--54 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="54"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--54::before, .component-form .fieldtextaudio__button[data-deg="54"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--55, .component-form .fieldtextaudio__button[data-deg="55"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(288deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--55 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="55"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--55 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="55"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--55::before, .component-form .fieldtextaudio__button[data-deg="55"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--56, .component-form .fieldtextaudio__button[data-deg="56"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(291.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--56 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="56"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--56 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="56"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--56::before, .component-form .fieldtextaudio__button[data-deg="56"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--57, .component-form .fieldtextaudio__button[data-deg="57"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(295.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--57 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="57"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--57 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="57"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--57::before, .component-form .fieldtextaudio__button[data-deg="57"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--58, .component-form .fieldtextaudio__button[data-deg="58"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(298.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--58 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="58"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--58 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="58"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--58::before, .component-form .fieldtextaudio__button[data-deg="58"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--59, .component-form .fieldtextaudio__button[data-deg="59"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(302.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--59 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="59"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--59 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="59"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--59::before, .component-form .fieldtextaudio__button[data-deg="59"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--60, .component-form .fieldtextaudio__button[data-deg="60"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(306deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--60 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="60"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--60 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="60"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--60::before, .component-form .fieldtextaudio__button[data-deg="60"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--61, .component-form .fieldtextaudio__button[data-deg="61"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(309.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--61 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="61"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--61 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="61"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--61::before, .component-form .fieldtextaudio__button[data-deg="61"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--62, .component-form .fieldtextaudio__button[data-deg="62"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(313.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--62 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="62"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--62 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="62"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--62::before, .component-form .fieldtextaudio__button[data-deg="62"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--63, .component-form .fieldtextaudio__button[data-deg="63"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(316.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--63 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="63"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--63 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="63"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--63::before, .component-form .fieldtextaudio__button[data-deg="63"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--64, .component-form .fieldtextaudio__button[data-deg="64"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(320.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--64 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="64"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--64 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="64"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--64::before, .component-form .fieldtextaudio__button[data-deg="64"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--65, .component-form .fieldtextaudio__button[data-deg="65"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(324deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--65 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="65"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--65 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="65"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--65::before, .component-form .fieldtextaudio__button[data-deg="65"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--66, .component-form .fieldtextaudio__button[data-deg="66"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(327.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--66 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="66"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--66 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="66"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--66::before, .component-form .fieldtextaudio__button[data-deg="66"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--67, .component-form .fieldtextaudio__button[data-deg="67"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(331.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--67 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="67"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--67 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="67"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--67::before, .component-form .fieldtextaudio__button[data-deg="67"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--68, .component-form .fieldtextaudio__button[data-deg="68"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(334.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--68 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="68"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--68 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="68"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--68::before, .component-form .fieldtextaudio__button[data-deg="68"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--69, .component-form .fieldtextaudio__button[data-deg="69"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(338.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--69 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="69"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--69 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="69"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--69::before, .component-form .fieldtextaudio__button[data-deg="69"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--70, .component-form .fieldtextaudio__button[data-deg="70"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(342deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--70 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="70"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--70 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="70"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--70::before, .component-form .fieldtextaudio__button[data-deg="70"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--71, .component-form .fieldtextaudio__button[data-deg="71"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(345.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--71 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="71"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--71 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="71"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--71::before, .component-form .fieldtextaudio__button[data-deg="71"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--72, .component-form .fieldtextaudio__button[data-deg="72"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(349.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--72 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="72"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--72 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="72"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--72::before, .component-form .fieldtextaudio__button[data-deg="72"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--73, .component-form .fieldtextaudio__button[data-deg="73"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(352.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--73 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="73"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--73 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="73"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--73::before, .component-form .fieldtextaudio__button[data-deg="73"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--74, .component-form .fieldtextaudio__button[data-deg="74"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(356.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--74 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="74"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--74 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="74"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--74::before, .component-form .fieldtextaudio__button[data-deg="74"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--75, .component-form .fieldtextaudio__button[data-deg="75"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(360deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--75 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="75"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--75 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="75"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--75::before, .component-form .fieldtextaudio__button[data-deg="75"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--76, .component-form .fieldtextaudio__button[data-deg="76"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(363.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--76 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="76"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--76 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="76"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--76::before, .component-form .fieldtextaudio__button[data-deg="76"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--77, .component-form .fieldtextaudio__button[data-deg="77"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(367.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--77 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="77"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--77 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="77"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--77::before, .component-form .fieldtextaudio__button[data-deg="77"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--78, .component-form .fieldtextaudio__button[data-deg="78"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(370.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--78 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="78"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--78 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="78"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--78::before, .component-form .fieldtextaudio__button[data-deg="78"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--79, .component-form .fieldtextaudio__button[data-deg="79"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(374.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--79 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="79"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--79 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="79"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--79::before, .component-form .fieldtextaudio__button[data-deg="79"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--80, .component-form .fieldtextaudio__button[data-deg="80"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(378deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--80 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="80"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--80 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="80"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--80::before, .component-form .fieldtextaudio__button[data-deg="80"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--81, .component-form .fieldtextaudio__button[data-deg="81"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(381.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--81 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="81"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--81 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="81"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--81::before, .component-form .fieldtextaudio__button[data-deg="81"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--82, .component-form .fieldtextaudio__button[data-deg="82"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(385.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--82 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="82"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--82 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="82"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--82::before, .component-form .fieldtextaudio__button[data-deg="82"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--83, .component-form .fieldtextaudio__button[data-deg="83"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(388.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--83 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="83"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--83 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="83"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--83::before, .component-form .fieldtextaudio__button[data-deg="83"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--84, .component-form .fieldtextaudio__button[data-deg="84"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(392.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--84 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="84"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--84 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="84"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--84::before, .component-form .fieldtextaudio__button[data-deg="84"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--85, .component-form .fieldtextaudio__button[data-deg="85"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(396deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--85 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="85"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--85 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="85"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--85::before, .component-form .fieldtextaudio__button[data-deg="85"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--86, .component-form .fieldtextaudio__button[data-deg="86"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(399.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--86 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="86"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--86 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="86"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--86::before, .component-form .fieldtextaudio__button[data-deg="86"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--87, .component-form .fieldtextaudio__button[data-deg="87"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(403.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--87 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="87"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--87 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="87"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--87::before, .component-form .fieldtextaudio__button[data-deg="87"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--88, .component-form .fieldtextaudio__button[data-deg="88"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(406.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--88 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="88"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--88 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="88"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--88::before, .component-form .fieldtextaudio__button[data-deg="88"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--89, .component-form .fieldtextaudio__button[data-deg="89"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(410.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--89 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="89"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--89 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="89"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--89::before, .component-form .fieldtextaudio__button[data-deg="89"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--90, .component-form .fieldtextaudio__button[data-deg="90"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(414deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--90 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="90"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--90 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="90"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--90::before, .component-form .fieldtextaudio__button[data-deg="90"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--91, .component-form .fieldtextaudio__button[data-deg="91"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(417.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--91 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="91"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--91 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="91"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--91::before, .component-form .fieldtextaudio__button[data-deg="91"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--92, .component-form .fieldtextaudio__button[data-deg="92"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(421.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--92 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="92"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--92 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="92"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--92::before, .component-form .fieldtextaudio__button[data-deg="92"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--93, .component-form .fieldtextaudio__button[data-deg="93"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(424.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--93 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="93"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--93 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="93"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--93::before, .component-form .fieldtextaudio__button[data-deg="93"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--94, .component-form .fieldtextaudio__button[data-deg="94"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(428.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--94 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="94"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--94 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="94"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--94::before, .component-form .fieldtextaudio__button[data-deg="94"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--95, .component-form .fieldtextaudio__button[data-deg="95"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(432deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--95 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="95"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--95 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="95"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--95::before, .component-form .fieldtextaudio__button[data-deg="95"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--96, .component-form .fieldtextaudio__button[data-deg="96"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(435.6deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--96 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="96"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--96 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="96"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--96::before, .component-form .fieldtextaudio__button[data-deg="96"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--97, .component-form .fieldtextaudio__button[data-deg="97"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(439.2deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--97 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="97"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--97 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="97"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--97::before, .component-form .fieldtextaudio__button[data-deg="97"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--98, .component-form .fieldtextaudio__button[data-deg="98"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(442.8deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--98 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="98"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--98 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="98"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--98::before, .component-form .fieldtextaudio__button[data-deg="98"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--99, .component-form .fieldtextaudio__button[data-deg="99"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(446.4deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--99 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="99"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--99 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="99"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--99::before, .component-form .fieldtextaudio__button[data-deg="99"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button--100, .component-form .fieldtextaudio__button[data-deg="100"] {
  background: linear-gradient(to left, #333 50%, transparent 50%), linear-gradient(450deg, #333 50%, #ee00ff 50%);
}
.component-form .fieldtextaudio__button--100 .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button[data-deg="100"] .fieldtextaudio__button-trigger {
  opacity: 0;
}
.component-form .fieldtextaudio__button--100 .fieldtextaudio__button-counter, .component-form .fieldtextaudio__button[data-deg="100"] .fieldtextaudio__button-counter {
  opacity: 1;
}
.component-form .fieldtextaudio__button--100::before, .component-form .fieldtextaudio__button[data-deg="100"]::before {
  transform: scale(0.8);
}
.component-form .fieldtextaudio__button::before {
  transition: transform 0.6s 0.4s ease-in-out;
  content: "";
  align-items: center;
  background-color: #ee00ff;
  border-radius: 50%;
  display: inline-flex;
  height: 100%;
  justify-content: center;
  left: 0;
  position: absolute;
  top: 0;
  transform: scale(1);
  width: 100%;
  z-index: 1;
}
.component-form .fieldtextaudio__button-trigger, .component-form .fieldtextaudio__button-counter {
  transition: opacity 0.4s ease-in-out;
  position: absolute;
  z-index: 3;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
}
.component-form .fieldtextaudio__button-trigger {
  width: 80%;
  height: 80%;
  opacity: 1;
}
.component-form .fieldtextaudio span.error {
  left: 0;
  top: 102%;
}
.component-form .fieldtext:-moz-read-only, .component-form .fieldtextarea:-moz-read-only {
  background-color: #dfe4d5;
  border-color: #dfe4d5;
}
.component-form .fieldtext:disabled,
.component-form .fieldtext:read-only,
.component-form .fieldtextarea:disabled,
.component-form .fieldtextarea:read-only {
  background-color: #dfe4d5;
  border-color: #dfe4d5;
}
.component-form .fieldselect {
  position: relative;
}
.component-form .fieldselect:after {
  display: block;
  content: "";
  position: absolute;
  top: 1px;
  bottom: 1px;
  right: 1px;
  width: 0.48rem;
  transition: background-color 0.4s ease-in-out, color 0.4s ease-in-out;
  background: #fff url(../static/images/icons/icon__select.svg) no-repeat center;
  background-size: 0.1rem auto;
  border-radius: 0.08rem;
  pointer-events: none;
}
.component-form .fieldselect--small:after {
  width: 0.28rem;
}
.component-form .fieldselect--multiselect {
  height: inherit;
}
.component-form .fieldselect--alignselfend {
  align-self: flex-end;
}
@media (min-width: >=desktop) {
  .component-form .fieldselect--max {
    max-width: 50%;
  }
}
.component-form .fieldselect:focus:after {
  background-image: url(../static/images/icons/icon__select.svg);
}
.component-form .fieldselect select {
  background: transparent;
  border: none;
  height: 0.4rem;
  padding: 0.05rem 0.16rem;
  /* If you add too much padding here, the options won't show in IE */
  width: 100%;
  color: #fff;
}
@media (min-width: <desktop) {
  .component-form .fieldselect select[data-customselect] {
    height: auto;
  }
}
@media (min-width: <desktop) {
  .component-form .fieldselect .select2-container {
    width: 100%;
  }
}
.component-form .fieldselect.small select {
  font-size: 0.14rem;
}
@media (min-width: <desktop) {
  .component-form .fieldselect.small select {
    font-size: 0.14rem;
  }
}
.component-form .fieldselect__custom {
  align-items: center;
  background: #fff no-repeat 95% center;
  background-size: auto 0.21rem;
  color: #fff;
  cursor: pointer;
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-start;
  margin: 0 !important;
  min-width: 100%;
  padding: 0.05rem 0.16rem;
  width: 100%;
}
@media (min-width: <desktop) {
  .component-form .fieldselect__custom {
    padding: 0 0.2rem;
  }
}
.component-form .fieldselect__custom > * {
  pointer-events: none;
}
.component-form .fieldselect__custom.disabled {
  opacity: 0.5;
}
.component-form .fieldselect__custom:not(.checked) .fieldselect__custom__image {
  background: #fff;
}
.component-form .fieldselect__custom:not(.checked .disabled):hover {
  background: #000;
}
.component-form .fieldselect__custom__input {
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
}
.component-form .fieldselect__custom__image {
  background: #ee00ff;
  box-shadow: 0 0 0.05rem rgba(238, 0, 255, 0.5);
  display: block;
  margin-right: 0.08rem;
  padding: 0.03rem;
  width: 0.5rem !important;
}
.component-form .fieldselect__custom__price {
  font-weight: bold;
  margin-left: auto;
  width: auto !important;
}
.component-form .fieldselect__custom__price.left {
  margin-left: 0;
}
.component-form .fitness .fieldselect select, .component-form .fitness .fieldselect__custom {
  padding: 0.025rem 0.08rem;
}
.component-form .fieldfile {
  position: relative;
}
.component-form .fieldfile input {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1;
  opacity: 0;
}
.component-form .fieldfile .fieldfile-name {
  position: relative;
  z-index: 2;
  display: block;
  line-height: 0.42rem;
}
.component-form .fieldfile .fieldfile-name:before {
  content: "";
  display: inline-block;
  margin: -0.06rem 0.08rem 0 0;
  width: 0.27rem;
  height: 0.22rem;
  background: url(../static/static/images/icons/ico__file.png) no-repeat center;
  background-size: contain;
  vertical-align: middle;
}
.component-form .fieldfile .fieldfile-name:hover:before, .component-form .fieldfile .fieldfile-name.active:before {
  background-image: url(../static/static/images/icons/ico__file--active.png);
}
.component-form .fieldfile span.error {
  top: 100%;
}
.component-form .fieldbutton,
.component-form .fieldfile .fieldfile-name {
  cursor: pointer;
  width: 100%;
}
.component-form .fieldbutton:disabled, .component-form .fieldbutton.disable,
.component-form .fieldfile .fieldfile-name:disabled,
.component-form .fieldfile .fieldfile-name.disable {
  opacity: 0.5;
  cursor: default;
}
.component-form .fieldbutton.onright,
.component-form .fieldfile .fieldfile-name.onright {
  margin-right: 0;
}
.component-form .fieldcheckbox,
.component-form .fieldradio {
  background: transparent;
  border: 1px solid transparent;
  box-sizing: border-box;
  height: 0.14rem;
  position: relative;
  width: 0.14rem;
  border-radius: 0.04rem;
  margin-right: 0.08rem;
  vertical-align: top;
}
.component-form .fieldcheckbox:after, .component-form .fieldcheckbox:before,
.component-form .fieldradio:after,
.component-form .fieldradio:before {
  background: #fff center;
  background-size: 0.096rem;
  background-repeat: no-repeat;
  border: 1px solid #fff;
  border-radius: 0.04rem;
  box-sizing: border-box;
  content: "";
  height: calc(100% + 2px);
  left: -1px;
  position: absolute;
  top: -1px;
  width: calc(100% + 2px);
}
.component-form .fieldcheckbox:after,
.component-form .fieldradio:after {
  z-index: 1;
}
.component-form .fieldcheckbox:before,
.component-form .fieldradio:before {
  background: #4dac27 center;
  background-size: 0.096rem;
  background-repeat: no-repeat;
  border: 1px solid #fff;
  border-radius: 0.04rem;
  opacity: 0;
  transition: all 0.4s linear;
  z-index: 2;
}
.component-form .fieldcheckbox:checked:before,
.component-form .fieldradio:checked:before {
  opacity: 1;
}
.component-form .fieldcheckbox[readonly]:before,
.component-form .fieldradio[readonly]:before {
  opacity: 1;
}
.component-form .fieldcheckbox:focus:after,
.component-form .fieldradio:focus:after {
  border-color: #000;
}
.component-form .fieldcheckbox.error:after, .component-form .fieldcheckbox.error:before,
.component-form .fieldradio.error:after,
.component-form .fieldradio.error:before {
  border-color: #fff;
  background-color: #fff;
}
.component-form .error[data-field-holder] .fieldcheckbox:after, .component-form .error[data-field-holder] .fieldcheckbox:before,
.component-form .error[data-field-holder] .fieldradio:after,
.component-form .error[data-field-holder] .fieldradio:before {
  border-color: #fff;
  background-color: #fff;
}
.component-form .fieldcheckbox:after {
  background-image: none;
}
.component-form .fieldcheckbox:before {
  background-image: none;
}
.component-form .fieldradio:after {
  background-image: none;
}
.component-form .fieldradio:before {
  background-image: none;
}
.component-form label > span.fieldcheckbox-label,
.component-form label > span.fieldradio-label,
.component-form label > label.fieldcheckbox-label,
.component-form label > label.fieldradio-label,
.component-form .fieldlabel > span.fieldcheckbox-label,
.component-form .fieldlabel > span.fieldradio-label,
.component-form .fieldlabel > label.fieldcheckbox-label,
.component-form .fieldlabel > label.fieldradio-label {
  width: auto;
  display: inline-block;
  vertical-align: middle;
  margin-bottom: 0;
  max-width: calc(100% - 0.31rem);
  font-size: 0.16rem;
  color: #fff;
}
@media (min-width: <desktop) {
  .component-form label > span.fieldcheckbox-label,
.component-form label > span.fieldradio-label,
.component-form label > label.fieldcheckbox-label,
.component-form label > label.fieldradio-label,
.component-form .fieldlabel > span.fieldcheckbox-label,
.component-form .fieldlabel > span.fieldradio-label,
.component-form .fieldlabel > label.fieldcheckbox-label,
.component-form .fieldlabel > label.fieldradio-label {
    vertical-align: middle;
    font-size: 0.16rem;
  }
}
.component-form label > span.fieldcheckbox-label a,
.component-form label > span.fieldradio-label a,
.component-form label > label.fieldcheckbox-label a,
.component-form label > label.fieldradio-label a,
.component-form .fieldlabel > span.fieldcheckbox-label a,
.component-form .fieldlabel > span.fieldradio-label a,
.component-form .fieldlabel > label.fieldcheckbox-label a,
.component-form .fieldlabel > label.fieldradio-label a {
  color: #fff;
}
.component-form label > .fieldradio-label,
.component-form .fieldlabel > .fieldradio-label {
  margin-right: 0.08rem;
}
.component-form .fieldradio-button span.error,
.component-form .fieldcheckbox-button span.error {
  bottom: calc(100% + 0.05rem);
  top: auto;
}
.component-form .fieldradio-button input[type=radio],
.component-form .fieldradio-button input[type=checkbox],
.component-form .fieldcheckbox-button input[type=radio],
.component-form .fieldcheckbox-button input[type=checkbox] {
  cursor: pointer;
  height: 100%;
  left: 0;
  opacity: 0;
  position: absolute;
  top: 0;
  width: 100%;
}
.component-form .fieldradio-button input[type=radio]:checked ~ span,
.component-form .fieldradio-button input[type=checkbox]:checked ~ span,
.component-form .fieldcheckbox-button input[type=radio]:checked ~ span,
.component-form .fieldcheckbox-button input[type=checkbox]:checked ~ span {
  background: rgba(238, 0, 255, 0.3);
}
.component-form .fieldlink {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  color: #fff;
  font-weight: 400;
  text-decoration: none;
  text-transform: normal;
  margin: 0.07rem 0;
  font-size: 0.16rem;
}
@media (min-width: <desktop) {
  .component-form .fieldlink {
    font-size: 0.16rem;
  }
}
.component-form .formerrors {
  color: #fff;
  font-size: 0.16rem;
  margin-bottom: 0;
  max-width: 3rem;
}
@media (min-width: <desktop) {
  .component-form .formerrors {
    font-size: 0.16rem;
  }
}
.component-form .formerrors:not(:empty) {
  margin-bottom: 0.08rem;
}
@media (min-width: <desktop) {
  .component-form .formerrors:not(:empty) {
    margin-bottom: 0.16rem;
  }
}
.component-form .formsuccess {
  color: #4dac27;
  font-size: 0.16rem;
}
@media (min-width: <desktop) {
  .component-form .formsuccess {
    font-size: 0.16rem;
  }
}
.component-form .formsuccess:not(:empty) {
  margin-bottom: 0.08rem;
}
@media (min-width: <desktop) {
  .component-form .formsuccess:not(:empty) {
    margin-bottom: 0.16rem;
  }
}
.component-form .valid .fieldtext,
.component-form .valid .fieldtextarea,
.component-form .valid .fieldtextaudio,
.component-form .valid .fieldselect {
  border-color: #4dac27 !important;
}
.component-form .valid .fieldradio-button {
  outline: 1px solid #4dac27;
}
.component-form .error .fieldtext,
.component-form .error .fieldtextarea,
.component-form .error .fieldtextaudio,
.component-form .error .fieldselect {
  border-color: #fff !important;
}
.component-form .error .fieldradio-button {
  outline: 1px solid #fff;
}
.component-form .error.error-on-right {
  position: relative;
}
.component-form .error.error-on-right span.error {
  right: 0;
}
.component-form span.error {
  position: absolute;
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  color: #fff;
  white-space: nowrap;
  font-size: 0.11rem;
}
.relative-error .component-form span.error {
  position: relative;
  white-space: pre-wrap;
}
@media (min-width: <desktop) {
  .component-form span.error {
    margin-bottom: 0.09rem;
    max-width: 100%;
    text-overflow: ellipsis;
    overflow: hidden;
    line-height: 0.1rem;
    margin-top: 0.02rem;
  }
}
.component-form .formtab,
.component-form .fieldwrapper {
  display: none;
}
.component-form .formtab.active,
.component-form .fieldwrapper.active {
  display: block;
}
.component-form .formtab__header,
.component-form .fieldwrapper__header {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  margin-bottom: 0.32rem;
  border-bottom: 2px solid #9b9c9e;
}
.component-form .formtab__header-title,
.component-form .fieldwrapper__header-title {
  font-size: 0.24rem;
  line-height: 1.4em;
  font-weight: 400;
  margin: 0;
  color: #fff;
}
@media (min-width: <desktop) {
  .component-form .formtab__header-title,
.component-form .fieldwrapper__header-title {
    font-size: 0.16rem;
  }
}
.component-form .formtab__header-description,
.component-form .fieldwrapper__header-description {
  font-size: 0.16rem;
  line-height: 0.22rem;
  font-weight: normal;
}
@media (min-width: <desktop) {
  .component-form .formtab__header-description,
.component-form .fieldwrapper__header-description {
    font-size: 0.16rem;
  }
}
.component-form .formtab__steps {
  display: block;
  width: 100%;
  height: 0.03rem;
  margin-top: -0.15rem;
  margin-bottom: 0.3rem;
}
.component-form .formtab__steps-wrapper {
  position: absolute;
  left: 0;
  width: 100%;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
  padding: 0 0.6rem;
  box-sizing: border-box;
}
.component-form .formtab__steps-step {
  margin: 0 0.08rem;
  flex: 1;
  height: 1px;
  border-radius: 2px;
  background: #fff;
  opacity: 0.3;
}
.component-form .formtab__steps[data-step="1"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="2"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="3"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="4"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="5"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="6"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="7"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(1), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(1) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="2"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="3"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="4"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="5"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="6"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="7"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(2), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(2) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="3"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="4"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="5"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="6"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="7"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(3), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(3) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="4"] .formtab__steps-step:nth-child(4), .component-form .formtab__steps[data-step="5"] .formtab__steps-step:nth-child(4), .component-form .formtab__steps[data-step="6"] .formtab__steps-step:nth-child(4), .component-form .formtab__steps[data-step="7"] .formtab__steps-step:nth-child(4), .component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(4), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(4), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(4), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(4) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="5"] .formtab__steps-step:nth-child(5), .component-form .formtab__steps[data-step="6"] .formtab__steps-step:nth-child(5), .component-form .formtab__steps[data-step="7"] .formtab__steps-step:nth-child(5), .component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(5), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(5), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(5), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(5) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="6"] .formtab__steps-step:nth-child(6), .component-form .formtab__steps[data-step="7"] .formtab__steps-step:nth-child(6), .component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(6), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(6), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(6), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(6) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="7"] .formtab__steps-step:nth-child(7), .component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(7), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(7), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(7), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(7) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="8"] .formtab__steps-step:nth-child(8), .component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(8), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(8), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(8) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="9"] .formtab__steps-step:nth-child(9), .component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(9), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(9) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="10"] .formtab__steps-step:nth-child(10), .component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(10) {
  opacity: 1;
}
.component-form .formtab__steps[data-step="11"] .formtab__steps-step:nth-child(11) {
  opacity: 1;
}
.component-form .fieldwrapper {
  display: block;
  max-width: 10.9rem;
  padding-left: 2.8rem;
}
.component-form .fieldwrapper .formerrors {
  text-align: right;
  align-self: center;
  margin-bottom: 0;
}
.component-form .formsuccess,
.component-form .formerrors,
.component-form .fieldspacer,
.component-form .forminfo,
.component-form .fieldgroup > .fieldgroup,
.component-form label,
.component-form .fieldlabel {
  margin: 0 0.14rem 0 0;
}
.component-form .formsuccess:last-child,
.component-form .formerrors:last-child,
.component-form .fieldspacer:last-child,
.component-form .forminfo:last-child,
.component-form .fieldgroup > .fieldgroup:last-child,
.component-form label:last-child,
.component-form .fieldlabel:last-child {
  margin-right: 0;
}
@media (min-width: <desktop) {
  .component-form .fieldgroup > .fieldgroup {
    margin-right: 0;
    margin-bottom: 0.16rem;
  }
  .component-form .fieldgroup > .fieldgroup:last-child {
    margin-bottom: 0;
  }
}
.component-form .formsuccess,
.component-form .formerrors,
.component-form .fieldspacer,
.component-form .forminfo,
.component-form label,
.component-form .fieldlabel {
  flex: 20;
  /* IE10+ specific styles go here */
}
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
  .component-form .formsuccess,
.component-form .formerrors,
.component-form .fieldspacer,
.component-form .forminfo,
.component-form label,
.component-form .fieldlabel {
    flex: 20 1 0.32rem;
  }
}
.component-form *[data-flex="0.1"] {
  flex: 0.1;
}
.component-form *[data-flex="0.2"] {
  flex: 0.2;
}
.component-form *[data-flex="0.3"] {
  flex: 0.3;
}
.component-form *[data-flex="0.4"] {
  flex: 0.4;
}
.component-form *[data-flex="0.5"] {
  flex: 0.5;
}
.component-form *[data-flex="0.6"] {
  flex: 0.6;
}
.component-form *[data-flex="0.7"] {
  flex: 0.7;
}
.component-form *[data-flex="0.8"] {
  flex: 0.8;
}
.component-form *[data-flex="0.9"] {
  flex: 0.9;
}
.component-form *[data-flex="1"] {
  flex: 1;
}
.component-form *[data-flex="1.1"] {
  flex: 1.1;
}
.component-form *[data-flex="1.2"] {
  flex: 1.2;
}
.component-form *[data-flex="1.3"] {
  flex: 1.3;
}
.component-form *[data-flex="1.4"] {
  flex: 1.4;
}
.component-form *[data-flex="1.5"] {
  flex: 1.5;
}
.component-form *[data-flex="1.6"] {
  flex: 1.6;
}
.component-form *[data-flex="1.7"] {
  flex: 1.7;
}
.component-form *[data-flex="1.8"] {
  flex: 1.8;
}
.component-form *[data-flex="1.9"] {
  flex: 1.9;
}
.component-form *[data-flex="2"] {
  flex: 2;
}
.component-form *[data-flex="2.1"] {
  flex: 2.1;
}
.component-form *[data-flex="2.2"] {
  flex: 2.2;
}
.component-form *[data-flex="2.3"] {
  flex: 2.3;
}
.component-form *[data-flex="2.4"] {
  flex: 2.4;
}
.component-form *[data-flex="2.5"] {
  flex: 2.5;
}
.component-form *[data-flex="2.6"] {
  flex: 2.6;
}
.component-form *[data-flex="2.7"] {
  flex: 2.7;
}
.component-form *[data-flex="2.8"] {
  flex: 2.8;
}
.component-form *[data-flex="2.9"] {
  flex: 2.9;
}
.component-form *[data-flex="3"] {
  flex: 3;
}
.component-form *[data-flex="3.1"] {
  flex: 3.1;
}
.component-form *[data-flex="3.2"] {
  flex: 3.2;
}
.component-form *[data-flex="3.3"] {
  flex: 3.3;
}
.component-form *[data-flex="3.4"] {
  flex: 3.4;
}
.component-form *[data-flex="3.5"] {
  flex: 3.5;
}
.component-form *[data-flex="3.6"] {
  flex: 3.6;
}
.component-form *[data-flex="3.7"] {
  flex: 3.7;
}
.component-form *[data-flex="3.8"] {
  flex: 3.8;
}
.component-form *[data-flex="3.9"] {
  flex: 3.9;
}
.component-form *[data-flex="4"] {
  flex: 4;
}
.component-form *[data-flex="4.1"] {
  flex: 4.1;
}
.component-form *[data-flex="4.2"] {
  flex: 4.2;
}
.component-form *[data-flex="4.3"] {
  flex: 4.3;
}
.component-form *[data-flex="4.4"] {
  flex: 4.4;
}
.component-form *[data-flex="4.5"] {
  flex: 4.5;
}
.component-form *[data-flex="4.6"] {
  flex: 4.6;
}
.component-form *[data-flex="4.7"] {
  flex: 4.7;
}
.component-form *[data-flex="4.8"] {
  flex: 4.8;
}
.component-form *[data-flex="4.9"] {
  flex: 4.9;
}
.component-form *[data-flex="5"] {
  flex: 5;
}
.component-form *[data-flex="5.1"] {
  flex: 5.1;
}
.component-form *[data-flex="5.2"] {
  flex: 5.2;
}
.component-form *[data-flex="5.3"] {
  flex: 5.3;
}
.component-form *[data-flex="5.4"] {
  flex: 5.4;
}
.component-form *[data-flex="5.5"] {
  flex: 5.5;
}
.component-form *[data-flex="5.6"] {
  flex: 5.6;
}
.component-form *[data-flex="5.7"] {
  flex: 5.7;
}
.component-form *[data-flex="5.8"] {
  flex: 5.8;
}
.component-form *[data-flex="5.9"] {
  flex: 5.9;
}
.component-form *[data-flex="6"] {
  flex: 6;
}
.component-form *[data-flex="6.1"] {
  flex: 6.1;
}
.component-form *[data-flex="6.2"] {
  flex: 6.2;
}
.component-form *[data-flex="6.3"] {
  flex: 6.3;
}
.component-form *[data-flex="6.4"] {
  flex: 6.4;
}
.component-form *[data-flex="6.5"] {
  flex: 6.5;
}
.component-form *[data-flex="6.6"] {
  flex: 6.6;
}
.component-form *[data-flex="6.7"] {
  flex: 6.7;
}
.component-form *[data-flex="6.8"] {
  flex: 6.8;
}
.component-form *[data-flex="6.9"] {
  flex: 6.9;
}
.component-form *[data-flex="7"] {
  flex: 7;
}
.component-form *[data-flex="7.1"] {
  flex: 7.1;
}
.component-form *[data-flex="7.2"] {
  flex: 7.2;
}
.component-form *[data-flex="7.3"] {
  flex: 7.3;
}
.component-form *[data-flex="7.4"] {
  flex: 7.4;
}
.component-form *[data-flex="7.5"] {
  flex: 7.5;
}
.component-form *[data-flex="7.6"] {
  flex: 7.6;
}
.component-form *[data-flex="7.7"] {
  flex: 7.7;
}
.component-form *[data-flex="7.8"] {
  flex: 7.8;
}
.component-form *[data-flex="7.9"] {
  flex: 7.9;
}
.component-form *[data-flex="8"] {
  flex: 8;
}
.component-form *[data-flex="8.1"] {
  flex: 8.1;
}
.component-form *[data-flex="8.2"] {
  flex: 8.2;
}
.component-form *[data-flex="8.3"] {
  flex: 8.3;
}
.component-form *[data-flex="8.4"] {
  flex: 8.4;
}
.component-form *[data-flex="8.5"] {
  flex: 8.5;
}
.component-form *[data-flex="8.6"] {
  flex: 8.6;
}
.component-form *[data-flex="8.7"] {
  flex: 8.7;
}
.component-form *[data-flex="8.8"] {
  flex: 8.8;
}
.component-form *[data-flex="8.9"] {
  flex: 8.9;
}
.component-form *[data-flex="9"] {
  flex: 9;
}
.component-form *[data-flex="9.1"] {
  flex: 9.1;
}
.component-form *[data-flex="9.2"] {
  flex: 9.2;
}
.component-form *[data-flex="9.3"] {
  flex: 9.3;
}
.component-form *[data-flex="9.4"] {
  flex: 9.4;
}
.component-form *[data-flex="9.5"] {
  flex: 9.5;
}
.component-form *[data-flex="9.6"] {
  flex: 9.6;
}
.component-form *[data-flex="9.7"] {
  flex: 9.7;
}
.component-form *[data-flex="9.8"] {
  flex: 9.8;
}
.component-form *[data-flex="9.9"] {
  flex: 9.9;
}
.component-form *[data-flex="10"] {
  flex: 10;
}
.component-form *[data-flex="10.1"] {
  flex: 10.1;
}
.component-form *[data-flex="10.2"] {
  flex: 10.2;
}
.component-form *[data-flex="10.3"] {
  flex: 10.3;
}
.component-form *[data-flex="10.4"] {
  flex: 10.4;
}
.component-form *[data-flex="10.5"] {
  flex: 10.5;
}
.component-form *[data-flex="10.6"] {
  flex: 10.6;
}
.component-form *[data-flex="10.7"] {
  flex: 10.7;
}
.component-form *[data-flex="10.8"] {
  flex: 10.8;
}
.component-form *[data-flex="10.9"] {
  flex: 10.9;
}
.component-form *[data-flex="11"] {
  flex: 11;
}
.component-form *[data-flex="11.1"] {
  flex: 11.1;
}
.component-form *[data-flex="11.2"] {
  flex: 11.2;
}
.component-form *[data-flex="11.3"] {
  flex: 11.3;
}
.component-form *[data-flex="11.4"] {
  flex: 11.4;
}
.component-form *[data-flex="11.5"] {
  flex: 11.5;
}
.component-form *[data-flex="11.6"] {
  flex: 11.6;
}
.component-form *[data-flex="11.7"] {
  flex: 11.7;
}
.component-form *[data-flex="11.8"] {
  flex: 11.8;
}
.component-form *[data-flex="11.9"] {
  flex: 11.9;
}
.component-form *[data-flex="12"] {
  flex: 12;
}
.component-form *[data-flex="12.1"] {
  flex: 12.1;
}
.component-form *[data-flex="12.2"] {
  flex: 12.2;
}
.component-form *[data-flex="12.3"] {
  flex: 12.3;
}
.component-form *[data-flex="12.4"] {
  flex: 12.4;
}
.component-form *[data-flex="12.5"] {
  flex: 12.5;
}
.component-form *[data-flex="12.6"] {
  flex: 12.6;
}
.component-form *[data-flex="12.7"] {
  flex: 12.7;
}
.component-form *[data-flex="12.8"] {
  flex: 12.8;
}
.component-form *[data-flex="12.9"] {
  flex: 12.9;
}
.component-form *[data-flex="13"] {
  flex: 13;
}
.component-form *[data-flex="13.1"] {
  flex: 13.1;
}
.component-form *[data-flex="13.2"] {
  flex: 13.2;
}
.component-form *[data-flex="13.3"] {
  flex: 13.3;
}
.component-form *[data-flex="13.4"] {
  flex: 13.4;
}
.component-form *[data-flex="13.5"] {
  flex: 13.5;
}
.component-form *[data-flex="13.6"] {
  flex: 13.6;
}
.component-form *[data-flex="13.7"] {
  flex: 13.7;
}
.component-form *[data-flex="13.8"] {
  flex: 13.8;
}
.component-form *[data-flex="13.9"] {
  flex: 13.9;
}
.component-form *[data-flex="14"] {
  flex: 14;
}
.component-form *[data-flex="14.1"] {
  flex: 14.1;
}
.component-form *[data-flex="14.2"] {
  flex: 14.2;
}
.component-form *[data-flex="14.3"] {
  flex: 14.3;
}
.component-form *[data-flex="14.4"] {
  flex: 14.4;
}
.component-form *[data-flex="14.5"] {
  flex: 14.5;
}
.component-form *[data-flex="14.6"] {
  flex: 14.6;
}
.component-form *[data-flex="14.7"] {
  flex: 14.7;
}
.component-form *[data-flex="14.8"] {
  flex: 14.8;
}
.component-form *[data-flex="14.9"] {
  flex: 14.9;
}
.component-form *[data-flex="15"] {
  flex: 15;
}
.component-form *[data-flex="15.1"] {
  flex: 15.1;
}
.component-form *[data-flex="15.2"] {
  flex: 15.2;
}
.component-form *[data-flex="15.3"] {
  flex: 15.3;
}
.component-form *[data-flex="15.4"] {
  flex: 15.4;
}
.component-form *[data-flex="15.5"] {
  flex: 15.5;
}
.component-form *[data-flex="15.6"] {
  flex: 15.6;
}
.component-form *[data-flex="15.7"] {
  flex: 15.7;
}
.component-form *[data-flex="15.8"] {
  flex: 15.8;
}
.component-form *[data-flex="15.9"] {
  flex: 15.9;
}
.component-form *[data-flex="16"] {
  flex: 16;
}
.component-form *[data-flex="16.1"] {
  flex: 16.1;
}
.component-form *[data-flex="16.2"] {
  flex: 16.2;
}
.component-form *[data-flex="16.3"] {
  flex: 16.3;
}
.component-form *[data-flex="16.4"] {
  flex: 16.4;
}
.component-form *[data-flex="16.5"] {
  flex: 16.5;
}
.component-form *[data-flex="16.6"] {
  flex: 16.6;
}
.component-form *[data-flex="16.7"] {
  flex: 16.7;
}
.component-form *[data-flex="16.8"] {
  flex: 16.8;
}
.component-form *[data-flex="16.9"] {
  flex: 16.9;
}
.component-form *[data-flex="17"] {
  flex: 17;
}
.component-form *[data-flex="17.1"] {
  flex: 17.1;
}
.component-form *[data-flex="17.2"] {
  flex: 17.2;
}
.component-form *[data-flex="17.3"] {
  flex: 17.3;
}
.component-form *[data-flex="17.4"] {
  flex: 17.4;
}
.component-form *[data-flex="17.5"] {
  flex: 17.5;
}
.component-form *[data-flex="17.6"] {
  flex: 17.6;
}
.component-form *[data-flex="17.7"] {
  flex: 17.7;
}
.component-form *[data-flex="17.8"] {
  flex: 17.8;
}
.component-form *[data-flex="17.9"] {
  flex: 17.9;
}
.component-form *[data-flex="18"] {
  flex: 18;
}
.component-form *[data-flex="18.1"] {
  flex: 18.1;
}
.component-form *[data-flex="18.2"] {
  flex: 18.2;
}
.component-form *[data-flex="18.3"] {
  flex: 18.3;
}
.component-form *[data-flex="18.4"] {
  flex: 18.4;
}
.component-form *[data-flex="18.5"] {
  flex: 18.5;
}
.component-form *[data-flex="18.6"] {
  flex: 18.6;
}
.component-form *[data-flex="18.7"] {
  flex: 18.7;
}
.component-form *[data-flex="18.8"] {
  flex: 18.8;
}
.component-form *[data-flex="18.9"] {
  flex: 18.9;
}
.component-form *[data-flex="19"] {
  flex: 19;
}
.component-form *[data-flex="19.1"] {
  flex: 19.1;
}
.component-form *[data-flex="19.2"] {
  flex: 19.2;
}
.component-form *[data-flex="19.3"] {
  flex: 19.3;
}
.component-form *[data-flex="19.4"] {
  flex: 19.4;
}
.component-form *[data-flex="19.5"] {
  flex: 19.5;
}
.component-form *[data-flex="19.6"] {
  flex: 19.6;
}
.component-form *[data-flex="19.7"] {
  flex: 19.7;
}
.component-form *[data-flex="19.8"] {
  flex: 19.8;
}
.component-form *[data-flex="19.9"] {
  flex: 19.9;
}
.component-form *[data-flex="20"] {
  flex: 20;
}
.component-form .fieldspacer {
  border: 0;
  height: 1px;
  width: 100%;
  padding: 0;
  margin: 0.32rem 0;
  background: #fff;
  visibility: visible;
}
.component-form [data-reveal-listener] {
  display: none;
}

.icon {
  display: inline-block;
  background: no-repeat;
  background-size: contain;
  width: 0.28rem;
  height: 0.28rem;
  margin-right: 0.08rem;
  vertical-align: middle;
}
.icon--small {
  width: 0.14rem;
  height: 0.14rem;
  padding: 0.07rem;
}
.icon--copy {
  background-image: url(../static/images/icons/copy.svg);
  left: auto !important;
  margin: 0 !important;
}
.icon--location {
  background-image: url(../static/images/icons/location.svg);
}
.icon--phone {
  background-image: url(../static/images/icons/mobile--white.svg);
  background-size: auto;
}
.active .icon--phone {
  background-image: url(../static/images/icons/mobile.svg);
}
.icon--email {
  background-image: url(../static/images/icons/mail--white.svg);
  background-size: auto;
}
.active .icon--email {
  background-image: url(../static/images/icons/mail.svg);
}
.icon--check {
  background-image: url(../static/images/icons/check.svg);
}
.icon--dropbox {
  background-image: url(../static/images/icons/dropbox.svg);
  margin-top: 0.02rem;
  margin-left: 0.05rem;
}
.icon--gdrive {
  background-image: url(../static/images/icons/gdrive.svg);
}
.icon--plus {
  background-image: url(../static/images/icons/plus.svg);
}
.active .icon--plus {
  background-image: url(../static/images/icons/plus--purple.svg);
}
.icon--higienizacao {
  background-image: url(../static/images/icons/higienizacao.svg);
}
.active .icon--higienizacao {
  background-image: url(../static/images/icons/higienizacao--white.svg);
}
.icon--tv {
  background-image: url(../static/images/icons/tv.svg);
}
.active .icon--tv {
  background-image: url(../static/images/icons/tv--white.svg);
}
.icon--linha-branca {
  background-image: url(../static/images/icons/linha-branca.svg);
}
.active .icon--linha-branca {
  background-image: url(../static/images/icons/linha-branca--white.svg);
}
.icon--conecta {
  background-image: url(../static/images/icons/conecta.svg);
}
.active .icon--conecta {
  background-image: url(../static/images/icons/conecta--white.svg);
}
.icon--impermebealizacao {
  background-image: url(../static/images/icons/impermebealizacao.svg);
}
.active .icon--impermebealizacao {
  background-image: url(../static/images/icons/impermebealizacao--white.svg);
}
.icon--ventilador {
  background-image: url(../static/images/icons/ventilador.svg);
}
.active .icon--ventilador {
  background-image: url(../static/images/icons/ventilador--white.svg);
}
.icon--audio-video {
  background-image: url(../static/images/icons/audio-video.svg);
}
.active .icon--audio-video {
  background-image: url(../static/images/icons/audio-video--white.svg);
}
.icon--ar-condicionado {
  background-image: url(../static/images/icons/ar-condicionado.svg);
}
.active .icon--ar-condicionado {
  background-image: url(../static/images/icons/ar-condicionado--white.svg);
}
.icon--impressora {
  background-image: url(../static/images/icons/impressora.svg);
}
.active .icon--impressora {
  background-image: url(../static/images/icons/impressora--white.svg);
}

.loading__wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  transition: opacity 0.2s ease-in-out, bottom 0.2s 0.3s ease-in-out, height 0.2s 0.3s ease-in-out, background-color 0.2s 0.3s ease-in-out;
  position: fixed;
  bottom: -12px;
  left: 0;
  right: 0;
  width: 100%;
  height: 5px;
  box-sizing: content-box;
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
  z-index: 9999;
  opacity: 0;
  overflow: hidden;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.loading .loading__wrapper {
  transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, height 0.3s 0.3s ease-in-out, background-color 0.3s 0.3s ease-in-out;
  bottom: 0px;
  height: 100%;
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
  opacity: 1;
}
.loading__logo {
  width: 2.2rem;
  transform: scale(1);
  -webkit-animation: pulse 2s infinite;
          animation: pulse 2s infinite;
}
.loading__bar {
  transition: width 0.2s 0.3s ease-in-out, height 0.2s 0.3s ease-in-out;
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  right: 0;
  width: auto;
  background: #fff;
  transform: translateY(-50%);
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.loading__bar:after {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  transition: opacity 0 0.3 0 linear;
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  opacity: 0;
  color: #fff;
  width: 2rem;
  height: 2rem;
}
.loading .loading__bar {
  transition: width 0.3s 0.3s ease-in-out, height 0.3s 0.3s ease-in-out, border-top-width 0.3s 0.3s ease-in-out, border-bottom-width 0.3s 0.3s ease-in-out;
  border-top-width: 0px;
  border-bottom-width: 0px;
}
.loading .loading__bar:after {
  transition: opacity 0.3s 0.3s linear;
  opacity: 1;
  background-size: contain;
}
.loading.end-animate .loading__bar {
  -webkit-animation: loadingBar 0.3s 0.3s 0.3;
          animation: loadingBar 0.3s 0.3s 0.3;
}
@-webkit-keyframes pulse {
  0% {
    transform: scale(0.95);
  }
  70% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.95);
  }
}
@keyframes pulse {
  0% {
    transform: scale(0.95);
  }
  70% {
    transform: scale(1);
  }
  100% {
    transform: scale(0.95);
  }
}

.menu {
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
  width: 100vw;
  z-index: 20;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  transform: translateX(-100%);
  transition: 0.6s;
}
.menu--open {
  transform: translate(0, 0);
}
.menu__wrapper {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: 0.55rem 0 0 0;
}
.menu__wrapper--more-margin {
  margin: 0.75rem 0 0 0;
}
.menu__close {
  position: absolute;
  top: 0.3rem;
  left: 0.25rem;
  text-indent: -99999px;
  width: 0.3rem;
  height: 0.3rem;
  background-image: url(../static/images/icons/close.svg);
  background-repeat: no-repeat;
}
.menu__upper-infos {
  width: 3.3rem;
  display: flex;
  margin: 0.25rem 0 0.4rem 0;
}
.menu__upper-infos-wrapper {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  margin: 0 0 0 0.25rem;
}
.menu__upper-infos-wrapper--centered {
  margin: 0 auto;
  align-items: center;
}
.menu__upper-infos img {
  width: 1.15rem;
  height: 1.15rem;
  border-radius: 99px;
}
.menu__upper-status {
  width: 3.3rem;
  margin: auto;
}
.menu__upper-status h5 {
  font-size: 0.18rem;
  margin: 0 0 0.38rem;
  text-align: center;
  color: #f9f15f;
  font-weight: 600;
}
.menu__upper-bar {
  width: 100;
  height: 0.08rem;
  background-color: #fff;
  margin: 0 0 0.14rem 0;
  border-radius: 0.08rem;
}
.menu__upper-bar--value {
  background-color: #f9f15f;
  height: 100%;
  border-radius: 0.08rem;
}
.menu__upper-dates {
  display: flex;
  justify-content: space-between;
}
.menu__upper-dates h6 {
  font-weight: 400 !important;
}
.menu__upper-dates--start {
  text-align: left !important;
}
.menu__upper-dates--start strong {
  font-weight: bold !important;
}
.menu__upper-dates--end {
  text-align: right !important;
}
.menu__upper-dates--end strong {
  font-weight: bold !important;
}
.menu__upper h6 {
  font-size: 0.15rem;
  margin: 0 0 0.12rem;
  color: #fff;
  font-weight: 600;
  word-break: break-word;
}
.menu__upper h6:last-child {
  margin: 0;
}
.menu__upper a {
  color: #f9f15f;
}
.menu__lower h6 {
  font-size: 0.16rem;
  margin: 0 0 0.2rem;
  text-align: center;
  color: #fff;
  font-weight: 500;
}
.menu__socials {
  display: flex;
  align-items: center;
  justify-content: center;
}
.menu__socials a {
  width: 0.2rem;
  height: 0.2rem;
  margin: 0 0.08rem;
  display: flex;
  align-items: center;
  justify-content: center;
}
.menu__socials a img {
  max-width: 100%;
  max-height: 100%;
}
.menu__anchors {
  width: 100%;
  display: flex;
  flex-direction: column;
  padding: 0.3rem 0;
  margin: 0.45rem 0;
  border-top: 0.5px solid #cccccc;
  border-bottom: 0.5px solid #cccccc;
}
.menu__anchors a {
  font-size: 0.16rem;
  margin: 0.22rem 0;
  text-align: center;
  color: #fff;
  font-weight: 600;
  transform: 0.3s;
  text-decoration: none;
}
.menu__anchors a:hover {
  color: #f9f15f;
}
.menu__desktop {
  display: flex;
  margin: 0 auto 0.2rem auto;
  z-index: 2;
  position: relative;
  max-width: 9rem;
  width: 100%;
}
.menu__desktop a {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  color: #fff;
  text-transform: uppercase;
  font-size: 0.14rem;
  line-height: 0.21rem;
  margin: 0 0.32rem 0 0;
  font-weight: bold;
  text-decoration: none;
  letter-spacing: 2px;
}
.menu__desktop .active {
  border-bottom: 2px solid #ee00ff;
}
.menu__desktop--more-services {
  display: flex;
  color: #f9f15f !important;
  margin: 0 0 0 auto !important;
}
.menu__desktop--more-services.active {
  color: #ee00ff !important;
  border: none !important;
}
.menu__desktop--more-services i {
  width: 0.18rem;
  margin: 0 0.12rem 0 0;
  position: relative;
  bottom: 0.03rem;
  background-position: center;
}
.menu__profile {
  position: absolute;
  width: 100%;
  top: 0.15rem;
  margin: auto;
  display: flex;
  justify-content: center;
  z-index: 2;
}
.menu__profile-wrapper {
  max-width: 10rem;
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.menu__profile span {
  margin: 0 0.12rem;
}
.menu__profile h2 {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  color: #fff;
  text-transform: uppercase;
  font-size: 0.15rem;
  margin: 0 0.36rem 0 0;
  font-weight: bold;
}
.menu__profile a {
  color: #f9f15f;
  margin: 0 0 0 0.08rem;
}
.menu__profile-logo {
  display: flex;
  align-items: center;
  justify-content: center;
}
.menu__profile-logo img {
  width: 2rem;
}
.menu__profile-infos {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.menu__profile-infos h2 {
  text-transform: lowercase;
}
.menu__profile-infos img {
  border-radius: 99px;
  margin: 0 0.2rem 0;
  height: 0.5rem;
  width: 0.5rem;
}
.menu__profile-logout {
  position: absolute;
  right: 0.36rem;
  bottom: -0.1rem;
}

.footer {
  width: 100%;
  padding: 0.2rem 0 0.15rem 0;
  height: 0.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
  position: absolute;
  bottom: 0;
}
@media (min-width: 1025px) {
  .footer {
    margin: 0.5rem 0 0.15rem 0;
    padding: 0.7rem 0 0.15rem 0;
    height: auto;
    position: relative !important;
    display: flex;
    flex-direction: column;
    border-top: 1px solid #eaeaea;
  }
  .pages-lojas .footer, .pages-contato .footer {
    margin: 0 !important;
  }
}
.pages-no-services .footer {
  display: none !important;
}
.pages-login .footer, .pages-cpf .footer, .pages-planos .footer, .pages-profile .footer, .pages-perfil .footer, .pages-contratos .footer, .pages-selecionar-metodo .footer, .pages-sucesso .footer {
  width: 100% !important;
  padding: 0.2rem 0 0.15rem 0 !important;
  height: 0.6rem !important;
  position: absolute !important;
  display: flex !important;
  border-top: none !important;
}
.pages-login .footer.only-desktop, .pages-cpf .footer.only-desktop, .pages-planos .footer.only-desktop, .pages-profile .footer.only-desktop, .pages-perfil .footer.only-desktop, .pages-contratos .footer.only-desktop, .pages-selecionar-metodo .footer.only-desktop, .pages-sucesso .footer.only-desktop {
  display: none !important;
}
.pages-confirmar .footer {
  display: none !important;
}
.pages-home .footer, .pages-more-services .footer, .pages-mais-servicos .footer, .pages-benefits .footer, .pages-meus-beneficios .footer, .pages-wifi .footer, .pages-decora .footer, .pages-nuvem .footer, .pages-contract .footer, .pages-contrato .footer, .pages-lu-explica .footer, .pages-lojas .footer, .pages-numero-da-sorte .footer, .pages-sorte-free .footer {
  position: relative;
}
.pages-home .footer a, .pages-more-services .footer a, .pages-mais-servicos .footer a, .pages-benefits .footer a, .pages-meus-beneficios .footer a, .pages-wifi .footer a, .pages-decora .footer a, .pages-nuvem .footer a, .pages-contract .footer a, .pages-contrato .footer a, .pages-lu-explica .footer a, .pages-lojas .footer a, .pages-numero-da-sorte .footer a, .pages-sorte-free .footer a {
  color: #6e6e6e;
}
.pages-selecionar-metodo .footer, .pages-contratos .footer {
  position: relative;
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
}
.footer a {
  font-family: "SF UI Display", Arial, Helvetica;
  text-decoration: none;
  color: #fff;
  font-size: 0.15rem;
}
.footer a strong {
  font-weight: 900;
}
.footer__upper {
  height: auto;
  display: flex;
  width: 11.7rem;
  justify-content: space-between;
}
.footer__logos {
  display: flex;
  align-items: center;
  width: 4.9rem;
}
.footer__logos img {
  width: 2.2rem;
  margin: 0 0.45rem 0 0;
}
.footer__logos a {
  font-size: 0.24rem;
}
.footer__socials {
  display: flex;
  align-items: center;
  justify-content: center;
}
.footer__socials a {
  margin: 0 0.15rem;
  display: flex;
  align-items: center;
}
.footer__socials a img {
  max-height: 0.25rem;
  max-width: 0.25rem;
  width: 100%;
  height: 100%;
}
.footer__socials p {
  margin: 0 0.14rem 0 0;
  font-size: 0.22rem;
  color: #6e6e6e;
}
.footer__anchors {
  display: flex;
  width: 11.7rem;
  margin: 0.54rem 0 0.2rem 0;
}
.footer__anchors a {
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  color: #6e6e6e;
  text-transform: uppercase;
  font-size: 0.13rem;
  margin: 0 0.36rem 0 0;
  font-weight: bold;
}

.login {
  height: 100vh;
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
}
.login__wrapper {
  width: 100%;
  height: 100%;
  min-height: 5.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  max-width: 6rem;
  margin: auto;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1025px) {
  .login__wrapper {
    max-width: 19.2rem;
  }
}
.login__back {
  position: absolute;
  top: 0.8rem;
  left: 0.25rem;
  text-indent: -99999px;
  width: 0.2rem;
  height: 0.13rem;
  background-image: url(../static/images/icons/back.svg);
  background-repeat: no-repeat;
}
@media (min-width: 1025px) {
  .login__back {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: -25%;
  }
}
.login__help {
  position: absolute;
  top: 0.4rem;
  right: 0.25rem;
  text-indent: -99999px;
  width: 0.22rem;
  height: 0.22rem;
  background-image: url(../static/images/icons/help.svg);
  background-repeat: no-repeat;
}
.login__logo {
  width: 2.2rem;
  margin: 0 0 0.4rem;
}
.login__image {
  width: 1rem;
  margin: 0 0 0.3rem;
}
.login__image--small {
  width: 0.5rem;
}
.login__image--no-margin {
  margin: 0;
}
.login__figure {
  width: 1rem;
  height: 1rem;
  margin: 0 0 0.4rem;
  border-radius: 0.99rem;
  background-color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.login__title {
  font-size: 0.2rem;
  margin: 0;
  text-align: center;
  color: #fff;
  margin: 0 0 0.2rem;
  font-weight: bold;
}
.login__title--upper {
  top: 0.5rem;
  position: absolute;
  margin: 0;
}
.login__description {
  font-size: 0.16rem;
  margin: 0 0 0.55rem;
  text-align: center;
  color: #fff;
  font-weight: 400;
}
.login__description--less-margin {
  margin: 0 0 0.35rem;
}
.login__description--more-margin {
  margin: 0 0 1.3rem;
}
.login__description--small {
  font-size: 0.14rem;
  line-height: 0.22rem;
}
.login__description a {
  color: #fff;
}
.login__form {
  margin: 0.15rem 0 0 0;
  /* Chrome, Safari, Edge, Opera */
  /* Firefox */
}
.login__form #pin-number-error {
  top: 0.35rem;
}
.login__form .placelabel span {
  color: #fff;
}
.login__form .placelabel--nomargin {
  margin: 0;
}
.login__form .fieldgroup--last {
  margin-bottom: 0.55rem;
}
.login__form .fieldgroup--pin {
  width: 0.8rem;
  margin: 0 auto;
}
.login__form .fieldgroup--pin input {
  text-align: center;
  padding-left: 0;
  padding-right: 0;
  font-size: 0.24rem;
  text-align: center;
  padding-top: 0 !important;
  padding-bottom: 0.05rem !important;
}
.login__form .fieldgroup--pin input.valid {
  border-color: #fff !important;
}
.login__form .fieldgroup--pin span.error {
  left: 50%;
  transform: translate(-50%, 0);
}
.login__form input::-webkit-outer-spin-button,
.login__form input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
.login__form input[type=number] {
  -moz-appearance: textfield;
}
.login__carousel {
  display: flex;
  width: 100%;
}
.login__carousel .flickity-viewport {
  width: calc(100% + 0.25rem);
  padding-left: 0.25rem;
}
@media (min-width: 1025px) {
  .login__carousel--no-padding .flickity-viewport {
    padding-left: 0;
  }
}
.login__carousel-item {
  display: block;
  background-color: #fff;
  border-radius: 0.06rem;
  border: 1px solid #ba1cf7;
  width: 1.28rem;
  height: 1.28rem;
  margin: 0 0.22rem 0 0;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  overflow: hidden;
}
.login__carousel-item--big {
  width: 2rem;
  height: 2rem;
  margin: 0 0 0 0.4rem;
  border: none;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  position: relative;
  background-size: cover;
}
.login__carousel-item--big:before {
  content: "";
  display: block;
  position: absolute;
  background: #000;
  background: linear-gradient(0deg, black 0%, rgba(255, 255, 255, 0) 100%);
  height: 100%;
  width: 100%;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .login__carousel-item--big:before {
    display: none !important;
  }
}
.login__carousel-item--big:after {
  content: url(../static/images/icons/arrow.svg);
  display: block;
  width: 0.7rem;
  height: 0.7rem;
  background: #f9f15f;
  bottom: 0;
  right: 0;
  position: absolute;
  display: block;
  background-size: contain;
  padding: 0.25rem 0.2rem 0.2rem 0.2rem;
  box-sizing: border-box;
  border-bottom-right-radius: 0.06rem;
}
.login__carousel-item-icon {
  width: 0.45rem;
  height: 0.36rem;
  margin: 0 0 0.14rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.login__carousel-item-icon img {
  width: 100%;
  max-height: 100%;
}
.login__carousel-item-title {
  color: #ba1cf7;
  font-weight: bold;
  font-size: 0.16rem;
  line-height: 0.14rem;
  text-align: center;
}
.login__carousel-item-text {
  margin: 0;
  color: #fff;
  font-size: 0.16rem;
  padding: 0 0.14rem 0.14rem 0.14rem;
  width: calc(100% - 0.7rem);
  font-weight: 600;
  z-index: 1;
}
.login__radios-wrapper {
  margin: 0 0 0.2rem;
  max-width: 100%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
.login__radios-wrapper input[type=radio] {
  display: none;
}
.login__radios-wrapper label {
  margin: 0;
  cursor: pointer;
}
.login__pin-button {
  display: flex;
  flex-direction: column;
  padding: 0 0.2rem 0 0.3rem;
  margin: 0 0 0.08rem 0;
}
.login__pin-button.active h6 {
  color: #000 !important;
}
.login__pin-button-wrapper {
  display: flex;
}
.login__pin-button-wrapper h6 {
  font-weight: 500;
  margin: 0 0 0 0.08rem;
  color: #fff;
  font-size: 0.14rem;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  display: flex;
  align-items: center;
}
.login__pin-button-phone {
  margin-left: -0.3rem;
}
.login__pin-button-email {
  margin-left: -0.35rem;
  margin-top: 0.05rem;
}
.login__pin-button-phone, .login__pin-button-email {
  max-width: 0.25rem;
  max-height: 0.25rem;
  position: absolute;
  left: 0 !important;
}
.login__pin-button-phone span, .login__pin-button-email span {
  text-align: left;
}
.login__button {
  margin: 0.08rem 0 0 0;
}
.login__divider {
  font-size: 0.13rem;
  margin: 0.2rem 0;
  text-align: center;
  color: #fff;
  font-weight: 400;
}
.login__divider:before, .login__divider:after {
  content: "";
  display: inline;
  width: 100%;
  height: 1px;
  background: #fff;
  position: relative;
  margin-top: 0.07rem;
  width: 0.45rem;
  position: absolute;
}
.login__divider:before {
  left: 0;
}
.login__divider:after {
  right: 0;
}
.login__disclaimer {
  font-size: 0.12rem;
  margin: 0.2rem 0;
  text-align: center;
  color: #fff;
  font-weight: 400;
}
.login__disclaimer--absolute {
  bottom: 0.5rem;
  position: absolute;
}
.login__disclaimer--link {
  color: #f9f15f;
}
.login__policy-more-content {
  padding: 0.3rem 0.3rem 0.6rem !important;
}
@media (min-width: 1025px) {
  .login__policy-more-content {
    padding: 0.3rem !important;
    max-width: 6.8rem;
  }
}
.login__policy-more-content ul {
  font-size: 0.16rem;
}
.login__policy-more-content-name {
  width: 95%;
  font-size: 0.38rem;
  font-weight: normal;
  margin: 0 0 0.32rem;
}
@media (max-width: 1025px) {
  .login__policy-more-content-name {
    font-size: 0.26rem;
    margin: 0 0 0.16rem;
  }
}
.login__policy-more-content-name:last-child {
  margin-bottom: 0;
}
.login__policy-more-content-wrapper {
  min-height: 50px;
  max-height: 60vh;
  padding-right: 0.32rem;
  overflow: auto;
}
.login__policy-more-content-wrapper p {
  font-size: 0.18rem;
  margin-top: 0;
  line-height: 1.4;
}
@media (max-width: 1025px) {
  .login__policy-more-content-wrapper p {
    font-size: 0.14rem;
  }
}
@media (max-width: 1025px) {
  .login__policy-more-content-wrapper {
    max-height: 70vh;
  }
}
.login__policy-button {
  background: #ee00ff;
  color: #fff;
  font-family: "Magalu Textos Beta", Arial, Helvetica;
  font-weight: 600;
  font-size: 0.14rem;
  text-transform: uppercase;
  text-decoration: none;
  text-align: center;
  border-radius: 0.05rem;
  border: 0;
  width: 100%;
  height: 0.45rem;
  margin: 0.1rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.login__policy-button-wrapper {
  width: 100%;
  display: flex;
  justify-content: center;
}
@media (min-width: 1025px) {
  .login__policy-button {
    height: 0.35rem;
    width: 2rem;
    margin: 0 0 -0.22rem 0;
  }
}

.logged {
  background-color: #fff;
}
.logged__wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: auto;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1025px) {
  .logged__wrapper {
    max-width: 19.2rem;
  }
}
.logged__back {
  position: absolute;
  top: 0.8rem;
  left: 0.25rem;
  text-indent: -99999px;
  width: 0.2rem;
  height: 0.13rem;
  background-image: url(../static/images/icons/back.svg);
  background-repeat: no-repeat;
  z-index: 1;
}
@media (min-width: 1025px) {
  .logged__back {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: -25%;
  }
}
.logged__menu {
  position: absolute;
  top: 0.95rem;
  left: 0.25rem;
  text-indent: -99999px;
  width: 0.2rem;
  height: 0.2rem;
  background-image: url(../static/images/icons/menu.svg);
  background-repeat: no-repeat;
  z-index: 1;
}
@media (min-width: 1025px) {
  .logged__menu {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: -25%;
  }
}
.logged__more-info {
  position: absolute;
  top: 0.95rem;
  right: 0.25rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  z-index: 1;
}
@media (min-width: 1025px) {
  .logged__more-info {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: 25%;
  }
}
.logged__more-info img {
  width: 0.22rem;
  height: 0.22rem;
}
.logged__more-info span {
  color: #f9f15f;
  font-size: 0.16rem;
  font-weight: 500;
  margin: 0 0 0 0.1rem;
}
.logged__purchase {
  position: absolute;
  top: 0.1rem;
  right: 0.1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  text-decoration: none;
  z-index: 5;
  min-width: 1.2rem;
  height: 0.3rem;
  box-shadow: rgba(125, 9, 142, 0.2) 0px 8px 24px;
}
@media (min-width: 1025px) {
  .logged__purchase {
    right: 0.25rem;
    min-width: 1.4rem;
    height: 0.35rem;
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: 25%;
    width: 1.6rem;
    top: 0.5rem;
  }
}
.logged__purchase img {
  width: 0.22rem;
  height: 0.22rem;
}
.logged__purchase span {
  font-weight: bold;
  font-size: 0.18rem;
  font-weight: 500;
  margin: 0;
}
.logged__header {
  height: 2.3rem;
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
  width: 100%;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}
@media (min-width: 1025px) {
  .logged__header {
    flex-direction: column;
    justify-content: flex-end !important;
    position: relative;
  }
  .logged__header:before {
    content: "";
    display: block;
    position: absolute;
    background: #000;
    background: linear-gradient(0deg, #8843a3 0%, #de04ee 50%);
    height: 100%;
    width: 100%;
  }
}
@media (min-width: 1025px) and (-ms-high-contrast: none), (min-width: 1025px) and (-ms-high-contrast: active) {
  .logged__header:before {
    display: none !important;
  }
}
.logged__header--offset {
  margin-bottom: 0.4rem;
  height: 1.3rem;
}
@media (min-width: 1025px) {
  .logged__header--offset {
    height: 4rem;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 0;
  }
}
.logged__title {
  font-size: 0.2rem;
  margin: 0;
  text-align: center;
  color: #fff;
  margin: 0 0 0.14rem;
  font-weight: bold;
  z-index: 2;
}
@media (min-width: 1025px) {
  .logged__title {
    margin-bottom: 0.9rem;
  }
}
.logged__title--upper {
  top: 0.45rem;
  position: absolute;
  margin: 0;
  z-index: 1;
}
.logged__title--big {
  font-size: 0.28rem;
  line-height: 0.38rem;
}
.logged__title--bigger {
  font-size: 0.38rem;
  line-height: 0.4rem;
}
.logged__title--left {
  text-align: left;
}
.logged__title--pink {
  color: #ee00ff;
}
.logged__text {
  font-size: 0.13rem;
  color: #000;
  margin: 0.14rem 0;
  align-self: flex-start;
  padding-left: 0.3rem;
}
@media (min-width: 1025px) {
  .logged__text {
    margin: 0.28rem 0;
    text-align: center;
    align-self: center;
    padding: 0;
  }
}
.logged__banner {
  background-color: #ba1cf7;
  height: 5.5rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-size: cover;
  margin: 0 0 0.28rem;
  position: relative;
}
@media (min-width: 1025px) {
  .logged__banner {
    margin: 0 0 0.55rem;
  }
}
.logged__banner:before {
  content: "";
  display: block;
  position: absolute;
  background: #000;
  background: linear-gradient(0deg, black 0%, rgba(255, 255, 255, 0) 100%);
  height: 100%;
  width: 100%;
}
@media (min-width: 1025px) {
  .logged__banner:before {
    opacity: 0.5;
  }
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .logged__banner:before {
    display: none !important;
  }
}
.logged__banner h1 {
  margin: 0 0 0.15rem;
  color: #fff;
  font-size: 1.3rem;
  line-height: 1.1rem;
  font-weight: 600;
  padding: 0 0 0 0.28rem;
  z-index: 1;
}
@media (min-width: 1025px) {
  .logged__banner h1 {
    text-align: center;
    font-size: 0.36rem;
    line-height: 0.3rem;
    padding: 0;
  }
}
.logged__banner h1 span {
  color: #ee00ff;
}
.logged__banner h2 {
  margin: 0 0 0.15rem;
  color: #ee00ff;
  font-size: 0.18rem;
  font-weight: 700;
  padding: 0 0 0 0.28rem;
  z-index: 1;
}
.logged__banner h6 {
  margin: 0;
  color: #fff;
  font-size: 0.18rem;
  font-weight: 600;
  padding: 0 0.28rem 0.28rem 0.28rem;
  z-index: 1;
}
@media (min-width: 1025px) {
  .logged__banner h6 {
    text-align: center;
    font-size: 0.2rem;
    margin-bottom: 0.55rem;
  }
}
.logged__video {
  background-size: cover;
  border-radius: 0.06rem;
  margin: 0;
  text-decoration: none;
  display: flex;
  align-items: flex-start;
  justify-content: flex-end;
  flex-direction: column;
  width: 3.6rem;
  height: 2.2rem;
  position: relative;
}
@media (min-width: 1025px) {
  .logged__video {
    margin: 0.28rem 0 0.14rem;
  }
}
.logged__video:before {
  content: "";
  display: block;
  position: absolute;
  background: #000;
  background: linear-gradient(0deg, black 0%, rgba(255, 255, 255, 0) 100%);
  height: 100%;
  width: 100%;
  border-radius: 0.06rem;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .logged__video:before {
    display: none !important;
  }
}
.logged__video--offset {
  transform: translate(0, 50%);
}
.logged__video-tag {
  font-size: 0.14rem;
  line-height: 0.12rem;
  padding: 0.04rem;
  font-weight: 600;
  background-color: #ba1cf7;
  text-transform: uppercase;
  color: #fff;
}
.logged__video-tag--purple {
  background-color: #ba1cf7;
}
.logged__video-tag--blue {
  background-color: #0086ff;
}
.logged__video-text {
  color: #fff;
  font-size: 0.16rem;
  margin: 0.1rem 0 0 0;
  width: 100%;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
}
.logged__carousel {
  display: flex;
  max-width: 12.7rem;
  width: 100%;
  margin: 0 0 0.28rem 0;
  position: relative;
}
@media (min-width: 1025px) {
  .logged__carousel {
    margin: 0 0 0.52rem 0;
  }
}
.logged__carousel + a {
  margin: 0;
}
@media (min-width: 1025px) {
  .logged__carousel + a {
    margin: 0;
  }
}
.logged__carousel--contracts {
  margin: 0.35rem 0 0 0;
}
.pages-home .logged__carousel--contracts {
  margin: 0;
}
.logged__carousel--softwares {
  max-width: 9.2rem;
  display: flex;
  flex-flow: wrap;
  align-items: center;
  justify-content: center;
  margin: 0 0 0.1rem 0;
}
.logged__carousel--softwares .logged__carousel-item {
  margin: 0 0.4rem 0.4rem 0;
}
.logged__carousel--softwares .logged__carousel-item:nth-child(5n) {
  margin: 0 0 0.4rem 0;
}
.logged__carousel--softwares .logged__carousel-item:last-child {
  margin: 0 0 0.4rem 0;
}
@media (min-width: 1025px) {
  .logged__carousel--lu-explica {
    max-width: 19.2rem;
    padding: 0 0.6rem;
  }
}
.logged__carousel .flickity-viewport {
  width: calc(100% - 0.25rem);
  margin: 0 0 0 0.25rem;
}
@media (min-width: 1025px) {
  .logged__carousel .flickity-viewport {
    width: 100%;
    margin: 0;
  }
}
.logged__carousel .flickity-button {
  transition: background-color 0.2s ease;
  position: absolute;
  display: none;
  width: 0.42rem;
  height: 0.42rem;
  background: transparent;
  border: 3px solid #ba1cf7;
  border-radius: 0.54rem;
  z-index: 10;
  cursor: pointer;
  transform: translate(0%, -50%);
  top: 50%;
}
.logged__carousel .flickity-button svg {
  color: transparent;
  fill: #ba1cf7;
  font-size: 0.24rem;
  width: 0.24rem;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.logged__carousel .flickity-button:hover {
  background-color: #fff;
}
.logged__carousel .flickity-button:disabled {
  opacity: 0.5;
}
.logged__carousel .flickity-button.previous {
  left: 0.1rem;
}
.logged__carousel .flickity-button.next {
  right: 0.1rem;
}
@media (min-width: 1025px) {
  .logged__carousel .flickity-button {
    display: block;
  }
}
.logged__carousel--last {
  margin: 0;
}
.logged__carousel-item {
  background-color: #fff;
  border-radius: 0.06rem;
  border: 1px solid #0086ff;
  width: 1.28rem;
  height: 1.16rem;
  margin: 0 0.22rem 0 0;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 0.2rem;
  overflow: hidden;
}
@media (min-width: 1025px) {
  .logged__carousel-item {
    margin: 0;
  }
}
.logged__carousel-item.hidden {
  display: none;
}
.logged__carousel-item.active {
  background: #0086ff;
}
.logged__carousel-item.active span {
  color: #fff;
}
.logged__carousel-item.active img {
  filter: brightness(0) invert(1);
}
.logged__carousel-item--big, .logged__carousel-item--landscape {
  border-radius: 0.1rem;
  margin: 0 0 0 0.4rem;
  border: none;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  position: relative;
  background-size: cover;
  padding: inherit;
  padding: 0.22rem;
}
@media (min-width: 1025px) {
  .logged__carousel-item--big, .logged__carousel-item--landscape {
    margin: 0 0.4rem 0 0;
  }
  .logged__carousel-item--big:last-child, .logged__carousel-item--landscape:last-child {
    margin: 0;
  }
}
.logged__carousel-item--small {
  padding: 0.16rem 0.16rem 0.12rem;
}
.logged__carousel-item--small span {
  text-align: left;
  font-size: 0.12rem;
  height: 0.3rem;
}
.logged__carousel-item--big {
  width: 2rem;
  height: 2rem;
}
.logged__carousel-item--bigger {
  width: 2.5rem;
  height: 2.2rem;
  padding: 0;
  border: none;
  padding-bottom: 0.4rem;
}
.logged__carousel-item--bigger > div {
  height: 100%;
}
.logged__carousel-item--landscape {
  width: 3.2rem;
  height: 1.8rem;
}
.logged__carousel-item--landscape:before {
  content: "";
  display: block;
  position: absolute;
  background: #000;
  background: linear-gradient(0deg, black 0%, rgba(255, 255, 255, 0) 100%);
  height: 100%;
  width: 100%;
  border-radius: 0.06rem;
  left: 0;
  bottom: 0;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .logged__carousel-item--landscape:before {
    display: none !important;
  }
}
.logged__carousel-item-icon {
  width: 0.4rem;
  height: 0.36rem;
  margin: 0 0 0.12rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.logged__carousel-item-icon i {
  width: 100%;
  height: 100%;
  background-position: center;
  margin: 0;
}
.logged__carousel-item-icon--bigger {
  width: 0.5rem;
}
.logged__carousel-item-icon img {
  max-width: 100%;
  max-height: 100%;
}
.logged__carousel-item-image {
  background-size: cover;
  width: 100%;
  height: 100%;
}
.logged__carousel-item-title {
  color: #0086ff;
  font-weight: bold;
  font-size: 0.16rem;
  line-height: 0.14rem;
  text-align: center;
  text-overflow: ellipsis;
  overflow: hidden;
}
.logged__carousel-item-tag {
  font-size: 0.14rem;
  line-height: 0.12rem;
  padding: 0.04rem;
  font-weight: 600;
  background-color: #ba1cf7;
  text-transform: uppercase;
  color: #fff;
  z-index: 2;
}
.logged__carousel-item-tag--purple {
  background-color: #ba1cf7;
}
.logged__carousel-item-tag--blue {
  background-color: #0086ff;
}
.logged__carousel-item-text {
  color: #fff;
  font-size: 0.16rem;
  margin: 0.1rem 0 0 0;
  width: 100%;
  font-weight: 600;
  text-overflow: ellipsis;
  overflow: hidden;
}
.logged__carousel-item-text--under {
  color: #000;
  text-align: left;
  margin: 0;
  font-size: 0.14rem;
  overflow: auto;
  text-overflow: inherit;
  font-weight: 400;
}

.stores__header {
  height: 2rem;
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
}
@media (min-width: 1025px) {
  .stores__header {
    height: 4rem;
    justify-content: flex-end;
  }
  .stores__header:before {
    content: "";
    display: block;
    position: absolute;
    background: #000;
    background: linear-gradient(0deg, #8913b8 0%, rgba(255, 255, 255, 0) 50%);
    height: 100%;
    width: 100%;
  }
}
@media (min-width: 1025px) and (-ms-high-contrast: none), (min-width: 1025px) and (-ms-high-contrast: active) {
  .stores__header:before {
    display: none !important;
  }
}
.stores__header-wrapper {
  padding: 0.35rem 0.5rem 0.35rem 0.6rem;
  display: flex;
  align-items: center;
  z-index: 2;
}
@media (min-width: 1025px) {
  .stores__header-wrapper {
    margin: 0 0 0.4rem;
  }
}
.stores__header--offset {
  margin-bottom: 1.3rem;
}
.stores__title {
  color: #fff;
  margin: 0;
  font-size: 0.23rem;
}
@media (min-width: 1025px) {
  .stores__title {
    font-size: 0.35rem;
  }
}
.stores__icon {
  width: 0.8rem;
  height: 0.8rem;
  margin: 0 0.06rem 0 0;
}
@media (min-width: 1025px) {
  .stores__icon {
    width: 1.6rem;
    height: 1.6rem;
  }
}
.stores__map {
  width: 100%;
  height: 5.2rem;
}
.stores__text {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 2.5rem;
}
.stores__text--hidden {
  display: none;
}
.stores__text h2 {
  text-align: center;
  font-size: 0.2rem;
  margin: 0;
  padding: 0 0.4rem;
  color: #000 !important;
}

.contract__wrapper {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: auto;
  position: relative;
}
@media (min-width: 1025px) {
  .contract__wrapper {
    max-width: 19.2rem;
  }
}
.contract__back {
  position: absolute;
  top: 0.8rem;
  left: 0.25rem;
  text-indent: -99999px;
  width: 0.2rem;
  height: 0.13rem;
  background-image: url(../static/images/icons/back.svg);
  background-repeat: no-repeat;
  z-index: 1;
}
@media (min-width: 1025px) {
  .contract__back {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: -25%;
  }
}
.contract__title {
  font-size: 0.2rem;
  margin: 0;
  text-align: center;
  color: #fff;
  margin: 0 0 0.14rem;
  font-weight: bold;
}
.contract__title--upper {
  top: 0.45rem;
  position: absolute;
  margin: 0;
  z-index: 1;
}
@media (min-width: 1025px) {
  .contract__title--upper {
    max-width: 4.2rem;
    font-size: 0.32rem;
    top: 4.2rem;
  }
}
.contract__banner {
  background-color: #ba1cf7;
  height: 4rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-size: cover;
  margin: 0 0 0.28rem;
  position: relative;
}
@media (min-width: 1025px) {
  .contract__banner {
    height: 5.5rem;
    margin: 0 0 0.55rem;
  }
}
.contract__services {
  padding: 0 0.28rem 0 0.28rem;
  width: 100%;
}
@media (min-width: 1025px) {
  .contract__services {
    max-width: 8.3rem;
    padding: 0.28rem 0.28rem 0 0.28rem;
  }
}
@media (min-width: 1025px) {
  .contract__services-wrapper {
    margin-top: 0.3rem;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
}
@media (min-width: 1025px) {
  .contract__services-key-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.contract__services-side-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
}
@media (min-width: 1025px) {
  .contract__services-side-wrapper {
    max-width: 3.6rem;
    margin: auto;
  }
}
.contract__services-side-wrapper a {
  min-width: 48%;
  width: unset;
}
@media (min-width: 1025px) {
  .contract__services-side-wrapper a {
    display: flex;
    align-items: center;
    justify-content: center;
  }
}
.contract__services-side-wrapper p {
  color: #0086ff !important;
  font-size: 0.19rem !important;
  font-weight: bold;
}
.contract__services h1,
.contract__services h2,
.contract__services h3,
.contract__services h4,
.contract__services h5,
.contract__services h6 {
  font-size: 0.24rem;
  line-height: 0.3rem;
  margin: 0 0 0.12rem;
  color: #ee00ff;
}
.contract__services strong {
  font-weight: bold;
}
.contract__services strong p {
  color: #0086ff !important;
  font-size: 0.2rem !important;
  font-weight: bold;
}
.contract__services p {
  margin: 0 0 0.08rem;
  font-size: 0.14rem;
  line-height: 0.18rem;
  color: #000;
  display: inline-block;
  width: 100%;
}
.contract__services li {
  margin: 0 0 0.08rem;
  font-size: 0.14rem;
  line-height: 0.18rem;
  color: #000;
  display: flex;
}
.contract__services li.contract__services--no-dots:before {
  display: none !important;
}
.contract__services li:before {
  content: url(../static/images/icons/check.svg);
  width: 0.13rem;
  margin: 0 0.08rem 0 0;
}
.contract__services ul {
  padding: 0;
  margin: 0.06rem 0 0.12rem;
}
.contract__services-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  margin: 0.1rem 0;
  width: 100%;
}
@media (min-width: 1025px) {
  .contract__services-divider {
    max-width: 6.5rem;
  }
}
.contract__services-divider h6 {
  font-size: 0.13rem !important;
  margin: 0 !important;
  text-align: center;
  color: #ee00ff !important;
  font-weight: 400;
  position: relative;
  background-color: #fff;
  padding: 0 0.1rem;
  font-weight: 600;
  z-index: 2;
}
.contract__services-divider span {
  width: 100%;
  background: #ee00ff;
  height: 2px;
  display: block;
  position: relative;
  bottom: 0.15rem;
}
.contract__services-bullet {
  background: #ee00ff;
  color: #fff;
  border-radius: 0.99rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-style: normal;
  margin: 0 0.08rem 0 0;
  width: 0.14rem;
  height: 0.14rem;
  padding: 0.07rem;
}
.contract__services-button {
  font-weight: 500;
  font-size: 0.14rem;
  width: 100%;
}
.contract__services-button--medium {
  width: 90%;
}
@media (min-width: 1025px) {
  .contract__services-button {
    max-width: 6.5rem;
    margin: auto;
    font-size: 0.16rem;
  }
  .contract__services-button--medium {
    max-width: 4.2rem;
  }
}
@media (min-width: 1025px) {
  p .contract__services-button {
    display: flex;
  }
}
.contract__services-button[data-copy] {
  position: relative;
  transition: 0.3s;
}
.contract__services-button[data-copy]:before {
  content: "Copiado!";
  transition: top 0.4s ease-in-out;
  background: #fff;
  display: block;
  position: absolute;
  width: 100%;
  height: 100%;
  line-height: 0.42rem;
  color: #ee00ff;
  z-index: 5;
  top: 150% !important;
}
.contract__services-button[data-copy].successcopy:before {
  top: 50% !important;
}
.contract__services-button[data-copy].errorcopy:before {
  content: "Erro ao copiar";
  top: 50%;
  color: #dc0b25;
}
.contract__services-button--smaller {
  min-width: auto !important;
  width: 0.6rem;
  font-size: 0.14rem;
}
.contract__services-button--smaller span {
  text-indent: -9999px;
}
.contract__services-button--smaller::after, .contract__services-button--smaller::before {
  background-color: #fff;
  border: none;
}
.contract__services-more {
  font-weight: 500;
  font-size: 0.14rem;
  width: 100%;
}
.contract__map {
  height: 4rem;
}
@media (min-width: 1025px) {
  .contract__map {
    margin: 0.3rem auto 0 auto;
    width: 100%;
    max-width: 6.9rem;
  }
}

.contact {
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
  height: 100vh;
}
@media (min-width: 1025px) {
  .contact {
    background: #fff;
    height: auto;
  }
}
.contact__wrapper {
  width: 100%;
  height: 100%;
  min-height: 5.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  max-width: 6rem;
  margin: auto;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1025px) {
  .contact__wrapper {
    min-height: auto;
    max-width: 19.2rem;
  }
}
.contact__back {
  position: absolute;
  top: 0.8rem;
  left: 0.25rem;
  text-indent: -99999px;
  width: 0.2rem;
  height: 0.13rem;
  background-image: url(../static/images/icons/back.svg);
  background-repeat: no-repeat;
  z-index: 1;
}
@media (min-width: 1025px) {
  .contact__back {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: -25%;
  }
}
.contact__image {
  width: 1rem;
  margin: 0 0 0.3rem;
}
.contact__title {
  font-size: 0.2rem;
  margin: 0;
  text-align: center;
  color: #fff;
  margin: 0 0 0.14rem;
  font-weight: bold;
  z-index: 2;
}
@media (min-width: 1025px) {
  .contact__title {
    color: #fff;
    font-size: 0.48rem;
  }
}
.contact__title-wrapper {
  display: flex;
  flex-direction: column;
  height: 100%;
  justify-content: center;
  margin: 0 0 0 0.34rem;
}
.contact__description {
  font-size: 0.16rem;
  margin: 0 0 0.55rem;
  text-align: center;
  color: #fff;
  font-weight: 400;
}
@media (min-width: 1025px) {
  .contact__description {
    text-align: left;
    font-size: 0.26rem;
    font-weight: 400;
  }
}
.contact__banner {
  background-color: #ba1cf7;
  height: 5.5rem;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  background-size: cover;
  margin: 0 0 0.28rem;
  position: relative;
}
@media (min-width: 1025px) {
  .contact__banner {
    margin: 0 0 0.55rem;
  }
}
.contact__banner:before {
  content: "";
  display: block;
  position: absolute;
  background: #000;
  background: linear-gradient(0deg, #8843a3 0%, #de04ee 50%);
  height: 100%;
  width: 100%;
}
@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
  .contact__banner:before {
    display: none !important;
  }
}
.contact__banner-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  margin: 0 0 0.8rem 0;
}
@media (min-width: 1025px) {
  .contact__banner-wrapper {
    margin: 0 0 1rem;
  }
}
.contact__banner-wrapper img {
  width: 2.2rem;
}
.contact__carousel {
  display: flex;
  max-width: 7.5rem;
  width: 100%;
  margin: 0 0 0.28rem 0;
  position: relative;
}
@media (min-width: 1025px) {
  .contact__carousel {
    margin: 0 0 0.52rem 0;
  }
}
.contact__carousel .flickity-viewport {
  width: calc(100% - 0.25rem);
  margin: 0 0 0 0.25rem;
}
@media (min-width: 1025px) {
  .contact__carousel .flickity-viewport {
    width: 100%;
    margin: 0;
  }
}
.contact__carousel-item {
  background-color: #fff;
  border-radius: 0.06rem;
  border: 1px solid #ba1cf7;
  width: 1.45rem;
  height: 1.35rem;
  margin: 0 0.22rem 0 0;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  padding: 0.1rem;
  overflow: hidden;
}
.contact__carousel-item:last-child {
  margin: 0;
}
.contact__carousel-item-icon {
  width: 0.4rem;
  height: 0.36rem;
  margin: 0 0 0.08rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.contact__carousel-item-icon img {
  max-width: 100%;
  max-height: 100%;
}
.contact__carousel-item-number {
  color: #ba1cf7;
  font-weight: bold;
  font-size: 0.16rem;
  line-height: 0.14rem;
  text-align: center;
  text-overflow: ellipsis;
  overflow: hidden;
  margin: 0 0 0.04rem 0;
}
.contact__carousel-item-title {
  color: #ba1cf7;
  font-weight: bold;
  font-size: 0.16rem;
  line-height: 0.14rem;
  text-align: center;
  text-overflow: ellipsis;
  overflow: hidden;
}

.profile {
  height: 100vh;
  background: #ee00ff;
  background: linear-gradient(90deg, #ee00ff 0%, #ba1cf7 100%);
}
.profile__wrapper {
  width: 100%;
  height: 100%;
  min-height: 5.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  max-width: 6rem;
  margin: auto;
  position: relative;
  overflow: hidden;
}
@media (min-width: 1025px) {
  .profile__wrapper {
    max-width: 19.2rem;
  }
}
.profile__back {
  position: absolute;
  top: 0.8rem;
  left: 0.25rem;
  text-indent: -99999px;
  width: 0.2rem;
  height: 0.13rem;
  background-image: url(../static/images/icons/back.svg);
  background-repeat: no-repeat;
}
@media (min-width: 1025px) {
  .profile__back {
    position: absolute;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-left: -25%;
  }
}
.profile__uploader {
  width: 1.7rem;
  margin: 0.3rem auto;
  position: relative;
}
@media (min-width: 1025px) {
  .profile__uploader {
    margin: 0.7rem auto 0.3rem;
  }
}
.profile__uploader:before {
  content: url("../static/images/icons/camera.svg");
  background-color: #fff;
  width: 0.62rem;
  height: 0.62rem;
  display: block;
  position: absolute;
  right: 0.03rem;
  bottom: 0.03rem;
  border-radius: 99px;
  padding: 0.14rem;
  margin-top: 1px;
  box-sizing: border-box;
  border-radius: 99px;
}
.profile__picture {
  height: 1.5rem;
  width: 1.5rem;
  border-radius: 99px;
  margin: auto;
  background-size: cover;
}
.profile__title {
  font-size: 0.2rem;
  margin: 0;
  text-align: center;
  color: #fff;
  margin: 0 0 0.2rem;
  font-weight: 900;
}
.profile__title--upper {
  margin: 0.7rem 0 0 0;
}
.profile__status-wrapper {
  width: 3.3rem;
}
.profile__status-wrapper h5 {
  font-size: 0.18rem;
  margin: 0 0 0.38rem;
  text-align: center;
  color: #f9f15f;
  font-weight: 600;
}
.profile__status-bar {
  width: 100;
  height: 0.08rem;
  background-color: #fff;
  margin: 0 0 0.14rem 0;
  border-radius: 0.08rem;
}
.profile__status-bar--value {
  background-color: #f9f15f;
  height: 100%;
  border-radius: 0.08rem;
}
.profile__status-dates {
  display: flex;
  justify-content: space-between;
}
.profile__status-dates h6 {
  font-size: 0.16rem;
  margin: 0 0 0.12rem;
  text-align: center;
  color: #fff;
  font-weight: 400 !important;
}
.profile__status-dates h6:last-child {
  margin: 0;
}
.profile__status-dates--start {
  text-align: left !important;
}
.profile__status-dates--start strong {
  font-weight: bold !important;
}
.profile__status-dates--end {
  text-align: right !important;
}
.profile__status-dates--end strong {
  font-weight: bold !important;
}
.profile__form {
  margin: 0;
}
.profile__form .placelabel span {
  color: #fff;
}
.profile__form .fieldgroup--last {
  margin-bottom: 0.55rem;
}
.profile__form .fieldgroup--pin {
  width: 1.6rem;
  margin: 0 auto;
}
.profile__form .fieldgroup--pin input {
  text-align: center;
  padding-left: 0;
  padding-right: 0;
}
.profile__button {
  margin: 0.08rem 0 0 0;
}