/*
Trix 1.3.1
Copyright © 2020 Basecamp, LLC
http://trix-editor.org/*/
trix-editor {
  border: 1px solid #bbb;
  border-radius: 3px;
  margin: 0;
  padding: 0.4em 0.6em;
  min-height: 5em;
  outline: none; }
trix-toolbar * {
  box-sizing: border-box; }
trix-toolbar .trix-button-row {
  display: flex;
  flex-wrap: nowrap;
  justify-content: space-between;
  overflow-x: auto; }
trix-toolbar .trix-button-group {
  display: flex;
  margin-bottom: 10px;
  border: 1px solid #bbb;
  border-top-color: #ccc;
  border-bottom-color: #888;
  border-radius: 3px; }
  trix-toolbar .trix-button-group:not(:first-child) {
    margin-left: 1.5vw; }
    @media (max-device-width: 768px) {
      trix-toolbar .trix-button-group:not(:first-child) {
        margin-left: 0; } }
trix-toolbar .trix-button-group-spacer {
  flex-grow: 1; }
  @media (max-device-width: 768px) {
    trix-toolbar .trix-button-group-spacer {
      display: none; } }
trix-toolbar .trix-button {
  position: relative;
  float: left;
  color: rgba(0, 0, 0, 0.6);
  font-size: 0.75em;
  font-weight: 600;
  white-space: nowrap;
  padding: 0 0.5em;
  margin: 0;
  outline: none;
  border: none;
  border-bottom: 1px solid #ddd;
  border-radius: 0;
  background: transparent; }
  trix-toolbar .trix-button:not(:first-child) {
    border-left: 1px solid #ccc; }
  trix-toolbar .trix-button.trix-active {
    background: #cbeefa;
    color: black; }
  trix-toolbar .trix-button:not(:disabled) {
    cursor: pointer; }
  trix-toolbar .trix-button:disabled {
    color: rgba(0, 0, 0, 0.125); }
  @media (max-device-width: 768px) {
    trix-toolbar .trix-button {
      letter-spacing: -0.01em;
      padding: 0 0.3em; } }
trix-toolbar .trix-button--icon {
  font-size: inherit;
  width: 2.6em;
  height: 1.6em;
  max-width: calc(0.8em + 4vw);
  text-indent: -9999px; }
  @media (max-device-width: 768px) {
    trix-toolbar .trix-button--icon {
      height: 2em;
      max-width: calc(0.8em + 3.5vw); } }
  trix-toolbar .trix-button--icon::before {
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0.6;
    content: "";
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain; }
    @media (max-device-width: 768px) {
      trix-toolbar .trix-button--icon::before {
        right: 6%;
        left: 6%; } }
  trix-toolbar .trix-button--icon.trix-active::before {
    opacity: 1; }
  trix-toolbar .trix-button--icon:disabled::before {
    opacity: 0.125; }
trix-toolbar .trix-button--icon-attach::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M16.5%206v11.5a4%204%200%201%201-8%200V5a2.5%202.5%200%200%201%205%200v10.5a1%201%200%201%201-2%200V6H10v9.5a2.5%202.5%200%200%200%205%200V5a4%204%200%201%200-8%200v12.5a5.5%205.5%200%200%200%2011%200V6h-1.5z%22%2F%3E%3C%2Fsvg%3E);
  top: 8%;
  bottom: 4%; }
