/* end vars */
/* mixings */
@font-face {
  font-family: 'ubuntu';
  src: url("../fonts/ubuntu-r-webfont.html") format("woff2"), url("../fonts/ubuntu-r-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'ubuntubold';
  src: url("../fonts/ubuntu-b-webfont.html") format("woff2"), url("../fonts/ubuntu-b-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }
@font-face {
  font-family: 'ubuntulight';
  src: url("../fonts/ubuntu-l-webfont.html") format("woff2"), url("../fonts/ubuntu-l-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal; }
* {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; }

body {
  margin: 0;
  padding: 0;
  font-family: 'ubuntu';
  overflow-x: hidden; }

.row:after, .row:before, .form-row:after, .form-row:before {
  display: table;
  content: " ";
  clear: both; }

.nobr {
  white-space: nowrap; }

.clear {
  clear: both; }

.pull-left {
  float: left; }

.pull-right {
  float: right; }

.orange {
  color: #ff7212; }

.row {
  margin: 0 -15px; }
  .row .col {
    width: 100%;
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    float: left; }
  @media screen and (min-width: 768px) {
    .row {
      /* push */
      /* push */
      /* pull */
      /* pull */ }
      .row .col-1 {
        width: 8.333%; }
      .row .col-2 {
        width: 16.666%; }
      .row .col-3 {
        width: 25%; }
      .row .col-4 {
        width: 33.333%; }
      .row .col-5 {
        width: 41.666%; }
      .row .col-7 {
        width: 58.333%; }
      .row .col-6 {
        width: 50%; }
      .row .col-8 {
        width: 66.666%; }
      .row .col-9 {
        width: 75%; }
      .row .col-xs-1-5 {
        width: 20%; }
      .row .col-xs-4-5 {
        width: 80%; }
      .row .push-1 {
        left: 8.333%; }
      .row .push-2 {
        left: 16.666%; }
      .row .push-3 {
        left: 25%; }
      .row .push-5 {
        left: 41.666%; }
      .row .push-6 {
        left: 50%; }
      .row .push-7 {
        left: 58.333%; }
      .row .pull-1 {
        left: -8.333%; }
      .row .pull-2 {
        left: -16.666%; }
      .row .pull-3 {
        left: -25%; }
      .row .pull-5 {
        left: -41.666%; }
      .row .pull-6 {
        left: -50%; }
      .row .pull-7 {
        left: -58.333%; } }

.img-responsive {
  max-width: 100%;
  width: 100%; }

.text-left {
  text-align: left; }

.text-right {
  text-align: right; }

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

@media (min-width: 1200px) {
  .container {
    width: 1170px;
    margin: 0 auto; }

  .hidden-desktop {
    display: none !important; } }
@media (min-width: 768px) and (max-width: 1199px) {
  .container {
    width: 748px;
    margin: 0 auto;
    padding: 0 15px; }

  .hidden-tablet {
    display: none !important; } }
@media (max-width: 767px) {
  .container {
    width: 100%;
    margin: 0 auto;
    padding: 0 20px; }

  .hidden-mobile {
    display: none !important; }

  .col-xs-6 {
    width: 50% !important; } }
.clear {
  clear: both; }

.slick-dots {
  padding: 0;
  list-style: none;
  width: 100%;
  text-align: center;
  padding-top: 20px; }

.slick-dots li {
  text-align: center;
  display: inline-block; }

.slick-dots li button {
  outline: 0;
  width: 12px;
  height: 12px;
  margin: 5px 7px;
  display: inline-block;
  -webkit-backface-visibility: visible;
  -webkit-transition: opacity 200ms ease;
  -moz-transition: opacity 200ms ease;
  -ms-transition: opacity 200ms ease;
  -o-transition: opacity 200ms ease;
  transition: opacity 200ms ease;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
  border-radius: 30px;
  text-indent: -999999px;
  border: none;
  background: #cccccc;
  cursor: pointer; }

.slick-dots li.slick-active button {
  background: white; }

.slick-arrow {
  width: 22px;
  height: 39px;
  border: none;
  position: absolute;
  background-color: transparent;
  top: 200px;
  text-indent: -9999px;
  z-index: 100000; }

.slick-arrow.slick-next {
  background-image: url("../img/next-arrow.png");
  right: -60px; }

.slick-arrow.slick-prev {
  background-image: url("../img/prev-arrow.png");
  left: -60px; }

#top-bar {
  height: 60px;
  padding: 0;
  background-color: #ff7200; }
  #top-bar .terra-logo {
    width: 150px;
    margin: 0 auto;
    display: block; }

#display {
  background-color: #1b7ec9; }
  #display .man-image {
    margin: 20px 0;
    width: 70%; }
  #display .price-btn {
    padding-top: 30px; }
    @media (max-width: 767px) {
      #display .price-btn {
        padding: 20px; } }
  #display .display-logo {
    margin-top: 70px; }
  #display .title {
    font-family: 'ubuntulight';
    color: white;
    font-size: 38px;
    font-weight: 100;
    margin-top: 30px;
    margin-bottom: 30px; }
  #display .btn {
    background-color: #c3da00;
    text-align: center;
    font-family: 'ubuntubold';
    font-size: 25px;
    text-transform: uppercase;
    color: #115e96;
    max-width: 350px;
    width: 100%;
    text-decoration: none;
    display: block;
    padding-top: 20px;
    padding-bottom: 20px;
    margin: 0 auto 40px;
    border-radius: 5px; }
  #display .price-holder {
    width: 300px;
    margin: 0 auto; }
    #display .price-holder .apenas {
      float: left;
      text-align: right; }
      #display .price-holder .apenas .text {
        font-family: 'ubuntulight';
        font-size: 25px;
        margin-top: 6px;
        color: #fff; }
      #display .price-holder .apenas .currency {
        font-size: 32px;
        color: #fff;
        font-weight: bold;
        font-family: 'ubuntubold'; }
    #display .price-holder .price {
      float: left; }
      #display .price-holder .price .int {
        color: #fff;
        font-size: 102px;
        line-height: 110px;
        font-family: 'ubuntubold';
        font-weight: bold; }
        @media (max-width: 767px) {
          #display .price-holder .price .int {
            font-size: 80px; } }
    #display .price-holder .cents {
      float: left; }
      #display .price-holder .cents .number {
        color: #fff;
        font-size: 54px;
        line-height: 60px;
        font-family: 'ubuntubold';
        font-weight: bold;
        margin-top: 5px; }
        @media (max-width: 767px) {
          #display .price-holder .cents .number {
            font-size: 44px; } }
      #display .price-holder .cents .freq {
        font-family: 'ubuntulight';
        color: #fff;
        text-transform: uppercase;
        font-size: 20px; }

