body {
  font-family: 'Open Sans', sans-serif;
  color: #4A4A4A;
  font-size: 16px;
  background: #ffffff;
  min-width: 320px;
}

a, button {
  color: #4A4A4A;
  font-size: 16px;
  text-decoration: none;
  transition-property: all;
  transition-duration: 0.15s;
  transition-timing-function: ease-out;
}

a:hover, button:hover {
  text-decoration: none;
  color: black;
}

.reset-p {
  padding: 0 !important;
}

h1, h2, h3, h4, h5 {
  padding: 0;
  margin: 0;
  font-family: 'Exo', sans-serif;
}

.hero {
  background-image: url("../img/bg-hero.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.hero:after {
  display: block;
  content: '';
  width: 100%;
  height: 116px;
  background-image: url("../img/hero_deco.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.hero .container-fluid {
  max-width: 1385px;
  width: 100%;
  margin: 0 auto;
  padding: 0px 60px;
  margin-bottom: -180px;
}

.hero .container-fluid .logo {
  max-width: 171px;
}

.hero .container-fluid .logo img {
  margin-top: 20px;
}

.hero .container-fluid .claim {
  width: 100%;
  max-width: 779px;
}

.hero .container-fluid h1 {
  color: #fff;
  padding-top: 200px;
  margin-bottom: 50px;
  font-size: 42px;
  padding-right: 30%;
}

.hero ul {
  list-style: none;
  padding: 0px;
}

.hero ul li {
  color: #fff;
  margin-bottom: 20px;
  font-size: 18px;
  font-family: 'Exo', sans-serif;
  margin-left: 80px;
  position: relative;
  max-width: 70%;
}

.hero ul li:before {
  display: block;
  position: absolute;
  content: '';
  width: 66px;
  height: 66px;
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
  left: -80px;
}

.hero ul li strong {
  font-size: 26px;
  display: block;
}

.hero .free:before {
  background-image: url("../img/tic-1.png");
}

.hero .join:before {
  background-image: url("../img/tic-2.png");
}

.main-title {
  background: #0D79BF;
  margin-bottom: 10px;
}

.main-title h3 {
  margin: 20px 0px 10px 0px;
  font-size: 28px;
  letter-spacing: 0;
  line-height: 34px;
  font-weight: bold;
  color: #fff;
}

.main-title h4 {
  margin-bottom: 25px;
  color: #cbe5ff;
}

.form {
  background: #ffffff;
  padding-top: 0px;
  width: 100%;
  border-radius: 0px;
  box-shadow: 0px 12px 50px 7px rgba(0, 0, 0, 0.18);
}

.form .form-title {
  background: #ddf2ff;
  padding: 20px;
  margin-bottom: 50px;
  position: relative;
  height: auto;
}

.form .form-title h2 {
  font-weight: 700;
  color: #0c9aa7;
  padding: 10px 10px 30px 10px;
  line-height: 30px;
}

.form .form-title .title-free {
  background: #0c9aa7;
  color: #ffffff;
  font-family: 'Exo', sans-serif;
  width: 240px;
  text-align: center;
  margin: 0px auto 0px auto;
  font-size: 24px;
  line-height: 24px;
  padding: 16px 10px 14px 10px;
  text-transform: uppercase;
  font-weight: 700;
  left: 0px;
  right: 0px;
  bottom: -28px;
  position: absolute;
}

.form .lead {
  margin-top: 20px;
}

.form .lead .form-group {
  width: 100%;
  margin-bottom: 12px;
  position: relative;
  -ms-input-placeholder-color: rgba(12, 154, 167, 0.6);
  -moz-placeholder-color: rgba(12, 154, 167, 0.6);
}

.form .lead .form-group .fas {
  text-align: center;
  position: absolute;
  left: 32px;
  font-size: 21px;
  padding: 23px 0px 0px 0px;
  color: #0c9aa7;
}

.form .lead .form-group:last-child {
  margin-left: 0;
}

.form .lead .form-group input, .form .lead .form-group select {
  padding: 20px 20px 20px 50px;
  height: auto;
  background: #fff;
  border: 2px solid rgba(208, 208, 208, 0.49);
  border-radius: 0px;
  width: 95%;
  font-family: 'Exo', sans-serif;
  font-weight: 600;
  font-size: 18px;
  color: rgba(12, 154, 167, 0.6);
  box-shadow: none;
}

.form .lead .form-group ::-webkit-input-placeholder {
  color: rgba(12, 154, 167, 0.6);
}

.form .lead .form-group ::-moz-placeholder {
  color: rgba(12, 154, 167, 0.6);
}

.form .lead .form-group select {
  padding-left: 20px;
  -webkit-appearance: none;
          appearance: none;
}

.form .lead .form-group .caret {
  position: absolute;
  right: 30px;
  font-size: 32px;
  top: 30px;
  color: #0c9aa7;
}

.form .lead .form-extra {
  margin: 20px auto 20px auto;
  color: #0c9aa7;
  display: block;
  font-size: 14px;
  line-height: 16px;
  width: 90%;
}

.form .lead .checkbox label {
  font-size: 16px;
  font-family: 'Exo', sans-serif;
  color: #0c9aa7;
}

.form .lead .checkbox label a {
  font-family: 'Exo', sans-serif;
  color: #0c9aa7;
  text-decoration: underline;
}

.form .lead .checkbox label input {
  margin-right: 5px;
}

.form .lead .action {
  margin-top: 30px;
}

.form .lead .action .btn {
  background: #4EC623;
  border-radius: 0px;
  padding: 20px 0px;
  border: none;
  color: white;
  text-transform: uppercase;
  font-size: 22px;
  font-family: 'Exo', sans-serif;
  margin-bottom: 10px;
  width: 95%;
  font-weight: 900;
}

.form .lead .action .btn:hover {
  background: #3e9e1c;
}

#form-check {
  padding: 0px 20px 20px 20px;
}

.logos .form-extra {
  padding-top: 50px;
  padding-bottom: 50px;
  color: #0c9aa7;
  display: block;
  font-size: 22px;
  line-height: 26px;
  text-align: center;
}

.logos .col-xs-12 {
  text-align: center;
}

.art {
  padding: 50px 0px 0px 0px;
}

.art .row {
  margin: 0px;
}

.art img {
  width: 100%;
  margin: 15px 0px;
  box-shadow: 0px 12px 50px 7px rgba(0, 0, 0, 0.18);
}

.ferror {
  font-size: 14px;
  color: #9f1717;
  display: block;
  border-radius: 40px;
  margin-top: 10px;
  padding: 0px 20px 0px 20px;
}

.ierror {
  border-color: #ffbfbf !important;
}

.tips {
  max-width: 985px;
}

.tips h2 {
  margin-top: 160px;
}

.tips .tip-box {
  background: #F2F5FB;
  margin-top: 0px;
  padding-top: 20px;
  padding-bottom: 30px;
  margin-bottom: 80px;
  text-align: center;
}

.tips .tip-box i {
  color: #ffffff;
  margin: 30px 0px 10px 0px;
  font-size: 36px;
  background: red;
  width: 60px;
  height: 60px;
  line-height: 60px;
  border-radius: 100%;
  text-align: center;
  background: #0D79BF;
}

.tips .tip-box h4 {
  font-size: 20px;
  color: #0D79BF;
  font-weight: 600;
  padding: 0px 50px;
  margin-bottom: 10px;
}

.tips .tip-box span {
  width: 80%;
  margin: auto;
  display: block;
  font-size: 16px;
  line-height: 18px;
  color: #0b4367;
}

.tips-2 .tip-box {
  background: #F2F5FB;
  padding: 30px;
  margin-bottom: 80px;
  box-shadow: 0 2px 30px 0 rgba(0, 0, 0, 0.12);
  text-align: left;
  max-width: 985px;
  margin: auto;
}

.tips-2 .tip-box h4 {
  color: #0D79BF;
  font-size: 32px;
  padding-bottom: 20px;
  font-weight: 600;
}

.tips-2 .tip-box span {
  display: block;
  color: #0b4367;
  padding-bottom: 20px;
}

.layout {
  position: fixed;
  bottom: 0px;
  background-color: rgba(198, 198, 198, 0.8);
  width: 100%;
  color: black;
  padding: 20px;
}

.layout #cookies {
  max-width: 960px;
  margin: 0px auto;
}