trix-toolbar .trix-button--icon-bold::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M15.6%2011.8c1-.7%201.6-1.8%201.6-2.8a4%204%200%200%200-4-4H7v14h7c2.1%200%203.7-1.7%203.7-3.8%200-1.5-.8-2.8-2.1-3.4zM10%207.5h3a1.5%201.5%200%201%201%200%203h-3v-3zm3.5%209H10v-3h3.5a1.5%201.5%200%201%201%200%203z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-italic::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M10%205v3h2.2l-3.4%208H6v3h8v-3h-2.2l3.4-8H18V5h-8z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-link::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M9.88%2013.7a4.3%204.3%200%200%201%200-6.07l3.37-3.37a4.26%204.26%200%200%201%206.07%200%204.3%204.3%200%200%201%200%206.06l-1.96%201.72a.91.91%200%201%201-1.3-1.3l1.97-1.71a2.46%202.46%200%200%200-3.48-3.48l-3.38%203.37a2.46%202.46%200%200%200%200%203.48.91.91%200%201%201-1.3%201.3z%22%2F%3E%3Cpath%20d%3D%22M4.25%2019.46a4.3%204.3%200%200%201%200-6.07l1.93-1.9a.91.91%200%201%201%201.3%201.3l-1.93%201.9a2.46%202.46%200%200%200%203.48%203.48l3.37-3.38c.96-.96.96-2.52%200-3.48a.91.91%200%201%201%201.3-1.3%204.3%204.3%200%200%201%200%206.07l-3.38%203.38a4.26%204.26%200%200%201-6.07%200z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-strike::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12.73%2014l.28.14c.26.15.45.3.57.44.12.14.18.3.18.5%200%20.3-.15.56-.44.75-.3.2-.76.3-1.39.3A13.52%2013.52%200%200%201%207%2014.95v3.37a10.64%2010.64%200%200%200%204.84.88c1.26%200%202.35-.19%203.28-.56.93-.37%201.64-.9%202.14-1.57s.74-1.45.74-2.32c0-.26-.02-.51-.06-.75h-5.21zm-5.5-4c-.08-.34-.12-.7-.12-1.1%200-1.29.52-2.3%201.58-3.02%201.05-.72%202.5-1.08%204.34-1.08%201.62%200%203.28.34%204.97%201l-1.3%202.93c-1.47-.6-2.73-.9-3.8-.9-.55%200-.96.08-1.2.26-.26.17-.38.38-.38.64%200%20.27.16.52.48.74.17.12.53.3%201.05.53H7.23zM3%2013h18v-2H3v2z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-quote::before {
  background-image: url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M6%2017h3l2-4V7H5v6h3zm8%200h3l2-4V7h-6v6h3z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-heading-1::before {
  background-image: url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12%209v3H9v7H6v-7H3V9h9zM8%204h14v3h-6v12h-3V7H8V4z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-code::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M18.2%2012L15%2015.2l1.4%201.4L21%2012l-4.6-4.6L15%208.8l3.2%203.2zM5.8%2012L9%208.8%207.6%207.4%203%2012l4.6%204.6L9%2015.2%205.8%2012z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-bullet-list::before {
  background-image: url(data:image/svg+xml,%3Csvg%20version%3D%221%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M4%204a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm0%206a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm0%206a2%202%200%201%200%200%204%202%202%200%200%200%200-4zm4%203h14v-2H8v2zm0-6h14v-2H8v2zm0-8v2h14V5H8z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-number-list::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M2%2017h2v.5H3v1h1v.5H2v1h3v-4H2v1zm1-9h1V4H2v1h1v3zm-1%203h1.8L2%2013.1v.9h3v-1H3.2L5%2010.9V10H2v1zm5-6v2h14V5H7zm0%2014h14v-2H7v2zm0-6h14v-2H7v2z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-undo::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M12.5%208c-2.6%200-5%201-6.9%202.6L2%207v9h9l-3.6-3.6A8%208%200%200%201%2020%2016l2.4-.8a10.5%2010.5%200%200%200-10-7.2z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-redo::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M18.4%2010.6a10.5%2010.5%200%200%200-16.9%204.6L4%2016a8%208%200%200%201%2012.7-3.6L13%2016h9V7l-3.6%203.6z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-decrease-nesting-level::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M3%2019h19v-2H3v2zm7-6h12v-2H10v2zm-8.3-.3l2.8%202.9L6%2014.2%204%2012l2-2-1.4-1.5L1%2012l.7.7zM3%205v2h19V5H3z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-button--icon-increase-nesting-level::before {
  background-image: url(data:image/svg+xml,%3Csvg%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%20width%3D%2224%22%20height%3D%2224%22%3E%3Cpath%20d%3D%22M3%2019h19v-2H3v2zm7-6h12v-2H10v2zm-6.9-1L1%2014.2l1.4%201.4L6%2012l-.7-.7-2.8-2.8L1%209.9%203.1%2012zM3%205v2h19V5H3z%22%2F%3E%3C%2Fsvg%3E); }
trix-toolbar .trix-dialogs {
  position: relative; }
trix-toolbar .trix-dialog {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  font-size: 0.75em;
  padding: 15px 10px;
  background: #fff;
  box-shadow: 0 0.3em 1em #ccc;
  border-top: 2px solid #888;
  border-radius: 5px;
  z-index: 5; }
trix-toolbar .trix-input--dialog {
  font-size: inherit;
  font-weight: normal;
  padding: 0.5em 0.8em;
  margin: 0 10px 0 0;
  border-radius: 3px;
  border: 1px solid #bbb;
  background-color: #fff;
  box-shadow: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none; }
  trix-toolbar .trix-input--dialog.validate:invalid {
    box-shadow: #F00 0px 0px 1.5px 1px; }
trix-toolbar .trix-button--dialog {
  font-size: inherit;
  padding: 0.5em;
  border-bottom: none; }
trix-toolbar .trix-dialog--link {
  max-width: 600px; }
trix-toolbar .trix-dialog__link-fields {
  display: flex;
  align-items: baseline; }
  trix-toolbar .trix-dialog__link-fields .trix-input {
    flex: 1; }
  trix-toolbar .trix-dialog__link-fields .trix-button-group {
    flex: 0 0 content;
    margin: 0; }
trix-editor [data-trix-mutable]:not(.attachment__caption-editor) {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none; }

trix-editor [data-trix-mutable]::-moz-selection,
trix-editor [data-trix-cursor-target]::-moz-selection, trix-editor [data-trix-mutable] ::-moz-selection {
  background: none; }
trix-editor [data-trix-mutable]::selection,
trix-editor [data-trix-cursor-target]::selection, trix-editor [data-trix-mutable] ::selection {
  background: none; }

trix-editor [data-trix-mutable].attachment__caption-editor:focus::-moz-selection {
  background: highlight; }
trix-editor [data-trix-mutable].attachment__caption-editor:focus::selection {
  background: highlight; }

trix-editor [data-trix-mutable].attachment.attachment--file {
  box-shadow: 0 0 0 2px highlight;
  border-color: transparent; }
trix-editor [data-trix-mutable].attachment img {
  box-shadow: 0 0 0 2px highlight; }
trix-editor .attachment {
  position: relative; }
  trix-editor .attachment:hover {
    cursor: default; }
trix-editor .attachment--preview .attachment__caption:hover {
  cursor: text; }
trix-editor .attachment__progress {
  position: absolute;
  z-index: 1;
  height: 20px;
  top: calc(50% - 10px);
  left: 5%;
  width: 90%;
  opacity: 0.9;
  transition: opacity 200ms ease-in; }
  trix-editor .attachment__progress[value="100"] {
    opacity: 0; }
trix-editor .attachment__caption-editor {
  display: inline-block;
  width: 100%;
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-family: inherit;
  line-height: inherit;
  color: inherit;
  text-align: center;
  vertical-align: top;
  border: none;
  outline: none;
  -webkit-appearance: none;
  -moz-appearance: none; }
trix-editor .attachment__toolbar {
  position: absolute;
  z-index: 1;
  top: -0.9em;
  left: 0;
  width: 100%;
  text-align: center; }
trix-editor .trix-button-group {
  display: inline-flex; }
trix-editor .trix-button {
  position: relative;
  float: left;
  color: #666;
  white-space: nowrap;
  font-size: 80%;
  padding: 0 0.8em;
  margin: 0;
  outline: none;
  border: none;
  border-radius: 0;
  background: transparent; }
  trix-editor .trix-button:not(:first-child) {
    border-left: 1px solid #ccc; }
  trix-editor .trix-button.trix-active {
    background: #cbeefa; }
  trix-editor .trix-button:not(:disabled) {
    cursor: pointer; }
trix-editor .trix-button--remove {
  text-indent: -9999px;
  display: inline-block;
  padding: 0;
  outline: none;
  width: 1.8em;
  height: 1.8em;
  line-height: 1.8em;
  border-radius: 50%;
  background-color: #fff;
  border: 2px solid highlight;
  box-shadow: 1px 1px 6px rgba(0, 0, 0, 0.25); }
  trix-editor .trix-button--remove::before {
    display: inline-block;
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    opacity: 0.7;
    content: "";
    background-image: url(data:image/svg+xml,%3Csvg%20height%3D%2224%22%20width%3D%2224%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M19%206.4L17.6%205%2012%2010.6%206.4%205%205%206.4l5.6%205.6L5%2017.6%206.4%2019l5.6-5.6%205.6%205.6%201.4-1.4-5.6-5.6z%22%2F%3E%3Cpath%20d%3D%22M0%200h24v24H0z%22%20fill%3D%22none%22%2F%3E%3C%2Fsvg%3E);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 90%; }
  trix-editor .trix-button--remove:hover {
    border-color: #333; }
    trix-editor .trix-button--remove:hover::before {
      opacity: 1; }
trix-editor .attachment__metadata-container {
  position: relative; }
trix-editor .attachment__metadata {
  position: absolute;
  left: 50%;
  top: 2em;
  transform: translate(-50%, 0);
  max-width: 90%;
  padding: 0.1em 0.6em;
  font-size: 0.8em;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 3px; }
  trix-editor .attachment__metadata .attachment__name {
    display: inline-block;
    max-width: 100%;
    vertical-align: bottom;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap; }
  trix-editor .attachment__metadata .attachment__size {
    margin-left: 0.2em;
    white-space: nowrap; }
@charset "UTF-8";
.trix-content {
  line-height: 1.5; }
  .trix-content * {
    box-sizing: border-box;
    margin: 0;
    padding: 0; }
  .trix-content h1 {
    font-size: 1.2em;
    line-height: 1.2; }
  .trix-content blockquote {
    border: 0 solid #ccc;
    border-left-width: 0.3em;
    margin-left: 0.3em;
    padding-left: 0.6em; }
  .trix-content [dir=rtl] blockquote,
  .trix-content blockquote[dir=rtl] {
    border-width: 0;
    border-right-width: 0.3em;
    margin-right: 0.3em;
    padding-right: 0.6em; }
  .trix-content li {
    margin-left: 1em; }
  .trix-content [dir=rtl] li {
    margin-right: 1em; }
  .trix-content pre {
    display: inline-block;
    width: 100%;
    vertical-align: top;
    font-family: monospace;
    font-size: 0.9em;
    padding: 0.5em;
    white-space: pre;
    background-color: #eee;
    overflow-x: auto; }
  .trix-content img {
    max-width: 100%;
    height: auto; }
  .trix-content .attachment {
    display: inline-block;
    position: relative;
    max-width: 100%; }
    .trix-content .attachment a {
      color: inherit;
      text-decoration: none; }
      .trix-content .attachment a:hover, .trix-content .attachment a:visited:hover {
        color: inherit; }
  .trix-content .attachment__caption {
    text-align: center; }
    .trix-content .attachment__caption .attachment__name + .attachment__size::before {
      content: ' · '; }
  .trix-content .attachment--preview {
    width: 100%;
    text-align: center; }
    .trix-content .attachment--preview .attachment__caption {
      color: #666;
      font-size: 0.9em;
      line-height: 1.2; }
  .trix-content .attachment--file {
    color: #333;
    line-height: 1;
    margin: 0 2px 2px 2px;
    padding: 0.4em 1em;
    border: 1px solid #bbb;
    border-radius: 5px; }
  .trix-content .attachment-gallery {
    display: flex;
    flex-wrap: wrap;
    position: relative; }
    .trix-content .attachment-gallery .attachment {
      flex: 1 0 33%;
      padding: 0 0.5em;
      max-width: 33%; }
    .trix-content .attachment-gallery.attachment-gallery--2 .attachment, .trix-content .attachment-gallery.attachment-gallery--4 .attachment {
      flex-basis: 50%;
      max-width: 50%; }
/*
 * Provides a drop-in pointer for the default Trix stylesheet that will format the toolbar and
 * the trix-editor content (whether displayed or under editing). Feel free to incorporate this
 * inclusion directly in any other asset bundle and remove this file.
 *

*/

/*
 * We need to override trix.css’s image gallery styles to accommodate the
 * <action-text-attachment> element we wrap around attachments. Otherwise,
 * images in galleries will be squished by the max-width: 33%; rule.
*/
.trix-content .attachment-gallery > action-text-attachment,
.trix-content .attachment-gallery > .attachment {
  flex: 1 0 33%;
  padding: 0 0.5em;
  max-width: 33%;
}

.trix-content .attachment-gallery.attachment-gallery--2 > action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--2 > .attachment, .trix-content .attachment-gallery.attachment-gallery--4 > action-text-attachment,
.trix-content .attachment-gallery.attachment-gallery--4 > .attachment {
  flex-basis: 50%;
  max-width: 50%;
}

.trix-content action-text-attachment .attachment {
  padding: 0 !important;
  max-width: 100% !important;
}
@tailwind base;
@tailwind components;
@tailwind utilities;

/* HEADER */
.rz_header {
  @apply w-full mt-3 z-[4] fixed px-3;
}
.rz_header .wrapper {
  @apply transition-all bg-[#222f33] rounded-t-none rounded-b-3xl p-8;
}
.rz_header_home .wrapper {
  @apply bg-transparent p-0 pt-8;
}
.rz_header_logo {
  @apply w-[230px] h-auto;
}

.rz_scrolled .wrapper {
  @apply bg-[#222f33] p-8;
}

/* NAV BAR */
.header__nav,
.header__nav ul {
  @apply flex w-auto;
}
.header__nav li {
  @apply mt-0 mb-0 ml-3 mr-3;
}
.header__nav li:first-child,
.header__nav li:nth-of-type(5) {
  @apply hidden;
}
.header__nav li a {
  @apply flex py-3 px-4 text-xl text-white;
}

.header__nav li.current--nav a,
.header__nav li:hover a {
  @apply text-[#2eb2ff];
}

.btn_buy_service {
  @apply py-3 px-4 text-xl text-white border-2 border-solid border-[#47e80e] rounded-full text-center;
}

/* RESPONSIVE NAV BUTTON */
.toggle_mobile_nav {
  @apply w-[32px] h-[44px] border-0 cursor-pointer rounded-full relative justify-center items-center;
}
.toggle_mobile_nav span {
  @apply flex w-full h-[3px] bg-white rounded-xl relative;
}
.toggle_mobile_nav span:before,
.toggle_mobile_nav span:after {
  content: "";
  @apply absolute flex w-full h-[3px] bg-white rounded-xl transition-all;
}
.toggle_mobile_nav span:before {
  @apply top-[-10px] w-1/2;
}
.toggle_mobile_nav span:after {
  @apply top-[10px] w-1/2 right-0;
}
.toggle_mobile_nav:hover span:before,
.toggle_mobile_nav:hover span:after {
  @apply w-full;
}

/* SOCIAL LINKS */
.social-icons {
  @apply flex flex-wrap justify-between items-center mt-8 mb-8;
}
.social-icons li {
  @apply w-1/4 py-0 px-2;
}
.social-icons li a {
  @apply w-[32px] h-[32px] block m-auto;
}
.social-ig {
  background: url(/icons/social-ig.svg) no-repeat center center;
  background-size: 44px 44px;
}
.social-fb {
  background: url(/icons/social-fb.svg) no-repeat center center;
  background-size: 44px 44px;
}
.social-in {
  background: url(/icons/social-in.svg) no-repeat center center;
  background-size: 38px 38px;
}
.social-yt {
  background: url(/icons/social-yt.svg) no-repeat center center;
  background-size: 48px 48px;
}

@media screen and (max-width: 1024px) {
  .header__nav li {
    @apply m-0;
  }
  .header__nav li a,
  .btn_buy_service {
    @apply text-sm;
  }
  header img {
    @apply mb-0;
  }
}
@media screen and (min-width: 801px) {
  .toggle_mobile_nav {
    @apply hidden;
  }
}
@media screen and (max-width: 800px) {
  .rz_header .wrapper {
    @apply py-8 px-3;
  }
  .header__nav > ul {
    @apply hidden;
  }
  .toggle_mobile_nav {
    @apply flex ml-3;
  }

  header img {
    @apply mb-0;
  }

  #nav-mobile .btn_buy_service {
    @apply border-[#30ade1] mb-5;
  }
}

@media screen and (max-width: 470px) {
  .rz_header_logo {
    @apply w-[150px];
  }
}

/* VIDEO BANNER */
#herobg {
  @apply relative overflow-hidden w-full min-h-full h-screen py-72 px-8 flex items-center justify-center;
}
.hero_overlay {
  @apply w-full h-full right-0 left-0 bottom-0 top-0 fixed z-[-1000];
}
.hero_overlay::before,
.hero_overlay::after {
  content: "";
  @apply top-0 bottom-0 left-0 right-0 fixed w-full h-full;
}
.hero_overlay::before {
  background: rgb(44, 60, 66);
  background: linear-gradient(
    100deg,
    rgba(44, 60, 66, 0.9345939059217437) 28%,
    rgba(44, 60, 66, 0) 100%
  );
  z-index: 1;
}
.hero_overlay::after {
  background: repeating-linear-gradient(
    130deg,
    #000,
    #606dbc 4px,
    #465298 5px,
    #465298 5px
  );
  z-index: 1;
  opacity: 0.05;
}
.hero_overlay video {
  position: fixed;
  left: calc(50% - 960px);
  min-width: 1920px;
  min-height: 100%;
  width: auto;
  height: auto;
}

.hero_content {
  @apply w-full z-[1] relative;
}

.rz-01,
.rz-02,
.rz-03 {
  @apply text-7xl text-white;
}
.rz-03 {
  @apply mb-11;
}

.rz-01 .letter,
.rz-02 .letter2,
.rz-03 .letter3 {
  @apply inline-block text-white;
  line-height: 0rem;
}
.btn-more-info {
  @apply border-2 border-solid border-[#47e80e] rounded-full text-white text-lg py-3 px-9 text-center transition-all opacity-0;
}
.btn-more-info.show-btn {
  @apply opacity-100;
}

.mousey {
  @apply absolute bottom-7 left-1/2 ml-[-16px] w-1 py-3 px-4 h-9 border-2 border-solid border-white opacity-95 rounded-3xl;
  box-sizing: content-box;
}
.scroller {
  @apply w-1 h-3 rounded-[25%] bg-white;
  animation-name: scroll;
  animation-duration: 1.2s;
  animation-timing-function: cubic-bezier(0.15, 0.41, 0.69, 0.94);
  animation-iteration-count: infinite;
}
@keyframes scroll {
  0% {
    opacity: 0;
  }
  10% {
    transform: translateY(0);
    opacity: 1;
  }
  100% {
    transform: translateY(15px);
    opacity: 0;
  }
}
@media screen and (max-width: 980px) {
  .rz-01,
  .rz-02,
  .rz-03 {
    @apply text-5xl;
  }
}

@media screen and (max-width: 645px) {
  .rz-01,
  .rz-02,
  .rz-03 {
    @apply text-4xl;
  }
}

@media screen and (max-width: 440px) {
  .rz-01 {
    @apply w-[150px];
  }
  .rz-02 {
    @apply w-[232px];
  }
}

/* HOME RAZONET AWARDS */
#rz_awards {
  @apply bg-[#2a3d42] py-11 px-8;
}
#rz_awards .wrapper {
  @apply items-center;
}
.rz_column_text {
  @apply w-[62%] pr-8;
}
.rz_column_text h1 {
  @apply font-semibold text-4xl mb-4;
  line-height: 95%;
}
.rz_column_text a {
  @apply text-white text-2xl;
}
.rz_column_text a:hover {
  @apply text-[#2eb2ff];
}
.rz_column_awards {
  @apply w-[38%] flex items-center justify-between;
}
.rz_column_awards figure {
  @apply w-1/2 p-3 flex;
}
.rz_column_awards img {
  filter: brightness(0) invert(1);
}

@media screen and (max-width: 800px) {
  .rz_column_awards {
    @apply hidden;
  }
  .rz_column_text {
    @apply pr-0 w-full justify-center items-center text-center;
  }
  .rz_column_text h1 {
    @apply text-3xl;
    line-height: 100%;
  }
  .rz_column_text a {
    @apply text-xl;
  }
}

/* REASONS RAZONET */
#rz_reasons .wrapper {
  @apply flex items-center justify-between;
}
.rz_reasons_caption {
  @apply flex w-[40%];
}
.rz_reasons_caption h1 {
  @apply text-[#222f33] text-7xl;
  line-height: 100%;
}
.rz_reasons_items {
  @apply flex w-[54%];
}

.rz_list_items li {
  @apply mt-4 rounded-xl border-2 border-[#222f33] border-solid flex p-3 w-full items-center text-lg;
}
.rz_list_items li span {
  @apply text-[#222f33];
}
.rz_list_items li figure {
  @apply min-w-[72px] inline-block mr-4 min-h-[72px];
}

@media screen and (max-width: 860px) {
  #rz_reasons .wrapper {
    @apply flex-col;
  }
  .rz_reasons_caption,
  .rz_reasons_items {
    @apply w-full;
  }

  .rz_reasons_caption h1 {
    @apply text-6xl mb-8 text-center;
  }
}

@media screen and (max-width: 480px) {
  .rz_reasons_caption h1 {
    @apply text-3xl;
  }
  .rz_list_items li {
    @apply flex flex-col text-center;
  }
  .rz_list_items li figure {
    @apply mr-0;
  }
}

/* ABOUT PLANS & ABOUT US  */
#tab_group {
  @apply m-auto;
}
.tab_group_list {
  @apply flex pl-6 pr-6;
  border-bottom: 1px solid #30ade1;
}

.tab_list_item {
  margin-bottom: -2px;
}
.tab_list_item button {
  border: 1px solid transparent;

  font-size: var(--size-5);
  color: var(--second-color);
  font-weight: bold;
  line-height: 105%;
  padding: 16px 32px;

  outline: none;
  cursor: pointer;
  transition: 0.3s;
}

.tab_list_item button:hover {
  color: var(--primary-color);
}

.tab_list_item button.active {
  border-top-left-radius: 6px;
  border-top-right-radius: 6px;
  border: 1px solid #30ade1;
  border-bottom: 0px;

  background: var(--primary-color);
  color: #fff;
}

.tabcontent {
  display: none;
  animation: fadeEffect 1s;
  overflow: hidden;
}

/* Go from zero to full opacity */
@keyframes fadeEffect {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

@media screen and (max-width: 540px) {
  .tab_group_list {
    @apply pl-0 pr-0;
  }
  .tab_list_item button {
    font-size: var(--size-3);
    padding: 8px 12px;
  }
}

@media screen and (max-width: 340px) {
  .tab_list_item button {
    font-size: var(--size-2);
    padding: 5px;
  }
}

#about_plans,
#about_us,
#about_security {
  @apply pt-24 pb-24;
  background-color: var(--fiveth-color);
}

#about_plans {
  padding-bottom: 0px;
}

.about__content,
.about__image {
  width: 48%;
}

.about__content {
  @apply pr-16 flex flex-col;
}

.about__content p {
  @apply mb-5 flex-1;
}

.about__content .btn {
  @apply mt-5;
}

.about__content .about__content__confiance {
  color: var(--fourth-color);
  font-weight: 600;
  @apply mb-3 flex;
}

@media screen and (max-width: 940px) {
  .about__content .main__title {
    font-size: var(--size-6);
  }

  .about__content {
    @apply pr-16;
  }
}

@media screen and (max-width: 720px) {
  .about__content {
    @apply w-full pr-0 text-center;
  }

  .about__image {
    @apply w-full mt-10;
  }

  .about__content .about__content__confiance {
    @apply m-auto mb-3 text-center;
  }

  /* .about__image { @apply hidden; } */
}

/* PLANS LIST */
#plans_list {
  background-color: var(--fiveth-color);
}

.plans__legend {
  @apply m-auto text-center;
}

.plans__list {
  @apply justify-between flex flex-wrap mt-10 w-fit m-auto;
}

.plans__card {
  @apply flex flex-col py-10 px-10;
  @apply content-between justify-between;
  border-radius: 14px;
  background-color: var(--light-color);
}

.plans__card__header {
  @apply mb-8;
}

.plans__card__legend {
  @apply flex m-auto mt-4 mb-4 justify-center text-center;
  font-size: var(--size-1);
  font-weight: 600;
  color: var(--third-color);
}

.plans__card__price {
  @apply flex m-auto mt-2 mb-6 justify-center;
  font-size: var(--size-6);
  font-weight: 700;
  color: var(--primary-color);
}

.plans__card__modules {
  @apply flex flex-col;
}

.plans__card__modules li {
  width: 100%;
  @apply flex items-center mb-1;
  font-size: var(--size-2);
  color: var(--fourth-color);
}

.plans__card__modules li:before {
  content: "";
  width: 6px;
  height: 6px;
  background: var(--fourth-color);
  margin-right: 12px;
  border-radius: 50%;
}

.plans__card__footer small {
  @apply mb-4 text-left;
  color: var(--fourth-color);
}

.plans__mei {
  @apply mt-16;
  width: 66.66%;
}

.plans__alone {
  @apply mt-16;
  width: 32%;
}

.plans__list--simples .plans__card {
  width: 32%;
}

.plans__list--mei .plans__card {
  width: 49%;
}

.plans__list--alone {
  min-height: 558px;
}

.plans__list--alone .plans__card__legend {
  font-size: var(--size-3);
  @apply mt-6 mb-8;
}

.plans__list--alone .plans__card__modules li {
  @apply flex flex-col relative pl-4;
}

.plans__list--alone .plans__card__modules li:before {
  @apply absolute left-0 top-2;
}

.plans__list--alone .plans__card__modules li span,
.plans__list--alone .plans__card__modules li small {
  @apply flex w-full;
  text-align: left;
}

.plan_more {
  margin: 0 auto;
  margin-top: 12px;
  width: auto !important;
  text-align: center;
  color: var(--primary-color);
}

/* tooltip plans */
.tooltip {
  @apply relative inline-block ml-1 mr-0;
}

.tooltip .tooltip__text {
  @apply text-center p-3 absolute;
  visibility: hidden;
  width: 240px;
  background-color: rgba(1, 1, 1, 0.9);
  color: #fff;
  border-radius: 6px;
  z-index: 1;
  bottom: 100%;
  left: 50%;
  margin-left: -130px; /* Use half of the width (120/2 = 60), to center the tooltip */
  margin-bottom: 5px;
  font-size: 14px;
  line-height: 20px;
}

.tooltip:hover .tooltip__text {
  @apply visible;
}

/* NEW PLANS LIST */
.plans__list__modules li {
  position: relative;
  padding-left: 16px;
  margin-bottom: 4px;
  align-items: center;
}

.plans__list__modules span {
  color: var(--fourth-color);
  font-size: var(--size-1);
}

.tooltip--flag {
  display: inline-flex;
  width: 18px;
  height: 22px;
  background: url(/src/help.webp) no-repeat center top 5px;
}

.tooltip--text {
  @apply text-center p-3 absolute;
  visibility: hidden;
  width: 100%;
  background-color: rgba(1, 1, 1, 0.9);
  color: #fff;
  border-radius: 6px;
  z-index: 1;
  bottom: 100%;
  font-size: 14px;
  line-height: 20px;
  position: absolute;
  left: 0%;
  bottom: 25px;
}

.plans__list__modules li:hover .tooltip--text {
  @apply visible;
}

.plans__list__modules li:before {
  position: absolute;
  left: 0px;
  top: 12px;
  background: var(--primary-color);
  border-radius: 50%;
  content: "";
  height: 6px;
  margin-right: 12px;
  width: 6px;
  display: block;
}

.btn-outline-blue.btn-black-text {
  color: #222f33;
}

/* END NEW PLANS LIST */

@media screen and (max-width: 940px) {
  .plans__list--alone .plans__card,
  .plans__list--mei .plans__card,
  .plans__list--simples .plans__card {
    width: 100%;
  }

  .plans__card {
    @apply mb-6;
  }

  .plans__card__modules {
    @apply m-auto w-fit;
  }

  .plans__list--alone {
    @apply w-full mt-10;
  }

  .plans__mei,
  .plans__alone {
    @apply w-full;
  }

  .plans__alone {
    @apply mt-10;
  }

  .plans__alone .plans__card__modules li {
    @apply w-full;
  }

  .plans__alone .plans__card {
    @apply w-full;
  }

  .plans__alone .plans__card__modules {
    @apply w-full flex flex-wrap;
  }

  .plans__list__modules {
    margin: 0 auto;
    width: fit-content;
  }

  .plans__card__footer small {
    text-align: center;
  }
}

@media screen and (max-width: 720px) {
  .plans__card {
    padding: 1.5rem;
  }

  .plans__mei .plans__card {
    @apply w-full;
  }

  .plans__alone .plans__card__modules li {
    @apply w-full pr-0 text-center;
  }
}

.plans__wrapper--button {
  @apply mt-16;
}

.plans__wrapper--button .btn {
  @apply w-full;
}

/* SIMULATOR */
.simulator {
  @apply bg-[#f9f9f9];
}

.simulator .wrapper {
  @apply flex flex-wrap justify-between;
}
.simulator__picture {
  @apply overflow-hidden rounded-xl;
}
.simulator__picture,
.simulator__card {
  @apply w-1/2;
}

.simulator__card {
  @apply flex flex-col pl-12;
}

.simulator .main__title {
  @apply mb-8;
  color: var(--primary-color);
}
.simulator .big__title {
  @apply mb-12;
  font-weight: normal;
  font-size: var(--size-5);
  line-height: 110%;
  color: var(--second-color);
}
@media screen and (max-width: 940px) {
  .simulator {
    text-align: center;
    padding: 120px 100px;
  }
  .simulator__card {
    @apply w-full pl-0 pr-0;
  }

  .simulator__picture {
    display: none;
  }
}

@media screen and (max-width: 720px) {
  .simulator {
    padding: 60px 32px;
  }
}

@media screen and (max-width: 599px) {
  .simulator_card #modalSimuladorActivator {
    font-size: 12px;
  }
}

/* TESTIMONIALS */
#testimonial-slider {
  @apply mt-10 mb-16;
}

#testimonial-slider .swiper-slide {
  @apply flex flex-wrap justify-between;
}

.testimonials__swiper__image {
  width: 30%;
  display: flex;
  align-items: center;
}

.testimonials__swiper__image img {
  @apply m-auto flex overflow-hidden;
  max-width: 160px;
  max-height: 160px;
  border-radius: 50%;
}

.testimonials__swiper__description {
  @apply pt-14 flex flex-col;
  background: url(/src/quote.png) no-repeat left top;
  width: 70%;
  padding-right: 100px;
}

.testimonials__swiper__description p {
  font-size: var(--size-4);
}

.testimonial__author {
  @apply mt-5;
  color: var(--fourth-color);
}

.swiper-button-next,
.swiper-button-prev {
  width: auto;
}

.swiper-button-prev:after {
  content: "";
  width: 32px;
  height: 32px;
  background: url(/icons/prev.png) no-repeat center center;
}

.swiper-button-next:after {
  content: "";
  width: 32px;
  height: 32px;
  background: url(/icons/next.png) no-repeat center center;
}

@media screen and (max-width: 800px) {
  #testimonial-slider .swiper-slide {
    @apply flex-col;
  }

  .testimonials__swiper__image,
  .testimonials__swiper__description {
    width: 100%;
    text-align: center;
  }

  .testimonials__swiper__description {
    background: none;
    @apply pl-6 pr-6;
  }

  .testimonials__swiper__description p {
    font-size: var(--size-2);
  }
}

/* MOVIES TESTIMONIALS */
#movies_testimonials {
  background: var(--fiveth-color);
}

.movies_testimonials .main__title {
  @apply mb-14;
}

.movies__testemunials__wrap {
  @apply flex flex-wrap justify-between list-none mb-14;
}

.movies__wrap__item {
  width: 49%;
}

.movies__wrap__item iframe {
  border-radius: 10px;
  overflow: hidden;
}

.movies__icons--details {
  position: relative;
}
.movies__icons--details:nth-of-type(1):before {
  content: "";
  width: 260px;
  height: 188px;
  display: block;

  background: url(/icons/detail_video_left.svg) no-repeat center center;
  background-size: 100%;

  position: absolute;
  left: -200px;
  top: -110px;
}
.movies__icons--details:nth-of-type(2):before {
  content: "";
  width: 210px;
  height: 208px;
  display: block;

  background: url(/icons/detail_video_right.svg) no-repeat center center;
  background-size: 100%;

  position: absolute;
  right: -240px;
  bottom: 70px;
}

@media screen and (max-width: 1670px) {
  .movies__icons--details:nth-of-type(1):before,
  .movies__icons--details:nth-of-type(2):before {
    display: none;
  }
}

.movies__wrap__item .link {
  @apply flex mt-4 pt-2 pb-2 pl-9;
  background: url(/icons/arrow_blue.png) no-repeat left center;
  font-size: var(--size-1);
  color: var(--second-color);
  font-weight: 500;
  line-height: 20px;
  text-transform: uppercase;
}

.movies__wrap__item .link:hover {
  color: var(--primary-color);
}

@media screen and (max-width: 720px) {
  .movies__wrap__item {
    width: 100%;
    margin-bottom: 32px;
  }
}

/* DEMONSTRATION VIDEO */
#demonstration_video {
  background: #2a3d42 url(/src/mobile_app.png) no-repeat center right 30%;
  background-size: contain;
}
#demonstration_video .main__title {
  @apply text-white mb-10;
}
#demonstration_video .big__title {
  @apply text-white mb-10;
}

.demonstration__legend {
  @apply text-white hover:text-[#2eb2ff] text-base mt-10;
}

.app_store_options {
  @apply flex justify-between max-w-[500px] mt-8 mb-16;
}
.app_store_options li {
  @apply w-1/2 flex items-center pr-3 flex-1;
}
.app_store_options li a {
  @apply flex flex-1 items-center py-3 px-5 rounded-full border-2 border-solid border-[#2eb2ff] justify-center font-medium text-xl text-[#2eb2ff];
  @apply hover:text-white hover:border-[#47e80e];
}
.fab {
  transition: all 0.2s;
  color: #2eb2ff !important;
}
.app_store_options li:hover .fab {
  color: #fff !important;
}
.article_text {
  @apply w-1/2 p-8;
}

@media screen and (max-width: 1100px) {
  #demonstration_video {
    background-position: center right -150px;
    background-size: 106%;
  }
}

@media screen and (max-width: 956px) {
  #demonstration_video {
    background-image: none;
    text-align: center;
  }
  .article_text {
    @apply w-full p-0;
  }
  .app_store_options {
    @apply m-auto mt-5 mb-8;
  }
}

@media screen and (max-width: 490px) {
  .app_store_options {
    @apply flex-col;
  }
  .app_store_options li {
    @apply w-full mt-1 pr-0;
  }
}

/* PROFESSIONS SLIDER */
#professions_razonet {
  @apply px-0;
  background: var(--fiveth-color);
}

#professions_razonet .wrapper {
  padding-left: 24px;
  padding-right: 24px;
}

#professions_razonet #perfis {
  min-height: 70px;
  display: block;
}

#slider-professions .swiper-slide {
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

/* STEPS RAZONET */
.steps__list {
  @apply flex flex-wrap justify-between mt-8 mb-10;
}

.steps__item {
  width: 30%;
  @apply flex flex-col items-center;
}

.steps__item__icon {
  @apply mt-2 mb-2;
}

.steps__item--number {
  font-size: var(--size-10);
  font-weight: 500;
}

.steps__item--title {
  font-size: var(--size-5);
  @apply mb-2;
}

@media screen and (max-width: 940px) {
  .steps__item__icon img {
    max-height: 96px;
  }

  .steps__item--number {
    font-size: var(--size-7);
  }
}

@media screen and (max-width: 720px) {
  .steps__item {
    width: 100%;
    margin-bottom: 32px;
  }

  .steps__item__icon img {
    max-height: 96px;
  }

  .steps__item--number {
    font-size: var(--size-7);
  }
}

/* INDICATIONS */
#indications {
  @apply bg-[#1a2427];
}
#indications .legend_infos,
#indications .legend__infos strong,
#indications .main__title {
  color: #fff !important;
}
.indication__steps {
  @apply flex flex-wrap justify-between;
}
.indication__steps--item {
  width: 30%;
  @apply text-center justify-center flex flex-col;
}
.indication__steps--figure {
  @apply mx-auto w-48 flex mb-3;
}
.indication__steps--label {
  font-size: var(--size-4);
  font-weight: bold;
  @apply flex py-1 px-1;
  color: var(--primary-color);
  @apply w-fit mx-auto mb-3;
}