#text {
  height: 770px;
  background-color: #385e93;
  padding-top: 60px; }
  #text .title {
    text-align: center;
    font-family: 'ubuntulight';
    color: white;
    font-size: 42px;
    font-weight: 100;
    margin: 0 0 40px; }
    #text .title b {
      font-weight: bold;
      font-family: 'ubuntu'; }

#steps .intro .title {
  font-family: 'ubuntulight';
  text-align: center;
  color: #1b7ec9;
  font-size: 42px;
  font-weight: 100;
  margin-bottom: 50px; }
  #steps .intro .title b {
    font-weight: bold;
    font-family: 'ubuntu'; }
#steps .step {
  font-size: 0; }
  #steps .step .step-top {
    margin-top: 60px;
    margin-bottom: 40px; }
    #steps .step .step-top .number-holder {
      float: left; }
      #steps .step .step-top .number-holder .number {
        width: 80px;
        height: 80px;
        background-color: #c3da00;
        text-align: center;
        color: #1b7ec9;
        font-weight: bold;
        font-size: 64px;
        line-height: 80px;
        border-radius: 50%;
        margin-top: 5px; }
    #steps .step .step-top .text-holder {
      margin-left: 100px; }
      #steps .step .step-top .text-holder .v-table {
        display: table;
        width: 100%;
        height: 90px;
        vertical-align: middle; }
        #steps .step .step-top .text-holder .v-table .text {
          display: table-cell;
          vertical-align: middle;
          width: 100%;
          font-size: 28px;
          font-family: 'ubuntu';
          color: #1b7ec9; }
  #steps .step.step-blue {
    background-color: #1b7ec9; }
    #steps .step.step-blue .step-top .text-holder .v-table .text {
      color: white; }
  #steps .step.step-white .step-image {
    margin-top: 80px; }
  #steps .step.step-3 .step-image {
    margin-top: 80px; }
  #steps .step .carousel-holder .button {
    width: 30px;
    height: 49px;
    background: none;
    background-repeat: no-repeat;
    border: none;
    margin-top: 120px; }
    #steps .step .carousel-holder .button.button-next {
      float: right;
      background-image: url("../img/next-arrow.png"); }
    #steps .step .carousel-holder .button.button-prev {
      float: left;
      background-image: url("../img/prev-arrow.png"); }
  #steps .step .carousel-holder #carousel {
    width: 600px;
    height: 300px;
    position: relative;
    margin: 0 auto; }