.layout #cookies .sst_close {
  background-color: #40ab40;
  color: white;
  font-family: Arial;
  padding-bottom: 5px;
  padding-top: 5px;
  padding-left: 20px;
  padding-right: 20px;
  float: right;
  margin-top: 15px;
  border-radius: 5px;
}

i.form-control-feedback {
  display: none !important;
}

.grecaptcha-badge {
  visibility: hidden;
}

.textx {
  margin: 0px auto 0px auto;
  font-size: 16px;
  line-height: 26px;
  background: white;
  background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #ededed 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ffffff",endColorstr="#ededed",GradientType=1);
  padding: 100px 0px 0px 0px;
}

.textx:after {
  display: block;
  content: '';
  width: 100%;
  margin-top: 100px;
  height: 116px;
  background-image: url("../img/textx_deco.png");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center center;
}

.textx .row {
  max-width: 1385px;
  margin: auto;
}

.textx .fas {
  font-size: 42px;
  background: #0C9AA7;
  color: #fff;
  width: 100px;
  height: 100px;
  line-height: 100px;
  margin-bottom: 20px;
  box-shadow: 0px 12px 50px 7px rgba(0, 0, 0, 0.08);
}

.textx h3 {
  color: #0C9AA7;
  padding-bottom: 20px;
}