.indication__steps--legend {
  font-size: var(--size-3);
  @apply text-white;
  @apply text-center justify-center;
}

.indication__footer {
  @apply mx-auto mt-16 w-fit flex flex-col pr-20;
  font-size: var(--size-5);
  font-weight: bold;
  background: url(/../icons/icon-05.svg) no-repeat right center;
  background-size: 76px;
}

@media screen and (max-width: 750px) {
  .indication__steps--item {
    @apply w-full;
  }
  .indication__footer p {
    @apply text-center;
    font-size: var(--size-2);
  }
  .indication__footer {
    background: none;
    @apply pr-0;
  }
}

/* ABOUT PRESENCE */
#about_presence {
  background: var(--fiveth-color) url(/src/mapa.webp) no-repeat left center;
  background-size: 650px;
  padding-top: 164px;
  padding-bottom: 164px;
}

.about_presence .wrapper {
  @apply justify-end;
}

@media screen and (max-width: 940px) {
  #about_presence {
    background-size: 430px;
    padding-top: 84px;
    padding-bottom: 84px;
  }
}

/* GUIDELINES */
.diretriz__item--size {
  width: 122px;
  margin-bottom: 16px;
}
.diretriz__item--size img {
  margin: 0 auto;
}

/* PARTNERSHIP */
#partnerships {
  @apply py-24;
}

#partner-slider {
  @apply mt-6;
}

#partner-slider .swiper-slide {
  @apply flex flex-col py-4 px-4;
  border-radius: 10px;
  background: #fff;
  border: 1px solid #eee;
  box-shadow: 0px 8px 16px rgb(0 0 0 / 5%);
}

#partner-slider .swiper-slide figure {
  @apply flex text-center mb-3;
  min-height: 96px;
}

#partner-slider .swiper-slide img {
  @apply m-auto;
  max-width: 164px;
}

#partner-slider .swiper-slide span {
  font-size: var(--size-2);
  font-weight: 600;
  color: var(--fourth-color);
  text-align: center;
}
#partner-slider {
  position: relative;
}
#partner-slider .swiper-pagination {
  bottom: -60px;
}
#partner-slider .swiper-pagination span {
  width: 12px;
  height: 12px;
}

/* FREQUENTLY ASKED QUESTIONS */
.faq .main__title {
  @apply mb-4;
}

.faq__list {
  @apply mt-10 mb-10;
}

.faq__list__item {
  @apply flex-1 mb-6 pb-4 cursor-pointer;
  border-bottom: 1px solid #ddd;
}

.faq__list__item:last-child {
  border-bottom: 0px;
}

.faq__list__item summary {
  @apply mb-2;
}

.faq__list__item[open] summary {
  font-weight: 600;
}

/* CONTACTS */
.contacts {
  background: var(--fiveth-color);
}