#boxes .title {
  color: #c3da00;
  text-align: center;
  font-weight: 100;
  font-family: 'ubuntulight';
  font-size: 42px;
  margin-bottom: 60px; }
  #boxes .title b {
    font-weight: bold;
    font-family: 'ubuntu'; }
#boxes .box .box-holder {
  margin: 0 15px;
  background-color: #f1f1f1;
  padding: 0 20px 20px;
  text-align: center;
  height: 230px; }
  #boxes .box .box-holder .image {
    margin-bottom: 20px; }
    #boxes .box .box-holder .image img {
      margin-top: -20px; }
  #boxes .box .box-holder .text {
    font-size: 16px;
    color: #333333; }
    #boxes .box .box-holder .text b {
      color: #4b7ec4;
      font-weight: bold;
      font-size: 20px; }

#call {
  padding-bottom: 60px; }
  #call .title {
    font-family: 'ubuntulight';
    font-weight: 100;
    color: #333333;
    font-size: 50px;
    text-align: center;
    margin-bottom: 60px;
    margin-top: 60px; }
  #call .btn {
    background-color: #ff7212;
    text-align: center;
    font-family: 'ubuntubold';
    font-size: 38px;
    text-transform: uppercase;
    color: white;
    max-width: 550px;
    width: 100%;
    text-decoration: none;
    display: block;
    padding-top: 20px;
    padding-bottom: 20px;
    margin: 0 auto 40px;
    border-radius: 5px; }
  #call .price-holder {
    width: 300px;
    margin: 30px auto 0; }
    #call .price-holder .apenas {
      float: left;
      text-align: right; }
      #call .price-holder .apenas .text {
        font-family: 'ubuntulight';
        font-size: 25px;
        margin-top: 6px; }
      #call .price-holder .apenas .currency {
        font-size: 32px;
        color: #4b7ec4;
        font-weight: bold;
        font-family: 'ubuntubold'; }
    #call .price-holder .price {
      float: left; }
      #call .price-holder .price .int {
        color: #4b7ec4;
        font-size: 102px;
        line-height: 110px;
        font-family: 'ubuntubold';
        font-weight: bold; }
    #call .price-holder .cents {
      float: left; }
      #call .price-holder .cents .number {
        color: #4b7ec4;
        font-size: 54px;
        line-height: 60px;
        font-family: 'ubuntubold';
        font-weight: bold;
        margin-top: 5px; }
      #call .price-holder .cents .freq {
        font-family: 'ubuntulight';
        color: #333333;
        text-transform: uppercase;
        font-size: 20px; }

@media (min-width: 768px) and (max-width: 1199px) {
  #display .man-image {
    width: 100%; }
  #display .title {
    font-size: 28px; }
  #display .display-logo {
    width: 100%; }
  #display .display-arrow {
    width: 100%; }

  #text {
    height: 630px; }
    #text .title {
      font-size: 28px; }
    #text .cafe {
      width: 100%; }

  #steps .intro .title {
    font-size: 32px; }
  #steps .step .step-first-image {
    width: 100%; }
  #steps .step .step-image {
    width: 100%; }
  #steps .step .step-top {
    margin-top: 30px;
    margin-bottom: 40px; }
    #steps .step .step-top .text-holder .v-table .text {
      font-size: 20px; }
  #steps .step.step-white {
    padding-bottom: 30px; }
    #steps .step.step-white .step-image {
      margin-top: 120px; }
  #steps .step .carousel-holder .button {
    margin-top: 90px; }
  #steps .step .carousel-holder #carousel {
    width: 420px;
    height: 240px;
    position: relative;
    margin: 0 auto; }
    #steps .step .carousel-holder #carousel img {
      width: 240px; }

  #boxes .box .box-holder {
    height: 190px;
    margin: 0; }
    #boxes .box .box-holder .image img {
      margin-top: -20px;
      max-height: 100px;
      width: auto;
      max-width: 100%; }
    #boxes .box .box-holder .text {
      font-size: 14px; }
      #boxes .box .box-holder .text b {
        font-size: 14px; } }