.textx div {
  text-align: center;
}

.textx div p {
  font-size: 16px;
  line-height: 20px;
}

.textx div p a {
  font-size: 16px;
  color: #0D79BF;
}

.bak {
  padding: 50px 0px 100px 0px;
  background: #0C9AA7;
}

.bak .row {
  margin: 0px;
}

.bak .logo {
  max-width: 171px;
}

.bak .legacy-pages a {
  color: #fff;
}

.content-end {
  position: relative;
  height: 400px;
  max-width: 990px;
  margin: 0px auto 200px auto;
}

.content-end .photo-wrapper {
  position: absolute;
  right: 0px;
  top: 40px;
}

.content-end .content-wrapper {
  max-width: 600px;
  padding: 50px;
  background-color: rgba(13, 121, 191, 0.9);
  position: absolute;
}

.content-end .content-wrapper:after {
  width: 50px;
  height: 50px;
  background-image: url(../img/d.svg);
  content: "";
  display: block;
  position: absolute;
  left: 15px;
  top: 15px;
}

.content-end .content-wrapper:before {
  width: 50px;
  height: 50px;
  background-image: url(../img/i.svg);
  content: "";
  display: block;
  position: absolute;
  right: 15px;
  bottom: 15px;
}

.content-end .content-wrapper h3, .content-end .content-wrapper .text, .content-end .content-wrapper p {
  color: #fff;
  font-size: 16px;
  line-height: 24px;
}

.content-end .content-wrapper h3 {
  font-size: 32px;
  line-height: 36px;
  font-weight: 600;
  margin-bottom: 30px;
}

.legacy-pages {
  padding-top: 40px;
}

.legacy-pages a {
  padding: 10px;
  text-decoration: underline;
}

.thx {
  min-height: 700px;
  text-align: center;
}

.thx .container-fluid h1 {
  padding: 150px 0px 0px 0px;
  text-align: center;
}

.thx .tips {
  margin: auto;
}

.thx span {
  font-size: 22px;
  color: #fff;
}

.thx:after {
  display: none;
}

@media (max-width: 992px) {
  .hero {
    background-position: -100px bottom;
  }
  .hero .container-fluid h1 {
    padding: 30px 0px 0px 0px;
  }
  .hero .container-fluid ul li {
    padding-bottom: 40px;
  }
  .form {
    margin-top: 30px;
  }
  .form .form-control {
    margin: auto;
  }
  .textx .col-xs-3 {
    width: 50%;
    margin-bottom: 50px;
    padding: 20px;
  }
}

@media (max-width: 767px) {
  .hero {
    background: #6b6b6b url("../img/bg-hero_mb.jpg");
    background-repeat: no-repeat;
    background-position: top center;
    background-size: contain;
  }
  .logos {
    padding-top: 50px;
  }
}

@media (max-width: 458px) {
  .hero .container-fluid {
    padding: 0px 20px;
  }
  .hero .container-fluid h1 {
    font-size: 26px;
  }
  .hero .container-fluid ul li {
    padding-bottom: 20px;
  }
  .hero .container-fluid ul li, .hero .container-fluid ul strong {
    font-size: 16px;
  }
  .textx .col-xs-3 h3 {
    font-size: 16px;
  }
  .textx .col-xs-3 div p {
    font-size: 14px;
  }
}