.contacts__list {
  @apply mt-12 flex flex-wrap justify-between;
}

.contacts__card {
  width: 49%;
  @apply flex flex-col py-10 px-12;
  @apply content-between justify-between;
  border-radius: 14px;
  background-color: var(--light-color);
}

.contacts__card h1 {
  font-size: var(--size-6);
  font-weight: 700;
  text-align: center;
  @apply mb-3;
}

.contacts__card .icon__contact {
  margin: 0 auto;
  width: 104px;
  height: 104px;
  display: block;
  @apply mb-6;
}

.icon--whatsapp {
  background: url(/icons/message-whats.png) no-repeat center center;
}

.icon--email {
  background: url(/icons/message-email.png) no-repeat center center;
}

.contact__observation {
  font-size: var(--size-1);
  color: var(--fourth-color);
  text-align: center;
  min-height: 44px;
  @apply mb-6;
}

@media screen and (max-width: 940px) {
  .contacts__card {
    width: 100%;
    margin-bottom: 24px;
  }

  .contacts__card:nth-of-type(1) .contact__observation {
    display: none;
  }
}

/* FOOTER */
.footer {
  background: var(--primary-color);
  @apply w-full px-5;
}

.footer__first__content {
  @apply flex flex-wrap justify-between items-center pt-16 pb-16;
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

.footer__nav {
  @apply flex w-auto;
}

.footer__nav ul {
  @apply flex;
}

.footer__nav li:first-child {
  @apply hidden;
}

.footer__nav li {
  padding-right: 12px;
}

.footer__nav li:last-child {
  padding-right: 0px;
}

.footer__nav li:after {
  content: "";
  margin-right: -8px;
  width: 6px;
  height: 6px;
  display: block;
  background: url(/icons/separator.png) no-repeat center center;
  margin-top: -22px;
  float: right;
}

.footer__nav li:last-child:after {
  display: none;
}

.footer__nav li a {
  @apply flex py-2 px-2;
  font-size: var(--size-1);
  color: #fff;
}

@media screen and (max-width: 780px) {
  .footer__first__content {
    @apply pt-8 pb-8;
  }

  .footer__logo {
    display: none;
  }
}

@media screen and (max-width: 1056px) {
  .footer__first__content {
    @apply flex-col;
  }

  .footer__nav {
    display: none;
  }

  .footer__social__networks {
    margin: 0 auto;
  }
}

.footer__social__networks li {
  margin: 0px 2px;
}

.footer__social__networks li a {
  width: 25px;
  height: 25px;
  display: flex;
}

.social__networks--linkedin {
  background: url(/icons/social-linkedin.png) no-repeat center center;
}

.social__networks--facebook {
  background: url(/icons/social-facebook.png) no-repeat center center;
}

.social__networks--instagram {
  background: url(/icons/social-instagram.png) no-repeat center center;
}

.social__networks--youtube {
  background: url(/icons/social-youtube.png) no-repeat center center;
}

.footer__second__content {
  @apply flex flex-wrap justify-between items-center pt-16 pb-16;
}

.footer__politics__links {
  @apply flex;
}

.footer__politics__links li {
  margin-right: 18px;
}

.footer__politics__links li a {
  font-size: var(--size-1);
  color: #fff;
}

.footer__copyright,
.footer__crcs {
  font-size: var(--size-1);
  color: #fff;
}

@media screen and (max-width: 1056px) {
  .footer__second__content {
    @apply flex-col pt-8 pb-8;
  }

  .footer__copyright {
    @apply text-center;
  }
}

@media screen and (max-width: 610px) {
  .footer__politics__links {
    @apply flex-col text-center;
  }

  .footer__copyright {
    @apply mt-6;
  }
}

/* ABOUT US PAGE */
.header_about {
  @apply pt-52 pb-24 bg-[url(/src/background_about.webp)] bg-center bg-no-repeat bg-cover;
}
.header_about .main__title,
.header_about span {
  @apply text-white max-w-[700px] m-auto;
}
.header_about .main__title {
  @apply font-medium mb-6;
}
.header_about span {
  font-size: var(--size-4);
}
.experiences_razonet {
  @apply pt-24 pb-24;
}
.experiences_razonet .steps__item__icon {
  @apply mb-6;
}
.experiences_razonet .steps__item span a {
  color: var(--primary-color);
}

/* AWARDS SECTION */
.award_item {
  width: 32%;
  @apply mb-16 flex flex-col;
}
.award_short_title {
  color: var(--fourth-color);
  font-size: var(--size-2);
  font-weight: 600;
  @apply mb-4;
}
.award_title {
  font-size: var(--size-7);
  font-weight: 700;
  line-height: 100%;
  color: #222f33;
  @apply mb-4;
}
.award_picture {
  border-radius: 10px;
  border: 5px solid var(--primary-color);
  padding: 32px 24px;
  display: flex;
  justify-content: center;
  @apply mb-4;
}
.award_picture img {
  filter: grayscale(100%) opacity(100%);
  transition-duration: 0.2s;
}
.award_item:hover .award_picture img {
  filter: grayscale(0%) opacity(100%);
}

@media screen and (max-width: 940px) {
  .award_item {
    width: 48%;
  }
  .award_title {
    font-size: var(--size-6);
  }
}

@media screen and (max-width: 768px) {
  .award_item {
    width: 100%;
  }
}

.work__item {
  width: 40%;
  @apply flex flex-col;
}

.work__item--legend {
  font-size: var(--size-2);
  font-weight: 600;
  color: var(--fourth-color);
  margin-bottom: 12px;
}

.work__item--description {
  margin-bottom: 24px;
}

@media screen and (max-width: 720px) {
  .work__item {
    width: 100%;
    margin-bottom: 64px;
    text-align: center;
  }

  .work__item--image img {
    margin: 0 auto;
  }
}

#colabs {
  padding-top: 0px;
}

.colabs__content {
  @apply flex flex-col px-16 py-16;
  width: 36%;
  border-radius: 25px;
  background: var(--second-color);
}

.colabs__content--legend {
  font-size: var(--size-2);
  font-weight: 600;
  color: var(--fiveth-color);
  margin-bottom: 12px;
}

.colabs__content .main__title {
  color: var(--fiveth-color);
}

.colabs__content--description {
  color: var(--fiveth-color);
}

.colabs__image {
  @apply flex;
  border-radius: 25px;
  width: 62%;

  background: url(/src/razoteam.webp) no-repeat center center;
  background-size: cover;
}

@media screen and (max-width: 1024px) {
  .colabs__content,
  .colabs__image {
    width: 48%;
  }
}

@media screen and (max-width: 940px) {
  #colabs {
    padding-left: 0px;
    padding-right: 0px;
  }

  .colabs__content,
  .colabs__image {
    width: 100%;
    border-radius: 0px;
  }

  .colabs__image {
    min-height: 350px;
  }
}

#onmedia {
  background: var(--fiveth-color);
}

.onmedia__list {
  @apply flex flex-wrap items-center;
}

.onmedia__list li {
  width: 33.33%;
  padding: 1.5%;
  transition-duration: 0.2s;
  filter: grayscale(100%) opacity(50%);
}

.onmedia__list li:hover {
  filter: grayscale(0%) opacity(100%);
}

@media screen and (max-width: 720px) {
  .onmedia__list li {
    width: 50%;
  }
}

@media screen and (max-width: 460px) {
  .onmedia__list li {
    width: 100%;
  }
}

.articles__list {
  display: flex;
  flex-wrap: wrap;
  margin-top: 32px;
  margin-bottom: 72px;
}

.articles__list__item {
  width: 33.33%;
  padding: 10px;
}

.articles__list__item a {
  display: flex;
  padding: 68px 24px;
  flex-direction: column;
  text-align: center;
  align-items: center;
  background: #777;
  border-radius: 15px;
}

.article__item--title {
  font-size: var(--size-5);
  color: var(--fiveth-color);
}

.article__item--subtitle {
  color: var(--fiveth-color);
}

@media screen and (max-width: 940px) {
  .articles__list__item {
    width: 100%;
    margin-bottom: 32px;
  }

  .articles__list__item:last-child {
    margin-bottom: 0px;
  }
}

/* POLICIES AND TERMS */
.policies_terms {
  padding-top: 190px;
}
.policies_terms table {
  width: 100%;
}

@media screen and (max-width: 720px) {
  .policies_terms {
    padding-top: 168px;
  }
}

.policies_terms .main__title {
  margin-bottom: 32px;
}

.policies__content p {
  margin-bottom: 16px;
}

/* BLOG */
#blog {
  @apply pt-52 pb-24;
  background-color: var(--fiveth-color);
}

.current__post {
  @apply flex flex-wrap justify-between items-center mt-12;
}

.current__post__image,
.current__post__content {
  width: 48%;
  display: flex;
  flex-direction: column;
}

.current__post__image img {
  border-radius: 10px;
}

.current__post__statistic {
  font-size: var(--size-3);
  color: var(--fourth-color);
  @apply mb-6;
}

.current__post__tags {
  @apply flex flex-wrap;
}

.current__post__tags a {
  @apply flex py-2 px-2 mr-2 mb-2;
  font-size: 10px;
  color: var(--primary-color);
  border: 1px solid var(--primary-color);
  border-radius: 20px;
}

@media screen and (max-width: 880px) {
  .current__post {
    @apply flex-col;
  }

  .current__post__image,
  .current__post__content {
    width: 100%;
  }

  .current__post__image {
    @apply mb-6;
  }
}

#blog__header {
  background: var(--fiveth-color);
  @apply pt-40 pb-10;
}

.blog__header__categories {
  @apply pt-14 pb-9 mb-12;
  background: var(--fiveth-color);
}

.recent_article {
  @apply pt-24 pb-24;
}

.recent__articles__list {
  @apply mb-6 flex flex-wrap;
}

.recent__article__item {
  width: 31%;
  border: 1px solid #ddd;
  border-radius: 15px;
  overflow: hidden;
  height: auto;
}

.recent__article__item:nth-of-type(3n + 2) {
  margin-right: 3.5%;
  margin-left: 3.5%;
}

.recent__article__item {
  @apply mb-8;
}

.recent__article__item a {
  @apply flex;
}

.recent__article__item figure {
  @apply mb-6;
}

.recent__article__item h1 {
  @apply px-6;
}

.recent__article__item span {
  @apply px-6 mb-6 flex;
}

.recent__article__item .current__post__tags {
  @apply px-6;
}

@media screen and (max-width: 940px) {
  #blog__header {
    @apply pt-36 pb-6;
  }

  .recent__articles__list {
    @apply justify-between;
  }

  .recent__article__item {
    width: 48%;
  }

  .recent__article__item:nth-of-type(3n + 2) {
    margin-right: 0%;
    margin-left: 0%;
  }
}

@media screen and (max-width: 720px) {
  #blog__header {
    @apply pt-28 pb-10;
    justify-content: center;
    text-align: center;
  }

  #blog__header h1 {
    margin: 0 auto;
  }

  .recent__article__item {
    width: 100%;
  }
}

.article_post {
  @apply relative pt-52 pb-24;
}

.article_post:before {
  content: "";
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  display: block;
  width: 100%;
  height: 450px;
  background: var(--fiveth-color);
}

@media screen and (max-width: 460px) {
  .article_post:before {
    height: 320px;
  }
}

.article_post .wrapper {
  max-width: 1000px;
  position: relative;
  z-index: 2;
}

.article__post__legend {
  border-top: 1px solid #cfcfcf;
  font-size: var(--size-1);
  color: var(--fourth-color);
  font-weight: 600;
  @apply mt-3 pt-3 mb-6;
}

.article__post__image {
  overflow: hidden;
  border-radius: 15px;
  margin-bottom: 32px;
}

.article__post__image img {
  width: 100%;
}

.article__post__text {
  @apply mb-9;
}

.article__post__text p,
.article__post__text div {
  margin-bottom: 16px;
}

.article__post__text ul,
.article__post__text ol {
  margin-top: 16px;
  margin-bottom: 16px;
}

.article__post__text ul li {
  list-style-type: disc;
  margin-left: 50px;
}

.article__post__text ol li {
  list-style: decimal;
  margin-left: 50px;
}

.article__post__text blockquote {
  background: #eee;
  margin: 10px 0px;
  padding: 5px 10px 5px 10px;
  border-radius: 4px;
}

.article__post__text h1 {
  margin: 4px 0px 18px 0px;
  font-weight: 600;
  font-size: var(--size-4);
  color: var(--second-color);
}

.article__post__text a {
  color: var(--primary-color);
  font-weight: 600;
}

.article__post__text h2 {
  margin-top: 22px;
  margin-bottom: 8px;
  font-size: var(--size-5);
  color: var(--third-color);
  font-weight: 600;
}

.article__post__share {
  border-top: 1px solid #cfcfcf;
  @apply pt-4 pb-4;
}

.article__share__title {
  font-size: var(--size-3);
  color: var(--second-color);
  font-weight: 600;
  @apply mb-4;
}

/* Article comments */
#post_article_comments {
  background: var(--fiveth-color);
}

#post_article_comments form {
  max-width: 990px;
  margin: 0 auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

.form__input__field,
.form__input__textarea {
  border-radius: 10px;
  padding: 12px 24px;
  border: 1.5px solid #cfcfcf;
  background: var(--light-color);
  font-size: var(--size-1);
  margin-bottom: 12px;
  outline: none;
}

.form__input__textarea {
  width: 100%;
  min-height: 180px;
  resize: none;
}

.form__input__field {
  width: 49%;
}

.form__input__send {
  background: var(--primary-color);
  color: var(--light-color);
  margin-left: auto;
  cursor: pointer;
}

@media screen and (max-width: 620px) {
  .form__input__send,
  .form__input__field {
    width: 100%;
  }
}

/* MODAIS */
/* modal video  */
.modal {
  @apply hidden fixed left-0 top-0 w-full h-full overflow-auto pt-12 items-center justify-center;
  z-index: 4; /* Sit on top */
  background-color: rgb(0, 0, 0); /* Fallback color */
  background-color: rgba(0, 0, 0, 0.6); /* Black w/ opacity */
}

.modal__content {
  @apply m-auto w-full bg-white;
}

/* Demonstrations Vídeo */
#modalVideo .modal__content {
  max-width: 800px;
}

#modalVideo .modal__content .modal__content--close {
  @apply px-3 py-3 cursor-pointer text-center;
  font-size: var(--size-1);
  font-weight: 600;
  color: var(--primary-color);
}

/* Simulator */
#modalSimulador .modal__content {
  position: relative;
  max-width: 80%;
}

