/* FONT SIZES */
/* COLORS */
@font-face {
  font-family: 'Consul Co Headline';
  src: url("../webfonts/ConsulCoHeadline-Bold.woff2") format("woff2"), url("../webfonts/ConsulCoHeadline-Bold.woff") format("woff");
  font-weight: bold;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Consul Co Headline';
  src: url("../webfonts/ConsulCoHeadline-Light.woff2") format("woff2"), url("../webfonts/ConsulCoHeadline-Light.woff") format("woff");
  font-weight: 300;
  font-style: normal;
  font-display: swap; }
@font-face {
  font-family: 'Consul Co Headline';
  src: url("../webfonts/ConsulCoHeadline-Regular.woff2") format("woff2"), url("../webfonts/ConsulCoHeadline-Regular.woff") format("woff");
  font-weight: normal;
  font-style: normal;
  font-display: swap; }
body {
  font-family: "Consul Co Headline";
  font-size: 12px;
  color: #000;
  overflow-x: hidden; }

.btn {
  width: 100%;
  border-radius: 40px;
  color: #fff;
  border: none;
  text-align: center;
  transition: all 0.2s ease-out;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  padding: 10px 0; }
  @media (min-width: 768px) {
    .btn {
      width: auto;
      display: inline-block;
      padding: 10px 40px;
      width: 200px; } }
  .btn svg {
    width: 9px; }
  .btn.btn-color1 {
    background: #A6CE39; }
    .btn.btn-color1:hover, .btn.btn-color1:focus {
      background: #fff;
      color: #A6CE39; }
      .btn.btn-color1:hover .fill, .btn.btn-color1:focus .fill {
        fill: #A6CE39; }
  .btn.btn-color2 {
    background: #7BB525; }
    .btn.btn-color2:hover, .btn.btn-color2:focus {
      background: #fff;
      color: #7BB525; }
      .btn.btn-color2:hover .fill, .btn.btn-color2:focus .fill {
        fill: #7BB525; }
  .btn.btn-color2-custom {
    background: #702C91;
    border: 1px solid #7BB525; }
    .btn.btn-color2-custom:hover, .btn.btn-color2-custom:focus {
      background: #fff;
      color: #7BB525; }
      .btn.btn-color2-custom:hover .fill, .btn.btn-color2-custom:focus .fill {
        fill: #7BB525; }
  .btn.btn-color3 {
    background: #FFFFFF; }
    .btn.btn-color3:hover, .btn.btn-color3:focus {
      background: #fff;
      color: #FFFFFF; }
      .btn.btn-color3:hover .fill, .btn.btn-color3:focus .fill {
        fill: #FFFFFF; }
  .btn.btn-color4 {
    background: #702C91;
    border: 1px solid #702C91; }
    .btn.btn-color4:hover, .btn.btn-color4:focus {
      background: #fff;
      color: #702C91; }
      .btn.btn-color4:hover .fill, .btn.btn-color4:focus .fill {
        fill: #702C91; }

.border-2 {
  border-width: 2px; }

.border-3 {
  border-width: 3px; }

.text-color1 {
  color: #A6CE39; }

.text-color2 {
  color: #7BB525; }

.text-color3 {
  color: #FFFFFF; }

.text-color4 {
  color: #702C91; }

.bg-color1 {
  background-color: #A6CE39; }

.bg-color2 {
  background-color: #7BB525; }

.bg-color2-rgba {
  background-color: rgba(123, 181, 37, 0.6); }

.bg-color3 {
  background-color: #FFFFFF; }

.bg-color4 {
  background-color: #702C91; }

.bg-color5 {
  background-color: #575757; }

.border-color-white {
  border-color: #fff; }

@media (min-width: 992px) {
  .default-modal .modal-dialog {
    max-width: 700px; } }
.default-modal .modal-content {
  background: transparent;
  border-radius: 0;
  border: 2px solid #7BB525;
  margin-top: 40px; }
  @media (min-width: 768px) {
    .default-modal .modal-content {
      margin-top: 0; } }
.default-modal .modal-header {
  padding: 0;
  border: none;
  position: relative; }
  .default-modal .modal-header .close {
    position: absolute;
    top: -10px;
    right: -10px;
    opacity: 1;
    background: #FFFFFF;
    color: #7BB525;
    text-shadow: none;
    border-radius: 100px;
    width: 30px;
    height: 30px;
    z-index: 10;
    margin: 0;
    padding: 0; }
    .default-modal .modal-header .close:hover {
      opacity: 1; }
.default-modal .modal-body {
  padding: 0; }
.default-modal iframe {
  width: 100%;
  height: 200px;
  display: block; }
  @media (min-width: 768px) {
    .default-modal iframe {
      height: 275px; } }
  @media (min-width: 992px) {
    .default-modal iframe {
      height: 390px; } }

.font-size-xxxSmall {
  font-size: 10px !important; }

.font-size-xxSmall {
  font-size: 10px !important; }

.font-size-xSmall {
  font-size: 12px !important; }

.font-size-small {
  font-size: 14px !important; }

.font-size-regular {
  font-size: 18px !important; }

.font-size-medium {
  font-size: 25px !important; }

.font-size-large {
  font-size: 32px !important; }

.font-size-xLarge {
  font-size: 42px !important; }

.font-size-xxLarge {
  font-size: 55px !important; }

.font-size-xxxLarge {
  font-size: 65px !important; }

@media (min-width: 768px) {
  .font-size-md-xxxSmall {
    font-size: 10px !important; }

  .font-size-md-xxSmall {
    font-size: 10px !important; }

  .font-size-md-xSmall {
    font-size: 12px !important; }

  .font-size-md-small {
    font-size: 14px !important; }

  .font-size-md-regular {
    font-size: 18px !important; }

  .font-size-md-medium {
    font-size: 25px !important; }

  .font-size-md-large {
    font-size: 32px !important; }

  .font-size-md-xLarge {
    font-size: 42px !important; }

  .font-size-md-xxLarge {
    font-size: 55px !important; }

  .font-size-md-xxxLarge {
    font-size: 65px !important; } }
@media (min-width: 992px) {
  .font-size-lg-xxxSmall {
    font-size: 10px !important; }

  .font-size-lg-xxSmall {
    font-size: 10px !important; }

  .font-size-lg-xSmall {
    font-size: 12px !important; }

  .font-size-lg-small {
    font-size: 14px !important; }

  .font-size-lg-regular {
    font-size: 18px !important; }

  .font-size-lg-medium {
    font-size: 25px !important; }

  .font-size-lg-large {
    font-size: 32px !important; }

  .font-size-lg-xLarge {
    font-size: 42px !important; }

  .font-size-lg-xxLarge {
    font-size: 55px !important; }

  .font-size-lg-xxxLarge {
    font-size: 65px !important; } }
@media (min-width: 1200px) {
  .font-size-xl-xxxSmall {
    font-size: 10px !important; }

  .font-size-xl-xxSmall {
    font-size: 10px !important; }

  .font-size-xl-xSmall {
    font-size: 12px !important; }

  .font-size-xl-small {
    font-size: 14px !important; }

  .font-size-xl-regular {
    font-size: 18px !important; }

  .font-size-xl-medium {
    font-size: 25px !important; }

  .font-size-xl-large {
    font-size: 32px !important; }

  .font-size-xl-xLarge {
    font-size: 42px !important; }

  .font-size-xl-xxLarge {
    font-size: 55px !important; }

  .font-size-xl-xxxLarge {
    font-size: 65px !important; } }
.font-family1 {
  font-family: "Consul Co Headline"; }

img {
  max-width: 100%; }

.wrapper {
  width: 100%;
  max-width: 1400px;
  margin: 0 auto; }
  .wrapper .z-index-0 {
    z-index: 0 !important; }
  .wrapper .z-index-1 {
    z-index: 1 !important; }
  .wrapper #heading {
    background: transparent url("../images/header_img_full.jpg") 0 0 no-repeat padding-box;
    background-size: cover; }
    @media (min-width: 768px) {
      .wrapper #heading {
        background-image: url("../images/header_img_crop.jpg"); } }
    .wrapper #heading .message {
      position: absolute;
      bottom: 0;
      right: 15px; }
  @media (min-width: 992px) {
    .wrapper #aspects .row div:first-child p:last-child {
      margin-top: 4rem !important; }
    .wrapper #aspects .row div:last-child {
      position: relative; }
      .wrapper #aspects .row div:last-child img {
        position: absolute;
        bottom: 0;
        right: 0; } }
  @media (min-width: 768px) {
    .wrapper #aspects .row div:last-child {
      position: relative; }
      .wrapper #aspects .row div:last-child img {
        position: absolute;
        bottom: 0;
        right: 0; } }
  .wrapper #economize {
    background: #A6CE39; }
    .wrapper #economize .selector li {
      margin-right: 20px;
      position: relative; }
      @media (min-width: 768px) {
        .wrapper #economize .selector li {
          margin-right: 60px; } }
      .wrapper #economize .selector li:last-child {
        margin-right: 0; }
        .wrapper #economize .selector li:last-child::after {
          display: none; }
      .wrapper #economize .selector li::after {
        content: '\f105';
        font-family: 'FontAwesome';
        color: #fff;
        font-size: 20px;
        position: absolute;
        top: 3px;
        right: -15px; }
        @media (min-width: 768px) {
          .wrapper #economize .selector li::after {
            top: 0;
            right: -40px;
            font-size: 40px; } }
    .wrapper #economize .selector button {
      border: none;
      padding: 0;
      background: transparent; }
      .wrapper #economize .selector button.active img {
        opacity: 1; }
      .wrapper #economize .selector button img {
        width: 70px;
        opacity: 0.6; }
        @media (min-width: 768px) {
          .wrapper #economize .selector button img {
            width: 120px;
            opacity: 0.4; } }
    .wrapper #economize #economize-steps .step {
      display: none;
      max-width: 320px;
      margin: 0 auto;
      position: relative; }
      @media (min-width: 768px) {
        .wrapper #economize #economize-steps .step {
          max-width: 100%;
          margin: 0; } }
      @media (min-width: 768px) {
        .wrapper #economize #economize-steps .step .message {
          position: absolute;
          left: 15px;
          bottom: 15px;
          color: #702C91; } }
      .wrapper #economize #economize-steps .step .step-wrap {
        border-radius: 25px;
        background: #702C91;
        display: flex;
        flex-direction: column;
        position: relative; }
        @media (min-width: 768px) {
          .wrapper #economize #economize-steps .step .step-wrap {
            border-radius: 0;
            background: transparent; } }
        .wrapper #economize #economize-steps .step .step-wrap .btn-next {
          background: #fff;
          border: none;
          border-radius: 100px;
          padding: 0;
          width: 28px;
          height: 28px;
          display: inline-block;
          color: #A6CE39;
          text-align: center;
          line-height: 28px;
          position: absolute;
          top: calc(50% - 14px);
          right: -14px; }
          @media (min-width: 768px) {
            .wrapper #economize #economize-steps .step .step-wrap .btn-next {
              display: none; } }
          .wrapper #economize #economize-steps .step .step-wrap .btn-next i {
            margin-left: 3px; }
        .wrapper #economize #economize-steps .step .step-wrap .step-image {
          order: 2;
          -webkit-border-bottom-right-radius: 25px;
          -webkit-border-bottom-left-radius: 25px;
          -moz-border-radius-bottomright: 25px;
          -moz-border-radius-bottomleft: 25px;
          border-bottom-right-radius: 25px;
          border-bottom-left-radius: 25px;
          overflow: hidden; }
          @media (min-width: 768px) {
            .wrapper #economize #economize-steps .step .step-wrap .step-image {
              border-radius: 0; } }
        .wrapper #economize #economize-steps .step .step-wrap .step-box {
          order: 1;
          padding: 30px; }
          @media (min-width: 768px) {
            .wrapper #economize #economize-steps .step .step-wrap .step-box {
              border-radius: 25px;
              background: rgba(112, 44, 145, 0.75);
              position: absolute;
              max-width: 350px; } }
          @media (min-width: 768px) {
            .wrapper #economize #economize-steps .step .step-wrap .step-box .title {
              line-height: 25px; } }
          .wrapper #economize #economize-steps .step .step-wrap .step-box .number {
            border-radius: 100px;
            width: 30px;
            height: 30px;
            text-align: center;
            line-height: 30px;
            font-size: 20px;
            background: #7BB525;
            display: inline-block;
            flex-shrink: 0; }
            @media (min-width: 768px) {
              .wrapper #economize #economize-steps .step .step-wrap .step-box .number {
                width: 50px;
                height: 50px;
                line-height: 50px;
                font-size: 30px; } }
    @media (min-width: 768px) {
      .wrapper #economize #step-1 .step-box {
        right: 20px;
        top: 40px; } }
    @media (min-width: 992px) {
      .wrapper #economize #step-1 .step-box {
        top: 60px; } }
    @media (min-width: 768px) {
      .wrapper #economize #step-2 .step-box {
        right: 20px;
        top: 140px; } }
    @media (min-width: 992px) {
      .wrapper #economize #step-2 .step-box {
        top: auto;
        bottom: 40px; } }
    @media (min-width: 768px) {
      .wrapper #economize #step-3 .step-box {
        left: 40px;
        top: 40px; } }
    @media (min-width: 768px) {
      .wrapper #economize #step-4 .step-box {
        left: 40px;
        top: 40px; } }
  @media (min-width: 768px) {
    .wrapper #reuse .message {
      position: absolute;
      bottom: 15px;
      right: 15px; } }
  .wrapper #for-you img {
    z-index: 1; }
  @media (min-width: 992px) {
    .wrapper #for-you .message {
      position: absolute;
      bottom: 15px;
      right: 15px; } }
  .wrapper #for-you .box {
    border-radius: 25px;
    margin-right: 150px;
    margin-left: -90px;
    z-index: 0;
    background-color: white; }
    @media (min-width: 992px) {
      .wrapper #for-you .box {
        /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#d3d3d3+0,ffffff+13 */
        background: lightgray;
        /* Old browsers */
        background: -moz-linear-gradient(left, lightgray 0%, white 13%);
        /* FF3.6-15 */
        background: -webkit-linear-gradient(left, lightgray 0%, white 13%);
        /* Chrome10-25,Safari5.1-6 */
        background: linear-gradient(to right, lightgray 0%, white 13%);
        /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d3d3d3', endColorstr='#ffffff',GradientType=1 );
        /* IE6-9 */ } }
    .wrapper #for-you .box span:not(.active) {
      display: none; }
  .wrapper #for-you .box {
    text-align: center;
    margin-left: 0 !important;
    margin-right: 0 !important; }
    @media (min-width: 992px) {
      .wrapper #for-you .box {
        text-align: left; } }
    @media (min-width: 1200px) {
      .wrapper #for-you .box {
        padding-left: 100px !important; } }
  .wrapper #for-you .step {
    display: none; }
  .wrapper #for-you #for-you-step-1 {
    display: block; }
  .wrapper #for-you button {
    border: 1px solid #702C91;
    background-color: #7BB525;
    color: white;
    border-radius: 100px;
    width: 20px;
    height: 20px;
    font-size: 10px; }
    @media (min-width: 992px) {
      .wrapper #for-you button {
        width: 25px;
        height: 25px;
        font-size: 15px; } }
    .wrapper #for-you button.active {
      background-color: #702C91; }
  .wrapper #for-you .selector {
    width: 327px; }
    @media (min-width: 992px) {
      .wrapper #for-you .selector {
        width: 472px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you .selector {
        width: 570px; } }
  .wrapper #for-you #button-step-1 {
    top: 20px;
    left: 190px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-1 {
        top: 32px;
        left: 290px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-1 {
        top: 38px;
        left: 352px; } }
  .wrapper #for-you #button-step-2 {
    top: 155px;
    left: 155px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-2 {
        top: 220px;
        left: 230px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-2 {
        top: 280px;
        left: 280px; } }
  .wrapper #for-you #button-step-3 {
    top: 130px;
    left: 105px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-3 {
        top: 195px;
        left: 150px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-3 {
        top: 235px;
        left: 180px; } }
  .wrapper #for-you #button-step-4 {
    top: 49px;
    left: 49px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-4 {
        top: 74px;
        left: 79px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-4 {
        top: 92px;
        left: 99px; } }
  .wrapper #for-you #button-step-5 {
    top: 35px;
    left: 116px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-5 {
        top: 50px;
        left: 166px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-5 {
        top: 60px;
        left: 200px; } }
  .wrapper #for-you #button-step-6 {
    top: 14px;
    left: 124px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-6 {
        top: 20px;
        left: 175px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-6 {
        top: 30px;
        left: 215px; } }
  .wrapper #for-you #button-step-7 {
    top: 57px;
    left: 122px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-7 {
        top: 80px;
        left: 170px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-7 {
        top: 95px;
        left: 205px; } }
  .wrapper #for-you #button-step-8 {
    top: 72px;
    left: 140px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-8 {
        top: 106px;
        left: 195px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-8 {
        top: 125px;
        left: 230px; } }
  .wrapper #for-you #button-step-9 {
    top: 235px;
    left: 252px; }
    @media (min-width: 992px) {
      .wrapper #for-you #button-step-9 {
        top: 345px;
        left: 362px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you #button-step-9 {
        top: 425px;
        left: 442px; } }
  .wrapper #for-you .for-you-selector {
    display: flex;
    justify-content: center; }
    @media (min-width: 992px) {
      .wrapper #for-you .for-you-selector {
        margin-right: -60px; } }
    @media (min-width: 1200px) {
      .wrapper #for-you .for-you-selector {
        margin-right: -80px; } }
  .wrapper #about .bg-panel {
    z-index: 1000;
    background: transparent url("../images/painel_bg.svg") 0 0 no-repeat padding-box;
    background-size: cover; }
    .wrapper #about .bg-panel .row div {
      border-radius: 25px; }
  @media (min-width: 992px) {
    .wrapper #about .t-shirt .message {
      position: absolute;
      bottom: 15px;
      right: 15px; } }
  .wrapper #about .t-shirt .box {
    text-align: center;
    margin: 0;
    border-radius: 25px;
    background-color: #7BB525; }
    @media (min-width: 992px) {
      .wrapper #about .t-shirt .box {
        width: 550px;
        margin-left: -310px;
        background: transparent linear-gradient(-90deg, #A6CE39 0%, #7BB525 100%) 0% 0% no-repeat padding-box; } }
    @media (min-width: 1200px) {
      .wrapper #about .t-shirt .box {
        width: 510px; } }
  @media (min-width: 992px) {
    .wrapper #about .t-shirt .condition {
      width: 470px;
      margin-left: -230px; } }
  @media (min-width: 1200px) {
    .wrapper #about .t-shirt .condition {
      width: 470px;
      margin-left: -270px; } }
  .wrapper #about .t-shirt .shirt .sparkle {
    position: absolute;
    width: 30px;
    animation-duration: 1s;
    animation-name: sparkle;
    animation-iteration-count: infinite; }
    @media (min-width: 768px) {
      .wrapper #about .t-shirt .shirt .sparkle {
        width: 40px; } }
    @media (min-width: 992px) {
      .wrapper #about .t-shirt .shirt .sparkle {
        width: 50px; } }
    .wrapper #about .t-shirt .shirt .sparkle.sparkle-2, .wrapper #about .t-shirt .shirt .sparkle.sparkle-3 {
      animation-delay: 0.5s; }
  .wrapper #about .t-shirt .shirt .sparkle-1 {
    top: 50px;
    left: 70px; }
    @media (min-width: 768px) {
      .wrapper #about .t-shirt .shirt .sparkle-1 {
        top: 80px;
        left: 150px; } }
    @media (min-width: 992px) {
      .wrapper #about .t-shirt .shirt .sparkle-1 {
        top: 50px;
        left: 140px; } }
    @media (min-width: 1200px) {
      .wrapper #about .t-shirt .shirt .sparkle-1 {
        top: 90px;
        left: 162px; } }
  .wrapper #about .t-shirt .shirt .sparkle-2 {
    top: 10px;
    left: 210px; }
    @media (min-width: 768px) {
      .wrapper #about .t-shirt .shirt .sparkle-2 {
        top: 30px;
        left: 420px; } }
    @media (min-width: 992px) {
      .wrapper #about .t-shirt .shirt .sparkle-2 {
        top: 15px;
        left: 362px; } }
    @media (min-width: 1200px) {
      .wrapper #about .t-shirt .shirt .sparkle-2 {
        top: 24px;
        left: 436px; } }
  .wrapper #about .t-shirt .shirt .sparkle-3 {
    top: 130px;
    left: 120px; }
    @media (min-width: 768px) {
      .wrapper #about .t-shirt .shirt .sparkle-3 {
        top: 256px;
        left: 236px; } }
    @media (min-width: 992px) {
      .wrapper #about .t-shirt .shirt .sparkle-3 {
        top: 200px;
        left: 200px; } }
    @media (min-width: 1200px) {
      .wrapper #about .t-shirt .shirt .sparkle-3 {
        top: 260px;
        left: 244px; } }
  .wrapper #about .t-shirt .shirt .sparkle-4 {
    top: 110px;
    left: 244px; }
    @media (min-width: 768px) {
      .wrapper #about .t-shirt .shirt .sparkle-4 {
        top: 184px;
        left: 476px; } }
    @media (min-width: 992px) {
      .wrapper #about .t-shirt .shirt .sparkle-4 {
        top: 150px;
        left: 416px; } }
    @media (min-width: 1200px) {
      .wrapper #about .t-shirt .shirt .sparkle-4 {
        top: 170px;
        left: 495px; } }