@media (max-width: 767px) {
  #display {
    text-align: center; }
    #display .container {
      padding-left: 0;
      padding-right: 0; }
      #display .container .row {
        margin-left: 0;
        margin-right: 0; }
        #display .container .row .col {
          padding-left: 0;
          padding-right: 0; }
          #display .container .row .col .mob-padding {
            padding-left: 20px;
            padding-right: 20px; }
    #display .display-logo {
      margin-top: 50px;
      width: 100%; }
    #display .title {
      margin-top: 40px;
      margin-bottom: 40px;
      font-size: 28px; }
    #display .man-image {
      width: 90%;
      margin: 0 auto; }
    #display .display-arrow {
      width: 100%; }

  #text {
    padding-top: 0;
    height: auto; }
    #text .title {
      font-size: 20px;
      margin: 40px 0 40px; }
      #text .title br {
        display: none; }
    #text .display-arrow {
      width: 100%; }
    #text .cafe-holder {
      margin-left: -18px;
      margin-right: -18px;
      margin-bottom: -127px; }
    #text .cafe {
      width: 100%; }

  #steps .arrow .left-mobile {
    text-align: left; }
  #steps .intro {
    margin-top: 130px; }
    #steps .intro .title {
      font-size: 26px; }
  #steps .step .step-top {
    margin-top: 40px;
    margin-bottom: 20px; }
    #steps .step .step-top .number-holder {
      float: none; }
      #steps .step .step-top .number-holder .number {
        width: 60px;
        height: 60px;
        line-height: 60px;
        font-size: 40px;
        margin: 0 auto 30px; }
    #steps .step .step-top .text-holder {
      margin-left: 0; }
      #steps .step .step-top .text-holder .v-table {
        display: block;
        height: auto; }
        #steps .step .step-top .text-holder .v-table .text {
          text-align: center;
          font-size: 24px; }
  #steps .step .step-image, #steps .step .step-first-image {
    width: 100%; }
  #steps .step.step-1 .step-image {
    width: 60%;
    margin: 0 auto;
    display: block;
    margin-top: -40px; }
  #steps .step.step-2 .step-image {
    margin-top: 30px; }
  #steps .step.step-3 .step-image {
    margin-top: 80px;
    width: 60%;
    margin: 50px auto 0;
    display: block; }
  #steps .step .carousel-holder .button {
    margin-top: 73px;
    position: relative;
    z-index: 4;
    outline: none; }
  #steps .step .carousel-holder #carousel {
    width: 300px;
    height: 190px;
    position: relative;
    margin: 0 auto; }
    #steps .step .carousel-holder #carousel img {
      width: 220px;
      opacity: 0.2 !important; }
    #steps .step .carousel-holder #carousel .carousel-center {
      opacity: 1 !important; }

  #boxes .box .box-holder {
    margin: 0 0 60px;
    height: auto; }
    #boxes .box .box-holder .image img {
      width: 100%; }

  #call .btn {
    font-size: 18px; }
  #call .title {
    font-size: 42px;
    margin-top: 0px; }
  #call .price-holder .apenas .text {
    font-size: 20px; } }
@media (max-width: 767px) {
  #header .container {
    padding: 0; } }


.pricing .card {
  border: none;
  border-radius: 1rem;
  transition: all 0.2s;
  box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.1);
}

.pricing hr {
  margin: 1.5rem 0;
}

.pricing .card-title {
  margin: 0.5rem 0;
  font-size: 0.9rem;
  letter-spacing: .1rem;
  font-weight: bold;
}

.pricing .card-price {
  font-size: 3rem;
  margin: 0;
}

.pricing .card-price .period {
  font-size: 0.8rem;
}

.pricing ul li {
  margin-bottom: 1rem;
}

.pricing .text-muted {
  opacity: 0.7;
}

.pricing .btn {
  font-size: 80%;
  border-radius: 5rem;
  letter-spacing: .1rem;
  font-weight: bold;
  padding: 1rem;
  opacity: 0.7;
  transition: all 0.2s;
}

/* Hover Effects on Card */

@media (min-width: 992px) {
  .pricing .card:hover {
    margin-top: -.25rem;
    margin-bottom: .25rem;
    box-shadow: 0 0.5rem 1rem 0 rgba(0, 0, 0, 0.3);
  }
  .pricing .card:hover .btn {
    opacity: 1;
  }
}
.fa, .far, .fas {
    font-family: Font Awesome\ 5 Free;
}
/*# sourceMappingURL=styles.css.map */