.modal__content .close {
  position: absolute;
  right: 0px;
  top: 0px;
  background-image: url(/src/close.png);
  height: 32px;
  width: 32px;
  cursor: pointer;
  margin: 24px;
}

#modalSimulador #intro {
  background-color: var(--second-color);
}

#modalSimulador #intro .grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
}

#modalSimulador #intro .grid .item {
  display: flex;
  align-items: center;
  justify-content: center;
}

#modalSimulador #intro .voltar {
  background-image: url(/icons/simulador-arrow-left.png);
  background-repeat: no-repeat;
  background-position: left;
  float: left;
  height: auto;
  width: auto;
  cursor: pointer;
  color: var(--primary-color);
  padding-left: 30px;
  font-weight: 500;
  font-size: 16px;
  margin-top: 24px;
  margin-left: 64px;
}

#modalSimulador #intro .grid .item .content {
  float: left;
  padding: 64px;
}

#modalSimulador #intro .text_1 {
  font-weight: bold;
  font-size: 40px;
  line-height: 44px;
  color: #ffffff;
}

#modalSimulador #intro .text_2 {
  font-weight: bold;
  font-size: 30px;
  line-height: 34px;
  color: #ffffff;
  margin: 48px 58px 48px 0;
}

#modalSimulador #intro .btn {
  display: flex;
  font-size: var(--size-3);

  text-align: center;
  justify-content: center;
  cursor: pointer;
}

#modalSimulador #intro img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

@media screen and (max-width: 1356px) {
  #modalSimulador #intro .grid {
    grid-template-columns: repeat(1, 1fr);
  }

  #modalSimulador #intro .item:nth-of-type(2) {
    display: none;
  }
}

/* Second step */
#modalSimulador #steps {
  background-color: #ffffff;
  padding: 0 100px;
}

#modalSimulador #steps .top {
  font-weight: 500;
  font-size: 12px;
  line-height: 16px;
  color: #6b6b6b;
  padding-top: 40px;
}

#modalSimulador #steps .headers {
  margin: 30px 0;
  font-weight: bold;
  font-size: 28px;
}

#modalSimulador #steps .headers .visited {
  font-weight: bold;
  font-size: 21px;
  color: #cfcfcf;
}

#modalSimulador #steps .grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
}

@media screen and (max-width: 1248px) {
  #modalSimulador #steps .grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media screen and (max-width: 860px) {
  #modalSimulador #steps .grid {
    grid-template-columns: repeat(1, 1fr);
  }
}

#modalSimulador #steps .grid .item {
  position: relative;
  margin: 10px;
}

#modalSimulador #steps .grid .item .info {
  background-image: url(/icons/info.png);
  position: absolute;
  width: 24px;
  height: 24px;
  top: 20px;
  right: 20px;
  cursor: pointer;
}

#modalSimulador #steps .grid .item .info.light {
  background-image: url(/icons/info-light.png);
}

#modalSimulador #steps .modal {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 3; /* Sit on top */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0, 0, 0); /* Fallback color */
  background-color: rgba(0, 0, 0, 0.6); /* Black w/ opacity */
  padding-top: 100px;
}

#modalSimulador #steps .modal__content {
  margin: auto;
  width: 376px;
  background: #ffffff;
  box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.15);
  border-radius: 10px;
}

#modalSimulador #steps .modal__content .close {
  background-image: url(/icons/close-primary.png);
  float: right;
  height: 24px;
  width: 24px;
  cursor: pointer;
  margin: 16px 16px 0 0;
}

#modalSimulador #steps .modal__content .plano {
  padding: 50px 40px;
}

#modalSimulador #steps .modal__content .title {
  color: var(--primary-color);
  font-weight: bold;
  font-size: 32px;
  line-height: 40px;
  text-align: center;
  margin-top: 16px;
}

#modalSimulador #steps .modal__content .subtitle {
  color: #6b6b6b;
  font-weight: 500;
  font-size: 14px;
  line-height: 20px;
  text-align: center;
  text-transform: uppercase;
  margin-top: 16px;
}

#modalSimulador #steps .modal__content .price {
  font-weight: bold;
  font-size: 32px;
  line-height: 40px;
  text-align: center;
  margin-top: 16px;
}

#modalSimulador #steps .modal__content ul {
  margin-top: 16px;
}

#modalSimulador #steps .modal__content ul li {
  color: #6b6b6b;
  font-size: 16px;
  line-height: 22px;
}

#modalSimulador #steps .grid .btn-outline {
  color: var(--primary-color);
  border: 2px solid var(--primary-color);
  border-radius: 8px;
  width: 100%;
  line-height: 90px;
  display: inline-block;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
  cursor: pointer;
}

#modalSimulador #steps .grid .btn-outline:hover {
  transform: scale(1);
}

#modalSimulador #steps .grid .btn-primary {
  background: var(--primary-color);
  color: #ffffff;
  border: 2px solid var(--primary-color);
  border-radius: 8px;
  width: 100%;
  line-height: 90px;
  display: inline-block;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
  cursor: pointer;
}

#modalSimulador #steps .bottom {
  display: flex;
  justify-content: space-between;
}

#modalSimulador #steps .back {
  background-image: url(/icons/simulador-arrow-left.png);
  background-repeat: no-repeat;
  background-position: left;
  height: auto;
  width: auto;
  cursor: pointer;
  color: var(--primary-color);
  padding-left: 30px;
  font-weight: 500;
  font-size: 16px;
  margin: 50px 0;
}

#modalSimulador #steps .next {
  background-image: url(/icons/simulador-arrow-right.png);
  background-repeat: no-repeat;
  background-position: right;
  text-align: right;
  height: auto;
  width: auto;
  cursor: pointer;
  color: var(--primary-color);
  padding-right: 40px;
  font-weight: 500;
  font-size: 16px;
  margin: 50px 0;
}

#modalSimulador #steps .next.disabled {
  pointer-events: none;
  color: #9f9f9f !important;
  cursor: default;
}

#modalSimulador #steps input {
  color: var(--primary-color);
  border: 2px solid var(--primary-color);
  border-radius: 8px;
  width: 100%;
  line-height: 90px;
  display: inline-block;
  font-weight: bold;
  font-size: 18px;
  text-align: center;
  margin: 10px;
}

#modalSimulador #steps input:focus {
  background: var(--primary-color);
  color: #ffffff;
  outline: none;
}

/* Wait Step */
#modalSimulador #wait {
  background: #ffffff;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  height: 500px;
  padding: 0px 32px;
}

#modalSimulador #wait .text {
  font-weight: bold;
  font-size: 28px;
}

#modalSimulador #wait img {
  margin: 0 auto;
}

/* Result Step */
#modalSimulador #result .grid {
  display: grid;
  grid-template-columns: 4fr 6fr;
}

#modalSimulador #result .left {
  background: var(--second-color);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 0;
}

#modalSimulador #result .left .text {
  color: #ffffff;
  font-weight: bold;
  font-size: 28px;
}

#modalSimulador #result .right {
  background: #ffffff;
}

#modalSimulador #result .right .content {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 80px 0;
}

#modalSimulador #result .right .text {
  font-weight: bold;
  font-size: 32px;
}

#modalSimulador #result .right .btn {
  display: flex;
  font-size: var(--size-3);

  text-align: center;
  justify-content: center;
  cursor: pointer;
  width: 100%;
  margin-top: 32px;
  margin-bottom: 32px;
}

#modalSimulador #result .right .restart {
  color: var(--primary-color);
  font-size: 16px;
  background-image: url(/icons/simulador-arrow-left.png);
  background-repeat: no-repeat;
  background-position: left;
  height: auto;
  width: auto;
  padding-left: 30px;
  cursor: pointer;
}

#modalSimulador #result .text-red {
  color: #e63030;
}

#modalSimulador #result .left,
#modalSimulador #result .right {
  padding-left: 48px;
  padding-right: 48px;
}

@media screen and (max-width: 1248px) {
  #modalSimulador #result .grid {
    grid-template-columns: repeat(1, 1fr);
  }

  #modalSimulador #result .left,
  #modalSimulador #result .right {
    padding: 28px 52px;
  }

  #modalSimulador #result .right .content {
    padding: 32px 0px;
  }
}

.hide {
  display: none !important;
}

@media screen and (max-width: 599px) {
  #modalSimulador #intro .text_1 {
    font-size: 26px;
  }

  #modalSimulador #intro .text_2 {
    font-size: 20px;
    line-height: 100%;
  }

  #step1Header,
  #step2Header,
  #step3Header,
  #step4Header {
    font-size: 20px;
    line-height: 100%;
  }

  #modalSimulador #steps .grid .btn-outline {
    line-height: 46px;
  }

  #modalSimulador #steps .grid .item .info {
    top: 12px;
  }

  #modalSimulador #wait .text {
    font-size: 20px;
    line-height: 100%;
  }

  #modalSimulador #result .left .text {
    font-size: 22px;
    line-height: 110%;
  }

  #modalSimulador #result .right .text {
    font-size: 22px;
    line-height: 100%;
  }

  #modalSimulador .modal__content {
    width: 92%;
  }

  #modalSimulador #intro .grid .item .content {
    padding: 64px 32px;
  }

  #modalSimulador #intro .voltar {
    margin-left: 32px;
  }

  #modalSimulador #result .right .content {
    padding: 0px;
  }

  #modalSimulador #steps {
    padding: 0px 32px;
  }
}

/* CUSTOM PANEL */
.content_panel_full {
  @apply pt-9 pb-9 pl-16 pr-16;
  @apply bg-gray-50;
}

@media screen and (max-width: 940px) {
  .content_panel_full {
    @apply pl-6 pr-6;
  }
}

/* header */
#header_main {
  background: var(--second-color);
  @apply pt-4 pb-4;
}

.header__main__wrapper {
  @apply pl-16 pr-16;
  @apply flex flex-wrap items-center justify-between;
}

@media screen and (max-width: 940px) {
  .header__main__wrapper {
    @apply pl-6 pr-6;
  }
}

#header__nav__desktop li {
  @apply m-1;
}

#header__nav__desktop li:hover a,
#header__nav__desktop li.current--nav a {
  background: var(--primary-color);
  color: var(--second-color);
}

#header__nav__desktop li a {
  @apply p-2;
  border-radius: 5px;
  color: var(--light-color);
  font-size: var(--size-1);
}

.panel__user__infos {
  @apply flex flex-col text-right;
}

.panel__user__infos span {
  color: var(--light-color);
  font-size: var(--size-1);
}

.panel__user__logout {
  color: var(--primary-color);
  font-size: var(--size-1);
}

/* Main pages */
.header__name__page {
  @apply mb-6;
}

.header__name__page h1 {
  font-size: var(--size-6);
  font-weight: 600;
  color: var(--second-color);
}

.content__box__data {
  border-radius: 5px;
  box-shadow: var(--shadow-params);
  background: var(--light-color);
  @apply pt-6;
}

.content__box__header {
  @apply pl-4 pr-4;
  @apply flex flex-wrap justify-between items-center;
  @apply mb-6;
}

.filter__form__select select {
  border: 1px solid #ddd;
  font-size: var(--size-1);
  border-radius: 6px;
  color: var(--fourth-color);
  width: 160px;
}

@media screen and (max-width: 599px) {
  .content__box__header {
    flex-direction: column;
    justify-content: center;
  }

  .filter__form__select {
    margin-top: 5px;
    margin-bottom: 5px;
  }
}

#banner_panel,
#posts_panel,
#contents_panel,
#contacts_panel {
  margin-bottom: 54px;
}

.content__box__header h1 {
  font-size: var(--size-3);
  color: var(--primary-color);
  font-weight: 600;
}

/* table data */
.default__table__data {
  width: 100%;
  background: #fff;
  overflow: hidden;
  border-bottom-left-radius: 6px;
  border-bottom-right-radius: 6px;
}

.default__table__data th {
  background: #ededed;
  padding: 16px 16px;
  color: var(--second-color);
}

.default__table__data th:nth-of-type(1) {
  text-align: left;
}

.default__table__data td {
  vertical-align: middle;
  padding: 16px 16px;
  text-align: center;
}

.default__table__data td:nth-of-type(1) {
  text-align: left;
}

.default__table__data tr:hover td {
  background: #f5f5f5;
}

.default__table__data tbody tr {
  border-bottom: 1px solid #eee;
}

.default__table__data tbody tr:last-child {
  border-bottom: 0px;
}

.default__table__data td span {
  font-size: var(--size-1);
  color: var(--fourth-color);
}

.default__table__data td .strong {
  font-weight: 600;
}

@media screen and (max-width: 940px) {
  .default__table__data tr {
    display: flex;
    flex-direction: column;
  }

  .default__table__data thead tr:nth-of-type(1) {
    display: none;
  }

  .default__table__data th,
  .default__table__data td {
    width: 100%;
    text-align: center !important;
    padding: 6px 16px;
  }

  .default__table__data td:first-child {
    padding-top: 16px;
  }

  .default__table__data td:last-child {
    padding-bottom: 16px;
  }

  .btn__panel--edit {
    margin-right: auto;
  }
}

/* imagem */
.table__picture--thumbs {
  border-radius: 6px;
  overflow: hidden;
  width: 100%;
  max-width: 200px;
}

@media screen and (max-width: 940px) {
  .table__picture--thumbs {
    margin: 0 auto;
  }
}

.content__edit__data form {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 54px;
}

.data__equal__columns {
  width: 48%;
}

.data__full__line,
.data__full__columns {
  width: 100%;
}

.data__full__line {
  display: flex;
  flex-direction: column;
  margin-bottom: 12px;
}

@media screen and (max-width: 940px) {
  .data__equal__columns {
    width: 100%;
  }

  .data__equal__columns:nth-of-type(2) {
    margin-top: 48px;
  }
}

.data__equal__columns > label,
.data__full__columns > label {
  width: 100%;
  display: flex;
  flex-direction: column;
  margin-bottom: 12px;
}

.data__form__span {
  font-size: var(--size-2);
  font-weight: 600;
  color: var(--second-color);
  margin-bottom: 6px;
}

.content__edit__data form select,
.content__edit__data form input[type="file"],
.data__form__inputs {
  width: 100%;
  border: 1px solid #ddd;
  padding: 12px 16px;
  border-radius: 6px !important;
  font-size: var(--size-2);
  color: var(--third-color) !important;
  margin-bottom: 12px;
  resize: none;
  background: #fff;
}

.data__form__options {
  display: flex;
  flex-wrap: wrap;
}

.data__form__checks {
  width: fit-content;
  background: #eee;
  border-radius: 4px;
  padding: 5px 8px;
  display: flex;
  align-items: center;
  margin-bottom: 12px;
  margin-right: 5px;
  color: #555;
  font-size: var(--size-2);
}