@keyframes sparkle {
  0% {
    transform: scale(1); }
  50% {
    transform: scale(0.3); }
  100% {
    transform: scale(1); } }
  .wrapper #about .heavy-clothes .box {
    border-radius: 25px;
    margin-right: -90px;
    margin-left: 30px;
    background-color: #702C91; }
    @media (min-width: 992px) {
      .wrapper #about .heavy-clothes .box {
        background: transparent linear-gradient(90deg, #702C91 0%, #381649 100%) 0% 0% no-repeat padding-box; } }
  @media (min-width: 992px) {
    .wrapper #about .heavy-clothes .message {
      position: absolute;
      left: 15px;
      bottom: 15px; } }
  @media (max-width: 768px) {
    .wrapper #about .heavy-clothes .box {
      text-align: center !important;
      margin: 10px 50px; } }
  .wrapper #about .fuel {
    position: relative; }
    @media (min-width: 768px) {
      .wrapper #about .fuel {
        background-image: url("../images/dispenser_img.png");
        background-position: left center;
        background-repeat: no-repeat;
        background-size: 400px auto; } }
    @media (min-width: 992px) {
      .wrapper #about .fuel {
        background-size: 550px auto; } }
    @media (min-width: 1200px) {
      .wrapper #about .fuel {
        background-size: 660px auto; } }
    @media (min-width: 768px) {
      .wrapper #about .fuel .message {
        position: absolute;
        bottom: 15px;
        left: 15px; } }
  @media (min-width: 992px) {
    .wrapper #measure .message {
      position: absolute;
      right: 15px;
      bottom: 15px; } }

/*# sourceMappingURL=style.css.map */