.data__form__checks input[type="checkbox"] {
  border: 1px solid #ddd;
  margin-right: 5px;
}

.data__text__area {
  min-height: 125px;
}

.edit__figure {
  margin-top: 6px;
}

.edit__figure img {
  border-radius: 6px;
}

/* Panel actions buttons */
.btn__panel--edit,
.btn__panel--show,
.btn__panel--delete,
.btn__panel--submit,
.btn__panel--return {
  padding: 6px 12px;
  font-size: 12px;
  font-weight: bold;
  border-radius: 6px;
}

.btn__panel--show {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
}

.btn__panel--edit {
  display: block;
  width: 90px;
  margin-left: auto;
  border: 1px solid #ccc;
  color: #aaa;
}

.btn__panel--delete {
  display: block;
  width: 100px;
  margin-left: auto;
  background: red !important;
  text-align: center;
  border: 1px solid red;
  color: #fff;
}

.btn__panel--submit {
  margin-top: 32px;
  font-size: var(--size-2);
  background: var(--primary-color);
  color: var(--light-color);
  padding: 12px 48px;
  cursor: pointer;
  width: 100%;
}

.btn__panel--return {
  padding: 12px 48px;
  border: 1px solid #ccc;
  color: #999;
}

.btn__panel--marked {
  border: 1px solid var(--primary-color);
  color: var(--primary-color);
  padding: 12px 16px;
  font-size: 14px;
  font-weight: bold;
  border-radius: 6px;
  cursor: pointer;
}

.content__return__data {
  width: 100%;
  display: flex;
  margin-top: 32px;
  padding-top: 22px;
  border-top: 1px solid #ddd;
}

.btn__actions__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

.btn__actions__list .btn__panel--edit,
.btn__actions__list .btn__panel--delete {
  width: auto;
  margin-right: 4px;
}

@media screen and (max-width: 1100px) {
  .btn__actions__list {
    flex-direction: column;
  }

  .btn__actions__list .btn__panel--edit,
  .btn__actions__list .btn__panel--delete {
    width: 80px;
    margin-right: 0px;
    margin-bottom: 4px;
  }
}

@media screen and (max-width: 940px) {
  .btn__actions__list {
    flex-direction: row;
    margin: 0 auto;
    width: 166px;
  }

  .btn__actions__list .btn__panel--edit {
    margin-right: 4px;
  }
}

/* Panel indicators */

.panel__indicator--active,
.panel__indicator--inactive {
  font-style: normal;
  font-size: 12px;
  font-weight: 600;
  border-radius: 5px;
  padding: 6px 16px;
  width: 70px;
  display: flex;
  justify-content: center;
  margin: 0 auto;
}

.panel__indicator--active {
  background: #86efac;
  color: var(--second-color);
}

.panel__indicator--inactive {
  background: #dfdfdf;
  color: var(--second-color);
}

/* flash cards */
.flash__card {
  border-radius: 6px;
  padding: 16px 12px;
  display: flex;
  justify-content: space-between;
  margin-bottom: 32px;
}

.flash__card span {
  width: 80%;
  font-size: var(--size-2);
  font-weight: 600;
}

.flash__card button {
  border: 0px;
  width: 24px;
  height: auto;
  border-radius: 5px;
  font-weight: 600;
}

.flash__type--info {
  border: 1px solid #fdcb6e;
  background: #ffeaa7;
}

.flash__type--info span,
.flash__type--info button {
  color: #e4a023;
}

.flash__type--success {
  border: 1px solid #bbf7d0;
  background: #dcfce7;
}

.flash__type--success span,
.flash__type--success button {
  color: #2ec75e;
}

.flash__type--warning {
  border: 1px solid #f7d9bb;
  background: #fcf2dc;
}

.flash__type--warning span,
.flash__type--warning button {
  color: #c79e2e;
}

.flash__type--error {
  border: 1px solid #fecaca;
  background: #fee2e2;
}

.flash__type--error span,
.flash__type--error button {
  color: #f04444;
}

@import "actiontext.css";

/* TRIX EDITOR */
.trix-button--icon-increase-nesting-level,
.trix-button--icon-decrease-nesting-level,
.trix-button--icon-code {
}

#post_content ul,
#post_content ol {
  margin-top: 16px;
  margin-bottom: 16px;
}

#post_content ul li {
  list-style-type: disc;
  margin-left: 50px;
}

#post_content ol li {
  list-style: decimal;
  margin-left: 50px;
}

#post_content blockquote {
  background: #eee;
  margin: 10px 0px;
  padding: 5px 10px 5px 10px;
  border-radius: 4px;
}

#post_content h1 {
  margin: 4px 0px 18px 0px;
  font-weight: 600;
  font-size: var(--size-4);
  color: var(--second-color);
}

#post_content a {
  color: var(--primary-color);
  font-weight: 600;
}

.not_found_contents {
  padding: 45px 22px;
  border-radius: 6px;
  background: #fff;
  font-size: var(--size-1);
  color: var(--second-color);
  display: flex;
  box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.07);
  margin-bottom: 100px;
}

/* NO LOGGED PANEL */

/* login panel */
.content__page {
  @apply grid grid-cols-1 lg:grid-cols-2 w-full;
}

.column__left {
  @apply bg-sky-900 lg:min-h-screen lg:flex lg:items-center p-8 sm:p-12;
}

.article {
  @apply flex-grow items-center flex flex-col;
}

.logo__panel {
  @apply mx-0 mb-5 sm:flex-shrink-0 h-auto w-32;
}

.logo__form--panel {
  @apply m-auto w-fit mb-5;
}

.title__panel {
  @apply text-white text-center text-2xl sm:text-5xl mb-2;
}

.subtitle__panel {
  @apply text-center text-blue-200 sm:text-lg;
}

.colum__right {
  background: #fff;
  @apply lg:min-h-screen lg:flex lg:items-center p-12 lg:p-24;
}

.content__login {
  @apply flex-grow w-full p-0 sm:p-8;
}

.card__box {
  @apply sm:flex sm:items-center;
}

.image__profile {
  @apply sm:flex-shrink-0 mx-auto sm:mx-0 h-24 rounded-full;
}

.content__user {
  @apply sm:ml-4 sm:text-left text-center;
}

.name__user {
  @apply text-xl;
}

.function__user {
  @apply text-sm text-gray-600;
}

.revoge__access {
  @apply text-red-500 hover:text-white hover:bg-red-500 border border-red-500 font-semibold rounded-md text-xs px-4 py-1;
}

.form {
  @apply flex w-full mt-8;
}

.inputs {
  @apply flex-1 w-full text-gray-700 bg-gray-100 rounded-md border border-gray-200 outline-none py-4 px-4 focus:bg-white;
}

.inputs:hover {
  @apply hover:bg-white;
}

.button__send {
  @apply flex-shrink-0 bg-sky-500 outline-none py-4 px-4 text-white font-semibold rounded-md cursor-pointer;
}

.button__send:hover {
  @apply hover:bg-sky-600;
}

/* PAGINATIONS */
.pagination {
  margin: 0 auto;
  margin-top: 32px;

  display: flex;
}

.pagination .first,
.pagination .last {
  display: none;
}

.pagination .page {
  margin: 0px 2px;
}

.pagination .next,
.pagination .prev,
.pagination .page.current,
.pagination .page a {
  display: flex;
  font-size: var(--size-3);
  padding: 4px 12px;
  border: 2px solid var(--primary-color);
  border-radius: 3px;
  color: var(--primary-color);
}

.pagination .page.current {
  background: var(--primary-color);
  color: var(--light-color);
}

.trix-button--icon-attach::before {
  background-image: url(data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0IiBmaWxsPSJub25lIiBzdHJva2U9ImN1cnJlbnRDb2xvciIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiIGNsYXNzPSJmZWF0aGVyIGZlYXRoZXItdXBsb2FkLWNsb3VkIj48cG9seWxpbmUgcG9pbnRzPSIxNiAxNiAxMiAxMiA4IDE2Ij48L3BvbHlsaW5lPjxsaW5lIHgxPSIxMiIgeTE9IjEyIiB4Mj0iMTIiIHkyPSIyMSI+PC9saW5lPjxwYXRoIGQ9Ik0yMC4zOSAxOC4zOUE1IDUgMCAwIDAgMTggOWgtMS4yNkE4IDggMCAxIDAgMyAxNi4zIj48L3BhdGg+PHBvbHlsaW5lIHBvaW50cz0iMTYgMTYgMTIgMTIgOCAxNiI+PC9wb2x5bGluZT48L3N2Zz4=);
}

trix-toolbar .trix-dialog--attach {
  max-width: 600px;
}

trix-toolbar .trix-dialog__attach-fields {
  display: flex;
  align-items: baseline;
}

trix-toolbar .trix-dialog__attach-fields .trix-input {
  flex: 1;
}

trix-toolbar .trix-dialog__attach-fields .trix-button-group {
  flex: 0 0 content;
  margin: 0;
}

#purchase_push {
  margin: 0 auto;
  width: 100%;
  margin-top: 100px;
  background: #fff;
  padding: 24px;
  border-radius: 6px;
  box-shadow: 0 0 25px rgba(0, 0, 0, 0.2);

  display: none;

  animation: pulse 0.7s infinite;
  animation-direction: alternate;
  -webkit-animation-name: pulse;
  animation-name: pulse;
}

#purchase_push.visible {
  display: flex !important;
  flex-direction: column;
}
#purchase_push a aside {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
#purchase_push div {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
#purchase_push h1 {
  font-size: 22px;
  color: var(--primary-color);
  line-height: 110%;
  width: 100%;
}
#purchase_push button {
  display: flex;
  align-items: center;
  border-radius: 4px;
  background: var(--primary-color);
  font-weight: bold;
  min-width: 350px;
  padding: 8px 22px;
  color: #fff;
  justify-content: center;
}
#purchase_push button svg {
  width: 32px;
  fill: #fff;
}

@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(1);
  }
  100% {
    -webkit-transform: scale(1.05);
  }
}

@keyframes pulse {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.02);
  }
}

@media screen and (max-width: 856px) {
  #purchase_push {
    margin-top: 50px;
  }
  #purchase_push div {
    display: flex;
    flex-direction: column;
    gap: 10px;
    text-align: center;
  }
  #purchase_push div h1 {
    text-align: center;
  }

  #purchase_push button {
    min-width: auto;
  }
}

.content-button {
  display: flex;
  width: 100%;
  text-align: center;
  justify-content: center;
}

/* PLANO SIMULADOR */
.plano {
  margin: 0 auto;
  max-width: 390px;
  background: #fff;
  border-radius: 8px;
  padding: 32px;
  text-align: center;
}
.plano .title {
  font-size: 28px;
  font-weight: bold;
  color: #2eb2ff;
}
.plano .subtitle {
  font-size: 16px;
  color: #333;
}
.plano .price {
  padding: 4px 8px;
  border-radius: 8px;
  border: 2px solid #2eb2ff;
  color: #2eb2ff;
  display: flex;
  font-weight: bold;
  width: fit-content;
  margin: 0 auto;
  margin-top: 8px;
  margin-bottom: 8px;
}
.plano ul li {
  color: #555;
  font-size: 14px;
}

.modal-content .close {
  color: #fff;
  background-color: #fff;
  padding: 18px;
  display: flex;
  border-radius: 8px;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: 20px;
}



/* CONTACT PAGE VIEW */
#contact_view{
  padding-top:13rem;
}
#contact_view .hidden_if_contact_view{ display: none; }

@media screen and (max-width: 800px){ #contact_view{ padding-top: 11rem; } }
.btn {
  font-size: var(--size-2);
  font-weight: 700;
  padding: 22px 28px;
  line-height: 100%;
  border-radius: 8px;
  text-align: center;
}
.btn-transparent {
  line-height: 100%;
  color: var(--fourth-color);
}
.btn-blue {
  background: var(--primary-color);
  color: var(--light-color);
}
.btn-blue:hover {
  background: var(--second-color);
  color: var(--fiveth-color);
  /*transform:scale(1.05);*/
}
.btn-outline {
  border: 2px solid var(--fourth-color);
  background: none;
  color: var(--fourth-color);
}
.btn-outline:hover {
  transform: scale(1.05);
}
.btn-outline-blue {
  border: 2px solid var(--primary-color);
  background: none;
  color: var(--primary-color);
}
.btn-outline-blue:hover {
  border: 2px solid var(--second-color);
  color: var(--second-color);
  /*transform:scale(1.05);*/
}

.btn-outline-white {
  border: 2px solid var(--light-color);
  background: none;
  color: var(--light-color);
}

.btn-wide {
  width: 100%;
}

.btn-gold {
  font-size: var(--size-2);
  background: #74ff21;
  color: #222;
}
.btn-gold:hover {
  transform: scale(1.05);
}

@keyframes floating {
  0%,
  100% {
    bottom: 20px;
  }
  50% {
    bottom: 40px;
  }
}

/* LGPD BAR NOTIFICATION */
#lgpd-bar {
  position: fixed;
  width: 100%;
  background: #222;
  box-shadow: 0px 0px 30px rgba(102, 102, 102, 0.609);
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
  left: 5%;
  right: 5%;
  bottom: 12px;
  opacity: 0;
  visibility: hidden;
  z-index: -1;

  max-width: 90%;
  border-radius: 6px;
  padding: 18px;

  transition: 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  -webkit-transition: 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
  -moz-transition: 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

#lgpd-bar.showCookie {
  opacity: 1;
  visibility: visible;
  z-index: 7;
}

#lgpd-bar article {
  display: flex;
  width: 72%;
  flex-direction: column;
}

#lgpd-bar article h6 {
  color: var(--light-color);
  font-size: 16px;
  margin-bottom: 6px;
}

#lgpd-bar article p {
  color: var(--light-color);
  font-size: 14px;
}

#lgpd-bar article p a {
  color: var(--primary-color);
}

#lgpd-bar aside {
  width: 25%;
  display: flex;
  justify-content: flex-end;
  justify-content: space-between;
  padding: 0px;
}

#lgpd-bar button {
  display: flex;
  width: 49%;
  line-height: 100%;
  padding: 6px 10px;
  border: 0px;
  color: #1b1b1b;
  background: none;
  font-weight: bold;
  cursor: pointer;

  justify-content: center;

  transition: 0.3s cubic-bezier(0.075, 0.82, 0.165, 1);
  -webkit-transition: 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
  -moz-transition: 0.2s cubic-bezier(0.075, 0.82, 0.165, 1);
}

#lgpd-bar button.btn-cancel {
  color: var(--light-color);
  border: 1px solid #555;
  border-radius: 6px;
}

#lgpd-bar button.btn-accept {
  background: var(--primary-color);
  border-radius: 6px;
  color: var(--light-color);
  border: 1px solid var(--primary-color);
}

@media screen and (max-width: 805px) {
  #lgpd-bar {
    right: 2%;
    left: 2%;
    width: 96%;
    max-width: 96%;
    bottom: 2%;
    margin-left: auto;
  }
  #lgpd-bar article {
    width: 100%;
  }
  #lgpd-bar article p {
    text-align: center;
  }
  #lgpd-bar aside {
    width: 100%;
    padding-bottom: 16px;
  }
}

@media screen and (max-width: 432px) {
  #lgpd-bar aside {
    flex-direction: column;
  }
  #lgpd-bar button {
    width: 100%;
    margin-bottom: 8px;
  }
}
#nav-mobile {
  display: none;
}
@media screen and (max-width: 800px) {
  #nav-mobile {
    position: fixed;
    top: 0px;
    right: -305px;
    bottom: 0px;
    width: 80%;
    height: 100%;
    background: rgb(44, 49, 64);
    background: linear-gradient(
      180deg,
      rgba(44, 49, 64, 1) 0%,
      rgba(44, 60, 64, 1) 100%
    );
    padding: 38px;
    z-index: 4;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    pointer-events: none;
    opacity: 0;
    border-radius: 25px 0px 0px 25px;
    transition-duration: 0.2s;
  }
  #nav-mobile.show-nav {
    right: 0px;
    pointer-events: all;
    opacity: 1;
  }
  .close-nav {
    position: absolute;
    top: 30px;
    right: 20px;
    display: block;
    width: 32px;
    height: 32px;
    background: none;
    cursor: pointer;
    font-weight: 700;
    font-size: var(--size-6);
    line-height: 100%;
    color: var(--primary-color);
  }
  .nav-logo img {
    width: 85%;
  }

  #nav-mobile ul {
    margin-top: 36px;
  }
  #nav-mobile ul li {
    padding: 2% 0px;
  }
  #nav-mobile ul li a {
    color: var(--light-color);
    font-size: var(--size-6);
    font-weight: 600;
  }
  #nav-mobile ul li:hover a {
    color: #47e80e;
  }

  .nav__actions {
    display: flex;
    flex-direction: column;
  }
  .nav__actions .btn-transparent {
    color: var(--light-color);
    margin-bottom: 16px;
    margin-top: 16px;
  }
}

/* CONTACT MODAL */
#email-modal {
  display: flex;
  position: fixed;
  z-index: 6;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgb(0, 0, 0);
  background-color: rgba(0, 0, 0, 0.6);
  padding: 52px;
  display: flex;
  justify-content: center;
  align-items: center;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

#email-modal.actived {
  opacity: 1;
  visibility: visible;
  pointer-events: visible;
}
.noScroll {
  overflow: hidden;
}
.email-modal-close {
  position: absolute;
  top: 24px;
  right: 24px;
  height: 32px;
  width: 32px;
  cursor: pointer;
  padding: 26px;
  background: url(/icons/close.png) no-repeat center center;
}

.page-area,
.email-area {
  margin: auto;
  width: 80%;
  background: #ffffff;
  padding: 52px 100px;
  position: relative;
}

.page-area h3,
.email-area h3 {
  font-size: var(--size-7);
  text-align: center;
  line-height: 110%;
}

.page-area {
  align-items: center;
  justify-content: center;
  text-align: center;
  padding-top: 100px;
  padding-bottom: 56px;
}

#email-form {
  display: none;
}
#email-form.nextStep {
  display: block;
}

#email-form form {
  margin-top: 32px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#email-form .form-input,
#email-form .form-text {
  border: 1.5px solid #cfcfcf;
  border-radius: 8px;
  margin: 0.5%;
  font-size: 16px;
  line-height: 22px;
  color: #6b6b6b;
  padding: 21px 16px;
}
#email-form .form-input {
  width: 49%;

  height: 64px;
}
#email-form .form-text {
  width: 100%;
  min-height: 190px;
  resize: none;
}
#email-form .btn {
  justify-self: flex-end;
  margin-top: 1%;
  margin-right: 0.5%;
  width: 250px;
  height: auto;
  cursor: pointer;
  margin-left: auto;
  background: var(--primary-color);
  color: var(--light-color);
}

/* loading */
#email-loading {
  padding: 74px 0px;
  display: none;
}
#email-loading.nextStep {
  display: block;
}
#email-loading figure {
  margin: 0 auto;
  margin-bottom: 32px;
  width: fit-content;
}
#email-loading h5 {
  font-size: var(--size-6);
  text-align: center;
  line-height: 110%;
}
/* confirmation email */
#email-confirmation {
  width: 100%;
  padding: 74px 0px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}
#email-confirmation.nextStep {
  display: flex;
}
#email-confirmation figure {
  margin: 0 auto;
  margin-bottom: 32px;
  width: fit-content;
}
#email-confirmation span {
  text-align: center;
  font-size: var(--size-4);
  margin-top: 32px;
  margin-bottom: 32px;
}
#email-confirmation .btn {
  width: 250px;
  align-self: center;
  cursor: pointer;
  margin: 0 auto;
}

#email-confirmation h3 {
  font-size: 48px;
  font-weight: 600;
}

.g-recaptcha {
  margin-top: 6px;
  margin-left: 5px;
}
.flash-notice-form {
  position: relative;
  left: 4px;
  right: 0px;
  width: 99%;
  bottom: -15px;
  display: flex;
  padding: 16px 25px 16px 70px;
  margin-bottom: 1rem;
  border: 1px solid transparent;
  border-radius: 0.25rem;
  color: #815c15;
  background: #feefd0 url(/icons/warning.svg) no-repeat 16px center;
  background-size: 38px;
  border-color: #fde9bd;
  opacity: 0;
  visibility: hidden;
  display: none;

  transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
}
.flash-notice-form.show {
  opacity: 1;
  visibility: visible;
  display: flex;
}

@media screen and (max-width: 1070px) {
  .page-area {
    width: 100%;
    padding: 0px;
  }
  .email-area {
    width: 100%;
    padding: 52px;
  }
  .page-area h3,
  .email-area h3 {
    font-size: var(--size-6);
  }

  #email-modal {
    padding: 12px;
  }
  #email-form .form-input {
    width: 100%;
    margin: 0px;
    margin-bottom: 10px;
  }
  #email-form .form-text {
    margin: 0;
    margin-bottom: 10px;
  }
  #email-form .btn {
    width: 100%;
  }
  #email-form .btn:hover {
    transform: scale(1);
  }
}
@media screen and (max-width: 795px) {
  .email-area {
    padding: 52px 26px;
  }
  .email-area h3 {
    font-size: var(--size-4);
  }

  .email-modal-close {
    top: 0px;
    right: 0px;
  }
  #email-form .form-input {
    height: 48px;
  }
  #email-form .form-text {
    min-height: 100px;
  }

  #email-loading,
  #email-confirmation {
    padding: 0px;
  }
  #email-loading h5 {
    font-size: var(--size-3);
  }

  #email-confirmation span {
    font-size: var(--size-2);
  }
  .g-recaptcha {
    width: 100%;
  }
}
/* GENERAL */
body{
 font-family: 'Heebo','Verdana','Helvetica','Arial',sans-serif !important;
}
.bg-primary{ background: #2eb2ff !important; }
.text-primary{ color: #2eb2ff !important; }
.btn-primary{ background-color:#2eb2ff !important; border-color: #2eb2ff !important; }
  .btn-primary:hover{ background-color:#289de0 !important; border-color:289de0 !important; }

  .btn-light{ background-color: #eee !important; border-color: #eee !important; }

.text-dark{ color: #222 !important; }
.text-light{ color: #ccc !important; }

.zi-2{ z-index: 2; }
.zi-full{ z-index: 10; }

.h-title{ font-size:3.5rem !important; line-height:90%; }
.big-plan{ font-size:7.5rem; line-height:90%; }
.lead-lg{ font-size:1.8rem; line-height:100%; }

.btn-fit{ width: 150px !important; float:right !important;}

.btn-hover:hover{
  background: #2eb2ff !important;
  color:#fff;
}

.bg-rznt{
  background: #2eb2ff;
}


.custom-padding-sides{
  padding-left:3rem;
  padding-right:3rem;
}

.custom-col-wrap{
  flex:0 0 auto;
  width:auto;
}
  .custom-list-group{
    justify-content: flex-start;
    display:flex;
    flex-wrap:wrap;
    flex-direction: row;
    list-style:none;
    padding:0px;
  } 
    .custom-col-wrap li{
      width:10%;
      padding:4px;
    }

    .custom-list-group .rounded-circle{
      display:block !important;
      width:46px;
      height:46px;
    }
    .custom-list-group .rounded-circle:focus{
      background:#2eb2ff !important;
      color:#fff !important;
      border-color:#7ed0ff !important;
    }

    @media screen and (max-width:576px){
      .custom-list-group{ margin:0 auto; margin-bottom:16px; }
      .custom-list-group .rounded-circle{
        margin:0 auto;
        width:100%;
        padding:0px;
        border-radius:6px !important;
      }
    }

    @media screen and (max-width:372px){
      .custom-list-group li{
        width:20%;
        padding:4px;
      }
    }


@media screen and (max-width:1200px){
  .custom-col-wrap{
    width:100%;
  }
}


.custom-container-padding{
  padding:4rem 3rem 3rem 3rem;
}
  @media screen and (max-width:768px){
    .custom-container-padding{
      max-width:auto !important;
      width:auto !important;
      padding:3rem 1.5rem 3rem 1.5rem;
    }
  }


/* START PAGE */
.responsive-alignments{
  align-items:center;
  justify-content: end;
}
.text-alignments{
  text-align:right;
  justify-items: end;
}
.bg-image-woman{
  position:relative;
  overflow: hidden;
}
  .bg-image-woman:after{
    content:'';
    width:950px;
    height:100%;
    position:absolute;
    top:0;
    bottom:0;
    left:0px;
    right:0;
    display:block;
    background:url(/purchase/purchase_woman.png) no-repeat center top;
    background-size:940px;
  }

  .box-content{
    position:relative;
    background-color:#fff;
    padding:3rem 3rem 3rem 0;
  }
    .box-content:before,
    .box-content:after{
      content:'';
      position:absolute;
      top:0;
      bottom:0;
      height:100%;

      display:block;
      background:#fff;
    }
    .box-content:before{
      border-top-left-radius:150px;
      border-bottom-left-radius:150px;
      width:300px;
      left:-300px;
    }
    .box-content:after{
      width:100%;
      right:-100%;
    }

    .h-big{
      color:#2eb2ff;
      font-size:3.5rem;
      font-weight:bold;
      line-height:90%;
    }
    .btn-start{
      background:#2eb2ff;
      border-color:#2eb2ff;
      color:#fff;
      font-weight:bold;
    }
      .btn-start:hover{ background:#289de0;border-color:#289de0;color:#fff; }

@media screen and (max-width:1400px){
  .h-big{ font-size:3rem; }
  .lead-lg{ font-size:1.5rem; }

  .bg-image-woman:after{
    left:-100px;
    background-size:800px;
  }

  .box-content:before{
    width:150px;
    left:-150px;
  }
}

@media screen and (max-width:1200px){
  .h-big{ font-size:2.3rem; }
  .lead-lg{ font-size:1.3rem; }
  .bg-image-woman:after{
    left:-200px;
    background-position:bottom;
    background-size:704px;
  }
}

@media screen and (max-width:991px){
  .responsive-alignments{ align-items:flex-start; }
  .text-alignments{ text-align:center; justify-items:center; }

    .bg-image-woman:before{
      content:'';
      bottom:0px;
      height:50%;
      width:400px;
      position:absolute;
      left:50%;
      margin-left:-200px;
      display:block;
      border-top-left-radius:225px;
      border-top-right-radius:225px;
      background:#fff;
    }
    .bg-image-woman:after{
      width:100%;
      top:40%;
      right:0;
      left:0;
      background-position:center;
      background-size:600px;
    }

    .box-content{
      padding:3rem 0;
      background-color:transparent;
    }
    .box-content:after,
    .box-content:before{ display:none; }
    .h-big{ font-size:2rem; color: #fff; }
    .lead-lg{ font-size:1rem; }
    .btn-start{ background:#fff; color: #2eb2ff; }
    .bnt-start:hove{ background:#eee; color:#289de0; }
    
    
  }
  
  @media screen and (max-width:424px){
    header img{ width: 140px; }
    header span.h5{ font-size:0.8rem !important; }

    .h-big{ font-size: 1.5rem; }
    .h-big > br{ display:none; }
    .lead-lg > br{ display:none; }
    .bg-image-woman:before{ width:290px; margin-left:-145px; } 
    .bg-image-woman:after{ left:0; top:45%; background-size:138%;}

    .caption-user-company h1.h4{ font-size: 1.2rem !important; }

    .without-data h1.h-title{ font-size: 2rem !important; }
    .without-data span.h4 { font-size: 1.1rem !important; }

    .mobile-text-center{ text-align:center; }
    
    .custom-container-padding{ padding:1rem 0rem !important; }
    .show-plan span.h3{ font-size: 1.3rem !important; }
    .show-plan span.h5{ font-size: 1rem; }
  }




/* PROGRESS STEP */
.progress_step { counter-reset: step; padding:0; width:100%; }
.progress_step li {
    list-style-type: none;
    width: 33.33%;
    float: left;
    font-size: 18px;
    position: relative;
    text-align: center;
    color: #7d7d7d;
}
.progress_step li:before {
    width: 48px;
    height: 48px;
    content: counter(step);
    counter-increment: step;
    color:#ccc;
    font-size:20px;
    line-height: 46px;
    font-weight:bold;
    border: 3px solid #ccc;
    display: block;
    text-align: center;
    margin: 0 auto 10px auto;
    border-radius: 50%;
    background-color: white;
    position:relative;
    z-index:2;
}
.progress_step li:after {
    width: 100%;
    height: 4px;
    content: '';
    position: absolute;
    background-color: #ddd;
    top: 24px;
    left: -50%;
    z-index:1;
}

.progress_step li:first-child:after { content: none; }

.progress_step.start_step li:nth-of-type(1),
.progress_step.second_step li:nth-of-type(1),
.progress_step.second_step li:nth-of-type(2),
.progress_step.complete_step li:nth-of-type(1),
.progress_step.complete_step li:nth-of-type(2),
.progress_step.complete_step li:nth-of-type(3){ color: #2eb2ff; }

.progress_step.start_step li:nth-of-type(1):before,
.progress_step.second_step li:nth-of-type(1):before,
.progress_step.second_step li:nth-of-type(2):before,
.progress_step.complete_step li:nth-of-type(1):before,
.progress_step.complete_step li:nth-of-type(2):before,
.progress_step.complete_step li:nth-of-type(3):before{
  border-color: #2eb2ff;
  color: #fff;
  background:#2eb2ff;
}

.progress_step.second_step li:nth-child(2):after,
.progress_step.complete_step li:nth-child(2):after,
.progress_step.complete_step li:nth-child(3):after{ background:#2eb2ff; }


@media screen and (max-width:576px){
  header span{ font-size:1rem !important; }
  .custom-container-padding{
    padding:1rem !important;
  }
  .progress_step li{ font-size:13px; }
  .progress_step li:before {
    width: 40px;
    height: 40px;
    font-size:16px;
    line-height: 36px;
  }
  .progress_step li::after{
    top:17px;
    height:3px;
  }
  
  .h-title{ font-size:2.5rem !important; }
}


/* INPUTS FORMS */
.input-undercover-focus{
  border:0px;
  outline:none;
  font-size:20px;
  border-bottom:3px solid #ddd;

  transition-duration:0.2s;
}
  .input-undercover-focus:focus {
    border-color:#2eb2ff;
  }

.select-custom{
  background:none;
  padding-left:0px;
  padding-right:0;
}

  .select-custom .vs__dropdown-toggle{ padding:0; border:0;}
  .select-custom #vs1__listbox,
  .select-custom #vs2__listbox{
    box-shadow:0px 0px 10px #ddd;
    border-radius:4px;
    background:#fff;
    border:0;
  }

  .select-custom .vs__search{
    font-size:20px;
    margin:0;
    padding:0;
  }
  .select-custom .vs__selected-options,
  .select-custom .vs__selected{
    margin:0;
    padding:0;
  }

.size-radio{ width: 22px; height: 22px; }

.wrap-box-questions{ height:100%; }

.box-questions{ position:relative; overflow: hidden; }
.box-questions .btn:hover{ background:#2eb2ff !important; color:#fff !important; }


@media screen and (max-width:768px){
  .custom-padding-sides,
  .caption-user-company,
  .box-questions{ padding-left:0rem !important; padding-right:0rem !important; }
  .btn-back{ margin-left:0px !important; }
}

@media screen and (max-width:576px){
  .box-questions span,
  .box-questions input{ text-align:center; }
  .box-questions label span{ text-align:left; }
  .box-questions .group-buttons{ margin:0 auto; }

  .box-questions .btn{ display:inherit; margin:0 auto; }

  .btn-back{ margin:0 auto !important; }

  .caption-user-company{ text-align:center; }
}


/* LOADING ICON */
.loading-rocket{
  width:250px;
  height:205px;
  display:flex;
  
  background:url(/purchase/rocket-base.svg) no-repeat left center;
  position:relative;
}
  .loading-rocket:before{
    content:'';
    height:205px;
    display:flex;
    position:absolute;
    top:0px;
    left:0px;
    bottom:0px;
    width:100%;

    background:url(/purchase/rocket-loading.svg) no-repeat left center;
    background-size:236px;

    animation: right-animate 9.5s ease-in-out;
  }

  @keyframes right-animate {
    0% {
        width:0%;
    }
    100% {
        width:250px;
    }
  }
    .currency_symbol{ width:auto; display:flex; margin:0 auto; position:relative; padding-left:36px;}
      .currency_symbol:before{
        content: 'R$';
        font-size:26px;
        top:-10px;
        position:absolute;
        left:0px;
      }

@media screen and (max-width:790px){
  .payment-methods fieldset{
    flex-direction:column;
    justify-content: center;
  }
    .payment-methods fieldset label{ margin-bottom:16px; }
  .payment-methods .btn{ font-size:1rem !important; width:100% !important; }
  .big-plan{ font-size: 4rem; }
}

@media screen and (max-width:400px){
  .big-plan{ font-size:2.2rem;}
  .currency_symbol{ font-size:1.8rem !important; }
    .currency_symbol:before{ font-size:18px; left:12px; }
}


header span{ text-align:right; display:block; }
  @media screen and (max-width:768px){
    header img{ margin:0 auto; display:block; margin-bottom:12px; }
    header span{ margin:0 auto;text-align:center; }
  }


.start-vh-calc{
  height: calc(100vh - 200px);
  min-height:350px;
}
  @media screen and (max-width:992px){
    .header-start{
      padding:2rem 0rem !important;
      justify-content: center;
    }
    .start-vh-calc{
      height:auto;
      min-height:auto;
      padding:0rem !important;
    }
      .start-vh-calc .col-12{
        padding:0rem !important;
      }
      .start-vh-calc .lead-lg > br,
      .start-vh-calc .h-big > br{ display: none; }
  }

.custom-vh-calc{
  height: calc(100vh - 288px);
  min-height:350px;
}

.btn-back{
  margin-left:3rem;
  border: 1px solid #ddd;
  background: none;
  color: #999;
  font-weight: bold;
  padding: 0.5rem 1rem;
  border-radius: 6px;
  width:100%;
  max-width:119px;
  display:flex;
  justify-content: center;

  transition-duration:0.2s;
}
  .btn-back:hover{
    border-color:#2eb2ff;
    color:#2eb2ff;
  }

.btn-restart{
  border:0;
  background:none;
  color: #999;
  font-weight: bold;
  padding: 0.5rem 1rem;
  display:flex;
  margin:0 auto;
}
  .btn-restart:hover{
    color:#2eb2ff;
  }

  @media screen and (max-width:576px){
    .btn-back{ margin:0 auto; }
  }

#without_cnpj .btn-back{
  margin:0 auto;
  color:#fff;
}

#address .btn-back{ margin: 0 auto; }
 

/* FADE */
.fade-enter-active,
.fade-leave-active{
  transition: opacity .4s ease-in-out;
}

.fade-enter,
.fade-leave-to{ opacity: 0; }

.fade-leave,
.fade-enter-to{ opacity: 1; }


/* ALERT */
.alert-slide-enter-active,
.alert-slide-leave-active{
  transition: all .2s ease-in-out;
}

.alert-slide-enter,
.alert-slide-leave-to{
  top:-40px;
  opacity:0;
}
.alert-slide-leave,
.alert-slide-enter-to{
  top:0px;
  opacity:1;
}

.slide-fade-enter-active {
  transform: translateY(0%);
  transition: all 0.2s ease;
  animation-fill-mode: both;
}
.slide-fade-leave-active {
  transform: translate3d(0,0%,0);
  transition: all 0.2s ease;
  position:absolute;
}
.slide-fade-enter, .slide-fade-leave-to{
  opacity: 0;
  transform: translate3d(0,75%,0);
}

/* loading sign_up */
.lds-dual-ring {
  margin:0 auto;
  display: inline-block;
  width: 80px;
  height: 80px;
}
.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 64px;
  height: 64px;
  margin: 8px;
  border-radius: 50%;
  border: 6px solid #289de0;
  border-color: #289de0 transparent #289de0 transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}


.loading-display:before{
  transition-duration:0.2s;

  content:'Aguarde, carregando...';
  font-size:1.6rem;
  text-align:center;
  color:#2eb2ff;
  justify-content: center;
  align-items:center;

  display:flex;
  padding-bottom:180px;
  width:100%;
  height:100vh;
  background:#000;

  position:fixed;
  top:0;
  left:0;
  right:0;
  bottom:0;
  z-index:4;

  background:#fff url(/purchase/loading-icon.gif) no-repeat center center;
}



.card_whats_doubts {
  position: fixed;
  right: 22px;
  bottom: 24px;
  background-size: 46px;
  border: 1px solid #ddd;
  border-radius: 10px;
  padding: 0.8rem 2rem 0.8rem 2.4rem;
  box-shadow: 0px 0px 15px rgba(0, 0, 0, 0.15);
  display: flex;
  flex-direction: column;
  z-index: 1;
  cursor: pointer;
  font-size: 1.2rem;
  line-height: 120%;
  width:350px;
  background:#fff;
  line-height:90%;
  transform: translatey(0px);

  animation: floating 2.0s ease-in-out infinite;

}

@keyframes floating {
  0%{
    transform: translatey(0px);
  }
  50%{
    transform: translatey(-20px);
  }
  100%{
    transform: translatey(0px);
  }
  
}
  .icon-whats-chat{
    background:#25D366;
    width:54px;
    height:54px;
    border-radius:50%;
    text-align:center;
    justify-content: center;
    display:flex;
    top:22px;
    left:-28px;
    color:#fff;
    font-weight:bold;
    font-size:28px;
    padding:12px;
    position:absolute;
  }

@media screen and (max-width:599px){
  .card_whats_doubts{
    width:100%;
    right:0px;
    left:px;
    bottom:0px;
    border-radius:0px;
    animation:none;
    padding: 0.8rem 2rem 0.8rem 5.6rem;
  }
  .icon-whats-chat{
    top:50%;
    margin-top:-27px;
    left:14px;
  }
}

.custom-carency-plan{
  max-width:800px;
  margin:0 auto;
  margin-top:-90px;
}
@media screen and (max-width:575px){
  .custom-carency-plan{
    margin-top:-50px;
  }
}

.list-razonet-apps{
  width:fit-content;
}
@media screen and (max-width:577px){
  .list-razonet-apps{ width: 100%; }
}


.rounded-custom-10{
  border-radius:10px;
}


/* popup */
#mainApp{
  padding:0px !important;
}


#dialog{
  background:rgba(0 0 0 /.8);
  width: 100%;
  height:100%;
  display:flex;
  justify-content: center;
  align-items: center;

  position:fixed;
  top:0;
  bottom:0;
  left:0;
  right:0;

  pointer-events: none;
  visibility: hidden;
  opacity:0;

  transition-duration:0.2s;
  -webkit-transition-duration:0.2s;
  -moz-transition-duration:0.2s;
  
  z-index:200;
  transform: scale3d(0);
  animation: ease-in-out;
}
#dialog.open{
  pointer-events: visible;
  visibility: visible;
  opacity:1;
  transform: scale3d(1);
}
.dialog-pop{
  max-width:90%;
  width:550px;
  padding:32px;
  z-index: 200;
  border-radius:8px;
  box-shadow:0px 0px 10px #333;
  background:#fff;
  border:0px;
  display:flex;
  flex-direction:column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.size-icon-dialog{
  font-size:82px;
}

@media screen and (max-width:599px){
  #dialog{
    padding:24px;
  }
  .size-icon-dialog{ font-size:54px; }

  .dialog-pop{
    padding:22px
  }
  .dialog-pop .lead{
    font-size:1rem !important;
  }
}
/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS (and SCSS, if configured) file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *


 */

:root {
  --defaultFont: "Heebo", "Verdana", "Helvetica", "Arial", sans-serif;

  /* color base 30B2E6 */
  --primary-color: #2eb2ff;
  --second-color: #222f33;
  --third-color: #333333;
  --fourth-color: #6b6b6b;
  --fiveth-color: #efefef;

  --primary-color-variant: #1f5fa4;
  --light-color: #fff;
  --accent-color: #74ff21;

  --size-1: 14px;
  --size-2: 16px;
  --size-3: 18px;
  --size-4: 20px;
  --size-5: 24px;
  --size-6: 32px;
  --size-7: 40px;
  --size-8: 48px;
  --size-9: 90px;
  --size-10: 60px;

  --shadow-params: 0 0px 30px 0 rgba(0, 0, 0, 0.137);
}

* {
  margin: 0;
  padding: 0;
  border: 0;
  border-collapse: collapse;
  border-spacing: 0;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  -o-box-sizing: border-box;
  outline: 0;
  text-decoration: none;
  list-style: none;
  vertical-align: baseline;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-size: 1em;
  font-family: var(--defaultFont);
  color: var(--second-color);
}
html {
  scroll-behavior: smooth;
  background: var(--primary-color);
}

/* DEFAULT CONFIGS */
.flex,
.flexWrap,
.flexColumn,
.flexColReverse,
.flexRow,
.flexRowReverse {
  display: flex;
}

.flexWrap {
  flex-wrap: wrap;
}
.flexColumn {
  flex-direction: column;
}
.flexColReverse {
  flex-direction: column-reverse;
}
.flexRow {
  flex-direction: row;
}
.flexRowReverse {
  flex-direction: row-reverse;
}

.spaceBetween {
  justify-content: space-between;
}
.spaceEvenly {
  justify-content: space-evenly;
}
.spaceAround {
  justify-content: space-around;
}

.hCenter {
  justify-content: center;
}
.vCenter {
  align-items: center;
}

img {
  width: auto;
  max-width: 100%;
  display: flex;
}

a,
button,
.transition {
  transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  -moz-transition-duration: 0.2s;
}

p {
  line-height: 1.5em;
}

/* Containers, Wrappers and Contents */
main {
  width: 100%;
  height: auto;
  padding: 32px 24px;
}
.content_full {
  width: 100%;
  height: auto;
  padding: 90px 24px;
  background: var(--light-color);
}

@media screen and (max-width: 940px) {
  .content_full {
    padding-top: 72px;
    padding-bottom: 72px;
  }
}
@media screen and (max-width: 720px) {
  .content_full {
    padding-top: 48px;
    padding-bottom: 48px;
  }
}

.wrapper {
  display: flex;
  margin: 0 auto;
  max-width: 1194px;
}

/* Default titles */
.main__title {
  font-size: var(--size-8);
  font-weight: 700;
  line-height: 100%;
  margin-bottom: 32px;
}
.big__title {
  font-size: var(--size-7);
  font-weight: 500;
  margin-bottom: 24px;
  line-height: 100%;
}
.medium__title {
  font-size: var(--size-6);
  font-weight: 600;
  margin-bottom: 24px;
  line-height: 100%;
}
.legend__infos {
  font-size: var(--size-5);
}

@media screen and (max-width: 720px) {
  .main__title {
    font-size: var(--size-6);
  }
  .big__title {
    font-size: var(--size-6);
    margin-bottom: 12px;
  }
  .medium__title {
    font-size: var(--size-4);
  }
  .legend__infos {
    font-size: var(--size-3);
  }
}

.text--center {
  justify-content: center;
  text-align: center;
}

/* Details */
.accent--text {
  color: var(--primary-color);
}
.gold--text {
  color: var(--accent-color);
}

/* others elements */
.halfColumn {
  width: 50%;
  display: flex;
}
.bgGray {
  background: #efefef;
}
.color-detail {
  color: var(--primaryColor);
}

.debug {
  border: 2px solid red !important;
}